From a0ebb1d08a18bac8c39d3c945086218bfce61871 Mon Sep 17 00:00:00 2001 From: Lene Gadewoll Date: Thu, 19 Dec 2024 20:57:23 +0100 Subject: [PATCH] Upgrade EUI to v98.2.1 (#204482) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit `v98.1.0-borealis.0`⏩`v98.2.1-borealis.2` _[Questions? Please see our Kibana upgrade FAQ.](https://github.com/elastic/eui/blob/main/wiki/eui-team-processes/upgrading-kibana.md#faq-for-kibana-teams)_ --- # `@elastic/eui` ## [`v98.2.1`](https://github.com/elastic/eui/releases/v98.2.1) - Updated the EUI theme color values to use a full 6 char hex code format ([#8244](https://github.com/elastic/eui/pull/8244)) ## [`v98.2.0`](https://github.com/elastic/eui/releases/v98.2.0) - Added two new icons: `contrast` and `contrastHigh` ([#8216](https://github.com/elastic/eui/pull/8216)) - Updated `EuiDataGrid` content to have a transparent background. ([#8220](https://github.com/elastic/eui/pull/8220)) **Accessibility** - When the tooltips components (`EuiTooltip`, `EuiIconTip`) are used inside components that handle the Escape key (like `EuiFlyout` or `EuiModal`), pressing the Escape key will now only close the tooltip and not the entire wrapping component. ([#8140](https://github.com/elastic/eui/pull/8140)) - Improved the accessibility of `EuiCodeBlock`s by ([#8195](https://github.com/elastic/eui/pull/8195)) - adding screen reader only labels - adding `role="dialog"` on in fullscreen mode - ensuring focus is returned on closing fullscreen mode # Borealis updates - [Visual Refresh] Update color token mappings ([#8211](https://github.com/elastic/eui/pull/8211)) - [Visual Refresh] Introduce shared popover arrow styles to Borealis ([#8212](https://github.com/elastic/eui/pull/8212)) - [Visual Refresh] Add forms.maxWidth token ([#8221](https://github.com/elastic/eui/pull/8221)) - [Visual Refresh] Set darker shade for subdued text ([#8224](https://github.com/elastic/eui/pull/8224)) - [Visual Refresh] Remove support for accentSecondary badges ([#8224](https://github.com/elastic/eui/pull/8227)) - [Visual Refresh] Add severity vis colors ([#8247](https://github.com/elastic/eui/pull/8247)) - [Visual Refresh] Fix transparent color variable definitions ([8249](https://github.com/elastic/eui/pull/8249)) - [Visual Refresh] Update EuiToken colors ([8250](https://github.com/elastic/eui/pull/8250)) --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com> --- package.json | 4 +- .../__snapshots__/i18n_service.test.tsx.snap | 2 + .../src/i18n_eui_mapping.tsx | 8 +++ .../unsaved_changes_badge.test.tsx.snap | 2 +- ...op_nav_unsaved_changes_badge.test.tsx.snap | 2 +- .../src/popover/popover.test.tsx | 2 +- src/dev/license_checker/config.ts | 4 +- .../extend_index_management.test.tsx.snap | 6 +- .../__snapshots__/app.test.tsx.snap | 2 +- .../__snapshots__/settings.test.tsx.snap | 70 ++++++++++++------- .../collection_interval.test.js.snap | 2 +- .../__snapshots__/prompt_page.test.tsx.snap | 4 +- .../unauthenticated_page.test.tsx.snap | 4 +- .../reset_session_page.test.tsx.snap | 4 +- .../public/components/rca/rca_panel/index.tsx | 6 +- .../ml_integerations.test.tsx.snap | 2 +- yarn.lock | 26 +++---- 17 files changed, 92 insertions(+), 58 deletions(-) diff --git a/package.json b/package.json index 937c11ebf3043..29ffd5f72b927 100644 --- a/package.json +++ b/package.json @@ -117,8 +117,8 @@ "@elastic/ecs": "^8.11.1", "@elastic/elasticsearch": "^8.16.0", "@elastic/ems-client": "8.5.3", - "@elastic/eui": "98.1.0-borealis.0", - "@elastic/eui-theme-borealis": "0.0.4", + "@elastic/eui": "98.2.1-borealis.2", + "@elastic/eui-theme-borealis": "0.0.7", "@elastic/filesaver": "1.1.2", "@elastic/node-crypto": "^1.2.3", "@elastic/numeral": "^2.5.1", diff --git a/packages/core/i18n/core-i18n-browser-internal/src/__snapshots__/i18n_service.test.tsx.snap b/packages/core/i18n/core-i18n-browser-internal/src/__snapshots__/i18n_service.test.tsx.snap index 52a55d3113173..373c07ecf976c 100644 --- a/packages/core/i18n/core-i18n-browser-internal/src/__snapshots__/i18n_service.test.tsx.snap +++ b/packages/core/i18n/core-i18n-browser-internal/src/__snapshots__/i18n_service.test.tsx.snap @@ -31,8 +31,10 @@ exports[`#start() returns \`Context\` component 1`] = ` "euiCardSelect.select": "Select", "euiCardSelect.selected": "Selected", "euiCardSelect.unavailable": "Unavailable", + "euiCodeBlock.label": [Function], "euiCodeBlockAnnotations.ariaLabel": [Function], "euiCodeBlockCopy.copy": "Copy", + "euiCodeBlockFullScreen.ariaLabel": "Expanded code block", "euiCodeBlockFullScreen.fullscreenCollapse": "Collapse", "euiCodeBlockFullScreen.fullscreenExpand": "Expand", "euiCollapsedItemActions.allActions": [Function], diff --git a/packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx b/packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx index c48dffd8caa45..d77134acb2437 100644 --- a/packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx +++ b/packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx @@ -1828,5 +1828,13 @@ export const getEuiContextMapping = (): EuiTokensObject => { defaultMessage: 'Selection', } ), + 'euiCodeBlockFullScreen.ariaLabel': i18n.translate('core.euiCodeBlockFullScreen.ariaLabel', { + defaultMessage: 'Expanded code block', + }), + 'euiCodeBlock.label': ({ language }: EuiValues) => + i18n.translate('core.euiCodeBlock.label', { + defaultMessage: '{language} code block:', + values: { language }, + }), }; }; diff --git a/packages/kbn-unsaved-changes-badge/src/components/unsaved_changes_badge/__snapshots__/unsaved_changes_badge.test.tsx.snap b/packages/kbn-unsaved-changes-badge/src/components/unsaved_changes_badge/__snapshots__/unsaved_changes_badge.test.tsx.snap index 9991c8a2165d0..9103b94e19379 100644 --- a/packages/kbn-unsaved-changes-badge/src/components/unsaved_changes_badge/__snapshots__/unsaved_changes_badge.test.tsx.snap +++ b/packages/kbn-unsaved-changes-badge/src/components/unsaved_changes_badge/__snapshots__/unsaved_changes_badge.test.tsx.snap @@ -10,7 +10,7 @@ exports[` should show all menu items 1`] = ` aria-label="View available actions" class="euiBadge emotion-euiBadge-clickable" data-test-subj="unsavedChangesBadge" - style="--euiBadgeBackgroundColor: #F6E58D; --euiBadgeTextColor: #000;" + style="--euiBadgeBackgroundColor: #F6E58D; --euiBadgeTextColor: #000000;" title="test" > ', () => { const button = component.find('EuiButton'); expect(button.prop('color')).toBe('text'); expect(button.prop('css')).toMatchObject({ - backgroundColor: '#FFF', + backgroundColor: '#FFFFFF', border: '1px solid #D3DAE6', color: '#343741', }); diff --git a/src/dev/license_checker/config.ts b/src/dev/license_checker/config.ts index 1eeae89438c83..44c441f9bbe63 100644 --- a/src/dev/license_checker/config.ts +++ b/src/dev/license_checker/config.ts @@ -87,8 +87,8 @@ export const LICENSE_OVERRIDES = { 'jsts@1.6.2': ['Eclipse Distribution License - v 1.0'], // cf. https://github.com/bjornharrtell/jsts '@mapbox/jsonlint-lines-primitives@2.0.2': ['MIT'], // license in readme https://github.com/tmcw/jsonlint '@elastic/ems-client@8.5.3': ['Elastic License 2.0'], - '@elastic/eui@98.1.0-borealis.0': ['Elastic License 2.0 OR AGPL-3.0-only OR SSPL-1.0'], - '@elastic/eui-theme-borealis@0.0.4': ['Elastic License 2.0 OR AGPL-3.0-only OR SSPL-1.0'], + '@elastic/eui@98.2.1-borealis.2': ['Elastic License 2.0 OR AGPL-3.0-only OR SSPL-1.0'], + '@elastic/eui-theme-borealis@0.0.7': ['Elastic License 2.0 OR AGPL-3.0-only OR SSPL-1.0'], 'language-subtag-registry@0.3.21': ['CC-BY-4.0'], // retired ODC‑By license https://github.com/mattcg/language-subtag-registry 'buffers@0.1.1': ['MIT'], // license in importing module https://www.npmjs.com/package/binary '@bufbuild/protobuf@1.2.1': ['Apache-2.0'], // license (Apache-2.0 AND BSD-3-Clause) diff --git a/x-pack/platform/plugins/private/index_lifecycle_management/__jest__/__snapshots__/extend_index_management.test.tsx.snap b/x-pack/platform/plugins/private/index_lifecycle_management/__jest__/__snapshots__/extend_index_management.test.tsx.snap index 83e73494fcb0a..096b56da2fe6f 100644 --- a/x-pack/platform/plugins/private/index_lifecycle_management/__jest__/__snapshots__/extend_index_management.test.tsx.snap +++ b/x-pack/platform/plugins/private/index_lifecycle_management/__jest__/__snapshots__/extend_index_management.test.tsx.snap @@ -178,7 +178,7 @@ exports[`extend index management ilm summary extension should render a phase def > App renders properly 1`] = `"
markdown mock
markdown mock

Page level controls

My Canvas Workpad

There is a new region landmark with page level controls at the end of the document.

"`; +exports[` App renders properly 1`] = `"
markdown mock
markdown mock

Page level controls

My Canvas Workpad

There is a new region landmark with page level controls at the end of the document.

"`; diff --git a/x-pack/plugins/canvas/shareable_runtime/components/footer/settings/__snapshots__/settings.test.tsx.snap b/x-pack/plugins/canvas/shareable_runtime/components/footer/settings/__snapshots__/settings.test.tsx.snap index cfe41427b1ea1..3ac5a1a2731bc 100644 --- a/x-pack/plugins/canvas/shareable_runtime/components/footer/settings/__snapshots__/settings.test.tsx.snap +++ b/x-pack/plugins/canvas/shareable_runtime/components/footer/settings/__snapshots__/settings.test.tsx.snap @@ -14,14 +14,18 @@ exports[` can navigate Autoplay Settings 1`] = ` class="euiPanel euiPanel--plain euiPopover__panel emotion-euiPanel-grow-m-plain-euiPopover__panel-light-hasTransform" data-popover-panel="true" role="dialog" - style="top: -16px; left: -22px; will-change: transform, opacity; z-index: 2000;" + style="top: -16px; left: -18px; will-change: transform, opacity; z-index: 2000;" tabindex="0" >
+ class="euiPopover__arrowWrapper emotion-euiPopoverArrowWrapper" + style="left: 9px; top: 100%;" + > +
+

can navigate Autoplay Settings 2`] = ` data-popover-open="true" data-popover-panel="true" role="dialog" - style="top: -16px; left: -22px; z-index: 2000;" + style="top: -16px; left: -18px; z-index: 2000;" tabindex="0" >

+ class="euiPopover__arrowWrapper emotion-euiPopoverArrowWrapper" + style="left: 9px; top: 100%;" + > +
+

can navigate Toolbar Settings, closes when activated 1`] = class="euiPanel euiPanel--plain euiPopover__panel emotion-euiPanel-grow-m-plain-euiPopover__panel-light-hasTransform" data-popover-panel="true" role="dialog" - style="top: -16px; left: -22px; will-change: transform, opacity; z-index: 2000;" + style="top: -16px; left: -18px; will-change: transform, opacity; z-index: 2000;" tabindex="0" >

+ class="euiPopover__arrowWrapper emotion-euiPopoverArrowWrapper" + style="left: 9px; top: 100%;" + > +
+

can navigate Toolbar Settings, closes when activated 2`] = data-popover-open="true" data-popover-panel="true" role="dialog" - style="top: -16px; left: -22px; z-index: 2000;" + style="top: -16px; left: -18px; z-index: 2000;" tabindex="0" >

