chore(NA): splits types from code on @kbn/ui-shared-deps-src (#123313)

* chore(NA): splits types from code on @kbn/ui-shared-deps-src

* chore(NA): break flot-charts into another package

* chore(NA): skip failing tests

* chore(NA): remove skip and add correct value

* chore(NA): fix new ui-theme import

* chore(NA): adding fleet cloned test

* chore(NA): remove cloned test

* chore(NA): remove added typo

.eslintignore

@@ -35,7 +35,7 @@ snapshots.js
 /packages/kbn-test/src/functional_test_runner/__tests__/fixtures/
 /packages/kbn-test/src/functional_test_runner/lib/config/__tests__/fixtures/
 /packages/kbn-ui-framework/dist
-/packages/kbn-ui-shared-deps-src/src/flot_charts
+/packages/kbn-flot-charts/lib
 /packages/kbn-monaco/src/painless/antlr
 
 # Bazel

.eslintrc.js

@@ -1569,7 +1569,7 @@ module.exports = {
       },
     },
     {
-      files: ['packages/kbn-ui-shared-deps-src/src/flot_charts/**/*.js'],
+      files: ['packages/kbn-flot-charts/lib/**/*.js'],
       env: {
         jquery: true,
       },

.i18nrc.json

@@ -32,7 +32,7 @@
     "expressionShape": "src/plugins/expression_shape",
     "expressionTagcloud": "src/plugins/chart_expressions/expression_tagcloud",
     "fieldFormats": "src/plugins/field_formats",
-    "flot": "packages/kbn-ui-shared-deps-src/src/flot_charts",
+    "flot": "packages/kbn-flot-charts/lib",
     "home": "src/plugins/home",
     "indexPatternEditor": "src/plugins/data_view_editor",
     "indexPatternFieldEditor": "src/plugins/data_view_field_editor",

package.json

@@ -137,6 +137,7 @@
     "@kbn/crypto": "link:bazel-bin/packages/kbn-crypto",
     "@kbn/es-query": "link:bazel-bin/packages/kbn-es-query",
     "@kbn/field-types": "link:bazel-bin/packages/kbn-field-types",
+    "@kbn/flot-charts": "link:bazel-bin/packages/kbn-flot-charts",
     "@kbn/i18n": "link:bazel-bin/packages/kbn-i18n",
     "@kbn/i18n-react": "link:bazel-bin/packages/kbn-i18n-react",
     "@kbn/interpreter": "link:bazel-bin/packages/kbn-interpreter",
@@ -169,6 +170,7 @@
     "@kbn/ui-framework": "link:bazel-bin/packages/kbn-ui-framework",
     "@kbn/ui-shared-deps-npm": "link:bazel-bin/packages/kbn-ui-shared-deps-npm",
     "@kbn/ui-shared-deps-src": "link:bazel-bin/packages/kbn-ui-shared-deps-src",
+    "@kbn/ui-theme": "link:bazel-bin/packages/kbn-ui-theme",
     "@kbn/utility-types": "link:bazel-bin/packages/kbn-utility-types",
     "@kbn/utils": "link:bazel-bin/packages/kbn-utils",
     "@loaders.gl/core": "^2.3.1",
@@ -602,6 +604,8 @@
     "@types/kbn__std": "link:bazel-bin/packages/kbn-std/npm_module_types",
     "@types/kbn__telemetry-tools": "link:bazel-bin/packages/kbn-telemetry-tools/npm_module_types",
     "@types/kbn__ui-shared-deps-npm": "link:bazel-bin/packages/kbn-ui-shared-deps-npm/npm_module_types",
+    "@types/kbn__ui-shared-deps-src": "link:bazel-bin/packages/kbn-ui-shared-deps-src/npm_module_types",
+    "@types/kbn__ui-theme": "link:bazel-bin/packages/kbn-ui-theme/npm_module_types",
     "@types/kbn__utility-types": "link:bazel-bin/packages/kbn-utility-types/npm_module_types",
     "@types/kbn__utils": "link:bazel-bin/packages/kbn-utils/npm_module_types",
     "@types/license-checker": "15.0.0",

packages/BUILD.bazel

@@ -26,6 +26,7 @@ filegroup(
       "//packages/kbn-eslint-plugin-eslint:build",
       "//packages/kbn-expect:build",
       "//packages/kbn-field-types:build",
+      "//packages/kbn-flot-charts:build",
       "//packages/kbn-i18n:build",
       "//packages/kbn-i18n-react:build",
       "//packages/kbn-interpreter:build",
@@ -66,6 +67,7 @@ filegroup(
       "//packages/kbn-ui-framework:build",
       "//packages/kbn-ui-shared-deps-npm:build",
       "//packages/kbn-ui-shared-deps-src:build",
+      "//packages/kbn-ui-theme:build",
       "//packages/kbn-utility-types:build",
       "//packages/kbn-utils:build",
   ],
@@ -121,6 +123,8 @@ filegroup(
       "//packages/kbn-std:build_types",
       "//packages/kbn-telemetry-tools:build_types",
       "//packages/kbn-ui-shared-deps-npm:build_types",
+      "//packages/kbn-ui-shared-deps-src:build_types",
+      "//packages/kbn-ui-theme:build_types",
       "//packages/kbn-utility-types:build_types",
       "//packages/kbn-utils:build_types",
   ],

packages/elastic-eslint-config-kibana/.eslintrc.js

@@ -94,7 +94,7 @@ module.exports = {
         ].map(from => ({
           from,
           to: false,
-          disallowedMessage: `Use "@kbn/ui-shared-deps-src/theme" to access theme vars.`
+          disallowedMessage: `Use "@kbn/ui-theme" to access theme vars.`
         })),
       ],
     ],

packages/kbn-flot-charts/BUILD.bazel

