Skip to content

Commit

Permalink
Upgrade EUI to v70.2.4 (#144845)
Browse files Browse the repository at this point in the history
## Summary
`eui@67.1.8` ⏩ `eui@70.2.2`

⚠️ Note: This upgrade contains breaking changes to `EuiFlexGroup` and
`EuiFlexGrid`, primarily around switching margins and negative margins
to `gap`. Please do a quick QA pass of your app to scan for any issues.
We're happy to help resolve minor fixes, or potentially follow up after
PR merges. You can find us over in #eui!

## [`70.2.4`](https://github.com/elastic/eui/tree/v70.2.4)

**Bug fixes**

- Fixed visual bug in nested `EuiFlexGroup`s, where the parent
`EuiFlexGroup` is responsive but a child `EuiFlexGroup` is not
([#6381](elastic/eui#6381))

## [`70.2.3`](https://github.com/elastic/eui/tree/v70.2.3)

**Bug fixes**

- Fixed incorrect margins in `EuiSuperDatePicker` caused by `EuiFlex`
CSS gap change ([#6380](elastic/eui#6380))

## [`70.2.2`](https://github.com/elastic/eui/tree/v70.2.2)

- `EuiButton` now accepts `minWidth={false}`
([#6373](elastic/eui#6373))

**Bug fixes**

- `EuiButton` no longer outputs unnecessary inline styles for
`minWidth={0}` or `minWidth={false}`
([#6373](elastic/eui#6373))
- `EuiFacetButton` no longer reports type issues when passing props
accepted by `EuiButton`
([#6373](elastic/eui#6373))
- Fixed the shadow sizes of `.eui-yScrollWithShadows` and
`.eui-xScrollWithShadows`
([#6374](elastic/eui#6374))


## [`70.2.1`](https://github.com/elastic/eui/tree/v70.2.1)

**Bug fixes**

- Re-fixed `EuiPageSection` not correctly merging `contentProps.css`
([#6365](elastic/eui#6365))
- Fixed `EuiTab` not defaulting to size `m`
([#6366](elastic/eui#6366))

## [`70.2.0`](https://github.com/elastic/eui/tree/v70.2.0)

- Added a keyboard shortcuts popover to `EuiDataGrid`'s toolbar. This
can be visually hidden via `toolbarVisibility.showKeyboardShortcuts`,
but will always remain accessible to keyboard and screen reader users.
([#6036](elastic/eui#6036))
- `EuiScreenReaderOnly`'s `showOnFocus` prop now also shows on focus
within its children ([#6036](elastic/eui#6036))
- Added `onFocus` prop callback to `EuiSuperDatePicker`
([#6320](elastic/eui#6320))

**Bug fixes**

- Fixed `EuiSelectable` to ensure the full options list is re-displayed
when the search bar is controlled and cleared using `searchProps.value`
([#6317](elastic/eui#6317))
- Fixed incorrect padding on `xl`-sized `EuiTabs`
([#6336](elastic/eui#6336))
- Fixed `EuiCard` not correctly merging `css` on its child `icon`s
([#6341](elastic/eui#6341))
- Fixed `EuiCheckableCard` not setting `css` on the correct DOM node
([#6341](elastic/eui#6341))
- Fixed a webkit rendering issue with `EuiModal`s containing
`EuiBasicTable`s tall enough to scroll
([#6343](elastic/eui#6343))
- Fixed bug in `to_initials` that truncates custom initials
([#6346](elastic/eui#6346))
- Fix bug in `EuiCard` where layout breaks when `horizontal` and
`selectable` are both passed
([#6348](elastic/eui#6348))

## [`70.1.0`](https://github.com/elastic/eui/tree/v70.1.0)

- Added the `hint` prop to the `<EuiSearchBar />`. This prop lets the
consumer render a hint below the search bar that will be displayed on
focus. ([#6319](elastic/eui#6319))
- Added the `hasDragDrop` prop to `EuiPopover`. Use this prop if your
popover contains `EuiDragDropContext`.
([#6329](elastic/eui#6329))

**Bug fixes**

- Fixed `EuiButton`'s cursor style when the button is disabled
([#6323](elastic/eui#6323))
- Fixed `EuiPageTemplate` not recognizing child
`EuiPageSidebar`s/`EuiPageTemplate.Sidebar`s with `css` props
([#6324](elastic/eui#6324))
- Fixed `EuiBetaBadge` to always respect its `anchorProps` values,
including when there is no tooltip content
([#6326](elastic/eui#6326))
- Temporarily patched `EuiModal` to not cause scroll-jumping issues on
modal open ([#6327](elastic/eui#6327))
- Fixed buggy drag & drop behavior within `EuiDataGrid`'s columns &
sorting toolbar popovers
([#6329](elastic/eui#6329))
- Fixed `EuiButton` not correctly passing `textProps` for children
inside fragments or i18n components
([#6332](elastic/eui#6332))
- Fixed `EuiButton` not correctly respecting `minWidth={0}`
([#6332](elastic/eui#6332))

**CSS-in-JS conversions**

- Converted `EuiTabs` to Emotion
([#6311](elastic/eui#6311))

## [`70.0.0`](https://github.com/elastic/eui/tree/v70.0.0)

- Added the `enabled` option to the `<EuiInMemoryTable />`
`executeQueryOptions` prop. This option prevents the Query from being
executed when controlled by the consumer.
([#6284](elastic/eui#6284))

**Bug fixes**

- Fixed `EuiOverlayMask` to set a
`[data-relative-to-header=above|below]` attribute to replace the
`--aboveHeader` and `--belowHeader` classNames removed in its Emotion
conversion ([#6289](elastic/eui#6289))
- Fixed `EuiHeader` CSS using removed `EuiOverlayMask` class modifiers
([#6293](elastic/eui#6293))
- Fixed `EuiToolTip` not respecting reduced motion preferences
([#6295](elastic/eui#6295))
- Fixed a bug with `EuiTour` where passing any `panelProps` would cause
the beacon to disappear
([#6298](elastic/eui#6298))

**Breaking changes**

- `@emotion/css` is now a required peer dependency, alongside
`@emotion/react` ([#6288](elastic/eui#6288))
- `@emotion/cache` is no longer required peer dependency, although your
project must still use it if setting custom cache/injection locations
([#6288](elastic/eui#6288))

**CSS-in-JS conversions**

- Converted `EuiCode` and `EuiCodeBlock` to Emotion; Removed
`euiCodeSyntaxTokens` Sass mixin and `$euiCodeBlockPaddingModifiers`;
([#6263](elastic/eui#6263))
- Converted `EuiResizableContainer` and `EuiResizablePanel` to Emotion
([#6287](elastic/eui#6287))

## [`69.0.0`](https://github.com/elastic/eui/tree/v69.0.0)

- Added support for `fullWidth` prop on EuiForm, which will be the
default for all rows/controls within
([#6229](elastic/eui#6229))
- Added support for `onResizeStart` and `onResizeEnd` callbacks to
`EuiResizableContainer`
([#6236](elastic/eui#6236))
- Added optional case sensitive option matching to `EuiComboBox` with
the `isCaseSensitive` prop
([#6268](elastic/eui#6268))
- `EuiFlexItem` now supports `grow={0}`
([#6270](elastic/eui#6270))
- Added the `alignItems` prop to `EuiFlexGrid`
([#6281](elastic/eui#6281))
- Added `filter`, `filterExclude`, `filterIgnore`, `filterInclude`,
`indexTemporary`, `infinity`, `sortAscending`, and `sortDescending`
glyphs to `EuiIcon` ([#6282](elastic/eui#6282))

**Bug fixes**

- Fixed `EuiTextProps` to show the `color` type option `inherit` as
default ([#6267](elastic/eui#6267))
- `EuiFlexGroup` now correctly respects `gutterSize` when responsive
([#6270](elastic/eui#6270))
- Fixed the last breadcrumb in `EuiBreadcrumbs`'s `breadcrumbs` array
not respecting `truncate` overrides
([#6280](elastic/eui#6280))

**Breaking changes**

- `EuiFlexGrid` no longer supports `columns={0}`. Use `EuiFlexGroup`
instead for normal flex display
([#6270](elastic/eui#6270))
- `EuiFlexGrid` now uses modern `display: grid` CSS
([#6270](elastic/eui#6270))
- `EuiFlexGroup`, `EuiFlexGrid`, and `EuiFlexItem` now use modern `gap`
CSS instead of margins and negative margins
([#6270](elastic/eui#6270))
- `EuiFlexGroup` no longer applies responsive styles to `column` or
`columnReverse` directions
([#6270](elastic/eui#6270))

**CSS-in-JS conversions**

- Converted `EuiFlexGroup`, `EuiFlexGrid`, and `EuiFlexItem` to Emotion
([#6270](elastic/eui#6270))

## [`68.0.0`](https://github.com/elastic/eui/tree/v68.0.0)

- Added `beta` glyph to `EuiIcon`
([#6250](elastic/eui#6250))
- Added `launch` and `spaces` glyphs to `EuiIcon`
([#6260](elastic/eui#6260))
- Added the `fallbackDestination` prop to `EuiSkipLink`, which accepts a
string of query selectors to fall back to if the `destinationId` does
not have a valid target. Defaults to `main`
([#6261](elastic/eui#6261))
- `EuiSkipLink` is now always an `a` tag to ensure that it is always
placed within screen reader link menus.
([#6261](elastic/eui#6261))

**Bug fixes**

- Fixed `EuiSuperDatePicker` not correctly merging passed `className`s
([#6253](elastic/eui#6253))
- Fixed `EuiColorStops` not correctly merging in passed
`data-test-subj`s, `style`s, or `...rest`
([#6255](elastic/eui#6255))
- Fixed `EuiResizablePanel` incorrectly passing `style` to the wrapper
instead of the panel. Use `wrapperProps.style` to pass styles to the
wrapper. ([#6255](elastic/eui#6255))
- Fixed custom `onClick`s passed to `EuiSkipLink` overriding
`overrideLinkBehavior`
([#6261](elastic/eui#6261))

**Breaking changes**

- Removed `inherit` and `ghost` color from `EuiListGroupItem`
([#6207](elastic/eui#6207))
- Changed default color to `text` instead of `inherit`
([#6207](elastic/eui#6207))

**CSS-in-JS conversions**

- Converted `EuiListGroup` and `EuiListGroupItem` to Emotion; Removed
`$euiListGroupGutterTypes`, `$euiListGroupItemColorTypes` and
`$euiListGroupItemSizeTypes`;
([#6207](elastic/eui#6207))
- Converted `EuiBadgeGroup` to Emotion
([#6258](elastic/eui#6258))
- Converted `EuiBetaBadge` to Emotion
([#6258](elastic/eui#6258))
- Converted `EuiNotificationBadge` to Emotion
([#6258](elastic/eui#6258))

Co-authored-by: Elizabet Oliveira <elizabet.oliveira@elastic.co>
Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
  • Loading branch information
3 people committed Nov 18, 2022
1 parent 0db3ab0 commit c408ceb
Show file tree
Hide file tree
Showing 222 changed files with 6,285 additions and 12,879 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,7 @@
"@elastic/datemath": "5.0.3",
"@elastic/elasticsearch": "npm:@elastic/elasticsearch-canary@8.4.0-canary.1",
"@elastic/ems-client": "8.3.3",
"@elastic/eui": "67.1.8",
"@elastic/eui": "70.2.4",
"@elastic/filesaver": "1.1.2",
"@elastic/node-crypto": "1.2.1",
"@elastic/numeral": "^2.5.1",
Expand Down

Large diffs are not rendered by default.

Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@

import './collapsible_nav.scss';
import {
EuiThemeProvider,
EuiCollapsibleNav,
EuiCollapsibleNavGroup,
EuiFlexItem,
Expand All @@ -19,7 +20,7 @@ import {
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { groupBy, sortBy } from 'lodash';
import React, { Fragment, useMemo } from 'react';
import React, { useMemo } from 'react';
import useObservable from 'react-use/lib/useObservable';
import * as Rx from 'rxjs';
import type { HttpStart } from '@kbn/core-http-browser';
Expand Down Expand Up @@ -162,35 +163,35 @@ export function CollapsibleNav({
size={248}
>
{customNavLink && (
<Fragment>
<>
<EuiFlexItem grow={false} style={{ flexShrink: 0 }}>
<EuiCollapsibleNavGroup
background="dark"
className="eui-yScroll"
style={{ maxHeight: '40vh' }}
>
<EuiListGroup
listItems={[
createEuiListItem({
link: customNavLink,
basePath,
navigateToUrl,
dataTestSubj: 'collapsibleNavCustomNavLink',
onClick: closeNav,
externalLink: true,
iconProps: { color: 'ghost' },
}),
]}
maxWidth="none"
gutterSize="none"
size="s"
color="ghost"
/>
<EuiThemeProvider colorMode="dark">
<EuiListGroup
listItems={[
createEuiListItem({
link: customNavLink,
basePath,
navigateToUrl,
dataTestSubj: 'collapsibleNavCustomNavLink',
onClick: closeNav,
externalLink: true,
}),
]}
maxWidth="none"
gutterSize="none"
size="s"
/>
</EuiThemeProvider>
</EuiCollapsibleNavGroup>
</EuiFlexItem>

<EuiHorizontalRule margin="none" />
</Fragment>
</>
)}

{/* Pinned items */}
Expand Down

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

144 changes: 135 additions & 9 deletions packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -125,18 +125,24 @@ export const getEuiContextMapping = (): EuiTokensObject => {
defaultMessage: 'Unavailable',
description: 'Displayed button text when a card option is unavailable.',
}),
'euiCodeBlock.copyButton': i18n.translate('core.euiCodeBlock.copyButton', {
'euiCodeBlockCopy.copy': i18n.translate('core.euiCodeBlockCopy.copy', {
defaultMessage: 'Copy',
description: 'ARIA label for a button that copies source code text to the clipboard',
}),
'euiCodeBlock.fullscreenCollapse': i18n.translate('core.euiCodeBlock.fullscreenCollapse', {
defaultMessage: 'Collapse',
description: 'ARIA label for a button that exits fullscreen view',
}),
'euiCodeBlock.fullscreenExpand': i18n.translate('core.euiCodeBlock.fullscreenExpand', {
defaultMessage: 'Expand',
description: 'ARIA label for a button that enters fullscreen view',
}),
'euiCodeBlockFullScreen.fullscreenCollapse': i18n.translate(
'core.euiCodeBlockFullScreen.fullscreenCollapse',
{
defaultMessage: 'Collapse',
description: 'ARIA label for a button that exits fullscreen view',
}
),
'euiCodeBlockFullScreen.fullscreenExpand': i18n.translate(
'core.euiCodeBlockFullScreen.fullscreenExpand',
{
defaultMessage: 'Expand',
description: 'ARIA label for a button that enters fullscreen view',
}
),
'euiCollapsedItemActions.allActions': i18n.translate(
'core.euiCollapsedItemActions.allActions',
{
Expand Down Expand Up @@ -385,6 +391,126 @@ export const getEuiContextMapping = (): EuiTokensObject => {
'There is a new region landmark called {landmarkHeading} with page level controls at the end of the document.',
values: { landmarkHeading },
}),
'euiKeyboardShortcuts.title': i18n.translate('core.euiKeyboardShortcuts.title', {
defaultMessage: 'Keyboard shortcuts',
}),
'euiKeyboardShortcuts.upArrowTitle': i18n.translate('core.euiKeyboardShortcuts.upArrowTitle', {
defaultMessage: 'Up arrow',
}),
'euiKeyboardShortcuts.upArrowDescription': i18n.translate(
'core.euiKeyboardShortcuts.upArrowDescription',
{
defaultMessage: 'Move one cell up',
}
),
'euiKeyboardShortcuts.downArrowTitle': i18n.translate(
'core.euiKeyboardShortcuts.downArrowTitle',
{
defaultMessage: 'Down arrow',
}
),
'euiKeyboardShortcuts.downArrowDescription': i18n.translate(
'core.euiKeyboardShortcuts.downArrowDescription',
{
defaultMessage: 'Move one cell down',
}
),
'euiKeyboardShortcuts.rightArrowTitle': i18n.translate(
'core.euiKeyboardShortcuts.rightArrowTitle',
{
defaultMessage: 'Right arrow',
}
),
'euiKeyboardShortcuts.rightArrowDescription': i18n.translate(
'core.euiKeyboardShortcuts.rightArrowDescription',
{
defaultMessage: 'Move one cell right',
}
),
'euiKeyboardShortcuts.leftArrowTitle': i18n.translate(
'core.euiKeyboardShortcuts.leftArrowTitle',
{
defaultMessage: 'Left arrow',
}
),
'euiKeyboardShortcuts.leftArrowDescription': i18n.translate(
'core.euiKeyboardShortcuts.leftArrowDescription',
{
defaultMessage: 'Move one cell left',
}
),
'euiKeyboardShortcuts.homeTitle': i18n.translate('core.euiKeyboardShortcuts.homeTitle', {
defaultMessage: 'Home',
}),
'euiKeyboardShortcuts.homeDescription': i18n.translate(
'core.euiKeyboardShortcuts.homeDescription',
{
defaultMessage: 'Move to the first cell of the current row',
}
),
'euiKeyboardShortcuts.endTitle': i18n.translate('core.euiKeyboardShortcuts.endTitle', {
defaultMessage: 'End',
}),
'euiKeyboardShortcuts.endDescription': i18n.translate(
'core.euiKeyboardShortcuts.endDescription',
{
defaultMessage: 'Move to the last cell of the current row',
}
),
'euiKeyboardShortcuts.ctrl': i18n.translate('core.euiKeyboardShortcuts.ctrl', {
defaultMessage: 'Ctrl',
}),
'euiKeyboardShortcuts.ctrlHomeDescription': i18n.translate(
'core.euiKeyboardShortcuts.ctrlHomeDescription',
{
defaultMessage: 'Move to the first cell of the current page',
}
),
'euiKeyboardShortcuts.ctrlEndDescription': i18n.translate(
'core.euiKeyboardShortcuts.ctrlEndDescription',
{
defaultMessage: 'Move to the last cell of the current page',
}
),
'euiKeyboardShortcuts.pageUpTitle': i18n.translate('core.euiKeyboardShortcuts.pageUpTitle', {
defaultMessage: 'Page Up',
}),
'euiKeyboardShortcuts.pageUpDescription': i18n.translate(
'core.euiKeyboardShortcuts.pageUpDescription',
{
defaultMessage: 'Go to the last row of the previous page',
}
),
'euiKeyboardShortcuts.pageDownTitle': i18n.translate(
'core.euiKeyboardShortcuts.pageDownTitle',
{
defaultMessage: 'Page Down',
}
),
'euiKeyboardShortcuts.pageDownDescription': i18n.translate(
'core.euiKeyboardShortcuts.pageDownDescription',
{
defaultMessage: 'Go to the first row of the next page',
}
),
'euiKeyboardShortcuts.enterTitle': i18n.translate('core.euiKeyboardShortcuts.enterTitle', {
defaultMessage: 'Enter',
}),
'euiKeyboardShortcuts.enterDescription': i18n.translate(
'core.euiKeyboardShortcuts.enterDescription',
{
defaultMessage: 'Open cell details and actions',
}
),
'euiKeyboardShortcuts.escapeTitle': i18n.translate('core.euiKeyboardShortcuts.escapeTitle', {
defaultMessage: 'Escape',
}),
'euiKeyboardShortcuts.escapeDescription': i18n.translate(
'core.euiKeyboardShortcuts.escapeDescription',
{
defaultMessage: 'Close cell details and actions',
}
),
'euiDataGrid.screenReaderNotice': i18n.translate('core.euiDataGrid.screenReaderNotice', {
defaultMessage: 'Cell contains interactive content.',
}),
Expand Down

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading

0 comments on commit c408ceb

Please sign in to comment.