@elastic/eui 97.3.0-borealis.1 → 97.3.1

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

@@ -3,10 +3,65 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "colorVis", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon.colorVis;
+exports.colorVis = 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.
+ */
+
+/**
+ * NOTE: These were quick conversions of their Sass counterparts.
+ *       They have yet to be used/tested.
+ * TODO: Make the graphic version available from `euiPaletteColorBlind()`
+ */
+
+// 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
+var euiPaletteColorBlind = {
+  euiColorVis0: {
+    graphic: '#54B399'
+  },
+  euiColorVis1: {
+    graphic: '#6092C0'
+  },
+  euiColorVis2: {
+    graphic: '#D36086'
+  },
+  euiColorVis3: {
+    graphic: '#9170B8'
+  },
+  euiColorVis4: {
+    graphic: '#CA8EAE'
+  },
+  euiColorVis5: {
+    graphic: '#D6BF57'
+  },
+  euiColorVis6: {
+    graphic: '#B9A888'
+  },
+  euiColorVis7: {
+    graphic: '#DA8B45'
+  },
+  euiColorVis8: {
+    graphic: '#AA6556'
+  },
+  euiColorVis9: {
+    graphic: '#E7664C'
   }
-});
-var _euiThemeCommon = require("@elastic/eui-theme-common");
+};
+var colorVis = exports.colorVis = {
+  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
+};

package/optimize/lib/global_styling/variables/animations.js

@@ -3,28 +3,34 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "EuiThemeAnimationEasings", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon.EuiThemeAnimationEasings;
-  }
-});
-Object.defineProperty(exports, "EuiThemeAnimationSpeeds", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon.EuiThemeAnimationSpeeds;
-  }
-});
-Object.defineProperty(exports, "euiCanAnimate", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon.euiCanAnimate;
-  }
-});
-Object.defineProperty(exports, "euiCantAnimate", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon.euiCantAnimate;
-  }
-});
-var _euiThemeCommon = require("@elastic/eui-theme-common");
+exports.euiCantAnimate = exports.euiCanAnimate = exports.EuiThemeAnimationSpeeds = exports.EuiThemeAnimationEasings = 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.
+ */
+
+/**
+ * A constant storing the `prefers-reduced-motion` media query
+ * so that when it is turned off, animations are not run.
+ */
+var euiCanAnimate = exports.euiCanAnimate = '@media screen and (prefers-reduced-motion: no-preference)';
+
+/**
+ * A constant storing the `prefers-reduced-motion` media query that will
+ * only apply the content if the setting is off (reduce).
+ */
+var euiCantAnimate = exports.euiCantAnimate = '@media screen and (prefers-reduced-motion: reduce)';
+
+/**
+ * Speeds / Durations / Delays
+ */
+
+var EuiThemeAnimationSpeeds = exports.EuiThemeAnimationSpeeds = ['extraFast', 'fast', 'normal', 'slow', 'extraSlow'];
+/**
+ * Easings / Timing functions
+ */
+
+var EuiThemeAnimationEasings = exports.EuiThemeAnimationEasings = ['bounce', 'resistance'];

package/optimize/lib/global_styling/variables/breakpoint.js

@@ -3,10 +3,19 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "EuiThemeBreakpoints", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon.EuiThemeBreakpoints;
-  }
-});
-var _euiThemeCommon = require("@elastic/eui-theme-common");
+exports.EuiThemeBreakpoints = 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.
+ */
+
+var EuiThemeBreakpoints = exports.EuiThemeBreakpoints = ['xs', 's', 'm', 'l', 'xl'];
+
+// This type cannot be a string enum / must be a generic string
+// in case consumers add custom breakpoint sizes, such as xxl or xxs
+
+// Explicitly list out each key so we can document default values
+// via JSDoc (which is available to devs in IDE via intellisense)

package/optimize/lib/global_styling/variables/levels.js

@@ -3,10 +3,29 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "EuiThemeLevels", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon.EuiThemeLevels;
-  }
-});
-var _euiThemeCommon = require("@elastic/eui-theme-common");
+exports.EuiThemeLevels = 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.
+ */
+
+/**
+ * Z-Index
+ *
+ * Remember that z-index is relative to parent and based on the stacking context.
+ * z-indexes only compete against other z-indexes when they exist as children of
+ * that shared parent.
+ *
+ * That means a popover with a settings of 2, will still show above a modal
+ * with a setting of 100, if it is within that modal and not besides it.
+ *
+ * Generally that means it's a good idea to consider things added to this file
+ * as competitive only as siblings.
+ *
+ * https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context
+ */
+
+var EuiThemeLevels = exports.EuiThemeLevels = ['toast', 'modal', 'mask', 'navigation', 'menu', 'header', 'flyout', 'maskBelowHeader', 'content'];

package/optimize/lib/global_styling/variables/shadow.js