+ class="euiPopover__arrowWrapper emotion-euiPopoverArrowWrapper" + style="left: 9px; top: 100%;" + > +
+

can navigate Toolbar Settings, closes when activated 3`] = class="euiPanel euiPanel--plain euiPopover__panel emotion-euiPanel-grow-m-plain-euiPopover__panel-light-hasTransform" data-popover-panel="true" role="dialog" - style="top: -16px; left: -22px; z-index: 2000;" + style="top: -16px; left: -18px; z-index: 2000;" tabindex="0" >

+ class="euiPopover__arrowWrapper emotion-euiPopoverArrowWrapper" + style="left: 9px; top: 100%;" + > +
+

Turn on monitoring diff --git a/x-pack/plugins/security/server/__snapshots__/prompt_page.test.tsx.snap b/x-pack/plugins/security/server/__snapshots__/prompt_page.test.tsx.snap index db2f55f0de222..447fe4b5c92a1 100644 --- a/x-pack/plugins/security/server/__snapshots__/prompt_page.test.tsx.snap +++ b/x-pack/plugins/security/server/__snapshots__/prompt_page.test.tsx.snap @@ -1,5 +1,5 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`PromptPage renders as expected with additional scripts 1`] = `"ElasticMockedFonts

Some Title

Some Body
Action#1
Action#2
"`; +exports[`PromptPage renders as expected with additional scripts 1`] = `"ElasticMockedFonts

