@elastic/eui 101.4.0 → 102.0.0-amsterdam.0

package/optimize/lib/themes/amsterdam/global_styling/variables/_colors_severity.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.severityColors = void 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.
+ */
+
+/**
+ * These are not actually used, but we map them to ensure token parity.
+ * They are mapped to other vis colors
+ */
+var severityColors = exports.severityColors = {
+  unknown: '#D3DAE6',
+  neutral: '#BECFE3',
+  success: '#54B399',
+  warning: '#D6BF57',
+  risk: '#DA8B45',
+  danger: '#E7664C'
+};

package/optimize/lib/themes/amsterdam/global_styling/variables/_colors_vis.js

@@ -109,21 +109,6 @@ var colorVis = exports.colorVis = {
   euiColorVisDanger0: '#CC5642',
   euiColorVisDanger1: euiPaletteColorBlind.euiColorVis9.graphic,
   euiColorVisNeutral0: '#FFFFFF',
-  euiColorSeverity0: '#D3DAE6',
-  euiColorSeverity1: '#6092C0',
-  euiColorSeverity2: '#78A2C9',
-  euiColorSeverity3: '#90B0D1',
-  euiColorSeverity4: '#A6C0DA',
-  euiColorSeverity5: '#BECFE3',
-  euiColorSeverity6: '#DECC79',
-  euiColorSeverity7: '#D6BF57',
-  euiColorSeverity8: '#E69D8F',
-  euiColorSeverity9: '#E2907F',
-  euiColorSeverity10: '#E18773',
-  euiColorSeverity11: '#DD7B67',
-  euiColorSeverity12: '#D66E5C',
-  euiColorSeverity13: '#D2634E',
-  euiColorSeverity14: '#CC5642',
   euiColorVisGrey0: '#d3dae6',
   euiColorVisGrey1: '#98a2b3',
   euiColorVisGrey2: '#69707d',

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@elastic/eui",
   "description": "Elastic UI Component Library",
-  "version": "101.4.0",
+  "version": "102.0.0-amsterdam.0",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "lib",
   "module": "es",
@@ -52,7 +52,7 @@
     "url": "https://github.com/elastic/eui.git"
   },
   "dependencies": {
-    "@elastic/eui-theme-common": "0.2.0",
+    "@elastic/eui-theme-common": "1.0.0",
     "@elastic/prismjs-esql": "^1.1.0",
     "@hello-pangea/dnd": "^16.6.0",
     "@types/lodash": "^4.14.202",
@@ -106,7 +106,7 @@
     "@cypress/webpack-dev-server": "^1.7.0",
     "@elastic/charts": "^64.1.0",
     "@elastic/datemath": "^5.0.3",
-    "@elastic/eui-theme-borealis": "0.2.0",
+    "@elastic/eui-theme-borealis": "1.0.0",
     "@emotion/babel-preset-css-prop": "^11.11.0",
     "@emotion/cache": "^11.11.0",
     "@emotion/css": "^11.11.0",
@@ -259,7 +259,7 @@
   },
   "peerDependencies": {
     "@elastic/datemath": "^5.0.2",
-    "@elastic/eui-theme-borealis": "0.2.0",
+    "@elastic/eui-theme-borealis": "1.0.0",
     "@emotion/css": "11.x",
     "@emotion/react": "11.x",
     "@types/react": "^16.9 || ^17.0 || ^18.0",

package/src/themes/amsterdam/_colors_dark.scss

@@ -2,6 +2,7 @@
 
 // This extra import allows any variables that are created via functions to work when loaded into JS
 @import 'node_modules/@elastic/eui-theme-common/src/global_styling/functions/index';
+@import './global_styling/variables/colors_severity';
 
 // Constants
 $euiColorGhost: #FFF !default;
@@ -34,8 +35,10 @@ $euiColorHighlight: #2E2D25 !default;
 $euiColorBackgroundBasePrimary: shade($euiColorPrimary, 80%) !default;
 $euiColorBackgroundBaseAccent: shade($euiColorAccent, 80%) !default;
 $euiColorBackgroundBaseAccentSecondary: shade($euiColorAccentSecondary, 80%) !default;
+$euiColorBackgroundBaseNeutral: shade($euiColorSeverityNeutral, 80%) !default;
 $euiColorBackgroundBaseSuccess: shade($euiColorSuccess, 80%) !default;
 $euiColorBackgroundBaseWarning: shade($euiColorWarning, 80%) !default;
+$euiColorBackgroundBaseRisk: shade($euiColorSeverityRisk, 80%) !default;
 $euiColorBackgroundBaseDanger: shade($euiColorDanger, 80%) !default;
 $euiColorBackgroundBaseSubdued: shade($euiPageBackgroundColor, 80%) !default;
 $euiColorBackgroundBaseDisabled: transparentize($euiColorLightShade, 0.15)!default;
@@ -52,16 +55,20 @@ $euiColorBackgroundBaseSkeletonMiddle: shade($euiColorLightShade, 0.24) !default
 $euiColorBackgroundLightPrimary: shade($euiColorPrimary, 0.7) !default;
 $euiColorBackgroundLightAccent: shade($euiColorAccent, 0.7) !default;
 $euiColorBackgroundLightAccentSecondary: shade($euiColorAccentSecondary, 0.7)  !default;
+$euiColorBackgroundLightNeutral: shade($euiColorSeverityNeutral, 0.7) !default;
 $euiColorBackgroundLightSuccess: shade($euiColorSuccess, 0.7)  !default;
 $euiColorBackgroundLightWarning: shade($euiColorWarning, 0.7)  !default;
+$euiColorBackgroundLightRisk: shade($euiColorSeverityRisk, 0.7)  !default;
 $euiColorBackgroundLightDanger: shade($euiColorDanger, 0.7)  !default;
 $euiColorBackgroundLightText: shade($euiColorLightShade, 0.2) !default;
 
 $euiColorBackgroundFilledPrimary: $euiColorPrimary !default;
 $euiColorBackgroundFilledAccent: $euiColorAccent !default;
 $euiColorBackgroundFilledAccentSecondary: $euiColorAccentSecondary !default;
+$euiColorBackgroundFilledNeutral: $euiColorSeverityNeutral !default;
 $euiColorBackgroundFilledSuccess: $euiColorSuccess !default;
 $euiColorBackgroundFilledWarning: $euiColorWarning !default;
+$euiColorBackgroundFilledRisk: $euiColorSeverityRisk !default;
 $euiColorBackgroundFilledDanger: $euiColorDanger !default;
 $euiColorBackgroundFilledText:  #DFE5EF !default;
 
@@ -88,8 +95,10 @@ $euiColorDisabledText: makeDisabledContrastColor($euiColorDisabled) !default;
 $euiColorTextPrimary: $euiColorPrimaryText !default;
 $euiColorTextAccent: $euiColorAccentText !default;
 $euiColorTextAccentSecondary: $euiColorSuccessText !default;
+$euiColorTextNeutral: makeHighContrastColor($euiColorSeverityNeutral) !default;
 $euiColorTextSuccess: $euiColorSuccessText !default;
 $euiColorTextWarning: $euiColorWarningText !default;
+$euiColorTextRisk: makeHighContrastColor($euiColorSeverityRisk) !default;
 $euiColorTextDanger: $euiColorDangerText !default;
 
 $euiLinkColor: $euiColorPrimaryText !default;
@@ -98,8 +107,10 @@ $euiLinkColor: $euiColorPrimaryText !default;
 $euiColorBorderBasePrimary: shade($euiColorPrimary, 0.6) !default;
 $euiColorBorderBaseAccent: shade($euiColorAccent, 0.6) !default;
 $euiColorBorderBaseAccentSecondary: shade($euiColorAccentSecondary, 0.6) !default;
+$euiColorBorderBaseNeutral: shade($euiColorSeverityNeutral, 0.6) !default;
 $euiColorBorderBaseSuccess: shade($euiColorSuccess, 0.6) !default;
 $euiColorBorderBaseWarning: shade($euiColorWarning, 0.6) !default;
+$euiColorBorderBaseRisk: shade($euiColorSeverityRisk, 0.6) !default;
 $euiColorBorderBaseDanger: shade($euiColorDanger, 0.6) !default;
 
 $euiColorBorderBasePlain: $euiColorLightShade !default;
@@ -112,8 +123,10 @@ $euiColorBorderBaseFormsControl: tint($euiColorLightestShade, 0.31) !default;
 $euiColorBorderStrongPrimary: $euiColorBorderBasePrimary !default;
 $euiColorBorderStrongAccent: $euiColorBorderBaseAccent !default;
 $euiColorBorderStrongAccentSecondary: $euiColorBorderBaseAccentSecondary !default;
+$euiColorBorderStrongNeutral: $euiColorBorderBasePrimary !default;
 $euiColorBorderStrongSuccess: $euiColorBorderBaseSuccess !default;
 $euiColorBorderStrongWarning: $euiColorBorderBaseWarning !default;
+$euiColorBorderStrongRisk: $euiColorBorderBaseWarning !default;
 $euiColorBorderStrongDanger: $euiColorBorderBaseDanger !default;
 
 // Charts

package/src/themes/amsterdam/_colors_light.scss

@@ -2,6 +2,7 @@
 
 // This extra import allows any variables that are created via functions to work when loaded into JS
 @import 'node_modules/@elastic/eui-theme-common/src/global_styling/functions/index';
+@import './global_styling/variables/colors_severity';
 
 // Constants
 $euiColorGhost: #FFF !default;
@@ -34,8 +35,10 @@ $euiColorHighlight: tint($euiColorWarning, 90%) !default;
 $euiColorBackgroundBasePrimary: tint($euiColorPrimary, 90%) !default;
 $euiColorBackgroundBaseAccent: tint($euiColorAccent, 90%) !default;
 $euiColorBackgroundBaseAccentSecondary: tint($euiColorAccentSecondary, 90%) !default;
+$euiColorBackgroundBaseNeutral: tint($euiColorSeverityNeutral, 90%) !default;
 $euiColorBackgroundBaseSuccess: tint($euiColorSuccess, 90%) !default;
 $euiColorBackgroundBaseWarning: tint($euiColorWarning, 90%) !default;
+$euiColorBackgroundBaseRisk: tint($euiColorSeverityRisk, 90%) !default;
 $euiColorBackgroundBaseDanger: tint($euiColorDanger, 90%) !default;
 $euiColorBackgroundBaseSubdued: $euiPageBackgroundColor !default;
 $euiColorBackgroundBaseDisabled: transparentize($euiColorLightShade, 0.15) !default;
@@ -52,16 +55,20 @@ $euiColorBackgroundBaseSkeletonMiddle: tint($euiColorLightShade, 0.8) !default;
 $euiColorBackgroundLightPrimary: tint($euiColorPrimary, 0.8) !default;
 $euiColorBackgroundLightAccent: tint($euiColorAccent, 0.8) !default;
 $euiColorBackgroundLightAccentSecondary: tint($euiColorAccentSecondary, 0.8)  !default;
+$euiColorBackgroundLightNeutral: tint($euiColorSeverityNeutral, 0.8) !default;
 $euiColorBackgroundLightSuccess: tint($euiColorSuccess, 0.8)  !default;
 $euiColorBackgroundLightWarning: tint($euiColorWarning, 0.8)  !default;
+$euiColorBackgroundLightRisk: tint($euiColorSeverityRisk, 0.8)  !default;
 $euiColorBackgroundLightDanger: tint($euiColorDanger, 0.8)  !default;
 $euiColorBackgroundLightText: tint($euiColorLightShade, 0.5) !default;
 
 $euiColorBackgroundFilledPrimary: $euiColorPrimary !default;
 $euiColorBackgroundFilledAccent: tint($euiColorAccent, 0.3) !default;
 $euiColorBackgroundFilledAccentSecondary: tint($euiColorAccentSecondary, 0.3) !default;
+$euiColorBackgroundFilledNeutral: $euiColorSeverityNeutral !default;
 $euiColorBackgroundFilledSuccess: tint($euiColorSuccess, 0.3) !default;
 $euiColorBackgroundFilledWarning: $euiColorWarning !default;
+$euiColorBackgroundFilledRisk: $euiColorSeverityRisk !default;
 $euiColorBackgroundFilledDanger: $euiColorDanger !default;
 $euiColorBackgroundFilledText: $euiColorDarkShade !default;
 
@@ -88,8 +95,10 @@ $euiColorDisabledText: makeDisabledContrastColor($euiColorDisabled) !default;
 $euiColorTextPrimary: $euiColorPrimaryText !default;
 $euiColorTextAccent: $euiColorAccentText !default;
 $euiColorTextAccentSecondary: $euiColorSuccessText !default;
+$euiColorTextNeutral: makeHighContrastColor($euiColorSeverityNeutral) !default;
 $euiColorTextSuccess: $euiColorSuccessText !default;
 $euiColorTextWarning: $euiColorWarningText !default;
+$euiColorTextRisk: makeHighContrastColor($euiColorSeverityRisk) !default;
 $euiColorTextDanger: $euiColorDangerText !default;
 
 $euiLinkColor: $euiColorPrimaryText !default;
@@ -98,8 +107,10 @@ $euiLinkColor: $euiColorPrimaryText !default;
 $euiColorBorderBasePrimary: tint($euiColorPrimary, 0.6) !default;
 $euiColorBorderBaseAccent: tint($euiColorAccent, 0.6) !default;
 $euiColorBorderBaseAccentSecondary: tint($euiColorAccentSecondary, 0.6) !default;
+$euiColorBorderBaseNeutral: tint($euiColorSeverityNeutral, 0.6) !default;
 $euiColorBorderBaseSuccess: tint($euiColorSuccess, 0.6) !default;
 $euiColorBorderBaseWarning: tint($euiColorWarning, 0.6) !default;
+$euiColorBorderBaseRisk: tint($euiColorSeverityRisk, 0.6) !default;
 $euiColorBorderBaseDanger: tint($euiColorDanger, 0.6) !default;
 
 $euiColorBorderBasePlain: $euiColorLightShade !default;
@@ -112,8 +123,10 @@ $euiColorBorderBaseFormsControl: shade($euiColorLightestShade, 0.4) !default;
 $euiColorBorderStrongPrimary: $euiColorBorderBasePrimary !default;
 $euiColorBorderStrongAccent: $euiColorBorderBaseAccent !default;
 $euiColorBorderStrongAccentSecondary: $euiColorBorderBaseAccentSecondary !default;
+$euiColorBorderStrongNeutral: $euiColorBorderBasePrimary !default;
 $euiColorBorderStrongSuccess: $euiColorBorderBaseSuccess !default;
 $euiColorBorderStrongWarning: $euiColorBorderBaseWarning !default;
+$euiColorBorderStrongRisk: $euiColorBorderBaseWarning !default;
 $euiColorBorderStrongDanger: $euiColorBorderBaseDanger !default;
 
 // Charts

package/src/themes/amsterdam/global_styling/variables/_colors_severity.scss

@@ -0,0 +1,9 @@
+// Severity colors
+// stylelint-disable color-no-hex
+
+$euiColorSeverityUnknown: #D3DAE6 !default;
+$euiColorSeverityNeutral: #BECFE3 !default;
+$euiColorSeveritySuccess: #54B399 !default;
+$euiColorSeverityWarning: #D6BF57 !default;
+$euiColorSeverityRisk: #DA8B45 !default;
+$euiColorSeverityDanger: #E7664C !default;

package/test-env/components/badge/badge.js

@@ -33,7 +33,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var ICON_SIDES = exports.ICON_SIDES = ['left', 'right'];
-var COLORS = exports.COLORS = ['default', 'hollow', 'primary', 'success', 'accent', 'warning', 'danger'];
+var COLORS = exports.COLORS = ['default', 'hollow', 'primary', 'accent', 'neutral', 'success', 'warning', 'risk', 'danger'];
 var EuiBadge = exports.EuiBadge = function EuiBadge(_ref) {
   var children = _ref.children,
     _ref$color = _ref.color,

package/test-env/components/badge/badge.styles.js

@@ -42,9 +42,11 @@ var euiBadgeStyles = exports.euiBadgeStyles = function euiBadgeStyles(euiThemeCo
     hollow: /*#__PURE__*/(0, _react.css)(setBadgeColorVars(badgeColors.hollow), " border-color:", badgeColors.hollow.borderColor, ";;label:hollow;"),
     primary: /*#__PURE__*/(0, _react.css)(setBadgeColorVars(badgeColors.primary), ";label:primary;"),
     accent: /*#__PURE__*/(0, _react.css)(setBadgeColorVars(badgeColors.accent), ";label:accent;"),
+    neutral: /*#__PURE__*/(0, _react.css)(setBadgeColorVars(badgeColors.neutral), ";label:neutral;"),
+    success: /*#__PURE__*/(0, _react.css)(setBadgeColorVars(badgeColors.success), ";label:success;"),
     warning: /*#__PURE__*/(0, _react.css)(setBadgeColorVars(badgeColors.warning), ";label:warning;"),
+    risk: /*#__PURE__*/(0, _react.css)(setBadgeColorVars(badgeColors.risk), ";label:risk;"),
     danger: /*#__PURE__*/(0, _react.css)(setBadgeColorVars(badgeColors.danger), ";label:danger;"),
-    success: /*#__PURE__*/(0, _react.css)(setBadgeColorVars(badgeColors.success), ";label:success;"),
     disabled: /*#__PURE__*/(0, _react.css)(setBadgeColorVars(badgeColors.disabled), " border-color:", badgeColors.disabled.borderColor, ";*::selection{color:", euiTheme.colors.emptyShade, ";};label:disabled;"),
     // Content wrapper
     euiBadge__content: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)(

package/test-env/components/badge/color_utils.js

@@ -26,8 +26,10 @@ var euiBadgeColors = exports.euiBadgeColors = function euiBadgeColors(euiThemeCo
   return {
     // Colors shared between buttons and badges
     primary: (0, _button.euiButtonFillColor)(euiThemeContext, 'primary'),
+    neutral: (0, _button.euiButtonFillColor)(euiThemeContext, 'neutral'),
     success: (0, _button.euiButtonFillColor)(euiThemeContext, 'success'),
     warning: (0, _button.euiButtonFillColor)(euiThemeContext, 'warning'),
+    risk: (0, _button.euiButtonFillColor)(euiThemeContext, 'risk'),
     danger: (0, _button.euiButtonFillColor)(euiThemeContext, 'danger'),
     accent: (0, _button.euiButtonFillColor)(euiThemeContext, 'accent'),
     accentSecondary: (0, _button.euiButtonFillColor)(euiThemeContext, 'accentSecondary'),

package/test-env/components/datagrid/body/header/column_sorting.js

@@ -29,8 +29,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 var useColumnSorting = exports.useColumnSorting = function useColumnSorting(_ref) {
   var _sorting$columns;
   var sorting = _ref.sorting,
-    id = _ref.id,
-    hasColumnActions = _ref.hasColumnActions;
+    id = _ref.id;
   var sortedColumn = (0, _react.useMemo)(function () {
     return sorting === null || sorting === void 0 ? void 0 : sorting.columns.find(function (col) {
       return col.id === id;
@@ -52,26 +51,28 @@ var useColumnSorting = exports.useColumnSorting = function useColumnSorting(_ref
   }, [id, isColumnSorted, sortedColumn]);
 
   /**
-   * aria-sort attribute - should only be used when a single column is being sorted
+   * `aria-sort` attribute - should only be used when a single column is being sorted
    * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-sort
    * @see https://www.w3.org/WAI/ARIA/apg/example-index/table/sortable-table.html
    * @see https://github.com/w3c/aria/issues/283 for potential future multi-column usage
    */
-  var ariaSort = isColumnSorted && hasOnlyOneSort ? sorting.columns[0].direction === 'asc' ? 'ascending' : 'descending' : undefined;
+  var hasAriaSortOnly = isColumnSorted && hasOnlyOneSort;
+  var ariaSort = hasAriaSortOnly ? sorting.columns[0].direction === 'asc' ? 'ascending' : 'descending' : undefined;
 
-  // aria-describedby ID for when aria-sort isn't sufficient
+  /**
+   * `aria-describedby` ID for when `aria-sort` cannot be used
+   */
   var sortingAriaId = (0, _services.useGeneratedHtmlId)({
     prefix: 'euiDataGridCellHeader',
     suffix: 'sorting'
   });
 
   /**
-   * Sorting status - screen reader text
+   * Screen-reader-only sorting status, an alternative to `aria-sort` for multi-column sorting
    */
   var sortingScreenReaderText = (0, _react.useMemo)(function () {
     var _sorting$columns2;
-    if (!isColumnSorted) return null;
-    if (!hasColumnActions && hasOnlyOneSort) return null; // in this scenario, the `aria-sort` attribute will be used by screen readers
+    if (!isColumnSorted || hasAriaSortOnly) return null;
     return (0, _react2.jsx)("p", {
       id: sortingAriaId,
       hidden: true
@@ -134,7 +135,7 @@ var useColumnSorting = exports.useColumnSorting = function useColumnSorting(_ref
         }
       }
     }), ".");
-  }, [isColumnSorted, hasColumnActions, hasOnlyOneSort, sorting, sortingAriaId]);
+  }, [isColumnSorted, hasAriaSortOnly, sortingAriaId, sorting === null || sorting === void 0 ? void 0 : sorting.columns, hasOnlyOneSort]);
   return {
     sortingArrow: sortingArrow,
     ariaSort: ariaSort,

package/test-env/components/datagrid/body/header/data_grid_header_cell.js

@@ -68,8 +68,7 @@ var EuiDataGridHeaderCell = exports.EuiDataGridHeaderCell = /*#__PURE__*/(0, _re
   var actionsButtonRef = (0, _react.useRef)(null);
   var _useColumnSorting = (0, _column_sorting.useColumnSorting)({
       sorting: sorting,
-      id: id,
-      hasColumnActions: hasColumnActions
+      id: id
     }),
     sortingArrow = _useColumnSorting.sortingArrow,
     ariaSort = _useColumnSorting.ariaSort,

package/test-env/components/empty_prompt/empty_prompt.styles.js

@@ -119,8 +119,10 @@ var euiEmptyPromptStyles = exports.euiEmptyPromptStyles = function euiEmptyPromp
       accent: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('border-top', generateFooterBorder('accent')), ";;label:accent;"),
       accentSecondary: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('border-top', generateFooterBorder('accentSecondary')), ";;label:accentSecondary;"),
       danger: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('border-top', generateFooterBorder('danger')), ";;label:danger;"),
+      risk: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('border-top', generateFooterBorder('risk')), ";;label:risk;"),
       warning: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('border-top', generateFooterBorder('warning')), ";;label:warning;"),
-      success: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('border-top', generateFooterBorder('success')), ";;label:success;")
+      success: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('border-top', generateFooterBorder('success')), ";;label:success;"),
+      neutral: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('border-top', generateFooterBorder('neutral')), ";;label:neutral;")
     }, generatePaddingStyles())
   };
 };

