v98.1.0

• Updated EuiBetaBadge with a new warning color variant (#8177)

Accessibility

• Ensures autoFocus on EuiSelectableList triggers initial focus (#8091)
• Improved the accessibility of EuiSearchBarFilters by: (#8091)
  • adding a more descriptive aria-label to selection filter buttons
  • ensuring the selection listbox is initially focused when opening a selection popover
• Improved the accessibility experience of tabs (EuiTab, EuiTabs): tab group is a tab stop and tabs can be traversed with arrow keys. (#8116)
• Updated EuiCodeBlock with a new copyAriaLabel prop, which allows setting a custom screen reader label on the copy button. (#8176)

CSS-in-JS conversions

• Removed the following global Sass variables: (#8169)
  • $euiButtonMinWidth
  • $euiDatePickerCalendarWidth
• Removed the following Sass animations: (#8169)
  • euiAnimFadeIn
  • euiGrow
  • focusRingAnimate
  • focusRingAnimateLarge
  • euiButtonActive
• Removed the following Sass mixins: (#8169)
  • euiFullHeight
  • euiSlightShadowHover
  • datePickerArrow

v98.0.0

Bug fixes

• Fixed an EuiDataGrid bug where column actions where not clickable when EuiDataGrid with columnVisibility.canDragAndDropColumns was used inside a modal (#8135)

Breaking changes

• Removed EuiFormRow's deprecated columnCompressedSwitch display prop. Use columnCompressed instead (#8113)

v97.3.1

Bug fixes

• Fixed an EuiComboBox bug where Enter keypresses were not working correctly on selection clear buttons (#8105)
• Fixed an EuiSuperDatePicker bug where inputs would overflow out of smaller widths instead of truncating (#8109)
• Fixed a bug with EuiPageHeader's rightSideItems responsiveness where single items could overflow past the intended max width (#8110)

v97.3.0

• EuiDataGrid now supports a new toolbarVisibility.showDisplaySelector.customRender function that allows completely customizing the rendering of the display selector popover (#8080)
• EuiDataGrid's row height/lines per row setting has been streamlined in both UI and UX (#8080)
• EuiDataGrid now accepts consumer-passed display setting updates even after users have changed their display preferences via UI (#8080)
• Updated EuiDataGrid to vertically center all toolbarVisibility.additionalControls nodes (#8085)
• Updated EuiDataGrid with a beta rowHeightsOptions.autoBelowLineCount feature flag (#8096)
• Updated EuiContextMenuPanel to allow disabling initial focus via initialFocusedItemIndex={-1} (#8101)

Bug fixes

• Fixed EuiComment's typing to correctly reflect all accepted props (#8089)
• Fixed EuiSelectableTemplateSitewides within dark-themed EuiHeaders missing input borders (#8100)

v97.2.0

• Updated EuiHeaderLinks with a new xxs gutter size (#8079)

Bug fixes

• Reverted an EuiDataGrid regression from #8015 which prevented overriding column widths via columns's initialWidths (#8086)

v97.1.0

• Added columnVisibility.canDragAndDropColumns on EuiDataGrid which enables reordering columns via draggable header cells (#8015)
• Updated EuiHeaders in dark mode to have a visible border-bottom color (#8070)
• Added props minDate and maxDate on EuiSuperDatePicker to support restricting date range selections (#8071)

v97.0.0

Breaking changes

• EuiDataGrid's custom grid body (rendered via renderCustomGridBody) no longer automatically renders the column header row or footer rows. It instead now passes the headerRow and footerRow React elements, which require manual rendering. (#8028)
  • This change was made to allow consumers to sync header/footer rows with their own custom virtualization libraries.
  • To facilitate this, a gridWidth prop is now also passed to custom grid body renderers.

Bug fixes

• Fixed inputs not taking the whole width when passing fullWidth as true to EuiDatePickerRange component (#8061)

Accessibility

• Improved accessibility of EuiExternalLinkIcon by clarifying text for Screen Reader users. (#8065)

v96.1.0

CSS-in-JS conversions

• Removed the following component-specific Sass mixins: (#8055)
  • euiButton
  • euiButtonBase
  • euiButtonFocus
  • euiButtonContent
  • euiButtonContentDisabled
  • euiButtonDefaultStyle
  • euiButtonFillStyle
  • euiPanel
  • euiFormControlDefaultShadow
  • euiToolTipTitle

v96.0.0

• Improved EuiPageHeader/EuiPageTemplate.Header's responsive UX: (#8044)
  • rightSideItems are no longer pushed to the side by wide tabs content
  • rightSideItems now wrap more responsively at smaller container widths
• Updated EuiDraggable with a new usePortal prop. (#8048)
  • This prop portals the dragged element to the body, allowing it to escape stacking contexts which prevents buggy drag positioning in e.g. popovers, modals, and flyouts.

Bug fixes

• Fixed EuiProvider's system color mode detection causing errors during server-side rendering (#8040)
• Fixed an EuiDataGrid rendering bug that was causing bouncing scrollbar issues (#8041)
• Fixed EuiSearchBox skips input when running with React 18 in Legacy Mode (#8047)

Deprecations

• Deprecated EuiPopover's hasDragDrop prop. Use EuiDraggable's new usePortal prop instead. (#8048)

Breaking changes

• Removed the following exported .css files: (#8045)
  • @elastic/eui/dist/eui_theme_light.css
  • @elastic/eui/dist/eui_theme_light.min.css
  • @elastic/eui/dist/eui_theme_dark.css
  • @elastic/eui/dist/eui_theme_dark.min.css
• All EUI components are now on CSS-in-JS. A CSS file/import in consuming applications is no longer needed, and is safe to remove. (#8045)
• Removed all src/theme/legacy Sass exports (#8054)

CSS-in-JS conversions

• Removed the following component-specific Sass variables: (#8031)
  • $euiButtonColorDisabled
  • $euiButtonColorDisabledText
  • $euiButtonColorGhostDisabled
  • $euiButtonFontWeight
  • $euiFormControlIconSizes
  • $euiFormControlLayoutGroupInputHeight
  • $euiFormControlLayoutGroupInputCompressedHeight
  • $euiFormControlLayoutGroupInputCompressedBorderRadius
  • $euiPageSidebarMinWidth
  • $euiPageDefaultMaxWidth
  • $euiPanelPaddingModifiers
  • $euiPanelBorderRadiusModifiers
  • $euiPanelBackgroundColorModifiers
  • $euiRangeTrackColor
  • $euiRangeHighlightColor
  • $euiRangeThumbHeight
  • $euiRangeThumbWidth
  • $euiRangeThumbBorderColor
  • $euiRangeThumbBackgroundColor
  • $euiRangeTrackWidth
  • $euiRangeTrackHeight
  • $euiRangeTrackCompressedHeight
  • $euiRangeTrackBorderWidth
  • $euiRangeTrackBorderColor
  • $euiRangeTrackRadius
  • $euiRangeDisabledOpacity
  • $euiRangeHighlightHeight
  • $euiRangeHighlightCompressedHeight
  • $euiRangeHeight
  • $euiRangeCompressedHeight
  • $euiTooltipAnimations
  • $euiTooltipBackgroundColor
  • $euiTooltipBorderColor
• Removed the following Sass mixins due to low external usage: (#8031)
  • euiHoverState
  • euiFocusState
  • euiDisabledState
  • euiInteractiveStates
  • euiFormControlStyle
  • euiFormControlStyleCompressed
  • euiFormControlFocusStyle
  • euiFormControlInvalidStyle
  • euiFormControlDisabledTextStyle
  • euiFormControlDisabledStyle
  • euiFormControlReadOnlyStyle
  • euiFormControlText
  • euiFormControlSize
  • euiFormControlGradient
  • euiFormControlLayoutPadding
  • euiFormControlWithIcon
  • euiFormControlIsLoading
  • euiFormControlSideBorderRadius
  • euiPlaceholderPerBrowser
  • euiHiddenSelectableInput
  • euiLink
  • euiLoadingSpinnerBorderColors
  • euiRangeTrackSize
  • euiRangeTrackPerBrowser
  • euiRangeThumbBorder
  • euiRangeThumbBoxShadow
  • euiRangeThumbFocusBoxShadow
  • euiRangeThumbStyle
  • euiRangeThumbPerBrowser
  • euiRangeThumbFocus
  • euiToolTipAnimation

v95.12.0

• Enhanced EuiDataGrid and EuiBasic/InMemoryTable to clean content newlines/tabs when users copy and paste from their tabular data (#8019)
• Updated EuiResizableButton with a new accountForScrollbars prop (#8021)
• Updated EuiProvider to inherit from the user's OS/system light/dark mode setting if a colorMode prop has not been passed (#8026)

Bug fixes

• Fixed EuiDatePicker's onClear button to not appear when the input is disabled (#8020)
• Fixed several EuiDataGrid row height bugs: (#8025)
  • Fixed row heights not recalculating when rowHeightOptions.lineHeight, gridStyles.fontSize, or gridStyles.cellPadding changed
  • Fixed incorrect height calculations for rowHeightOptions.rowHeights with lineCounts
  • Fixed control column content to align better with multi-line row heights, as well as custom line-heights