Extract core's browser-side theme service to packages (#133894)

* Extract core's browser-side theme service to packages

* start fixing imports

* fix imports

* export service constructor option type

* lint

* update readme

* update generated doc

* update codeowners for /packages/core

.github/CODEOWNERS

@@ -276,6 +276,7 @@
 /x-pack/plugins/saved_objects_tagging/ @elastic/kibana-core
 /x-pack/test/saved_objects_field_count/ @elastic/kibana-core
 /x-pack/test/saved_object_tagging/ @elastic/kibana-core
+/packages/core/  @elastic/kibana-core
 /packages/analytics/ @elastic/kibana-core
 /packages/kbn-config-schema/ @elastic/kibana-core
 /packages/kbn-std/ @elastic/kibana-core

docs/development/core/public/kibana-plugin-core-public.appmountparameters.md

@@ -20,5 +20,5 @@ export interface AppMountParameters<HistoryLocationState = unknown>
 |  [history](./kibana-plugin-core-public.appmountparameters.history.md) | ScopedHistory&lt;HistoryLocationState&gt; | A scoped history instance for your application. Should be used to wire up your applications Router. |
 |  [onAppLeave](./kibana-plugin-core-public.appmountparameters.onappleave.md) | (handler: AppLeaveHandler) =&gt; void | A function that can be used to register a handler that will be called when the user is leaving the current application, allowing to prompt a confirmation message before actually changing the page.<!-- -->This will be called either when the user goes to another application, or when trying to close the tab or manually changing the url. |
 |  [setHeaderActionMenu](./kibana-plugin-core-public.appmountparameters.setheaderactionmenu.md) | (menuMount: MountPoint \| undefined) =&gt; void | A function that can be used to set the mount point used to populate the application action container in the chrome header.<!-- -->Calling the handler multiple time will erase the current content of the action menu with the mount from the latest call. Calling the handler with <code>undefined</code> will unmount the current mount point. Calling the handler after the application has been unmounted will have no effect. |