package/test-env/components/form/form_control_layout/form_control_layout_icons.styles.js

@@ -24,6 +24,8 @@ var _ref = process.env.NODE_ENV === "production" ? {
 };
 var euiFormControlLayoutIconsStyles = exports.euiFormControlLayoutIconsStyles = function euiFormControlLayoutIconsStyles(euiThemeContext) {
   var _euiFormVariables = (0, _form.euiFormVariables)(euiThemeContext),
+    controlHeight = _euiFormVariables.controlHeight,
+    controlCompressedHeight = _euiFormVariables.controlCompressedHeight,
     controlPadding = _euiFormVariables.controlPadding,
     controlCompressedPadding = _euiFormVariables.controlCompressedPadding,
     controlDisabledColor = _euiFormVariables.controlDisabledColor;
@@ -31,10 +33,10 @@ var euiFormControlLayoutIconsStyles = exports.euiFormControlLayoutIconsStyles =
     euiFormControlLayoutIcons: _ref,
     uncompressed: "\n      gap: ".concat((0, _global_styling.mathWithUnits)(controlPadding, function (x) {
       return x / 2;
-    }), ";\n    "),
+    }), ";\n      max-block-size: ").concat(controlHeight, ";\n    "),
     compressed: /*#__PURE__*/(0, _react.css)("gap:", (0, _global_styling.mathWithUnits)(controlCompressedPadding, function (x) {
       return x / 2;
-    }), ";;label:compressed;"),
+    }), ";max-block-size:", controlCompressedHeight, ";;label:compressed;"),
     disabled: /*#__PURE__*/(0, _react.css)("cursor:not-allowed;color:", controlDisabledColor, ";;label:disabled;"),
     position: {
       absolute: {

package/test-env/components/icon/icon.styles.js

@@ -40,15 +40,17 @@ var euiIconStyles = exports.euiIconStyles = function euiIconStyles(_ref3) {
     // Base
     euiIcon: /*#__PURE__*/(0, _react.css)("flex-shrink:0;display:inline-block;vertical-align:middle;fill:currentColor;transform:translate(0, 0);.euiIcon__fillNegative{fill:", euiTheme.colors.darkestShade, ";};label:euiIcon;"),
     // Colors
+    primary: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.textPrimary, ";;label:primary;"),
     accent: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.textAccent, ";;label:accent;"),
     accentSecondary: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.textAccentSecondary, ";;label:accentSecondary;"),
