[Visual Refresh] Add Borealis theme (#199993)

## Summary

This PR introduces the first internal version of the new theme
`Borealis` and ensures that:
- themes can be switched between "Amsterdam" and "Borealis"
- theme-specific Sass files are available and can be loaded with
`KBN_OPTIMIZER_THEMES=experimental`
- legacy JSON variable usage accounts for both themes
- static template styles account for both themes


## Running locally

```yml
// kibana.dev.yml or kibana.yml
uiSettings.experimental.themeSwitcherEnabled: true
```

Start kibana
```
KBN_OPTIMIZER_THEMES='v8light,v8dark,borealislight,borealisdark' yarn start

or

KBN_OPTIMIZER_THEMES=experimental yarn start
```

### Checklist

- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [ ] [Flaky Test
Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was
used on any tests changed

---------

Co-authored-by: Tomasz Kajtoch <tomasz.kajtoch@elastic.co>

package.json

@@ -118,7 +118,8 @@
     "@elastic/ecs": "^8.11.1",
     "@elastic/elasticsearch": "^8.15.2",
     "@elastic/ems-client": "8.5.3",
-    "@elastic/eui": "97.3.1",
+    "@elastic/eui": "97.3.1-borealis.2",
+    "@elastic/eui-theme-borealis": "0.0.2",
     "@elastic/filesaver": "1.1.2",
     "@elastic/node-crypto": "^1.2.3",
     "@elastic/numeral": "^2.5.1",

packages/core/rendering/core-rendering-server-internal/src/views/styles.tsx

@@ -8,17 +8,18 @@
  */
 
 import React, { FC } from 'react';
-import type { DarkModeValue } from '@kbn/core-ui-settings-common';
+import { type DarkModeValue, ThemeName } from '@kbn/core-ui-settings-common';
 
 interface Props {
   darkMode: DarkModeValue;
+  themeName: ThemeName;
   stylesheetPaths: string[];
 }
 
-export const Styles: FC<Props> = ({ darkMode, stylesheetPaths }) => {
+export const Styles: FC<Props> = ({ darkMode, themeName, stylesheetPaths }) => {
   return (
     <>
-      {darkMode !== 'system' && <InlineStyles darkMode={darkMode} />}
+      {darkMode !== 'system' && <InlineStyles darkMode={darkMode} themeName={themeName} />}
       {stylesheetPaths.map((path) => (
         <link key={path} rel="stylesheet" type="text/css" href={path} />
       ))}
@@ -26,7 +27,27 @@ export const Styles: FC<Props> = ({ darkMode, stylesheetPaths }) => {
   );
 };
 
-const InlineStyles: FC<{ darkMode: boolean }> = ({ darkMode }) => {
+const InlineStyles: FC<{ darkMode: boolean; themeName: ThemeName }> = ({ darkMode, themeName }) => {
+  const getThemeStyles = (theme: ThemeName) => {
+    if (theme === 'borealis') {
+      return {
+        pageBackground: darkMode ? '#07101F' : '#F6F9FC', // colors.body
+        welcomeText: darkMode ? '#8E9FBC' : '#5A6D8C', // colors.subduedText
+        progress: darkMode ? '#172336' : '#ECF1F9', // colors.lightestShade
+        progressBefore: darkMode ? '#599DFF' : '#0B64DD', // colors.primary
+      };
+    }
+
+    return {
+      pageBackground: darkMode ? '#141519' : '#F8FAFD',
+      welcomeText: darkMode ? '#98A2B3' : '#69707D',
+      progress: darkMode ? '#25262E' : '#F5F7FA',
+      progressBefore: darkMode ? '#1BA9F5' : '#006DE4',
+    };
+  };
+
+  const themeStyles = getThemeStyles(themeName);
+
   // must be kept in sync with
   // packages/core/apps/core-apps-server-internal/assets/legacy_theme.js
   /* eslint-disable react/no-danger */
@@ -36,19 +57,19 @@ const InlineStyles: FC<{ darkMode: boolean }> = ({ darkMode }) => {
         __html: `
 
           html {
-            background-color: ${darkMode ? '#141519' : '#F8FAFD'}
+            background-color: ${themeStyles.pageBackground}
           }
 
           .kbnWelcomeText {
-            color: ${darkMode ? '#98A2B3' : '#69707D'};
+            color: ${themeStyles.welcomeText};
           }
 
           .kbnProgress {
-            background-color: ${darkMode ? '#25262E' : '#F5F7FA'};
+            background-color: ${themeStyles.progress};
           }
 
           .kbnProgress:before {
-            background-color: ${darkMode ? '#1BA9F5' : '#006DE4'};
+            background-color: ${themeStyles.progressBefore};
           }
 
         `,

packages/core/rendering/core-rendering-server-internal/src/views/template.tsx

@@ -56,7 +56,11 @@ export const Template: FunctionComponent<Props> = ({
         {/* Inject EUI reset and global styles before all other component styles */}
         <meta name={EUI_STYLES_GLOBAL} />
         <meta name="emotion" />
-        <Styles darkMode={darkMode} stylesheetPaths={stylesheetPaths} />
+        <Styles
+          darkMode={darkMode}
+          themeName={injectedMetadata.theme.name}
+          stylesheetPaths={stylesheetPaths}
+        />
         {scriptPaths.map((path) => (
           <script key={path} src={path} />
         ))}

packages/core/ui-settings/core-ui-settings-common/src/theme.ts

@@ -52,6 +52,11 @@ export function parseThemeTags(input?: unknown): ThemeTags {
     return DEFAULT_THEME_TAGS;
   }
 
+  // TODO: remove when Borealis is in public beta
+  if (input === 'experimental') {
+    return SUPPORTED_THEME_TAGS;
+  }
+
   let rawTags: string[];
   if (typeof input === 'string') {
     rawTags = input.split(',').map((tag) => tag.trim());

packages/kbn-eslint-config/.eslintrc.js

@@ -127,13 +127,16 @@ module.exports = {
           exclude: USES_STYLED_COMPONENTS,
           disallowedMessage: `Prefer using @emotion/react instead. To use styled-components, ensure you plugin is enabled in packages/kbn-babel-preset/styled_components_files.js.`,
         },
-        ...['@elastic/eui/dist/eui_theme_light.json', '@elastic/eui/dist/eui_theme_dark.json'].map(
+        ...[
-          (from) => ({
+          '@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',
+        ].map((from) => ({
           from,
           to: false,
           disallowedMessage: `Use "@kbn/ui-theme" to access theme vars.`,
-          })
+        })),
-        ),
         {
           from: '@kbn/test/jest',
           to: '@kbn/test-jest-helpers',

packages/kbn-optimizer/limits.yml

@@ -2,7 +2,7 @@ pageLoadAssetSize:
   actions: 20000
   advancedSettings: 27596
   aiAssistantManagementSelection: 19146
-  aiops: 16600
+  aiops: 16670
   alerting: 106936
   apm: 64385
   banners: 17946
@@ -31,7 +31,7 @@ pageLoadAssetSize:
   dataUsage: 30000
   dataViewEditor: 28082
   dataViewFieldEditor: 42021
-  dataViewManagement: 5300
+  dataViewManagement: 5370
   dataViews: 65000
   dataVisualizer: 30000
   devTools: 38637

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

@@ -65,8 +65,10 @@ module.exports = (_, argv) => {
         '@elastic/eui/optimize/es/components/provider/nested',
         '@elastic/eui/optimize/es/services',
         '@elastic/eui/optimize/es/services/format',
-        '@elastic/eui/dist/eui_theme_light.json',
+        '@elastic/eui/dist/eui_theme_amsterdam_light.json',
-        '@elastic/eui/dist/eui_theme_dark.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/numeral',
         '@emotion/cache',
         '@emotion/react',

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

@@ -77,6 +77,7 @@ const externals = {
     '__kbnSharedDeps__.ElasticEuiLibComponentsUseIsNestedEuiProvider',
   '@elastic/eui/lib/services': '__kbnSharedDeps__.ElasticEuiLibServices',
   '@elastic/eui/lib/services/format': '__kbnSharedDeps__.ElasticEuiLibServicesFormat',
+  '@elastic/eui-theme-borealis': '__kbnSharedDeps__.ElasticEuiThemeBorealis',
 
   // transient dep of eui
   '@hello-pangea/dnd': '__kbnSharedDeps__.HelloPangeaDnd',

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

@@ -41,6 +41,7 @@ export const Rxjs = require('rxjs');
 export const ElasticNumeral = require('@elastic/numeral');
 export const ElasticCharts = require('@elastic/charts');
 export const ElasticEui = require('@elastic/eui');
+export const ElasticEuiThemeBorealis = require('@elastic/eui-theme-borealis');
 export const ElasticEuiLibComponentsUseIsNestedEuiProvider = require('@elastic/eui/optimize/es/components/provider/nested');
 export const ElasticEuiLibServices = require('@elastic/eui/optimize/es/services');
 export const ElasticEuiLibServicesFormat = require('@elastic/eui/optimize/es/services/format');

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

@@ -7,12 +7,15 @@
  * License v3.0 only", or the "Server Side Public License, v 1".
  */
 
-// TODO(tkajtoch): Add support for multiple themes
+/* eslint-disable-next-line @kbn/eslint/module_migration */
+import { default as v8Light } from '@elastic/eui/dist/eui_theme_amsterdam_light.json';
+/* eslint-disable-next-line @kbn/eslint/module_migration */
+import { default as v8Dark } from '@elastic/eui/dist/eui_theme_amsterdam_dark.json';
 
 /* eslint-disable-next-line @kbn/eslint/module_migration */
-import { default as v8Light } from '@elastic/eui/dist/eui_theme_light.json';
+import { default as borealisLight } from '@elastic/eui/dist/eui_theme_borealis_light.json';
 /* eslint-disable-next-line @kbn/eslint/module_migration */
-import { default as v8Dark } from '@elastic/eui/dist/eui_theme_dark.json';
+import { default as borealisDark } from '@elastic/eui/dist/eui_theme_borealis_dark.json';
 
 const globals: any = typeof window === 'undefined' ? {} : window;
 
@@ -27,19 +30,40 @@ export const version = 8;
 /** @deprecated theme can be dynamic now, access is discouraged */
 export const darkMode = tag.endsWith('dark');
 
-export const euiLightVars: Theme = v8Light;
-export const euiDarkVars: Theme = v8Dark;
-
 let isDarkMode = darkMode;
 export const _setDarkMode = (mode: boolean) => {
   isDarkMode = mode;
 };
 
+const getThemeVars = (): { light: Theme; dark: Theme } => {
+  if (globals?.__kbnThemeTag__?.includes('borealis')) {
+    return {
+      light: borealisLight,
+      dark: borealisDark,
+    };
+  }
+
+  return {
+    light: v8Light,
+    dark: v8Dark,
+  };
+};
+
+export const euiLightVars: Theme = getThemeVars().light;
+export const euiDarkVars: Theme = getThemeVars().dark;
+
 /**
  * EUI Theme vars that automatically adjust to light/dark theme
  */
-export const euiThemeVars: Theme = new Proxy(isDarkMode ? euiDarkVars : euiLightVars, {
+export const euiThemeVars: Theme = new Proxy(
+  isDarkMode ? getThemeVars().dark : getThemeVars().light,
+  {
     get(accessedTarget, accessedKey, ...rest) {
-    return Reflect.get(isDarkMode ? euiDarkVars : euiLightVars, accessedKey, ...rest);
+      return Reflect.get(
+        isDarkMode ? getThemeVars().dark : getThemeVars().light,
+        accessedKey,
+        ...rest
+      );
     },
-});
+  }
+);

packages/react/kibana_context/common/theme.ts

@@ -8,6 +8,7 @@
  */
 
 import { EuiThemeSystem, EuiThemeAmsterdam } from '@elastic/eui';
+import { EuiThemeBorealis } from '@elastic/eui-theme-borealis';
 
 export interface ThemeConfig {
   euiTheme: EuiThemeSystem;
@@ -17,6 +18,9 @@ const THEMES: Record<string, ThemeConfig> = {
   amsterdam: {
     euiTheme: EuiThemeAmsterdam,
   },
+  borealis: {
+    euiTheme: EuiThemeBorealis,
+  },
 };
 
 export const getThemeConfigByName = (name: string): ThemeConfig | null => {

src/core/public/styles/core_app/_globals_borealisdark.scss

@@ -0,0 +1,9 @@
+// v9 borealis theme global scope
+//
+// prepended to all .scss imports (from JS, when borealis dark theme selected)
+
+@import '@elastic/eui-theme-borealis/src/theme_dark.scss';
+
+@import './mixins';
+
+$kbnThemeVersion: 'borealisdark';

src/core/public/styles/core_app/_globals_borealislight.scss

@@ -0,0 +1,9 @@
+// v9 borealis theme global scope
+//
+// prepended to all .scss imports (from JS, when borealis light theme selected)
+
+@import '@elastic/eui-theme-borealis/src/theme_light.scss';
+
+@import './mixins';
+
+$kbnThemeVersion: 'borealislight';

src/dev/license_checker/config.ts

@@ -87,7 +87,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.5.3': ['Elastic License 2.0'],
-  '@elastic/eui@97.3.1': ['Elastic License 2.0 OR AGPL-3.0-only OR SSPL-1.0'],
+  '@elastic/eui@97.3.1-borealis.2': ['Elastic License 2.0 OR AGPL-3.0-only OR SSPL-1.0'],
+  '@elastic/eui-theme-borealis@0.0.2': ['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@1.2.1': ['Apache-2.0'], // license (Apache-2.0 AND BSD-3-Clause)

src/plugins/home/public/application/components/_solutions_section.scss

@@ -24,6 +24,6 @@
   }
 
   &--securitySolution img {
-    background-color: $euiColorSuccess;
+    background-color: $euiColorAccentSecondary;
   }
 }

x-pack/plugins/maps/public/classes/styles/heatmap/components/__snapshots__/heatmap_style_editor.test.tsx.snap

@@ -107,9 +107,9 @@ exports[`HeatmapStyleEditor is rendered 1`] = `
             "#84a9cd",
             "#a8bfda",
             "#cad7e8",
-            "#f0d3b0",
+            "#f5d9b1",
-            "#ecb385",
+            "#efb785",
-            "#ea8d69",
+            "#eb8f69",
             "#e7664c",
           ],
           "type": "gradient",

x-pack/plugins/security/server/__snapshots__/prompt_page.test.tsx.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`PromptPage renders as expected with additional scripts 1`] = `"<html lang=\\"en\\"><head><title>Elastic</title><style></style><style data-emotion=\\"eui \\"></style></style><link href=\\"/bundles/kbn-ui-shared-deps-src/kbn-ui-shared-deps-src.css\\" rel=\\"stylesheet\\"/>MockedFonts<link rel=\\"alternate icon\\" type=\\"image/png\\" href=\\"/ui/favicons/favicon.png\\"/><link rel=\\"icon\\" type=\\"image/svg+xml\\" href=\\"/ui/favicons/favicon.svg\\"/><script src=\\"/mock-basepath/some/script1.js\\"></script><script src=\\"/mock-basepath/some/script2.js\\"></script><meta name=\\"theme-color\\" content=\\"#ffffff\\"/><meta name=\\"color-scheme\\" content=\\"light dark\\"/></head><body><div data-test-subj=\\"promptPage\\" style=\\"min-block-size:max(460px, 100vh);padding-block-start:var(--euiFixedHeadersOffset, 0)\\" class=\\"euiPageTemplate eui-cjgvy1-euiPageOuter-row-grow\\"><main id=\\"EuiPageTemplateInner_generated-id\\" class=\\"eui-nq554q-euiPageInner\\"><section class=\\"eui-j6zf49-euiPageSection-grow-l-center-transparent\\"><div class=\\"eui-1oc2fb7-euiPageSection__content-l-center\\"><div class=\\"euiPanel euiPanel--plain euiEmptyPrompt eui-1is22ji-euiPanel-m-plain-hasShadow-euiEmptyPrompt-vertical\\"><div class=\\"euiEmptyPrompt__main eui-1s4ogs-euiEmptyPrompt__main-vertical-l\\"><div class=\\"euiEmptyPrompt__icon eui-1ysd0i8-euiEmptyPrompt__icon-vertical\\"><span data-euiicon-type=\\"warning\\" color=\\"danger\\"></span></div><div class=\\"euiEmptyPrompt__content eui-1cebog9-euiEmptyPrompt__content-vertical\\"><h2 class=\\"euiTitle eui-smz32e-euiTitle-m\\">Some Title</h2><div class=\\"euiSpacer euiSpacer--m eui-jv9za2-euiSpacer-m\\"></div><div class=\\"euiText eui-k2mw53-euiText-m-euiTextColor-subdued\\"><div>Some Body</div></div><div class=\\"euiSpacer euiSpacer--l eui-p2o3x6-euiSpacer-l\\"></div><div class=\\"euiFlexGroup euiEmptyPrompt__actions eui-1rkti4c-euiFlexGroup-m-center-center-column-euiEmptyPrompt__actions-vertical\\"><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><span>Action#1</span></div><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><span>Action#2</span></div></div></div></div></div></div></section></main></div></body></html>"`;
+exports[`PromptPage renders as expected with additional scripts 1`] = `"<html lang=\\"en\\"><head><title>Elastic</title><style></style><style data-emotion=\\"eui \\"></style></style><link href=\\"/bundles/kbn-ui-shared-deps-src/kbn-ui-shared-deps-src.css\\" rel=\\"stylesheet\\"/>MockedFonts<link rel=\\"alternate icon\\" type=\\"image/png\\" href=\\"/ui/favicons/favicon.png\\"/><link rel=\\"icon\\" type=\\"image/svg+xml\\" href=\\"/ui/favicons/favicon.svg\\"/><script src=\\"/mock-basepath/some/script1.js\\"></script><script src=\\"/mock-basepath/some/script2.js\\"></script><meta name=\\"theme-color\\" content=\\"#ffffff\\"/><meta name=\\"color-scheme\\" content=\\"light dark\\"/></head><body><div data-test-subj=\\"promptPage\\" style=\\"min-block-size:max(460px, 100vh);padding-block-start:var(--euiFixedHeadersOffset, 0)\\" class=\\"euiPageTemplate eui-cjgvy1-euiPageOuter-row-grow\\"><main id=\\"EuiPageTemplateInner_generated-id\\" class=\\"eui-nq554q-euiPageInner\\"><section class=\\"eui-j6zf49-euiPageSection-grow-l-center-transparent\\"><div class=\\"eui-1oc2fb7-euiPageSection__content-l-center\\"><div class=\\"euiPanel euiPanel--plain euiEmptyPrompt eui-1s6x8fk-euiPanel-m-plain-hasShadow-euiEmptyPrompt-vertical\\"><div class=\\"euiEmptyPrompt__main eui-1s4ogs-euiEmptyPrompt__main-vertical-l\\"><div class=\\"euiEmptyPrompt__icon eui-1ysd0i8-euiEmptyPrompt__icon-vertical\\"><span data-euiicon-type=\\"warning\\" color=\\"danger\\"></span></div><div class=\\"euiEmptyPrompt__content eui-1cebog9-euiEmptyPrompt__content-vertical\\"><h2 class=\\"euiTitle eui-smz32e-euiTitle-m\\">Some Title</h2><div class=\\"euiSpacer euiSpacer--m eui-jv9za2-euiSpacer-m\\"></div><div class=\\"euiText eui-k2mw53-euiText-m-euiTextColor-subdued\\"><div>Some Body</div></div><div class=\\"euiSpacer euiSpacer--l eui-p2o3x6-euiSpacer-l\\"></div><div class=\\"euiFlexGroup euiEmptyPrompt__actions eui-1rkti4c-euiFlexGroup-m-center-center-column-euiEmptyPrompt__actions-vertical\\"><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><span>Action#1</span></div><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><span>Action#2</span></div></div></div></div></div></div></section></main></div></body></html>"`;
 
-exports[`PromptPage renders as expected without additional scripts 1`] = `"<html lang=\\"en\\"><head><title>Elastic</title><style></style><style data-emotion=\\"eui \\"></style></style><link href=\\"/bundles/kbn-ui-shared-deps-src/kbn-ui-shared-deps-src.css\\" rel=\\"stylesheet\\"/>MockedFonts<link rel=\\"alternate icon\\" type=\\"image/png\\" href=\\"/ui/favicons/favicon.png\\"/><link rel=\\"icon\\" type=\\"image/svg+xml\\" href=\\"/ui/favicons/favicon.svg\\"/><meta name=\\"theme-color\\" content=\\"#ffffff\\"/><meta name=\\"color-scheme\\" content=\\"light dark\\"/></head><body><div data-test-subj=\\"promptPage\\" style=\\"min-block-size:max(460px, 100vh);padding-block-start:var(--euiFixedHeadersOffset, 0)\\" class=\\"euiPageTemplate eui-cjgvy1-euiPageOuter-row-grow\\"><main id=\\"EuiPageTemplateInner_generated-id\\" class=\\"eui-nq554q-euiPageInner\\"><section class=\\"eui-j6zf49-euiPageSection-grow-l-center-transparent\\"><div class=\\"eui-1oc2fb7-euiPageSection__content-l-center\\"><div class=\\"euiPanel euiPanel--plain euiEmptyPrompt eui-1is22ji-euiPanel-m-plain-hasShadow-euiEmptyPrompt-vertical\\"><div class=\\"euiEmptyPrompt__main eui-1s4ogs-euiEmptyPrompt__main-vertical-l\\"><div class=\\"euiEmptyPrompt__icon eui-1ysd0i8-euiEmptyPrompt__icon-vertical\\"><span data-euiicon-type=\\"warning\\" color=\\"danger\\"></span></div><div class=\\"euiEmptyPrompt__content eui-1cebog9-euiEmptyPrompt__content-vertical\\"><h2 class=\\"euiTitle eui-smz32e-euiTitle-m\\">Some Title</h2><div class=\\"euiSpacer euiSpacer--m eui-jv9za2-euiSpacer-m\\"></div><div class=\\"euiText eui-k2mw53-euiText-m-euiTextColor-subdued\\"><div>Some Body</div></div><div class=\\"euiSpacer euiSpacer--l eui-p2o3x6-euiSpacer-l\\"></div><div class=\\"euiFlexGroup euiEmptyPrompt__actions eui-1rkti4c-euiFlexGroup-m-center-center-column-euiEmptyPrompt__actions-vertical\\"><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><span>Action#1</span></div><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><span>Action#2</span></div></div></div></div></div></div></section></main></div></body></html>"`;
+exports[`PromptPage renders as expected without additional scripts 1`] = `"<html lang=\\"en\\"><head><title>Elastic</title><style></style><style data-emotion=\\"eui \\"></style></style><link href=\\"/bundles/kbn-ui-shared-deps-src/kbn-ui-shared-deps-src.css\\" rel=\\"stylesheet\\"/>MockedFonts<link rel=\\"alternate icon\\" type=\\"image/png\\" href=\\"/ui/favicons/favicon.png\\"/><link rel=\\"icon\\" type=\\"image/svg+xml\\" href=\\"/ui/favicons/favicon.svg\\"/><meta name=\\"theme-color\\" content=\\"#ffffff\\"/><meta name=\\"color-scheme\\" content=\\"light dark\\"/></head><body><div data-test-subj=\\"promptPage\\" style=\\"min-block-size:max(460px, 100vh);padding-block-start:var(--euiFixedHeadersOffset, 0)\\" class=\\"euiPageTemplate eui-cjgvy1-euiPageOuter-row-grow\\"><main id=\\"EuiPageTemplateInner_generated-id\\" class=\\"eui-nq554q-euiPageInner\\"><section class=\\"eui-j6zf49-euiPageSection-grow-l-center-transparent\\"><div class=\\"eui-1oc2fb7-euiPageSection__content-l-center\\"><div class=\\"euiPanel euiPanel--plain euiEmptyPrompt eui-1s6x8fk-euiPanel-m-plain-hasShadow-euiEmptyPrompt-vertical\\"><div class=\\"euiEmptyPrompt__main eui-1s4ogs-euiEmptyPrompt__main-vertical-l\\"><div class=\\"euiEmptyPrompt__icon eui-1ysd0i8-euiEmptyPrompt__icon-vertical\\"><span data-euiicon-type=\\"warning\\" color=\\"danger\\"></span></div><div class=\\"euiEmptyPrompt__content eui-1cebog9-euiEmptyPrompt__content-vertical\\"><h2 class=\\"euiTitle eui-smz32e-euiTitle-m\\">Some Title</h2><div class=\\"euiSpacer euiSpacer--m eui-jv9za2-euiSpacer-m\\"></div><div class=\\"euiText eui-k2mw53-euiText-m-euiTextColor-subdued\\"><div>Some Body</div></div><div class=\\"euiSpacer euiSpacer--l eui-p2o3x6-euiSpacer-l\\"></div><div class=\\"euiFlexGroup euiEmptyPrompt__actions eui-1rkti4c-euiFlexGroup-m-center-center-column-euiEmptyPrompt__actions-vertical\\"><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><span>Action#1</span></div><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><span>Action#2</span></div></div></div></div></div></div></section></main></div></body></html>"`;

x-pack/plugins/security/server/authentication/__snapshots__/unauthenticated_page.test.tsx.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`UnauthenticatedPage renders as expected 1`] = `"<html lang=\\"en\\"><head><title>Elastic</title><style></style><style data-emotion=\\"eui \\"></style></style><link href=\\"/bundles/kbn-ui-shared-deps-src/kbn-ui-shared-deps-src.css\\" rel=\\"stylesheet\\"/>MockedFonts<link rel=\\"alternate icon\\" type=\\"image/png\\" href=\\"/ui/favicons/favicon.png\\"/><link rel=\\"icon\\" type=\\"image/svg+xml\\" href=\\"/ui/favicons/favicon.svg\\"/><meta name=\\"theme-color\\" content=\\"#ffffff\\"/><meta name=\\"color-scheme\\" content=\\"light dark\\"/></head><body><div data-test-subj=\\"promptPage\\" style=\\"min-block-size:max(460px, 100vh);padding-block-start:var(--euiFixedHeadersOffset, 0)\\" class=\\"euiPageTemplate eui-cjgvy1-euiPageOuter-row-grow\\"><main id=\\"EuiPageTemplateInner_generated-id\\" class=\\"eui-nq554q-euiPageInner\\"><section class=\\"eui-j6zf49-euiPageSection-grow-l-center-transparent\\"><div class=\\"eui-1oc2fb7-euiPageSection__content-l-center\\"><div class=\\"euiPanel euiPanel--plain euiEmptyPrompt eui-1is22ji-euiPanel-m-plain-hasShadow-euiEmptyPrompt-vertical\\"><div class=\\"euiEmptyPrompt__main eui-1s4ogs-euiEmptyPrompt__main-vertical-l\\"><div class=\\"euiEmptyPrompt__icon eui-1ysd0i8-euiEmptyPrompt__icon-vertical\\"><span data-euiicon-type=\\"warning\\" color=\\"danger\\"></span></div><div class=\\"euiEmptyPrompt__content eui-1cebog9-euiEmptyPrompt__content-vertical\\"><h2 class=\\"euiTitle eui-smz32e-euiTitle-m\\">We hit an authentication error</h2><div class=\\"euiSpacer euiSpacer--m eui-jv9za2-euiSpacer-m\\"></div><div class=\\"euiText eui-k2mw53-euiText-m-euiTextColor-subdued\\"><p>Try logging in again, and if the problem persists, contact your system administrator.</p></div><div class=\\"euiSpacer euiSpacer--l eui-p2o3x6-euiSpacer-l\\"></div><div class=\\"euiFlexGroup euiEmptyPrompt__actions eui-1rkti4c-euiFlexGroup-m-center-center-column-euiEmptyPrompt__actions-vertical\\"><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><a href=\\"/some/url?some-query=some-value#some-hash\\" rel=\\"noreferrer\\" class=\\"euiButton eui-4wl8yg-euiButtonDisplay-m-defaultMinWidth-fill-primary\\" data-test-subj=\\"logInButton\\"><span class=\\"eui-cf8eum-euiButtonDisplayContent\\">Log in</span></a></div></div></div></div></div></div></section></main></div></body></html>"`;
+exports[`UnauthenticatedPage renders as expected 1`] = `"<html lang=\\"en\\"><head><title>Elastic</title><style></style><style data-emotion=\\"eui \\"></style></style><link href=\\"/bundles/kbn-ui-shared-deps-src/kbn-ui-shared-deps-src.css\\" rel=\\"stylesheet\\"/>MockedFonts<link rel=\\"alternate icon\\" type=\\"image/png\\" href=\\"/ui/favicons/favicon.png\\"/><link rel=\\"icon\\" type=\\"image/svg+xml\\" href=\\"/ui/favicons/favicon.svg\\"/><meta name=\\"theme-color\\" content=\\"#ffffff\\"/><meta name=\\"color-scheme\\" content=\\"light dark\\"/></head><body><div data-test-subj=\\"promptPage\\" style=\\"min-block-size:max(460px, 100vh);padding-block-start:var(--euiFixedHeadersOffset, 0)\\" class=\\"euiPageTemplate eui-cjgvy1-euiPageOuter-row-grow\\"><main id=\\"EuiPageTemplateInner_generated-id\\" class=\\"eui-nq554q-euiPageInner\\"><section class=\\"eui-j6zf49-euiPageSection-grow-l-center-transparent\\"><div class=\\"eui-1oc2fb7-euiPageSection__content-l-center\\"><div class=\\"euiPanel euiPanel--plain euiEmptyPrompt eui-1s6x8fk-euiPanel-m-plain-hasShadow-euiEmptyPrompt-vertical\\"><div class=\\"euiEmptyPrompt__main eui-1s4ogs-euiEmptyPrompt__main-vertical-l\\"><div class=\\"euiEmptyPrompt__icon eui-1ysd0i8-euiEmptyPrompt__icon-vertical\\"><span data-euiicon-type=\\"warning\\" color=\\"danger\\"></span></div><div class=\\"euiEmptyPrompt__content eui-1cebog9-euiEmptyPrompt__content-vertical\\"><h2 class=\\"euiTitle eui-smz32e-euiTitle-m\\">We hit an authentication error</h2><div class=\\"euiSpacer euiSpacer--m eui-jv9za2-euiSpacer-m\\"></div><div class=\\"euiText eui-k2mw53-euiText-m-euiTextColor-subdued\\"><p>Try logging in again, and if the problem persists, contact your system administrator.</p></div><div class=\\"euiSpacer euiSpacer--l eui-p2o3x6-euiSpacer-l\\"></div><div class=\\"euiFlexGroup euiEmptyPrompt__actions eui-1rkti4c-euiFlexGroup-m-center-center-column-euiEmptyPrompt__actions-vertical\\"><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><a href=\\"/some/url?some-query=some-value#some-hash\\" rel=\\"noreferrer\\" class=\\"euiButton eui-4wl8yg-euiButtonDisplay-m-defaultMinWidth-fill-primary\\" data-test-subj=\\"logInButton\\"><span class=\\"eui-cf8eum-euiButtonDisplayContent\\">Log in</span></a></div></div></div></div></div></div></section></main></div></body></html>"`;
 
-exports[`UnauthenticatedPage renders as expected with custom title 1`] = `"<html lang=\\"en\\"><head><title>My Company Name</title><style></style><style data-emotion=\\"eui \\"></style></style><link href=\\"/bundles/kbn-ui-shared-deps-src/kbn-ui-shared-deps-src.css\\" rel=\\"stylesheet\\"/>MockedFonts<link rel=\\"alternate icon\\" type=\\"image/png\\" href=\\"/ui/favicons/favicon.png\\"/><link rel=\\"icon\\" type=\\"image/svg+xml\\" href=\\"/ui/favicons/favicon.svg\\"/><meta name=\\"theme-color\\" content=\\"#ffffff\\"/><meta name=\\"color-scheme\\" content=\\"light dark\\"/></head><body><div data-test-subj=\\"promptPage\\" style=\\"min-block-size:max(460px, 100vh);padding-block-start:var(--euiFixedHeadersOffset, 0)\\" class=\\"euiPageTemplate eui-cjgvy1-euiPageOuter-row-grow\\"><main id=\\"EuiPageTemplateInner_generated-id\\" class=\\"eui-nq554q-euiPageInner\\"><section class=\\"eui-j6zf49-euiPageSection-grow-l-center-transparent\\"><div class=\\"eui-1oc2fb7-euiPageSection__content-l-center\\"><div class=\\"euiPanel euiPanel--plain euiEmptyPrompt eui-1is22ji-euiPanel-m-plain-hasShadow-euiEmptyPrompt-vertical\\"><div class=\\"euiEmptyPrompt__main eui-1s4ogs-euiEmptyPrompt__main-vertical-l\\"><div class=\\"euiEmptyPrompt__icon eui-1ysd0i8-euiEmptyPrompt__icon-vertical\\"><span data-euiicon-type=\\"warning\\" color=\\"danger\\"></span></div><div class=\\"euiEmptyPrompt__content eui-1cebog9-euiEmptyPrompt__content-vertical\\"><h2 class=\\"euiTitle eui-smz32e-euiTitle-m\\">We hit an authentication error</h2><div class=\\"euiSpacer euiSpacer--m eui-jv9za2-euiSpacer-m\\"></div><div class=\\"euiText eui-k2mw53-euiText-m-euiTextColor-subdued\\"><p>Try logging in again, and if the problem persists, contact your system administrator.</p></div><div class=\\"euiSpacer euiSpacer--l eui-p2o3x6-euiSpacer-l\\"></div><div class=\\"euiFlexGroup euiEmptyPrompt__actions eui-1rkti4c-euiFlexGroup-m-center-center-column-euiEmptyPrompt__actions-vertical\\"><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><a href=\\"/some/url?some-query=some-value#some-hash\\" rel=\\"noreferrer\\" class=\\"euiButton eui-4wl8yg-euiButtonDisplay-m-defaultMinWidth-fill-primary\\" data-test-subj=\\"logInButton\\"><span class=\\"eui-cf8eum-euiButtonDisplayContent\\">Log in</span></a></div></div></div></div></div></div></section></main></div></body></html>"`;
+exports[`UnauthenticatedPage renders as expected with custom title 1`] = `"<html lang=\\"en\\"><head><title>My Company Name</title><style></style><style data-emotion=\\"eui \\"></style></style><link href=\\"/bundles/kbn-ui-shared-deps-src/kbn-ui-shared-deps-src.css\\" rel=\\"stylesheet\\"/>MockedFonts<link rel=\\"alternate icon\\" type=\\"image/png\\" href=\\"/ui/favicons/favicon.png\\"/><link rel=\\"icon\\" type=\\"image/svg+xml\\" href=\\"/ui/favicons/favicon.svg\\"/><meta name=\\"theme-color\\" content=\\"#ffffff\\"/><meta name=\\"color-scheme\\" content=\\"light dark\\"/></head><body><div data-test-subj=\\"promptPage\\" style=\\"min-block-size:max(460px, 100vh);padding-block-start:var(--euiFixedHeadersOffset, 0)\\" class=\\"euiPageTemplate eui-cjgvy1-euiPageOuter-row-grow\\"><main id=\\"EuiPageTemplateInner_generated-id\\" class=\\"eui-nq554q-euiPageInner\\"><section class=\\"eui-j6zf49-euiPageSection-grow-l-center-transparent\\"><div class=\\"eui-1oc2fb7-euiPageSection__content-l-center\\"><div class=\\"euiPanel euiPanel--plain euiEmptyPrompt eui-1s6x8fk-euiPanel-m-plain-hasShadow-euiEmptyPrompt-vertical\\"><div class=\\"euiEmptyPrompt__main eui-1s4ogs-euiEmptyPrompt__main-vertical-l\\"><div class=\\"euiEmptyPrompt__icon eui-1ysd0i8-euiEmptyPrompt__icon-vertical\\"><span data-euiicon-type=\\"warning\\" color=\\"danger\\"></span></div><div class=\\"euiEmptyPrompt__content eui-1cebog9-euiEmptyPrompt__content-vertical\\"><h2 class=\\"euiTitle eui-smz32e-euiTitle-m\\">We hit an authentication error</h2><div class=\\"euiSpacer euiSpacer--m eui-jv9za2-euiSpacer-m\\"></div><div class=\\"euiText eui-k2mw53-euiText-m-euiTextColor-subdued\\"><p>Try logging in again, and if the problem persists, contact your system administrator.</p></div><div class=\\"euiSpacer euiSpacer--l eui-p2o3x6-euiSpacer-l\\"></div><div class=\\"euiFlexGroup euiEmptyPrompt__actions eui-1rkti4c-euiFlexGroup-m-center-center-column-euiEmptyPrompt__actions-vertical\\"><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><a href=\\"/some/url?some-query=some-value#some-hash\\" rel=\\"noreferrer\\" class=\\"euiButton eui-4wl8yg-euiButtonDisplay-m-defaultMinWidth-fill-primary\\" data-test-subj=\\"logInButton\\"><span class=\\"eui-cf8eum-euiButtonDisplayContent\\">Log in</span></a></div></div></div></div></div></div></section></main></div></body></html>"`;

x-pack/plugins/security/server/authorization/__snapshots__/reset_session_page.test.tsx.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`ResetSessionPage renders as expected 1`] = `"<html lang=\\"en\\"><head><title>Elastic</title><style></style><style data-emotion=\\"eui \\"></style></style><link href=\\"/bundles/kbn-ui-shared-deps-src/kbn-ui-shared-deps-src.css\\" rel=\\"stylesheet\\"/>MockedFonts<link rel=\\"alternate icon\\" type=\\"image/png\\" href=\\"/ui/favicons/favicon.png\\"/><link rel=\\"icon\\" type=\\"image/svg+xml\\" href=\\"/ui/favicons/favicon.svg\\"/><script src=\\"/mock-basepath/internal/security/reset_session_page.js\\"></script><meta name=\\"theme-color\\" content=\\"#ffffff\\"/><meta name=\\"color-scheme\\" content=\\"light dark\\"/></head><body><div data-test-subj=\\"promptPage\\" style=\\"min-block-size:max(460px, 100vh);padding-block-start:var(--euiFixedHeadersOffset, 0)\\" class=\\"euiPageTemplate eui-cjgvy1-euiPageOuter-row-grow\\"><main id=\\"EuiPageTemplateInner_generated-id\\" class=\\"eui-nq554q-euiPageInner\\"><section class=\\"eui-j6zf49-euiPageSection-grow-l-center-transparent\\"><div class=\\"eui-1oc2fb7-euiPageSection__content-l-center\\"><div class=\\"euiPanel euiPanel--plain euiEmptyPrompt eui-1is22ji-euiPanel-m-plain-hasShadow-euiEmptyPrompt-vertical\\"><div class=\\"euiEmptyPrompt__main eui-1s4ogs-euiEmptyPrompt__main-vertical-l\\"><div class=\\"euiEmptyPrompt__icon eui-1ysd0i8-euiEmptyPrompt__icon-vertical\\"><span data-euiicon-type=\\"warning\\" color=\\"danger\\"></span></div><div class=\\"euiEmptyPrompt__content eui-1cebog9-euiEmptyPrompt__content-vertical\\"><h2 class=\\"euiTitle eui-smz32e-euiTitle-m\\">You do not have permission to access the requested page</h2><div class=\\"euiSpacer euiSpacer--m eui-jv9za2-euiSpacer-m\\"></div><div class=\\"euiText eui-k2mw53-euiText-m-euiTextColor-subdued\\"><p>Either go back to the previous page or log in as a different user.</p></div><div class=\\"euiSpacer euiSpacer--l eui-p2o3x6-euiSpacer-l\\"></div><div class=\\"euiFlexGroup euiEmptyPrompt__actions eui-1rkti4c-euiFlexGroup-m-center-center-column-euiEmptyPrompt__actions-vertical\\"><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><a href=\\"/path/to/logout\\" rel=\\"noreferrer\\" class=\\"euiButton eui-4wl8yg-euiButtonDisplay-m-defaultMinWidth-fill-primary\\" data-test-subj=\\"ResetSessionButton\\"><span class=\\"eui-cf8eum-euiButtonDisplayContent\\">Log in as different user</span></a></div><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><button class=\\"euiButtonEmpty eui-7vyy05-euiButtonDisplay-euiButtonEmpty-m-empty-primary\\" type=\\"button\\" id=\\"goBackButton\\"><span class=\\"euiButtonEmpty__content eui-cf8eum-euiButtonDisplayContent\\"><span class=\\"eui-textTruncate euiButtonEmpty__text\\">Go back</span></span></button></div></div></div></div></div></div></section></main></div></body></html>"`;
+exports[`ResetSessionPage renders as expected 1`] = `"<html lang=\\"en\\"><head><title>Elastic</title><style></style><style data-emotion=\\"eui \\"></style></style><link href=\\"/bundles/kbn-ui-shared-deps-src/kbn-ui-shared-deps-src.css\\" rel=\\"stylesheet\\"/>MockedFonts<link rel=\\"alternate icon\\" type=\\"image/png\\" href=\\"/ui/favicons/favicon.png\\"/><link rel=\\"icon\\" type=\\"image/svg+xml\\" href=\\"/ui/favicons/favicon.svg\\"/><script src=\\"/mock-basepath/internal/security/reset_session_page.js\\"></script><meta name=\\"theme-color\\" content=\\"#ffffff\\"/><meta name=\\"color-scheme\\" content=\\"light dark\\"/></head><body><div data-test-subj=\\"promptPage\\" style=\\"min-block-size:max(460px, 100vh);padding-block-start:var(--euiFixedHeadersOffset, 0)\\" class=\\"euiPageTemplate eui-cjgvy1-euiPageOuter-row-grow\\"><main id=\\"EuiPageTemplateInner_generated-id\\" class=\\"eui-nq554q-euiPageInner\\"><section class=\\"eui-j6zf49-euiPageSection-grow-l-center-transparent\\"><div class=\\"eui-1oc2fb7-euiPageSection__content-l-center\\"><div class=\\"euiPanel euiPanel--plain euiEmptyPrompt eui-1s6x8fk-euiPanel-m-plain-hasShadow-euiEmptyPrompt-vertical\\"><div class=\\"euiEmptyPrompt__main eui-1s4ogs-euiEmptyPrompt__main-vertical-l\\"><div class=\\"euiEmptyPrompt__icon eui-1ysd0i8-euiEmptyPrompt__icon-vertical\\"><span data-euiicon-type=\\"warning\\" color=\\"danger\\"></span></div><div class=\\"euiEmptyPrompt__content eui-1cebog9-euiEmptyPrompt__content-vertical\\"><h2 class=\\"euiTitle eui-smz32e-euiTitle-m\\">You do not have permission to access the requested page</h2><div class=\\"euiSpacer euiSpacer--m eui-jv9za2-euiSpacer-m\\"></div><div class=\\"euiText eui-k2mw53-euiText-m-euiTextColor-subdued\\"><p>Either go back to the previous page or log in as a different user.</p></div><div class=\\"euiSpacer euiSpacer--l eui-p2o3x6-euiSpacer-l\\"></div><div class=\\"euiFlexGroup euiEmptyPrompt__actions eui-1rkti4c-euiFlexGroup-m-center-center-column-euiEmptyPrompt__actions-vertical\\"><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><a href=\\"/path/to/logout\\" rel=\\"noreferrer\\" class=\\"euiButton eui-4wl8yg-euiButtonDisplay-m-defaultMinWidth-fill-primary\\" data-test-subj=\\"ResetSessionButton\\"><span class=\\"eui-cf8eum-euiButtonDisplayContent\\">Log in as different user</span></a></div><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><button class=\\"euiButtonEmpty eui-7vyy05-euiButtonDisplay-euiButtonEmpty-m-empty-primary\\" type=\\"button\\" id=\\"goBackButton\\"><span class=\\"euiButtonEmpty__content eui-cf8eum-euiButtonDisplayContent\\"><span class=\\"eui-textTruncate euiButtonEmpty__text\\">Go back</span></span></button></div></div></div></div></div></div></section></main></div></body></html>"`;
 
-exports[`ResetSessionPage renders as expected with custom page title 1`] = `"<html lang=\\"en\\"><head><title>My Company Name</title><style></style><style data-emotion=\\"eui \\"></style></style><link href=\\"/bundles/kbn-ui-shared-deps-src/kbn-ui-shared-deps-src.css\\" rel=\\"stylesheet\\"/>MockedFonts<link rel=\\"alternate icon\\" type=\\"image/png\\" href=\\"/ui/favicons/favicon.png\\"/><link rel=\\"icon\\" type=\\"image/svg+xml\\" href=\\"/ui/favicons/favicon.svg\\"/><script src=\\"/mock-basepath/internal/security/reset_session_page.js\\"></script><meta name=\\"theme-color\\" content=\\"#ffffff\\"/><meta name=\\"color-scheme\\" content=\\"light dark\\"/></head><body><div data-test-subj=\\"promptPage\\" style=\\"min-block-size:max(460px, 100vh);padding-block-start:var(--euiFixedHeadersOffset, 0)\\" class=\\"euiPageTemplate eui-cjgvy1-euiPageOuter-row-grow\\"><main id=\\"EuiPageTemplateInner_generated-id\\" class=\\"eui-nq554q-euiPageInner\\"><section class=\\"eui-j6zf49-euiPageSection-grow-l-center-transparent\\"><div class=\\"eui-1oc2fb7-euiPageSection__content-l-center\\"><div class=\\"euiPanel euiPanel--plain euiEmptyPrompt eui-1is22ji-euiPanel-m-plain-hasShadow-euiEmptyPrompt-vertical\\"><div class=\\"euiEmptyPrompt__main eui-1s4ogs-euiEmptyPrompt__main-vertical-l\\"><div class=\\"euiEmptyPrompt__icon eui-1ysd0i8-euiEmptyPrompt__icon-vertical\\"><span data-euiicon-type=\\"warning\\" color=\\"danger\\"></span></div><div class=\\"euiEmptyPrompt__content eui-1cebog9-euiEmptyPrompt__content-vertical\\"><h2 class=\\"euiTitle eui-smz32e-euiTitle-m\\">You do not have permission to access the requested page</h2><div class=\\"euiSpacer euiSpacer--m eui-jv9za2-euiSpacer-m\\"></div><div class=\\"euiText eui-k2mw53-euiText-m-euiTextColor-subdued\\"><p>Either go back to the previous page or log in as a different user.</p></div><div class=\\"euiSpacer euiSpacer--l eui-p2o3x6-euiSpacer-l\\"></div><div class=\\"euiFlexGroup euiEmptyPrompt__actions eui-1rkti4c-euiFlexGroup-m-center-center-column-euiEmptyPrompt__actions-vertical\\"><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><a href=\\"/path/to/logout\\" rel=\\"noreferrer\\" class=\\"euiButton eui-4wl8yg-euiButtonDisplay-m-defaultMinWidth-fill-primary\\" data-test-subj=\\"ResetSessionButton\\"><span class=\\"eui-cf8eum-euiButtonDisplayContent\\">Log in as different user</span></a></div><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><button class=\\"euiButtonEmpty eui-7vyy05-euiButtonDisplay-euiButtonEmpty-m-empty-primary\\" type=\\"button\\" id=\\"goBackButton\\"><span class=\\"euiButtonEmpty__content eui-cf8eum-euiButtonDisplayContent\\"><span class=\\"eui-textTruncate euiButtonEmpty__text\\">Go back</span></span></button></div></div></div></div></div></div></section></main></div></body></html>"`;
+exports[`ResetSessionPage renders as expected with custom page title 1`] = `"<html lang=\\"en\\"><head><title>My Company Name</title><style></style><style data-emotion=\\"eui \\"></style></style><link href=\\"/bundles/kbn-ui-shared-deps-src/kbn-ui-shared-deps-src.css\\" rel=\\"stylesheet\\"/>MockedFonts<link rel=\\"alternate icon\\" type=\\"image/png\\" href=\\"/ui/favicons/favicon.png\\"/><link rel=\\"icon\\" type=\\"image/svg+xml\\" href=\\"/ui/favicons/favicon.svg\\"/><script src=\\"/mock-basepath/internal/security/reset_session_page.js\\"></script><meta name=\\"theme-color\\" content=\\"#ffffff\\"/><meta name=\\"color-scheme\\" content=\\"light dark\\"/></head><body><div data-test-subj=\\"promptPage\\" style=\\"min-block-size:max(460px, 100vh);padding-block-start:var(--euiFixedHeadersOffset, 0)\\" class=\\"euiPageTemplate eui-cjgvy1-euiPageOuter-row-grow\\"><main id=\\"EuiPageTemplateInner_generated-id\\" class=\\"eui-nq554q-euiPageInner\\"><section class=\\"eui-j6zf49-euiPageSection-grow-l-center-transparent\\"><div class=\\"eui-1oc2fb7-euiPageSection__content-l-center\\"><div class=\\"euiPanel euiPanel--plain euiEmptyPrompt eui-1s6x8fk-euiPanel-m-plain-hasShadow-euiEmptyPrompt-vertical\\"><div class=\\"euiEmptyPrompt__main eui-1s4ogs-euiEmptyPrompt__main-vertical-l\\"><div class=\\"euiEmptyPrompt__icon eui-1ysd0i8-euiEmptyPrompt__icon-vertical\\"><span data-euiicon-type=\\"warning\\" color=\\"danger\\"></span></div><div class=\\"euiEmptyPrompt__content eui-1cebog9-euiEmptyPrompt__content-vertical\\"><h2 class=\\"euiTitle eui-smz32e-euiTitle-m\\">You do not have permission to access the requested page</h2><div class=\\"euiSpacer euiSpacer--m eui-jv9za2-euiSpacer-m\\"></div><div class=\\"euiText eui-k2mw53-euiText-m-euiTextColor-subdued\\"><p>Either go back to the previous page or log in as a different user.</p></div><div class=\\"euiSpacer euiSpacer--l eui-p2o3x6-euiSpacer-l\\"></div><div class=\\"euiFlexGroup euiEmptyPrompt__actions eui-1rkti4c-euiFlexGroup-m-center-center-column-euiEmptyPrompt__actions-vertical\\"><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><a href=\\"/path/to/logout\\" rel=\\"noreferrer\\" class=\\"euiButton eui-4wl8yg-euiButtonDisplay-m-defaultMinWidth-fill-primary\\" data-test-subj=\\"ResetSessionButton\\"><span class=\\"eui-cf8eum-euiButtonDisplayContent\\">Log in as different user</span></a></div><div class=\\"euiFlexItem eui-kpsrin-euiFlexItem-growZero\\"><button class=\\"euiButtonEmpty eui-7vyy05-euiButtonDisplay-euiButtonEmpty-m-empty-primary\\" type=\\"button\\" id=\\"goBackButton\\"><span class=\\"euiButtonEmpty__content eui-cf8eum-euiButtonDisplayContent\\"><span class=\\"eui-textTruncate euiButtonEmpty__text\\">Go back</span></span></button></div></div></div></div></div></div></section></main></div></body></html>"`;

x-pack/plugins/security_solution/public/common/components/endpoint/link_to_app.tsx

@@ -51,7 +51,7 @@ export const LinkToApp = memo<LinkToAppProps>(
             {children}
           </EuiButton>
         ) : (
-          <EuiLink {...otherProps} onClick={handleOnClick}>
+          <EuiLink {...(otherProps as EuiLinkProps)} onClick={handleOnClick}>
             {children}
           </EuiLink>
         )}

x-pack/test/functional/apps/infra/home_page.ts

@@ -426,8 +426,8 @@ export default ({ getPageObjects, getService }: FtrProviderContext) => {
           expect(nodesWithValue).to.eql([
             { name: 'host-5', value: 10, color: '#6092c0' },
             { name: 'host-4', value: 30, color: '#9ab6d5' },
-            { name: 'host-1', value: 50, color: '#f1d9b9' },
+            { name: 'host-1', value: 50, color: '#f6e0b9' },
-            { name: 'host-2', value: 70, color: '#eba47a' },
+            { name: 'host-2', value: 70, color: '#eda77a' },
             { name: 'host-3', value: 90, color: '#e7664c' },
           ]);
         });

x-pack/test/functional/apps/lens/group4/chart_data.ts

@@ -117,7 +117,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
         { key: '5,722.775 - 8,529.22', name: '5,722.775 - 8,529.22', color: '#6092c0' },
         { key: '8,529.22 - 11,335.665', name: '8,529.22 - 11,335.665', color: '#a8bfda' },
         { key: '11,335.665 - 14,142.11', name: '11,335.665 - 14,142.11', color: '#ebeff5' },
-        { key: '14,142.11 - 16,948.555', name: '14,142.11 - 16,948.555', color: '#ecb385' },
+        { key: '14,142.11 - 16,948.555', name: '14,142.11 - 16,948.555', color: '#efb785' },
         { key: '≥ 16,948.555', name: '≥ 16,948.555', color: '#e7664c' },
       ]);
     });

x-pack/test/functional/apps/lens/group5/heatmap.ts

@@ -58,7 +58,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
         { key: '5,722.775 - 8,529.22', name: '5,722.775 - 8,529.22', color: '#6092c0' },
         { key: '8,529.22 - 11,335.665', name: '8,529.22 - 11,335.665', color: '#a8bfda' },
         { key: '11,335.665 - 14,142.11', name: '11,335.665 - 14,142.11', color: '#ebeff5' },
-        { key: '14,142.11 - 16,948.555', name: '14,142.11 - 16,948.555', color: '#ecb385' },
+        { key: '14,142.11 - 16,948.555', name: '14,142.11 - 16,948.555', color: '#efb785' },
         { key: '≥ 16,948.555', name: '≥ 16,948.555', color: '#e7664c' },
       ]);
     });
@@ -80,7 +80,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
         { key: '7,125.997 - 8,529.22', name: '7,125.997 - 8,529.22', color: '#6092c0' },
         { key: '8,529.22 - 11,335.665', name: '8,529.22 - 11,335.665', color: '#a8bfda' },
         { key: '11,335.665 - 14,142.11', name: '11,335.665 - 14,142.11', color: '#ebeff5' },
-        { key: '14,142.11 - 16,948.555', name: '14,142.11 - 16,948.555', color: '#ecb385' },
+        { key: '14,142.11 - 16,948.555', name: '14,142.11 - 16,948.555', color: '#efb785' },
         { key: '≥ 16,948.555', name: '≥ 16,948.555', color: '#e7664c' },
       ]);
     });
