"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.rainbow = exports.disabledRainbow = exports.SteppedRainbowIconDecoration = void 0;
var _react = require("@emotion/react");
/**
 * @jsxRuntime classic
 * @jsx jsx
 */
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic

var createSteppedRainbow = function createSteppedRainbow(colors) {
  return "\n    linear-gradient(\n      to right,\n      ".concat(colors.map(function (color, i) {
    var inc = 100 / colors.length;
    var pos = i + 1;
    if (i === 0) {
      return "".concat(color, " ").concat(pos * inc, "%,");
    }
    if (i === colors.length - 1) {
      return "".concat(color, " ").concat((pos - 1) * inc, "%");
    }
    return "\n            ".concat(color, " ").concat((pos - 1) * inc, "%,\n            ").concat(color, " ").concat(pos * inc, "%,\n          ");
  }).join('\n'), "\n    )");
};
var rainbow = exports.rainbow = createSteppedRainbow(["var(--ds-background-accent-purple-bolder, #964AC0)", "var(--ds-background-accent-teal-subtle, #6CC3E0)", "var(--ds-background-accent-orange-subtle, #FCA700)", "var(--ds-background-accent-red-bolder, #C9372C)"]);
var disabledRainbow = exports.disabledRainbow = createSteppedRainbow(["var(--ds-background-accent-gray-subtle, #8C8F97)", "var(--ds-background-accent-gray-subtle-hovered, #B7B9BE)", "var(--ds-background-accent-gray-subtle-pressed, #DDDEE1)", "var(--ds-background-accent-gray-subtle-hovered, #B7B9BE)"]);
var barStyles = (0, _react.css)({
  position: 'absolute',
  left: 0,
  right: 0,
  top: "var(--ds-space-200, 16px)",
  margin: 'auto',
  width: '12px',
  height: '3px',
  borderRadius: "var(--ds-radius-small, 3px)"
});
var textColorIconWrapper = (0, _react.css)({
  position: 'relative'
});
var getBackground = function getBackground(selectedColor, disabled) {
  if (selectedColor) {
    return selectedColor;
  }
  if (disabled) {
    return disabledRainbow;
  }
  return rainbow;
};
var SteppedRainbowIconDecoration = exports.SteppedRainbowIconDecoration = function SteppedRainbowIconDecoration(_ref) {
  var selectedColor = _ref.selectedColor,
    disabled = _ref.disabled,
    icon = _ref.icon;
  return (0, _react.jsx)("div", {
    css: textColorIconWrapper
  }, icon, (0, _react.jsx)("div", {
    "data-testid": "toolbar-icon-stepped-rainbow",
    style: {
      background: getBackground(selectedColor, disabled)
    },
    css: barStyles
  }));
};