-    danger: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.textDanger, ";;label:danger;"),
     ghost: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.ghost, ";*[fill],.euiIcon__fillNegative{fill:currentColor!important;};label:ghost;"),
-    primary: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.textPrimary, ";;label:primary;"),
-    success: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.textSuccess, ";;label:success;"),
     subdued: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.textSubdued, ";;label:subdued;"),
     text: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.textHeading, ";*[fill],.euiIcon__fillNegative{fill:currentColor!important;};label:text;"),
+    neutral: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.textNeutral, ";;label:neutral;"),
+    success: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.textSuccess, ";;label:success;"),
     warning: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.textWarning, ";;label:warning;"),
+    risk: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.textRisk, ";;label:risk;"),
+    danger: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.textDanger, ";;label:danger;"),
     inherit: _ref2,
     default: /*#__PURE__*/(0, _react.css)(";label:default;"),
     customColor: /*#__PURE__*/(0, _react.css)(";label:customColor;"),

package/test-env/components/icon/named_colors.js

@@ -13,7 +13,7 @@ exports.isNamedColor = isNamedColor;
  * Side Public License, v 1.
  */
 
-var COLORS = exports.COLORS = ['default', 'primary', 'success', 'accent', 'accentSecondary', 'warning', 'danger', 'text', 'subdued', 'ghost', 'inherit'];
+var COLORS = exports.COLORS = ['default', 'primary', 'neutral', 'success', 'accent', 'accentSecondary', 'warning', 'risk', 'danger', 'text', 'subdued', 'ghost', 'inherit'];
 function isNamedColor(name) {
   return COLORS.includes(name);
 }