@@ -94,7 +94,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
         { key: '7,125.99 - 8,529.2', name: '7,125.99 - 8,529.2', color: '#6092c0' },
         { key: '8,529.2 - 11,335.66', name: '8,529.2 - 11,335.66', color: '#a8bfda' },
         { key: '11,335.66 - 14,142.1', name: '11,335.66 - 14,142.1', color: '#ebeff5' },
-        { key: '14,142.1 - 16,948.55', name: '14,142.1 - 16,948.55', color: '#ecb385' },
+        { key: '14,142.1 - 16,948.55', name: '14,142.1 - 16,948.55', color: '#efb785' },
         {
           color: '#e7664c',
           key: '≥ 16,948.55',
@@ -115,7 +115,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
         { key: '0 - 8,529.2', name: '0 - 8,529.2', color: '#6092c0' },
         { key: '8,529.2 - 11,335.66', name: '8,529.2 - 11,335.66', color: '#a8bfda' },
         { key: '11,335.66 - 14,142.1', name: '11,335.66 - 14,142.1', color: '#ebeff5' },
-        { key: '14,142.1 - 16,948.55', name: '14,142.1 - 16,948.55', color: '#ecb385' },
+        { key: '14,142.1 - 16,948.55', name: '14,142.1 - 16,948.55', color: '#efb785' },
         { key: '≥ 16,948.55', name: '≥ 16,948.55', color: '#e7664c' },
       ]);
     });