@@ -3,16 +3,23 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "EuiThemeShadowSizes", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon.EuiThemeShadowSizes;
-  }
-});
-Object.defineProperty(exports, "_EuiShadowSizesDescriptions", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon._EuiShadowSizesDescriptions;
-  }
-});
-var _euiThemeCommon = require("@elastic/eui-theme-common");
+exports._EuiShadowSizesDescriptions = exports.EuiThemeShadowSizes = 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.
+ */
+
+var EuiThemeShadowSizes = exports.EuiThemeShadowSizes = ['xs', 's', 'm', 'l', 'xl'];
+/**
+ * Shadow t-shirt sizes descriptions
+ */
+var _EuiShadowSizesDescriptions = exports._EuiShadowSizesDescriptions = {
+  xs: 'Very subtle shadow used on small components.',
+  s: 'Adds subtle depth, usually used in conjunction with a border.',
+  m: 'Used on small sized portalled content like popovers.',
+  l: 'Primary shadow used in most cases to add visible depth.',
+  xl: 'Very large shadows used for large portalled style containers like modals and flyouts.'
+};

package/optimize/lib/global_styling/variables/size.js

@@ -3,10 +3,13 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "EuiThemeSizes", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon.EuiThemeSizes;
-  }
-});
-var _euiThemeCommon = require("@elastic/eui-theme-common");
+exports.EuiThemeSizes = 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.
+ */
+
+var EuiThemeSizes = exports.EuiThemeSizes = ['xxs', 'xs', 's', 'm', 'base', 'l', 'xl', 'xxl', 'xxxl', 'xxxxl'];

package/optimize/lib/global_styling/variables/typography.js

@@ -3,22 +3,44 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "EuiThemeFontScales", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon.EuiThemeFontScales;
-  }
-});
-Object.defineProperty(exports, "EuiThemeFontUnits", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon.EuiThemeFontUnits;
-  }
-});
-Object.defineProperty(exports, "EuiThemeFontWeights", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon.EuiThemeFontWeights;
-  }
-});
-var _euiThemeCommon = require("@elastic/eui-theme-common");
+exports.EuiThemeFontWeights = exports.EuiThemeFontUnits = exports.EuiThemeFontScales = 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.
+ */
+
+/**
+ * Font units of measure
+ */
+
+var EuiThemeFontUnits = exports.EuiThemeFontUnits = ['rem', 'px', 'em'];
+/*
+ * Font scale
+ */
+
+var EuiThemeFontScales = exports.EuiThemeFontScales = ['xxxs', 'xxs', 'xs', 's', 'm', 'l', 'xl', 'xxl'];
+
+/*
+ * Font base settings
+ */
+
+/*
+ * Font weights
+ */
+
+var EuiThemeFontWeights = exports.EuiThemeFontWeights = ['light', 'regular', 'medium', 'semiBold', 'bold'];
+
+/**
+ * Body / Base styles
+ */
+
+/**
+ * Title styles
+ */
+
+/*
+ * Font
+ */

package/optimize/lib/services/theme/provider.js

@@ -14,7 +14,6 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _react = require("@emotion/react");
 var _react2 = _interopRequireWildcard(require("react"));
 var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
-var _themes = require("../../themes/themes");
 var _emotion = require("../emotion");
 var _css2 = require("../emotion/css");
 var _current_breakpoint = require("../breakpoint/current_breakpoint");
@@ -77,16 +76,6 @@ var EuiThemeProvider = exports.EuiThemeProvider = function EuiThemeProvider(_ref
     _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
     theme = _useState8[0],
     setTheme = _useState8[1];
-
-  // TODO: temp. testing code only, remove once obsolete
-  (0, _react2.useEffect)(function () {
-    if (process.env.NODE_ENV === 'development') {
-      var isEnabled = localStorage.getItem(_themes.EUI_EXPERIMENTAL_THEME_ENABLED_KEY) != null;
-      if (!isEnabled) {
-        localStorage.setItem(_themes.EUI_EXPERIMENTAL_THEME_ENABLED_KEY, 'true');
-      }
-    }
-  }, []);
   (0, _react2.useEffect)(function () {
     var newSystem = _system || parentSystem;
     if (prevSystemKey.current !== newSystem.key) {

package/optimize/lib/services/theme/types.js

@@ -3,16 +3,17 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "COLOR_MODES_INVERSE", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon.COLOR_MODES_INVERSE;
-  }
-});
-Object.defineProperty(exports, "COLOR_MODES_STANDARD", {
-  enumerable: true,
-  get: function get() {
-    return _euiThemeCommon.COLOR_MODES_STANDARD;
-  }
-});
-var _euiThemeCommon = require("@elastic/eui-theme-common");
+exports.COLOR_MODES_STANDARD = exports.COLOR_MODES_INVERSE = 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.
+ */
+
+var COLOR_MODES_STANDARD = exports.COLOR_MODES_STANDARD = {
+  light: 'LIGHT',
+  dark: 'DARK'
+};
+var COLOR_MODES_INVERSE = exports.COLOR_MODES_INVERSE = 'INVERSE';