Upgrade EUI to v92.0.0

package.json

@@ -102,7 +102,7 @@
     "@elastic/datemath": "5.0.3",
     "@elastic/elasticsearch": "npm:@elastic/[email protected]",
     "@elastic/ems-client": "8.5.1",
-    "@elastic/eui": "91.3.1",
+    "@elastic/eui": "92.0.0-backport.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

@@ -371,22 +371,6 @@ export const getEuiContextMapping = (): EuiTokensObject => {
     'euiCommonlyUsedTimeRanges.legend': i18n.translate('core.euiCommonlyUsedTimeRanges.legend', {
       defaultMessage: 'Commonly used',
     }),
-    'euiControlBar.screenReaderHeading': i18n.translate('core.euiControlBar.screenReaderHeading', {
-      defaultMessage: 'Page level controls',
-    }),
-    'euiControlBar.screenReaderAnnouncement': i18n.translate(
-      'core.euiControlBar.screenReaderAnnouncement',
-      {
-        defaultMessage:
-          'There is a new region landmark with page level controls at the end of the document.',
-      }
-    ),
-    'euiControlBar.customScreenReaderAnnouncement': ({ landmarkHeading }: EuiValues) =>
-      i18n.translate('core.euiControlBar.customScreenReaderAnnouncement', {
-        defaultMessage:
-          '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',
       {
@@ -938,56 +922,10 @@ export const getEuiContextMapping = (): EuiTokensObject => {
     'euiModal.closeModal': i18n.translate('core.euiModal.closeModal', {
       defaultMessage: 'Closes this modal window',
     }),
-    'euiNotificationEventMessages.accordionButtonText': ({ messagesLength }: EuiValues) =>
-      i18n.translate('core.euiNotificationEventMessages.accordionButtonText', {
-        defaultMessage: '+ {messagesLength} more',
-        values: { messagesLength },
-      }),
     'euiErrorBoundary.error': i18n.translate('core.euiErrorBoundary.error', {
       defaultMessage: 'Error',
       description: 'Error boundary for uncaught exceptions when rendering part of the application',
     }),
-    'euiNotificationEventMessages.accordionAriaLabelButtonText': ({
-      messagesLength,
-      eventName,
-    }: EuiValues) =>
-      i18n.translate('core.euiNotificationEventMessages.accordionAriaLabelButtonText', {
-        defaultMessage: '+ {messagesLength} messages for {eventName}',
-        values: { messagesLength, eventName },
-      }),
-    'euiNotificationEventMeta.contextMenuButton': ({ eventName }: EuiValues) =>
-      i18n.translate('core.euiNotificationEventMeta.contextMenuButton', {
-        defaultMessage: 'Menu for {eventName}',
-        values: { eventName },
-      }),
-    'euiNotificationEventReadButton.markAsReadAria': ({ eventName }: EuiValues) =>
-      i18n.translate('core.euiNotificationEventReadButton.markAsReadAria', {
-        defaultMessage: 'Mark {eventName} as read',
-        values: { eventName },
-      }),
-    'euiNotificationEventReadButton.markAsUnreadAria': ({ eventName }: EuiValues) =>
-      i18n.translate('core.euiNotificationEventReadButton.markAsUnreadAria', {
-        defaultMessage: 'Mark {eventName} as unread',
-        values: { eventName },
-      }),
-    'euiNotificationEventReadButton.markAsRead': i18n.translate(
-      'core.euiNotificationEventReadButton.markAsRead',
-      {
-        defaultMessage: 'Mark as read',
-      }
-    ),
-    'euiNotificationEventReadButton.markAsUnread': i18n.translate(
-      'core.euiNotificationEventReadButton.markAsUnread',
-      {
-        defaultMessage: 'Mark as unread',
-      }
-    ),
-    'euiNotificationEventMessages.accordionHideText': i18n.translate(
-      'core.euiNotificationEventMessages.accordionHideText',
-      {
-        defaultMessage: 'hide',
-      }
-    ),
     'euiPagination.pageOfTotalCompressed': ({ page, total }: EuiValues) => (
       <FormattedMessage
         id="core.euiPagination.pageOfTotalCompressed"
@@ -1802,25 +1740,6 @@ export const getEuiContextMapping = (): EuiTokensObject => {
         defaultMessage: 'You can quickly navigate this list using arrow keys.',
       }
     ),
-    'euiNotificationEventReadIcon.read': i18n.translate('core.euiNotificationEventReadIcon.read', {
-      defaultMessage: 'Read',
-    }),
-    'euiNotificationEventReadIcon.readAria': ({ eventName }: EuiValues) =>
-      i18n.translate('core.euiNotificationEventReadIcon.readAria', {
-        defaultMessage: '{eventName} is read',
-        values: { eventName },
-      }),
-    'euiNotificationEventReadIcon.unread': i18n.translate(
-      'core.euiNotificationEventReadIcon.unread',
-      {
-        defaultMessage: 'Unread',
-      }
-    ),
-    'euiNotificationEventReadIcon.unreadAria': ({ eventName }: EuiValues) =>
-      i18n.translate('core.euiNotificationEventReadIcon.unreadAria', {
-        defaultMessage: '{eventName} is unread',
-        values: { eventName },
-      }),
     'euiSkeletonLoading.loadingAriaText': ({ contentAriaLabel }: EuiValues) =>
       i18n.translate('core.euiSkeletonLoading.loadingAriaText', {
         defaultMessage: 'Loading {contentAriaLabel}',

packages/kbn-unified-field-list/src/components/field_list_filters/field_type_filter.tsx

@@ -49,7 +49,7 @@ const popoverTitleStyle = css`
 `;
 const filterButtonStyle = css`
   &,
-  & .euiFilterButton__textShift {
+  & .euiFilterButton__text {
     min-width: 0;
     line-height: 1;
   }

src/dev/license_checker/config.ts

@@ -85,7 +85,7 @@ export const LICENSE_OVERRIDES = {
   '[email protected]': ['Eclipse Distribution License - v 1.0'], // cf. https://github.com/bjornharrtell/jsts
   '@mapbox/[email protected]': ['MIT'], // license in readme https://github.com/tmcw/jsonlint
   '@elastic/[email protected]': ['Elastic License 2.0'],
-  '@elastic/eui@91.3.1': ['SSPL-1.0 OR Elastic License 2.0'],
+  '@elastic/eui@92.0.0-backport.0': ['SSPL-1.0 OR Elastic License 2.0'],
   '[email protected]': ['CC-BY-4.0'], // retired ODC‑By license https://github.com/mattcg/language-subtag-registry
   '[email protected]': ['MIT'], // license in importing module https://www.npmjs.com/package/binary
   '@bufbuild/[email protected]': ['Apache-2.0'], // license (Apache-2.0 AND BSD-3-Clause)

x-pack/plugins/cases/public/components/user_actions_activity_bar/filter_activity.tsx

@@ -28,7 +28,7 @@ const MyEuiFilterGroup = styled(EuiFilterGroup)`
 
 const FilterAllButton = styled(EuiFilterButton)`
   &,
-  & .euiFilterButton__textShift {
+  & .euiFilterButton__text {
     min-width: 28px;
   }
 `;

x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/risk_score_mapping/index.tsx

@@ -51,7 +51,6 @@ interface RiskScoreFieldProps {
   idAria: string;
   indices: DataViewBase;
   isDisabled: boolean;
-  isActive: boolean;
   placeholder?: string;
 }
 
@@ -61,7 +60,6 @@ export const RiskScoreField = ({
   idAria,
   indices,
   isDisabled,
-  isActive,
   placeholder,
 }: RiskScoreFieldProps) => {
   const { value, isMappingChecked, mapping } = field.value;
@@ -149,39 +147,29 @@ export const RiskScoreField = ({
   return (
     <EuiFlexGroup direction={'column'}>
       <EuiFlexItem>
-        {
-          // TODO: https://github.com/elastic/kibana/issues/161456
-          // The About step page contains EuiRange component which does not work properly within memoized parents.
-          // EUI team suggested not to memoize EuiRange/EuiDualRange: https://github.com/elastic/eui/issues/6846
-          // Workaround: We force EuiRange re-rendering by removing/adding it into the DOM.
-          // NOTE: We should remove this workaround once EUI team fixed EuiRange.
-          // Related ticket: https://github.com/elastic/kibana/issues/160561
-        }
-        {isActive && (
-          <EuiFormRow
-            label={riskScoreLabel}
-            labelAppend={field.labelAppend}
-            helpText={field.helpText}
-            error={'errorMessage'}
-            isInvalid={false}
-            fullWidth
-            data-test-subj={`${dataTestSubj}-defaultRisk`}
-            describedByIds={idAria ? [idAria] : undefined}
-          >
-            <EuiRange
-              value={value}
-              onChange={handleDefaultRiskScoreChange}
-              max={100}
-              min={0}
-              showRange
-              showInput
-              fullWidth={false}
-              showTicks
-              tickInterval={25}
-              data-test-subj={`${dataTestSubj}-defaultRiskRange`}
-            />
-          </EuiFormRow>
-        )}
+        <EuiFormRow
+          label={riskScoreLabel}
+          labelAppend={field.labelAppend}
+          helpText={field.helpText}
+          error={'errorMessage'}
+          isInvalid={false}
+          fullWidth
+          data-test-subj={`${dataTestSubj}-defaultRisk`}
+          describedByIds={idAria ? [idAria] : undefined}
+        >
+          <EuiRange
+            value={value}
+            onChange={handleDefaultRiskScoreChange}
+            max={100}
+            min={0}
+            showRange
+            showInput
+            fullWidth={false}
+            showTicks
+            tickInterval={25}
+            data-test-subj={`${dataTestSubj}-defaultRiskRange`}
+          />
+        </EuiFormRow>
       </EuiFlexItem>
       <EuiFlexItem>
         <EuiFormRow

x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/step_about_rule/index.test.tsx

@@ -106,7 +106,6 @@ describe('StepAboutRuleComponent', () => {
         dataViewId={defineStepDefault.dataViewId}
         timestampOverride={stepAboutDefaultValue.timestampOverride}
         isLoading={false}
-        isActive={true}
         form={aboutStepForm}
       />
     );

x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/step_about_rule/index.tsx

@@ -50,13 +50,6 @@ interface StepAboutRuleProps extends RuleStepProps {
   timestampOverride: string;
   form: FormHook<AboutStepRule>;
   esqlQuery?: string | undefined;
-  // TODO: https://github.com/elastic/kibana/issues/161456
-  // The About step page contains EuiRange component which does not work properly within memoized parents.
-  // EUI team suggested not to memoize EuiRange/EuiDualRange: https://github.com/elastic/eui/issues/6846
-  // Workaround: We introduced this additional property to be able to do extra re-render on switching to/from the About step page.
-  // NOTE: We should remove this workaround once EUI team fixed EuiRange.
-  // Related ticket: https://github.com/elastic/kibana/issues/160561
-  isActive: boolean;
 }
 
 interface StepAboutRuleReadOnlyProps {
@@ -83,7 +76,6 @@ const StepAboutRuleComponent: FC<StepAboutRuleProps> = ({
   index,
   dataViewId,
   timestampOverride,
-  isActive = false,
   isUpdateView = false,
   isLoading,
   form,
@@ -188,7 +180,6 @@ const StepAboutRuleComponent: FC<StepAboutRuleProps> = ({
                 dataTestSubj: 'detectionEngineStepAboutRuleRiskScore',
                 idAria: 'detectionEngineStepAboutRuleRiskScore',
                 isDisabled: isLoading || indexPatternLoading,
-                isActive,
                 indices: indexPattern,
               }}
             />

x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/pages/rule_creation/index.tsx

@@ -596,7 +596,6 @@ const CreateRulePageComponent: React.FC = () => {
             dataViewId={defineStepData.dataViewId}
             timestampOverride={aboutStepData.timestampOverride}
             isLoading={isCreateRuleLoading || loading}
-            isActive={activeStep === RuleStep.aboutRule}
             form={aboutStepForm}
             esqlQuery={esqlQueryForAboutStep}
           />

x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/pages/rule_editing/index.tsx

@@ -287,7 +287,6 @@ const EditRulePageComponent: FC<{ rule: RuleResponse }> = ({ rule }) => {
                 <StepAboutRule
                   isLoading={isLoading}
                   isUpdateView
-                  isActive={activeStep === RuleStep.aboutRule}
                   ruleType={defineStepData.ruleType}
                   machineLearningJobId={defineStepData.machineLearningJobId}
                   index={memoizedIndex}

x-pack/plugins/synthetics/e2e/synthetics/journeys/management_list.journey.ts

@@ -101,7 +101,7 @@ journey(`MonitorManagementList`, async ({ page, params }) => {
   });
 
   step('Filter by Frequency', async () => {
-    const frequencyFilter = page.locator('.euiFilterButton__textShift', { hasText: 'Frequency' });
+    const frequencyFilter = page.locator('.euiFilterButton__text', { hasText: 'Frequency' });
     const fiveMinuteScheduleOption = page.getByText('Every 5 minutes').first();
 
     await frequencyFilter.click();