Merge branch 'main' into emotion/forms

packages/eui/.storybook/loki.ts

@@ -26,6 +26,11 @@ export const LOKI_SELECTORS = {
    * Portal element content selector
    */
   portal: '[data-euiportal="true"]',
+  /**
+   * Body selector
+   * TODO: remove when LOKI_SELECTORS.portal selector works as expected again
+   */
+  body: 'body',
 } as const;
 
 /**

packages/eui/changelogs/CHANGELOG_2024.md

@@ -1,3 +1,11 @@
+## [`v94.6.0`](https://github.com/elastic/eui/releases/v94.6.0)
+
+- Updated `EuiComboBox` to support rendering `option.append` and `option.prepend` in group labels ([#7800](https://github.com/elastic/eui/pull/7800))
+
+**Accessibility**
+
+- Improved the accessibility experience of `EuiBetaBadge` ([#7805](https://github.com/elastic/eui/pull/7805))
+
 ## [`v94.5.2`](https://github.com/elastic/eui/releases/v94.5.2)
 
 **Bug fixes**

packages/eui/changelogs/upcoming/7682.md

@@ -0,0 +1,4 @@
+**Breaking changes**
+
+- Removed deprecated `EUI_CHARTS_THEME_DARK`, `EUI_CHARTS_THEME_LIGHT` and `EUI_SPARKLINE_THEME_PARTIAL` exports
+

packages/eui/changelogs/upcoming/7806.md

@@ -0,0 +1,3 @@
+**Bug fixes**
+
+- Fixed `EuiSearchBar`'s filter configs to always respect `autoClose: false`

packages/eui/changelogs/upcoming/7808.md

@@ -0,0 +1,3 @@
+**Breaking changes**
+
+- Removed deprecated `euiPalettePositive` and `euiPaletteNegative`. Use `euiPaletteGreen` and `euiPaletteRed` instead

packages/eui/i18ntokens.json

@@ -851,14 +851,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 335,
+        "line": 339,
         "column": 12,
-        "index": 9517
+        "index": 9584
       },
       "end": {
-        "line": 338,
+        "line": 342,
         "column": 14,
-        "index": 9640
+        "index": 9707
       }
     },
     "filepath": "src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx"
@@ -869,14 +869,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 348,
+        "line": 352,
         "column": 16,
-        "index": 10079
+        "index": 10146
       },
       "end": {
-        "line": 352,
+        "line": 356,
         "column": 18,
-        "index": 10310
+        "index": 10377
       }
     },
     "filepath": "src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx"
@@ -887,14 +887,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 367,
+        "line": 371,
         "column": 16,
-        "index": 10739
+        "index": 10806
       },
       "end": {
-        "line": 373,
+        "line": 377,
         "column": 18,
-        "index": 11012
+        "index": 11079
       }
     },
     "filepath": "src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx"
@@ -905,14 +905,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 402,
+        "line": 406,
         "column": 20,
-        "index": 12003
+        "index": 12070
       },
       "end": {
-        "line": 408,
+        "line": 412,
         "column": 22,
-        "index": 12301
+        "index": 12368
       }
     },
     "filepath": "src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx"
@@ -923,14 +923,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 419,
+        "line": 423,
         "column": 12,
-        "index": 12505
+        "index": 12572
       },
       "end": {
-        "line": 423,
+        "line": 427,
         "column": 14,
-        "index": 12726
+        "index": 12793
       }
     },
     "filepath": "src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx"
@@ -941,14 +941,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 430,
+        "line": 434,
         "column": 10,
-        "index": 12845
+        "index": 12912
       },
       "end": {
-        "line": 433,
+        "line": 437,
         "column": 12,
-        "index": 12985
+        "index": 13052
       }
     },
     "filepath": "src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx"
@@ -959,14 +959,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 439,
+        "line": 443,
         "column": 10,
-        "index": 13098
+        "index": 13165
       },
       "end": {
-        "line": 442,
+        "line": 446,
         "column": 12,
-        "index": 13241
+        "index": 13308
       }
     },
     "filepath": "src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx"

packages/eui/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@elastic/eui",
   "description": "Elastic UI Component Library",
-  "version": "94.5.2",
+  "version": "94.6.0",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "lib",
   "module": "es",

packages/eui/scripts/compile-eui.js

@@ -26,7 +26,6 @@ const IGNORE_TESTENV = [
 ];
 const IGNORE_PACKAGES = [
   '**/react-datepicker/test/**/*.js',
-  '**/themes/charts/themes.ts',
 ];
 
 function compileLib() {
@@ -207,27 +206,6 @@ function compileBundle() {
     }
   );
   console.log(chalk.green('✔ Finished test utils files'));
-
-  console.log('Building chart theme module...');
-  execSync('webpack --config=src/themes/charts/webpack.config.js', {
-    stdio: 'inherit',
-  });
-  dtsGenerator({
-    prefix: '',
-    out: 'dist/eui_charts_theme.d.ts',
-    baseDir: path.resolve(__dirname, '..', 'src/themes/charts/'),
-    files: ['themes.ts'],
-    resolveModuleId() {
-      return '@elastic/eui/dist/eui_charts_theme';
-    },
-    resolveModuleImport(params) {
-      if (params.importedModuleId === '../../components/common') {
-        return '@elastic/eui/src/components/common';
-      }
-      return null;
-    },
-  });
-  console.log(chalk.green('✔ Finished chart theme module'));
 }
 
 compileLib();

