'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

var styled = _interopDefault(require('styled-components'));

var DsBox = /*#__PURE__*/styled.div({
  boxSizing: 'border-box',
  minWidth: 0
});

function _taggedTemplateLiteralLoose(strings, raw) {
  if (!raw) {
    raw = strings.slice(0);
  }

  strings.raw = raw;
  return strings;
}

var theme = {
  borders: {
    radiusSmall: 'var(--ds-border-radius-s)',
    radiusMedium: 'var(--ds-border-radius-m)',
    radiusLarge: 'var(--ds-border-radius-l)'
  },
  dropShadow: {
    shadow0: 'var(--ds-shadow-0)',
    shadow20: 'var(--ds-shadow-20)',
    shadow40: 'var(--ds-shadow-40)',
    shadow60: 'var(--ds-shadow-60)',
    shadow80: 'var(--ds-shadow-80)',
    shadow100: 'var(--ds-shadow-100)'
  },
  spacing: {
    space1: 'var(--ds-space-1)',
    space2: 'var(--ds-space-2)',
    space3: 'var(--ds-space-3)',
    space4: 'var(--ds-space-4)',
    space5: 'var(--ds-space-5)',
    space6: 'var(--ds-space-6)',
    space7: 'var(--ds-space-7)',
    space8: 'var(--ds-space-8)',
    space9: 'var(--ds-space-9)',
    space10: 'var(--ds-space-10)',
    space11: 'var(--ds-space-11)',
    space12: 'var(--ds-space-12)'
  },
  typography: {
    scale_xs: 'var(--ds-typography-scale-xs)',
    scale_s: 'var(--ds-typography-scale-s)',
    scale_m: 'var(--ds-typography-scale-m)',
    scale_l: 'var(--ds-typography-scale-l)',
    scale_xl: 'var(--ds-typography-scale-xl)',
    scale_2xl: 'var(--ds-typography-scale-2xl)',
    scale_3xl: 'var(--ds-typography-scale-3xl)',
    scale_4xl: 'var(--ds-typography-scale-4xl)',
    scale_5xl: 'var(--ds-typography-scale-5xl)'
  },
  colors: {
    brand: {
      primaryMain: 'var(--ds-color-brand-primary-main)',
      primaryLight: 'var(--ds-color-brand-primary-light)',
      primaryDark: 'var(--ds-color-brand-primary-dark)',
      primaryDarker: 'var(--ds-color-brand-primary-darker)',
      secondaryMain: 'var(--ds-color-brand-secondary-main)',
      secondaryLight: 'var(--ds-color-brand-secondary-light)',
      secondaryDark: 'var(--ds-color-brand-secondary-dark)',
      secondaryDarker: 'var(--ds-color-brand-secondary-darker)'
    },
    ui: {
      primary: 'var(--ds-color-ui-primary)',
      secondary: 'var(--ds-color-ui-secondary)',
      tertiary: 'var(--ds-color-ui-tertiary)',
      quaternary: 'var(--ds-color-ui-quaternary)',
      disabled: 'var(--ds-color-ui-disabled)',
      errorDefault: 'var(--ds-color-ui-error-default)',
      errorLight: 'var(--ds-color-ui-error-light)',
      errorDark: 'var(--ds-color-ui-error-dark)',
      successDefault: 'var(--ds-color-ui-success-default)',
      successLight: 'var(--ds-color-ui-success-light)',
      successDark: 'var(--ds-color-ui-success-dark)',
      alertDefault: 'var(--ds-color-ui-alert-default)',
      alertLight: 'var(--ds-color-ui-alert-light)',
      alertDark: 'var(--ds-color-ui-alert-dark)',
      background1: 'var(--ds-color-ui-background-1)',
      background2: 'var(--ds-color-ui-background-2)'
    },
    text: {
      primary: 'var(--ds-color-text-primary)',
      secondary: 'var(--ds-color-text-secondary)',
      disabled: 'var(--ds-color-text-disabled)',
      inverse: 'var(--ds-color-text-inverse)',
      error: 'var(--ds-color-text-error)',
      success: 'var(--ds-color-text-success)',
      link: 'var(--ds-color-text-link)'
    }
  }
};