@@ -133,7 +133,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
         { key: '5,722.775 - 8,529.2', name: '5,722.775 - 8,529.2', color: '#6092c0' },
         { key: '8,529.2 - 11,335.66', name: '8,529.2 - 11,335.66', color: '#a8bfda' },
         { key: '11,335.66 - 14,142.1', name: '11,335.66 - 14,142.1', color: '#ebeff5' },
-        { key: '14,142.1 - 16,948.55', name: '14,142.1 - 16,948.55', color: '#ecb385' },
+        { key: '14,142.1 - 16,948.55', name: '14,142.1 - 16,948.55', color: '#efb785' },
         { key: '≥ 16,948.55', name: '≥ 16,948.55', color: '#e7664c' },
       ]);
       // assert the cell has the correct coloring despite the legend rounding

yarn.lock

@@ -1748,11 +1748,25 @@
   resolved "https://registry.yarnpkg.com/@elastic/eslint-plugin-eui/-/eslint-plugin-eui-0.0.2.tgz#56b9ef03984a05cc213772ae3713ea8ef47b0314"
   integrity sha512-IoxURM5zraoQ7C8f+mJb9HYSENiZGgRVcG4tLQxE61yHNNRDXtGDWTZh8N1KIHcsqN1CEPETjuzBXkJYF/fDiQ==
 