Some Title

Some Body
Action#1
Action#2
"`; -exports[`PromptPage renders as expected without additional scripts 1`] = `"ElasticMockedFonts

Some Title

Some Body
Action#1
Action#2
"`; +exports[`PromptPage renders as expected without additional scripts 1`] = `"ElasticMockedFonts

Some Title

Some Body
Action#1
Action#2
"`; diff --git a/x-pack/plugins/security/server/authentication/__snapshots__/unauthenticated_page.test.tsx.snap b/x-pack/plugins/security/server/authentication/__snapshots__/unauthenticated_page.test.tsx.snap index ab94f2c2efc8d..8ca838fa1ce60 100644 --- a/x-pack/plugins/security/server/authentication/__snapshots__/unauthenticated_page.test.tsx.snap +++ b/x-pack/plugins/security/server/authentication/__snapshots__/unauthenticated_page.test.tsx.snap @@ -1,5 +1,5 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`UnauthenticatedPage renders as expected 1`] = `"ElasticMockedFonts

We hit an authentication error

Try logging in again, and if the problem persists, contact your system administrator.

"`; +exports[`UnauthenticatedPage renders as expected 1`] = `"ElasticMockedFonts

We hit an authentication error

Try logging in again, and if the problem persists, contact your system administrator.

"`; -exports[`UnauthenticatedPage renders as expected with custom title 1`] = `"My Company NameMockedFonts