var _templateObject;
var COLOR = {
  primary: theme.colors.text.inverse,
  secondary: theme.colors.ui.primary
};
var BG_COLOR = {
  primary: theme.colors.ui.primary,
  secondary: theme.colors.text.inverse
};
var DsButton = /*#__PURE__*/styled.button(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-style: none;\n  position: relative;\n  cursor: pointer;\n  display: flex;\n  vertical-align: middle;\n  padding-top: ", ";\n  padding-bottom: ", ";\n  padding-left: ", ";\n  padding-right: ", ";\n  border-radius: ", ";\n  background-color: ", ";\n  color: ", ";\n  :hover {\n    color: ", ";\n    background-color: ", ";\n  }\n  :active,\n  :focus {\n    color: ", ";\n    background-color: ", ";\n  }\n  :disabled {\n    background-color: ", ";\n    color: ", ";\n  }\n"])), theme.spacing.space2, theme.spacing.space2, theme.spacing.space7, theme.spacing.space7, theme.borders.radiusMedium, function (props) {
  return BG_COLOR[props.variant];
}, function (props) {
  return COLOR[props.variant];
}, theme.colors.text.inverse, theme.colors.brand.primaryMain, theme.colors.text.inverse, theme.colors.brand.primaryDark, theme.colors.ui.disabled, theme.colors.text.inverse);

var _templateObject$1;
var COLOR_TYPE;

(function (COLOR_TYPE) {
  COLOR_TYPE[COLOR_TYPE["color"] = 0] = "color";
  COLOR_TYPE[COLOR_TYPE["background_color"] = 1] = "background_color";
  COLOR_TYPE[COLOR_TYPE["border_color"] = 2] = "border_color";
})(COLOR_TYPE || (COLOR_TYPE = {}));
var COLORS = {};
COLORS[COLOR_TYPE.color] = {
  primary_solid: 'var(--ds-color-text-inverse)',
  secondary_solid: 'var(--ds-color-text-inverse)',
  error_solid: 'var(--ds-color-text-inverse)',
  success_solid: 'var(--ds-color-text-inverse)',
  alert_solid: 'var(--ds-color-text-inverse)',
  primary_outline: 'var(--ds-color-ui-primary)',
  secondary_outline: 'var(--ds-color-brand-primary-main)',
  error_outline: 'var(--ds-color-ui-error-default)',
  success_outline: 'var(--ds-color-ui-success-default)',
  alert_outline: 'var(--ds-color-ui-alert-default)'
};
COLORS[COLOR_TYPE.background_color] = {
  primary_solid: 'var(--ds-color-ui-primary)',
  secondary_solid: 'var(--ds-color-brand-primary-main)',
  error_solid: 'var(--ds-color-ui-error-default)',
  success_solid: 'var(--ds-color-ui-success-default)',
  alert_solid: 'var(--ds-color-ui-alert-default)',
  primary_outline: 'none',
  secondary_outline: 'none',
  error_outline: 'none',
  success_outline: 'none',
  alert_outline: 'none'
};
COLORS[COLOR_TYPE.border_color] = {
  primary_solid: 'none',
  secondary_solid: 'none',
  error_solid: 'none',
  success_solid: 'none',
  alert_solid: 'none',
  primary_outline: 'var(--ds-color-ui-primary)',
  secondary_outline: 'var(--ds-color-brand-primary-main)',
  error_outline: 'var(--ds-color-ui-error-default)',
  success_outline: 'var(--ds-color-ui-success-default)',
  alert_outline: 'var(--ds-color-ui-alert-default)'
};

var getColor = function getColor(props, colorType) {
  if (colorType === void 0) {
    colorType = COLOR_TYPE.background_color;
  }

  var type = props.type || 'primary';
  var variant = props.variant || 'solid';
  return COLORS[colorType][type + "_" + variant];
};

var DsTag = /*#__PURE__*/styled.div(_templateObject$1 || (_templateObject$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: fit-content;\n  display: inline-block;\n  padding: 0 var(--ds-space-2);\n  white-space: nowrap;\n  border-radius: var(--ds-border-radius-m);\n  border-style: solid;\n  border-width: 1px;\n  font-size: 11px;\n  border-color: transparent;\n  background-color: ", ";\n  border-color: ", ";\n  color: ", ";\n"])), function (props) {
  return getColor(props, COLOR_TYPE.background_color);
}, function (props) {
  return getColor(props, COLOR_TYPE.border_color);
}, function (props) {
  return getColor(props, COLOR_TYPE.color);
});

function changeTheme(tokens) {
  Object.keys(tokens).forEach(function (token) {
    document.documentElement.style.setProperty(token, tokens[token]);
  });
}

exports.DsBox = DsBox;
exports.DsButton = DsButton;
exports.DsTag = DsTag;
exports.changeTheme = changeTheme;
//# sourceMappingURL=radius-pumpernickel.cjs.development.js.map
