@elastic/eui 67.1.4 → 67.1.6

package/test-env/components/loading/loading_spinner.js

@@ -9,6 +9,8 @@ exports.SIZES = exports.EuiLoadingSpinner = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 
 var _react = _interopRequireDefault(require("react"));
@@ -25,7 +27,12 @@ var _loading_spinner = require("./loading_spinner.styles");
 
 var _react2 = require("@emotion/react");
 
-var _excluded = ["size", "className", "aria-label", "color"];
+var _excluded = ["size", "className", "aria-label", "color", "style"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
 var SIZES = ['s', 'm', 'l', 'xl', 'xxl'];
 exports.SIZES = SIZES;
 
@@ -35,15 +42,20 @@ var EuiLoadingSpinner = function EuiLoadingSpinner(_ref) {
       className = _ref.className,
       ariaLabel = _ref['aria-label'],
       color = _ref.color,
+      style = _ref.style,
       rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var euiTheme = (0, _services.useEuiTheme)();
-  var styles = (0, _loading_spinner.euiLoadingSpinnerStyles)(euiTheme, color);
+  var styles = (0, _loading_spinner.euiLoadingSpinnerStyles)(euiTheme);
   var cssStyles = [styles.euiLoadingSpinner, styles[size]];
   var classes = (0, _classnames.default)('euiLoadingSpinner', className);
   var defaultLabel = (0, _loading_strings.useLoadingAriaLabel)();
+  var customColorStyle = color ? _objectSpread(_objectSpread({}, style), {}, {
+    borderColor: (0, _loading_spinner.euiSpinnerBorderColorsCSS)(euiTheme, color)
+  }) : style;
   return (0, _react2.jsx)("span", (0, _extends2.default)({
     className: classes,
     css: cssStyles,
+    style: customColorStyle,
     role: "progressbar",
     "aria-label": ariaLabel || defaultLabel
   }, rest));

package/test-env/components/loading/loading_spinner.styles.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.euiLoadingSpinnerStyles = void 0;
+exports.euiSpinnerBorderColorsCSS = exports.euiLoadingSpinnerStyles = void 0;
 
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
@@ -25,14 +25,22 @@ var spinnerSizes = {
   xxl: 'xxl'
 };
 
-var spinnerColorsCSS = function spinnerColorsCSS(border, highlight) {
-  return "\n    border-color: ".concat(highlight, " ").concat(border, " ").concat(border, " ").concat(border, ";\n  ");
+var euiSpinnerBorderColorsCSS = function euiSpinnerBorderColorsCSS(_ref) {
+  var euiTheme = _ref.euiTheme;
+  var colors = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  var _colors$border = colors.border,
+      border = _colors$border === void 0 ? euiTheme.colors.lightShade : _colors$border,
+      _colors$highlight = colors.highlight,
+      highlight = _colors$highlight === void 0 ? euiTheme.colors.primary : _colors$highlight;
+  return "".concat(highlight, " ").concat(border, " ").concat(border, " ").concat(border);
 };
 
-var euiLoadingSpinnerStyles = function euiLoadingSpinnerStyles(_ref, color) {
-  var euiTheme = _ref.euiTheme;
+exports.euiSpinnerBorderColorsCSS = euiSpinnerBorderColorsCSS;
+
+var euiLoadingSpinnerStyles = function euiLoadingSpinnerStyles(euiThemeContext) {
+  var euiTheme = euiThemeContext.euiTheme;
   return {
-    euiLoadingSpinner: /*#__PURE__*/(0, _react.css)("flex-shrink:0;display:inline-block;border-radius:50%;border:", euiTheme.border.thick, ";", spinnerColorsCSS((color === null || color === void 0 ? void 0 : color.border) || euiTheme.colors.lightShade, (color === null || color === void 0 ? void 0 : color.highlight) || euiTheme.colors.primary), ";", _global_styling.euiCanAnimate, "{animation:", _loadingSpinner, " 0.6s infinite linear;};label:euiLoadingSpinner;"),
+    euiLoadingSpinner: /*#__PURE__*/(0, _react.css)("flex-shrink:0;display:inline-block;border-radius:50%;border:", euiTheme.border.thick, ";border-color:", euiSpinnerBorderColorsCSS(euiThemeContext), ";", _global_styling.euiCanAnimate, "{animation:", _loadingSpinner, " 0.6s infinite linear;};label:euiLoadingSpinner;"),
     // Sizes
     s: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalSizeCSS)(euiTheme.size[spinnerSizes.s], euiTheme.size[spinnerSizes.s]), " border-width:calc(", euiTheme.border.width.thin, " * 1.5);;label:s;"),
     m: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalSizeCSS)(euiTheme.size[spinnerSizes.m], euiTheme.size[spinnerSizes.m]), " border-width:calc(", euiTheme.border.width.thin, " * 1.5);;label:m;"),