package/test-env/components/provider/provider.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.EuiProvider = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _euiThemeBorealis = require("@elastic/eui-theme-borealis");
+var _themes = require("../../themes");
 var _services = require("../../services");
 var _warning = require("../../services/theme/warning");
 var _css = require("../../services/emotion/css");
@@ -33,7 +33,7 @@ var EuiProvider = exports.EuiProvider = function EuiProvider(_ref) {
   var _ref$cache = _ref.cache,
     cache = _ref$cache === void 0 ? _css.cache : _ref$cache,
     _ref$theme = _ref.theme,
-    theme = _ref$theme === void 0 ? _euiThemeBorealis.EuiThemeBorealis : _ref$theme,
+    theme = _ref$theme === void 0 ? _themes.EuiThemeAmsterdam : _ref$theme,
     _ref$globalStyles = _ref.globalStyles,
     Globals = _ref$globalStyles === void 0 ? _global_styles.EuiGlobalStyles : _ref$globalStyles,
     _ref$utilityClasses = _ref.utilityClasses,

package/test-env/global_styling/mixins/_button.js

@@ -19,7 +19,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
  * in compliance with, at your election, the Elastic License 2.0 or the Server
  * Side Public License, v 1.
  */
-var BUTTON_COLORS = exports.BUTTON_COLORS = ['text', 'accent', 'accentSecondary', 'primary', 'success', 'warning', 'danger'];
+var BUTTON_COLORS = exports.BUTTON_COLORS = ['text', 'accent', 'accentSecondary', 'primary', 'neutral', 'success', 'warning', 'risk', 'danger'];
 var BUTTON_DISPLAYS = exports.BUTTON_DISPLAYS = ['base', 'fill', 'empty'];
 /**
  * Creates the `base` version of button styles with proper text contrast.
@@ -50,7 +50,7 @@ var euiButtonFillColor = exports.euiButtonFillColor = function euiButtonFillColo
     highContrastMode = euiThemeContext.highContrastMode;
   var backgroundTokenName = (0, _euiThemeCommon.getTokenName)('backgroundFilled', color);
   var textColorTokenName = (0, _euiThemeCommon.getTokenName)('textColorFilled', color);
-  var highContrastForeground = color === 'warning' ? euiTheme.colors.ink : color === 'disabled' ? euiTheme.components.buttons[textColorTokenName] : euiTheme.colors.textInverse;
+  var highContrastForeground = ['warning', 'neutral', 'risk'].includes(color) ? euiTheme.colors.ink : color === 'disabled' ? euiTheme.components.buttons[textColorTokenName] : euiTheme.colors.textInverse;
   var foreground = highContrastMode ? highContrastForeground : euiTheme.components.buttons[textColorTokenName];
   var background = euiTheme.components.buttons[backgroundTokenName];
   return _objectSpread({

package/test-env/global_styling/mixins/_color.js

@@ -17,7 +17,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
  * in compliance with, at your election, the Elastic License 2.0 or the Server
  * Side Public License, v 1.
  */
-var BACKGROUND_COLORS = exports.BACKGROUND_COLORS = ['transparent', 'plain', 'subdued', 'highlighted', 'accent', 'accentSecondary', 'primary', 'success', 'warning', 'danger'];
+var BACKGROUND_COLORS = exports.BACKGROUND_COLORS = ['transparent', 'plain', 'subdued', 'highlighted', 'accent', 'accentSecondary', 'primary', 'neutral', 'success', 'warning', 'risk', 'danger'];
 /**
  * @deprecated - use background tokens directly
  * @returns A single background color with optional alpha transparency

package/test-env/services/color/vis_color_store.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.EUI_VIS_COLOR_STORE = void 0;
 var _euiThemeCommon = require("@elastic/eui-theme-common");
-var _euiThemeBorealis = require("@elastic/eui-theme-borealis");
+var _colors_vis = require("../../themes/amsterdam/global_styling/variables/_colors_vis");
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
  * or more contributor license agreements. Licensed under the Elastic License
@@ -15,4 +15,4 @@ var _euiThemeBorealis = require("@elastic/eui-theme-borealis");
  */
 
 // initialsetup of Vis color storage with default colors
-var EUI_VIS_COLOR_STORE = exports.EUI_VIS_COLOR_STORE = _euiThemeCommon.EuiVisColorStore.getInstance(_euiThemeBorealis.colorVis, true);
+var EUI_VIS_COLOR_STORE = exports.EUI_VIS_COLOR_STORE = _euiThemeCommon.EuiVisColorStore.getInstance(_colors_vis.colorVis, true);

package/test-env/services/theme/context.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.defaultComputedTheme = exports.EuiThemeContext = exports.EuiSystemContext = exports.EuiNestedThemeContext = exports.EuiModificationsContext = exports.EuiHighContrastModeContext = exports.EuiColorModeContext = exports.DEFAULTS = void 0;
 var _react = require("react");
-var _euiThemeBorealis = require("@elastic/eui-theme-borealis");
+var _theme = require("../../themes/amsterdam/theme");
 var _utils = require("./utils");
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
@@ -16,7 +16,7 @@ var _utils = require("./utils");
  */
 
 var DEFAULTS = exports.DEFAULTS = {
-  system: _euiThemeBorealis.EuiThemeBorealis,
+  system: _theme.EuiThemeAmsterdam,
   modifications: {},
   colorMode: _utils.DEFAULT_COLOR_MODE,
   highContrastMode: false