diff --git a/elastic_eui_flyout_system.tgz b/elastic_eui_flyout_system.tgz new file mode 100644 index 0000000000000..16a259e0c8848 Binary files /dev/null and b/elastic_eui_flyout_system.tgz differ diff --git a/elastic_eui_theme_borealis_flyout_system.tgz b/elastic_eui_theme_borealis_flyout_system.tgz new file mode 100644 index 0000000000000..9a69c8f74a1f9 Binary files /dev/null and b/elastic_eui_theme_borealis_flyout_system.tgz differ diff --git a/elastic_eui_theme_common_flyout_system.tgz b/elastic_eui_theme_common_flyout_system.tgz new file mode 100644 index 0000000000000..172c7bab59810 Binary files /dev/null and b/elastic_eui_theme_common_flyout_system.tgz differ diff --git a/package.json b/package.json index 985808d4b1b4f..319388aa9df7e 100644 --- a/package.json +++ b/package.json @@ -129,8 +129,9 @@ "@elastic/ecs": "^9.0.0", "@elastic/elasticsearch": "9.1.1", "@elastic/ems-client": "8.6.3", - "@elastic/eui": "107.0.1", - "@elastic/eui-theme-borealis": "3.6.0", + "@elastic/eui": "file:./elastic_eui_flyout_system.tgz", + "@elastic/eui-theme-borealis": "file:./elastic_eui_theme_borealis_flyout_system.tgz", + "@elastic/eui-theme-common": "file:./elastic_eui_theme_common_flyout_system.tgz", "@elastic/filesaver": "1.1.2", "@elastic/kibana-d3-color": "npm:@elastic/kibana-d3-color@2.0.1", "@elastic/monaco-esql": "^3.1.11", diff --git a/packages/kbn-dependency-ownership/src/rule.ts b/packages/kbn-dependency-ownership/src/rule.ts index a720ba1f01ad0..7d17ef626bbab 100644 --- a/packages/kbn-dependency-ownership/src/rule.ts +++ b/packages/kbn-dependency-ownership/src/rule.ts @@ -50,6 +50,7 @@ export function packageFilter(pkg: string) { // The EUI team owns the EUI packages, and are not covered by renovate pkg !== '@elastic/eui' && pkg !== '@elastic/eui-theme-borealis' && + pkg !== '@elastic/eui-theme-common' && // Operations owns node, and is not covered by renovate pkg !== '@types/node' ); diff --git a/packages/kbn-optimizer/README.mdx b/packages/kbn-optimizer/README.mdx index d95b1b735ea55..d03f02e5416fe 100644 --- a/packages/kbn-optimizer/README.mdx +++ b/packages/kbn-optimizer/README.mdx @@ -51,16 +51,16 @@ Any import in a bundle which resolves into another bundles "context" directory, ## Themes -SASS imports in bundles are automatically converted to CSS for one or more themes. In development we build the `v8light` and `v8dark` themes by default to improve build performance. When producing distributable bundles the default shifts to `*` so that the distributable bundles will include all themes, preventing the bundles from needing to be rebuilt when users change the active theme in Kibana's advanced settings. +SASS imports in bundles are automatically converted to CSS for one or more themes. In development we build the `borealislight` and `borealisdark` themes by default to improve build performance. When producing distributable bundles the default shifts to `*` so that the distributable bundles will include all themes, preventing the bundles from needing to be rebuilt when users change the active theme in Kibana's advanced settings. To customize the themes that are built for development you can specify the `KBN_OPTIMIZER_THEMES` environment variable to one or more theme tags, or use `*` to build styles for all themes. Unfortunately building more than one theme significantly impacts build performance, so try to be strategic about which themes you build. -Currently supported theme tags: `v8light`, `v8dark` +Currently supported theme tags: `borealislight`, `borealisdark` Examples: ```sh # start Kibana with only a single theme -KBN_OPTIMIZER_THEMES=v8light yarn start +KBN_OPTIMIZER_THEMES=borealislight yarn start # start Kibana with all the themes KBN_OPTIMIZER_THEMES=* yarn start diff --git a/src/core/packages/i18n/browser-internal/src/__snapshots__/i18n_service.test.tsx.snap b/src/core/packages/i18n/browser-internal/src/__snapshots__/i18n_service.test.tsx.snap index 6c40441f3d1b0..4a618cbc18ee0 100644 --- a/src/core/packages/i18n/browser-internal/src/__snapshots__/i18n_service.test.tsx.snap +++ b/src/core/packages/i18n/browser-internal/src/__snapshots__/i18n_service.test.tsx.snap @@ -127,6 +127,8 @@ exports[`#start() returns \`Context\` component 1`] = ` \\"euiFlyout.screenReaderModalDialog\\": \\"You are in a modal dialog. Press Escape or tap/click outside the dialog on the shadowed overlay to close.\\", \\"euiFlyout.screenReaderNonModalDialog\\": \\"You are in a non-modal dialog. To close the dialog, press Escape.\\", \\"euiFlyout.screenReaderFocusTrapShards\\": \\"You can still continue tabbing through other global page landmarks.\\", + \\"euiFlyoutMenu.back\\": \\"Back\\", + \\"euiFlyoutMenu.history\\": \\"History\\", \\"euiForm.addressFormErrors\\": \\"Please address the highlighted errors.\\", \\"euiFormControlLayoutClearButton.label\\": \\"Clear input\\", \\"euiFormControlLayoutDelimited.delimiterLabel\\": \\"to\\", diff --git a/src/core/packages/i18n/browser-internal/src/i18n_eui_mapping.tsx b/src/core/packages/i18n/browser-internal/src/i18n_eui_mapping.tsx index 25f0d1c9705fb..57471e3b7e7a4 100644 --- a/src/core/packages/i18n/browser-internal/src/i18n_eui_mapping.tsx +++ b/src/core/packages/i18n/browser-internal/src/i18n_eui_mapping.tsx @@ -799,6 +799,12 @@ export const getEuiContextMapping = (): EuiTokensObject => { defaultMessage: 'You can still continue tabbing through other global page landmarks.', } ), + 'euiFlyoutMenu.back': i18n.translate('core.euiFlyoutMenu.back', { + defaultMessage: 'Back', + }), + 'euiFlyoutMenu.history': i18n.translate('core.euiFlyoutMenu.history', { + defaultMessage: 'History', + }), 'euiForm.addressFormErrors': i18n.translate('core.euiForm.addressFormErrors', { defaultMessage: 'Please address the highlighted errors.', }), diff --git a/src/core/packages/injected-metadata/browser-mocks/src/injected_metadata_service.mock.ts b/src/core/packages/injected-metadata/browser-mocks/src/injected_metadata_service.mock.ts index 437bc7c15042e..032b3819ee7bd 100644 --- a/src/core/packages/injected-metadata/browser-mocks/src/injected_metadata_service.mock.ts +++ b/src/core/packages/injected-metadata/browser-mocks/src/injected_metadata_service.mock.ts @@ -43,7 +43,7 @@ const createSetupContractMock = () => { } as any), getTheme: jest.fn().mockReturnValue({ darkMode: false, - name: 'amsterdam', + name: 'borealis', version: 'v8', stylesheetPaths: { default: ['light-1.css'], diff --git a/src/core/packages/notifications/browser-internal/src/toasts/__snapshots__/error_toast.test.tsx.snap b/src/core/packages/notifications/browser-internal/src/toasts/__snapshots__/error_toast.test.tsx.snap index e24dff447febf..8a3f032f3d298 100644 --- a/src/core/packages/notifications/browser-internal/src/toasts/__snapshots__/error_toast.test.tsx.snap +++ b/src/core/packages/notifications/browser-internal/src/toasts/__snapshots__/error_toast.test.tsx.snap @@ -1,3 +1,3 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`renders matching snapshot 1`] = `"

This is the toast message

"`; +exports[`renders matching snapshot 1`] = `"

This is the toast message

"`; diff --git a/src/core/packages/rendering/server-internal/src/bootstrap/__snapshots__/render_template.test.ts.snap b/src/core/packages/rendering/server-internal/src/bootstrap/__snapshots__/render_template.test.ts.snap index 7d03a25563705..5279d90abee23 100644 --- a/src/core/packages/rendering/server-internal/src/bootstrap/__snapshots__/render_template.test.ts.snap +++ b/src/core/packages/rendering/server-internal/src/bootstrap/__snapshots__/render_template.test.ts.snap @@ -180,7 +180,7 @@ var kbnCsp = JSON.parse(document.querySelector('kbn-csp').getAttribute('data')); var kbnHardenPrototypes = JSON.parse(document.querySelector('kbn-prototype-hardening').getAttribute('data')); window.__kbnHardenPrototypes__ = kbnHardenPrototypes.hardenPrototypes; window.__kbnStrictCsp__ = kbnCsp.strictCsp; -window.__kbnThemeTag__ = 'v8light'; +window.__kbnThemeTag__ = 'borealislight'; window.__kbnPublicPath__ = {\\"foo\\": \\"bar\\"}; window.__kbnBundles__ = kbnBundlesLoader(); diff --git a/src/core/packages/rendering/server-internal/src/bootstrap/bootstrap_renderer.test.ts b/src/core/packages/rendering/server-internal/src/bootstrap/bootstrap_renderer.test.ts index 40d031cc9cd75..02c2b75b76b83 100644 --- a/src/core/packages/rendering/server-internal/src/bootstrap/bootstrap_renderer.test.ts +++ b/src/core/packages/rendering/server-internal/src/bootstrap/bootstrap_renderer.test.ts @@ -395,7 +395,7 @@ describe('bootstrapRenderer', () => { }) ); - themeName$.next('amsterdam'); + themeName$.next('borealis'); await renderer({ request, uiSettingsClient, @@ -403,7 +403,7 @@ describe('bootstrapRenderer', () => { expect(renderTemplateMock).toHaveBeenCalledWith( expect.objectContaining({ - themeTagName: 'v8', + themeTagName: 'borealis', }) ); }); diff --git a/src/core/packages/rendering/server-internal/src/bootstrap/bootstrap_renderer.ts b/src/core/packages/rendering/server-internal/src/bootstrap/bootstrap_renderer.ts index cf20a3709ed2c..7d717858a23ba 100644 --- a/src/core/packages/rendering/server-internal/src/bootstrap/bootstrap_renderer.ts +++ b/src/core/packages/rendering/server-internal/src/bootstrap/bootstrap_renderer.ts @@ -83,9 +83,7 @@ export const bootstrapRendererFactory: BootstrapRendererFactory = ({ } const colorMode = darkMode === false ? 'light' : darkMode === true ? 'dark' : 'system'; - // Amsterdam theme is called `v8` internally - // and should be kept this way for compatibility reasons. - const themeTagName = themeName === 'amsterdam' ? 'v8' : themeName; + const themeTagName = themeName; const bundlesHref = getBundlesHref(baseHref); const bundlePaths = getPluginsBundlePaths({ diff --git a/src/core/packages/rendering/server-internal/src/bootstrap/render_template.test.ts b/src/core/packages/rendering/server-internal/src/bootstrap/render_template.test.ts index 926e15c912bc9..a4894a4c246e4 100644 --- a/src/core/packages/rendering/server-internal/src/bootstrap/render_template.test.ts +++ b/src/core/packages/rendering/server-internal/src/bootstrap/render_template.test.ts @@ -11,7 +11,7 @@ import { renderTemplate } from './render_template'; function mockParams() { return { - themeTagName: 'v8', + themeTagName: 'borealis', colorMode: 'light', jsDependencyPaths: ['/js-1', '/js-2'], styleSheetPaths: ['/style-1', '/style-2'], diff --git a/src/core/packages/rendering/server-internal/src/render_utils.ts b/src/core/packages/rendering/server-internal/src/render_utils.ts index 876baaea315b0..f0baab119ab43 100644 --- a/src/core/packages/rendering/server-internal/src/render_utils.ts +++ b/src/core/packages/rendering/server-internal/src/render_utils.ts @@ -42,11 +42,7 @@ export const getScriptPaths = ({ themeName: ThemeName; }) => { if (darkMode === 'system') { - return [ - `${baseHref}/ui/bootstrap_system_theme_${ - themeName === 'borealis' ? 'borealis' : 'amsterdam' - }.js`, - ]; + return [`${baseHref}/ui/bootstrap_system_theme_borealis.js`]; } else { return []; } diff --git a/src/core/packages/rendering/server-internal/src/rendering_service.test.ts b/src/core/packages/rendering/server-internal/src/rendering_service.test.ts index 71356e29bd6ec..dd195757daa80 100644 --- a/src/core/packages/rendering/server-internal/src/rendering_service.test.ts +++ b/src/core/packages/rendering/server-internal/src/rendering_service.test.ts @@ -605,7 +605,7 @@ describe('RenderingService', () => { }); describe('start()', () => { - it('subscribes to the featureFlags.setStringValue$ observable and updates theme name accordingly', async () => { + it('subscribes to the featureFlags.setStringValue$', async () => { // setup and render added to assert the current theme name const { render } = await service.setup(mockRenderingSetupDeps); const themeName$ = new BehaviorSubject(DEFAULT_THEME_NAME); @@ -631,15 +631,11 @@ describe('RenderingService', () => { globalClient: uiSettingsServiceMock.createClient(), }; - getIsThemeBundledMock.mockImplementation((name) => ['borealis', 'amsterdam'].includes(name)); + getIsThemeBundledMock.mockImplementation((name) => name === 'borealis'); - let renderResult = await render(createKibanaRequest(), uiSettings); + const renderResult = await render(createKibanaRequest(), uiSettings); expect(getIsThemeBundledMock).toHaveBeenCalledWith('borealis'); expect(renderResult).toContain(',"name":"borealis"'); - - themeName$.next('amsterdam'); - renderResult = await render(createKibanaRequest(), uiSettings); - expect(renderResult).toContain(',"name":"amsterdam"'); }); it('falls back to the default theme if theme is not bundled', async () => { diff --git a/src/core/packages/rendering/server-internal/src/theme.test.ts b/src/core/packages/rendering/server-internal/src/theme.test.ts index e7a95548d84b4..c17205dfac860 100644 --- a/src/core/packages/rendering/server-internal/src/theme.test.ts +++ b/src/core/packages/rendering/server-internal/src/theme.test.ts @@ -10,24 +10,6 @@ import { getThemeTag, isThemeBundled } from './theme'; describe('getThemeTag', () => { - it('returns the correct value for name:amsterdam and darkMode:false', () => { - expect( - getThemeTag({ - name: 'v8', - darkMode: false, - }) - ).toEqual('v8light'); - }); - - it('returns the correct value for name:amsterdam and darkMode:true', () => { - expect( - getThemeTag({ - name: 'v8', - darkMode: true, - }) - ).toEqual('v8dark'); - }); - it('returns the correct value for other other theme names and darkMode:false', () => { expect( getThemeTag({ @@ -59,14 +41,12 @@ describe('isThemeBundled', () => { }); it('returns true when both light and dark mode theme tags are included in KBN_OPTIMIZER_THEMES', () => { - process.env.KBN_OPTIMIZER_THEMES = 'v8light,v8dark,borealislight,borealisdark'; - expect(isThemeBundled('amsterdam')).toEqual(true); + process.env.KBN_OPTIMIZER_THEMES = 'borealislight,borealisdark'; expect(isThemeBundled('borealis')).toEqual(true); }); it('returns false when either theme tag is missing in KBN_OPTIMIZER_THEMES for given theme name', () => { - process.env.KBN_OPTIMIZER_THEMES = 'v8light,borealisdark,borealisdark'; - expect(isThemeBundled('amsterdam')).toEqual(false); + process.env.KBN_OPTIMIZER_THEMES = 'borealisdark,borealisdark'; expect(isThemeBundled('borealis')).toEqual(false); }); diff --git a/src/core/packages/rendering/server-internal/src/theme.ts b/src/core/packages/rendering/server-internal/src/theme.ts index 7577944780cb1..22acd7a24d6c1 100644 --- a/src/core/packages/rendering/server-internal/src/theme.ts +++ b/src/core/packages/rendering/server-internal/src/theme.ts @@ -11,12 +11,6 @@ import type { ThemeName, ThemeTag } from '@kbn/core-ui-settings-common'; import { parseThemeTags } from '@kbn/core-ui-settings-common'; export const getThemeTag = ({ name, darkMode }: { name: string; darkMode: boolean }) => { - // Amsterdam theme is called `v8` internally - // and should be kept this way for compatibility reasons. - if (name === 'amsterdam') { - name = 'v8'; - } - return `${name}${darkMode ? 'dark' : 'light'}`; }; diff --git a/src/core/packages/rendering/server-internal/src/views/fonts.tsx b/src/core/packages/rendering/server-internal/src/views/fonts.tsx index 7eca4cfbd2a72..943d2d3e1ea3f 100644 --- a/src/core/packages/rendering/server-internal/src/views/fonts.tsx +++ b/src/core/packages/rendering/server-internal/src/views/fonts.tsx @@ -28,7 +28,7 @@ interface FontFace { } /** - * `Inter` is the latest version of `Inter UI` and used specifically in v8 of Kibana from EUI Amsterdam + * `Inter` is the latest version of `Inter UI` */ const getInter = (url: string): FontFace => { return { diff --git a/src/core/packages/theme/browser-internal/src/theme_service.test.ts b/src/core/packages/theme/browser-internal/src/theme_service.test.ts index 575d98fe40c8d..ab3a81dc9017c 100644 --- a/src/core/packages/theme/browser-internal/src/theme_service.test.ts +++ b/src/core/packages/theme/browser-internal/src/theme_service.test.ts @@ -45,7 +45,7 @@ describe('ThemeService', () => { beforeEach(() => { injectedMetadata.getTheme.mockReturnValue({ version: 'v8', - name: 'amsterdam', + name: 'borealis', darkMode: false, stylesheetPaths: { dark: ['dark-1.css'], @@ -59,13 +59,13 @@ describe('ThemeService', () => { const theme = await firstValueFrom(theme$); expect(theme).toEqual({ darkMode: false, - name: 'amsterdam', + name: 'borealis', }); }); it('sets __kbnThemeTag__ to the correct value', async () => { themeService.setup({ injectedMetadata }); - expect(window.__kbnThemeTag__).toEqual('v8light'); + expect(window.__kbnThemeTag__).toEqual('borealislight'); }); it('calls createStyleSheet with the correct parameters', async () => { @@ -90,7 +90,7 @@ describe('ThemeService', () => { beforeEach(() => { injectedMetadata.getTheme.mockReturnValue({ version: 'v8', - name: 'amsterdam', + name: 'borealis', darkMode: true, stylesheetPaths: { dark: ['dark-1.css'], @@ -104,13 +104,13 @@ describe('ThemeService', () => { const theme = await firstValueFrom(theme$); expect(theme).toEqual({ darkMode: true, - name: 'amsterdam', + name: 'borealis', }); }); it('sets __kbnThemeTag__ to the correct value', async () => { themeService.setup({ injectedMetadata }); - expect(window.__kbnThemeTag__).toEqual('v8dark'); + expect(window.__kbnThemeTag__).toEqual('borealisdark'); }); it('calls createStyleSheet with the correct parameters', async () => { @@ -135,7 +135,7 @@ describe('ThemeService', () => { beforeEach(() => { injectedMetadata.getTheme.mockReturnValue({ version: 'v8', - name: 'amsterdam', + name: 'borealis', darkMode: 'system', stylesheetPaths: { dark: ['dark-1.css'], @@ -155,10 +155,10 @@ describe('ThemeService', () => { expect(theme).toEqual({ darkMode: false, - name: 'amsterdam', + name: 'borealis', }); - expect(window.__kbnThemeTag__).toEqual('v8light'); + expect(window.__kbnThemeTag__).toEqual('borealislight'); expect(setDarkModeMock).toHaveBeenCalledTimes(1); expect(setDarkModeMock).toHaveBeenCalledWith(false); @@ -183,10 +183,10 @@ describe('ThemeService', () => { expect(theme).toEqual({ darkMode: false, - name: 'amsterdam', + name: 'borealis', }); - expect(window.__kbnThemeTag__).toEqual('v8light'); + expect(window.__kbnThemeTag__).toEqual('borealislight'); expect(setDarkModeMock).toHaveBeenCalledTimes(1); expect(setDarkModeMock).toHaveBeenCalledWith(false); @@ -203,10 +203,10 @@ describe('ThemeService', () => { expect(theme).toEqual({ darkMode: true, - name: 'amsterdam', + name: 'borealis', }); - expect(window.__kbnThemeTag__).toEqual('v8dark'); + expect(window.__kbnThemeTag__).toEqual('borealisdark'); expect(setDarkModeMock).toHaveBeenCalledTimes(1); expect(setDarkModeMock).toHaveBeenCalledWith(true); @@ -229,14 +229,14 @@ describe('ThemeService', () => { expect(await firstValueFrom(theme$)).toEqual({ darkMode: false, }); - expect(window.__kbnThemeTag__).toEqual('v8light'); + expect(window.__kbnThemeTag__).toEqual('borealislight'); handler!(true); expect(await firstValueFrom(theme$)).toEqual({ darkMode: true, }); - expect(window.__kbnThemeTag__).toEqual('v8dark'); + expect(window.__kbnThemeTag__).toEqual('borealisdark'); }); }); }); @@ -252,7 +252,7 @@ describe('ThemeService', () => { it('exposes a `theme$` observable with the values provided by the injected metadata', async () => { injectedMetadata.getTheme.mockReturnValue({ version: 'v8', - name: 'amsterdam', + name: 'borealis', darkMode: true, stylesheetPaths: { dark: [], @@ -264,7 +264,7 @@ describe('ThemeService', () => { const theme = await firstValueFrom(theme$); expect(theme).toEqual({ darkMode: true, - name: 'amsterdam', + name: 'borealis', }); }); }); diff --git a/src/core/packages/theme/browser-internal/src/theme_service.ts b/src/core/packages/theme/browser-internal/src/theme_service.ts index e79a19550bb8d..edbccebcc36ed 100644 --- a/src/core/packages/theme/browser-internal/src/theme_service.ts +++ b/src/core/packages/theme/browser-internal/src/theme_service.ts @@ -83,8 +83,6 @@ export class ThemeService { } const updateKbnThemeTag = (theme: CoreTheme) => { - const name = theme.name === 'amsterdam' ? 'v8' : theme.name; - const globals: any = typeof window === 'undefined' ? {} : window; - globals.__kbnThemeTag__ = `${name}${theme.darkMode ? 'dark' : 'light'}`; + globals.__kbnThemeTag__ = `${theme.name}${theme.darkMode ? 'dark' : 'light'}`; }; diff --git a/src/core/packages/ui-settings/common/src/theme.ts b/src/core/packages/ui-settings/common/src/theme.ts index d51d415b4b85b..99882275149e6 100644 --- a/src/core/packages/ui-settings/common/src/theme.ts +++ b/src/core/packages/ui-settings/common/src/theme.ts @@ -8,15 +8,10 @@ */ export const DEFAULT_THEME_NAME = 'borealis'; -export const SUPPORTED_THEME_NAMES = ['amsterdam', 'borealis'] as const; +export const SUPPORTED_THEME_NAMES = ['borealis'] as const; export type ThemeName = (typeof SUPPORTED_THEME_NAMES)[number]; -/** - * Theme tags of the Amsterdam theme - */ -export const ThemeAmsterdamTags = ['v8light', 'v8dark'] as const; - /** * Theme tags of the experimental Borealis theme */ @@ -26,7 +21,7 @@ export const ThemeBorealisTags = ['borealislight', 'borealisdark'] as const; * An array of all theme tags supported by Kibana. Note that this list doesn't * reflect what theme tags are available in a Kibana build. */ -export const SUPPORTED_THEME_TAGS = [...ThemeAmsterdamTags, ...ThemeBorealisTags] as const; +export const SUPPORTED_THEME_TAGS = [...ThemeBorealisTags] as const; export type ThemeTag = (typeof SUPPORTED_THEME_TAGS)[number]; export type ThemeTags = readonly ThemeTag[]; diff --git a/src/core/packages/ui-settings/server-internal/src/settings/theme.test.ts b/src/core/packages/ui-settings/server-internal/src/settings/theme.test.ts index c18a11fda10db..5dabca4b8a5c4 100644 --- a/src/core/packages/ui-settings/server-internal/src/settings/theme.test.ts +++ b/src/core/packages/ui-settings/server-internal/src/settings/theme.test.ts @@ -41,9 +41,6 @@ describe('theme settings', () => { const validate = getValidationFn(themeSettings['theme:name']); it('should only accept expected values', () => { - // TODO: Remove amsterdam theme - // https://github.com/elastic/eui-private/issues/170 - expect(() => validate('amsterdam')).not.toThrow(); expect(() => validate('borealis')).not.toThrow(); expect(() => validate(true)).toThrow(); @@ -84,9 +81,9 @@ describe('theme settings', () => { expect( getThemeSettings({ ...defaultOptions, - defaultTheme: 'amsterdam', + defaultTheme: 'borealis', })['theme:name'].value - ).toBe('amsterdam'); + ).toBe('borealis'); }); }); }); @@ -94,17 +91,17 @@ describe('theme settings', () => { describe('process.env.KBN_OPTIMIZER_THEMES handling', () => { it('defaults to properties of first tag', () => { - process.env.KBN_OPTIMIZER_THEMES = 'v8dark,v8light'; + process.env.KBN_OPTIMIZER_THEMES = 'borealisdark,borealislight'; let settings = getThemeSettings({ ...defaultOptions, isDist: false }); expect(settings['theme:darkMode'].value).toBe('enabled'); - process.env.KBN_OPTIMIZER_THEMES = 'v8light,v8dark'; + process.env.KBN_OPTIMIZER_THEMES = 'borealislight,borealisdark'; settings = getThemeSettings({ ...defaultOptions, isDist: false }); expect(settings['theme:darkMode'].value).toBe('disabled'); }); it('ignores the value when isDist is true', () => { - process.env.KBN_OPTIMIZER_THEMES = 'v8dark'; + process.env.KBN_OPTIMIZER_THEMES = 'borealisdark'; const settings = getThemeSettings({ ...defaultOptions, isDist: true }); expect(settings['theme:darkMode'].value).toBe('disabled'); }); diff --git a/src/core/packages/ui-settings/server-internal/src/settings/theme.ts b/src/core/packages/ui-settings/server-internal/src/settings/theme.ts index 87551111bf91c..44ebf09a4a1d9 100644 --- a/src/core/packages/ui-settings/server-internal/src/settings/theme.ts +++ b/src/core/packages/ui-settings/server-internal/src/settings/theme.ts @@ -115,9 +115,6 @@ export const getThemeSettings = ( // Cast to a mutable array to satisfy the `UiSettingsParams.options` type options: SUPPORTED_THEME_NAMES as Writable, optionLabels: { - amsterdam: i18n.translate('core.ui_settings.params.themeName.options.amsterdam', { - defaultMessage: 'Amsterdam', - }), borealis: i18n.translate('core.ui_settings.params.themeName.options.borealis', { defaultMessage: 'Borealis', }), diff --git a/src/core/packages/ui-settings/server-internal/src/ui_settings_config.ts b/src/core/packages/ui-settings/server-internal/src/ui_settings_config.ts index b3c125ec5e174..59be3bc7c1165 100644 --- a/src/core/packages/ui-settings/server-internal/src/ui_settings_config.ts +++ b/src/core/packages/ui-settings/server-internal/src/ui_settings_config.ts @@ -19,9 +19,6 @@ const deprecations: ConfigDeprecationProvider = ({ unused, renameFromRoot }) => ]; export const defaultThemeSchema = schema.oneOf([ - // TODO: Remove amsterdam theme - // https://github.com/elastic/eui-private/issues/170 - schema.literal('amsterdam'), schema.literal('borealis'), // Allow experimental themes schema.string(), diff --git a/src/core/public/styles/core_app/_globals_v8dark.scss b/src/core/public/styles/core_app/_globals_v8dark.scss deleted file mode 100644 index 9a2fca26223f4..0000000000000 --- a/src/core/public/styles/core_app/_globals_v8dark.scss +++ /dev/null @@ -1,8 +0,0 @@ -// v8dark global scope -// -// prepended to all .scss imports (from JS, when v8dark theme selected) - -@import '@elastic/eui/src/themes/amsterdam/colors_dark'; -@import '@elastic/eui/src/themes/amsterdam/globals'; - -$kbnThemeVersion: 'v8dark'; diff --git a/src/core/public/styles/core_app/_globals_v8light.scss b/src/core/public/styles/core_app/_globals_v8light.scss deleted file mode 100644 index 9ce3638096246..0000000000000 --- a/src/core/public/styles/core_app/_globals_v8light.scss +++ /dev/null @@ -1,8 +0,0 @@ -// v8light global scope -// -// prepended to all .scss imports (from JS, when v8light theme selected) - -@import '@elastic/eui/src/themes/amsterdam/colors_light'; -@import '@elastic/eui/src/themes/amsterdam/globals'; - -$kbnThemeVersion: 'v8light'; diff --git a/src/dev/build/tasks/generate_packages_optimized_assets.ts b/src/dev/build/tasks/generate_packages_optimized_assets.ts index 9a0c292f39697..64b8747185e5e 100644 --- a/src/dev/build/tasks/generate_packages_optimized_assets.ts +++ b/src/dev/build/tasks/generate_packages_optimized_assets.ts @@ -123,8 +123,8 @@ function categorizeAssets(assetDirs: string[]) { for (const { path, category } of assets) { if (category === 'euiTheme') { - // only track v8.light theme - if (path.includes('v8.light')) { + // only track borealis.light theme + if (path.includes('borealis.light')) { add('css', path); } continue; diff --git a/src/dev/license_checker/config.ts b/src/dev/license_checker/config.ts index 9ffb1361cc70e..db6875d593abd 100644 --- a/src/dev/license_checker/config.ts +++ b/src/dev/license_checker/config.ts @@ -91,8 +91,8 @@ export const LICENSE_OVERRIDES = { 'jsts@1.6.2': ['Eclipse Distribution License - v 1.0'], // cf. https://github.com/bjornharrtell/jsts '@mapbox/jsonlint-lines-primitives@2.0.2': ['MIT'], // license in readme https://github.com/tmcw/jsonlint '@elastic/ems-client@8.6.3': ['Elastic License 2.0'], - '@elastic/eui@107.0.1': ['Elastic License 2.0 OR AGPL-3.0-only OR SSPL-1.0'], - '@elastic/eui-theme-borealis@3.6.0': ['Elastic License 2.0 OR AGPL-3.0-only OR SSPL-1.0'], + '@elastic/eui@108.0.0': ['Elastic License 2.0 OR AGPL-3.0-only OR SSPL-1.0'], + '@elastic/eui-theme-borealis@4.0.0': ['Elastic License 2.0 OR AGPL-3.0-only OR SSPL-1.0'], 'language-subtag-registry@0.3.21': ['CC-BY-4.0'], // retired ODC‑By license https://github.com/mattcg/language-subtag-registry 'buffers@0.1.1': ['MIT'], // license in importing module https://www.npmjs.com/package/binary '@bufbuild/protobuf@2.5.2': ['Apache-2.0'], // license (Apache-2.0 AND BSD-3-Clause) diff --git a/src/platform/packages/private/kbn-ui-shared-deps-npm/webpack.config.js b/src/platform/packages/private/kbn-ui-shared-deps-npm/webpack.config.js index f688da51dae39..ebf822d6a4955 100644 --- a/src/platform/packages/private/kbn-ui-shared-deps-npm/webpack.config.js +++ b/src/platform/packages/private/kbn-ui-shared-deps-npm/webpack.config.js @@ -63,10 +63,8 @@ module.exports = (_, argv) => { '@elastic/eui', '@elastic/eui/optimize/es/components/provider/nested', '@elastic/eui/optimize/es/services/theme/warning', - '@elastic/eui/dist/eui_theme_amsterdam_light.json', - '@elastic/eui/dist/eui_theme_amsterdam_dark.json', - '@elastic/eui/dist/eui_theme_borealis_light.json', - '@elastic/eui/dist/eui_theme_borealis_dark.json', + '@elastic/eui-theme-borealis/lib/eui_theme_borealis_light.json', + '@elastic/eui-theme-borealis/lib/eui_theme_borealis_dark.json', '@elastic/eui-theme-borealis', '@elastic/numeral', '@emotion/cache', diff --git a/src/platform/packages/shared/kbn-data-grid-in-table-search/src/get_highlight_colors.ts b/src/platform/packages/shared/kbn-data-grid-in-table-search/src/get_highlight_colors.ts index 2bb3a2f6cdd23..2b9f3f46c3670 100644 --- a/src/platform/packages/shared/kbn-data-grid-in-table-search/src/get_highlight_colors.ts +++ b/src/platform/packages/shared/kbn-data-grid-in-table-search/src/get_highlight_colors.ts @@ -9,26 +9,12 @@ import type { EuiThemeComputed } from '@elastic/eui'; -const AMSTERDAM_HIGHLIGHT_COLOR = '#e5ffc0'; -const AMSTERDAM_ACTIVE_HIGHLIGHT_COLOR = '#ffc30e'; - export const getHighlightColors = (euiTheme: EuiThemeComputed<{}>) => { - // FIXME: remove once Amsterdam theme is removed - const isAmsterdamTheme = euiTheme.themeName.toLowerCase().includes('amsterdam'); - return { - highlightColor: isAmsterdamTheme ? euiTheme.colors.plainDark : euiTheme.colors.textAccent, - highlightBackgroundColor: isAmsterdamTheme - ? AMSTERDAM_HIGHLIGHT_COLOR - : euiTheme.colors.backgroundLightAccent, - activeHighlightColor: isAmsterdamTheme - ? euiTheme.colors.plainDark - : euiTheme.colors.textInverse, - activeHighlightBackgroundColor: isAmsterdamTheme - ? AMSTERDAM_ACTIVE_HIGHLIGHT_COLOR - : euiTheme.colors.backgroundFilledAccent, - activeHighlightBorderColor: isAmsterdamTheme - ? AMSTERDAM_ACTIVE_HIGHLIGHT_COLOR - : euiTheme.colors.borderStrongAccent, + highlightColor: euiTheme.colors.textAccent, + highlightBackgroundColor: euiTheme.colors.backgroundLightAccent, + activeHighlightColor: euiTheme.colors.textInverse, + activeHighlightBackgroundColor: euiTheme.colors.backgroundFilledAccent, + activeHighlightBorderColor: euiTheme.colors.borderStrongAccent, }; }; diff --git a/src/platform/packages/shared/kbn-management/settings/application/__snapshots__/query_input.test.tsx.snap b/src/platform/packages/shared/kbn-management/settings/application/__snapshots__/query_input.test.tsx.snap index 86e6a754bf394..96fee0d79aee1 100644 --- a/src/platform/packages/shared/kbn-management/settings/application/__snapshots__/query_input.test.tsx.snap +++ b/src/platform/packages/shared/kbn-management/settings/application/__snapshots__/query_input.test.tsx.snap @@ -49,7 +49,7 @@ exports[`Search should render normally 1`] = ` class="euiPopover emotion-euiPopover-inline-block" >
"` + `"
100
"` ); }); @@ -180,7 +180,7 @@ describe('Unified data table cell rendering', function () { /> ); expect(component.html()).toMatchInlineSnapshot( - `"
100
"` + `"
100
"` ); findTestSubject(component, 'docTableClosePopover').simulate('click'); expect(closePopoverMockFn).toHaveBeenCalledTimes(1); diff --git a/src/platform/packages/shared/kbn-unified-metrics-grid/src/components/flyout/hooks/use_flyout_a11y.tsx b/src/platform/packages/shared/kbn-unified-metrics-grid/src/components/flyout/hooks/use_flyout_a11y.tsx index 8117876d639e6..ad79006a71514 100644 --- a/src/platform/packages/shared/kbn-unified-metrics-grid/src/components/flyout/hooks/use_flyout_a11y.tsx +++ b/src/platform/packages/shared/kbn-unified-metrics-grid/src/components/flyout/hooks/use_flyout_a11y.tsx @@ -9,22 +9,22 @@ import { EuiScreenReaderOnly, useGeneratedHtmlId } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; -import React, { useEffect, useState } from 'react'; +import React, { useEffect, useRef, useState } from 'react'; import useUnmount from 'react-use/lib/useUnmount'; export const useFlyoutA11y = ({ isXlScreen }: { isXlScreen: boolean }) => { const descriptionId = useGeneratedHtmlId(); const [triggerEl] = useState(document.activeElement); - const [flyoutEl, setFlyoutEl] = useState(); + const flyoutElRef = useRef(null); // Auto-focus push flyout on open or when switching to XL screen useEffect(() => { - if (isXlScreen && flyoutEl && document.contains(flyoutEl)) { + if (isXlScreen && flyoutElRef.current && document.contains(flyoutElRef.current)) { // Wait a tick before focusing or focus will be stolen by the trigger element when // switching from an overlay flyout to a push flyout (due to EUI focus lock) - setTimeout(() => flyoutEl.focus()); + setTimeout(() => flyoutElRef.current?.focus()); } - }, [flyoutEl, isXlScreen]); + }, [flyoutElRef, isXlScreen]); // Return focus to the trigger element when the flyout is closed useUnmount(() => { @@ -35,7 +35,7 @@ export const useFlyoutA11y = ({ isXlScreen }: { isXlScreen: boolean }) => { return { a11yProps: { - ref: setFlyoutEl, + ref: flyoutElRef, role: isXlScreen ? 'dialog' : undefined, tabIndex: isXlScreen ? 0 : undefined, 'aria-describedby': isXlScreen ? descriptionId : undefined, diff --git a/src/platform/packages/shared/react/kibana_context/common/color_mode.test.ts b/src/platform/packages/shared/react/kibana_context/common/color_mode.test.ts index 8fcd75f49d45a..5ffc231dd406d 100644 --- a/src/platform/packages/shared/react/kibana_context/common/color_mode.test.ts +++ b/src/platform/packages/shared/react/kibana_context/common/color_mode.test.ts @@ -11,10 +11,10 @@ import { getColorMode } from './color_mode'; describe('getColorMode', () => { it('returns the correct `colorMode` when `darkMode` is enabled', () => { - expect(getColorMode({ name: 'amsterdam', darkMode: true })).toEqual('DARK'); + expect(getColorMode({ name: 'borealis', darkMode: true })).toEqual('DARK'); }); it('returns the correct `colorMode` when `darkMode` is disabled', () => { - expect(getColorMode({ name: 'amsterdam', darkMode: false })).toEqual('LIGHT'); + expect(getColorMode({ name: 'borealis', darkMode: false })).toEqual('LIGHT'); }); }); diff --git a/src/platform/packages/shared/react/kibana_context/common/index.ts b/src/platform/packages/shared/react/kibana_context/common/index.ts index 541e804b788c7..11cc48299ea2e 100644 --- a/src/platform/packages/shared/react/kibana_context/common/index.ts +++ b/src/platform/packages/shared/react/kibana_context/common/index.ts @@ -19,5 +19,5 @@ import type { KibanaTheme } from './types'; */ export const defaultTheme: KibanaTheme = { darkMode: false, - name: 'amsterdam', + name: 'borealis', }; diff --git a/src/platform/packages/shared/react/kibana_context/common/theme.ts b/src/platform/packages/shared/react/kibana_context/common/theme.ts index 7a1576ea26435..4d4c9143e379b 100644 --- a/src/platform/packages/shared/react/kibana_context/common/theme.ts +++ b/src/platform/packages/shared/react/kibana_context/common/theme.ts @@ -8,7 +8,6 @@ */ import type { EuiThemeSystem } from '@elastic/eui'; -import { EuiThemeAmsterdam } from '@elastic/eui'; import { EuiThemeBorealis } from '@elastic/eui-theme-borealis'; export interface ThemeConfig { @@ -16,9 +15,6 @@ export interface ThemeConfig { } const THEMES: Record = { - amsterdam: { - euiTheme: EuiThemeAmsterdam, - }, borealis: { euiTheme: EuiThemeBorealis, }, @@ -28,4 +24,4 @@ export const getThemeConfigByName = (name: string): ThemeConfig | null => { return THEMES[name as keyof typeof THEMES] || null; }; -export const DEFAULT_THEME_CONFIG = THEMES.amsterdam; +export const DEFAULT_THEME_CONFIG = THEMES.borealis; diff --git a/src/platform/packages/shared/react/kibana_context/root/README.mdx b/src/platform/packages/shared/react/kibana_context/root/README.mdx index 5ad6707e8ff45..c5bd6172cbae6 100644 --- a/src/platform/packages/shared/react/kibana_context/root/README.mdx +++ b/src/platform/packages/shared/react/kibana_context/root/README.mdx @@ -9,7 +9,7 @@ date: 2023-07-25 ## Description -This package contains a root context provider for Kibana rendering. It handles operations that should only happen _once_ when the browser loads a page. +This package contains a root context provider for Kibana rendering. It handles operations that should only happen _once_ when the browser loads a page. While it would be safer to isolate this in a `core` package, we need to use it in other contexts-- like Storybook and Jest. @@ -36,7 +36,7 @@ const i18n: I18nStart = { }; export const KibanaContextDecorator: Decorator (storyFn, { globals }) => { - const colorMode = globals.euiTheme === 'v8.dark' ? 'dark' : 'light'; + const colorMode = globals.euiTheme === 'borealis.dark' ? 'dark' : 'light'; useEffect(() => { theme$.next({ darkMode: colorMode === 'dark' }); @@ -49,4 +49,3 @@ export const KibanaContextDecorator: Decorator (storyFn, { globals }) => { ); }; ``` - diff --git a/src/platform/packages/shared/react/kibana_context/root/eui_provider.test.tsx b/src/platform/packages/shared/react/kibana_context/root/eui_provider.test.tsx index 774f86d8ed9bf..1f68150beda4c 100644 --- a/src/platform/packages/shared/react/kibana_context/root/eui_provider.test.tsx +++ b/src/platform/packages/shared/react/kibana_context/root/eui_provider.test.tsx @@ -51,7 +51,7 @@ describe('KibanaEuiProvider', () => { }; it('exposes the EUI theme provider', async () => { - const coreTheme: KibanaTheme = { darkMode: true, name: 'amsterdam' }; + const coreTheme: KibanaTheme = { darkMode: true, name: 'borealis' }; render( { }); it('propagates changes of the coreTheme observable', async () => { - const coreTheme$ = new BehaviorSubject({ darkMode: true, name: 'amsterdam' }); + const coreTheme$ = new BehaviorSubject({ darkMode: true, name: 'borealis' }); render( @@ -91,7 +91,7 @@ describe('KibanaEuiProvider', () => { // Update the theme act(() => { - coreTheme$.next({ darkMode: false, name: 'amsterdam' }); + coreTheme$.next({ darkMode: false, name: 'borealis' }); }); // Wait for the component to update with new theme @@ -103,7 +103,7 @@ describe('KibanaEuiProvider', () => { }); it('passes component defaults to EuiProvider', async () => { - const coreTheme: KibanaTheme = { darkMode: true, name: 'amsterdam' }; + const coreTheme: KibanaTheme = { darkMode: true, name: 'borealis' }; render( diff --git a/src/platform/packages/shared/react/kibana_context/root/root_provider.test.tsx b/src/platform/packages/shared/react/kibana_context/root/root_provider.test.tsx index 2a826a364996d..57fd0883472ae 100644 --- a/src/platform/packages/shared/react/kibana_context/root/root_provider.test.tsx +++ b/src/platform/packages/shared/react/kibana_context/root/root_provider.test.tsx @@ -45,7 +45,7 @@ describe('KibanaRootContextProvider', () => { }; it('exposes the EUI theme provider', async () => { - const coreTheme: KibanaTheme = { darkMode: true, name: 'amsterdam' }; + const coreTheme: KibanaTheme = { darkMode: true, name: 'borealis' }; render( { }); it('propagates changes of the coreTheme observable', async () => { - const coreTheme$ = new BehaviorSubject({ darkMode: true, name: 'amsterdam' }); + const coreTheme$ = new BehaviorSubject({ darkMode: true, name: 'borealis' }); render( { // Update theme to light mode act(() => { - coreTheme$.next({ darkMode: false, name: 'amsterdam' }); + coreTheme$.next({ darkMode: false, name: 'borealis' }); }); // Wait for the theme to update diff --git a/src/platform/packages/shared/react/kibana_context/styled/styled_provider.tsx b/src/platform/packages/shared/react/kibana_context/styled/styled_provider.tsx index f7ea79a7629c4..4268b7bcc3744 100644 --- a/src/platform/packages/shared/react/kibana_context/styled/styled_provider.tsx +++ b/src/platform/packages/shared/react/kibana_context/styled/styled_provider.tsx @@ -55,7 +55,7 @@ const KibanaStyledComponentsThemeProvider = < * @deprecated All Kibana components need to migrate to Emotion. */ export const KibanaStyledComponentsThemeProviderDecorator: Decorator = (storyFn, { globals }) => { - const darkMode = globals.euiTheme === 'v8.dark' || globals.euiTheme === 'v7.dark'; + const darkMode = globals.euiTheme === 'borealis.dark'; return ( diff --git a/src/platform/packages/shared/react/kibana_context/theme/theme_provider.test.tsx b/src/platform/packages/shared/react/kibana_context/theme/theme_provider.test.tsx index 8023c0cbf7e5f..587f4fd007bb0 100644 --- a/src/platform/packages/shared/react/kibana_context/theme/theme_provider.test.tsx +++ b/src/platform/packages/shared/react/kibana_context/theme/theme_provider.test.tsx @@ -57,7 +57,7 @@ describe('KibanaThemeProvider', () => { }; it('exposes the EUI theme provider', async () => { - const coreTheme$ = new BehaviorSubject({ darkMode: true, name: 'amsterdam' }); + const coreTheme$ = new BehaviorSubject({ darkMode: true, name: 'borealis' }); const wrapper = mountWithIntl( @@ -73,7 +73,7 @@ describe('KibanaThemeProvider', () => { it('propagates changes of the coreTheme observable', async () => { const coreTheme$ = new BehaviorSubject({ darkMode: true, - name: 'amsterdam', + name: 'borealis', }); const wrapper = mountWithIntl( @@ -87,7 +87,7 @@ describe('KibanaThemeProvider', () => { expect(euiTheme!.colorMode).toEqual('DARK'); await act(async () => { - coreTheme$.next({ darkMode: false, name: 'amsterdam' }); + coreTheme$.next({ darkMode: false, name: 'borealis' }); }); await refresh(wrapper); diff --git a/src/platform/packages/shared/react/kibana_mount/to_mount_point.test.tsx b/src/platform/packages/shared/react/kibana_mount/to_mount_point.test.tsx index 734742e120811..e467bc75b2520 100644 --- a/src/platform/packages/shared/react/kibana_mount/to_mount_point.test.tsx +++ b/src/platform/packages/shared/react/kibana_mount/to_mount_point.test.tsx @@ -44,7 +44,7 @@ describe('toMountPoint', () => { }; it('exposes the euiTheme when `theme$` is provided', async () => { - const theme = { theme$: of({ darkMode: true, name: 'amsterdam' }) }; + const theme = { theme$: of({ darkMode: true, name: 'borealis' }) }; const mount = toMountPoint(, { theme, i18n, analytics, userProfile }); const targetEl = document.createElement('div'); @@ -56,7 +56,7 @@ describe('toMountPoint', () => { }); it('propagates changes of the theme$ observable', async () => { - const theme$ = new BehaviorSubject({ darkMode: true, name: 'amsterdam' }); + const theme$ = new BehaviorSubject({ darkMode: true, name: 'borealis' }); const mount = toMountPoint(, { theme: { theme$ }, @@ -73,7 +73,7 @@ describe('toMountPoint', () => { expect(euiTheme!.colorMode).toEqual('DARK'); await act(async () => { - theme$.next({ darkMode: false, name: 'amsterdam' }); + theme$.next({ darkMode: false, name: 'borealis' }); }); await flushPromises(); diff --git a/src/platform/packages/shared/response-ops/alerts-table/components/alerts_query_inspector_modal.test.tsx b/src/platform/packages/shared/response-ops/alerts-table/components/alerts_query_inspector_modal.test.tsx index eb09539c188d0..59cfaa28d793f 100644 --- a/src/platform/packages/shared/response-ops/alerts-table/components/alerts_query_inspector_modal.test.tsx +++ b/src/platform/packages/shared/response-ops/alerts-table/components/alerts_query_inspector_modal.test.tsx @@ -46,7 +46,7 @@ describe('AlertsQueryInspectorModal', () => { }; const renderModalInspectQuery = () => { - const theme = { theme$: of({ darkMode: false, name: 'amsterdam' }) }; + const theme = { theme$: of({ darkMode: false, name: 'borealis' }) }; const userProfile = userProfileServiceMock.createStart(); return render(, { wrapper: ({ children }) => ( diff --git a/src/platform/packages/shared/response-ops/rule_form/src/utils/get_default_params.ts b/src/platform/packages/shared/response-ops/rule_form/src/utils/get_default_params.ts index 7076b5374a4e2..cc91320fd2d8b 100644 --- a/src/platform/packages/shared/response-ops/rule_form/src/utils/get_default_params.ts +++ b/src/platform/packages/shared/response-ops/rule_form/src/utils/get_default_params.ts @@ -17,7 +17,7 @@ export const getDefaultParams = ({ group: string; actionTypeModel: ActionTypeModel; ruleType: RuleTypeWithDescription; -}) => { +}): ActionTypeModel['defaultActionParams'] => { if (group === ruleType.recoveryActionGroup.id) { return actionTypeModel.defaultRecoveredActionParams; } else { diff --git a/src/platform/packages/shared/shared-ux/button/exit_full_screen/src/exit_full_screen_button.component.tsx b/src/platform/packages/shared/shared-ux/button/exit_full_screen/src/exit_full_screen_button.component.tsx index 7f1d0627c85d8..61ab6ffd1f2ba 100644 --- a/src/platform/packages/shared/shared-ux/button/exit_full_screen/src/exit_full_screen_button.component.tsx +++ b/src/platform/packages/shared/shared-ux/button/exit_full_screen/src/exit_full_screen_button.component.tsx @@ -20,7 +20,7 @@ import { } from '@elastic/eui'; // EUI allows reaching into internal folders for component-specific exports, but they aren't typed in Kibana // @ts-ignore -import { useEuiButtonFocusCSS } from '@elastic/eui/lib/themes/amsterdam/global_styling/mixins/button'; +import { useEuiButtonFocusCSS } from '@elastic/eui/lib/global_styling/mixins/_button'; // @ts-ignore import { euiButtonDisplayStyles } from '@elastic/eui/lib/components/button/button_display/_button_display.styles'; import { i18n } from '@kbn/i18n'; diff --git a/src/platform/packages/shared/shared-ux/button_toolbar/src/buttons/toolbar_button/toolbar_button.styles.ts b/src/platform/packages/shared/shared-ux/button_toolbar/src/buttons/toolbar_button/toolbar_button.styles.ts index 571d5e1e3d1f7..499410519f773 100644 --- a/src/platform/packages/shared/shared-ux/button_toolbar/src/buttons/toolbar_button/toolbar_button.styles.ts +++ b/src/platform/packages/shared/shared-ux/button_toolbar/src/buttons/toolbar_button/toolbar_button.styles.ts @@ -15,21 +15,11 @@ export const fontWeightDefinitions = (euiTheme: UseEuiTheme['euiTheme']) => ({ }); export const ToolbarButtonStyles = ({ euiTheme }: UseEuiTheme) => { - const isAmsterdam = euiTheme.themeName === 'EUI_THEME_AMSTERDAM'; - return { - default: isAmsterdam - ? { - // style declaration carried over from https://github.com/elastic/kibana/blob/v8.10.4/src/plugins/kibana_react/public/toolbar_button/toolbar_button.scss - // informed by issue https://github.com/elastic/eui/issues/4730 - borderStyle: 'solid', - border: euiTheme.border.thin, - borderColor: euiTheme.border.color, - } - : { - // manual border override to ensure disabled buttons have a border to align with EuiButtonGroup styles - border: `${euiTheme.border.width.thin} solid ${euiTheme.colors.borderBasePlain}`, - }, + default: { + // manual border override to ensure disabled buttons have a border to align with EuiButtonGroup styles + border: `${euiTheme.border.width.thin} solid ${euiTheme.colors.borderBasePlain}`, + }, emptyButton: { backgroundColor: euiTheme.colors.backgroundBasePlain, border: `${euiTheme.border.width.thin} solid ${euiTheme.colors.borderBasePlain}`, diff --git a/src/platform/plugins/private/event_annotation/public/event_annotation_service/service.test.ts b/src/platform/plugins/private/event_annotation/public/event_annotation_service/service.test.ts index b943d8e5e3b1a..9d4bef03f0ad2 100644 --- a/src/platform/plugins/private/event_annotation/public/event_annotation_service/service.test.ts +++ b/src/platform/plugins/private/event_annotation/public/event_annotation_service/service.test.ts @@ -173,7 +173,7 @@ describe('Event Annotation Service', () => { isHidden: [false], time: ['2022'], label: ['Hello'], - color: ['#f04e98'], + color: ['#BC1E70'], lineWidth: [1], lineStyle: ['solid'], icon: ['triangle'], @@ -245,7 +245,7 @@ describe('Event Annotation Service', () => { isHidden: [false], timeField: ['@timestamp'], label: ['Hello'], - color: ['#f04e98'], + color: ['#BC1E70'], lineWidth: [1], lineStyle: ['solid'], icon: ['triangle'], @@ -317,7 +317,7 @@ describe('Event Annotation Service', () => { isHidden: [false], time: ['2022'], label: ['Hello'], - color: ['#f04e98'], + color: ['#BC1E70'], lineWidth: [1], lineStyle: ['solid'], icon: ['triangle'], @@ -355,7 +355,7 @@ describe('Event Annotation Service', () => { isHidden: [false], timeField: ['@timestamp'], label: ['Hello'], - color: ['#f04e98'], + color: ['#BC1E70'], lineWidth: [1], lineStyle: ['solid'], icon: ['triangle'], @@ -418,7 +418,7 @@ describe('Event Annotation Service', () => { isHidden: [false], timeField: ['@timestamp'], label: ['Hello'], - color: ['#f04e98'], + color: ['#BC1E70'], lineWidth: [1], lineStyle: ['solid'], icon: ['triangle'], diff --git a/src/platform/plugins/private/maps_ems/common/ems_defaults.ts b/src/platform/plugins/private/maps_ems/common/ems_defaults.ts index d0f18caf9f007..3f520b6216462 100644 --- a/src/platform/plugins/private/maps_ems/common/ems_defaults.ts +++ b/src/platform/plugins/private/maps_ems/common/ems_defaults.ts @@ -16,15 +16,13 @@ export const DEFAULT_EMS_FONT_LIBRARY_URL = // Theme-bound style identifiers export const EMS_ROADMAP_BOREALIS_DESATURATED_ID = 'road_map_desaturated_v9'; export const EMS_DARKMAP_BOREALIS_ID = 'dark_map_v9'; -export const EMS_ROADMAP_AMSTERDAM_DESATURATED_ID = 'road_map_desaturated'; -export const EMS_DARKMAP_AMSTERDAM_ID = 'dark_map'; // Default identifiers export const DEFAULT_EMS_ROADMAP_ID = 'road_map'; -// To be updated when Kibana only ships the Borealis tehem -export const DEFAULT_EMS_ROADMAP_DESATURATED_ID = EMS_ROADMAP_AMSTERDAM_DESATURATED_ID; -export const DEFAULT_EMS_DARKMAP_ID = EMS_DARKMAP_AMSTERDAM_ID; +// To be updated when Kibana only ships the Borealis theme +export const DEFAULT_EMS_ROADMAP_DESATURATED_ID = EMS_ROADMAP_BOREALIS_DESATURATED_ID; +export const DEFAULT_EMS_DARKMAP_ID = EMS_DARKMAP_BOREALIS_ID; export const EMS_APP_NAME = 'kibana'; // app-name submitted as the `app`-param to EMS diff --git a/src/platform/plugins/private/vis_types/vega/public/data_model/utils.ts b/src/platform/plugins/private/vis_types/vega/public/data_model/utils.ts index fa3800d92418a..c138f5a966e54 100644 --- a/src/platform/plugins/private/vis_types/vega/public/data_model/utils.ts +++ b/src/platform/plugins/private/vis_types/vega/public/data_model/utils.ts @@ -43,8 +43,6 @@ export class Utils { const borealisDark = getEuiThemeVars({ name: 'borealis', darkMode: true }); const borealisLight = getEuiThemeVars({ name: 'borealis', darkMode: false }); -const amsterdamDark = getEuiThemeVars({ name: 'amsterdam', darkMode: true }); -const amsterdamLight = getEuiThemeVars({ name: 'amsterdam', darkMode: false }); // These colors should be replaced with the respective tokens whenever available from EUI export const VegaThemeColors = { @@ -86,44 +84,6 @@ export const VegaThemeColors = { ], }, }, - amsterdam: { - dark: { - grid: '#343741', // euiColorChartLines euiColorLightShade - title: '#D4DAE5', // euiColorDarkestShade - label: '#98A2B3', // euiColorDarkShade - default: amsterdamDark.euiColorVis0, // visColors.euiColorVis0 - visColors: [ - amsterdamDark.euiColorVis0, - amsterdamDark.euiColorVis1, - amsterdamDark.euiColorVis2, - amsterdamDark.euiColorVis3, - amsterdamDark.euiColorVis4, - amsterdamDark.euiColorVis5, - amsterdamDark.euiColorVis6, - amsterdamDark.euiColorVis7, - amsterdamDark.euiColorVis8, - amsterdamDark.euiColorVis9, - ], - }, - light: { - grid: '#eef0f3', // euiColorChartLines shade($euiColorLightestShade, 3%) - title: '#343741', // euiColorDarkestShade - label: '#69707D', // euiColorDarkShade - default: amsterdamLight.euiColorVis0, // visColors.euiColorVis0 - visColors: [ - amsterdamLight.euiColorVis0, - amsterdamLight.euiColorVis1, - amsterdamLight.euiColorVis2, - amsterdamLight.euiColorVis3, - amsterdamLight.euiColorVis4, - amsterdamLight.euiColorVis5, - amsterdamLight.euiColorVis6, - amsterdamLight.euiColorVis7, - amsterdamLight.euiColorVis8, - amsterdamLight.euiColorVis9, - ], - }, - }, }; export function getVegaThemeColors( @@ -131,6 +91,5 @@ export function getVegaThemeColors( colorToken: 'grid' | 'title' | 'label' | 'default' | 'visColors' ) { const colorMode = theme.darkMode ? 'dark' : 'light'; - const themeName = theme.name === 'amsterdam' ? 'amsterdam' : 'borealis'; - return VegaThemeColors[themeName][colorMode][colorToken]; + return VegaThemeColors[theme.name as keyof typeof VegaThemeColors]?.[colorMode][colorToken]; } diff --git a/src/platform/plugins/private/vis_types/vislib/public/vislib/components/legend/__snapshots__/legend.test.tsx.snap b/src/platform/plugins/private/vis_types/vislib/public/vislib/components/legend/__snapshots__/legend.test.tsx.snap index a8961c9a01516..eed2ae27efe2d 100644 --- a/src/platform/plugins/private/vis_types/vislib/public/vislib/components/legend/__snapshots__/legend.test.tsx.snap +++ b/src/platform/plugins/private/vis_types/vislib/public/vislib/components/legend/__snapshots__/legend.test.tsx.snap @@ -2,4 +2,4 @@ exports[`VisLegend Component Legend closed should match the snapshot 1`] = `"
"`; -exports[`VisLegend Component Legend open should match the snapshot 1`] = `"
"`; +exports[`VisLegend Component Legend open should match the snapshot 1`] = `"
"`; diff --git a/src/platform/plugins/shared/chart_expressions/expression_partition_vis/public/__mocks__/theme.ts b/src/platform/plugins/shared/chart_expressions/expression_partition_vis/public/__mocks__/theme.ts index 01c40ecc53d2d..90deef57d7c19 100644 --- a/src/platform/plugins/shared/chart_expressions/expression_partition_vis/public/__mocks__/theme.ts +++ b/src/platform/plugins/shared/chart_expressions/expression_partition_vis/public/__mocks__/theme.ts @@ -11,6 +11,6 @@ import { themeServiceMock } from '@kbn/core/public/mocks'; import { ThemeService } from '@kbn/charts-plugin/public/services'; const theme = new ThemeService(); -theme.init(themeServiceMock.createSetupContract({ darkMode: false, name: 'amsterdam' })); +theme.init(themeServiceMock.createSetupContract({ darkMode: false, name: 'borealis' })); export { theme }; diff --git a/src/platform/plugins/shared/chart_expressions/expression_xy/public/components/__snapshots__/xy_chart.test.tsx.snap b/src/platform/plugins/shared/chart_expressions/expression_xy/public/components/__snapshots__/xy_chart.test.tsx.snap index 5ed829d78d489..dabd26b950ad2 100644 --- a/src/platform/plugins/shared/chart_expressions/expression_xy/public/components/__snapshots__/xy_chart.test.tsx.snap +++ b/src/platform/plugins/shared/chart_expressions/expression_xy/public/components/__snapshots__/xy_chart.test.tsx.snap @@ -41,7 +41,7 @@ exports[`XYChart component annotations should render basic line annotation 1`] = "line": Object { "dash": undefined, "opacity": 1, - "stroke": "#f04e98", + "stroke": "#BC1E70", "strokeWidth": 1, }, } @@ -58,9 +58,9 @@ Array [ id="__endzones__" style={ Object { - "fill": "#69707d", + "fill": "#5A6D8C", "opacity": 0.2, - "stroke": "#69707d", + "stroke": "#5A6D8C", "strokeWidth": 0, } } @@ -166,7 +166,7 @@ exports[`XYChart component annotations should render grouped line annotations wi diff --git a/src/platform/plugins/shared/custom_integrations/storybook/decorator.tsx b/src/platform/plugins/shared/custom_integrations/storybook/decorator.tsx index 502f02121a4cb..1777a722e31fe 100644 --- a/src/platform/plugins/shared/custom_integrations/storybook/decorator.tsx +++ b/src/platform/plugins/shared/custom_integrations/storybook/decorator.tsx @@ -22,7 +22,7 @@ import { CustomIntegrationsServicesProvider } from '../public/services'; */ export const getCustomIntegrationsContextDecorator: Decorator = (story, { globals }) => { const ContextProvider = getCustomIntegrationsContextProvider(); - const darkMode = globals.euiTheme === 'v8.dark' || globals.euiTheme === 'v7.dark'; + const darkMode = globals.euiTheme === 'borealis.dark'; return ( diff --git a/src/platform/plugins/shared/data_view_management/public/components/edit_index_pattern/scripted_fields_table/components/confirmation_modal/confirmation_modal.tsx b/src/platform/plugins/shared/data_view_management/public/components/edit_index_pattern/scripted_fields_table/components/confirmation_modal/confirmation_modal.tsx index 2b9fdecee74cc..be66da375f5c1 100644 --- a/src/platform/plugins/shared/data_view_management/public/components/edit_index_pattern/scripted_fields_table/components/confirmation_modal/confirmation_modal.tsx +++ b/src/platform/plugins/shared/data_view_management/public/components/edit_index_pattern/scripted_fields_table/components/confirmation_modal/confirmation_modal.tsx @@ -16,7 +16,11 @@ import type { ScriptedFieldItem } from '../../types'; interface DeleteScritpedFieldConfirmationModalProps { field: ScriptedFieldItem; hideDeleteConfirmationModal: ( - event?: React.KeyboardEvent | React.MouseEvent + event?: + | React.KeyboardEvent + | React.MouseEvent + | MouseEvent + | TouchEvent ) => void; deleteField: (event: React.MouseEvent) => void; } diff --git a/src/platform/plugins/shared/data_view_management/public/components/edit_index_pattern/source_filters_table/components/confirmation_modal/confirmation_modal.tsx b/src/platform/plugins/shared/data_view_management/public/components/edit_index_pattern/source_filters_table/components/confirmation_modal/confirmation_modal.tsx index ab9c5214c5515..aee52c9994ed6 100644 --- a/src/platform/plugins/shared/data_view_management/public/components/edit_index_pattern/source_filters_table/components/confirmation_modal/confirmation_modal.tsx +++ b/src/platform/plugins/shared/data_view_management/public/components/edit_index_pattern/source_filters_table/components/confirmation_modal/confirmation_modal.tsx @@ -16,7 +16,11 @@ import { EuiConfirmModal, EUI_MODAL_CONFIRM_BUTTON, useGeneratedHtmlId } from '@ interface DeleteFilterConfirmationModalProps { filterToDeleteValue: string; onCancelConfirmationModal: ( - event?: React.KeyboardEvent | React.MouseEvent + event?: + | React.KeyboardEvent + | React.MouseEvent + | MouseEvent + | TouchEvent ) => void; onDeleteFilter: (event: React.MouseEvent) => void; } diff --git a/src/platform/plugins/shared/discover/public/__mocks__/services.ts b/src/platform/plugins/shared/discover/public/__mocks__/services.ts index c2b84e1fb1f03..4a54fcb29f0e2 100644 --- a/src/platform/plugins/shared/discover/public/__mocks__/services.ts +++ b/src/platform/plugins/shared/discover/public/__mocks__/services.ts @@ -150,7 +150,7 @@ export function createDiscoverServicesMock(): DiscoverServices { }; const { profilesManagerMock } = createContextAwarenessMocks(); - const theme = themeServiceMock.createSetupContract({ darkMode: false, name: 'amsterdam' }); + const theme = themeServiceMock.createSetupContract({ darkMode: false, name: 'borealis' }); corePluginMock.theme = theme; corePluginMock.chrome.getActiveSolutionNavId$.mockReturnValue(new BehaviorSubject(null)); diff --git a/src/platform/plugins/shared/kibana_utils/public/theme/kibana_theme_provider.test.tsx b/src/platform/plugins/shared/kibana_utils/public/theme/kibana_theme_provider.test.tsx index c3c2be931d411..867525172d04b 100644 --- a/src/platform/plugins/shared/kibana_utils/public/theme/kibana_theme_provider.test.tsx +++ b/src/platform/plugins/shared/kibana_utils/public/theme/kibana_theme_provider.test.tsx @@ -54,7 +54,7 @@ describe('KibanaThemeProvider', () => { }; it('exposes the EUI theme provider', async () => { - const coreTheme: CoreTheme = { darkMode: true, name: 'amsterdam' }; + const coreTheme: CoreTheme = { darkMode: true, name: 'borealis' }; const wrapper = mountWithIntl( @@ -68,7 +68,7 @@ describe('KibanaThemeProvider', () => { }); it('propagates changes of the coreTheme observable', async () => { - const coreTheme$ = new BehaviorSubject({ darkMode: true, name: 'amsterdam' }); + const coreTheme$ = new BehaviorSubject({ darkMode: true, name: 'borealis' }); const wrapper = mountWithIntl( @@ -81,7 +81,7 @@ describe('KibanaThemeProvider', () => { expect(euiTheme!.colorMode).toEqual('DARK'); await act(async () => { - coreTheme$.next({ darkMode: false, name: 'amsterdam' }); + coreTheme$.next({ darkMode: false, name: 'borealis' }); }); await refresh(wrapper); diff --git a/src/platform/plugins/shared/presentation_util/public/components/expression_input/expression_input.stories.tsx b/src/platform/plugins/shared/presentation_util/public/components/expression_input/expression_input.stories.tsx index 6b480628a08e5..14e3013a7fb93 100644 --- a/src/platform/plugins/shared/presentation_util/public/components/expression_input/expression_input.stories.tsx +++ b/src/platform/plugins/shared/presentation_util/public/components/expression_input/expression_input.stories.tsx @@ -80,8 +80,7 @@ export default {
{storyFn()} diff --git a/src/platform/plugins/shared/unified_doc_viewer/public/components/doc_viewer_flyout/use_flyout_a11y.tsx b/src/platform/plugins/shared/unified_doc_viewer/public/components/doc_viewer_flyout/use_flyout_a11y.tsx index 18cc98fb94b89..0ab6b16121ffc 100644 --- a/src/platform/plugins/shared/unified_doc_viewer/public/components/doc_viewer_flyout/use_flyout_a11y.tsx +++ b/src/platform/plugins/shared/unified_doc_viewer/public/components/doc_viewer_flyout/use_flyout_a11y.tsx @@ -9,22 +9,22 @@ import { EuiScreenReaderOnly, useGeneratedHtmlId } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; -import React, { useEffect, useState } from 'react'; +import React, { useEffect, useRef, useState } from 'react'; import useUnmount from 'react-use/lib/useUnmount'; export const useFlyoutA11y = ({ isXlScreen }: { isXlScreen: boolean }) => { const descriptionId = useGeneratedHtmlId(); const [triggerEl] = useState(document.activeElement); - const [flyoutEl, setFlyoutEl] = useState(); + const flyoutElRef = useRef(null); // Auto-focus push flyout on open or when switching to XL screen useEffect(() => { - if (isXlScreen && flyoutEl && document.contains(flyoutEl)) { + if (isXlScreen && flyoutElRef.current && document.contains(flyoutElRef.current)) { // Wait a tick before focusing or focus will be stolen by the trigger element when // switching from an overlay flyout to a push flyout (due to EUI focus lock) - setTimeout(() => flyoutEl.focus()); + setTimeout(() => flyoutElRef.current?.focus()); } - }, [flyoutEl, isXlScreen]); + }, [flyoutElRef, isXlScreen]); // Return focus to the trigger element when the flyout is closed useUnmount(() => { @@ -35,7 +35,7 @@ export const useFlyoutA11y = ({ isXlScreen }: { isXlScreen: boolean }) => { return { a11yProps: { - ref: setFlyoutEl, + ref: flyoutElRef, role: isXlScreen ? 'dialog' : undefined, tabIndex: isXlScreen ? 0 : undefined, 'aria-describedby': isXlScreen ? descriptionId : undefined, diff --git a/x-pack/platform/packages/shared/kbn-elastic-assistant/impl/assistant/assistant_overlay/index.tsx b/x-pack/platform/packages/shared/kbn-elastic-assistant/impl/assistant/assistant_overlay/index.tsx index afd7c7f683ffa..d1a515878c43f 100644 --- a/x-pack/platform/packages/shared/kbn-elastic-assistant/impl/assistant/assistant_overlay/index.tsx +++ b/x-pack/platform/packages/shared/kbn-elastic-assistant/impl/assistant/assistant_overlay/index.tsx @@ -118,6 +118,8 @@ export const AssistantOverlay = React.memo(() => { ); useEvent('keydown', onKeyDown); + const flyoutRef = useRef(null); + // Modal control functions const cleanupAndCloseModal = useCallback(() => { setIsModalVisible(false); @@ -144,8 +146,6 @@ export const AssistantOverlay = React.memo(() => { }); }, []); - const flyoutRef = useRef(); - if (!isModalVisible) return null; return ( diff --git a/x-pack/platform/packages/shared/kbn-elastic-assistant/impl/assistant/settings/assistant_settings.tsx b/x-pack/platform/packages/shared/kbn-elastic-assistant/impl/assistant/settings/assistant_settings.tsx index bd46b34a10254..26b914289b108 100644 --- a/x-pack/platform/packages/shared/kbn-elastic-assistant/impl/assistant/settings/assistant_settings.tsx +++ b/x-pack/platform/packages/shared/kbn-elastic-assistant/impl/assistant/settings/assistant_settings.tsx @@ -39,7 +39,11 @@ const StyledEuiModal = styled(EuiModal)` interface Props { defaultConnector?: AIConnector; onClose: ( - event?: React.KeyboardEvent | React.MouseEvent + event?: + | React.KeyboardEvent + | React.MouseEvent + | MouseEvent + | TouchEvent ) => void; onSave: (success: boolean) => Promise; selectedConversationId?: string; diff --git a/x-pack/platform/packages/shared/ml/aiops_log_rate_analysis/constants.ts b/x-pack/platform/packages/shared/ml/aiops_log_rate_analysis/constants.ts index 6ae763ef40967..93c68b855705d 100644 --- a/x-pack/platform/packages/shared/ml/aiops_log_rate_analysis/constants.ts +++ b/x-pack/platform/packages/shared/ml/aiops_log_rate_analysis/constants.ts @@ -37,12 +37,8 @@ export const RANDOM_SAMPLER_SEED = 3867412; export const useLogRateAnalysisBarColors = () => { const { euiTheme } = useEuiTheme(); return { - barColor: euiTheme.flags.hasVisColorAdjustment - ? euiTheme.colors.vis.euiColorVis0 - : euiTheme.colors.vis.euiColorVis0, - barHighlightColor: euiTheme.flags.hasVisColorAdjustment - ? 'orange' - : euiTheme.colors.vis.euiColorVis8, + barColor: euiTheme.colors.vis.euiColorVis0, + barHighlightColor: euiTheme.colors.vis.euiColorVis8, }; }; diff --git a/x-pack/platform/plugins/private/data_visualizer/public/application/common/components/stats_table/components/field_data_expanded_row/use_bar_color.ts b/x-pack/platform/plugins/private/data_visualizer/public/application/common/components/stats_table/components/field_data_expanded_row/use_bar_color.ts index 682bbc7da8daf..ba58dea60f23a 100644 --- a/x-pack/platform/plugins/private/data_visualizer/public/application/common/components/stats_table/components/field_data_expanded_row/use_bar_color.ts +++ b/x-pack/platform/plugins/private/data_visualizer/public/application/common/components/stats_table/components/field_data_expanded_row/use_bar_color.ts @@ -5,10 +5,4 @@ * 2.0. */ -import { useEuiTheme } from '@elastic/eui'; - -export const useBarColor = () => { - const { euiTheme } = useEuiTheme(); - - return euiTheme.flags.hasVisColorAdjustment ? 'success' : 'vis0'; -}; +export const useBarColor = () => 'vis0'; diff --git a/x-pack/platform/plugins/private/data_visualizer/public/application/common/components/stats_table/hooks/use_color_range.ts b/x-pack/platform/plugins/private/data_visualizer/public/application/common/components/stats_table/hooks/use_color_range.ts index b929ec9a557db..615df1bbcf2d7 100644 --- a/x-pack/platform/plugins/private/data_visualizer/public/application/common/components/stats_table/hooks/use_color_range.ts +++ b/x-pack/platform/plugins/private/data_visualizer/public/application/common/components/stats_table/hooks/use_color_range.ts @@ -159,15 +159,7 @@ export const useColorRange = ( const colorRanges: Record = { [COLOR_RANGE.BLUE]: [ d3.rgb(euiTheme.colors.emptyShade).toString(), - d3 - .rgb( - // Amsterdam: euiTheme.colors.vis.euiColorVis1 - // Borealis: euiTheme.colors.vis.euiColorVis2 - euiTheme.flags.hasVisColorAdjustment - ? euiTheme.colors.vis.euiColorVis1 - : euiTheme.colors.vis.euiColorVis2 - ) - .toString(), + d3.rgb(euiTheme.colors.vis.euiColorVis2).toString(), ], [COLOR_RANGE.RED]: [ d3.rgb(euiTheme.colors.emptyShade).toString(), diff --git a/x-pack/platform/plugins/private/data_visualizer/public/application/data_drift/use_data_drift_colors.ts b/x-pack/platform/plugins/private/data_visualizer/public/application/data_drift/use_data_drift_colors.ts index 7d63ee4c7c259..443d1c01cc795 100644 --- a/x-pack/platform/plugins/private/data_visualizer/public/application/data_drift/use_data_drift_colors.ts +++ b/x-pack/platform/plugins/private/data_visualizer/public/application/data_drift/use_data_drift_colors.ts @@ -14,16 +14,8 @@ export const useDataDriftColors = () => { return useMemo( () => ({ - // Amsterdam: euiTheme.colors.vis.euiColorVis2 - // Borealis: euiTheme.colors.vis.euiColorVis4 - referenceColor: euiTheme.flags.hasVisColorAdjustment - ? euiTheme.colors.vis.euiColorVis2 - : euiTheme.colors.vis.euiColorVis4, - // Amsterdam: euiTheme.colors.vis.euiColorVis1 - // Borealis: euiTheme.colors.vis.euiColorVis2 - comparisonColor: euiTheme.flags.hasVisColorAdjustment - ? euiTheme.colors.vis.euiColorVis1 - : euiTheme.colors.vis.euiColorVis2, + referenceColor: euiTheme.colors.vis.euiColorVis4, + comparisonColor: euiTheme.colors.vis.euiColorVis2, overlapColor: '#490771', }), [euiTheme] diff --git a/x-pack/platform/plugins/private/index_lifecycle_management/public/application/sections/edit_policy/components/phase_icon/phase_icon.tsx b/x-pack/platform/plugins/private/index_lifecycle_management/public/application/sections/edit_policy/components/phase_icon/phase_icon.tsx index afb34c75f671c..1b62ecdd726cc 100644 --- a/x-pack/platform/plugins/private/index_lifecycle_management/public/application/sections/edit_policy/components/phase_icon/phase_icon.tsx +++ b/x-pack/platform/plugins/private/index_lifecycle_management/public/application/sections/edit_policy/components/phase_icon/phase_icon.tsx @@ -13,19 +13,12 @@ import type { Phases } from '../../../../../../common/types'; const useStyles = ({ enabled, phase }: { enabled: boolean; phase: string }) => { const { euiTheme } = useEuiTheme(); - const isBorealis = euiTheme.themeName === 'EUI_THEME_BOREALIS'; const phaseIconColors = { - hot: isBorealis ? euiTheme.colors.vis.euiColorVis6 : euiTheme.colors.vis.euiColorVisBehindText9, - warm: isBorealis - ? euiTheme.colors.vis.euiColorVis9 - : euiTheme.colors.vis.euiColorVisBehindText5, - cold: isBorealis - ? euiTheme.colors.vis.euiColorVis2 - : euiTheme.colors.vis.euiColorVisBehindText1, - frozen: isBorealis - ? euiTheme.colors.vis.euiColorVis4 - : euiTheme.colors.vis.euiColorVisBehindText4, + hot: euiTheme.colors.vis.euiColorVis6, + warm: euiTheme.colors.vis.euiColorVis9, + cold: euiTheme.colors.vis.euiColorVis2, + frozen: euiTheme.colors.vis.euiColorVis4, delete: euiTheme.colors.darkShade, }; diff --git a/x-pack/platform/plugins/private/index_lifecycle_management/public/application/sections/edit_policy/components/timeline/timeline.styles.ts b/x-pack/platform/plugins/private/index_lifecycle_management/public/application/sections/edit_policy/components/timeline/timeline.styles.ts index d0a4a600a1ff0..ae2f2acc179d4 100644 --- a/x-pack/platform/plugins/private/index_lifecycle_management/public/application/sections/edit_policy/components/timeline/timeline.styles.ts +++ b/x-pack/platform/plugins/private/index_lifecycle_management/public/application/sections/edit_policy/components/timeline/timeline.styles.ts @@ -11,12 +11,11 @@ import { useEuiTheme } from '@elastic/eui'; export const useStyles = () => { const { euiTheme } = useEuiTheme(); const ilmTimelineBarHeight = euiTheme.size.s; - const isBorealis = euiTheme.themeName === 'EUI_THEME_BOREALIS'; const timelineIconColors = { - hot: isBorealis ? euiTheme.colors.vis.euiColorVis6 : euiTheme.colors.vis.euiColorVis9, - warm: isBorealis ? euiTheme.colors.vis.euiColorVis9 : euiTheme.colors.vis.euiColorVis5, - cold: isBorealis ? euiTheme.colors.vis.euiColorVis2 : euiTheme.colors.vis.euiColorVis1, + hot: euiTheme.colors.vis.euiColorVis6, + warm: euiTheme.colors.vis.euiColorVis9, + cold: euiTheme.colors.vis.euiColorVis2, frozen: euiTheme.colors.vis.euiColorVis4, }; diff --git a/x-pack/platform/plugins/private/index_lifecycle_management/public/application/sections/policy_list/policy_flyout/phase_indicator.tsx b/x-pack/platform/plugins/private/index_lifecycle_management/public/application/sections/policy_list/policy_flyout/phase_indicator.tsx index 0a586f1abc5d6..56f7c2307c4fa 100644 --- a/x-pack/platform/plugins/private/index_lifecycle_management/public/application/sections/policy_list/policy_flyout/phase_indicator.tsx +++ b/x-pack/platform/plugins/private/index_lifecycle_management/public/application/sections/policy_list/policy_flyout/phase_indicator.tsx @@ -13,13 +13,11 @@ import type { Phase } from '../../../../../common/types'; export const PhaseIndicator = ({ phase }: { phase: Phase }) => { const { euiTheme } = useEuiTheme(); - const isBorealis = euiTheme.themeName === 'EUI_THEME_BOREALIS'; - // Changing the mappings for the phases in Borealis as a mid-term solution. See https://github.com/elastic/kibana/issues/203664#issuecomment-2536593361. const phaseToIndicatorColors = { - hot: isBorealis ? euiTheme.colors.vis.euiColorVis6 : euiTheme.colors.vis.euiColorVis9, - warm: isBorealis ? euiTheme.colors.vis.euiColorVis9 : euiTheme.colors.vis.euiColorVis5, - cold: isBorealis ? euiTheme.colors.vis.euiColorVis2 : euiTheme.colors.vis.euiColorVis1, + hot: euiTheme.colors.vis.euiColorVis6, + warm: euiTheme.colors.vis.euiColorVis9, + cold: euiTheme.colors.vis.euiColorVis2, frozen: euiTheme.colors.vis.euiColorVis4, delete: euiTheme.colors.lightShade, }; diff --git a/x-pack/platform/plugins/private/index_lifecycle_management/public/extend_index_management/components/index_lifecycle_summary.tsx b/x-pack/platform/plugins/private/index_lifecycle_management/public/extend_index_management/components/index_lifecycle_summary.tsx index 63ed9d77e486e..27e451f757453 100644 --- a/x-pack/platform/plugins/private/index_lifecycle_management/public/extend_index_management/components/index_lifecycle_summary.tsx +++ b/x-pack/platform/plugins/private/index_lifecycle_management/public/extend_index_management/components/index_lifecycle_summary.tsx @@ -44,20 +44,19 @@ export const IndexLifecycleSummary: FunctionComponent = ({ const { ilm: ilmData } = index; // only ILM managed indices render the ILM tab const ilm = ilmData as IlmExplainLifecycleLifecycleExplainManaged; - const isBorealis = euiTheme.themeName === 'EUI_THEME_BOREALIS'; // Changing the mappings for the phases in Borealis as a mid-term solution. See https://github.com/elastic/kibana/issues/203664#issuecomment-2536593361. const phaseToBadgeMapping: Record = { hot: { - color: isBorealis ? euiTheme.colors.vis.euiColorVis6 : euiTheme.colors.vis.euiColorVis9, + color: euiTheme.colors.vis.euiColorVis6, label: 'Hot', }, warm: { - color: isBorealis ? euiTheme.colors.vis.euiColorVis9 : euiTheme.colors.vis.euiColorVis5, + color: euiTheme.colors.vis.euiColorVis9, label: 'Warm', }, cold: { - color: isBorealis ? euiTheme.colors.vis.euiColorVis2 : euiTheme.colors.vis.euiColorVis1, + color: euiTheme.colors.vis.euiColorVis2, label: 'Cold', }, frozen: { diff --git a/x-pack/platform/plugins/private/translations/translations/de-DE.json b/x-pack/platform/plugins/private/translations/translations/de-DE.json index 751f95573f70c..db9f1b913fef7 100644 --- a/x-pack/platform/plugins/private/translations/translations/de-DE.json +++ b/x-pack/platform/plugins/private/translations/translations/de-DE.json @@ -1290,7 +1290,6 @@ "core.ui_settings.params.storeUrlText": "Die URL kann manchmal so groß werden, dass einige Browser sie nicht mehr verarbeiten können. Um dies zu verhindern, prüfen wir, ob das Speichern von Teilen der URL im Sitzungsspeicher helfen könnte. Bitte lassen Sie uns wissen, wie Sie zurechtkommen!", "core.ui_settings.params.storeUrlTitle": "URLs im Sitzungsspeicher speichern", "core.ui_settings.params.themeName": "Thema", - "core.ui_settings.params.themeName.options.amsterdam": "Amsterdam", "core.ui_settings.params.themeName.options.borealis": "Borealis", "core.ui_settings.params.themeVersionTitle": "Theme-Version", "core.ui.chrome.appearanceChange.requiresPageReloadButtonLabel": "Seite neu laden", diff --git a/x-pack/platform/plugins/private/translations/translations/fr-FR.json b/x-pack/platform/plugins/private/translations/translations/fr-FR.json index 05a6f5fa0aed1..579e789cbcb86 100644 --- a/x-pack/platform/plugins/private/translations/translations/fr-FR.json +++ b/x-pack/platform/plugins/private/translations/translations/fr-FR.json @@ -1306,7 +1306,6 @@ "core.ui_settings.params.storeUrlText": "L'URL peut parfois devenir trop longue pour être gérée par certains navigateurs. Pour pallier ce problème, nous testons actuellement le stockage de certaines parties de l'URL dans le stockage de session. N'hésitez pas à nous faire part de vos commentaires.", "core.ui_settings.params.storeUrlTitle": "Stocker les URL dans le stockage de session", "core.ui_settings.params.themeName": "Thème", - "core.ui_settings.params.themeName.options.amsterdam": "Amsterdam", "core.ui_settings.params.themeName.options.borealis": "Borealis", "core.ui_settings.params.themeVersionTitle": "Version du thème", "core.ui.chrome.appearanceChange.requiresPageReloadButtonLabel": "Actualiser la page", diff --git a/x-pack/platform/plugins/private/translations/translations/ja-JP.json b/x-pack/platform/plugins/private/translations/translations/ja-JP.json index 3ec7bd926ea10..18817839b0ac3 100644 --- a/x-pack/platform/plugins/private/translations/translations/ja-JP.json +++ b/x-pack/platform/plugins/private/translations/translations/ja-JP.json @@ -1309,7 +1309,6 @@ "core.ui_settings.params.storeUrlText": "URLが長くなりすぎるためブラウザーが対応できない場合があります。セッションストレージにURLの一部を保存することでこの問題に対処できるかどうかをテストしています。結果を教えてください!", "core.ui_settings.params.storeUrlTitle": "セッションストレージにURLを格納", "core.ui_settings.params.themeName": "テーマ", - "core.ui_settings.params.themeName.options.amsterdam": "アムステルダム", "core.ui_settings.params.themeName.options.borealis": "Borealis", "core.ui_settings.params.themeVersionTitle": "テーマバージョン", "core.ui.chrome.appearanceChange.requiresPageReloadButtonLabel": "ページを再読み込み", diff --git a/x-pack/platform/plugins/private/translations/translations/zh-CN.json b/x-pack/platform/plugins/private/translations/translations/zh-CN.json index c6f403217372f..3990069d92ec0 100644 --- a/x-pack/platform/plugins/private/translations/translations/zh-CN.json +++ b/x-pack/platform/plugins/private/translations/translations/zh-CN.json @@ -1303,7 +1303,6 @@ "core.ui_settings.params.storeUrlText": "有时,URL 可能会变得过长,使某些浏览器无法进行处理。为此,我们正在测试将 URL 的组成部分存储在会话存储中是否能有所帮助。请向我们反馈您的体验!", "core.ui_settings.params.storeUrlTitle": "将 URL 存储在会话存储中", "core.ui_settings.params.themeName": "主题", - "core.ui_settings.params.themeName.options.amsterdam": "阿姆斯特丹", "core.ui_settings.params.themeName.options.borealis": "Borealis", "core.ui_settings.params.themeVersionTitle": "主题版本", "core.ui.chrome.appearanceChange.requiresPageReloadButtonLabel": "重新加载页面", diff --git a/x-pack/platform/plugins/shared/cases/public/components/severity/config.tsx b/x-pack/platform/plugins/shared/cases/public/components/severity/config.tsx index 8216625f6110c..ec47d96b1bac4 100644 --- a/x-pack/platform/plugins/shared/cases/public/components/severity/config.tsx +++ b/x-pack/platform/plugins/shared/cases/public/components/severity/config.tsx @@ -32,23 +32,22 @@ export const severities = { export const SeverityHealth: React.FC = ({ severity }) => { const { euiTheme } = useEuiTheme(); - const isAmsterdam = euiTheme.flags.hasVisColorAdjustment; const severityData = { low: { - color: isAmsterdam ? euiTheme.colors.vis.euiColorVis0 : euiTheme.colors.severity.neutral, + color: euiTheme.colors.severity.neutral, label: LOW, }, medium: { - color: isAmsterdam ? euiTheme.colors.vis.euiColorVis5 : euiTheme.colors.severity.warning, + color: euiTheme.colors.severity.warning, label: MEDIUM, }, high: { - color: isAmsterdam ? euiTheme.colors.vis.euiColorVis7 : euiTheme.colors.severity.risk, + color: euiTheme.colors.severity.risk, label: HIGH, }, critical: { - color: isAmsterdam ? euiTheme.colors.vis.euiColorVis9 : euiTheme.colors.severity.danger, + color: euiTheme.colors.severity.danger, label: CRITICAL, }, }; diff --git a/x-pack/platform/plugins/shared/fleet/.storybook/context/index.tsx b/x-pack/platform/plugins/shared/fleet/.storybook/context/index.tsx index 177ca3eac724e..0b549c3ac4a17 100644 --- a/x-pack/platform/plugins/shared/fleet/.storybook/context/index.tsx +++ b/x-pack/platform/plugins/shared/fleet/.storybook/context/index.tsx @@ -108,7 +108,7 @@ export const StorybookContext: React.FC<{ settings: getSettings(), theme: { theme$: EMPTY, - getTheme: () => ({ darkMode: false, name: 'amsterdam' }), + getTheme: () => ({ darkMode: false, name: 'borealis' }), }, pricing: {} as unknown as PricingServiceStart, security: {} as unknown as SecurityServiceStart, diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/list_page/components/create_agent_policy.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/list_page/components/create_agent_policy.tsx index f7a6246643401..3acfddbfe5b13 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/list_page/components/create_agent_policy.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/list_page/components/create_agent_policy.tsx @@ -199,8 +199,14 @@ export const CreateAgentPolicyFlyout: React.FunctionComponent = ({ ); + // ref={null} is needed to fix styled-components' ref prop type return ( - onClose()} {...restOfProps} maxWidth={MAX_FLYOUT_WIDTH}> + onClose()} + {...restOfProps} + maxWidth={MAX_FLYOUT_WIDTH} + ref={null} + > {header} {body} {footer} diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agents/services/agent_status.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agents/services/agent_status.tsx index 6e2986735d6be..2c61ab10ca78f 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agents/services/agent_status.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agents/services/agent_status.tsx @@ -26,29 +26,19 @@ export function getColorForAgentStatus( agentStatus: SimplifiedAgentStatus, euiTheme: EuiThemeComputed<{}> ): string { - const isAmsterdam = euiTheme.themeName === 'EUI_THEME_AMSTERDAM'; - switch (agentStatus) { case 'healthy': - return isAmsterdam - ? euiTheme.colors.vis.euiColorVisBehindText0 - : euiTheme.colors.backgroundFilledSuccess; + return euiTheme.colors.backgroundFilledSuccess; case 'offline': return euiTheme.colors.lightShade; case 'inactive': return euiTheme.colors.darkShade; case 'unhealthy': - return isAmsterdam - ? euiTheme.colors.vis.euiColorVisBehindText5 - : euiTheme.colors.backgroundFilledWarning; + return euiTheme.colors.backgroundFilledWarning; case 'orphaned': - return isAmsterdam - ? euiTheme.colors.vis.euiColorVisBehindText5 - : euiTheme.colors.backgroundFilledWarning; + return euiTheme.colors.backgroundFilledWarning; case 'updating': - return isAmsterdam - ? euiTheme.colors.vis.euiColorVisBehindText1 - : euiTheme.colors.backgroundFilledPrimary; + return euiTheme.colors.backgroundFilledPrimary; case 'unenrolled': return euiTheme.colors.backgroundBaseDisabled; case 'uninstalled': diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/components/integration_preference.stories.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/components/integration_preference.stories.tsx index a104de73a42df..d3585e8247a75 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/components/integration_preference.stories.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/components/integration_preference.stories.tsx @@ -20,8 +20,7 @@ export default {
diff --git a/x-pack/platform/plugins/shared/lens/public/shared_components/coloring/utils.test.ts b/x-pack/platform/plugins/shared/lens/public/shared_components/coloring/utils.test.ts index 27f17f3c72c66..6bfc6dd9b5e40 100644 --- a/x-pack/platform/plugins/shared/lens/public/shared_components/coloring/utils.test.ts +++ b/x-pack/platform/plugins/shared/lens/public/shared_components/coloring/utils.test.ts @@ -9,8 +9,8 @@ import { findMinMaxByColumnId, getContrastColor, shouldColorByTerms } from './ut describe('getContrastColor', () => { it('should pick the light color when the passed one is dark', () => { - expect(getContrastColor('#000', true)).toBe('#ffffff'); - expect(getContrastColor('#000', false)).toBe('#ffffff'); + expect(getContrastColor('#000', true)).toBe('#FFFFFF'); + expect(getContrastColor('#000', false)).toBe('#FFFFFF'); }); it('should pick the dark color when the passed one is light', () => { @@ -19,13 +19,13 @@ describe('getContrastColor', () => { }); it('should take into account background color if the primary color is opaque', () => { - expect(getContrastColor('rgba(0,0,0,0)', true)).toBe('#ffffff'); + expect(getContrastColor('rgba(0,0,0,0)', true)).toBe('#FFFFFF'); expect(getContrastColor('rgba(0,0,0,0)', false)).toBe('#000000'); - expect(getContrastColor('#00000000', true)).toBe('#ffffff'); + expect(getContrastColor('#00000000', true)).toBe('#FFFFFF'); expect(getContrastColor('#00000000', false)).toBe('#000000'); - expect(getContrastColor('#ffffff00', true)).toBe('#ffffff'); - expect(getContrastColor('#ffffff00', false)).toBe('#000000'); - expect(getContrastColor('rgba(255,255,255,0)', true)).toBe('#ffffff'); + expect(getContrastColor('#FFFFFF00', true)).toBe('#FFFFFF'); + expect(getContrastColor('#FFFFFF00', false)).toBe('#000000'); + expect(getContrastColor('rgba(255,255,255,0)', true)).toBe('#FFFFFF'); expect(getContrastColor('rgba(255,255,255,0)', false)).toBe('#000000'); }); }); diff --git a/x-pack/platform/plugins/shared/lens/public/visualizations/legacy_metric/visualization.test.ts b/x-pack/platform/plugins/shared/lens/public/visualizations/legacy_metric/visualization.test.ts index 002cbc564e871..9e21c97b59e1c 100644 --- a/x-pack/platform/plugins/shared/lens/public/visualizations/legacy_metric/visualization.test.ts +++ b/x-pack/platform/plugins/shared/lens/public/visualizations/legacy_metric/visualization.test.ts @@ -309,10 +309,10 @@ describe('metric_visualization', () => { "left", ], "lHeight": Array [ - 82.5, + 75, ], "size": Array [ - 55, + 50, ], "sizeUnit": Array [ "px", diff --git a/x-pack/platform/plugins/shared/lens/public/visualizations/metric/visualization.test.ts b/x-pack/platform/plugins/shared/lens/public/visualizations/metric/visualization.test.ts index 19d3f58e426ec..e0a7c6a01f541 100644 --- a/x-pack/platform/plugins/shared/lens/public/visualizations/metric/visualization.test.ts +++ b/x-pack/platform/plugins/shared/lens/public/visualizations/metric/visualization.test.ts @@ -287,7 +287,7 @@ describe('metric visualization', () => { ).toMatchInlineSnapshot(` Array [ Object { - "color": "#ffffff", + "color": "#FFFFFF", "columnId": "metric-col-id", "triggerIconType": "color", }, @@ -311,7 +311,7 @@ describe('metric visualization', () => { .toMatchInlineSnapshot(` Array [ Object { - "color": "#ffffff", + "color": "#FFFFFF", "columnId": "metric-col-id", "triggerIconType": "color", }, diff --git a/x-pack/platform/plugins/shared/lens/public/visualizations/xy/visualization.test.tsx b/x-pack/platform/plugins/shared/lens/public/visualizations/xy/visualization.test.tsx index 87ba2ae9344d1..16245b5834004 100644 --- a/x-pack/platform/plugins/shared/lens/public/visualizations/xy/visualization.test.tsx +++ b/x-pack/platform/plugins/shared/lens/public/visualizations/xy/visualization.test.tsx @@ -2465,7 +2465,7 @@ describe('xy_visualization', () => { }); expect(config.groups[0].accessors).toEqual([ { - color: '#f04e98', + color: '#BC1E70', columnId: 'an1', customIcon: IconCircle, triggerIconType: 'custom', diff --git a/x-pack/platform/plugins/shared/logs_shared/public/test_utils/use_global_storybook_theme.tsx b/x-pack/platform/plugins/shared/logs_shared/public/test_utils/use_global_storybook_theme.tsx index 023b74e360d97..35f3ceae15203 100644 --- a/x-pack/platform/plugins/shared/logs_shared/public/test_utils/use_global_storybook_theme.tsx +++ b/x-pack/platform/plugins/shared/logs_shared/public/test_utils/use_global_storybook_theme.tsx @@ -51,9 +51,9 @@ export const decorateWithGlobalStorybookThemeProviders: Decorator = ( const euiThemeFromId = (themeId: string): CoreTheme => { switch (themeId) { - case 'v8.dark': - return { darkMode: true, name: 'amsterdam' }; + case 'borealis.dark': + return { darkMode: true, name: 'borealis' }; default: - return { darkMode: false, name: 'amsterdam' }; + return { darkMode: false, name: 'borealis' }; } }; diff --git a/x-pack/platform/plugins/shared/ml/public/application/components/color_range_legend/use_color_range.ts b/x-pack/platform/plugins/shared/ml/public/application/components/color_range_legend/use_color_range.ts index d4f7bf3cf659c..72685b41bb2f9 100644 --- a/x-pack/platform/plugins/shared/ml/public/application/components/color_range_legend/use_color_range.ts +++ b/x-pack/platform/plugins/shared/ml/public/application/components/color_range_legend/use_color_range.ts @@ -156,13 +156,7 @@ export const useColorRange = ( const colorRanges: Record = { [COLOR_RANGE.BLUE]: [ rgb(euiTheme.colors.emptyShade).toString(), - rgb( - // Amsterdam: euiTheme.colors.vis.euiColorVis1 - // Borealis: euiTheme.colors.vis.euiColorVis2 - euiTheme.flags.hasVisColorAdjustment - ? euiTheme.colors.vis.euiColorVis1 - : euiTheme.colors.vis.euiColorVis2 - ).toString(), + rgb(euiTheme.colors.vis.euiColorVis2).toString(), ], [COLOR_RANGE.RED]: [ rgb(euiTheme.colors.emptyShade).toString(), diff --git a/x-pack/platform/plugins/shared/ml/public/application/data_frame_analytics/pages/job_map/components/cytoscape_options.tsx b/x-pack/platform/plugins/shared/ml/public/application/data_frame_analytics/pages/job_map/components/cytoscape_options.tsx index 9eca6585ac2b3..67a5bca1ef131 100644 --- a/x-pack/platform/plugins/shared/ml/public/application/data_frame_analytics/pages/job_map/components/cytoscape_options.tsx +++ b/x-pack/platform/plugins/shared/ml/public/application/data_frame_analytics/pages/job_map/components/cytoscape_options.tsx @@ -72,32 +72,15 @@ function borderColorForNode(el: cytoscape.NodeSingular, euiTheme: EuiThemeComput case JOB_MAP_NODE_TYPES.ANALYTICS_JOB_MISSING: return euiTheme.colors.fullShade; case JOB_MAP_NODE_TYPES.ANALYTICS: - // Amsterdam + Borealis return euiTheme.colors.vis.euiColorVis0; case JOB_MAP_NODE_TYPES.TRANSFORM: - // Amsterdam: euiTheme.colors.vis.euiColorVis1 - // Borealis: euiTheme.colors.vis.euiColorVis2 - return euiTheme.flags.hasVisColorAdjustment - ? euiTheme.colors.vis.euiColorVis1 - : euiTheme.colors.vis.euiColorVis2; + return euiTheme.colors.vis.euiColorVis2; case JOB_MAP_NODE_TYPES.INDEX: - // Amsterdam: euiTheme.colors.vis.euiColorVis2 - // Borealis: euiTheme.colors.vis.euiColorVis4 - return euiTheme.flags.hasVisColorAdjustment - ? euiTheme.colors.vis.euiColorVis2 - : euiTheme.colors.vis.euiColorVis4; + return euiTheme.colors.vis.euiColorVis4; case JOB_MAP_NODE_TYPES.TRAINED_MODEL: - // Amsterdam: euiTheme.colors.vis.euiColorVis3 - // Borealis: euiTheme.colors.vis.euiColorVis5 - return euiTheme.flags.hasVisColorAdjustment - ? euiTheme.colors.vis.euiColorVis3 - : euiTheme.colors.vis.euiColorVis5; + return euiTheme.colors.vis.euiColorVis5; case JOB_MAP_NODE_TYPES.INGEST_PIPELINE: - // Amsterdam: euiTheme.colors.vis.euiColorVis7 - // Borealis: euiTheme.colors.vis.euiColorVis8 - return euiTheme.flags.hasVisColorAdjustment - ? euiTheme.colors.vis.euiColorVis7 - : euiTheme.colors.vis.euiColorVis8; + return euiTheme.colors.vis.euiColorVis8; default: return euiTheme.colors.mediumShade; diff --git a/x-pack/platform/plugins/shared/ml/public/application/data_frame_analytics/pages/job_map/components/legend.tsx b/x-pack/platform/plugins/shared/ml/public/application/data_frame_analytics/pages/job_map/components/legend.tsx index 0a706aa7a82b2..bac68571dccb0 100644 --- a/x-pack/platform/plugins/shared/ml/public/application/data_frame_analytics/pages/job_map/components/legend.tsx +++ b/x-pack/platform/plugins/shared/ml/public/application/data_frame_analytics/pages/job_map/components/legend.tsx @@ -49,29 +49,10 @@ export const JobMapLegend: FC<{ hasMissingJobNode: boolean }> = ({ hasMissingJob const euiBorderWidthThick = euiTheme.border.width.thick; const euiPageBackgroundColor = euiTheme.colors.backgroundBasePlain; - // Amsterdam: euiTheme.colors.vis.euiColorVis2 - // Borealis: euiTheme.colors.vis.euiColorVis4 - const borderColorIndexPattern = euiTheme.flags.hasVisColorAdjustment - ? euiTheme.colors.vis.euiColorVis2 - : euiTheme.colors.vis.euiColorVis4; - - // Amsterdam: euiTheme.colors.vis.euiColorVis7 - // Borealis: euiTheme.colors.vis.euiColorVis8 - const borderColorIngestPipeline = euiTheme.flags.hasVisColorAdjustment - ? euiTheme.colors.vis.euiColorVis7 - : euiTheme.colors.vis.euiColorVis8; - - // Amsterdam: euiTheme.colors.vis.euiColorVis1 - // Borealis: euiTheme.colors.vis.euiColorVis2 - const borderColorTransform = euiTheme.flags.hasVisColorAdjustment - ? euiTheme.colors.vis.euiColorVis1 - : euiTheme.colors.vis.euiColorVis2; - - // Amsterdam: euiTheme.colors.vis.euiColorVis3 - // Borealis: euiTheme.colors.vis.euiColorVis5 - const borderBottomColorTrainedModel = euiTheme.flags.hasVisColorAdjustment - ? euiTheme.colors.vis.euiColorVis3 - : euiTheme.colors.vis.euiColorVis5; + const borderColorIndexPattern = euiTheme.colors.vis.euiColorVis4; + const borderColorIngestPipeline = euiTheme.colors.vis.euiColorVis8; + const borderColorTransform = euiTheme.colors.vis.euiColorVis2; + const borderBottomColorTrainedModel = euiTheme.colors.vis.euiColorVis5; // Amsterdam + Borealis const borderColorAnalytics = euiTheme.colors.vis.euiColorVis0; diff --git a/x-pack/platform/plugins/shared/ml/public/application/jobs/jobs_list/components/datafeed_chart_flyout/datafeed_chart_flyout.tsx b/x-pack/platform/plugins/shared/ml/public/application/jobs/jobs_list/components/datafeed_chart_flyout/datafeed_chart_flyout.tsx index 58afeeb50eef4..a6831d66a5fb7 100644 --- a/x-pack/platform/plugins/shared/ml/public/application/jobs/jobs_list/components/datafeed_chart_flyout/datafeed_chart_flyout.tsx +++ b/x-pack/platform/plugins/shared/ml/public/application/jobs/jobs_list/components/datafeed_chart_flyout/datafeed_chart_flyout.tsx @@ -536,11 +536,7 @@ export const DatafeedChartFlyout: FC = ({ style={{ line: { strokeWidth: 3, - // Amsterdam: euiTheme.colors.vis.euiColorVis1 - // Borealis: euiTheme.colors.vis.euiColorVis2 - stroke: euiTheme.flags.hasVisColorAdjustment - ? euiTheme.colors.vis.euiColorVis1 - : euiTheme.colors.vis.euiColorVis2, + stroke: euiTheme.colors.vis.euiColorVis2, opacity: 0.5, }, }} diff --git a/x-pack/platform/plugins/shared/ml/public/application/model_management/test_models/models/ner/ner_output.test.tsx b/x-pack/platform/plugins/shared/ml/public/application/model_management/test_models/models/ner/ner_output.test.tsx index c47d086ea20d9..52ac235bd87fd 100644 --- a/x-pack/platform/plugins/shared/ml/public/application/model_management/test_models/models/ner/ner_output.test.tsx +++ b/x-pack/platform/plugins/shared/ml/public/application/model_management/test_models/models/ner/ner_output.test.tsx @@ -54,23 +54,23 @@ describe('NER output', () => { describe('getClassColor', () => { test('returns the correct color for class PER', () => { - expect(getClassColor('PER', true)).toBe('#FFC7DB'); + expect(getClassColor('PER')).toBe('#FCD883'); }); test('returns the correct color for class LOC', () => { - expect(getClassColor('LOC', true)).toBe('#A6EDEA'); + expect(getClassColor('LOC')).toBe('#61A2FF'); }); test('returns the correct color for class ORG', () => { - expect(getClassColor('ORG', true)).toBe('#16C5C0'); + expect(getClassColor('ORG')).toBe('#16C5C0'); }); test('returns the correct color for class MISC', () => { - expect(getClassColor('MISC', true)).toBe('#FFC9C2'); + expect(getClassColor('MISC')).toBe('#EAAE01'); }); test('returns the default color for an unknown class', () => { - expect(getClassColor('UNKNOWN', true)).toBe('#FFC7DB'); + expect(getClassColor('UNKNOWN')).toBe('#FCD883'); }); }); }); diff --git a/x-pack/platform/plugins/shared/ml/public/application/model_management/test_models/models/ner/ner_output.tsx b/x-pack/platform/plugins/shared/ml/public/application/model_management/test_models/models/ner/ner_output.tsx index 3e0d3fbfbe737..3b58b60316bf5 100644 --- a/x-pack/platform/plugins/shared/ml/public/application/model_management/test_models/models/ner/ner_output.tsx +++ b/x-pack/platform/plugins/shared/ml/public/application/model_management/test_models/models/ner/ner_output.tsx @@ -14,7 +14,6 @@ import { euiPaletteColorBlind, euiPaletteColorBlindBehindText, useEuiFontSize, - useEuiTheme, EuiBadge, EuiFlexGroup, EuiFlexItem, @@ -46,47 +45,31 @@ const ENTITY_TYPES: Record = { PER: { label: 'Person', icon: 'user', - // Amsterdam color - colorIndex: 5, + colorIndex: 9, }, LOC: { label: 'Location', icon: 'visMapCoordinate', - // Amsterdam color - colorIndex: 1, + colorIndex: 2, }, ORG: { label: 'Organization', icon: 'home', - // Amsterdam color colorIndex: 0, }, MISC: { label: 'Miscellaneous', icon: 'question', - // Amsterdam color - colorIndex: 7, + colorIndex: 8, }, }; const UNKNOWN_ENTITY_TYPE: EntityType = { label: '', icon: 'question', - // Amsterdam color - colorIndex: 5, + colorIndex: 9, }; -// Amsterdam -// ['#6dccb1', '#79aad9', '#ee789d', '#a987d1', '#e4a6c7', '#f1d86f', '#d2c0a0', '#f5a35c', '#c47c6c', '#ff7e62'] -// Borealis -// ['#00BEB8', '#98E6E2', '#599DFF', '#B4D5FF', '#ED6BA2', '#FFBED5', '#F66D64', '#FFC0B8', '#E6AB01', '#FCD279'] -const amsterdam2BorealisColorMap = new Map([ - [0, 0], - [1, 2], - [5, 9], - [7, 8], -]); - export const getNerOutputComponent = (inferrer: NerInference) => ; const NerOutput: FC<{ inferrer: NerInference }> = ({ inferrer }) => { @@ -170,25 +153,14 @@ const EntityBadge = ({ }: PropsWithChildren<{ entity: estypes.MlTrainedModelEntities; }>) => { - const { euiTheme } = useEuiTheme(); const euiFontSizeXS = useEuiFontSize('xs').fontSize; return ( > = ({ children }) => { const { euiTheme } = useEuiTheme(); const euiFontSizeXS = useEuiFontSize('xs').fontSize; - const isAmsterdam = euiTheme.themeName === 'EUI_THEME_AMSTERDAM'; - - // For Amsterdam, use a `behindText` variant. Borealis doesn't need it because of updated contrasts. - const badgeColor = isAmsterdam - ? euiTheme.colors.vis.euiColorVisBehindText5 - : euiTheme.colors.vis.euiColorVis9; + const badgeColor = euiTheme.colors.vis.euiColorVis9; return ( > = ({ children }) => { style={{ marginRight: ICON_PADDING, marginTop: `-${ICON_PADDING}`, - // For Amsterdam, add a border to the badge to improve contrast with the background. - ...(isAmsterdam ? { border: `1px solid ${euiTheme.colors.vis.euiColorVis5}` } : {}), fontSize: euiFontSizeXS, padding: '0px 6px', pointerEvents: 'none', diff --git a/x-pack/platform/plugins/shared/security/public/account_management/user_profile/user_profile.test.tsx b/x-pack/platform/plugins/shared/security/public/account_management/user_profile/user_profile.test.tsx index feb805088b8de..2627af7fdea0b 100644 --- a/x-pack/platform/plugins/shared/security/public/account_management/user_profile/user_profile.test.tsx +++ b/x-pack/platform/plugins/shared/security/public/account_management/user_profile/user_profile.test.tsx @@ -331,7 +331,7 @@ describe('useUserProfileForm', () => { const data: UserProfileData = {}; const nonCloudUser = mockAuthenticatedUser({ elastic_cloud_user: false }); - coreStart.theme.getTheme.mockReturnValue({ darkMode: true, name: 'amsterdam' }); + coreStart.theme.getTheme.mockReturnValue({ darkMode: true, name: 'borealis' }); coreStart.settings.client.isOverridden.mockReturnValue(true); const testWrapper = mount( @@ -369,7 +369,7 @@ describe('useUserProfileForm', () => { const data: UserProfileData = {}; const nonCloudUser = mockAuthenticatedUser({ elastic_cloud_user: false }); - coreStart.theme.getTheme.mockReturnValue({ darkMode: false, name: 'amsterdam' }); + coreStart.theme.getTheme.mockReturnValue({ darkMode: false, name: 'borealis' }); coreStart.settings.client.isOverridden.mockReturnValue(true); const testWrapper = mount( diff --git a/x-pack/platform/plugins/shared/security/public/authentication/login/__snapshots__/login_page.test.tsx.snap b/x-pack/platform/plugins/shared/security/public/authentication/login/__snapshots__/login_page.test.tsx.snap index 4ee98ed11a674..1f8791771d0cb 100644 --- a/x-pack/platform/plugins/shared/security/public/authentication/login/__snapshots__/login_page.test.tsx.snap +++ b/x-pack/platform/plugins/shared/security/public/authentication/login/__snapshots__/login_page.test.tsx.snap @@ -342,7 +342,7 @@ exports[`LoginPage page renders as expected 1`] = ` >