packages/eui/scripts/dtsgenerator.js

@@ -37,7 +37,6 @@ const generator = dtsGenerator({
     '**/*.stories.{ts,tsx}',
     '**/*.mock.{ts,tsx}',
     '**/__mocks__/*',
-    'src/themes/charts/*', // A separate d.ts file is generated for the charts theme file
     'src/test/**/*', // Separate d.ts files are generated for test utils
     'src-docs/**/*', // Don't include src-docs
     '**/*.mdx', // Don't include storybook mdx files

packages/eui/src-docs/src/components/guide_page/versions.json

@@ -1,5 +1,6 @@
 {
   "euiVersions": [
+    "94.6.0",
     "94.5.2",
     "94.5.1",
     "94.5.0",

packages/eui/src-docs/src/views/elastic_charts/sparklines.tsx

@@ -7,10 +7,9 @@ import {
   Tooltip,
   LineSeries,
   AreaSeries,
+  PartialTheme,
 } from '@elastic/charts';
 
-import { EUI_SPARKLINE_THEME_PARTIAL } from '../../../../src/themes/charts/themes';
-
 import {
   EuiPanel,
   EuiStat,
@@ -28,6 +27,28 @@ import {
 } from '../../../../src/services';
 import { useChartBaseTheme } from './utils/use_chart_base_theme';
 
+/**
+ * Example sparkline styles to match `ThemeService.useSparklineOverrides` from kibana `charts` plugin
+ *
+ * See https://github.com/elastic/kibana/blob/82fdf0414d61a1419038eed395bcdf941d72a58c/src/plugins/charts/public/services/theme/theme.ts#L55-L77
+ */
+const sparklineOverrides: PartialTheme = {
+  lineSeriesStyle: {
+    point: {
+      visible: false,
+      strokeWidth: 1,
+      radius: 1,
+    },
+  },
+  areaSeriesStyle: {
+    point: {
+      visible: false,
+      strokeWidth: 1,
+      radius: 1,
+    },
+  },
+};
+
 export const TIME_DATA_SMALL = [
   [1551438630000, 8.515625],
   [1551438660000, 10.796875],
@@ -60,7 +81,7 @@ export default () => {
               <Chart size={{ height: 64 }}>
                 <Settings
                   baseTheme={chartBaseTheme}
-                  theme={EUI_SPARKLINE_THEME_PARTIAL}
+                  theme={sparklineOverrides}
                   showLegend={false}
                 />
                 <Tooltip type="none" />
@@ -91,7 +112,7 @@ export default () => {
               <Chart size={{ height: 48 }}>
                 <Settings
                   baseTheme={chartBaseTheme}
-                  theme={EUI_SPARKLINE_THEME_PARTIAL}
+                  theme={sparklineOverrides}
                   showLegend={false}
                 />
                 <Tooltip type="none" />
@@ -130,7 +151,7 @@ export default () => {
               <Chart size={{ height: 16 }}>
                 <Settings
                   baseTheme={chartBaseTheme}
-                  theme={EUI_SPARKLINE_THEME_PARTIAL}
+                  theme={sparklineOverrides}
                   showLegend={false}
                 />
                 <Tooltip type="none" />
@@ -161,7 +182,7 @@ export default () => {
               <Chart size={{ height: 48 }}>
                 <Settings
                   baseTheme={chartBaseTheme}
-                  theme={EUI_SPARKLINE_THEME_PARTIAL}
+                  theme={sparklineOverrides}
                   showLegend={false}
                 />
                 <Tooltip type="none" />

packages/eui/src-docs/src/views/flyout/flyout_example.js

@@ -402,7 +402,6 @@ export const FlyoutExample = {
     },
     {
       title: 'Resizable flyouts',
-      isBeta: true,
       source: [
         {
           type: GuideSectionTypes.JS,

packages/eui/src-docs/src/views/search_bar/props_info.js

@@ -279,7 +279,7 @@ export const propsInfo = {
         },
         autoClose: {
           description:
-            'Should the dropdown close after the user selects a value. Ignored if multiSelect is true.',
+            'Should the dropdown close after the user selects a value. If not explicitly passed, will auto-close for single selection and remain open for multi-selection.',
           required: false,
           defaultValue: { value: 'true' },
           type: { name: 'boolean' },

packages/eui/src/components/badge/beta_badge/__snapshots__/beta_badge.test.tsx.snap

@@ -124,7 +124,6 @@ exports[`EuiBetaBadge props tooltip and anchorProps are rendered 1`] = `
 >
   <span
     class="euiBetaBadge emotion-euiBetaBadge-hollow-m-baseline"
-    role="button"
     tabindex="0"
   >
     Beta

packages/eui/src/components/badge/beta_badge/beta_badge.tsx

@@ -230,13 +230,7 @@ export const EuiBetaBadge: FunctionComponent<EuiBetaBadgeProps> = ({
           title={title || label}
           anchorProps={anchorProps}
         >
-          <span
-            tabIndex={0}
-            css={cssStyles}
-            className={classes}
-            role="button"
-            {...rest}
-          >
+          <span tabIndex={0} css={cssStyles} className={classes} {...rest}>
             {icon || label}
           </span>
         </EuiToolTip>