@@ -0,0 +1,51 @@
+load("@build_bazel_rules_nodejs//:index.bzl", "js_library")
+load("//src/dev/bazel:index.bzl", "pkg_npm")
+
+PKG_BASE_NAME = "kbn-flot-charts"
+PKG_REQUIRE_NAME = "@kbn/flot-charts"
+
+SOURCE_FILES = glob([
+  "lib/**/*.js",
+  "index.js",
+])
+
+SRCS = SOURCE_FILES
+
+filegroup(
+  name = "srcs",
+  srcs = SRCS,
+)
+
+NPM_MODULE_EXTRA_FILES = [
+  "package.json",
+  "API.md",
+]
+
+RUNTIME_DEPS = [
+  "//packages/kbn-i18n",
+]
+
+js_library(
+  name = PKG_BASE_NAME,
+  srcs = NPM_MODULE_EXTRA_FILES + [
+    ":srcs",
+  ],
+  deps = RUNTIME_DEPS,
+  package_name = PKG_REQUIRE_NAME,
+  visibility = ["//visibility:public"],
+)
+
+pkg_npm(
+  name = "npm_module",
+  deps = [
+    ":%s" % PKG_BASE_NAME,
+  ]
+)
+
+filegroup(
+  name = "build",
+  srcs = [
+    ":npm_module",
+  ],
+  visibility = ["//visibility:public"],
+)

packages/kbn-flot-charts/index.js

@@ -1,3 +1,11 @@
+/*
+ * 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.
+ */
+
 /* @notice
  *
  * This product includes code that is based on flot-charts, which was available
@@ -26,15 +34,15 @@
  * THE SOFTWARE.
  */
 
-import './jquery_flot';
-import './jquery_flot_canvas';
-import './jquery_flot_time';
-import './jquery_flot_symbol';
-import './jquery_flot_crosshair';
-import './jquery_flot_selection';
-import './jquery_flot_pie';
-import './jquery_flot_stack';
-import './jquery_flot_threshold';
-import './jquery_flot_fillbetween';
-import './jquery_flot_log';
-import './jquery_flot_axislabels';
+import './lib/jquery_flot';
+import './lib/jquery_flot_canvas';
+import './lib/jquery_flot_time';
+import './lib/jquery_flot_symbol';
+import './lib/jquery_flot_crosshair';
+import './lib/jquery_flot_selection';
+import './lib/jquery_flot_pie';
+import './lib/jquery_flot_stack';
+import './lib/jquery_flot_threshold';
+import './lib/jquery_flot_fillbetween';
+import './lib/jquery_flot_log';
+import './lib/jquery_flot_axislabels';

packages/kbn-flot-charts/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@kbn/flot-charts",
+  "version": "1.0.0",
+  "private": true,
+  "main": "./index.js",
+  "license": "SSPL-1.0 OR Elastic License 2.0"
+}

packages/kbn-optimizer/BUILD.bazel

