npm - @ember-eui/core - Versions diffs - 16.0.4 → 16.0.6 - Mend

@ember-eui/core 16.0.4 → 16.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5950) hide show

package/dist/utils/eui/theme.js CHANGED Viewed

@@ -1,5 +1,2044 @@
-import { EuiThemeBorealis } from '@elastic/eui-theme-borealis';
-import { getComputed, buildTheme } from '@elastic/eui-theme-common';
+import chroma from 'chroma-js';
+import { c as computed, f as formatMultipleBoxShadow, b as buildTheme, g as getComputed } from '../../eui-theme/utils-BRBkLo19.js';
+import { m as mathWithUnits } from '../../eui-theme/math-alopvQAs.js';
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+/* TODO: move to a shared module package */
+/**
+ * Calculates the `px` value based on a scale multiplier
+ * @param scale - The font scale multiplier
+ * *
+ * @param themeOrBase - Theme base value
+ * *
+ * @returns string - Rem unit aligned to baseline
+ */
+const sizeToPixel = (scale = 1) => themeOrBase => {
+  const base = typeof themeOrBase === 'object' ? themeOrBase.base : themeOrBase;
+  return `${base * scale}px`;
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const PRIMITIVE_COLORS = {
+  white: '#FFFFFF',
+  black: '#000000',
+  blueBlack: '#07101F',
+  transparent: 'transparent',
+  blueGrey10: '#F6F9FC',
+  blueGrey15: '#ECF1F9',
+  blueGrey20: '#E3E8F2',
+  blueGrey25: '#D6DDEA',
+  blueGrey30: '#CAD3E2',
+  blueGrey35: '#C0CCDD',
+  blueGrey40: '#B4C1D5',
+  blueGrey45: '#ABB9D0',
+  blueGrey50: '#A2B1C9',
+  blueGrey55: '#98A8C3',
+  blueGrey60: '#8E9FBC',
+  blueGrey65: '#8497B7',
+  blueGrey70: '#798EAF',
+  blueGrey75: '#7186A8',
+  blueGrey80: '#6A7FA0',
+  blueGrey85: '#627593',
+  blueGrey90: '#5A6D8C',
+  blueGrey95: '#516381',
+  blueGrey100: '#485975',
+  blueGrey105: '#3F4F69',
+  blueGrey110: '#384861',
+  blueGrey115: '#324058',
+  blueGrey120: '#2B394F',
+  blueGrey125: '#243147',
+  blueGrey130: '#1D2A3E',
+  blueGrey135: '#172336',
+  blueGrey140: '#111C2C',
+  blueGrey145: '#0B1628',
+  blue10: '#F1F6FF',
+  blue20: '#D9E8FF',
+  blue30: '#BFDBFF',
+  blue40: '#A3CBFF',
+  blue50: '#85B7FF',
+  blue60: '#61A2FF',
+  blue70: '#3788FF',
+  blue80: '#2476F0',
+  blue90: '#0B64DD',
+  blue100: '#1750BA',
+  blue110: '#154399',
+  blue120: '#123778',
+  blue130: '#0D2F5E',
+  blue140: '#0A2342',
+  sky10: '#ECFBFF',
+  sky20: '#CFEEF7',
+  sky30: '#B5E5F2',
+  sky40: '#94D8EB',
+  sky50: '#63C8E3',
+  sky60: '#37B8DC',
+  sky70: '#0dA1C9',
+  sky80: '#1C8CB5',
+  sky90: '#19799F',
+  sky100: '#0F658A',
+  sky110: '#055476',
+  sky120: '#00425C',
+  sky130: '#003447',
+  sky140: '#002938',
+  teal10: '#EAFBFA',
+  teal20: '#C9F3F0',
+  teal30: '#A6EDEA',
+  teal40: '#77E5E0',
+  teal50: '#51D6D2',
+  teal60: '#16C5C0',
+  teal70: '#00B0AA',
+  teal80: '#009E99',
+  teal90: '#008B87',
+  teal100: '#047471',
+  teal110: '#065B58',
+  teal120: '#044949',
+  teal130: '#023436',
+  teal140: '#03282B',
+  pink10: '#FFF0F8',
+  pink20: '#FDDDE9',
+  pink30: '#FFC7DB',
+  pink40: '#FBADCA',
+  pink50: '#F58EB7',
+  pink60: '#EE72A6',
+  pink70: '#E54A91',
+  pink80: '#D13680',
+  pink90: '#BC1E70',
+  pink100: '#A11262',
+  pink110: '#831652',
+  pink120: '#5E2140',
+  pink130: '#481E32',
+  pink140: '#351725',
+  green10: '#E9FFF7',
+  green20: '#C9F3E3',
+  green30: '#AEE8D2',
+  green40: '#88E3C3',
+  green50: '#59CFAA',
+  green60: '#24C292',
+  green70: '#04AE7E',
+  green80: '#00996B',
+  green90: '#008A5E',
+  green100: '#09724D',
+  green110: '#0C5A3F',
+  green120: '#094837',
+  green130: '#0D362B',
+  green140: '#092A26',
+  yellow10: '#FFF7E2',
+  yellow20: '#FDE9B5',
+  yellow30: '#FCD883',
+  yellow40: '#FACB3D',
+  yellow50: '#F5BC00',
+  yellow60: '#EAAE01',
+  yellow70: '#CA9601',
+  yellow80: '#AD7E00',
+  yellow90: '#966B03',
+  yellow100: '#825803',
+  yellow110: '#6A4906',
+  yellow120: '#513910',
+  yellow130: '#3D3014',
+  yellow140: '#2C2721',
+  orange10: '#FFF3E3',
+  orange20: '#FFDEBF',
+  orange30: '#FFCDA1',
+  orange40: '#FFB787',
+  orange50: '#FF995E',
+  orange60: '#FC8544',
+  orange70: '#ED6723',
+  orange80: '#DB541B',
+  orange90: '#C24411',
+  orange100: '#9E3A16',
+  orange110: '#782E18',
+  orange120: '#5E281A',
+  orange130: '#4A221C',
+  orange140: '#361D18',
+  red10: '#FFF3F1',
+  red20: '#FDDDD8',
+  red30: '#FFC9C2',
+  red40: '#FFB5AD',
+  red50: '#FC9188',
+  red60: '#F6726A',
+  red70: '#EE4C48',
+  red80: '#DA3737',
+  red90: '#C61E25',
+  red100: '#A71627',
+  red110: '#7F1F27',
+  red120: '#5E2129',
+  red130: '#491D27',
+  red140: '#351721',
+  purple10: '#F7F2FF',
+  purple20: '#ECE2FE',
+  purple30: '#E2D3FE',
+  purple40: '#D1BAFC',
+  purple50: '#C5A5FA',
+  purple60: '#B386F9',
+  purple70: '#A36DEF',
+  purple80: '#925CDA',
+  purple90: '#8144CC',
+  purple100: '#6B3C9F',
+  purple110: '#52357E',
+  purple120: '#3E2C63',
+  purple130: '#322452',
+  purple140: '#2A1E3E'
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const _semantic_colors = {
+  plainLight: PRIMITIVE_COLORS.white,
+  plainDark: PRIMITIVE_COLORS.blueBlack,
+  primary10: PRIMITIVE_COLORS.blue10,
+  primary20: PRIMITIVE_COLORS.blue20,
+  primary30: PRIMITIVE_COLORS.blue30,
+  primary40: PRIMITIVE_COLORS.blue40,
+  primary50: PRIMITIVE_COLORS.blue50,
+  primary60: PRIMITIVE_COLORS.blue60,
+  primary70: PRIMITIVE_COLORS.blue70,
+  primary80: PRIMITIVE_COLORS.blue80,
+  primary90: PRIMITIVE_COLORS.blue90,
+  primary100: PRIMITIVE_COLORS.blue100,
+  primary110: PRIMITIVE_COLORS.blue110,
+  primary120: PRIMITIVE_COLORS.blue120,
+  primary130: PRIMITIVE_COLORS.blue130,
+  primary140: PRIMITIVE_COLORS.blue140,
+  accent10: PRIMITIVE_COLORS.pink10,
+  accent20: PRIMITIVE_COLORS.pink20,
+  accent30: PRIMITIVE_COLORS.pink30,
+  accent40: PRIMITIVE_COLORS.pink40,
+  accent50: PRIMITIVE_COLORS.pink50,
+  accent60: PRIMITIVE_COLORS.pink60,
+  accent70: PRIMITIVE_COLORS.pink70,
+  accent80: PRIMITIVE_COLORS.pink80,
+  accent90: PRIMITIVE_COLORS.pink90,
+  accent100: PRIMITIVE_COLORS.pink100,
+  accent110: PRIMITIVE_COLORS.pink110,
+  accent120: PRIMITIVE_COLORS.pink120,
+  accent130: PRIMITIVE_COLORS.pink130,
+  accent140: PRIMITIVE_COLORS.pink140,
+  accentSecondary10: PRIMITIVE_COLORS.teal10,
+  accentSecondary20: PRIMITIVE_COLORS.teal20,
+  accentSecondary30: PRIMITIVE_COLORS.teal30,
+  accentSecondary40: PRIMITIVE_COLORS.teal40,
+  accentSecondary50: PRIMITIVE_COLORS.teal50,
+  accentSecondary60: PRIMITIVE_COLORS.teal60,
+  accentSecondary70: PRIMITIVE_COLORS.teal70,
+  accentSecondary80: PRIMITIVE_COLORS.teal80,
+  accentSecondary90: PRIMITIVE_COLORS.teal90,
+  accentSecondary100: PRIMITIVE_COLORS.teal100,
+  accentSecondary110: PRIMITIVE_COLORS.teal110,
+  accentSecondary120: PRIMITIVE_COLORS.teal120,
+  accentSecondary130: PRIMITIVE_COLORS.teal130,
+  accentSecondary140: PRIMITIVE_COLORS.teal140,
+  neutral10: PRIMITIVE_COLORS.sky10,
+  neutral20: PRIMITIVE_COLORS.sky20,
+  neutral30: PRIMITIVE_COLORS.sky30,
+  neutral40: PRIMITIVE_COLORS.sky40,
+  neutral50: PRIMITIVE_COLORS.sky50,
+  neutral60: PRIMITIVE_COLORS.sky60,
+  neutral70: PRIMITIVE_COLORS.sky70,
+  neutral80: PRIMITIVE_COLORS.sky80,
+  neutral90: PRIMITIVE_COLORS.sky90,
+  neutral100: PRIMITIVE_COLORS.sky100,
+  neutral110: PRIMITIVE_COLORS.sky110,
+  neutral120: PRIMITIVE_COLORS.sky120,
+  neutral130: PRIMITIVE_COLORS.sky130,
+  neutral140: PRIMITIVE_COLORS.sky140,
+  success10: PRIMITIVE_COLORS.green10,
+  success20: PRIMITIVE_COLORS.green20,
+  success30: PRIMITIVE_COLORS.green30,
+  success40: PRIMITIVE_COLORS.green40,
+  success50: PRIMITIVE_COLORS.green50,
+  success60: PRIMITIVE_COLORS.green60,
+  success70: PRIMITIVE_COLORS.green70,
+  success80: PRIMITIVE_COLORS.green80,
+  success90: PRIMITIVE_COLORS.green90,
+  success100: PRIMITIVE_COLORS.green100,
+  success110: PRIMITIVE_COLORS.green110,
+  success120: PRIMITIVE_COLORS.green120,
+  success130: PRIMITIVE_COLORS.green130,
+  success140: PRIMITIVE_COLORS.green140,
+  warning10: PRIMITIVE_COLORS.yellow10,
+  warning20: PRIMITIVE_COLORS.yellow20,
+  warning30: PRIMITIVE_COLORS.yellow30,
+  warning40: PRIMITIVE_COLORS.yellow40,
+  warning50: PRIMITIVE_COLORS.yellow50,
+  warning60: PRIMITIVE_COLORS.yellow60,
+  warning70: PRIMITIVE_COLORS.yellow70,
+  warning80: PRIMITIVE_COLORS.yellow80,
+  warning90: PRIMITIVE_COLORS.yellow90,
+  warning100: PRIMITIVE_COLORS.yellow100,
+  warning110: PRIMITIVE_COLORS.yellow110,
+  warning120: PRIMITIVE_COLORS.yellow120,
+  warning130: PRIMITIVE_COLORS.yellow130,
+  warning140: PRIMITIVE_COLORS.yellow140,
+  danger10: PRIMITIVE_COLORS.red10,
+  danger20: PRIMITIVE_COLORS.red20,
+  danger30: PRIMITIVE_COLORS.red30,
+  danger40: PRIMITIVE_COLORS.red40,
+  danger50: PRIMITIVE_COLORS.red50,
+  danger60: PRIMITIVE_COLORS.red60,
+  danger70: PRIMITIVE_COLORS.red70,
+  danger80: PRIMITIVE_COLORS.red80,
+  danger90: PRIMITIVE_COLORS.red90,
+  danger100: PRIMITIVE_COLORS.red100,
+  danger110: PRIMITIVE_COLORS.red110,
+  danger120: PRIMITIVE_COLORS.red120,
+  danger130: PRIMITIVE_COLORS.red130,
+  danger140: PRIMITIVE_COLORS.red140,
+  risk10: PRIMITIVE_COLORS.orange10,
+  risk20: PRIMITIVE_COLORS.orange20,
+  risk30: PRIMITIVE_COLORS.orange30,
+  risk40: PRIMITIVE_COLORS.orange40,
+  risk50: PRIMITIVE_COLORS.orange50,
+  risk60: PRIMITIVE_COLORS.orange60,
+  risk70: PRIMITIVE_COLORS.orange70,
+  risk80: PRIMITIVE_COLORS.orange80,
+  risk90: PRIMITIVE_COLORS.orange90,
+  risk100: PRIMITIVE_COLORS.orange100,
+  risk110: PRIMITIVE_COLORS.orange110,
+  risk120: PRIMITIVE_COLORS.orange120,
+  risk130: PRIMITIVE_COLORS.orange130,
+  risk140: PRIMITIVE_COLORS.orange140,
+  assistance10: PRIMITIVE_COLORS.purple10,
+  assistance20: PRIMITIVE_COLORS.purple20,
+  assistance30: PRIMITIVE_COLORS.purple30,
+  assistance40: PRIMITIVE_COLORS.purple40,
+  assistance50: PRIMITIVE_COLORS.purple50,
+  assistance60: PRIMITIVE_COLORS.purple60,
+  assistance70: PRIMITIVE_COLORS.purple70,
+  assistance80: PRIMITIVE_COLORS.purple80,
+  assistance90: PRIMITIVE_COLORS.purple90,
+  assistance100: PRIMITIVE_COLORS.purple100,
+  assistance110: PRIMITIVE_COLORS.purple110,
+  assistance120: PRIMITIVE_COLORS.purple120,
+  assistance130: PRIMITIVE_COLORS.purple130,
+  assistance140: PRIMITIVE_COLORS.purple140,
+  shade10: PRIMITIVE_COLORS.blueGrey10,
+  shade15: PRIMITIVE_COLORS.blueGrey15,
+  shade20: PRIMITIVE_COLORS.blueGrey20,
+  shade25: PRIMITIVE_COLORS.blueGrey25,
+  shade30: PRIMITIVE_COLORS.blueGrey30,
+  shade35: PRIMITIVE_COLORS.blueGrey35,
+  shade40: PRIMITIVE_COLORS.blueGrey40,
+  shade45: PRIMITIVE_COLORS.blueGrey45,
+  shade50: PRIMITIVE_COLORS.blueGrey50,
+  shade55: PRIMITIVE_COLORS.blueGrey55,
+  shade60: PRIMITIVE_COLORS.blueGrey60,
+  shade65: PRIMITIVE_COLORS.blueGrey65,
+  shade70: PRIMITIVE_COLORS.blueGrey70,
+  shade75: PRIMITIVE_COLORS.blueGrey75,
+  shade80: PRIMITIVE_COLORS.blueGrey80,
+  shade85: PRIMITIVE_COLORS.blueGrey85,
+  shade90: PRIMITIVE_COLORS.blueGrey90,
+  shade95: PRIMITIVE_COLORS.blueGrey95,
+  shade100: PRIMITIVE_COLORS.blueGrey100,
+  shade105: PRIMITIVE_COLORS.blueGrey105,
+  shade110: PRIMITIVE_COLORS.blueGrey110,
+  shade115: PRIMITIVE_COLORS.blueGrey115,
+  shade120: PRIMITIVE_COLORS.blueGrey120,
+  shade125: PRIMITIVE_COLORS.blueGrey125,
+  shade130: PRIMITIVE_COLORS.blueGrey130,
+  shade135: PRIMITIVE_COLORS.blueGrey135,
+  shade140: PRIMITIVE_COLORS.blueGrey140,
+  shade145: PRIMITIVE_COLORS.blueGrey145
+};
+const _semantic_rgb_colors = {
+  plainLightRGB: chroma(_semantic_colors.plainLight).rgb().join(),
+  primary70RGB: chroma(_semantic_colors.primary70).rgb().join(),
+  primary100RGB: chroma(_semantic_colors.primary100).rgb().join(),
+  accent70RGB: chroma(_semantic_colors.accent70).rgb().join(),
+  accentSecondary70RGB: chroma(_semantic_colors.accentSecondary70).rgb().join(),
+  neutral70RGB: chroma(_semantic_colors.neutral70).rgb().join(),
+  success70RGB: chroma(_semantic_colors.success70).rgb().join(),
+  warning60RGB: chroma(_semantic_colors.warning60).rgb().join(),
+  risk60RGB: chroma(_semantic_colors.risk60).rgb().join(),
+  danger70RGB: chroma(_semantic_colors.danger70).rgb().join(),
+  assistance70RGB: chroma(_semantic_colors.assistance70).rgb().join(),
+  shade100RGB: chroma(_semantic_colors.shade100).rgb().join(),
+  shade120RGB: chroma(_semantic_colors.shade120).rgb().join(),
+  shade140RGB: chroma(_semantic_colors.shade140).rgb().join()
+};
+const _semantic_alpha_colors = {
+  plainLightAlpha8: `rgba(${_semantic_rgb_colors.plainLightRGB}, 0.08)`,
+  plainLightAlpha12: `rgba(${_semantic_rgb_colors.plainLightRGB}, 0.12)`,
+  plainLightAlpha16: `rgba(${_semantic_rgb_colors.plainLightRGB}, 0.16)`,
+  plainLightAlpha32: `rgba(${_semantic_rgb_colors.plainLightRGB}, 0.32)`,
+  primary70Alpha12: `rgba(${_semantic_rgb_colors.primary70RGB}, 0.12)`,
+  primary70Alpha16: `rgba(${_semantic_rgb_colors.primary70RGB}, 0.16)`,
+  primary70Alpha20: `rgba(${_semantic_rgb_colors.primary70RGB}, 0.2)`,
+  primary100Alpha4: `rgba(${_semantic_rgb_colors.primary100RGB}, 0.04)`,
+  primary100Alpha8: `rgba(${_semantic_rgb_colors.primary100RGB}, 0.08)`,
+  primary100Alpha12: `rgba(${_semantic_rgb_colors.primary100RGB}, 0.12)`,
+  accent70Alpha12: `rgba(${_semantic_rgb_colors.accent70RGB}, 0.12)`,
+  accent70Alpha16: `rgba(${_semantic_rgb_colors.accent70RGB}, 0.16)`,
+  accent70Alpha20: `rgba(${_semantic_rgb_colors.accent70RGB}, 0.2)`,
+  accentSecondary70Alpha12: `rgba(${_semantic_rgb_colors.accentSecondary70RGB}, 0.12)`,
+  accentSecondary70Alpha16: `rgba(${_semantic_rgb_colors.accentSecondary70RGB}, 0.16)`,
+  accentSecondary70Alpha20: `rgba(${_semantic_rgb_colors.accentSecondary70RGB}, 0.2)`,
+  neutral70Alpha12: `rgba(${_semantic_rgb_colors.neutral70RGB}, 0.12)`,
+  neutral70Alpha16: `rgba(${_semantic_rgb_colors.neutral70RGB}, 0.16)`,
+  neutral70Alpha20: `rgba(${_semantic_rgb_colors.neutral70RGB}, 0.2)`,
+  success70Alpha12: `rgba(${_semantic_rgb_colors.success70RGB}, 0.12)`,
+  success70Alpha16: `rgba(${_semantic_rgb_colors.success70RGB}, 0.16)`,
+  success70Alpha20: `rgba(${_semantic_rgb_colors.success70RGB}, 0.2)`,
+  warning60Alpha12: `rgba(${_semantic_rgb_colors.warning60RGB}, 0.12)`,
+  warning60Alpha16: `rgba(${_semantic_rgb_colors.warning60RGB}, 0.16)`,
+  warning60Alpha20: `rgba(${_semantic_rgb_colors.warning60RGB}, 0.2)`,
+  risk60Alpha12: `rgba(${_semantic_rgb_colors.risk60RGB}, 0.12)`,
+  risk60Alpha16: `rgba(${_semantic_rgb_colors.risk60RGB}, 0.16)`,
+  risk60Alpha20: `rgba(${_semantic_rgb_colors.risk60RGB}, 0.2)`,
+  danger70Alpha12: `rgba(${_semantic_rgb_colors.danger70RGB}, 0.12)`,
+  danger70Alpha16: `rgba(${_semantic_rgb_colors.danger70RGB}, 0.16)`,
+  danger70Alpha20: `rgba(${_semantic_rgb_colors.danger70RGB}, 0.2)`,
+  assistance70Alpha12: `rgba(${_semantic_rgb_colors.assistance70RGB}, 0.12)`,
+  shade100Alpha4: `rgba(${_semantic_rgb_colors.shade100RGB}, 0.04)`,
+  shade100Alpha16: `rgba(${_semantic_rgb_colors.shade100RGB}, 0.16)`,
+  shade100Alpha24: `rgba(${_semantic_rgb_colors.shade100RGB}, 0.24)`,
+  shade100Alpha70: `rgba(${_semantic_rgb_colors.shade100RGB}, 0.7)`,
+  shade120Alpha70: `rgba(${_semantic_rgb_colors.shade120RGB}, 0.7)`
+};
+const SEMANTIC_COLORS = {
+  ..._semantic_colors,
+  ..._semantic_alpha_colors,
+  ..._semantic_rgb_colors
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+/*
+ * LIGHT THEME
+ */
+const brand_colors = {
+  primary: SEMANTIC_COLORS.primary90,
+  accent: SEMANTIC_COLORS.accent90,
+  accentSecondary: SEMANTIC_COLORS.accentSecondary90,
+  success: SEMANTIC_COLORS.success90,
+  warning: SEMANTIC_COLORS.warning40,
+  danger: SEMANTIC_COLORS.danger90
+};
+const brand_text_colors = {
+  /* Legacy colors */
+  primaryText: SEMANTIC_COLORS.primary100,
+  accentText: SEMANTIC_COLORS.accent100,
+  successText: SEMANTIC_COLORS.success100,
+  warningText: SEMANTIC_COLORS.warning100,
+  dangerText: SEMANTIC_COLORS.danger100,
+  /* New colors */
+  textPrimary: SEMANTIC_COLORS.primary100,
+  textAccent: SEMANTIC_COLORS.accent100,
+  textAccentSecondary: SEMANTIC_COLORS.accentSecondary100,
+  textNeutral: SEMANTIC_COLORS.neutral100,
+  textSuccess: SEMANTIC_COLORS.success100,
+  textWarning: SEMANTIC_COLORS.warning100,
+  textRisk: SEMANTIC_COLORS.risk100,
+  textDanger: SEMANTIC_COLORS.danger100,
+  textAssistance: SEMANTIC_COLORS.assistance100
+};
+const text_colors = {
+  /* Legacy colors */
+  text: SEMANTIC_COLORS.shade110,
+  title: SEMANTIC_COLORS.shade140,
+  subduedText: SEMANTIC_COLORS.shade95,
+  link: SEMANTIC_COLORS.primary100,
+  /* New colors */
+  textParagraph: SEMANTIC_COLORS.shade110,
+  textHeading: SEMANTIC_COLORS.shade140,
+  textSubdued: SEMANTIC_COLORS.shade95,
+  textDisabled: SEMANTIC_COLORS.shade70,
+  textInverse: SEMANTIC_COLORS.plainLight,
+  textInk: SEMANTIC_COLORS.plainDark,
+  textGhost: SEMANTIC_COLORS.plainLight
+};
+const shade_colors = {
+  emptyShade: SEMANTIC_COLORS.plainLight,
+  lightestShade: SEMANTIC_COLORS.shade15,
+  lightShade: SEMANTIC_COLORS.shade30,
+  mediumShade: SEMANTIC_COLORS.shade60,
+  darkShade: SEMANTIC_COLORS.shade90,
+  darkestShade: SEMANTIC_COLORS.shade120,
+  fullShade: SEMANTIC_COLORS.plainDark
+};
+const background_colors = {
+  backgroundBasePrimary: SEMANTIC_COLORS.primary10,
+  backgroundBaseAccent: SEMANTIC_COLORS.accent10,
+  backgroundBaseAccentSecondary: SEMANTIC_COLORS.accentSecondary10,
+  backgroundBaseNeutral: SEMANTIC_COLORS.neutral10,
+  backgroundBaseSuccess: SEMANTIC_COLORS.success10,
+  backgroundBaseWarning: SEMANTIC_COLORS.warning10,
+  backgroundBaseRisk: SEMANTIC_COLORS.risk10,
+  backgroundBaseDanger: SEMANTIC_COLORS.danger10,
+  backgroundBaseAssistance: SEMANTIC_COLORS.assistance10,
+  backgroundBaseRecessed: SEMANTIC_COLORS.shade10,
+  backgroundBaseSubdued: SEMANTIC_COLORS.shade10,
+  backgroundBasePlain: SEMANTIC_COLORS.plainLight,
+  backgroundBaseDisabled: SEMANTIC_COLORS.shade15,
+  backgroundBaseHighlighted: SEMANTIC_COLORS.shade10,
+  backgroundBaseFormsPrepend: SEMANTIC_COLORS.shade15,
+  backgroundBaseFormsControlDisabled: SEMANTIC_COLORS.shade30,
+  backgroundBaseInteractiveHover: SEMANTIC_COLORS.primary100Alpha4,
+  backgroundBaseInteractiveHoverAssistance: SEMANTIC_COLORS.assistance20,
+  backgroundBaseInteractiveSelect: SEMANTIC_COLORS.primary10,
+  backgroundBaseInteractiveSelectHover: SEMANTIC_COLORS.primary20,
+  backgroundBaseInteractiveOverlay: SEMANTIC_COLORS.shade100Alpha70,
+  backgroundBaseSkeletonEdge: SEMANTIC_COLORS.shade100Alpha16,
+  backgroundBaseSkeletonMiddle: SEMANTIC_COLORS.shade100Alpha4,
+  backgroundLightPrimary: SEMANTIC_COLORS.primary20,
+  backgroundLightAccent: SEMANTIC_COLORS.accent20,
+  backgroundLightAccentSecondary: SEMANTIC_COLORS.accentSecondary20,
+  backgroundLightNeutral: SEMANTIC_COLORS.neutral20,
+  backgroundLightSuccess: SEMANTIC_COLORS.success20,
+  backgroundLightWarning: SEMANTIC_COLORS.warning20,
+  backgroundLightRisk: SEMANTIC_COLORS.risk20,
+  backgroundLightDanger: SEMANTIC_COLORS.danger20,
+  backgroundLightAssistance: SEMANTIC_COLORS.assistance20,
+  backgroundLightText: SEMANTIC_COLORS.shade20,
+  backgroundFilledPrimary: SEMANTIC_COLORS.primary90,
+  backgroundFilledAccent: SEMANTIC_COLORS.accent90,
+  backgroundFilledAccentSecondary: SEMANTIC_COLORS.accentSecondary90,
+  backgroundFilledNeutral: SEMANTIC_COLORS.neutral80,
+  backgroundFilledSuccess: SEMANTIC_COLORS.success90,
+  backgroundFilledWarning: SEMANTIC_COLORS.warning40,
+  backgroundFilledRisk: SEMANTIC_COLORS.risk70,
+  backgroundFilledDanger: SEMANTIC_COLORS.danger90,
+  backgroundFilledAssistance: SEMANTIC_COLORS.assistance90,
+  backgroundFilledText: SEMANTIC_COLORS.shade90
+};
+/**
+ * NOTE: temp values for migration - these should not be used,
+ * use backgroundBase tokens instead
+ * TODO: remove once obsolete
+ */
+const transparent_background_colors = {
+  backgroundTransparent: PRIMITIVE_COLORS.transparent,
+  backgroundTransparentPrimary: background_colors.backgroundBasePrimary,
+  backgroundTransparentAccent: background_colors.backgroundBaseAccent,
+  backgroundTransparentAccentSecondary: background_colors.backgroundBaseAccentSecondary,
+  backgroundTransparentNeutral: background_colors.backgroundBaseNeutral,
+  backgroundTransparentSuccess: background_colors.backgroundBaseSuccess,
+  backgroundTransparentWarning: background_colors.backgroundBaseWarning,
+  backgroundTransparentRisk: background_colors.backgroundBaseRisk,
+  backgroundTransparentDanger: background_colors.backgroundBaseDanger,
+  backgroundTransparentSubdued: SEMANTIC_COLORS.shade15,
+  backgroundTransparentHighlighted: SEMANTIC_COLORS.shade15,
+  backgroundTransparentPlain: SEMANTIC_COLORS.shade15
+};
+const border_colors = {
+  borderBasePrimary: SEMANTIC_COLORS.primary30,
+  borderBaseAccent: SEMANTIC_COLORS.accent30,
+  borderBaseAccentSecondary: SEMANTIC_COLORS.accentSecondary30,
+  borderBaseNeutral: SEMANTIC_COLORS.neutral30,
+  borderBaseSuccess: SEMANTIC_COLORS.success30,
+  borderBaseWarning: SEMANTIC_COLORS.warning30,
+  borderBaseRisk: SEMANTIC_COLORS.risk30,
+  borderBaseDanger: SEMANTIC_COLORS.danger30,
+  borderBaseAssistance: SEMANTIC_COLORS.assistance30,
+  borderBasePlain: SEMANTIC_COLORS.shade30,
+  borderBaseSubdued: SEMANTIC_COLORS.shade20,
+  borderBaseProminent: SEMANTIC_COLORS.shade50,
+  borderBaseDisabled: SEMANTIC_COLORS.shade30,
+  borderBaseFloating: PRIMITIVE_COLORS.transparent,
+  borderBaseFormsColorSwatch: SEMANTIC_COLORS.shade100Alpha24,
+  borderInteractiveFormsHoverPlain: SEMANTIC_COLORS.shade40,
+  borderInteractiveFormsHoverProminent: SEMANTIC_COLORS.shade70,
+  borderInteractiveFormsHoverDanger: SEMANTIC_COLORS.danger80,
+  borderStrongPrimary: SEMANTIC_COLORS.primary90,
+  borderStrongAccent: SEMANTIC_COLORS.accent90,
+  borderStrongAccentSecondary: SEMANTIC_COLORS.accentSecondary90,
+  borderStrongNeutral: SEMANTIC_COLORS.neutral90,
+  borderStrongSuccess: SEMANTIC_COLORS.success90,
+  borderStrongWarning: SEMANTIC_COLORS.warning90,
+  borderStrongRisk: SEMANTIC_COLORS.risk90,
+  borderStrongDanger: SEMANTIC_COLORS.danger90,
+  borderStrongAssistance: SEMANTIC_COLORS.assistance90,
+  borderStrongText: SEMANTIC_COLORS.shade90
+};
+const special_colors = {
+  body: SEMANTIC_COLORS.shade15,
+  highlight: SEMANTIC_COLORS.primary10,
+  disabled: SEMANTIC_COLORS.shade20,
+  disabledText: SEMANTIC_COLORS.shade80,
+  shadow: PRIMITIVE_COLORS.black
+};
+const light_colors = {
+  ...brand_colors,
+  ...shade_colors,
+  ...special_colors,
+  ...brand_text_colors,
+  ...text_colors,
+  ...background_colors,
+  ...transparent_background_colors,
+  ...border_colors
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+/*
+ * DARK THEME
+ */
+const dark_brand_colors = {
+  primary: SEMANTIC_COLORS.primary60,
+  accent: SEMANTIC_COLORS.accent60,
+  accentSecondary: SEMANTIC_COLORS.accentSecondary60,
+  success: SEMANTIC_COLORS.success60,
+  warning: SEMANTIC_COLORS.warning40,
+  danger: SEMANTIC_COLORS.danger60
+};
+const dark_brand_text_colors = {
+  /* Legacy colors */
+  primaryText: SEMANTIC_COLORS.primary60,
+  accentText: SEMANTIC_COLORS.accent60,
+  successText: SEMANTIC_COLORS.success60,
+  warningText: SEMANTIC_COLORS.warning30,
+  dangerText: SEMANTIC_COLORS.danger60,
+  /* New colors */
+  textPrimary: SEMANTIC_COLORS.primary60,
+  textAccent: SEMANTIC_COLORS.accent60,
+  textAccentSecondary: SEMANTIC_COLORS.accentSecondary60,
+  textNeutral: SEMANTIC_COLORS.neutral60,
+  textSuccess: SEMANTIC_COLORS.success60,
+  textWarning: SEMANTIC_COLORS.warning30,
+  textRisk: SEMANTIC_COLORS.risk50,
+  textDanger: SEMANTIC_COLORS.danger60,
+  textAssistance: SEMANTIC_COLORS.assistance50
+};
+const dark_text_colors = {
+  /* Legacy colors */
+  text: SEMANTIC_COLORS.shade40,
+  title: SEMANTIC_COLORS.shade20,
+  subduedText: SEMANTIC_COLORS.shade55,
+  link: SEMANTIC_COLORS.primary60,
+  /* New colors */
+  textParagraph: SEMANTIC_COLORS.shade40,
+  textHeading: SEMANTIC_COLORS.shade20,
+  textSubdued: SEMANTIC_COLORS.shade55,
+  textDisabled: SEMANTIC_COLORS.shade80,
+  textInverse: SEMANTIC_COLORS.plainDark,
+  textInk: SEMANTIC_COLORS.plainDark,
+  textGhost: SEMANTIC_COLORS.plainLight
+};
+const dark_shades = {
+  emptyShade: SEMANTIC_COLORS.shade140,
+  lightestShade: SEMANTIC_COLORS.shade135,
+  lightShade: SEMANTIC_COLORS.shade125,
+  mediumShade: SEMANTIC_COLORS.shade95,
+  darkShade: SEMANTIC_COLORS.shade75,
+  darkestShade: SEMANTIC_COLORS.shade30,
+  fullShade: SEMANTIC_COLORS.plainLight
+};
+const dark_background_colors = {
+  backgroundBasePrimary: SEMANTIC_COLORS.primary140,
+  backgroundBaseAccent: SEMANTIC_COLORS.accent140,
+  backgroundBaseAccentSecondary: SEMANTIC_COLORS.accentSecondary140,
+  backgroundBaseNeutral: SEMANTIC_COLORS.neutral140,
+  backgroundBaseSuccess: SEMANTIC_COLORS.success140,
+  backgroundBaseWarning: SEMANTIC_COLORS.warning140,
+  backgroundBaseRisk: SEMANTIC_COLORS.risk140,
+  backgroundBaseDanger: SEMANTIC_COLORS.danger140,
+  backgroundBaseAssistance: SEMANTIC_COLORS.assistance140,
+  backgroundBaseRecessed: SEMANTIC_COLORS.plainDark,
+  backgroundBaseSubdued: SEMANTIC_COLORS.shade145,
+  backgroundBasePlain: SEMANTIC_COLORS.shade140,
+  backgroundBaseDisabled: SEMANTIC_COLORS.shade130,
+  backgroundBaseHighlighted: SEMANTIC_COLORS.shade135,
+  backgroundBaseFormsPrepend: SEMANTIC_COLORS.shade125,
+  backgroundBaseFormsControlDisabled: SEMANTIC_COLORS.shade120,
+  backgroundBaseInteractiveHover: SEMANTIC_COLORS.plainLightAlpha8,
+  backgroundBaseInteractiveHoverAssistance: SEMANTIC_COLORS.assistance130,
+  backgroundBaseInteractiveSelect: SEMANTIC_COLORS.primary130,
+  backgroundBaseInteractiveSelectHover: SEMANTIC_COLORS.primary120,
+  backgroundBaseInteractiveOverlay: SEMANTIC_COLORS.shade120Alpha70,
+  backgroundBaseSkeletonEdge: SEMANTIC_COLORS.plainLightAlpha16,
+  backgroundBaseSkeletonMiddle: SEMANTIC_COLORS.plainLightAlpha8,
+  backgroundLightPrimary: SEMANTIC_COLORS.primary130,
+  backgroundLightAccent: SEMANTIC_COLORS.accent130,
+  backgroundLightAccentSecondary: SEMANTIC_COLORS.accentSecondary130,
+  backgroundLightNeutral: SEMANTIC_COLORS.neutral130,
+  backgroundLightSuccess: SEMANTIC_COLORS.success130,
+  backgroundLightWarning: SEMANTIC_COLORS.warning130,
+  backgroundLightRisk: SEMANTIC_COLORS.risk130,
+  backgroundLightDanger: SEMANTIC_COLORS.danger130,
+  backgroundLightAssistance: SEMANTIC_COLORS.assistance120,
+  backgroundLightText: SEMANTIC_COLORS.shade120,
+  backgroundFilledPrimary: SEMANTIC_COLORS.primary60,
+  backgroundFilledAccent: SEMANTIC_COLORS.accent60,
+  backgroundFilledAccentSecondary: SEMANTIC_COLORS.accentSecondary60,
+  backgroundFilledNeutral: SEMANTIC_COLORS.neutral50,
+  backgroundFilledSuccess: SEMANTIC_COLORS.success60,
+  backgroundFilledWarning: SEMANTIC_COLORS.warning40,
+  backgroundFilledRisk: SEMANTIC_COLORS.risk50,
+  backgroundFilledDanger: SEMANTIC_COLORS.danger60,
+  backgroundFilledAssistance: SEMANTIC_COLORS.assistance50,
+  backgroundFilledText: SEMANTIC_COLORS.shade60
+};
+/**
+ * NOTE: temp values for migration - these should not be used,
+ * use backgroundBase tokens instead
+ * TODO: remove once obsolete
+ */
+const dark_transparent_background_colors = {
+  backgroundTransparent: PRIMITIVE_COLORS.transparent,
+  backgroundTransparentPrimary: dark_background_colors.backgroundBasePrimary,
+  backgroundTransparentAccent: dark_background_colors.backgroundBaseAccent,
+  backgroundTransparentAccentSecondary: dark_background_colors.backgroundBaseAccent,
+  backgroundTransparentNeutral: dark_background_colors.backgroundBaseNeutral,
+  backgroundTransparentSuccess: dark_background_colors.backgroundBaseSuccess,
+  backgroundTransparentWarning: dark_background_colors.backgroundBaseWarning,
+  backgroundTransparentRisk: dark_background_colors.backgroundBaseRisk,
+  backgroundTransparentDanger: dark_background_colors.backgroundBaseDanger,
+  backgroundTransparentSubdued: dark_background_colors.backgroundBaseSubdued,
+  backgroundTransparentHighlighted: dark_background_colors.backgroundBaseSubdued,
+  backgroundTransparentPlain: dark_background_colors.backgroundBasePlain
+};
+const dark_border_colors = {
+  borderBasePrimary: SEMANTIC_COLORS.primary120,
+  borderBaseAccent: SEMANTIC_COLORS.accent120,
+  borderBaseAccentSecondary: SEMANTIC_COLORS.accentSecondary120,
+  borderBaseNeutral: SEMANTIC_COLORS.neutral120,
+  borderBaseSuccess: SEMANTIC_COLORS.success120,
+  borderBaseWarning: SEMANTIC_COLORS.warning120,
+  borderBaseRisk: SEMANTIC_COLORS.risk120,
+  borderBaseDanger: SEMANTIC_COLORS.danger120,
+  borderBaseAssistance: SEMANTIC_COLORS.assistance120,
+  borderBasePlain: SEMANTIC_COLORS.shade100,
+  borderBaseSubdued: SEMANTIC_COLORS.shade120,
+  borderBaseProminent: SEMANTIC_COLORS.shade80,
+  borderBaseDisabled: SEMANTIC_COLORS.shade100,
+  borderBaseFloating: SEMANTIC_COLORS.shade120,
+  borderBaseFormsColorSwatch: SEMANTIC_COLORS.plainLightAlpha32,
+  borderInteractiveFormsHoverPlain: SEMANTIC_COLORS.shade90,
+  borderInteractiveFormsHoverProminent: SEMANTIC_COLORS.shade60,
+  borderInteractiveFormsHoverDanger: SEMANTIC_COLORS.danger70,
+  borderStrongPrimary: SEMANTIC_COLORS.primary60,
+  borderStrongAccent: SEMANTIC_COLORS.accent60,
+  borderStrongAccentSecondary: SEMANTIC_COLORS.accentSecondary60,
+  borderStrongNeutral: SEMANTIC_COLORS.neutral60,
+  borderStrongSuccess: SEMANTIC_COLORS.success60,
+  borderStrongWarning: SEMANTIC_COLORS.warning40,
+  borderStrongRisk: SEMANTIC_COLORS.risk50,
+  borderStrongDanger: SEMANTIC_COLORS.danger60,
+  borderStrongAssistance: SEMANTIC_COLORS.assistance60,
+  borderStrongText: SEMANTIC_COLORS.shade60
+};
+const dark_special_colors = {
+  body: SEMANTIC_COLORS.plainDark,
+  highlight: SEMANTIC_COLORS.primary100,
+  disabled: SEMANTIC_COLORS.shade130,
+  disabledText: SEMANTIC_COLORS.shade80,
+  shadow: PRIMITIVE_COLORS.black
+};
+const dark_colors = {
+  ...dark_brand_colors,
+  ...dark_shades,
+  ...dark_special_colors,
+  ...dark_brand_text_colors,
+  ...dark_text_colors,
+  ...dark_background_colors,
+  ...dark_transparent_background_colors,
+  ...dark_border_colors
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+// Maps allow for easier JSON usage
+// Use map_merge(euiColorVisColors, $yourMap) to change individual colors after importing ths file
+// The `behindText` variant is a direct copy of the hex output by the JS euiPaletteColorBlindBehindText() function
+const euiPaletteColorBlind = {
+  euiColorVis0: {
+    graphic: SEMANTIC_COLORS.accentSecondary60
+  },
+  euiColorVis1: {
+    graphic: SEMANTIC_COLORS.accentSecondary30
+  },
+  euiColorVis2: {
+    graphic: SEMANTIC_COLORS.primary60
+  },
+  euiColorVis3: {
+    graphic: SEMANTIC_COLORS.primary30
+  },
+  euiColorVis4: {
+    graphic: SEMANTIC_COLORS.accent60
+  },
+  euiColorVis5: {
+    graphic: SEMANTIC_COLORS.accent30
+  },
+  euiColorVis6: {
+    graphic: SEMANTIC_COLORS.danger60
+  },
+  euiColorVis7: {
+    graphic: SEMANTIC_COLORS.danger30
+  },
+  euiColorVis8: {
+    graphic: SEMANTIC_COLORS.warning60
+  },
+  euiColorVis9: {
+    graphic: SEMANTIC_COLORS.warning30
+  }
+};
+const colorVisLight = {
+  euiColorVis0: euiPaletteColorBlind.euiColorVis0.graphic,
+  euiColorVis1: euiPaletteColorBlind.euiColorVis1.graphic,
+  euiColorVis2: euiPaletteColorBlind.euiColorVis2.graphic,
+  euiColorVis3: euiPaletteColorBlind.euiColorVis3.graphic,
+  euiColorVis4: euiPaletteColorBlind.euiColorVis4.graphic,
+  euiColorVis5: euiPaletteColorBlind.euiColorVis5.graphic,
+  euiColorVis6: euiPaletteColorBlind.euiColorVis6.graphic,
+  euiColorVis7: euiPaletteColorBlind.euiColorVis7.graphic,
+  euiColorVis8: euiPaletteColorBlind.euiColorVis8.graphic,
+  euiColorVis9: euiPaletteColorBlind.euiColorVis9.graphic,
+  euiColorVisBehindText0: euiPaletteColorBlind.euiColorVis0.graphic,
+  euiColorVisBehindText1: euiPaletteColorBlind.euiColorVis1.graphic,
+  euiColorVisBehindText2: euiPaletteColorBlind.euiColorVis2.graphic,
+  euiColorVisBehindText3: euiPaletteColorBlind.euiColorVis3.graphic,
+  euiColorVisBehindText4: euiPaletteColorBlind.euiColorVis4.graphic,
+  euiColorVisBehindText5: euiPaletteColorBlind.euiColorVis5.graphic,
+  euiColorVisBehindText6: euiPaletteColorBlind.euiColorVis6.graphic,
+  euiColorVisBehindText7: euiPaletteColorBlind.euiColorVis7.graphic,
+  euiColorVisBehindText8: euiPaletteColorBlind.euiColorVis8.graphic,
+  euiColorVisBehindText9: euiPaletteColorBlind.euiColorVis9.graphic,
+  euiColorVisText0: SEMANTIC_COLORS.accentSecondary110,
+  euiColorVisText1: SEMANTIC_COLORS.accentSecondary100,
+  euiColorVisText2: SEMANTIC_COLORS.primary110,
+  euiColorVisText3: SEMANTIC_COLORS.primary90,
+  euiColorVisText4: SEMANTIC_COLORS.accent100,
+  euiColorVisText5: SEMANTIC_COLORS.accent80,
+  euiColorVisText6: SEMANTIC_COLORS.danger100,
+  euiColorVisText7: SEMANTIC_COLORS.danger80,
+  euiColorVisText8: SEMANTIC_COLORS.warning110,
+  euiColorVisText9: SEMANTIC_COLORS.warning90,
+  euiColorVisNeutral0: SEMANTIC_COLORS.neutral60,
+  euiColorVisNeutral1: SEMANTIC_COLORS.neutral30,
+  euiColorVisSuccess0: SEMANTIC_COLORS.success60,
+  euiColorVisSuccess1: SEMANTIC_COLORS.success30,
+  euiColorVisWarning0: SEMANTIC_COLORS.warning60,
+  euiColorVisWarning1: SEMANTIC_COLORS.warning30,
+  euiColorVisRisk0: SEMANTIC_COLORS.risk60,
+  euiColorVisRisk1: SEMANTIC_COLORS.risk30,
+  euiColorVisDanger0: SEMANTIC_COLORS.danger60,
+  euiColorVisDanger1: SEMANTIC_COLORS.danger30,
+  // We removed the `mutedGrey` palette in favor of the `blueGrey` palette from the theme
+  // but we need to keep this specific value for visualizations backwards compatibility.
+  // We want to limit its usage to visualizations only, so we're keeping it hardcoded here.
+  euiColorVisBase0: '#F6F9FC',
+  euiColorVisGrey0: PRIMITIVE_COLORS.blueGrey30,
+  euiColorVisGrey1: PRIMITIVE_COLORS.blueGrey60,
+  euiColorVisGrey2: PRIMITIVE_COLORS.blueGrey90,
+  euiColorVisGrey3: PRIMITIVE_COLORS.blueGrey130,
+  euiColorVisWarm0: SEMANTIC_COLORS.danger10,
+  euiColorVisWarm1: SEMANTIC_COLORS.danger40,
+  euiColorVisWarm2: SEMANTIC_COLORS.danger60,
+  euiColorVisCool0: SEMANTIC_COLORS.primary10,
+  euiColorVisCool1: SEMANTIC_COLORS.primary40,
+  euiColorVisCool2: SEMANTIC_COLORS.primary60,
+  euiColorVisComplementary0: SEMANTIC_COLORS.primary60,
+  euiColorVisComplementary1: SEMANTIC_COLORS.warning60
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const colorVisDark = {
+  ...colorVisLight,
+  euiColorVisText0: SEMANTIC_COLORS.accentSecondary60,
+  euiColorVisText1: SEMANTIC_COLORS.accentSecondary30,
+  euiColorVisText2: SEMANTIC_COLORS.primary60,
+  euiColorVisText3: SEMANTIC_COLORS.primary30,
+  euiColorVisText4: SEMANTIC_COLORS.accent60,
+  euiColorVisText5: SEMANTIC_COLORS.accent30,
+  euiColorVisText6: SEMANTIC_COLORS.danger60,
+  euiColorVisText7: SEMANTIC_COLORS.danger30,
+  euiColorVisText8: SEMANTIC_COLORS.warning60,
+  euiColorVisText9: SEMANTIC_COLORS.warning30
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const severityColors = {
+  unknown: SEMANTIC_COLORS.shade20,
+  neutral: SEMANTIC_COLORS.neutral30,
+  success: SEMANTIC_COLORS.success60,
+  warning: SEMANTIC_COLORS.warning30,
+  risk: SEMANTIC_COLORS.risk50,
+  danger: SEMANTIC_COLORS.danger70
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const colors = {
+  plainLight: SEMANTIC_COLORS.plainLight,
+  plainDark: SEMANTIC_COLORS.plainDark,
+  LIGHT: {
+    ...light_colors,
+    vis: colorVisLight,
+    severity: severityColors
+  },
+  DARK: {
+    ...dark_colors,
+    vis: colorVisDark,
+    severity: severityColors
+  }
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const animation_speed = {
+  extraFast: '90ms',
+  fast: '150ms',
+  normal: '250ms',
+  slow: '350ms',
+  extraSlow: '500ms'
+};
+const animation_ease = {
+  bounce: 'cubic-bezier(.34, 1.61, .7, 1)',
+  resistance: 'cubic-bezier(.32, .72, 0, 1)'
+};
+const animation = {
+  ...animation_speed,
+  ...animation_ease
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const breakpoint = {
+  xl: 1200,
+  l: 992,
+  m: 768,
+  s: 575,
+  xs: 0
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const base = 16;
+const size = {
+  xxs: computed(sizeToPixel(0.125)),
+  xs: computed(sizeToPixel(0.25)),
+  s: computed(sizeToPixel(0.5)),
+  m: computed(sizeToPixel(0.75)),
+  base: computed(sizeToPixel()),
+  l: computed(sizeToPixel(1.5)),
+  xl: computed(sizeToPixel(2)),
+  xxl: computed(sizeToPixel(2.5)),
+  xxxl: computed(sizeToPixel(3)),
+  xxxxl: computed(sizeToPixel(4))
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const border = {
+  color: computed(([borderBaseSubdued]) => borderBaseSubdued, ['colors.borderBaseSubdued']),
+  width: {
+    thin: '1px',
+    thick: '2px'
+  },
+  radius: {
+    medium: computed(sizeToPixel(0.25)),
+    small: computed(sizeToPixel(0.25)),
+    inline: computed(sizeToPixel(0.25)),
+    control: computed(sizeToPixel(0.5)),
+    panel: computed(sizeToPixel(0.75)),
+    frame: computed(sizeToPixel(1))
+  },
+  thin: computed(([width, color]) => `${width.thin} solid ${color}`, ['border.width', 'border.color']),
+  thick: computed(([width, color]) => `${width.thick} solid ${color}`, ['border.width', 'border.color']),
+  editable: computed(([width, color]) => `${width.thick} dotted ${color}`, ['border.width', 'border.color'])
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const levels = {
+  toast: 9000,
+  modal: 8000,
+  mask: 6000,
+  navigation: 6000,
+  menu: 2000,
+  header: 1000,
+  flyout: 1000,
+  maskBelowHeader: 1000,
+  content: 0
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+// Typographic scale -- loosely based on Major Third (1.200)
+const fontScale = {
+  xxxs: 0.5625,
+  // 9px
+  xxs: 0.6875,
+  // 11px
+  xs: 0.75,
+  // 12px
+  s: 0.875,
+  // 14px
+  m: 1,
+  // 16px
+  l: 1.25,
+  // 20px
+  xl: 1.5,
+  // 24px
+  xxl: 1.875 // 30px
+};
+// Families & base font settings
+const fontBase = {
+  family: "'Inter', BlinkMacSystemFont, Helvetica, Arial, sans-serif",
+  familyCode: "'Roboto Mono', Menlo, Courier, monospace",
+  familySerif: 'Georgia, Times, Times New Roman, serif',
+  // Careful using ligatures. Code editors like ACE will often error because of width calculations
+  featureSettings: "'calt' 1, 'kern' 1, 'liga' 1",
+  defaultUnits: 'rem',
+  baseline: computed(([base]) => base / 4, ['base']),
+  lineHeightMultiplier: 1.5
+};
+const fontWeight = {
+  light: 300,
+  regular: 400,
+  medium: 450,
+  semiBold: 500,
+  bold: 600
+};
+const font = {
+  ...fontBase,
+  scale: fontScale,
+  weight: fontWeight,
+  body: {
+    scale: 's',
+    weight: 'regular'
+  },
+  title: {
+    weight: 'bold',
+    letterSpacing: '-0.2px'
+  }
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+/**
+ * This structure holds "primitives" (or actual design tokens as they
+ * would be stored in a design token repository).
+ * Not exposing them in the theme object is intentional.
+ */
+const shadowPrimitives = {
+  xs: {
+    light: [{
+      opacity: 0.16,
+      x: 0,
+      y: 0,
+      blur: 2,
+      spread: 0
+    }, {
+      opacity: 0.06,
+      x: 0,
+      y: 1,
+      blur: 4,
+      spread: 0
+    }, {
+      opacity: 0.04,
+      x: 0,
+      y: 2,
+      blur: 8,
+      spread: 0
+    }],
+    dark: [{
+      opacity: 1,
+      x: 0,
+      y: 0,
+      blur: 0,
+      spread: 1
+    }, {
+      opacity: 0.4,
+      x: 0,
+      y: 1,
+      blur: 4,
+      spread: 0
+    }, {
+      opacity: 0.24,
+      x: 0,
+      y: 2,
+      blur: 8,
+      spread: 0
+    }]
+  },
+  s: {
+    light: [{
+      opacity: 0.16,
+      x: 0,
+      y: 0,
+      blur: 2,
+      spread: 0
+    }, {
+      opacity: 0.08,
+      x: 0,
+      y: 2,
+      blur: 7,
+      spread: 0
+    }, {
+      opacity: 0.05,
+      x: 0,
+      y: 4,
+      blur: 11,
+      spread: 0
+    }],
+    dark: [{
+      opacity: 1,
+      x: 0,
+      y: 0,
+      blur: 0,
+      spread: 1
+    }, {
+      opacity: 0.46,
+      x: 0,
+      y: 2,
+      blur: 7,
+      spread: 0
+    }, {
+      opacity: 0.26,
+      x: 0,
+      y: 4,
+      blur: 11,
+      spread: 0
+    }]
+  },
+  m: {
+    light: [{
+      opacity: 0.16,
+      x: 0,
+      y: 0,
+      blur: 2,
+      spread: 0
+    }, {
+      opacity: 0.1,
+      x: 0,
+      y: 3,
+      blur: 10,
+      spread: 0
+    }, {
+      opacity: 0.06,
+      x: 0,
+      y: 6,
+      blur: 14,
+      spread: 0
+    }],
+    dark: [{
+      opacity: 1,
+      x: 0,
+      y: 0,
+      blur: 0,
+      spread: 1
+    }, {
+      opacity: 0.52,
+      x: 0,
+      y: 3,
+      blur: 10,
+      spread: 0
+    }, {
+      opacity: 0.28,
+      x: 0,
+      y: 6,
+      blur: 14,
+      spread: 0
+    }]
+  },
+  l: {
+    light: [{
+      opacity: 0.16,
+      x: 0,
+      y: 0,
+      blur: 2,
+      spread: 0
+    }, {
+      opacity: 0.12,
+      x: 0,
+      y: 4,
+      blur: 13,
+      spread: 0
+    }, {
+      opacity: 0.07,
+      x: 0,
+      y: 8,
+      blur: 17,
+      spread: 0
+    }],
+    dark: [{
+      opacity: 1,
+      x: 0,
+      y: 0,
+      blur: 0,
+      spread: 1
+    }, {
+      opacity: 0.58,
+      x: 0,
+      y: 4,
+      blur: 13,
+      spread: 0
+    }, {
+      opacity: 0.3,
+      x: 0,
+      y: 8,
+      blur: 17,
+      spread: 0
+    }]
+  },
+  xl: {
+    light: [{
+      opacity: 0.16,
+      x: 0,
+      y: 0,
+      blur: 2,
+      spread: 0
+    }, {
+      opacity: 0.14,
+      x: 0,
+      y: 5,
+      blur: 16,
+      spread: 0
+    }, {
+      opacity: 0.08,
+      x: 0,
+      y: 10,
+      blur: 20,
+      spread: 0
+    }],
+    dark: [{
+      opacity: 1,
+      x: 0,
+      y: 0,
+      blur: 0,
+      spread: 1
+    }, {
+      opacity: 0.64,
+      x: 0,
+      y: 5,
+      blur: 16,
+      spread: 0
+    }, {
+      opacity: 0.32,
+      x: 0,
+      y: 10,
+      blur: 20,
+      spread: 0
+    }]
+  },
+  xxl: {
+    light: [{
+      opacity: 0.16,
+      x: 0,
+      y: 0,
+      blur: 2,
+      spread: 0
+    }, {
+      opacity: 0.16,
+      x: 0,
+      y: 6,
+      blur: 19,
+      spread: 0
+    }, {
+      opacity: 0.09,
+      x: 0,
+      y: 12,
+      blur: 23,
+      spread: 0
+    }],
+    dark: [{
+      opacity: 1,
+      x: 0,
+      y: 0,
+      blur: 0,
+      spread: 1
+    }, {
+      opacity: 0.7,
+      x: 0,
+      y: 6,
+      blur: 19,
+      spread: 0
+    }, {
+      opacity: 0.34,
+      x: 0,
+      y: 12,
+      blur: 23,
+      spread: 0
+    }]
+  }};
+const shadowColorsLight = {
+  colors: {
+    base: SEMANTIC_COLORS.shade120
+  }
+};
+const shadowsLight = {
+  ...shadowColorsLight,
+  xs: {
+    down: formatMultipleBoxShadow(shadowPrimitives.xs.light, {
+      color: shadowColorsLight.colors.base
+    }),
+    up: formatMultipleBoxShadow(shadowPrimitives.xs.light, {
+      direction: 'up',
+      color: shadowColorsLight.colors.base
+    })
+  },
+  s: {
+    down: formatMultipleBoxShadow(shadowPrimitives.s.light, {
+      color: shadowColorsLight.colors.base
+    }),
+    up: formatMultipleBoxShadow(shadowPrimitives.s.light, {
+      direction: 'up',
+      color: shadowColorsLight.colors.base
+    })
+  },
+  m: {
+    down: formatMultipleBoxShadow(shadowPrimitives.m.light, {
+      color: shadowColorsLight.colors.base
+    }),
+    up: formatMultipleBoxShadow(shadowPrimitives.m.light, {
+      direction: 'up',
+      color: shadowColorsLight.colors.base
+    })
+  },
+  l: {
+    down: formatMultipleBoxShadow(shadowPrimitives.l.light, {
+      color: shadowColorsLight.colors.base
+    }),
+    up: formatMultipleBoxShadow(shadowPrimitives.l.light, {
+      direction: 'up',
+      color: shadowColorsLight.colors.base
+    })
+  },
+  xl: {
+    down: formatMultipleBoxShadow(shadowPrimitives.xl.light, {
+      color: shadowColorsLight.colors.base
+    }),
+    up: formatMultipleBoxShadow(shadowPrimitives.xl.light, {
+      direction: 'up',
+      color: shadowColorsLight.colors.base
+    })
+  },
+  hover: {
+    base: {
+      down: formatMultipleBoxShadow(shadowPrimitives.s.light, {
+        color: shadowColorsLight.colors.base
+      }),
+      up: formatMultipleBoxShadow(shadowPrimitives.s.light, {
+        direction: 'up',
+        color: shadowColorsLight.colors.base
+      })
+    },
+    xl: {
+      down: formatMultipleBoxShadow(shadowPrimitives.xxl.light, {
+        color: shadowColorsLight.colors.base
+      }),
+      up: formatMultipleBoxShadow(shadowPrimitives.xxl.light, {
+        direction: 'up',
+        color: shadowColorsLight.colors.base
+      })
+    }
+  },
+  flat: {
+    down: formatMultipleBoxShadow(shadowPrimitives.xs.light, {
+      color: shadowColorsLight.colors.base
+    }),
+    up: formatMultipleBoxShadow(shadowPrimitives.xs.light, {
+      direction: 'up',
+      color: shadowColorsLight.colors.base
+    })
+  }
+};
+const shadowColorsDark = {
+  colors: {
+    base: PRIMITIVE_COLORS.black
+  }
+};
+const shadowsDark = {
+  ...shadowColorsDark,
+  xs: {
+    down: formatMultipleBoxShadow(shadowPrimitives.xs.dark.slice(1), {
+      color: shadowColorsDark.colors.base
+    }),
+    up: formatMultipleBoxShadow(shadowPrimitives.xs.dark.slice(1), {
+      direction: 'up',
+      color: shadowColorsDark.colors.base
+    })
+  },
+  s: {
+    down: formatMultipleBoxShadow(shadowPrimitives.s.dark.slice(1), {
+      color: shadowColorsDark.colors.base
+    }),
+    up: formatMultipleBoxShadow(shadowPrimitives.s.dark.slice(1), {
+      direction: 'up',
+      color: shadowColorsDark.colors.base
+    })
+  },
+  m: {
+    down: formatMultipleBoxShadow(shadowPrimitives.m.dark.slice(1), {
+      color: shadowColorsDark.colors.base
+    }),
+    up: formatMultipleBoxShadow(shadowPrimitives.m.dark.slice(1), {
+      direction: 'up',
+      color: shadowColorsDark.colors.base
+    })
+  },
+  l: {
+    down: formatMultipleBoxShadow(shadowPrimitives.l.dark.slice(1), {
+      color: shadowColorsDark.colors.base
+    }),
+    up: formatMultipleBoxShadow(shadowPrimitives.l.dark.slice(1), {
+      direction: 'up',
+      color: shadowColorsDark.colors.base
+    })
+  },
+  xl: {
+    down: formatMultipleBoxShadow(shadowPrimitives.xl.dark.slice(1), {
+      color: shadowColorsDark.colors.base
+    }),
+    up: formatMultipleBoxShadow(shadowPrimitives.xl.dark.slice(1), {
+      direction: 'up',
+      color: shadowColorsDark.colors.base
+    })
+  },
+  hover: {
+    base: {
+      down: formatMultipleBoxShadow(shadowPrimitives.s.dark.slice(1), {
+        color: shadowColorsDark.colors.base
+      }),
+      up: formatMultipleBoxShadow(shadowPrimitives.s.dark.slice(1), {
+        direction: 'up',
+        color: shadowColorsDark.colors.base
+      })
+    },
+    xl: {
+      down: formatMultipleBoxShadow(shadowPrimitives.xxl.dark.slice(1), {
+        color: shadowColorsDark.colors.base
+      }),
+      up: formatMultipleBoxShadow(shadowPrimitives.xxl.dark.slice(1), {
+        direction: 'up',
+        color: shadowColorsDark.colors.base
+      })
+    }
+  },
+  flat: {
+    down: formatMultipleBoxShadow(shadowPrimitives.xs.dark.slice(1), {
+      color: shadowColorsDark.colors.base
+    }),
+    up: formatMultipleBoxShadow(shadowPrimitives.xs.dark.slice(1), {
+      direction: 'up',
+      color: shadowColorsDark.colors.base
+    })
+  }
+};
+const shadows = {
+  LIGHT: shadowsLight,
+  DARK: shadowsDark
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const focus = {
+  // Focus ring
+  color: computed(([textPrimary]) => textPrimary, ['colors.textPrimary']),
+  width: computed(sizeToPixel(0.125)),
+  // Focus background
+  transparency: {
+    LIGHT: 0.1,
+    DARK: 0.2
+  },
+  backgroundColor: computed(([backgroundBaseInteractiveHover]) => backgroundBaseInteractiveHover, ['colors.backgroundBaseInteractiveHover'])
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const _buttons = {
+  backgroundPrimary: computed(([backgroundLightPrimary]) => backgroundLightPrimary, ['colors.backgroundLightPrimary']),
+  backgroundAccent: computed(([backgroundLightAccent]) => backgroundLightAccent, ['colors.backgroundLightAccent']),
+  backgroundAccentSecondary: computed(([backgroundLightAccentSecondary]) => backgroundLightAccentSecondary, ['colors.backgroundLightAccentSecondary']),
+  backgroundNeutral: computed(([backgroundLightNeutral]) => backgroundLightNeutral, ['colors.backgroundLightNeutral']),
+  backgroundSuccess: computed(([backgroundLightSuccess]) => backgroundLightSuccess, ['colors.backgroundLightSuccess']),
+  backgroundWarning: computed(([backgroundLightWarning]) => backgroundLightWarning, ['colors.backgroundLightWarning']),
+  backgroundRisk: computed(([backgroundLightRisk]) => backgroundLightRisk, ['colors.backgroundLightRisk']),
+  backgroundDanger: computed(([backgroundLightDanger]) => backgroundLightDanger, ['colors.backgroundLightDanger']),
+  backgroundText: computed(([backgroundBasePlain]) => backgroundBasePlain, ['colors.backgroundBasePlain']),
+  backgroundDisabled: computed(([backgroundBaseDisabled]) => backgroundBaseDisabled, ['colors.backgroundBaseDisabled']),
+  backgroundPrimaryHover: SEMANTIC_COLORS.primary70Alpha12,
+  backgroundAccentHover: SEMANTIC_COLORS.accent70Alpha12,
+  backgroundAccentSecondaryHover: SEMANTIC_COLORS.accentSecondary70Alpha12,
+  backgroundNeutralHover: SEMANTIC_COLORS.neutral70Alpha12,
+  backgroundSuccessHover: SEMANTIC_COLORS.success70Alpha12,
+  backgroundWarningHover: SEMANTIC_COLORS.warning60Alpha16,
+  backgroundRiskHover: SEMANTIC_COLORS.risk60Alpha16,
+  backgroundDangerHover: SEMANTIC_COLORS.danger70Alpha12,
+  backgroundAssistanceHover: SEMANTIC_COLORS.assistance70Alpha12,
+  backgroundTextHover: SEMANTIC_COLORS.primary100Alpha8,
+  backgroundPrimaryActive: SEMANTIC_COLORS.primary70Alpha16,
+  backgroundAccentActive: SEMANTIC_COLORS.accent70Alpha16,
+  backgroundAccentSecondaryActive: SEMANTIC_COLORS.accentSecondary70Alpha16,
+  backgroundNeutralActive: SEMANTIC_COLORS.neutral70Alpha16,
+  backgroundSuccessActive: SEMANTIC_COLORS.success70Alpha16,
+  backgroundWarningActive: SEMANTIC_COLORS.warning60Alpha20,
+  backgroundRiskActive: SEMANTIC_COLORS.risk60Alpha20,
+  backgroundDangerActive: SEMANTIC_COLORS.danger70Alpha16,
+  backgroundTextActive: SEMANTIC_COLORS.primary100Alpha12,
+  backgroundFilledPrimary: computed(([backgroundFilledPrimary]) => backgroundFilledPrimary, ['colors.backgroundFilledPrimary']),
+  backgroundFilledAccent: computed(([backgroundFilledAccent]) => backgroundFilledAccent, ['colors.backgroundFilledAccent']),
+  backgroundFilledAccentSecondary: computed(([backgroundFilledAccentSecondary]) => backgroundFilledAccentSecondary, ['colors.backgroundFilledAccentSecondary']),
+  backgroundFilledNeutral: computed(([backgroundFilledNeutral]) => backgroundFilledNeutral, ['colors.backgroundFilledNeutral']),
+  backgroundFilledSuccess: computed(([backgroundFilledSuccess]) => backgroundFilledSuccess, ['colors.backgroundFilledSuccess']),
+  backgroundFilledWarning: computed(([backgroundFilledWarning]) => backgroundFilledWarning, ['colors.backgroundFilledWarning']),
+  backgroundFilledRisk: computed(([backgroundFilledRisk]) => backgroundFilledRisk, ['colors.backgroundFilledRisk']),
+  backgroundFilledDanger: computed(([backgroundFilledDanger]) => backgroundFilledDanger, ['colors.backgroundFilledDanger']),
+  backgroundFilledText: computed(([backgroundFilledText]) => backgroundFilledText, ['colors.backgroundFilledText']),
+  backgroundFilledDisabled: computed(([backgroundBaseDisabled]) => backgroundBaseDisabled, ['colors.backgroundBaseDisabled']),
+  backgroundFilledPrimaryHover: SEMANTIC_COLORS.primary100,
+  backgroundFilledAccentHover: SEMANTIC_COLORS.accent100,
+  backgroundFilledAccentSecondaryHover: SEMANTIC_COLORS.accentSecondary100,
+  backgroundFilledNeutralHover: SEMANTIC_COLORS.neutral100,
+  backgroundFilledSuccessHover: SEMANTIC_COLORS.success100,
+  backgroundFilledWarningHover: SEMANTIC_COLORS.warning50,
+  backgroundFilledRiskHover: SEMANTIC_COLORS.risk80,
+  backgroundFilledDangerHover: SEMANTIC_COLORS.danger100,
+  backgroundFilledTextHover: SEMANTIC_COLORS.shade100,
+  backgroundFilledAssistanceHover: SEMANTIC_COLORS.assistance100,
+  backgroundFilledPrimaryActive: SEMANTIC_COLORS.primary110,
+  backgroundFilledAccentActive: SEMANTIC_COLORS.accent110,
+  backgroundFilledAccentSecondaryActive: SEMANTIC_COLORS.accentSecondary110,
+  backgroundFilledNeutralActive: SEMANTIC_COLORS.neutral110,
+  backgroundFilledSuccessActive: SEMANTIC_COLORS.success110,
+  backgroundFilledWarningActive: SEMANTIC_COLORS.warning60,
+  backgroundFilledRiskActive: SEMANTIC_COLORS.risk90,
+  backgroundFilledDangerActive: SEMANTIC_COLORS.danger110,
+  backgroundFilledTextActive: SEMANTIC_COLORS.shade110,
+  backgroundEmptyPrimaryHover: SEMANTIC_COLORS.primary70Alpha12,
+  backgroundEmptyAccentHover: SEMANTIC_COLORS.accent70Alpha12,
+  backgroundEmptyAccentSecondaryHover: SEMANTIC_COLORS.accentSecondary70Alpha12,
+  backgroundEmptyNeutralHover: SEMANTIC_COLORS.neutral70Alpha12,
+  backgroundEmptySuccessHover: SEMANTIC_COLORS.success70Alpha12,
+  backgroundEmptyWarningHover: SEMANTIC_COLORS.warning60Alpha16,
+  backgroundEmptyRiskHover: SEMANTIC_COLORS.risk60Alpha16,
+  backgroundEmptyDangerHover: SEMANTIC_COLORS.danger70Alpha12,
+  backgroundEmptyTextHover: SEMANTIC_COLORS.primary100Alpha8,
+  backgroundEmptyPrimaryActive: SEMANTIC_COLORS.primary70Alpha16,
+  backgroundEmptyAccentActive: SEMANTIC_COLORS.accent70Alpha16,
+  backgroundEmptyAccentSecondaryActive: SEMANTIC_COLORS.accentSecondary70Alpha16,
+  backgroundEmptyNeutralActive: SEMANTIC_COLORS.neutral70Alpha16,
+  backgroundEmptySuccessActive: SEMANTIC_COLORS.success70Alpha16,
+  backgroundEmptyWarningActive: SEMANTIC_COLORS.warning60Alpha20,
+  backgroundEmptyRiskActive: SEMANTIC_COLORS.risk60Alpha20,
+  backgroundEmptyDangerActive: SEMANTIC_COLORS.danger70Alpha16,
+  backgroundEmptyTextActive: SEMANTIC_COLORS.primary100Alpha12,
+  textColorPrimary: computed(([textPrimary]) => textPrimary, ['colors.textPrimary']),
+  textColorAccent: computed(([textAccent]) => textAccent, ['colors.textAccent']),
+  textColorAccentSecondary: computed(([textAccentSecondary]) => textAccentSecondary, ['colors.textAccentSecondary']),
+  textColorNeutral: computed(([textNeutral]) => textNeutral, ['colors.textNeutral']),
+  textColorSuccess: computed(([textSuccess]) => textSuccess, ['colors.textSuccess']),
+  textColorWarning: computed(([textWarning]) => textWarning, ['colors.textWarning']),
+  textColorRisk: computed(([textRisk]) => textRisk, ['colors.textRisk']),
+  textColorDanger: computed(([textDanger]) => textDanger, ['colors.textDanger']),
+  textColorText: computed(([textParagraph]) => textParagraph, ['colors.textParagraph']),
+  textColorDisabled: computed(([textDisabled]) => textDisabled, ['colors.textDisabled']),
+  textColorFilledPrimary: computed(([textInverse]) => textInverse, ['colors.textInverse']),
+  textColorFilledAccent: computed(([textInverse]) => textInverse, ['colors.textInverse']),
+  textColorFilledAccentSecondary: computed(([textInverse]) => textInverse, ['colors.textInverse']),
+  textColorFilledNeutral: computed(([textInverse]) => textInverse, ['colors.textInverse']),
+  textColorFilledSuccess: computed(([textInverse]) => textInverse, ['colors.textInverse']),
+  textColorFilledWarning: SEMANTIC_COLORS.warning110,
+  textColorFilledRisk: computed(([textInverse]) => textInverse, ['colors.textInverse']),
+  textColorFilledDanger: computed(([textInverse]) => textInverse, ['colors.textInverse']),
+  textColorFilledText: computed(([textInverse]) => textInverse, ['colors.textInverse']),
+  textColorFilledDisabled: computed(([textDisabled]) => textDisabled, ['colors.textDisabled'])
+};
+const _dark_buttons = {
+  ..._buttons,
+  backgroundPrimaryHover: SEMANTIC_COLORS.primary70Alpha16,
+  backgroundAccentHover: SEMANTIC_COLORS.accent70Alpha16,
+  backgroundAccentSecondaryHover: SEMANTIC_COLORS.accentSecondary70Alpha16,
+  backgroundNeutralHover: SEMANTIC_COLORS.neutral70Alpha16,
+  backgroundSuccessHover: SEMANTIC_COLORS.success70Alpha16,
+  backgroundWarningHover: SEMANTIC_COLORS.warning60Alpha12,
+  backgroundRiskHover: SEMANTIC_COLORS.risk60Alpha12,
+  backgroundDangerHover: SEMANTIC_COLORS.danger70Alpha16,
+  backgroundTextHover: SEMANTIC_COLORS.plainLightAlpha12,
+  backgroundPrimaryActive: SEMANTIC_COLORS.primary70Alpha20,
+  backgroundAccentActive: SEMANTIC_COLORS.accent70Alpha20,
+  backgroundAccentSecondaryActive: SEMANTIC_COLORS.accentSecondary70Alpha20,
+  backgroundNeutralActive: SEMANTIC_COLORS.neutral70Alpha20,
+  backgroundSuccessActive: SEMANTIC_COLORS.success70Alpha20,
+  backgroundWarningActive: SEMANTIC_COLORS.warning60Alpha16,
+  backgroundRiskActive: SEMANTIC_COLORS.risk60Alpha16,
+  backgroundDangerActive: SEMANTIC_COLORS.danger70Alpha20,
+  backgroundTextActive: SEMANTIC_COLORS.plainLightAlpha16,
+  backgroundFilledPrimaryHover: SEMANTIC_COLORS.primary70,
+  backgroundFilledAccentHover: SEMANTIC_COLORS.accent70,
+  backgroundFilledAccentSecondaryHover: SEMANTIC_COLORS.accentSecondary70,
+  backgroundFilledNeutralHover: SEMANTIC_COLORS.neutral70,
+  backgroundFilledSuccessHover: SEMANTIC_COLORS.success70,
+  backgroundFilledWarningHover: SEMANTIC_COLORS.warning50,
+  backgroundFilledRiskHover: SEMANTIC_COLORS.risk60,
+  backgroundFilledDangerHover: SEMANTIC_COLORS.danger70,
+  backgroundFilledTextHover: SEMANTIC_COLORS.shade70,
+  backgroundFilledAssistanceHover: SEMANTIC_COLORS.assistance70,
+  backgroundFilledPrimaryActive: SEMANTIC_COLORS.primary80,
+  backgroundFilledAccentActive: SEMANTIC_COLORS.accent80,
+  backgroundFilledAccentSecondaryActive: SEMANTIC_COLORS.accentSecondary80,
+  backgroundFilledNeutralActive: SEMANTIC_COLORS.neutral80,
+  backgroundFilledSuccessActive: SEMANTIC_COLORS.success80,
+  backgroundFilledWarningActive: SEMANTIC_COLORS.warning60,
+  backgroundFilledRiskActive: SEMANTIC_COLORS.risk70,
+  backgroundFilledDangerActive: SEMANTIC_COLORS.danger80,
+  backgroundFilledTextActive: SEMANTIC_COLORS.shade80,
+  backgroundEmptyPrimaryHover: SEMANTIC_COLORS.primary70Alpha16,
+  backgroundEmptyAccentHover: SEMANTIC_COLORS.accent70Alpha16,
+  backgroundEmptyAccentSecondaryHover: SEMANTIC_COLORS.accentSecondary70Alpha16,
+  backgroundEmptyNeutralHover: SEMANTIC_COLORS.neutral70Alpha16,
+  backgroundEmptySuccessHover: SEMANTIC_COLORS.success70Alpha16,
+  backgroundEmptyWarningHover: SEMANTIC_COLORS.warning60Alpha12,
+  backgroundEmptyRiskHover: SEMANTIC_COLORS.risk60Alpha12,
+  backgroundEmptyDangerHover: SEMANTIC_COLORS.danger70Alpha16,
+  backgroundEmptyTextHover: SEMANTIC_COLORS.plainLightAlpha12,
+  backgroundEmptyPrimaryActive: SEMANTIC_COLORS.primary70Alpha20,
+  backgroundEmptyAccentActive: SEMANTIC_COLORS.accent70Alpha20,
+  backgroundEmptyAccentSecondaryActive: SEMANTIC_COLORS.accentSecondary70Alpha20,
+  backgroundEmptySuccessActive: SEMANTIC_COLORS.success70Alpha20,
+  backgroundEmptyNeutralActive: SEMANTIC_COLORS.neutral70Alpha20,
+  backgroundEmptyWarningActive: SEMANTIC_COLORS.warning60Alpha16,
+  backgroundEmptyRiskActive: SEMANTIC_COLORS.risk60Alpha16,
+  backgroundEmptyDangerActive: SEMANTIC_COLORS.danger70Alpha20,
+  backgroundEmptyTextActive: SEMANTIC_COLORS.plainLightAlpha16,
+  textColorFilledWarning: SEMANTIC_COLORS.warning110
+};
+const buttons = {
+  LIGHT: _buttons,
+  DARK: _dark_buttons
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const _forms = {
+  background: computed(([backgroundBasePlain]) => backgroundBasePlain, ['colors.backgroundBasePlain']),
+  backgroundDisabled: computed(([backgroundBaseDisabled]) => backgroundBaseDisabled, ['colors.backgroundBaseDisabled']),
+  backgroundReadOnly: computed(([backgroundBaseDisabled]) => backgroundBaseDisabled, ['colors.backgroundBaseDisabled']),
+  backgroundFocused: computed(([backgroundBasePlain]) => backgroundBasePlain, ['colors.backgroundBasePlain']),
+  backgroundAutofilled: computed(([backgroundBasePrimary]) => backgroundBasePrimary, ['colors.backgroundBasePrimary']),
+  backgroundDropping: SEMANTIC_COLORS.success70Alpha16,
+  prependBackground: computed(([backgroundBaseFormsPrepend]) => backgroundBaseFormsPrepend, ['colors.backgroundBaseFormsPrepend']),
+  border: computed(([borderBasePlain]) => borderBasePlain, ['colors.borderBasePlain']),
+  borderDisabled: computed(([borderBaseDisabled]) => borderBaseDisabled, ['colors.borderBaseDisabled']),
+  borderFocused: computed(([borderStrongPrimary]) => borderStrongPrimary, ['colors.borderStrongPrimary']),
+  borderInvalid: computed(([borderStrongDanger]) => borderStrongDanger, ['colors.borderStrongDanger']),
+  borderHovered: computed(([borderInteractiveFormsHoverPlain]) => borderInteractiveFormsHoverPlain, ['colors.borderInteractiveFormsHoverPlain']),
+  borderInvalidHovered: computed(([borderInteractiveFormsHoverDanger]) => borderInteractiveFormsHoverDanger, ['colors.borderInteractiveFormsHoverDanger']),
+  borderAutofilled: computed(([borderBasePrimary]) => borderBasePrimary, ['colors.borderBasePrimary']),
+  borderAutofilledHovered: computed(([borderStrongPrimary]) => borderStrongPrimary, ['colors.borderStrongPrimary']),
+  clearButtonBackground: SEMANTIC_COLORS.shade60,
+  controlBorder: computed(([borderBaseProminent]) => borderBaseProminent, ['colors.borderBaseProminent']),
+  controlBorderSelected: computed(([borderStrongPrimary]) => borderStrongPrimary, ['colors.borderStrongPrimary']),
+  controlBorderDisabled: computed(([borderBaseDisabled]) => borderBaseDisabled, ['colors.borderBaseDisabled']),
+  controlBackgroundUnselected: 'transparent',
+  controlBackgroundDisabled: computed(([backgroundBaseFormsControlDisabled]) => backgroundBaseFormsControlDisabled, ['colors.backgroundBaseFormsControlDisabled']),
+  colorHasPlaceholder: computed(([textSubdued]) => textSubdued, ['colors.textSubdued']),
+  colorDisabled: computed(([textDisabled]) => textDisabled, ['colors.textDisabled']),
+  iconDisabled: computed(([textDisabled]) => textDisabled, ['colors.textDisabled'])
+};
+const _dark_forms = {
+  ..._forms,
+  clearButtonBackground: SEMANTIC_COLORS.shade90
+};
+const forms = {
+  maxWidth: computed(([base]) => mathWithUnits(base, x => x * 25), ['size.base']),
+  LIGHT: _forms,
+  DARK: _dark_forms
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const component_colors = {
+  badgeBackground: computed(([backgroundLightText]) => backgroundLightText, ['colors.backgroundFilledText']),
+  badgeBackgroundSubdued: computed(([backgroundLightText]) => backgroundLightText, ['colors.backgroundLightText']),
+  badgeBorderColorHollow: computed(([borderBasePlain]) => borderBasePlain, ['colors.borderBasePlain']),
+  badgeIconButtonBackgroundHover: computed(([backgroundBaseInteractiveHover]) => backgroundBaseInteractiveHover, ['colors.backgroundBaseInteractiveHover']),
+  breadcrumbsApplicationBackground: computed(([backgroundLightText]) => backgroundLightText, ['colors.backgroundLightText']),
+  breadcrumbsApplicationColor: computed(([textSubdued]) => textSubdued, ['colors.textSubdued']),
+  bottomBarBackground: SEMANTIC_COLORS.plainDark,
+  buttonGroupBackgroundDisabledSelected: computed(([backgroundBaseDisabled]) => backgroundBaseDisabled, ['colors.backgroundBaseDisabled']),
+  buttonGroupBorderColor: computed(([borderBasePlain]) => borderBasePlain, ['colors.borderBasePlain']),
+  buttonGroupBorderColorSelected: computed(([borderBasePlain]) => borderBasePlain, ['colors.borderBasePlain']),
+  buttonGroupFocusColor: SEMANTIC_COLORS.plainDark,
+  codeBackground: computed(([backgroundBaseHighlighted]) => backgroundBaseHighlighted, ['colors.backgroundBaseHighlighted']),
+  codeBackgroundSelected: 'inherit',
+  codeColor: computed(([textParagraph]) => textParagraph, ['colors.textParagraph']),
+  codeInlineBackground: SEMANTIC_COLORS.shade15,
+  codeInlineColor: SEMANTIC_COLORS.assistance100,
+  codeCommentColor: computed(([textSubdued]) => textSubdued, ['colors.textSubdued']),
+  codeSelectorColor: 'inherit',
+  codeStringColor: SEMANTIC_COLORS.accent100,
+  codeTagColor: SEMANTIC_COLORS.primary100,
+  codeNameColor: SEMANTIC_COLORS.primary100,
+  codeNumberColor: SEMANTIC_COLORS.accentSecondary100,
+  codeInlineCodeKeywordColor: SEMANTIC_COLORS.assistance100,
+  codeKeywordColor: SEMANTIC_COLORS.primary100,
+  codeFunctionTitleColor: 'inherit',
+  codeTypeColor: SEMANTIC_COLORS.primary100,
+  codeAttributeColor: 'inherit',
+  codeSymbolColor: SEMANTIC_COLORS.danger100,
+  codeParamsColor: 'inherit',
+  codeMetaColor: computed(([textSubdued]) => textSubdued, ['colors.textSubdued']),
+  codeTitleColor: SEMANTIC_COLORS.warning100,
+  codeSectionColor: SEMANTIC_COLORS.danger100,
+  codeAdditionColor: SEMANTIC_COLORS.accentSecondary100,
+  codeDeletionColor: SEMANTIC_COLORS.danger100,
+  codeSelectorClassColor: 'inherit',
+  codeSelectorIdColor: 'inherit',
+  collapsibleNavGroupBackground: computed(([backgroundBaseSubdued]) => backgroundBaseSubdued, ['colors.backgroundBaseSubdued']),
+  collapsibleNavGroupBackgroundDark: dark_background_colors.backgroundBaseSubdued,
+  dataGridBorderColor: computed(([borderBaseSubdued]) => borderBaseSubdued, ['colors.borderBaseSubdued']),
+  dataGridVerticalLineBorderColor: computed(([borderBaseSubdued]) => borderBaseSubdued, ['colors.borderBaseSubdued']),
+  dataGridRowBackground: computed(([backgroundBasePlain]) => backgroundBasePlain, ['colors.backgroundBasePlain']),
+  dataGridRowBackgroundHover: computed(([backgroundBaseInteractiveHover]) => backgroundBaseInteractiveHover, ['colors.backgroundBaseInteractiveHover']),
+  dataGridRowBackgroundSelect: computed(([backgroundBaseInteractiveSelect]) => backgroundBaseInteractiveSelect, ['colors.backgroundBaseInteractiveSelect']),
+  dataGridRowBackgroundSelectHover: computed(([backgroundBaseInteractiveSelectHover]) => backgroundBaseInteractiveSelectHover, ['colors.backgroundBaseInteractiveSelectHover']),
+  dataGridRowBackgroundMarked: SEMANTIC_COLORS.warning10,
+  dataGridRowBackgroundMarkedHover: SEMANTIC_COLORS.warning20,
+  dataGridRowBorderActive: computed(([borderStrongPrimary]) => borderStrongPrimary, ['colors.borderStrongPrimary']),
+  dataGridRowBorderHover: computed(([borderStrongText]) => borderStrongText, ['colors.borderStrongText']),
+  dataGridRowBorderMarked: computed(([borderStrongWarning]) => borderStrongWarning, ['colors.borderStrongWarning']),
+  dataGridRowStripesBackground: computed(([backgroundBasePlain]) => backgroundBasePlain, ['colors.backgroundBasePlain']),
+  dataGridRowStripesBackgroundHover: SEMANTIC_COLORS.shade15,
+  dataGridRowStripesBackgroundStriped: computed(([backgroundBaseSubdued]) => backgroundBaseSubdued, ['colors.backgroundBaseSubdued']),
+  dataGridRowStripesBackgroundStripedHover: SEMANTIC_COLORS.shade15,
+  dataGridRowStripesBackgroundSelect: computed(([backgroundBaseInteractiveSelect]) => backgroundBaseInteractiveSelect, ['colors.backgroundBaseInteractiveSelect']),
+  dataGridRowStripesBackgroundSelectHover: computed(([backgroundBaseInteractiveSelectHover]) => backgroundBaseInteractiveSelectHover, ['colors.backgroundBaseInteractiveSelectHover']),
+  dragDropDraggingBackground: computed(([backgroundBaseSuccess]) => backgroundBaseSuccess, ['colors.backgroundBaseSuccess']),
+  dragDropDraggingOverBackground: computed(([backgroundLightSuccess]) => backgroundLightSuccess, ['colors.backgroundLightSuccess']),
+  filterButtonBadgeBackgroundHover: SEMANTIC_COLORS.shade25,
+  filterSelectItemBackgroundFocusDisabled: computed(([backgroundBaseDisabled]) => backgroundBaseDisabled, ['colors.backgroundBaseDisabled']),
+  flyoutFooterBackground: computed(([backgroundBaseHighlighted]) => backgroundBaseHighlighted, ['colors.backgroundBaseHighlighted']),
+  flyoutCloseButtonInsideBackground: computed(([backgroundBasePlain]) => backgroundBasePlain, ['colors.backgroundBasePlain']),
+  headerBackground: computed(([backgroundBasePlain]) => backgroundBasePlain, ['colors.backgroundBasePlain']),
+  headerDarkBackground: dark_background_colors.backgroundBasePlain,
+  headerDarkSearchBorderColor: dark_border_colors.borderBasePlain,
+  headerDarkSectionItemBackgroundFocus: dark_background_colors.backgroundBasePrimary,
+  // we don't want to inherit overrides (e.g. HCM)
+  loadingSpinnerBorder: border_colors.borderBasePlain,
+  loadingSpinnerHighlight: computed(([borderStrongPrimary]) => borderStrongPrimary, ['colors.borderStrongPrimary']),
+  loadingChartMonoBackground0: SEMANTIC_COLORS.shade20,
+  loadingChartMonoBackground1: SEMANTIC_COLORS.shade30,
+  loadingChartMonoBackground2: SEMANTIC_COLORS.shade40,
+  loadingChartMonoBackground3: SEMANTIC_COLORS.shade50,
+  markBackground: computed(([backgroundLightPrimary]) => backgroundLightPrimary, ['colors.backgroundLightPrimary']),
+  markdownFormatTableBorderColor: computed(([borderBasePlain]) => borderBasePlain, ['colors.borderBasePlain']),
+  overlayMaskBackground: computed(([backgroundBaseInteractiveOverlay]) => backgroundBaseInteractiveOverlay, ['colors.backgroundBaseInteractiveOverlay']),
+  overlayMaskBackgroundHighContrast: `rgba(${SEMANTIC_COLORS.shade140RGB}, 0.9)`,
+  popoverPanelBackground: computed(([backgroundBasePlain]) => backgroundBasePlain, ['colors.backgroundBasePlain']),
+  popoverFooterBorderColor: computed(([borderBaseSubdued]) => borderBaseSubdued, ['colors.borderBaseSubdued']),
+  scrollbarTrackColor: SEMANTIC_COLORS.shade15,
+  sideNavItemEmphasizedBackground: computed(([backgroundBaseInteractiveSelect]) => backgroundBaseInteractiveSelect, ['colors.backgroundBaseInteractiveSelect']),
+  selectableListItemBorderColor: computed(([borderBaseSubdued]) => borderBaseSubdued, ['colors.borderBaseSubdued']),
+  skeletonBackgroundSkeletonMiddleHighContrast: `rgba(${SEMANTIC_COLORS.shade100RGB}, 0.04)`,
+  switchBackgroundOn: computed(([backgroundFilledPrimary]) => backgroundFilledPrimary, ['colors.backgroundFilledPrimary']),
+  switchBackgroundOff: computed(([backgroundFilledText]) => backgroundFilledText, ['colors.backgroundFilledText']),
+  switchUncompressedBackgroundDisabled: computed(([backgroundBaseFormsControlDisabled]) => backgroundBaseFormsControlDisabled, ['colors.backgroundBaseFormsControlDisabled']),
+  switchCompressedBackgroundDisabled: computed(([backgroundBaseFormsControlDisabled]) => backgroundBaseFormsControlDisabled, ['colors.backgroundBaseFormsControlDisabled']),
+  switchMiniBackgroundDisabled: computed(([backgroundBaseFormsControlDisabled]) => backgroundBaseFormsControlDisabled, ['colors.backgroundBaseFormsControlDisabled']),
+  switchThumbBackgroundDisabled: computed(([backgroundBasePlain]) => backgroundBasePlain, ['colors.backgroundBasePlain']),
+  switchThumbBorderOn: computed(([backgroundFilledPrimary]) => backgroundFilledPrimary, ['colors.backgroundFilledPrimary']),
+  switchThumbBorderOff: computed(([backgroundFilledText]) => backgroundFilledText, ['colors.backgroundFilledText']),
+  switchIconDisabled: forms.LIGHT.iconDisabled,
+  tableRowBackgroundHover: computed(([backgroundBaseInteractiveHover]) => backgroundBaseInteractiveHover, ['colors.backgroundBaseInteractiveHover']),
+  tableRowBackgroundSelected: computed(([backgroundBaseInteractiveSelect]) => backgroundBaseInteractiveSelect, ['colors.backgroundBaseInteractiveSelect']),
+  tableRowBackgroundSelectedHover: computed(([backgroundBaseInteractiveSelectHover]) => backgroundBaseInteractiveSelectHover, ['colors.backgroundBaseInteractiveSelectHover']),
+  tableRowInteractiveBackgroundHover: computed(([backgroundBaseInteractiveSelect]) => backgroundBaseInteractiveSelect, ['colors.backgroundBaseInteractiveSelect']),
+  tableRowInteractiveBackgroundFocus: computed(([backgroundBaseInteractiveHover]) => backgroundBaseInteractiveHover, ['colors.backgroundBaseInteractiveHover']),
+  tableRowBackgroundMarked: SEMANTIC_COLORS.warning10,
+  tableRowBackgroundMarkedHover: SEMANTIC_COLORS.warning20,
+  tableCellSortableIconColor: computed(([backgroundFilledText]) => backgroundFilledText, ['colors.backgroundFilledText']),
+  tableFooterBackground: SEMANTIC_COLORS.shade15,
+  tooltipBackground: dark_background_colors.backgroundBaseSubdued,
+  tooltipBorder: dark_border_colors.borderBaseSubdued,
+  tooltipBorderFloating: computed(([borderBaseFloating]) => borderBaseFloating, ['colors.borderBaseFloating']),
+  tourFooterBackground: computed(([backgroundBaseHighlighted]) => backgroundBaseHighlighted, ['colors.backgroundBaseHighlighted']),
+  tourStepIndicatorInactiveColor: SEMANTIC_COLORS.shade50,
+  tourStepIndicatorActiveColor: computed(([backgroundFilledSuccess]) => backgroundFilledSuccess, ['colors.backgroundFilledSuccess']),
+  treeViewItemBackgroundHover: computed(([backgroundBaseInteractiveHover]) => backgroundBaseInteractiveHover, ['colors.backgroundBaseInteractiveHover'])
+};
+const components = {
+  buttons,
+  forms,
+  LIGHT: component_colors,
+  DARK: {
+    ...component_colors,
+    buttonGroupFocusColor: SEMANTIC_COLORS.plainLight,
+    dataGridRowStripesBackgroundHover: SEMANTIC_COLORS.shade130,
+    dataGridRowStripesBackgroundStripedHover: SEMANTIC_COLORS.shade130,
+    dataGridRowBackgroundMarked: SEMANTIC_COLORS.warning140,
+    dataGridRowBackgroundMarkedHover: SEMANTIC_COLORS.warning130,
+    codeInlineBackground: SEMANTIC_COLORS.shade135,
+    codeInlineColor: SEMANTIC_COLORS.assistance60,
+    codeStringColor: SEMANTIC_COLORS.accent60,
+    codeTagColor: SEMANTIC_COLORS.primary60,
+    codeNameColor: SEMANTIC_COLORS.primary60,
+    codeNumberColor: SEMANTIC_COLORS.accentSecondary60,
+    codeInlineCodeKeywordColor: SEMANTIC_COLORS.assistance60,
+    codeKeywordColor: SEMANTIC_COLORS.assistance60,
+    codeTypeColor: SEMANTIC_COLORS.primary60,
+    codeSymbolColor: SEMANTIC_COLORS.danger60,
+    codeTitleColor: SEMANTIC_COLORS.warning60,
+    codeSectionColor: SEMANTIC_COLORS.danger60,
+    codeAdditionColor: SEMANTIC_COLORS.accentSecondary60,
+    codeDeletionColor: SEMANTIC_COLORS.danger60,
+    filterButtonBadgeBackgroundHover: SEMANTIC_COLORS.shade105,
+    loadingSpinnerBorder: dark_border_colors.borderBasePlain,
+    loadingChartMonoBackground0: SEMANTIC_COLORS.shade110,
+    loadingChartMonoBackground1: SEMANTIC_COLORS.shade100,
+    loadingChartMonoBackground2: SEMANTIC_COLORS.shade90,
+    loadingChartMonoBackground3: SEMANTIC_COLORS.shade80,
+    overlayMaskBackgroundHighContrast: `rgba(${SEMANTIC_COLORS.shade140RGB}, 0.9)`,
+    scrollbarTrackColor: SEMANTIC_COLORS.shade145,
+    skeletonBackgroundSkeletonMiddleHighContrast: `rgba(${SEMANTIC_COLORS.plainLightRGB}, 0.3)`,
+    switchIconDisabled: forms.DARK.iconDisabled,
+    // TODO: align table hover states
+    tableRowInteractiveBackgroundHover: computed(([backgroundBaseInteractiveHover]) => backgroundBaseInteractiveHover, ['colors.backgroundBaseInteractiveHover']),
+    tableRowInteractiveBackgroundFocus: computed(([backgroundBaseInteractiveHover]) => backgroundBaseInteractiveHover, ['colors.backgroundBaseInteractiveHover']),
+    tableRowBackgroundMarked: SEMANTIC_COLORS.warning140,
+    tableRowBackgroundMarkedHover: SEMANTIC_COLORS.warning130,
+    tableFooterBackground: SEMANTIC_COLORS.shade135,
+    tourStepIndicatorInactiveColor: SEMANTIC_COLORS.shade100,
+    tourStepIndicatorActiveColor: computed(([backgroundFilledSuccess]) => backgroundFilledSuccess, ['colors.backgroundFilledSuccess'])
+  }
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const baseColorVis = {
+  euiColorVis0: SEMANTIC_COLORS.accentSecondary110,
+  euiColorVis1: SEMANTIC_COLORS.accentSecondary80,
+  euiColorVis2: SEMANTIC_COLORS.primary110,
+  euiColorVis3: SEMANTIC_COLORS.primary80,
+  euiColorVis4: SEMANTIC_COLORS.accent110,
+  euiColorVis5: SEMANTIC_COLORS.accent80,
+  euiColorVis6: SEMANTIC_COLORS.danger110,
+  euiColorVis7: SEMANTIC_COLORS.danger80,
+  euiColorVis8: SEMANTIC_COLORS.warning110,
+  euiColorVis9: SEMANTIC_COLORS.warning80
+};
+const visColorsLightHighContrast = {
+  ...baseColorVis,
+  euiColorVisBehindText0: baseColorVis.euiColorVis0,
+  euiColorVisBehindText1: baseColorVis.euiColorVis1,
+  euiColorVisBehindText2: baseColorVis.euiColorVis2,
+  euiColorVisBehindText3: baseColorVis.euiColorVis3,
+  euiColorVisBehindText4: baseColorVis.euiColorVis4,
+  euiColorVisBehindText5: baseColorVis.euiColorVis5,
+  euiColorVisBehindText6: baseColorVis.euiColorVis6,
+  euiColorVisBehindText7: baseColorVis.euiColorVis7,
+  euiColorVisBehindText8: baseColorVis.euiColorVis8,
+  euiColorVisBehindText9: baseColorVis.euiColorVis9,
+  euiColorVisText0: SEMANTIC_COLORS.accentSecondary110,
+  euiColorVisText1: SEMANTIC_COLORS.accentSecondary100,
+  euiColorVisText2: SEMANTIC_COLORS.primary110,
+  euiColorVisText3: SEMANTIC_COLORS.primary90,
+  euiColorVisText4: SEMANTIC_COLORS.accent100,
+  euiColorVisText5: SEMANTIC_COLORS.accent80,
+  euiColorVisText6: SEMANTIC_COLORS.danger100,
+  euiColorVisText7: SEMANTIC_COLORS.danger80,
+  euiColorVisText8: SEMANTIC_COLORS.warning110,
+  euiColorVisText9: SEMANTIC_COLORS.warning90,
+  euiColorVisNeutral0: SEMANTIC_COLORS.neutral100,
+  euiColorVisNeutral1: SEMANTIC_COLORS.neutral80,
+  euiColorVisSuccess0: SEMANTIC_COLORS.success100,
+  euiColorVisSuccess1: SEMANTIC_COLORS.success80,
+  euiColorVisWarning0: SEMANTIC_COLORS.warning100,
+  euiColorVisWarning1: SEMANTIC_COLORS.warning80,
+  euiColorVisRisk0: SEMANTIC_COLORS.risk100,
+  euiColorVisRisk1: SEMANTIC_COLORS.risk80,
+  euiColorVisDanger0: SEMANTIC_COLORS.danger100,
+  euiColorVisDanger1: SEMANTIC_COLORS.danger80,
+  // We removed the `mutedGrey` palette in favor of the `blueGrey` palette from the theme
+  // but we need to keep this specific value for visualizations backwards compatibility.
+  // We want to limit its usage to visualizations only, so we're keeping it hardcoded here.
+  euiColorVisBase0: '#F6F9FC',
+  euiColorVisGrey0: PRIMITIVE_COLORS.blueGrey30,
+  euiColorVisGrey1: PRIMITIVE_COLORS.blueGrey60,
+  euiColorVisGrey2: PRIMITIVE_COLORS.blueGrey90,
+  euiColorVisGrey3: PRIMITIVE_COLORS.blueGrey130,
+  euiColorVisWarm0: SEMANTIC_COLORS.danger10,
+  euiColorVisWarm1: SEMANTIC_COLORS.danger50,
+  euiColorVisWarm2: SEMANTIC_COLORS.danger100,
+  euiColorVisCool0: SEMANTIC_COLORS.primary10,
+  euiColorVisCool1: SEMANTIC_COLORS.primary50,
+  euiColorVisCool2: SEMANTIC_COLORS.primary100,
+  euiColorVisComplementary0: SEMANTIC_COLORS.primary80,
+  euiColorVisComplementary1: SEMANTIC_COLORS.warning80
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const severityColorsLightHighContrast = {
+  unknown: SEMANTIC_COLORS.shade70,
+  neutral: SEMANTIC_COLORS.neutral70,
+  success: SEMANTIC_COLORS.success80,
+  warning: SEMANTIC_COLORS.warning80,
+  risk: SEMANTIC_COLORS.risk70,
+  danger: SEMANTIC_COLORS.danger70,
+  assistance: SEMANTIC_COLORS.assistance70
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const overrides = {
+  HCM: {
+    colors: {
+      plainDark: PRIMITIVE_COLORS.black,
+      plainLight: PRIMITIVE_COLORS.white,
+      DARK: {
+        textInk: PRIMITIVE_COLORS.black,
+        textGhost: PRIMITIVE_COLORS.white,
+        text: SEMANTIC_COLORS.shade30,
+        textParagraph: SEMANTIC_COLORS.shade30
+      },
+      LIGHT: {
+        textInk: PRIMITIVE_COLORS.black,
+        textGhost: PRIMITIVE_COLORS.white,
+        text: SEMANTIC_COLORS.shade130,
+        textParagraph: SEMANTIC_COLORS.shade130,
+        vis: visColorsLightHighContrast,
+        severity: severityColorsLightHighContrast
+      }
+    }
+  }
+};
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+const EUI_THEME_BOREALIS_KEY = 'EUI_THEME_BOREALIS';
+const euiThemeBorealis = {
+  colors,
+  base,
+  size,
+  border,
+  font,
+  animation,
+  breakpoint,
+  levels,
+  shadows,
+  focus,
+  components,
+  flags: {
+    shadowVariant: 'refresh'
+  },
+  overrides
+};
+const EuiThemeBorealis = buildTheme(euiThemeBorealis, EUI_THEME_BOREALIS_KEY);
 /**
  * What `@highContrastMode` accepts: upstream's boolean prop (`true` is