-|  [theme$](./kibana-plugin-core-public.appmountparameters.theme_.md) | Observable&lt;CoreTheme&gt; | An observable emitting [Core's theme](./kibana-plugin-core-public.coretheme.md)<!-- -->. Should be used when mounting the application to include theme information. |
+|  [theme$](./kibana-plugin-core-public.appmountparameters.theme_.md) | Observable&lt;CoreTheme&gt; | An observable emitting . Should be used when mounting the application to include theme information. |
 

docs/development/core/public/kibana-plugin-core-public.appmountparameters.theme_.md

@@ -4,7 +4,7 @@
 
 ## AppMountParameters.theme$ property
 
-An observable emitting [Core's theme](./kibana-plugin-core-public.coretheme.md)<!-- -->. Should be used when mounting the application to include theme information.
+An observable emitting . Should be used when mounting the application to include theme information.
 
 <b>Signature:</b>
 

docs/development/core/public/kibana-plugin-core-public.coresetup.md

@@ -24,6 +24,6 @@ export interface CoreSetup<TPluginsStart extends object = object, TStart = unkno
 |  [http](./kibana-plugin-core-public.coresetup.http.md) | HttpSetup | [HttpSetup](./kibana-plugin-core-public.httpsetup.md) |
 |  [injectedMetadata](./kibana-plugin-core-public.coresetup.injectedmetadata.md) | InjectedMetadataSetup |  |
 |  [notifications](./kibana-plugin-core-public.coresetup.notifications.md) | NotificationsSetup | [NotificationsSetup](./kibana-plugin-core-public.notificationssetup.md) |
-|  [theme](./kibana-plugin-core-public.coresetup.theme.md) | ThemeServiceSetup | [ThemeServiceSetup](./kibana-plugin-core-public.themeservicesetup.md) |
+|  [theme](./kibana-plugin-core-public.coresetup.theme.md) | ThemeServiceSetup |  |
 |  [uiSettings](./kibana-plugin-core-public.coresetup.uisettings.md) | IUiSettingsClient | [IUiSettingsClient](./kibana-plugin-core-public.iuisettingsclient.md) |
 

docs/development/core/public/kibana-plugin-core-public.coresetup.theme.md

@@ -4,7 +4,6 @@
 
 ## CoreSetup.theme property
 
-[ThemeServiceSetup](./kibana-plugin-core-public.themeservicesetup.md)
 
 <b>Signature:</b>
 

docs/development/core/public/kibana-plugin-core-public.corestart.md

@@ -29,6 +29,6 @@ export interface CoreStart
 |  [notifications](./kibana-plugin-core-public.corestart.notifications.md) | NotificationsStart | [NotificationsStart](./kibana-plugin-core-public.notificationsstart.md) |
 |  [overlays](./kibana-plugin-core-public.corestart.overlays.md) | OverlayStart | [OverlayStart](./kibana-plugin-core-public.overlaystart.md) |
 |  [savedObjects](./kibana-plugin-core-public.corestart.savedobjects.md) | SavedObjectsStart | [SavedObjectsStart](./kibana-plugin-core-public.savedobjectsstart.md) |
-|  [theme](./kibana-plugin-core-public.corestart.theme.md) | ThemeServiceStart | [ThemeServiceStart](./kibana-plugin-core-public.themeservicestart.md) |
+|  [theme](./kibana-plugin-core-public.corestart.theme.md) | ThemeServiceStart |  |
 |  [uiSettings](./kibana-plugin-core-public.corestart.uisettings.md) | IUiSettingsClient | [IUiSettingsClient](./kibana-plugin-core-public.iuisettingsclient.md) |
 

docs/development/core/public/kibana-plugin-core-public.corestart.theme.md

@@ -4,7 +4,6 @@
 
 ## CoreStart.theme property
 
-[ThemeServiceStart](./kibana-plugin-core-public.themeservicestart.md)
 
 <b>Signature:</b>
 

docs/development/core/public/kibana-plugin-core-public.coretheme.darkmode.md

@@ -1,13 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [kibana-plugin-core-public](./kibana-plugin-core-public.md) &gt; [CoreTheme](./kibana-plugin-core-public.coretheme.md) &gt; [darkMode](./kibana-plugin-core-public.coretheme.darkmode.md)
-
-## CoreTheme.darkMode property
-
-is dark mode enabled or not
-
-<b>Signature:</b>
-
-```typescript
-readonly darkMode: boolean;
-```

docs/development/core/public/kibana-plugin-core-public.coretheme.md

@@ -1,20 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [kibana-plugin-core-public](./kibana-plugin-core-public.md) &gt; [CoreTheme](./kibana-plugin-core-public.coretheme.md)
-
-## CoreTheme interface
-
-Contains all the required information to apply Kibana's theme at the various levels it can be used.
-
-<b>Signature:</b>
-
-```typescript
-export interface CoreTheme 
-```
-
-## Properties
-
-|  Property | Type | Description |
-|  --- | --- | --- |
-|  [darkMode](./kibana-plugin-core-public.coretheme.darkmode.md) | boolean | is dark mode enabled or not |
-

docs/development/core/public/kibana-plugin-core-public.md

@@ -57,7 +57,6 @@ The plugin integrates with the core system via lifecycle events: `setup`<!-- -->
 |  [ChromeUserBanner](./kibana-plugin-core-public.chromeuserbanner.md) |  |
 |  [CoreSetup](./kibana-plugin-core-public.coresetup.md) | Core services exposed to the <code>Plugin</code> setup lifecycle |
 |  [CoreStart](./kibana-plugin-core-public.corestart.md) | Core services exposed to the <code>Plugin</code> start lifecycle |
-|  [CoreTheme](./kibana-plugin-core-public.coretheme.md) | Contains all the required information to apply Kibana's theme at the various levels it can be used. |
 |  [DeprecationsServiceStart](./kibana-plugin-core-public.deprecationsservicestart.md) | DeprecationsService provides methods to fetch domain deprecation details from the Kibana server. |
 |  [ErrorToastOptions](./kibana-plugin-core-public.errortoastoptions.md) | Options available for [IToasts](./kibana-plugin-core-public.itoasts.md) error APIs. |
 |  [ExecutionContextSetup](./kibana-plugin-core-public.executioncontextsetup.md) | Kibana execution context. Used to provide execution context to Elasticsearch, reporting, performance monitoring, etc. |
@@ -133,8 +132,6 @@ The plugin integrates with the core system via lifecycle events: `setup`<!-- -->
 |  [SavedObjectsResolveResponse](./kibana-plugin-core-public.savedobjectsresolveresponse.md) |  |
 |  [SavedObjectsStart](./kibana-plugin-core-public.savedobjectsstart.md) |  |
 |  [SavedObjectsUpdateOptions](./kibana-plugin-core-public.savedobjectsupdateoptions.md) |  |
-|  [ThemeServiceSetup](./kibana-plugin-core-public.themeservicesetup.md) |  |
-|  [ThemeServiceStart](./kibana-plugin-core-public.themeservicestart.md) |  |
 |  [ToastOptions](./kibana-plugin-core-public.toastoptions.md) | Options available for [IToasts](./kibana-plugin-core-public.itoasts.md) APIs. |
 |  [UiSettingsParams](./kibana-plugin-core-public.uisettingsparams.md) | UiSettings parameters defined by the plugins. |
 |  [UiSettingsState](./kibana-plugin-core-public.uisettingsstate.md) |  |

docs/development/core/public/kibana-plugin-core-public.themeservicesetup.md

@@ -1,19 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [kibana-plugin-core-public](./kibana-plugin-core-public.md) &gt; [ThemeServiceSetup](./kibana-plugin-core-public.themeservicesetup.md)
-
-## ThemeServiceSetup interface
-
-
-<b>Signature:</b>
-
-```typescript
-export interface ThemeServiceSetup 
-```
-
-## Properties
-
-|  Property | Type | Description |
-|  --- | --- | --- |
-|  [theme$](./kibana-plugin-core-public.themeservicesetup.theme_.md) | Observable&lt;CoreTheme&gt; |  |
-

docs/development/core/public/kibana-plugin-core-public.themeservicesetup.theme_.md

@@ -1,11 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [kibana-plugin-core-public](./kibana-plugin-core-public.md) &gt; [ThemeServiceSetup](./kibana-plugin-core-public.themeservicesetup.md) &gt; [theme$](./kibana-plugin-core-public.themeservicesetup.theme_.md)
-
-## ThemeServiceSetup.theme$ property
-
-<b>Signature:</b>
-
-```typescript
-theme$: Observable<CoreTheme>;
-```

docs/development/core/public/kibana-plugin-core-public.themeservicestart.md

@@ -1,19 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [kibana-plugin-core-public](./kibana-plugin-core-public.md) &gt; [ThemeServiceStart](./kibana-plugin-core-public.themeservicestart.md)
-
-## ThemeServiceStart interface
-
-
-<b>Signature:</b>
-
-```typescript
-export interface ThemeServiceStart 
-```
-
-## Properties
-
-|  Property | Type | Description |
-|  --- | --- | --- |
-|  [theme$](./kibana-plugin-core-public.themeservicestart.theme_.md) | Observable&lt;CoreTheme&gt; |  |
-

docs/development/core/public/kibana-plugin-core-public.themeservicestart.theme_.md

@@ -1,11 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [kibana-plugin-core-public](./kibana-plugin-core-public.md) &gt; [ThemeServiceStart](./kibana-plugin-core-public.themeservicestart.md) &gt; [theme$](./kibana-plugin-core-public.themeservicestart.theme_.md)
-
-## ThemeServiceStart.theme$ property
-
-<b>Signature:</b>
-
-```typescript
-theme$: Observable<CoreTheme>;
-```

package.json

@@ -162,6 +162,9 @@
     "@kbn/core-injected-metadata-browser-internal": "link:bazel-bin/packages/core/injected-metadata/core-injected-metadata-browser-internal",
     "@kbn/core-injected-metadata-browser-mocks": "link:bazel-bin/packages/core/injected-metadata/core-injected-metadata-browser-mocks",
     "@kbn/core-injected-metadata-common-internal": "link:bazel-bin/packages/core/injected-metadata/core-injected-metadata-common-internal",
+    "@kbn/core-theme-browser": "link:bazel-bin/packages/core/theme/core-theme-browser",
+    "@kbn/core-theme-browser-internal": "link:bazel-bin/packages/core/theme/core-theme-browser-internal",
+    "@kbn/core-theme-browser-mocks": "link:bazel-bin/packages/core/theme/core-theme-browser-mocks",
     "@kbn/crypto": "link:bazel-bin/packages/kbn-crypto",
     "@kbn/datemath": "link:bazel-bin/packages/kbn-datemath",
     "@kbn/doc-links": "link:bazel-bin/packages/kbn-doc-links",
@@ -675,6 +678,9 @@
     "@types/kbn__core-injected-metadata-common-internal": "link:bazel-bin/packages/core/injected-metadata/core-injected-metadata-common-internal/npm_module_types",
     "@types/kbn__core-public-internal-base": "link:bazel-bin/packages/core/public/internal-base/npm_module_types",
     "@types/kbn__core-server-internal-base": "link:bazel-bin/packages/core/server/internal-base/npm_module_types",
+    "@types/kbn__core-theme-browser": "link:bazel-bin/packages/core/theme/core-theme-browser/npm_module_types",
+    "@types/kbn__core-theme-browser-internal": "link:bazel-bin/packages/core/theme/core-theme-browser-internal/npm_module_types",
+    "@types/kbn__core-theme-browser-mocks": "link:bazel-bin/packages/core/theme/core-theme-browser-mocks/npm_module_types",
     "@types/kbn__crypto": "link:bazel-bin/packages/kbn-crypto/npm_module_types",
     "@types/kbn__datemath": "link:bazel-bin/packages/kbn-datemath/npm_module_types",
     "@types/kbn__dev-cli-errors": "link:bazel-bin/packages/kbn-dev-cli-errors/npm_module_types",

packages/BUILD.bazel

@@ -29,6 +29,9 @@ filegroup(
     "//packages/core/injected-metadata/core-injected-metadata-browser-mocks:build",
     "//packages/core/injected-metadata/core-injected-metadata-browser:build",
     "//packages/core/injected-metadata/core-injected-metadata-common-internal:build",
+    "//packages/core/theme/core-theme-browser-internal:build",
+    "//packages/core/theme/core-theme-browser-mocks:build",
+    "//packages/core/theme/core-theme-browser:build",
     "//packages/elastic-apm-synthtrace:build",
     "//packages/elastic-safer-lodash-set:build",
     "//packages/kbn-ace:build",
@@ -165,6 +168,9 @@ filegroup(
     "//packages/core/injected-metadata/core-injected-metadata-browser-mocks:build_types",
     "//packages/core/injected-metadata/core-injected-metadata-browser:build_types",
     "//packages/core/injected-metadata/core-injected-metadata-common-internal:build_types",
+    "//packages/core/theme/core-theme-browser-internal:build_types",
+    "//packages/core/theme/core-theme-browser-mocks:build_types",
+    "//packages/core/theme/core-theme-browser:build_types",
     "//packages/elastic-apm-synthtrace:build_types",
     "//packages/elastic-safer-lodash-set:build_types",
     "//packages/kbn-ace:build_types",

packages/core/base/core-base-common/src/index.ts

@@ -8,3 +8,4 @@
 
 export type { PluginOpaqueId, PluginName, DiscoveredPlugin } from './plugins';
 export { PluginType } from './plugins';
+export { EUI_STYLES_GLOBAL } from './eui';

packages/core/theme/core-theme-browser-internal/BUILD.bazel

@@ -0,0 +1,117 @@
+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_DIRNAME = "core-theme-browser-internal"
+PKG_REQUIRE_NAME = "@kbn/core-theme-browser-internal"
+
+SOURCE_FILES = glob(
+  [
+    "src/**/*.ts",
+    "src/**/*.tsx",
+  ],
+  exclude = [
+    "**/*.test.*",
+  ],
+)
+
+SRCS = SOURCE_FILES
+
+filegroup(
+  name = "srcs",
+  srcs = SRCS,
+)
+
+NPM_MODULE_EXTRA_FILES = [
+  "package.json",
+]
+
+RUNTIME_DEPS = [
+  "@npm//react",
+  "@npm//rxjs",
+  "@npm//@elastic/eui",
+  "@npm//@emotion/cache",
+  "@npm//react-use",
+  "//packages/core/base/core-base-common",
+]
+
+TYPES_DEPS = [
+  "@npm//@types/node",
+  "@npm//@types/jest",
+  "@npm//@types/react",
+  "@npm//rxjs",
+  "@npm//@emotion/cache",
+  "@npm//react-use",
+  "@npm//@elastic/eui",
+  "//packages/core/base/core-base-common:npm_module_types",
+  "//packages/core/injected-metadata/core-injected-metadata-browser-internal:npm_module_types",
+  "//packages/core/theme/core-theme-browser:npm_module_types",
+]
+
+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,
+  emit_declaration_only = True,
+  out_dir = "target_types",
+  root_dir = "src",
+  tsconfig = ":tsconfig",
+)
+
+js_library(
+  name = PKG_DIRNAME,
+  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 = [":" + PKG_DIRNAME],
+)
+
+filegroup(
+  name = "build",
+  srcs = [":npm_module"],
+  visibility = ["//visibility:public"],
+)
+
+pkg_npm_types(
+  name = "npm_module_types",
+  srcs = SRCS,
+  deps = [":tsc_types"],
+  package_name = PKG_REQUIRE_NAME,
+  tsconfig = ":tsconfig",
+  visibility = ["//visibility:public"],
+)
+
+filegroup(
+  name = "build_types",
+  srcs = [":npm_module_types"],
+  visibility = ["//visibility:public"],
+)

packages/core/theme/core-theme-browser-internal/README.md

@@ -0,0 +1,3 @@
+# @kbn/core-theme-browser-internal
+
+This package contains the internal types and implementation for the browser-side theme service.

packages/core/theme/core-theme-browser-internal/jest.config.js

@@ -0,0 +1,13 @@
+/*
+ * 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.
+ */
+
+module.exports = {
+  preset: '@kbn/test',
+  rootDir: '../../../..',
+  roots: ['<rootDir>/packages/core/theme/core-theme-browser-internal'],
+};

packages/core/theme/core-theme-browser-internal/package.json

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

packages/core/theme/core-theme-browser-internal/src/convert_core_theme.ts

@@ -8,7 +8,7 @@
 
 import { COLOR_MODES_STANDARD } from '@elastic/eui';
 import type { EuiThemeSystem, EuiThemeColorModeStandard } from '@elastic/eui';
-import type { CoreTheme } from './types';
+import type { CoreTheme } from '@kbn/core-theme-browser';
 
 /** @internal */
 export interface EuiTheme {

packages/core/theme/core-theme-browser-internal/src/core_theme_provider.test.tsx

@@ -13,8 +13,8 @@ import { of, BehaviorSubject } from 'rxjs';
 import { useEuiTheme } from '@elastic/eui';
 import type { UseEuiTheme } from '@elastic/eui';
 import { mountWithIntl } from '@kbn/test-jest-helpers';
+import type { CoreTheme } from '@kbn/core-theme-browser';
 import { CoreThemeProvider } from './core_theme_provider';
-import type { CoreTheme } from './types';
 
 describe('CoreThemeProvider', () => {
   let euiTheme: UseEuiTheme | undefined;

packages/core/theme/core-theme-browser-internal/src/core_theme_provider.tsx

@@ -11,8 +11,8 @@ import { Observable } from 'rxjs';
 import useObservable from 'react-use/lib/useObservable';
 import createCache from '@emotion/cache';
 import { EuiProvider, EuiProviderProps } from '@elastic/eui';
-import { EUI_STYLES_GLOBAL } from '../../utils';
-import { CoreTheme } from './types';
+import { EUI_STYLES_GLOBAL } from '@kbn/core-base-common';
+import type { CoreTheme } from '@kbn/core-theme-browser';
 import { convertCoreTheme } from './convert_core_theme';
 
 const defaultTheme: CoreTheme = {

packages/core/theme/core-theme-browser-internal/src/index.ts

@@ -7,5 +7,5 @@
  */
 
 export { ThemeService } from './theme_service';
-export type { CoreTheme, ThemeServiceSetup, ThemeServiceStart } from './types';
 export { CoreThemeProvider } from './core_theme_provider';
+export type { ThemeServiceSetupDeps } from './theme_service';

packages/core/theme/core-theme-browser-internal/src/theme_service.ts

@@ -9,17 +9,19 @@
 import { Subject, Observable, of } from 'rxjs';
 import { shareReplay, takeUntil } from 'rxjs/operators';
 import type { InternalInjectedMetadataSetup } from '@kbn/core-injected-metadata-browser-internal';
-import type { CoreTheme, ThemeServiceSetup, ThemeServiceStart } from './types';
+import type { CoreTheme, ThemeServiceSetup, ThemeServiceStart } from '@kbn/core-theme-browser';
 
-export interface SetupDeps {
+/** @internal */
+export interface ThemeServiceSetupDeps {
   injectedMetadata: InternalInjectedMetadataSetup;
 }
 
+/** @internal */
 export class ThemeService {
   private theme$?: Observable<CoreTheme>;
   private stop$ = new Subject<void>();
 
-  public setup({ injectedMetadata }: SetupDeps): ThemeServiceSetup {
+  public setup({ injectedMetadata }: ThemeServiceSetupDeps): ThemeServiceSetup {
     const theme = injectedMetadata.getTheme();
     this.theme$ = of({ darkMode: theme.darkMode });
 

packages/core/theme/core-theme-browser-internal/tsconfig.json

@@ -0,0 +1,18 @@
+{
+  "extends": "../../../../tsconfig.bazel.json",
+  "compilerOptions": {
+    "declaration": true,
+    "emitDeclarationOnly": true,
+    "outDir": "target_types",
+    "rootDir": "src",
+    "stripInternal": false,
+    "types": [
+      "jest",
+      "node",
+      "react"
+    ]
+  },
+  "include": [
+    "src/**/*"
+  ]
+}

packages/core/theme/core-theme-browser-mocks/BUILD.bazel

@@ -0,0 +1,107 @@
+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_DIRNAME = "core-theme-browser-mocks"
+PKG_REQUIRE_NAME = "@kbn/core-theme-browser-mocks"
+
+SOURCE_FILES = glob(
+  [
+    "src/**/*.ts",
+    "src/**/*.tsx",
+  ],
+  exclude = [
+    "**/*.test.*",
+  ],
+)
+
+SRCS = SOURCE_FILES
+
+filegroup(
+  name = "srcs",
+  srcs = SRCS,
+)
+
+NPM_MODULE_EXTRA_FILES = [
+  "package.json",
+]
+
+RUNTIME_DEPS = [
+  "@npm//react"
+]
+
+TYPES_DEPS = [
+  "@npm//@types/node",
+  "@npm//@types/jest",
+  "@npm//@types/react",
+  "//packages/core/theme/core-theme-browser:npm_module_types",
+  "//packages/core/theme/core-theme-browser-internal:npm_module_types"
+]
+
+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,
+  emit_declaration_only = True,
+  out_dir = "target_types",
+  root_dir = "src",
+  tsconfig = ":tsconfig",
+)
+
+js_library(
+  name = PKG_DIRNAME,
+  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 = [":" + PKG_DIRNAME],
+)
+
+filegroup(
+  name = "build",
+  srcs = [":npm_module"],
+  visibility = ["//visibility:public"],
+)
+
+pkg_npm_types(
+  name = "npm_module_types",
+  srcs = SRCS,
+  deps = [":tsc_types"],
+  package_name = PKG_REQUIRE_NAME,
+  tsconfig = ":tsconfig",
+  visibility = ["//visibility:public"],
+)
+
+filegroup(
+  name = "build_types",
+  srcs = [":npm_module_types"],
+  visibility = ["//visibility:public"],
+)

packages/core/theme/core-theme-browser-mocks/README.md

@@ -0,0 +1,3 @@
+# @kbn/core-theme-browser-mocks
+
+This package contains the mocks for the browser-side docLinks service.

packages/core/theme/core-theme-browser-mocks/jest.config.js

@@ -0,0 +1,13 @@
+/*
+ * 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.
+ */
+
+module.exports = {
+  preset: '@kbn/test',
+  rootDir: '../../../..',
+  roots: ['<rootDir>/packages/core/theme/core-theme-browser-mocks'],
+};

packages/core/theme/core-theme-browser-mocks/package.json

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

packages/core/theme/core-theme-browser-mocks/src/index.ts

@@ -0,0 +1,9 @@
+/*
+ * 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 { themeServiceMock } from './theme_service.mock';

packages/core/theme/core-theme-browser-mocks/src/theme_service.mock.ts

@@ -8,8 +8,8 @@
 
 import { of } from 'rxjs';
 import type { PublicMethodsOf } from '@kbn/utility-types';
-import type { ThemeServiceSetup, ThemeServiceStart, CoreTheme } from './types';
-import type { ThemeService } from './theme_service';
+import type { ThemeServiceSetup, ThemeServiceStart, CoreTheme } from '@kbn/core-theme-browser';
+import type { ThemeService } from '@kbn/core-theme-browser-internal';
 
 const mockTheme: CoreTheme = {
   darkMode: false,

packages/core/theme/core-theme-browser-mocks/tsconfig.json

@@ -0,0 +1,18 @@
+{
+  "extends": "../../../../tsconfig.bazel.json",
+  "compilerOptions": {
+    "declaration": true,
+    "emitDeclarationOnly": true,
+    "outDir": "target_types",
+    "rootDir": "src",
+    "stripInternal": false,
+    "types": [
+      "jest",
+      "node",
+      "react"
+    ]
+  },
+  "include": [
+    "src/**/*"
+  ]
+}

packages/core/theme/core-theme-browser/BUILD.bazel

@@ -0,0 +1,104 @@
+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_DIRNAME = "core-theme-browser"
+PKG_REQUIRE_NAME = "@kbn/core-theme-browser"
+
+SOURCE_FILES = glob(
+  [
+    "src/**/*.ts",
+    "src/**/*.tsx",
+  ],
+  exclude = [
+    "**/*.test.*",
+  ],
+)
+
+SRCS = SOURCE_FILES
+
+filegroup(
+  name = "srcs",
+  srcs = SRCS,
+)
+
+NPM_MODULE_EXTRA_FILES = [
+  "package.json",
+]
+
+RUNTIME_DEPS = [
+]
+
+TYPES_DEPS = [
+  "@npm//@types/node",
+  "@npm//@types/jest",
+  "@npm//rxjs"
+]
+
+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,
+  emit_declaration_only = True,
+  out_dir = "target_types",
+  root_dir = "src",
+  tsconfig = ":tsconfig",
+)
+
+js_library(
+  name = PKG_DIRNAME,
+  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 = [":" + PKG_DIRNAME],
+)
+
+filegroup(
+  name = "build",
+  srcs = [":npm_module"],
+  visibility = ["//visibility:public"],
+)
+
+pkg_npm_types(
+  name = "npm_module_types",
+  srcs = SRCS,
+  deps = [":tsc_types"],
+  package_name = PKG_REQUIRE_NAME,
+  tsconfig = ":tsconfig",
+  visibility = ["//visibility:public"],
+)
+
+filegroup(
+  name = "build_types",
+  srcs = [":npm_module_types"],
+  visibility = ["//visibility:public"],
+)

packages/core/theme/core-theme-browser/README.md

@@ -0,0 +1,3 @@
+# @kbn/core-theme-browser
+
+This package contains the public types for the browser-side theme service.

packages/core/theme/core-theme-browser/jest.config.js

@@ -0,0 +1,13 @@
+/*
+ * 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.
+ */
+
+module.exports = {
+  preset: '@kbn/test',
+  rootDir: '../../../..',
+  roots: ['<rootDir>/packages/core/theme/core-theme-browser'],
+};

packages/core/theme/core-theme-browser/package.json

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

packages/core/theme/core-theme-browser/src/index.ts

@@ -0,0 +1,9 @@
+/*
+ * 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 { CoreTheme, ThemeServiceSetup, ThemeServiceStart } from './types';

packages/core/theme/core-theme-browser/tsconfig.json

@@ -0,0 +1,17 @@
+{
+  "extends": "../../../../tsconfig.bazel.json",
+  "compilerOptions": {
+    "declaration": true,
+    "emitDeclarationOnly": true,
+    "outDir": "target_types",
+    "rootDir": "src",
+    "stripInternal": false,
+    "types": [
+      "jest",
+      "node"
+    ]
+  },
+  "include": [
+    "src/**/*"
+  ]
+}

src/core/public/application/application_service.mock.ts

@@ -11,7 +11,7 @@ import { BehaviorSubject, Subject } from 'rxjs';
 
 import type { MountPoint } from '../types';
 import { capabilitiesServiceMock } from './capabilities/capabilities_service.mock';
-import { themeServiceMock } from '../theme/theme_service.mock';
+import { themeServiceMock } from '@kbn/core-theme-browser-mocks';
 import { scopedHistoryMock } from './scoped_history.mock';
 import {
   ApplicationSetup,

src/core/public/application/application_service.test.ts

@@ -19,7 +19,7 @@ import { mount, shallow } from 'enzyme';
 
 import { httpServiceMock } from '../http/http_service.mock';
 import { overlayServiceMock } from '../overlays/overlay_service.mock';
-import { themeServiceMock } from '../theme/theme_service.mock';
+import { themeServiceMock } from '@kbn/core-theme-browser-mocks';
 import { MockLifecycle } from './test_types';
 import { ApplicationService } from './application_service';
 import { App, AppDeepLink, AppNavLinkStatus, AppStatus, AppUpdater, PublicAppInfo } from './types';

src/core/public/application/application_service.tsx

@@ -11,11 +11,11 @@ import { BehaviorSubject, firstValueFrom, Observable, Subject, Subscription } fr
 import { map, shareReplay, takeUntil, distinctUntilChanged, filter, take } from 'rxjs/operators';
 import { createBrowserHistory, History } from 'history';
 
+import type { PluginOpaqueId } from '@kbn/core-base-common';
+import type { ThemeServiceStart } from '@kbn/core-theme-browser';
 import { MountPoint } from '../types';
 import { HttpSetup, HttpStart } from '../http';
 import { OverlayStart } from '../overlays';
-import { PluginOpaqueId } from '../plugins';
-import type { ThemeServiceStart } from '../theme';
 import { AppRouter } from './ui';
 import { Capabilities, CapabilitiesService } from './capabilities';
 import {

src/core/public/application/integration_tests/application_service.test.tsx

@@ -16,7 +16,7 @@ import { ApplicationService } from '../application_service';
 import { httpServiceMock } from '../../http/http_service.mock';
 import { MockLifecycle } from '../test_types';
 import { overlayServiceMock } from '../../overlays/overlay_service.mock';
-import { themeServiceMock } from '../../theme/theme_service.mock';
+import { themeServiceMock } from '@kbn/core-theme-browser-mocks';
 import { AppMountParameters, AppUpdater } from '../types';
 import { Observable } from 'rxjs';
 import { MountPoint } from '../..';

src/core/public/application/integration_tests/router.test.tsx

@@ -10,7 +10,7 @@ import React from 'react';
 import { BehaviorSubject } from 'rxjs';
 import { createMemoryHistory, History, createHashHistory } from 'history';
 
-import { themeServiceMock } from '../../theme/theme_service.mock';
+import { themeServiceMock } from '@kbn/core-theme-browser-mocks';
 import { AppRouter, AppNotFound } from '../ui';
 import { MockedMounterMap, MockedMounterTuple } from '../test_types';
 import { createRenderer, createAppMounter, getUnmounter } from './utils';

src/core/public/application/types.ts

@@ -10,8 +10,8 @@ import { Observable } from 'rxjs';
 import { History } from 'history';
 import { RecursiveReadonly } from '@kbn/utility-types';
 
+import type { CoreTheme } from '@kbn/core-theme-browser';
 import { MountPoint } from '../types';
-import { CoreTheme } from '../theme';
 import { Capabilities } from './capabilities';
 import { PluginOpaqueId } from '../plugins';
 import { AppCategory } from '../../types';

src/core/public/application/ui/app_container.test.tsx

@@ -10,7 +10,7 @@ import React from 'react';
 import { act } from 'react-dom/test-utils';
 import { mountWithIntl } from '@kbn/test-jest-helpers';
 
-import { themeServiceMock } from '../../theme/theme_service.mock';
+import { themeServiceMock } from '@kbn/core-theme-browser-mocks';
 import { AppContainer } from './app_container';
 import { Mounter, AppMountParameters, AppStatus } from '../types';
 import { createMemoryHistory } from 'history';

src/core/public/application/ui/app_container.tsx

@@ -19,8 +19,8 @@ import React, {
 import { EuiLoadingElastic } from '@elastic/eui';
 
 import { i18n } from '@kbn/i18n';
+import type { CoreTheme } from '@kbn/core-theme-browser';
 import type { MountPoint } from '../../types';
-import { CoreTheme } from '../../theme';
 import { AppLeaveHandler, AppStatus, AppUnmount, Mounter } from '../types';
 import { AppNotFound } from './app_not_found_screen';
 import { ScopedHistory } from '../scoped_history';

src/core/public/application/ui/app_router.tsx

@@ -12,8 +12,8 @@ import { History } from 'history';
 import { Observable } from 'rxjs';
 import useObservable from 'react-use/lib/useObservable';
 
+import type { CoreTheme } from '@kbn/core-theme-browser';
 import type { MountPoint } from '../../types';
-import { CoreTheme } from '../../theme';
 import { AppLeaveHandler, AppStatus, Mounter } from '../types';
 import { AppContainer } from './app_container';
 import { ScopedHistory } from '../scoped_history';

src/core/public/core_app/errors/error_application.tsx

@@ -13,10 +13,10 @@ import { i18n } from '@kbn/i18n';
 import { I18nProvider } from '@kbn/i18n-react';
 
 import { EuiEmptyPrompt, EuiPage, EuiPageBody, EuiPageContent } from '@elastic/eui';
+import { CoreThemeProvider } from '@kbn/core-theme-browser-internal';
 import { UrlOverflowUi } from './url_overflow_ui';
 import { IBasePath } from '../../http';
 import { AppMountParameters } from '../../application';
-import { CoreThemeProvider } from '../../theme';
 
 interface Props {
   title?: string;

src/core/public/core_app/status/render_app.tsx

@@ -9,10 +9,10 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { I18nProvider } from '@kbn/i18n-react';
+import { CoreThemeProvider } from '@kbn/core-theme-browser-internal';
 import type { AppMountParameters } from '../../application';
 import type { HttpSetup } from '../../http';
 import type { NotificationsSetup } from '../../notifications';
-import { CoreThemeProvider } from '../../theme';
 import { StatusApp } from './status_app';
 
 interface Deps {

src/core/public/core_system.test.mocks.ts

@@ -8,6 +8,7 @@
 
 import { injectedMetadataServiceMock } from '@kbn/core-injected-metadata-browser-mocks';
 import { docLinksServiceMock } from '@kbn/core-doc-links-browser-mocks';
+import { themeServiceMock } from '@kbn/core-theme-browser-mocks';
 import { applicationServiceMock } from './application/application_service.mock';
 import { chromeServiceMock } from './chrome/chrome_service.mock';
 import { fatalErrorsServiceMock } from './fatal_errors/fatal_errors_service.mock';
@@ -20,7 +21,6 @@ import { uiSettingsServiceMock } from './ui_settings/ui_settings_service.mock';
 import { renderingServiceMock } from './rendering/rendering_service.mock';
 import { integrationsServiceMock } from './integrations/integrations_service.mock';
 import { coreAppMock } from './core_app/core_app.mock';
-import { themeServiceMock } from './theme/theme_service.mock';
 import { analyticsServiceMock } from './analytics/analytics_service.mock';
 
 export const analyticsServiceStartMock = analyticsServiceMock.createAnalyticsServiceStart();
@@ -134,6 +134,6 @@ jest.doMock('./core_app', () => ({
 
 export const MockThemeService = themeServiceMock.create();
 export const ThemeServiceConstructor = jest.fn().mockImplementation(() => MockThemeService);
-jest.doMock('./theme', () => ({
+jest.doMock('@kbn/core-theme-browser-internal', () => ({
   ThemeService: ThemeServiceConstructor,
 }));

src/core/public/core_system.ts

@@ -14,6 +14,7 @@ import {
   InternalInjectedMetadataStart,
 } from '@kbn/core-injected-metadata-browser-internal';
 import { DocLinksService } from '@kbn/core-doc-links-browser-internal';
+import { ThemeService } from '@kbn/core-theme-browser-internal';
 import { CoreSetup, CoreStart } from '.';
 import { ChromeService } from './chrome';
 import { FatalErrorsService, FatalErrorsSetup } from './fatal_errors';
@@ -28,7 +29,6 @@ import { RenderingService } from './rendering';
 import { SavedObjectsService } from './saved_objects';
 import { IntegrationsService } from './integrations';
 import { DeprecationsService } from './deprecations';
-import { ThemeService } from './theme';
 import { CoreApp } from './core_app';
 import type { InternalApplicationSetup, InternalApplicationStart } from './application/types';
 import { ExecutionContextService } from './execution_context';

src/core/public/fatal_errors/fatal_errors_service.test.ts

@@ -15,7 +15,7 @@ expect.addSnapshotSerializer({
 
 import { mockRender } from './fatal_errors_service.test.mocks';
 import { injectedMetadataServiceMock } from '@kbn/core-injected-metadata-browser-mocks';
-import { themeServiceMock } from '../theme/theme_service.mock';
+import { themeServiceMock } from '@kbn/core-theme-browser-mocks';
 
 import { FatalErrorsService } from './fatal_errors_service';
 

src/core/public/fatal_errors/fatal_errors_service.tsx

@@ -12,8 +12,8 @@ import * as Rx from 'rxjs';
 import { first, tap } from 'rxjs/operators';
 
 import type { InternalInjectedMetadataSetup } from '@kbn/core-injected-metadata-browser-internal';
+import type { ThemeServiceSetup } from '@kbn/core-theme-browser';
 import { I18nStart } from '../i18n';
-import { ThemeServiceSetup } from '../theme';
 import { CoreContextProvider } from '../utils';
 import { FatalErrorsScreen } from './fatal_errors_screen';
 import { FatalErrorInfo, getErrorInfo } from './get_error_info';

src/core/public/index.ts

@@ -31,6 +31,7 @@ import type {
   InjectedMetadataStart,
 } from '@kbn/core-injected-metadata-browser';
 import { DocLinksStart } from '@kbn/core-doc-links-browser';
+import type { ThemeServiceSetup, ThemeServiceStart } from '@kbn/core-theme-browser';
 import {
   ChromeBadge,
   ChromeBreadcrumb,
@@ -63,7 +64,6 @@ import { UiSettingsState, IUiSettingsClient } from './ui_settings';
 import { ApplicationSetup, Capabilities, ApplicationStart } from './application';
 import { SavedObjectsStart } from './saved_objects';
 import { DeprecationsServiceStart } from './deprecations';
-import type { ThemeServiceSetup, ThemeServiceStart } from './theme';
 import { ExecutionContextSetup, ExecutionContextStart } from './execution_context';
 import type { AnalyticsServiceSetup, AnalyticsServiceStart } from './analytics';
 
@@ -204,7 +204,7 @@ export type {
   ErrorToastOptions,
 } from './notifications';
 
-export type { ThemeServiceSetup, ThemeServiceStart, CoreTheme } from './theme';
+export type { ThemeServiceSetup, ThemeServiceStart, CoreTheme } from '@kbn/core-theme-browser';
 
 export type { DeprecationsServiceStart, ResolveDeprecationResponse } from './deprecations';
 

src/core/public/mocks.ts

@@ -10,6 +10,7 @@ import { createMemoryHistory } from 'history';
 import type { CoreContext } from '@kbn/core-base-browser-internal';
 import { injectedMetadataServiceMock } from '@kbn/core-injected-metadata-browser-mocks';
 import { docLinksServiceMock } from '@kbn/core-doc-links-browser-mocks';
+import { themeServiceMock } from '@kbn/core-theme-browser-mocks';
 
 // Only import types from '.' to avoid triggering default Jest mocks.
 import { PluginInitializerContext, AppMountParameters } from '.';
@@ -27,11 +28,11 @@ import { overlayServiceMock } from './overlays/overlay_service.mock';
 import { uiSettingsServiceMock } from './ui_settings/ui_settings_service.mock';
 import { savedObjectsServiceMock } from './saved_objects/saved_objects_service.mock';
 import { deprecationsServiceMock } from './deprecations/deprecations_service.mock';
-import { themeServiceMock } from './theme/theme_service.mock';
 import { executionContextServiceMock } from './execution_context/execution_context_service.mock';
 
 export { injectedMetadataServiceMock } from '@kbn/core-injected-metadata-browser-mocks';
 export { docLinksServiceMock } from '@kbn/core-doc-links-browser-mocks';
+export { themeServiceMock } from '@kbn/core-theme-browser-mocks';
 export { chromeServiceMock } from './chrome/chrome_service.mock';
 export { executionContextServiceMock } from './execution_context/execution_context_service.mock';
 export { analyticsServiceMock } from './analytics/analytics_service.mock';
@@ -45,7 +46,6 @@ export { savedObjectsServiceMock } from './saved_objects/saved_objects_service.m
 export { scopedHistoryMock } from './application/scoped_history.mock';
 export { applicationServiceMock } from './application/application_service.mock';
 export { deprecationsServiceMock } from './deprecations/deprecations_service.mock';
-export { themeServiceMock } from './theme/theme_service.mock';
 
 function createCoreSetupMock({
   basePath = '',

src/core/public/notifications/notifications_service.ts

@@ -9,8 +9,8 @@
 import { i18n } from '@kbn/i18n';
 
 import { Subscription } from 'rxjs';
+import type { ThemeServiceStart } from '@kbn/core-theme-browser';
 import { I18nStart } from '../i18n';
-import { ThemeServiceStart } from '../theme';
 import { ToastsService, ToastsSetup, ToastsStart } from './toasts';
 import { IUiSettingsClient } from '../ui_settings';
 import { OverlayStart } from '../overlays';

src/core/public/notifications/toasts/toasts_service.test.tsx

@@ -11,7 +11,7 @@ import { mockReactDomRender, mockReactDomUnmount } from './toasts_service.test.m
 import { ToastsService } from './toasts_service';
 import { ToastsApi } from './toasts_api';
 import { overlayServiceMock } from '../../overlays/overlay_service.mock';
-import { themeServiceMock } from '../../theme/theme_service.mock';
+import { themeServiceMock } from '@kbn/core-theme-browser-mocks';
 import { uiSettingsServiceMock } from '../../ui_settings/ui_settings_service.mock';
 
 const mockI18n: any = {

src/core/public/notifications/toasts/toasts_service.tsx

@@ -9,12 +9,12 @@
 import React from 'react';
 import { render, unmountComponentAtNode } from 'react-dom';
 
+import type { ThemeServiceStart } from '@kbn/core-theme-browser';
 import { I18nStart } from '../../i18n';
 import { IUiSettingsClient } from '../../ui_settings';
 import { GlobalToastList } from './global_toast_list';
 import { ToastsApi, IToasts } from './toasts_api';
 import { OverlayStart } from '../../overlays';
-import { ThemeServiceStart } from '../../theme';
 import { CoreContextProvider } from '../../utils';
 
 interface SetupDeps {

src/core/public/overlays/flyout/flyout_service.test.tsx

@@ -10,7 +10,7 @@ import { mockReactDomRender, mockReactDomUnmount } from '../overlay.test.mocks';
 
 import { mount } from 'enzyme';
 import { i18nServiceMock } from '../../i18n/i18n_service.mock';
-import { themeServiceMock } from '../../theme/theme_service.mock';
+import { themeServiceMock } from '@kbn/core-theme-browser-mocks';
 import { FlyoutService, OverlayFlyoutStart } from './flyout_service';
 import { OverlayRef } from '../types';
 

src/core/public/overlays/flyout/flyout_service.tsx

@@ -12,8 +12,8 @@ import { EuiFlyout, EuiFlyoutSize, EuiOverlayMaskProps } from '@elastic/eui';
 import React from 'react';
 import { render, unmountComponentAtNode } from 'react-dom';
 import { Subject } from 'rxjs';
+import type { ThemeServiceStart } from '@kbn/core-theme-browser';
 import { I18nStart } from '../../i18n';
-import { ThemeServiceStart } from '../../theme';
 import { MountPoint } from '../../types';
 import { OverlayRef } from '../types';
 import { MountWrapper, CoreContextProvider } from '../../utils';

src/core/public/overlays/modal/modal_service.test.tsx

@@ -11,7 +11,7 @@ import { mockReactDomRender, mockReactDomUnmount } from '../overlay.test.mocks';
 import React from 'react';
 import { mount } from 'enzyme';
 import { i18nServiceMock } from '../../i18n/i18n_service.mock';
-import { themeServiceMock } from '../../theme/theme_service.mock';
+import { themeServiceMock } from '@kbn/core-theme-browser-mocks';
 import { ModalService, OverlayModalStart } from './modal_service';
 import { mountReactNode } from '../../utils';
 import { OverlayRef } from '../types';

src/core/public/overlays/modal/modal_service.tsx

@@ -13,8 +13,8 @@ import { EuiModal, EuiConfirmModal, EuiConfirmModalProps } from '@elastic/eui';
 import React from 'react';
 import { render, unmountComponentAtNode } from 'react-dom';
 import { Subject } from 'rxjs';
+import type { ThemeServiceStart } from '@kbn/core-theme-browser';
 import { I18nStart } from '../../i18n';
-import { ThemeServiceStart } from '../../theme';
 import { MountPoint } from '../../types';
 import { OverlayRef } from '../types';
 import { MountWrapper, CoreContextProvider } from '../../utils';

src/core/public/overlays/overlay_service.ts

@@ -6,9 +6,9 @@
  * Side Public License, v 1.
  */
 
+import type { ThemeServiceStart } from '@kbn/core-theme-browser';
 import { I18nStart } from '../i18n';
 import { IUiSettingsClient } from '../ui_settings';
-import { ThemeServiceStart } from '../theme';
 import { OverlayBannersStart, OverlayBannersService } from './banners';
 import { FlyoutService, OverlayFlyoutStart } from './flyout';
 import { ModalService, OverlayModalStart } from './modal';

src/core/public/plugins/plugins_service.test.ts

@@ -23,6 +23,7 @@ import {
 
 import type { InjectedMetadataPlugin } from '@kbn/core-injected-metadata-common-internal';
 import { docLinksServiceMock } from '@kbn/core-doc-links-browser-mocks';
+import { themeServiceMock } from '@kbn/core-theme-browser-mocks';
 import { notificationServiceMock } from '../notifications/notifications_service.mock';
 import { applicationServiceMock } from '../application/application_service.mock';
 import { i18nServiceMock } from '../i18n/i18n_service.mock';
@@ -35,7 +36,6 @@ import { httpServiceMock } from '../http/http_service.mock';
 import { CoreSetup, CoreStart, PluginInitializerContext } from '..';
 import { savedObjectsServiceMock } from '../saved_objects/saved_objects_service.mock';
 import { deprecationsServiceMock } from '../deprecations/deprecations_service.mock';
-import { themeServiceMock } from '../theme/theme_service.mock';
 import { executionContextServiceMock } from '../execution_context/execution_context_service.mock';
 import { analyticsServiceMock } from '../analytics/analytics_service.mock';
 

src/core/public/public.api.md

@@ -11,6 +11,7 @@ import { AnalyticsClient } from '@kbn/analytics-client';
 import type { ButtonColor } from '@elastic/eui';
 import { ContextProviderOpts } from '@kbn/analytics-client';
 import { CoreContext } from '@kbn/core-base-browser-internal';
+import { CoreTheme } from '@kbn/core-theme-browser';
 import { DocLinksStart } from '@kbn/core-doc-links-browser';
 import { EnvironmentMode } from '@kbn/config';
 import * as estypes from '@elastic/elasticsearch/lib/api/typesWithBodyKey';
@@ -45,6 +46,8 @@ import * as Rx from 'rxjs';
 import { ShipperClassConstructor } from '@kbn/analytics-client';
 import { TelemetryCounter } from '@kbn/analytics-client';
 import { TelemetryCounterType } from '@kbn/analytics-client';
+import { ThemeServiceSetup } from '@kbn/core-theme-browser';
+import { ThemeServiceStart } from '@kbn/core-theme-browser';
 import { TransitionPromptHook } from 'history';
 import { Type } from '@kbn/config-schema';
 import { UiCounterMetricType } from '@kbn/analytics';
@@ -185,6 +188,7 @@ export interface AppMountParameters<HistoryLocationState = unknown> {
     // @deprecated
     onAppLeave: (handler: AppLeaveHandler) => void;
     setHeaderActionMenu: (menuMount: MountPoint | undefined) => void;
+    // Warning: (ae-unresolved-link) The @link reference could not be resolved: This type of declaration is not supported yet by the resolver
     theme$: Observable<CoreTheme>;
 }
 
@@ -413,6 +417,8 @@ export interface CoreSetup<TPluginsStart extends object = object, TStart = unkno
     injectedMetadata: InjectedMetadataSetup;
     // (undocumented)
     notifications: NotificationsSetup;
+    // Warning: (ae-unresolved-link) The @link reference could not be resolved: This type of declaration is not supported yet by the resolver
+    //
     // (undocumented)
     theme: ThemeServiceSetup;
     // (undocumented)
@@ -451,6 +457,8 @@ export interface CoreStart {
     overlays: OverlayStart;
     // (undocumented)
     savedObjects: SavedObjectsStart;
+    // Warning: (ae-unresolved-link) The @link reference could not be resolved: This type of declaration is not supported yet by the resolver
+    //
     // (undocumented)
     theme: ThemeServiceStart;
     // (undocumented)
@@ -474,10 +482,7 @@ export class CoreSystem {
     stop(): void;
 }
 
-// @public
-export interface CoreTheme {
-    readonly darkMode: boolean;
-}
+export { CoreTheme }
 
 // @internal (undocumented)
 export const DEFAULT_APP_CATEGORIES: Record<string, AppCategory>;
@@ -1451,17 +1456,9 @@ export { TelemetryCounter }
 
 export { TelemetryCounterType }
 
-// @public (undocumented)
-export interface ThemeServiceSetup {
-    // (undocumented)
-    theme$: Observable<CoreTheme>;
-}
+export { ThemeServiceSetup }
 
-// @public (undocumented)
-export interface ThemeServiceStart {
-    // (undocumented)
-    theme$: Observable<CoreTheme>;
-}
+export { ThemeServiceStart }
 
 // Warning: (ae-missing-release-tag) "Toast" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal)
 //

src/core/public/rendering/rendering_service.test.tsx

@@ -13,7 +13,7 @@ import { RenderingService } from './rendering_service';
 import { applicationServiceMock } from '../application/application_service.mock';
 import { chromeServiceMock } from '../chrome/chrome_service.mock';
 import { overlayServiceMock } from '../overlays/overlay_service.mock';
-import { themeServiceMock } from '../theme/theme_service.mock';
+import { themeServiceMock } from '@kbn/core-theme-browser-mocks';
 import { i18nServiceMock } from '../i18n/i18n_service.mock';
 import { BehaviorSubject } from 'rxjs';
 

src/core/public/rendering/rendering_service.tsx

@@ -10,10 +10,10 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import { pairwise, startWith } from 'rxjs/operators';
 
+import type { ThemeServiceStart } from '@kbn/core-theme-browser';
 import type { InternalChromeStart } from '../chrome';
 import type { InternalApplicationStart } from '../application';
 import type { OverlayStart } from '../overlays';
-import type { ThemeServiceStart } from '../theme';
 import type { I18nStart } from '../i18n';
 import { CoreContextProvider } from '../utils';
 import { AppWrapper } from './app_containers';

src/core/public/utils/core_context_provider.tsx

@@ -7,8 +7,8 @@
  */
 
 import React, { FC } from 'react';
-import { CoreThemeProvider } from '../theme/core_theme_provider';
-import type { ThemeServiceStart } from '../theme';
+import type { ThemeServiceStart } from '@kbn/core-theme-browser';
+import { CoreThemeProvider } from '@kbn/core-theme-browser-internal';
 import type { I18nStart } from '../i18n';
 
 interface CoreContextProviderProps {

src/core/server/rendering/views/template.tsx

@@ -8,7 +8,7 @@
 
 import React, { FunctionComponent, createElement } from 'react';
 
-import { EUI_STYLES_GLOBAL } from '../../../utils';
+import { EUI_STYLES_GLOBAL } from '@kbn/core-base-common';
 import { RenderingMetadata } from '../types';
 import { Fonts } from './fonts';
 import { Styles } from './styles';

src/core/utils/index.ts

@@ -8,4 +8,3 @@
 
 export { DEFAULT_APP_CATEGORIES } from './default_app_categories';
 export { APP_WRAPPER_CLASS } from './app_wrapper_class';
-export { EUI_STYLES_GLOBAL } from './meta';

yarn.lock

@@ -3075,6 +3075,18 @@
   version "0.0.0"
   uid ""
 
+"@kbn/core-theme-browser-internal@link:bazel-bin/packages/core/theme/core-theme-browser-internal":
+  version "0.0.0"
+  uid ""
+
+"@kbn/core-theme-browser-mocks@link:bazel-bin/packages/core/theme/core-theme-browser-mocks":
+  version "0.0.0"
+  uid ""
+
+"@kbn/core-theme-browser@link:bazel-bin/packages/core/theme/core-theme-browser":
+  version "0.0.0"
+  uid ""
+
 "@kbn/crypto@link:bazel-bin/packages/kbn-crypto":
   version "0.0.0"
   uid ""
@@ -6422,6 +6434,18 @@
   version "0.0.0"
   uid ""
 
+"@types/kbn__core-theme-browser-internal@link:bazel-bin/packages/core/theme/core-theme-browser-internal/npm_module_types":
+  version "0.0.0"
+  uid ""
+
+"@types/kbn__core-theme-browser-mocks@link:bazel-bin/packages/core/theme/core-theme-browser-mocks/npm_module_types":
+  version "0.0.0"
+  uid ""
+
+"@types/kbn__core-theme-browser@link:bazel-bin/packages/core/theme/core-theme-browser/npm_module_types":
+  version "0.0.0"
+  uid ""
+
 "@types/kbn__crypto@link:bazel-bin/packages/kbn-crypto/npm_module_types":
   version "0.0.0"
   uid ""