-"@elastic/eui@97.3.1":
+"@elastic/eui-theme-borealis@0.0.2":
-  version "97.3.1"
+  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-97.3.1.tgz#b0f07c603042bd359544b41829507e65f4fa3cd2"
+  resolved "https://registry.yarnpkg.com/@elastic/eui-theme-borealis/-/eui-theme-borealis-0.0.2.tgz#4b65f13073b1887a12641063ace96539fa923674"
-  integrity sha512-zJs3aaO6qjTdxJM2mPahcqaC6FfaC34yTc3qpQq7+Cbhw2xGrwx8bAfIzhttLU87mwgr59Sqv9Ojvwk8c3js7A==
+  integrity sha512-ekePJ+V9UMCUDqjNLECjM+Vi/qHkJcu6lhm1GenUFs3awPxaLhvasb3pN++qnWYkXWo90vmZER62MTHpxlQyQA==
+
+"@elastic/eui-theme-common@0.0.2":
+  version "0.0.2"
+  resolved "https://registry.yarnpkg.com/@elastic/eui-theme-common/-/eui-theme-common-0.0.2.tgz#3da6078a5d255c5740423d26409e5e06536a5db3"
+  integrity sha512-tIyXrylrLhmOWiRbxuJSiHHVJpt4fVd5frzhUGoSN2frobOT9RLh8Klzyd4kmHasZ7bB1vETPR5fytqgocRvdA==
   dependencies:
+    "@types/lodash" "^4.14.202"
+    lodash "^4.17.21"
+
+"@elastic/eui@97.3.1-borealis.2":
+  version "97.3.1-borealis.2"
+  resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-97.3.1-borealis.2.tgz#32d9616ddbab11ef6e97739cf728a667220ca74c"
+  integrity sha512-j0WsE+WWtV3eEbRqyjr8hJ1swQIbCEGc9iViMtDK/XeVCVqs++dJE/+jPdjharMjXLrstOr0cx0uvtsH6OWTUw==
+  dependencies:
+    "@elastic/eui-theme-common" "0.0.2"
     "@hello-pangea/dnd" "^16.6.0"
     "@types/lodash" "^4.14.202"
     "@types/numeral" "^2.0.5"