We hit an authentication error

Try logging in again, and if the problem persists, contact your system administrator.

"`; +exports[`UnauthenticatedPage renders as expected with custom title 1`] = `"My Company NameMockedFonts

We hit an authentication error

Try logging in again, and if the problem persists, contact your system administrator.

"`; diff --git a/x-pack/plugins/security/server/authorization/__snapshots__/reset_session_page.test.tsx.snap b/x-pack/plugins/security/server/authorization/__snapshots__/reset_session_page.test.tsx.snap index fcab54e925cfb..18a3568c092c4 100644 --- a/x-pack/plugins/security/server/authorization/__snapshots__/reset_session_page.test.tsx.snap +++ b/x-pack/plugins/security/server/authorization/__snapshots__/reset_session_page.test.tsx.snap @@ -1,5 +1,5 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`ResetSessionPage renders as expected 1`] = `"ElasticMockedFonts

You do not have permission to access the requested page

Either go back to the previous page or log in as a different user.

"`; +exports[`ResetSessionPage renders as expected 1`] = `"ElasticMockedFonts

You do not have permission to access the requested page

Either go back to the previous page or log in as a different user.

"`; -exports[`ResetSessionPage renders as expected with custom page title 1`] = `"My Company NameMockedFonts

You do not have permission to access the requested page

Either go back to the previous page or log in as a different user.

"`; +exports[`ResetSessionPage renders as expected with custom page title 1`] = `"My Company NameMockedFonts

You do not have permission to access the requested page

Either go back to the previous page or log in as a different user.

"`; diff --git a/x-pack/solutions/observability/plugins/observability_ai_assistant_app/public/components/rca/rca_panel/index.tsx b/x-pack/solutions/observability/plugins/observability_ai_assistant_app/public/components/rca/rca_panel/index.tsx index 2ad1225a10f71..173bf8a2c96a0 100644 --- a/x-pack/solutions/observability/plugins/observability_ai_assistant_app/public/components/rca/rca_panel/index.tsx +++ b/x-pack/solutions/observability/plugins/observability_ai_assistant_app/public/components/rca/rca_panel/index.tsx @@ -21,7 +21,11 @@ export function RootCauseAnalysisPanel({ const theme = useTheme(); const panelClassName = - color && color !== 'transparent' && color !== 'plain' && color !== 'subdued' + color && + color !== 'transparent' && + color !== 'plain' && + color !== 'subdued' && + color !== 'highlighted' ? css` border: 1px solid; border-color: ${rgba(theme.colors[color], 0.25)}; diff --git a/x-pack/solutions/observability/plugins/uptime/public/legacy_uptime/components/monitor/ml/__snapshots__/ml_integerations.test.tsx.snap b/x-pack/solutions/observability/plugins/uptime/public/legacy_uptime/components/monitor/ml/__snapshots__/ml_integerations.test.tsx.snap index 1edd320bcc715..733eda0561f9a 100644 --- a/x-pack/solutions/observability/plugins/uptime/public/legacy_uptime/components/monitor/ml/__snapshots__/ml_integerations.test.tsx.snap +++ b/x-pack/solutions/observability/plugins/uptime/public/legacy_uptime/components/monitor/ml/__snapshots__/ml_integerations.test.tsx.snap @@ -18,7 +18,7 @@ exports[`ML Integrations renders without errors 1`] = ` aria-label="Loading" class="euiLoadingSpinner emotion-euiLoadingSpinner-m" role="progressbar" - style="border-color:#07C currentcolor currentcolor currentcolor" + style="border-color:#0077CC currentcolor currentcolor currentcolor" />