@blockstack/ui/dist/theme/colors-utils.esm.js

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

import { css } from 'styled-components';
import Color from 'color';

var get = function get(color, hue) {
  return color + "." + hue;
};
var addOpacity = function addOpacity(color, opacity) {
  return Color(color).fade(1 - opacity).rgb().string();
};
var addWhite = function addWhite(color, opacity) {
  return Color(color).mix(Color('#fff'), opacity).hex();
};
var addBlack = function addBlack(color, opacity) {
  return Color(color).mix(Color('#000'), opacity).hex();
};
var isDarkColor = function isDarkColor(color) {
  return Color(color).isDark();
};
var generateAlphaColors = function generateAlphaColors(color) {
  return {
    900: addOpacity(color, 0.92),
    800: addOpacity(color, 0.8),
    700: addOpacity(color, 0.6),
    600: addOpacity(color, 0.48),
    500: addOpacity(color, 0.38),
    400: addOpacity(color, 0.24),
    300: addOpacity(color, 0.16),
    200: addOpacity(color, 0.12),
    100: addOpacity(color, 0.08),
    50: addOpacity(color, 0.04)
  };
};
var colorEmphasis = function colorEmphasis(color, emphasis) {
  switch (emphasis) {
    case 'high':
      return color;

    case 'medium':
      return generateAlphaColors(color)[700];

    case 'low':
      return generateAlphaColors(color)[500];

    case 'lowest':
      return generateAlphaColors(color)[300];

    default:
      return undefined;
  }
};
var generateStripe = function generateStripe(_ref) {
  var _ref$size = _ref.size,
      size = _ref$size === void 0 ? '1rem' : _ref$size,
      _ref$color = _ref.color,
      color = _ref$color === void 0 ? 'rgba(255, 255, 255, 0.15)' : _ref$color;
  return css(["background-image:linear-gradient( 45deg,", " 25%,transparent 25%,transparent 50%,", " 50%,", " 75%,transparent 75%,transparent );background-size:", " ", ";"], color, color, color, size, size);
};

export { addBlack, addOpacity, addWhite, colorEmphasis, generateAlphaColors, generateStripe, get, isDarkColor };
//# sourceMappingURL=colors-utils.esm.js.map