Upgrade EUI to v88.3.0 (#166292)

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](elastic/eui#7111))
- Added an optional `onClearAllToasts` callback to `EuiGlobalToastList`
([#7111](elastic/eui#7111))
- Added the `value`, `onChange`, and `onCancel` props that allow
`EuiInlineEdit` to be used as a controlled component
([#7157](elastic/eui#7157))
- Added `grabOmnidirectional`, `transitionLeftIn`, `transitionLeftOut`,
`transitionTopIn`, and `transitionTopOut` icon glyphs.
([#7168](elastic/eui#7168))

**Bug fixes**

- Fixed `EuiInlineEdit` components to correctly spread `...rest`
attributes to the parent wrapper
([#7157](elastic/eui#7157))
- Fixed `EuiListGroupItem` to correctly render the `extraAction` button
when `showToolTip` is also passed
([#7159](elastic/eui#7159))

**Dependency updates**

- Updated `@hello-pangea/dnd` to v16.3.0
([#7125](elastic/eui#7125))
- Updated `@types/lodash` to v4.14.198
([#7126](elastic/eui#7126))

**Accessibility**

- `EuiAccordion` now correctly respects reduced motion settings
([#7161](elastic/eui#7161))
- `EuiAccordion` now shows a focus outline to keyboard users around its
revealed children on open
([#7161](elastic/eui#7161))

**CSS-in-JS conversions**

- Converted `EuiSplitPanel` to Emotion
([#7172](elastic/eui#7172))


⚠️ As a quick heads up, serverless tests appear to have been extremely
flake/failure-prone the last couple weeks, particularly Cypress tests.
We've evaluated the listed failures and fixed ones that were related to
changes in this PR, and we're relatively confident the remaining
failures are not related to changes from EUI. Please let us know if you
think this is not the case.

---------

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Cee Chen <constance.chen@elastic.co>
Co-authored-by: Jon <jon@elastic.co>

package.json

@@ -100,7 +100,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",

packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx

@@ -17,9 +17,12 @@ interface EuiValues {
 
 export const getEuiContextMapping = (): EuiTokensObject => {
   return {
-    'euiAccordion.isLoading': i18n.translate('core.euiAccordion.isLoading', {
-      defaultMessage: 'Loading',
-    }),
+    'euiAccordionChildrenLoading.message': i18n.translate(
+      'core.euiAccordionChildrenLoading.message',
+      {
+        defaultMessage: 'Loading',
+      }
+    ),
     'euiAutoRefresh.autoRefreshLabel': i18n.translate('core.euiAutoRefresh.autoRefreshLabel', {
       defaultMessage: 'Auto refresh',
     }),
@@ -419,6 +422,18 @@ export const getEuiContextMapping = (): EuiTokensObject => {
           'There is a new region landmark called {landmarkHeading} with page level controls at the end of the document.',
         values: { landmarkHeading },
       }),
+    'euiGlobalToastList.clearAllToastsButtonAriaLabel': i18n.translate(
+      'core.euiGlobalToastList.clearAllToastsButtonAriaLabel',
+      {
+        defaultMessage: 'Clear all toast notifications',
+      }
+    ),
+    'euiGlobalToastList.clearAllToastsButtonDisplayText': i18n.translate(
+      'core.euiGlobalToastList.clearAllToastsButtonDisplayText',
+      {
+        defaultMessage: 'Clear all',
+      }
+    ),
     'euiKeyboardShortcuts.title': i18n.translate('core.euiKeyboardShortcuts.title', {
       defaultMessage: 'Keyboard shortcuts',
     }),

packages/kbn-cypress-config/index.ts

@@ -40,6 +40,19 @@ export function defineCypressConfig(options?: Cypress.ConfigOptions<any>) {
                       },
                     },
                   },
+                  // @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(\.esm)?\.js$/,
+                    use: [
+                      {
+                        loader: 'babel-loader',
+                        options: {
+                          plugins: [require.resolve('@babel/plugin-proposal-optional-chaining')],
+                        },
+                      },
+                    ],
+                  },
                 ],
               },
             },