@elastic/eui 99.4.0 → 100.0.0

package/lib/global_styling/mixins/_shadow.js

@@ -0,0 +1,84 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "euiShadow", {
+  enumerable: true,
+  get: function get() {
+    return _euiThemeCommon.euiShadow;
+  }
+});
+Object.defineProperty(exports, "euiShadowFlat", {
+  enumerable: true,
+  get: function get() {
+    return _euiThemeCommon.euiShadowFlat;
+  }
+});
+Object.defineProperty(exports, "euiShadowLarge", {
+  enumerable: true,
+  get: function get() {
+    return _euiThemeCommon.euiShadowLarge;
+  }
+});
+Object.defineProperty(exports, "euiShadowMedium", {
+  enumerable: true,
+  get: function get() {
+    return _euiThemeCommon.euiShadowMedium;
+  }
+});
+Object.defineProperty(exports, "euiShadowSmall", {
+  enumerable: true,
+  get: function get() {
+    return _euiThemeCommon.euiShadowSmall;
+  }
+});
+Object.defineProperty(exports, "euiShadowXLarge", {
+  enumerable: true,
+  get: function get() {
+    return _euiThemeCommon.euiShadowXLarge;
+  }
+});
+Object.defineProperty(exports, "euiShadowXSmall", {
+  enumerable: true,
+  get: function get() {
+    return _euiThemeCommon.euiShadowXSmall;
+  }
+});
+Object.defineProperty(exports, "euiSlightShadowHover", {
+  enumerable: true,
+  get: function get() {
+    return _euiThemeCommon.euiSlightShadowHover;
+  }
+});
+exports.useEuiSlightShadowHover = exports.useEuiShadowFlat = exports.useEuiShadow = void 0;
+var _euiThemeCommon = require("@elastic/eui-theme-common");
+var _theme = require("../../services/theme");
+/*
+ * 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 useEuiSlightShadowHover = exports.useEuiSlightShadowHover = function useEuiSlightShadowHover(color) {
+  var euiThemeContext = (0, _theme.useEuiTheme)();
+  return (0, _euiThemeCommon.euiSlightShadowHover)(euiThemeContext, {
+    color: color
+  });
+};
+var useEuiShadowFlat = exports.useEuiShadowFlat = function useEuiShadowFlat(color) {
+  var euiThemeContext = (0, _theme.useEuiTheme)();
+  return (0, _euiThemeCommon.euiShadowFlat)(euiThemeContext, {
+    color: color
+  });
+};
+var useEuiShadow = exports.useEuiShadow = function useEuiShadow() {
+  var size = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'l';
+  var color = arguments.length > 1 ? arguments[1] : undefined;
+  var euiThemeContext = (0, _theme.useEuiTheme)();
+  return (0, _euiThemeCommon.euiShadow)(euiThemeContext, size, {
+    color: color
+  });
+};

package/lib/global_styling/mixins/index.js

@@ -68,4 +68,26 @@ Object.keys(_responsive).forEach(function (key) {
       return _responsive[key];
     }
   });
+});
+var _button = require("./_button");
+Object.keys(_button).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _button[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _button[key];
+    }
+  });
+});
+var _shadow = require("./_shadow");
+Object.keys(_shadow).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _shadow[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _shadow[key];
+    }
+  });
 });

package/lib/global_styling/reset/global_styles.js

@@ -39,7 +39,7 @@ var EuiGlobalStyles = exports.EuiGlobalStyles = function EuiGlobalStyles(_ref) {
    * so that it knows to use custom styles. Therefore, we just reuse the same scrollbar mixin with thick size.
    */
   var scrollbarStyles = (0, _mixins.euiScrollBarStyles)(euiThemeContext, {
-    trackColor: colorMode === 'LIGHT' ? (0, _color.shade)(colors.body, 0.03) : (0, _color.tint)(colors.body, 0.07),
+    trackColor: euiTheme.components.scrollbarTrackColor,
     width: 'auto'
   });
 
@@ -60,7 +60,7 @@ var EuiGlobalStyles = exports.EuiGlobalStyles = function EuiGlobalStyles(_ref) {
    */
   var styles = /*#__PURE__*/(0, _react2.css)(_reset.resetStyles, " html{", scrollbarStyles, " ", fontReset, " text-size-adjust:100%;font-kerning:normal;", (0, _functions.logicalCSS)('height', '100%'), " background-color:", colors.body, ";color:", colors.text, ";}code,pre,kbd,samp{font-family:", font.familyCode, ";}input,textarea,select{", _objectSpread(_objectSpread({}, fontReset), {}, {
     fontSize: '1rem' // Inherit from html root
-  }), ";}select:disabled{opacity:1;}button{font-family:", font.family, ";}em{font-style:italic;}strong{font-weight:", font.weight.bold, ";}*:focus{", (0, _mixins.euiFocusRing)(euiThemeContext), ";}::selection{background:", (0, _color.transparentize)(colors.primary, colorMode === 'LIGHT' ? 0.1 : 0.2), ";}a{color:", colors.primaryText, ";&,&:hover,&:focus{text-decoration:none;}}.euiBody-hasPortalContent{position:relative;};label:styles;");
+  }), ";}select:disabled{opacity:1;}button{font-family:", font.family, ";}em{font-style:italic;}strong{font-weight:", font.weight.bold, ";}*:focus{", (0, _mixins.euiFocusRing)(euiThemeContext), ";}::selection{background:", (0, _color.transparentize)(colors.primary, colorMode === 'LIGHT' ? 0.1 : 0.2), ";}a{color:", colors.textPrimary, ";&,&:hover,&:focus{text-decoration:none;}}.euiBody-hasPortalContent{position:relative;};label:styles;");
   return (0, _react2.jsx)(_react2.Global, {
     styles: styles
   });

package/lib/global_styling/variables/animations.js

@@ -3,34 +3,28 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-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'];
+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");

package/lib/global_styling/variables/breakpoint.js

@@ -3,19 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-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)
+Object.defineProperty(exports, "EuiThemeBreakpoints", {
+  enumerable: true,
+  get: function get() {
+    return _euiThemeCommon.EuiThemeBreakpoints;
+  }
+});
+var _euiThemeCommon = require("@elastic/eui-theme-common");

package/lib/global_styling/variables/levels.js

@@ -3,29 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-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'];
+Object.defineProperty(exports, "EuiThemeLevels", {
+  enumerable: true,
+  get: function get() {
+    return _euiThemeCommon.EuiThemeLevels;
+  }
+});
+var _euiThemeCommon = require("@elastic/eui-theme-common");

package/lib/global_styling/variables/shadow.js

@@ -3,23 +3,16 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-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.'
-};
+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");

package/lib/global_styling/variables/size.js

@@ -3,13 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-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'];
+Object.defineProperty(exports, "EuiThemeSizes", {
+  enumerable: true,
+  get: function get() {
+    return _euiThemeCommon.EuiThemeSizes;
+  }
+});
+var _euiThemeCommon = require("@elastic/eui-theme-common");

package/lib/global_styling/variables/typography.js

@@ -3,44 +3,22 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-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
- */
+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");