@@ -70,7 +70,7 @@ TYPES_DEPS = [
   "//packages/kbn-dev-utils:npm_module_types",
   "//packages/kbn-std:npm_module_types",
   "//packages/kbn-ui-shared-deps-npm:npm_module_types",
-  "//packages/kbn-ui-shared-deps-src",
+  "//packages/kbn-ui-shared-deps-src:npm_module_types",
   "//packages/kbn-utils:npm_module_types",
   "@npm//chalk",
   "@npm//clean-webpack-plugin",

packages/kbn-optimizer/src/worker/webpack.config.ts

@@ -16,7 +16,7 @@ import webpackMerge from 'webpack-merge';
 import { CleanWebpackPlugin } from 'clean-webpack-plugin';
 import CompressionPlugin from 'compression-webpack-plugin';
 import UiSharedDepsNpm from '@kbn/ui-shared-deps-npm';
-import UiSharedDepsSrc from '@kbn/ui-shared-deps-src';
+import * as UiSharedDepsSrc from '@kbn/ui-shared-deps-src';
 
 import { Bundle, BundleRefs, WorkerConfig } from '../common';
 import { BundleRefsPlugin } from './bundle_refs_plugin';

packages/kbn-storybook/BUILD.bazel

@@ -52,7 +52,7 @@ RUNTIME_DEPS = [
 TYPES_DEPS = [
   "//packages/kbn-dev-utils:npm_module_types",
   "//packages/kbn-ui-shared-deps-npm:npm_module_types",
-  "//packages/kbn-ui-shared-deps-src",
+  "//packages/kbn-ui-shared-deps-src:npm_module_types",
   "//packages/kbn-utils:npm_module_types",
   "@npm//@elastic/eui",
   "@npm//@emotion/cache",

packages/kbn-storybook/src/lib/run_storybook_cli.ts

@@ -11,7 +11,7 @@ import { logger } from '@storybook/node-logger';
 import buildStandalone from '@storybook/react/standalone';
 import { Flags, run } from '@kbn/dev-utils';
 import UiSharedDepsNpm from '@kbn/ui-shared-deps-npm';
-import UiSharedDepsSrc from '@kbn/ui-shared-deps-src';
+import * as UiSharedDepsSrc from '@kbn/ui-shared-deps-src';
 import * as constants from './constants';
 
 // Convert the flags to a Storybook loglevel

packages/kbn-ui-shared-deps-src/BUILD.bazel

@@ -1,10 +1,11 @@
-load("@npm//@bazel/typescript:index.bzl", "ts_config", "ts_project")
-load("@build_bazel_rules_nodejs//:index.bzl", "js_library", "pkg_npm")
+load("@npm//@bazel/typescript:index.bzl", "ts_config")
+load("@build_bazel_rules_nodejs//:index.bzl", "js_library")
 load("@npm//webpack-cli:index.bzl", webpack = "webpack_cli")
-load("//src/dev/bazel:index.bzl", "jsts_transpiler")
+load("//src/dev/bazel:index.bzl", "jsts_transpiler", "pkg_npm", "pkg_npm_types", "ts_project")
 
 PKG_BASE_NAME = "kbn-ui-shared-deps-src"
 PKG_REQUIRE_NAME = "@kbn/ui-shared-deps-src"
+TYPES_PKG_REQUIRE_NAME = "@types/kbn__ui-shared-deps-src"
 
 SOURCE_FILES = glob(
   [
@@ -23,8 +24,6 @@ filegroup(
 )
 
 NPM_MODULE_EXTRA_FILES = [
-  "flot_charts/package.json",
-  "theme/package.json",
   "package.json",
   "README.md"
 ]
@@ -34,11 +33,13 @@ RUNTIME_DEPS = [
   "//packages/elastic-safer-lodash-set",
   "//packages/kbn-analytics",
   "//packages/kbn-babel-preset",
+  "//packages/kbn-flot-charts",
   "//packages/kbn-i18n",
   "//packages/kbn-i18n-react",
   "//packages/kbn-monaco",
   "//packages/kbn-std",
   "//packages/kbn-ui-shared-deps-npm",
+  "//packages/kbn-ui-theme",
 ]
 
 TYPES_DEPS = [
@@ -50,7 +51,7 @@ TYPES_DEPS = [
   "//packages/kbn-monaco:npm_module_types",
   "//packages/kbn-std:npm_module_types",
   "//packages/kbn-ui-shared-deps-npm:npm_module_types",
-  "@npm//@elastic/eui",
+  "//packages/kbn-ui-theme:npm_module_types",
   "@npm//webpack",
 ]
 
@@ -105,7 +106,7 @@ webpack(
 js_library(
   name = PKG_BASE_NAME,
   srcs = NPM_MODULE_EXTRA_FILES,
-  deps = RUNTIME_DEPS + [":target_node", ":tsc_types", ":shared_built_assets"],
+  deps = RUNTIME_DEPS + [":target_node", ":shared_built_assets"],
   package_name = PKG_REQUIRE_NAME,
   visibility = ["//visibility:public"],
 )
@@ -124,3 +125,20 @@ filegroup(
   ],
   visibility = ["//visibility:public"],
 )
+
+pkg_npm_types(
+  name = "npm_module_types",
+  srcs = SRCS,
+  deps = [":tsc_types"],
+  package_name = TYPES_PKG_REQUIRE_NAME,
+  tsconfig = ":tsconfig",
+  visibility = ["//visibility:public"],
+)
+
+filegroup(
+  name = "build_types",
+  srcs = [
+    ":npm_module_types",
+  ],
+  visibility = ["//visibility:public"],
+)

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

@@ -1,4 +0,0 @@
-{
-  "main": "../target_node/flot_charts/index.js",
-  "types": "../target_types/flot_charts/index.d.ts"
-}

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

@@ -3,6 +3,5 @@
   "version": "1.0.0",
   "private": true,
   "license": "SSPL-1.0 OR Elastic License 2.0",
-  "main": "target_node/index.js",
-  "types": "target_types/index.d.ts"
+  "main": "target_node/index.js"
 }

packages/kbn-ui-shared-deps-src/src/definitions.js

@@ -8,28 +8,30 @@
 
 const Path = require('path');
 
+// extracted const vars
 /**
  * Absolute path to the distributable directory
  */
-exports.distDir = Path.resolve(__dirname, '../shared_built_assets');
+const distDir = Path.resolve(__dirname, '../shared_built_assets');
 
 /**
  * Filename of the main bundle file in the distributable directory
  */
-exports.jsFilename = 'kbn-ui-shared-deps-src.js';
+const jsFilename = 'kbn-ui-shared-deps-src.js';
 
 /**
  * Filename of the main bundle file in the distributable directory
  */
-exports.cssDistFilename = 'kbn-ui-shared-deps-src.css';
+const cssDistFilename = 'kbn-ui-shared-deps-src.css';
 
 /**
  * Externals mapping inteded to be used in a webpack config
  */
-exports.externals = {
+const externals = {
   /**
    * stateful deps
    */
+  '@kbn/ui-theme': '__kbnSharedDeps__.KbnUiTheme',
   '@kbn/i18n': '__kbnSharedDeps__.KbnI18n',
   '@kbn/i18n-react': '__kbnSharedDeps__.KbnI18nReact',
   '@emotion/react': '__kbnSharedDeps__.EmotionReact',
@@ -43,7 +45,6 @@ exports.externals = {
   'react-router-dom': '__kbnSharedDeps__.ReactRouterDom',
   'styled-components': '__kbnSharedDeps__.StyledComponents',
   '@kbn/monaco': '__kbnSharedDeps__.KbnMonaco',
-  '@kbn/ui-shared-deps-src/theme': '__kbnSharedDeps__.Theme',
   // this is how plugins/consumers from npm load monaco
   'monaco-editor/esm/vs/editor/editor.api': '__kbnSharedDeps__.MonacoBarePluginApi',
 
@@ -77,3 +78,5 @@ exports.externals = {
   history: '__kbnSharedDeps__.History',
   classnames: '__kbnSharedDeps__.Classnames',
 };
+
+module.exports = { distDir, jsFilename, cssDistFilename, externals };

packages/kbn-ui-shared-deps-src/src/entry.js

@@ -11,9 +11,10 @@ require('./polyfills');
 export const Jquery = require('jquery');
 window.$ = window.jQuery = Jquery;
 // mutates window.jQuery and window.$
-require('./flot_charts');
+require('@kbn/flot-charts');
 
 // stateful deps
+export const KbnUiTheme = require('@kbn/ui-theme');
 export const KbnI18n = require('@kbn/i18n');
 export const KbnI18nReact = require('@kbn/i18n-react');
 export const EmotionReact = require('@emotion/react');
@@ -43,7 +44,6 @@ export const ElasticEuiChartsTheme = require('@elastic/eui/dist/eui_charts_theme
 export const ElasticDatemath = require('@elastic/datemath');
 export const ReactBeautifulDnD = require('react-beautiful-dnd');
 
-export const Theme = require('./theme.ts');
 export const Lodash = require('lodash');
 export const LodashFp = require('lodash/fp');
 

packages/kbn-ui-shared-deps-src/src/index.ts

@@ -0,0 +1,29 @@
+/*
+ * 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 { distDir, jsFilename, cssDistFilename, externals } from './definitions';
+
+/**
+ * Absolute path to the distributable directory
+ */
+export { distDir };
+
+/**
+ * Filename of the main bundle file in the distributable directory
+ */
+export { jsFilename };
+
+/**
+ * Filename of the main bundle file in the distributable directory
+ */
+export { cssDistFilename };
+
+/**
+ * Externals mapping inteded to be used in a webpack config
+ */
+export { externals };

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

@@ -1,4 +0,0 @@
-{
-  "main": "../target_node/theme.js",
-  "types": "../target_types/theme.d.ts"
-}

packages/kbn-ui-shared-deps-src/webpack.config.js

@@ -12,7 +12,7 @@ const webpack = require('webpack');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const UiSharedDepsNpm = require('@kbn/ui-shared-deps-npm');
 
-const UiSharedDepsSrc = require('./src');
+const { distDir: UiSharedDepsSrcDistDir } = require('./src/definitions');
 
 const MOMENT_SRC = require.resolve('moment/min/moment-with-locales.js');
 
@@ -33,7 +33,7 @@ module.exports = {
   context: __dirname,
   devtool: 'cheap-source-map',
   output: {
-    path: UiSharedDepsSrc.distDir,
+    path: UiSharedDepsSrcDistDir,
     filename: '[name].js',
     chunkFilename: 'kbn-ui-shared-deps-src.chunk.[id].js',
     sourceMapFilename: '[file].map',
@@ -56,17 +56,6 @@ module.exports = {
           },
         ],
       },
-      {
-        include: [require.resolve('./src/theme.ts')],
-        use: [
-          {
-            loader: 'babel-loader',
-            options: {
-              presets: [require.resolve('@kbn/babel-preset/webpack_preset')],
-            },
-          },
-        ],
-      },
       {
         test: /\.css$/,
         use: [MiniCssExtractPlugin.loader, 'css-loader'],

packages/kbn-ui-theme/BUILD.bazel

@@ -0,0 +1,110 @@
+load("@npm//@bazel/typescript:index.bzl", "ts_config")
+load("@build_bazel_rules_nodejs//:index.bzl", "js_library")
+load("//src/dev/bazel:index.bzl", "jsts_transpiler", "pkg_npm", "pkg_npm_types", "ts_project")
+
+PKG_BASE_NAME = "kbn-ui-theme"
+PKG_REQUIRE_NAME = "@kbn/ui-theme"
+TYPES_PKG_REQUIRE_NAME = "@types/kbn__ui-theme"
+
+SOURCE_FILES = glob(
+  [
+    "src/**/*.ts",
+  ],
+)
+
+SRCS = SOURCE_FILES
+
+filegroup(
+  name = "srcs",
+  srcs = SRCS,
+)
+
+NPM_MODULE_EXTRA_FILES = [
+  "package.json",
+]
+
+RUNTIME_DEPS = [
+  "@npm//@elastic/eui",
+]
+
+TYPES_DEPS = [
+  "@npm//@elastic/eui",
+  "@npm//@types/node",
+  "@npm//tslib",
+]
+
+jsts_transpiler(
+  name = "target_node",
+  srcs = SRCS,
+  build_pkg_name = package_name(),
+)
+
+jsts_transpiler(
+  name = "target_web",
+  srcs = SRCS,
+  build_pkg_name = package_name(),
+  web = True,
+)
+
+ts_config(
+  name = "tsconfig",
+  src = "tsconfig.json",
+  deps = [
+    "//:tsconfig.base.json",
+    "//:tsconfig.bazel.json",
+  ],
+)
+
+ts_project(
+  name = "tsc_types",
+  args = ['--pretty'],
+  srcs = SRCS,
+  deps = TYPES_DEPS,
+  declaration = True,
+  declaration_map = True,
+  emit_declaration_only = True,
+  out_dir = "target_types",
+  source_map = True,
+  root_dir = "src",
+  tsconfig = ":tsconfig",
+)
+
+js_library(
+  name = PKG_BASE_NAME,
+  srcs = NPM_MODULE_EXTRA_FILES,
+  deps = RUNTIME_DEPS + [":target_node", ":target_web"],
+  package_name = PKG_REQUIRE_NAME,
+  visibility = ["//visibility:public"],
+)
+
+pkg_npm(
+  name = "npm_module",
+  deps = [
+    ":%s" % PKG_BASE_NAME,
+  ]
+)
+
+filegroup(
+  name = "build",
+  srcs = [
+    ":npm_module",
+  ],
+  visibility = ["//visibility:public"],
+)
+
+pkg_npm_types(
+  name = "npm_module_types",
+  srcs = SRCS,
+  deps = [":tsc_types"],
+  package_name = TYPES_PKG_REQUIRE_NAME,
+  tsconfig = ":tsconfig",
+  visibility = ["//visibility:public"],
+)
+
+filegroup(
+  name = "build_types",
+  srcs = [
+    ":npm_module_types",
+  ],
+  visibility = ["//visibility:public"],
+)

packages/kbn-ui-theme/package.json

@@ -0,0 +1,8 @@
+{
+  "name": "@kbn/ui-theme",
+  "version": "1.0.0",
+  "private": true,
+  "main": "./target_node/index.js",
+  "browser": "./target_web/index.js",
+  "license": "SSPL-1.0 OR Elastic License 2.0"
+}

packages/kbn-ui-theme/src/index.ts

@@ -0,0 +1,11 @@
+/*
+ * 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.
+ */
+
+export type { Theme } from './theme';
+
+export { darkMode, euiDarkVars, euiLightVars, euiThemeVars, tag, version } from './theme';

packages/kbn-ui-theme/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "extends": "../../tsconfig.bazel.json",
+  "compilerOptions": {
+    "declaration": true,
+    "declarationMap": true,
+    "emitDeclarationOnly": true,
+    "outDir": "./target_types",
+    "sourceMap": true,
+    "sourceRoot": "../../../../packages/kbn-ui-theme/src",
+    "stripInternal": true,
+    "types": ["node"]
+  },
+  "include": ["src/**/*"]
+}

src/core/server/core_app/bundle_routes/register_bundle_routes.ts

@@ -10,7 +10,7 @@ import { join } from 'path';
 import { PackageInfo } from '@kbn/config';
 import { fromRoot } from '@kbn/utils';
 import UiSharedDepsNpm from '@kbn/ui-shared-deps-npm';
-import UiSharedDepsSrc from '@kbn/ui-shared-deps-src';
+import * as UiSharedDepsSrc from '@kbn/ui-shared-deps-src';
 import { IRouter } from '../../http';
 import { UiPlugins } from '../../plugins';
 import { FileHashCache } from './file_hash_cache';

src/core/server/rendering/bootstrap/get_js_dependency_paths.ts

@@ -7,7 +7,7 @@
  */
 
 import UiSharedDepsNpm from '@kbn/ui-shared-deps-npm';
-import UiSharedDepsSrc from '@kbn/ui-shared-deps-src';
+import * as UiSharedDepsSrc from '@kbn/ui-shared-deps-src';
 import type { PluginInfo } from './get_plugin_bundle_paths';
 
 export const getJsDependencyPaths = (

src/core/server/rendering/render_utils.ts

@@ -7,7 +7,7 @@
  */
 
 import UiSharedDepsNpm from '@kbn/ui-shared-deps-npm';
-import UiSharedDepsSrc from '@kbn/ui-shared-deps-src';
+import * as UiSharedDepsSrc from '@kbn/ui-shared-deps-src';
 import { PublicUiSettingsParams, UserProvidedValues } from '../ui_settings';
 
 export const getSettingValue = <T>(

src/plugins/charts/public/static/components/current_time.tsx

@@ -10,10 +10,7 @@ import moment, { Moment } from 'moment';
 import React, { FC } from 'react';
 
 import { LineAnnotation, AnnotationDomainType, LineAnnotationStyle } from '@elastic/charts';
-import {
-  euiLightVars as lightEuiTheme,
-  euiDarkVars as darkEuiTheme,
-} from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as lightEuiTheme, euiDarkVars as darkEuiTheme } from '@kbn/ui-theme';
 
 interface CurrentTimeProps {
   isDarkMode: boolean;

src/plugins/charts/public/static/components/endzones.tsx

@@ -17,10 +17,7 @@ import {
 } from '@elastic/charts';
 import { i18n } from '@kbn/i18n';
 import { EuiFlexGroup, EuiFlexItem, EuiIcon, EuiSpacer } from '@elastic/eui';
-import {
-  euiLightVars as lightEuiTheme,
-  euiDarkVars as darkEuiTheme,
-} from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as lightEuiTheme, euiDarkVars as darkEuiTheme } from '@kbn/ui-theme';
 
 interface EndzonesProps {
   isDarkMode: boolean;

src/plugins/data_view_editor/public/components/form_fields/type_field.tsx

@@ -8,7 +8,7 @@
 
 import React from 'react';
 import { i18n } from '@kbn/i18n';
-import { euiLightVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars } from '@kbn/ui-theme';
 import { FormattedMessage } from '@kbn/i18n-react';
 
 import {

src/plugins/dev_tools/public/application.tsx

@@ -13,7 +13,7 @@ import { HashRouter as Router, Switch, Route, Redirect } from 'react-router-dom'
 import { EuiTab, EuiTabs, EuiToolTip, EuiBetaBadge } from '@elastic/eui';
 import { I18nProvider } from '@kbn/i18n-react';
 import { i18n } from '@kbn/i18n';
-import { euiThemeVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiThemeVars } from '@kbn/ui-theme';
 
 import { ApplicationStart, ChromeStart, ScopedHistory, CoreTheme } from 'src/core/public';
 import { KibanaThemeProvider } from '../../kibana_react/public';

src/plugins/discover/public/components/discover_grid/discover_grid_document_selection.tsx

@@ -17,10 +17,7 @@ import {
   EuiDataGridCellValueElementProps,
 } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n-react';
-import {
-  euiLightVars as themeLight,
-  euiDarkVars as themeDark,
-} from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as themeLight, euiDarkVars as themeDark } from '@kbn/ui-theme';
 import { DiscoverGridContext } from './discover_grid_context';
 import { ElasticSearchHit } from '../../types';
 

src/plugins/discover/public/components/discover_grid/discover_grid_expand_button.tsx

@@ -8,10 +8,7 @@
 
 import React, { useContext, useEffect } from 'react';
 import { EuiButtonIcon, EuiDataGridCellValueElementProps, EuiToolTip } from '@elastic/eui';
-import {
-  euiLightVars as themeLight,
-  euiDarkVars as themeDark,
-} from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as themeLight, euiDarkVars as themeDark } from '@kbn/ui-theme';
 import { i18n } from '@kbn/i18n';
 import { DiscoverGridContext } from './discover_grid_context';
 import { EsHitRecord } from '../../application/types';

src/plugins/discover/public/components/discover_grid/get_render_cell_value.tsx

@@ -7,10 +7,7 @@
  */
 
 import React, { Fragment, useContext, useEffect } from 'react';
-import {
-  euiLightVars as themeLight,
-  euiDarkVars as themeDark,
-} from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as themeLight, euiDarkVars as themeDark } from '@kbn/ui-theme';
 import type { DataView } from 'src/plugins/data/common';
 
 import {

src/plugins/discover/public/components/doc_table/components/pager/tool_bar_pagination.tsx

@@ -18,7 +18,7 @@ import {
 } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n-react';
 import { i18n } from '@kbn/i18n';
-import { euiLightVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars } from '@kbn/ui-theme';
 
 interface ToolBarPaginationProps {
   pageSize: number;

src/plugins/expressions/public/react_expression_renderer.tsx

@@ -12,7 +12,7 @@ import { Observable, Subscription } from 'rxjs';
 import { filter } from 'rxjs/operators';
 import useShallowCompareEffect from 'react-use/lib/useShallowCompareEffect';
 import { EuiLoadingChart, EuiProgress } from '@elastic/eui';
-import { euiLightVars as theme } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as theme } from '@kbn/ui-theme';
 import { IExpressionLoaderParams, ExpressionRenderError, ExpressionRendererEvent } from './types';
 import { ExpressionAstExpression, IInterpreterRenderHandlers } from '../common';
 import { ExpressionLoader } from './loader';

src/plugins/home/public/application/components/tutorial/instruction_set.js

@@ -27,7 +27,7 @@ import {
 import * as StatusCheckStates from './status_check_states';
 
 import { injectI18n, FormattedMessage } from '@kbn/i18n-react';
-import { euiThemeVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiThemeVars } from '@kbn/ui-theme';
 
 class InstructionSetUi extends React.Component {
   constructor(props) {

src/plugins/interactive_setup/public/cluster_configuration_form.tsx

@@ -38,7 +38,7 @@ import useUpdateEffect from 'react-use/lib/useUpdateEffect';
 
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n-react';
-import { euiThemeVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiThemeVars } from '@kbn/ui-theme';
 
 import type { Certificate } from '../common';
 import { DocLink } from './doc_link';

src/plugins/interactive_setup/public/single_chars_field.tsx

@@ -13,7 +13,7 @@ import useList from 'react-use/lib/useList';
 import useUpdateEffect from 'react-use/lib/useUpdateEffect';
 
 import { i18n } from '@kbn/i18n';
-import { euiThemeVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiThemeVars } from '@kbn/ui-theme';
 
 export interface SingleCharsFieldProps {
   defaultValue: string;

src/plugins/interactive_setup/public/use_verification.tsx

@@ -11,7 +11,7 @@ import constate from 'constate';
 import type { FunctionComponent } from 'react';
 import React, { useEffect, useRef, useState } from 'react';
 
-import { euiThemeVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiThemeVars } from '@kbn/ui-theme';
 
 import { useKibana } from './use_kibana';
 import { VerificationCodeForm } from './verification_code_form';

src/plugins/kibana_react/common/eui_styled_components.tsx

@@ -10,7 +10,7 @@ import type { DecoratorFn } from '@storybook/react';
 import React from 'react';
 import * as styledComponents from 'styled-components';
 import { ThemedStyledComponentsModule, ThemeProvider, ThemeProviderProps } from 'styled-components';
-import { euiThemeVars, euiLightVars, euiDarkVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiThemeVars, euiLightVars, euiDarkVars } from '@kbn/ui-theme';
 
 export interface EuiTheme {
   eui: typeof euiThemeVars;

src/plugins/kibana_react/public/code_editor/code_editor_field.tsx

@@ -7,10 +7,7 @@
  */
 
 import React from 'react';
-import {
-  euiLightVars as lightTheme,
-  euiDarkVars as darkTheme,
-} from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as lightTheme, euiDarkVars as darkTheme } from '@kbn/ui-theme';
 import { EuiFormControlLayout } from '@elastic/eui';
 import { CodeEditor, Props } from './code_editor';
 

src/plugins/kibana_react/public/code_editor/editor_theme.ts

@@ -8,10 +8,7 @@
 
 import { monaco } from '@kbn/monaco';
 
-import {
-  euiLightVars as lightTheme,
-  euiDarkVars as darkTheme,
-} from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as lightTheme, euiDarkVars as darkTheme } from '@kbn/ui-theme';
 
 // NOTE: For talk around where this theme information will ultimately live,
 // please see this discuss issue: https://github.com/elastic/kibana/issues/43814

src/plugins/vis_types/vega/public/data_model/vega_parser.test.js

@@ -7,7 +7,7 @@
  */
 import { cloneDeep } from 'lodash';
 import 'jest-canvas-mock';
-import { euiThemeVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiThemeVars } from '@kbn/ui-theme';
 import { VegaParser } from './vega_parser';
 import { bypassExternalUrlCheck } from '../vega_view/vega_base_view';
 

src/plugins/vis_types/vega/public/data_model/vega_parser.ts

@@ -11,7 +11,7 @@ import schemaParser from 'vega-schema-url-parser';
 import versionCompare from 'compare-versions';
 import hjson from 'hjson';
 import { euiPaletteColorBlind } from '@elastic/eui';
-import { euiThemeVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiThemeVars } from '@kbn/ui-theme';
 import { i18n } from '@kbn/i18n';
 
 import { logger, Warn, None, version as vegaVersion } from 'vega';

src/plugins/vis_types/vislib/public/vislib/components/tooltip/tooltip.js

@@ -12,7 +12,7 @@ import $ from 'jquery';
 
 import { Binder } from '../../lib/binder';
 import { positionTooltip } from './position_tooltip';
-import { euiLightVars as theme } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as theme } from '@kbn/ui-theme';
 
 let allContents = [];
 

x-pack/plugins/apm/common/viz_colors.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiLightVars as lightTheme } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as lightTheme } from '@kbn/ui-theme';
 
 function getVizColorsForTheme(theme = lightTheme) {
   return [

x-pack/plugins/apm/public/application/uxApp.tsx

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiLightVars, euiDarkVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars, euiDarkVars } from '@kbn/ui-theme';
 import { EuiErrorBoundary } from '@elastic/eui';
 import { AppMountParameters, CoreStart } from 'kibana/public';
 import React from 'react';

x-pack/plugins/apm/public/components/app/rum_dashboard/page_load_distribution/percentile_annotations.tsx

@@ -13,7 +13,7 @@ import {
   LineAnnotationStyle,
   Position,
 } from '@elastic/charts';
-import { euiLightVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars } from '@kbn/ui-theme';
 import { EuiToolTip } from '@elastic/eui';
 
 interface Props {

x-pack/plugins/apm/public/components/app/rum_dashboard/url_filter/url_search/render_option.tsx

@@ -8,7 +8,7 @@
 import React, { ReactNode } from 'react';
 import { EuiHighlight, EuiSelectableOption } from '@elastic/eui';
 import styled from 'styled-components';
-import { euiLightVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars } from '@kbn/ui-theme';
 
 const StyledSpan = styled.span`
   color: ${euiLightVars.euiColorSuccessText};

x-pack/plugins/apm/public/components/app/service_map/Controls.test.tsx

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiLightVars as lightTheme } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as lightTheme } from '@kbn/ui-theme';
 import { render } from '@testing-library/react';
 import cytoscape from 'cytoscape';
 import React, { ReactNode } from 'react';

x-pack/plugins/apm/public/components/routing/app_root.tsx

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiLightVars, euiDarkVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars, euiDarkVars } from '@kbn/ui-theme';
 import { RouteRenderer, RouterProvider } from '@kbn/typed-react-router-config';
 import React from 'react';
 import { Route } from 'react-router-dom';

x-pack/plugins/apm/public/utils/httpStatusCodeToColor.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiLightVars as theme } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as theme } from '@kbn/ui-theme';
 const { euiColorDarkShade, euiColorWarning } = theme;
 
 export const errorColor = '#c23c2b';

x-pack/plugins/apm/server/routes/metrics/by_agent/java/gc/fetch_and_transform_gc_metrics.ts

@@ -6,7 +6,7 @@
  */
 
 import { sum, round } from 'lodash';
-import { euiLightVars as theme } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as theme } from '@kbn/ui-theme';
 import { isFiniteNumber } from '../../../../../../common/utils/is_finite_number';
 import { Setup } from '../../../../../lib/helpers/setup_request';
 import { getMetricsDateHistogramParams } from '../../../../../lib/helpers/metrics';

x-pack/plugins/apm/server/routes/metrics/by_agent/java/gc/get_gc_rate_chart.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiLightVars as theme } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as theme } from '@kbn/ui-theme';
 import { i18n } from '@kbn/i18n';
 import { METRIC_JAVA_GC_COUNT } from '../../../../../../common/elasticsearch_fieldnames';
 import { Setup } from '../../../../../lib/helpers/setup_request';

x-pack/plugins/apm/server/routes/metrics/by_agent/java/gc/get_gc_time_chart.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiLightVars as theme } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as theme } from '@kbn/ui-theme';
 import { i18n } from '@kbn/i18n';
 import { METRIC_JAVA_GC_TIME } from '../../../../../../common/elasticsearch_fieldnames';
 import { Setup } from '../../../../../lib/helpers/setup_request';

x-pack/plugins/apm/server/routes/metrics/by_agent/java/heap_memory/index.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiLightVars as theme } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as theme } from '@kbn/ui-theme';
 import { i18n } from '@kbn/i18n';
 import {
   METRIC_JAVA_HEAP_MEMORY_MAX,

x-pack/plugins/apm/server/routes/metrics/by_agent/java/non_heap_memory/index.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiLightVars as theme } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as theme } from '@kbn/ui-theme';
 import { i18n } from '@kbn/i18n';
 import {
   METRIC_JAVA_NON_HEAP_MEMORY_MAX,

x-pack/plugins/apm/server/routes/metrics/by_agent/java/thread_count/index.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiLightVars as theme } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as theme } from '@kbn/ui-theme';
 import { i18n } from '@kbn/i18n';
 import {
   METRIC_JAVA_THREAD_COUNT,

x-pack/plugins/apm/server/routes/metrics/by_agent/shared/cpu/index.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiLightVars as theme } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as theme } from '@kbn/ui-theme';
 import { i18n } from '@kbn/i18n';
 import {
   METRIC_SYSTEM_CPU_PERCENT,

x-pack/plugins/apm/server/routes/metrics/fetch_and_transform_metrics.ts

@@ -6,7 +6,7 @@
  */
 
 import { Unionize } from 'utility-types';
-import { euiLightVars as theme } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as theme } from '@kbn/ui-theme';
 import { QueryDslQueryContainer } from '@elastic/elasticsearch/lib/api/types';
 import { getVizColorForIndex } from '../../../common/viz_colors';
 import { AggregationOptionsByType } from '../../../../../../src/core/types/elasticsearch';

x-pack/plugins/canvas/shareable_runtime/api/index.ts

@@ -9,6 +9,6 @@ import 'core-js/stable';
 import 'regenerator-runtime/runtime';
 import 'whatwg-fetch';
 import 'jquery';
-import '@kbn/ui-shared-deps-src/flot_charts';
+import '@kbn/flot-charts';
 
 export * from './shareable';

x-pack/plugins/cases/public/common/mock/test_providers.tsx

@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import { euiDarkVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiDarkVars } from '@kbn/ui-theme';
 import { I18nProvider } from '@kbn/i18n-react';
 import { ThemeProvider } from 'styled-components';
 

x-pack/plugins/cases/public/components/header_page/index.test.tsx

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiDarkVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiDarkVars } from '@kbn/ui-theme';
 import { shallow } from 'enzyme';
 import React from 'react';
 

x-pack/plugins/cases/public/components/utility_bar/utility_bar.test.tsx

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiDarkVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiDarkVars } from '@kbn/ui-theme';
 import { mount, shallow } from 'enzyme';
 import React from 'react';
 import { TestProviders } from '../../common/mock';

x-pack/plugins/data_visualizer/public/application/common/components/stats_table/hooks/use_color_range.ts

@@ -7,10 +7,7 @@
 
 import d3 from 'd3';
 import { useMemo } from 'react';
-import {
-  euiLightVars as euiThemeLight,
-  euiDarkVars as euiThemeDark,
-} from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as euiThemeLight, euiDarkVars as euiThemeDark } from '@kbn/ui-theme';
 
 import { i18n } from '@kbn/i18n';
 

x-pack/plugins/fleet/public/applications/fleet/sections/agents/components/agent_health.tsx

@@ -9,7 +9,7 @@ import React from 'react';
 import { FormattedMessage, FormattedRelative } from '@kbn/i18n-react';
 import { EuiBadge, EuiToolTip } from '@elastic/eui';
 
-import { euiLightVars as euiVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as euiVars } from '@kbn/ui-theme';
 
 import type { Agent } from '../../../types';
 

x-pack/plugins/fleet/public/applications/fleet/sections/agents/services/agent_status.tsx

@@ -7,7 +7,7 @@
 
 import { euiPaletteColorBlindBehindText } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
-import { euiLightVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars } from '@kbn/ui-theme';
 
 import type { SimplifiedAgentStatus } from '../../../types';
 

x-pack/plugins/lens/public/shared_components/coloring/utils.ts

@@ -7,7 +7,7 @@
 
 import chroma from 'chroma-js';
 import { PaletteOutput, PaletteRegistry } from 'src/plugins/charts/public';
-import { euiLightVars, euiDarkVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars, euiDarkVars } from '@kbn/ui-theme';
 import { isColorDark } from '@elastic/eui';
 import type { Datatable } from 'src/plugins/expressions/public';
 import {

x-pack/plugins/lens/public/xy_visualization/color_assignment.ts

@@ -8,7 +8,7 @@
 import { uniq, mapValues } from 'lodash';
 import type { PaletteOutput, PaletteRegistry } from 'src/plugins/charts/public';
 import type { Datatable } from 'src/plugins/expressions';
-import { euiLightVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars } from '@kbn/ui-theme';
 import type { AccessorConfig, FramePublicAPI } from '../types';
 import { getColumnToLabelMap } from './state_helpers';
 import { FormatFactory, LayerType, layerTypes } from '../../common';

x-pack/plugins/lens/public/xy_visualization/expression_reference_lines.tsx

@@ -12,7 +12,7 @@ import { EuiIcon } from '@elastic/eui';
 import { RectAnnotation, AnnotationDomainType, LineAnnotation, Position } from '@elastic/charts';
 import type { PaletteRegistry } from 'src/plugins/charts/public';
 import type { FieldFormat } from 'src/plugins/field_formats/common';
-import { euiLightVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars } from '@kbn/ui-theme';
 import type { LayerArgs, YConfig } from '../../common/expressions';
 import type { LensMultiTable } from '../../common/types';
 import { hasIcon } from './xy_config_panel/reference_line_panel';

x-pack/plugins/maps/public/reducers/map/default_map_settings.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiThemeVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiThemeVars } from '@kbn/ui-theme';
 import { INITIAL_LOCATION, MAX_ZOOM, MIN_ZOOM } from '../../../common/constants';
 import { MapSettings } from './types';
 

x-pack/plugins/ml/common/util/group_color_utils.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { euiDarkVars as euiVars } from '@kbn/ui-shared-deps-src/theme';
+import { euiDarkVars as euiVars } from '@kbn/ui-theme';
 
 import { stringHash } from './string_utils';
 

x-pack/plugins/ml/public/application/components/color_range_legend/use_color_range.ts

@@ -7,10 +7,7 @@
 
 import d3 from 'd3';
 import { useMemo } from 'react';
-import {
-  euiLightVars as euiThemeLight,
-  euiDarkVars as euiThemeDark,
-} from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as euiThemeLight, euiDarkVars as euiThemeDark } from '@kbn/ui-theme';
 
 import { i18n } from '@kbn/i18n';
 

x-pack/plugins/ml/public/application/components/job_messages/job_messages.tsx

@@ -17,7 +17,7 @@ import {
 
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n-react';
-import { euiLightVars as theme } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as theme } from '@kbn/ui-theme';
 
 import { JobMessage } from '../../../../common/types/audit_message';
 import { JobIcon } from '../job_message_icon';

x-pack/plugins/ml/public/application/components/scatterplot_matrix/scatterplot_matrix.test.tsx

@@ -10,7 +10,7 @@ import { render, waitFor, screen } from '@testing-library/react';
 
 import { __IntlProvider as IntlProvider } from '@kbn/i18n-react';
 
-import { euiLightVars as euiThemeLight } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as euiThemeLight } from '@kbn/ui-theme';
 
 import { ScatterplotMatrix } from './scatterplot_matrix';
 

x-pack/plugins/ml/public/application/components/scatterplot_matrix/scatterplot_matrix_vega_lite_spec.test.ts

@@ -10,7 +10,7 @@ import 'jest-canvas-mock';
 // @ts-ignore
 import { compile } from 'vega-lite/build/vega-lite';
 
-import { euiLightVars as euiThemeLight } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as euiThemeLight } from '@kbn/ui-theme';
 
 import { LEGEND_TYPES } from '../vega_chart/common';
 

x-pack/plugins/ml/public/application/components/scatterplot_matrix/scatterplot_matrix_vega_lite_spec.ts

@@ -9,7 +9,7 @@
 // @ts-ignore
 import type { TopLevelSpec } from 'vega-lite/build/vega-lite';
 
-import { euiLightVars as euiThemeLight } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as euiThemeLight } from '@kbn/ui-theme';
 
 import { euiPaletteColorBlind, euiPaletteNegative, euiPalettePositive } from '@elastic/eui';
 

x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_exploration/components/classification_exploration/get_roc_curve_chart_vega_lite_spec.tsx

@@ -10,7 +10,7 @@
 import type { TopLevelSpec } from 'vega-lite/build/vega-lite';
 
 import { euiPaletteColorBlind, euiPaletteGray } from '@elastic/eui';
-import { euiLightVars as euiThemeLight } from '@kbn/ui-shared-deps-src/theme';
+import { euiLightVars as euiThemeLight } from '@kbn/ui-theme';
 
 import { i18n } from '@kbn/i18n';