@blockstack/ui/dist/color-modes/utils.esm.js

Blockstack UI components built using React and styled-components with styled-system.

import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
import { Color } from './types.esm.js';
import { themeGet } from '@styled-system/theme-get';

var colorGet = function colorGet(path, fallback) {
  return themeGet('colors.' + path, fallback);
};

var colors = function colors(props) {
  var _light, _dark;

  return {
    light: (_light = {}, _light[Color.Accent] = colorGet('blue')(props), _light[Color.Bg] = 'white', _light[Color.BgAlt] = colorGet('ink.50')(props), _light[Color.BgLight] = 'white', _light[Color.Invert] = colorGet('ink')(props), _light[Color.TextHover] = colorGet('blue')(props), _light[Color.TextTitle] = colorGet('ink')(props), _light[Color.TextCaption] = colorGet('ink.600')(props), _light[Color.TextBody] = colorGet('ink.900')(props), _light[Color.InputPlaceholder] = colorGet('ink.400')(props), _light[Color.Border] = 'rgb(229, 229, 236)', _light[Color.FeedbackAlert] = colorGet('orange')(props), _light[Color.FeedbackError] = colorGet('red')(props), _light[Color.FeedbackSuccess] = colorGet('green')(props), _light),
    dark: (_dark = {}, _dark[Color.Accent] = colorGet('blue.400')(props), _dark[Color.Bg] = colorGet('ink')(props), _dark[Color.BgAlt] = 'rgba(255,255,255,0.05)', _dark[Color.BgLight] = 'rgba(255,255,255,0.08)', _dark[Color.Invert] = 'white', _dark[Color.TextHover] = colorGet('blue.300')(props), _dark[Color.TextTitle] = 'white', _dark[Color.TextCaption] = '#a7a7ad', _dark[Color.TextBody] = colorGet('ink.300')(props), _dark[Color.InputPlaceholder] = 'rgba(255,255,255,0.3)', _dark[Color.Border] = 'rgb(39, 41, 46)', _dark[Color.FeedbackAlert] = colorGet('orange')(props), _dark[Color.FeedbackError] = colorGet('red')(props), _dark[Color.FeedbackSuccess] = colorGet('green')(props), _dark)
  };
};

var colorModeStyles = function colorModeStyles(props) {
  return colors(props)[props.colorMode];
};

var colorMap = function colorMap(props) {
  return Object.keys(colors(props)[props.colorMode]);
};

var color = function color(name) {
  return "var(--colors-" + name + ")";
};
var themeColor = function themeColor(name) {
  return name;
};
var generateCssVariables = function generateCssVariables(mode) {
  return function (_ref) {
    var _ref$colorMode = _ref.colorMode,
        colorMode = _ref$colorMode === void 0 ? mode : _ref$colorMode,
        rest = _objectWithoutPropertiesLoose(_ref, ["colorMode"]);

    return colorMap(_objectSpread2({
      colorMode: colorMode
    }, rest)).map(function (key) {
      return "--colors-" + key + ": " + colorModeStyles(_objectSpread2({
        colorMode: colorMode
      }, rest))[key] + ";";
    });
  };
};

export { color, colorGet, generateCssVariables, themeColor };
//# sourceMappingURL=utils.esm.js.map