Upgraded EUI to 18.0.0 (#54042)

* Upgraded EUI to 18.0.0

* Fix breaks from `palette._.colors` changes

* snapshots

* Updated hard coded hex color codes in tests, fixed TS errors

* Updated a functional test's selector; added (BSD-3-Clause AND Apache-2.0) to license checker whitelist

* Functional test selector update

* Updated vega browser-ci tests for palette changes

* rebased on master

* One more location for EUI package number update and yarn lock

* Fixed lurking [but introduced] TypeScript logic bug

* Swap a prop definition for the same value but tied closer to its source

Co-authored-by: Caroline Horn <[email protected]>
Co-authored-by: Elastic Machine <[email protected]>

package.json

@@ -118,7 +118,7 @@
     "@elastic/charts": "^16.1.0",
     "@elastic/datemath": "5.0.2",
     "@elastic/ems-client": "1.0.5",
-    "@elastic/eui": "17.3.1",
+    "@elastic/eui": "18.0.0",
     "@elastic/filesaver": "1.1.2",
     "@elastic/good": "8.1.1-kibana2",
     "@elastic/numeral": "2.3.3",

packages/kbn-ui-shared-deps/package.json

@@ -9,7 +9,7 @@
     "kbn:watch": "node scripts/build --watch"
   },
   "devDependencies": {
-    "@elastic/eui": "17.3.1",
+    "@elastic/eui": "18.0.0",
     "@elastic/charts": "^16.1.0",
     "@kbn/dev-utils": "1.0.0",
     "@yarnpkg/lockfile": "^1.1.0",

src/dev/license_checker/config.ts

@@ -23,6 +23,7 @@ export const LICENSE_WHITELIST = [
   'Elastic-License',
   '(BSD-2-Clause OR MIT OR Apache-2.0)',
   '(BSD-2-Clause OR MIT)',
+  '(BSD-3-Clause AND Apache-2.0)',
   '(GPL-2.0 OR MIT)',
   '(MIT AND CC-BY-3.0)',
   '(MIT AND Zlib)',

src/legacy/core_plugins/input_control_vis/public/components/editor/list_control_editor.tsx

@@ -20,14 +20,7 @@
 import React, { PureComponent, ChangeEvent, ComponentType } from 'react';
 
 import { FormattedMessage } from '@kbn/i18n/react';
-import {
-  EuiFormRow,
-  EuiFieldNumber,
-  EuiSwitch,
-  EuiSelect,
-  EuiSelectProps,
-  EuiSwitchEvent,
-} from '@elastic/eui';
+import { EuiFormRow, EuiFieldNumber, EuiSwitch, EuiSelect, EuiSwitchEvent } from '@elastic/eui';
 
 import { IndexPatternSelectFormRow } from './index_pattern_select_form_row';
 import { FieldSelect } from './field_select';
@@ -63,7 +56,7 @@ interface ListControlEditorProps {
     event: ChangeEvent<HTMLInputElement>
   ) => void;
   handleParentChange: (controlIndex: number, event: ChangeEvent<HTMLSelectElement>) => void;
-  parentCandidates: EuiSelectProps['options'];
+  parentCandidates: React.ComponentProps<typeof EuiSelect>['options'];
   deps: InputControlVisDependencies;
 }
 

src/legacy/core_plugins/kbn_vislib_vis_types/public/area.js

@@ -33,7 +33,7 @@ import {
   getConfigCollections,
 } from './utils/collections';
 import { getAreaOptionTabs, countLabel } from './utils/common_config';
-import { palettes } from '@elastic/eui/lib/services';
+import { euiPaletteColorBlind } from '@elastic/eui/lib/services';
 import { vislibVisController } from './controller';
 
 export const areaDefinition = {
@@ -117,7 +117,7 @@ export const areaDefinition = {
         value: 10,
         width: 1,
         style: ThresholdLineStyles.FULL,
-        color: palettes.euiPaletteColorBlind.colors[9],
+        color: euiPaletteColorBlind()[9],
       },
       labels: {},
     },

src/legacy/core_plugins/kbn_vislib_vis_types/public/histogram.js

@@ -32,7 +32,7 @@ import {
   getConfigCollections,
 } from './utils/collections';
 import { getAreaOptionTabs, countLabel } from './utils/common_config';
-import { palettes } from '@elastic/eui/lib/services';
+import { euiPaletteColorBlind } from '@elastic/eui/lib/services';
 import { vislibVisController } from './controller';
 
 export const histogramDefinition = {
@@ -120,7 +120,7 @@ export const histogramDefinition = {
         value: 10,
         width: 1,
         style: ThresholdLineStyles.FULL,
-        color: palettes.euiPaletteColorBlind.colors[9],
+        color: euiPaletteColorBlind()[9],
       },
     },
   },

src/legacy/core_plugins/kbn_vislib_vis_types/public/horizontal_bar.js

@@ -32,7 +32,7 @@ import {
   getConfigCollections,
 } from './utils/collections';
 import { getAreaOptionTabs, countLabel } from './utils/common_config';
-import { palettes } from '@elastic/eui/lib/services';
+import { euiPaletteColorBlind } from '@elastic/eui/lib/services';
 import { vislibVisController } from './controller';
 
 export const horizontalBarDefinition = {
@@ -119,7 +119,7 @@ export const horizontalBarDefinition = {
         value: 10,
         width: 1,
         style: ThresholdLineStyles.FULL,
-        color: palettes.euiPaletteColorBlind.colors[9],
+        color: euiPaletteColorBlind()[9],
       },
     },
   },

src/legacy/core_plugins/kbn_vislib_vis_types/public/line.js

@@ -32,7 +32,7 @@ import {
   InterpolationModes,
   getConfigCollections,
 } from './utils/collections';
-import { palettes } from '@elastic/eui/lib/services';
+import { euiPaletteColorBlind } from '@elastic/eui/lib/services';
 import { getAreaOptionTabs, countLabel } from './utils/common_config';
 import { vislibVisController } from './controller';
 
@@ -118,7 +118,7 @@ export const lineDefinition = {
         value: 10,
         width: 1,
         style: ThresholdLineStyles.FULL,
-        color: palettes.euiPaletteColorBlind.colors[9],
+        color: euiPaletteColorBlind()[9],
       },
     },
   },