From 102dbe209fd713a9ac711679a8b0c8f611fd80ed Mon Sep 17 00:00:00 2001 From: Cee Chen <549407+cee-chen@users.noreply.github.com> Date: Wed, 20 Sep 2023 06:03:02 -0700 Subject: [PATCH] Upgrade EUI to v88.3.0 (#166676) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ⚠️ NOTE: This PR is a copy of #166292 (which was reverted due to failing Storybook builds). This is the same exact PR but with Storybook building fixed. --- EUI `88.2.0` ➡️ `88.3.0` ## [`88.3.0`](https://github.com/elastic/eui/tree/v88.3.0) - `EuiGlobalToastList` now shows a "Clear all" button by default once above a certain number of toasts (defaults to 3). This threshold is configurable with the `showClearAllButtonAt` prop ([#7111](https://github.com/elastic/eui/pull/7111)) - Added an optional `onClearAllToasts` callback to `EuiGlobalToastList` ([#7111](https://github.com/elastic/eui/pull/7111)) - Added the `value`, `onChange`, and `onCancel` props that allow `EuiInlineEdit` to be used as a controlled component ([#7157](https://github.com/elastic/eui/pull/7157)) - Added `grabOmnidirectional`, `transitionLeftIn`, `transitionLeftOut`, `transitionTopIn`, and `transitionTopOut` icon glyphs. ([#7168](https://github.com/elastic/eui/pull/7168)) **Bug fixes** - Fixed `EuiInlineEdit` components to correctly spread `...rest` attributes to the parent wrapper ([#7157](https://github.com/elastic/eui/pull/7157)) - Fixed `EuiListGroupItem` to correctly render the `extraAction` button when `showToolTip` is also passed ([#7159](https://github.com/elastic/eui/pull/7159)) **Dependency updates** - Updated `@hello-pangea/dnd` to v16.3.0 ([#7125](https://github.com/elastic/eui/pull/7125)) - Updated `@types/lodash` to v4.14.198 ([#7126](https://github.com/elastic/eui/pull/7126)) **Accessibility** - `EuiAccordion` now correctly respects reduced motion settings ([#7161](https://github.com/elastic/eui/pull/7161)) - `EuiAccordion` now shows a focus outline to keyboard users around its revealed children on open ([#7161](https://github.com/elastic/eui/pull/7161)) **CSS-in-JS conversions** - Converted `EuiSplitPanel` to Emotion ([#7172](https://github.com/elastic/eui/pull/7172)) --------- Co-authored-by: Bree Hall Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Jon --- package.json | 5 +- .../collapsible_nav.test.tsx.snap | 389 ++++++------ .../__snapshots__/i18n_service.test.tsx.snap | 4 +- .../src/i18n_eui_mapping.tsx | 21 +- .../__snapshots__/comments.test.tsx.snap | 560 +++++++++--------- .../kbn-ui-shared-deps-npm/webpack.config.js | 13 - src/dev/license_checker/config.ts | 2 +- .../page_objects/unified_field_list.ts | 2 +- typings/@hello-pangea/dnd/index.d.ts | 17 + .../public/components/chat/chat_item.tsx | 8 +- .../app/custom_logs/configure_logs.tsx | 2 +- ...screen_capture_panel_content.test.tsx.snap | 270 ++++----- .../translations/translations/fr-FR.json | 1 - .../translations/translations/ja-JP.json | 1 - .../translations/translations/zh-CN.json | 1 - .../lib/check_action_type_enabled.scss | 4 +- yarn.lock | 65 +- 17 files changed, 673 insertions(+), 692 deletions(-) create mode 100644 typings/@hello-pangea/dnd/index.d.ts diff --git a/package.json b/package.json index e39b82676682..eaafb301c5df 100644 --- a/package.json +++ b/package.json @@ -77,6 +77,7 @@ "yarn": "^1.22.19" }, "resolutions": { + "**/@hello-pangea/dnd": "16.2.0", "**/@types/node": "18.17.1", "**/@typescript-eslint/utils": "5.62.0", "**/chokidar": "^3.5.3", @@ -100,7 +101,7 @@ "@elastic/datemath": "5.0.3", "@elastic/elasticsearch": "npm:@elastic/elasticsearch-canary@8.9.1-canary.1", "@elastic/ems-client": "8.4.0", - "@elastic/eui": "88.2.0", + "@elastic/eui": "88.3.0", "@elastic/filesaver": "1.1.2", "@elastic/node-crypto": "1.2.1", "@elastic/numeral": "^2.5.1", @@ -125,7 +126,7 @@ "@hapi/hoek": "^9.2.1", "@hapi/inert": "^6.0.4", "@hapi/wreck": "^17.1.0", - "@hello-pangea/dnd": "^16.3.0", + "@hello-pangea/dnd": "16.2.0", "@juggle/resize-observer": "^3.4.0", "@kbn/aad-fixtures-plugin": "link:x-pack/test/alerting_api_integration/common/plugins/aad", "@kbn/ace": "link:packages/kbn-ace", diff --git a/packages/core/chrome/core-chrome-browser-internal/src/ui/header/__snapshots__/collapsible_nav.test.tsx.snap b/packages/core/chrome/core-chrome-browser-internal/src/ui/header/__snapshots__/collapsible_nav.test.tsx.snap index 0ae5e0504839..ec57877a9744 100644 --- a/packages/core/chrome/core-chrome-browser-internal/src/ui/header/__snapshots__/collapsible_nav.test.tsx.snap +++ b/packages/core/chrome/core-chrome-browser-internal/src/ui/header/__snapshots__/collapsible_nav.test.tsx.snap @@ -109,7 +109,7 @@ Array [ data-test-subj="collapsibleNavGroup-recentlyViewed" >
- - - , - "container":
-
-
-
- -
-
-
@@ -339,6 +202,143 @@ Object {
+ , + "container":
+
+
+
+ +
+
+
+
+
    +
  1. +
    +
    + +
    +
    +
    +
    +
    +

    + some old comment +

    +
    +
    +
    +
    2. +
  2. +
    +
    + +
    +
    +
    +
    +
    +

    + some old comment +

    +
    +
    +
    +
    3. +
+
+
+
+
+
, "debug": [Function], "findAllByAltText": [Function], @@ -408,7 +408,7 @@ Object { data-test-subj="exceptionItemCardComments" >
-
-
-
- , - "container":
-
-
-
- -
-
-
@@ -672,6 +534,142 @@ Object {
+ , + "container":
+
+
+
+ +
+
+
+
+
    +
  1. +
    +
    + +
    +
    +
    +
    +
    +

    + some old comment +

    +
    +
    +
    +
    2. +
  2. +
    +
    + +
    +
    +
    +
    +
    +

    + some old comment +

    +
    +
    +
    +
    3. +
+
+
+
+
+
, "debug": [Function], "findAllByAltText": [Function], diff --git a/packages/kbn-ui-shared-deps-npm/webpack.config.js b/packages/kbn-ui-shared-deps-npm/webpack.config.js index a7beaf4462dc..627a1747c0b2 100644 --- a/packages/kbn-ui-shared-deps-npm/webpack.config.js +++ b/packages/kbn-ui-shared-deps-npm/webpack.config.js @@ -143,19 +143,6 @@ module.exports = (_, argv) => { }, ], }, - // @hello-pangea/dnd emits optional chaining that confuses webpack. - // We need to transform it using babel before going further - { - test: /@hello-pangea\/dnd\/dist\/dnd\.js$/, - use: [ - { - loader: 'babel-loader', - options: { - plugins: [require.resolve('@babel/plugin-proposal-optional-chaining')], - }, - }, - ], - }, { test: /\.css$/, use: [MiniCssExtractPlugin.loader, 'css-loader'], diff --git a/src/dev/license_checker/config.ts b/src/dev/license_checker/config.ts index d7c04f430661..a89f994dc6bd 100644 --- a/src/dev/license_checker/config.ts +++ b/src/dev/license_checker/config.ts @@ -85,7 +85,7 @@ 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.4.0': ['Elastic License 2.0'], - '@elastic/eui@88.2.0': ['SSPL-1.0 OR Elastic License 2.0'], + '@elastic/eui@88.3.0': ['SSPL-1.0 OR Elastic License 2.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 }; diff --git a/test/functional/page_objects/unified_field_list.ts b/test/functional/page_objects/unified_field_list.ts index caa0c7f24dad..5e306239dfdc 100644 --- a/test/functional/page_objects/unified_field_list.ts +++ b/test/functional/page_objects/unified_field_list.ts @@ -84,7 +84,7 @@ export class UnifiedFieldListPageObject extends FtrService { public async toggleSidebarSection(sectionName: SidebarSectionName) { return await this.find.clickByCssSelector( - `${this.getSidebarSectionSelector(sectionName, true)} .euiAccordion__iconButton` + `${this.getSidebarSectionSelector(sectionName, true)} .euiAccordion__arrow` ); } diff --git a/typings/@hello-pangea/dnd/index.d.ts b/typings/@hello-pangea/dnd/index.d.ts new file mode 100644 index 000000000000..242c3278b8a4 --- /dev/null +++ b/typings/@hello-pangea/dnd/index.d.ts @@ -0,0 +1,17 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0 and the Server Side Public License, v 1; you may not use this file except + * in compliance with, at your election, the Elastic License 2.0 or the Server + * Side Public License, v 1. + */ + +import { PreDragActions } from '@hello-pangea/dnd'; + +declare module '@hello-pangea/dnd' { + export * from '@hello-pangea/dnd'; + + // TODO: This type can be imported directly from @hello-pangea/dnd once on v16.3.0 (which requires Webpack v5) + // and this entire file/folder can be deleted at that point + export type FluidDragActions = ReturnType; +} diff --git a/x-pack/plugins/observability_ai_assistant/public/components/chat/chat_item.tsx b/x-pack/plugins/observability_ai_assistant/public/components/chat/chat_item.tsx index a7e212f70a8b..b3fa93d1ec52 100644 --- a/x-pack/plugins/observability_ai_assistant/public/components/chat/chat_item.tsx +++ b/x-pack/plugins/observability_ai_assistant/public/components/chat/chat_item.tsx @@ -61,12 +61,6 @@ const noPanelMessageClassName = css` } `; -const accordionButtonClassName = css` - .euiAccordion__iconButton { - display: none; - } -`; - export function ChatItem({ actions: { canCopy, canEdit, canGiveFeedback, canRegenerate }, display: { collapsed }, @@ -141,7 +135,7 @@ export function ChatItem({ contentElement = ( diff --git a/x-pack/plugins/observability_onboarding/public/components/app/custom_logs/configure_logs.tsx b/x-pack/plugins/observability_onboarding/public/components/app/custom_logs/configure_logs.tsx index 1e438e1dd0e6..b5edcf75b121 100644 --- a/x-pack/plugins/observability_onboarding/public/components/app/custom_logs/configure_logs.tsx +++ b/x-pack/plugins/observability_onboarding/public/components/app/custom_logs/configure_logs.tsx @@ -326,7 +326,7 @@ export function ConfigureLogsContent() { color: euiTheme.colors.primaryText, fontSize: xsFontSize, }, - '.euiAccordion__iconButton svg': { + '.euiAccordion__arrow svg': { stroke: euiTheme.colors.primary, width: euiTheme.size.m, height: euiTheme.size.m, diff --git a/x-pack/plugins/reporting/public/share_context_menu/__snapshots__/screen_capture_panel_content.test.tsx.snap b/x-pack/plugins/reporting/public/share_context_menu/__snapshots__/screen_capture_panel_content.test.tsx.snap index 9d95afb5852d..518c7bb26142 100644 --- a/x-pack/plugins/reporting/public/share_context_menu/__snapshots__/screen_capture_panel_content.test.tsx.snap +++ b/x-pack/plugins/reporting/public/share_context_menu/__snapshots__/screen_capture_panel_content.test.tsx.snap @@ -98,13 +98,13 @@ exports[`ScreenCapturePanelContent properly renders a view with "canvas" layout data-test-subj="shareReportingAdvancedOptionsButton" >
-
+
+
-
-
+ + Alternatively, copy this POST URL to call generation from outside Kibana or from Watcher. + +

+
+
+
+

-

- - Alternatively, copy this POST URL to call generation from outside Kibana or from Watcher. - -

-
+