@blend-ui/core/dist/esm/theme/theme.js

Blend core cmponents

"use strict";

function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

Object.defineProperty(exports, "__esModule", {
  value: true
});
Object.defineProperty(exports, "colors", {
  enumerable: true,
  get: function get() {
    return _colors["default"];
  }
});
exports["default"] = exports.duration = exports.textShadows = exports.boxShadows = exports.componentStyles = exports.borders = exports.borderWidths = exports.radius = exports.opacity = exports.radii = exports.colorStyles = exports.textStyles = exports.fontSizes = exports.fonts = exports.space = exports.mediaQueries = exports.breakpoints = void 0;

var _sizes = _interopRequireWildcard(require("./sizes"));

var _typography = _interopRequireDefault(require("./typography"));

var _colors = _interopRequireDefault(require("./colors"));

var _createTextStyles = _interopRequireDefault(require("./createTextStyles"));

var _createColorStyles = _interopRequireDefault(require("./createColorStyles"));

var _createComponentStyles = _interopRequireDefault(require("./createComponentStyles"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

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) { _defineProperty(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; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

//import { borderWidth } from "styled-system";
//console.log("SIZES ", Object.keys(sizes));
var createMediaQuery = function createMediaQuery(n) {
  return "@media screen and (min-width:".concat(n, ")");
};

var addAliases = function addAliases(arr, aliases) {
  return aliases.forEach(function (key, i) {
    return Object.defineProperty(arr, key, {
      enumerable: false,
      get: function get() {
        return this[i];
      }
    });
  });
};

var breakpoints = [32, 40, 48, 64, 80].map(function (n) {
  return n + "em";
});
exports.breakpoints = breakpoints;
var mediaQueries = breakpoints.map(createMediaQuery);
exports.mediaQueries = mediaQueries;
var aliases = ["sm", "md", "lg", "xl", "xxl"];
addAliases(mediaQueries, aliases);
var space = _sizes.baseSizes; //export const space = [0, 4, 8, 16, 32, 64, 128];
//export const font = `'Helvetica Neue',Helvetica,Arial,sans-serif,'Montserrat'`;

exports.space = space;
var fonts = _typography["default"].fonts;
exports.fonts = fonts;

var fontSizes = _objectSpread(_objectSpread({}, _sizes.baseSizes), _typography["default"].fontSizes);

exports.fontSizes = fontSizes;
var zIndices = {
  hide: -1,
  auto: "auto",
  base: 0,
  docked: 10,
  dropdown: 1000,
  sticky: 1100,
  banner: 1200,
  overlay: 1300,
  modal: 1400,
  popover: 1500,
  skipLink: 1600,
  toast: 1700,
  tooltip: 1800
};
var textStyles = (0, _createTextStyles["default"])({
  fontSizes: fontSizes,
  fontWeights: _objectSpread({}, _typography["default"].fontWeights),
  lineHeights: _objectSpread({}, _typography["default"].lineHeights),
  letterSpacings: _objectSpread({}, _typography["default"].letterSpacings),
  colors: _colors["default"]
});
exports.textStyles = textStyles;
var colorStyles = (0, _createColorStyles["default"])({
  colors: _colors["default"]
}); // styled-system's `borderRadius` function can hook into the `radii` object/array

exports.colorStyles = colorStyles;
var radii = {
  none: "0",
  sm: "0.125rem",
  md: "0.25rem",
  lg: "0.5rem",
  full: "9999px",
  avatar: "4%",
  input: "0.25rem"
};
exports.radii = radii;
var opacity = {
  "0": "0",
  "20%": "0.2",
  "40%": "0.4",
  "60%": "0.6",
  "80%": "0.8",
  "100%": "1"
};
exports.opacity = opacity;
var radius = radii["md"]; // borders

exports.radius = radius;

var borderWidths = _objectSpread({}, _sizes["default"].borderWidths);

exports.borderWidths = borderWidths;
var borders = {
  input: {
    base: "".concat(borderWidths["2xs"], " solid ").concat(_colors["default"].borders.input),
    borderRadius: radii["input"]
  },
  select: {
    base: "".concat(borderWidths["2xs"], " solid ").concat(_colors["default"].borders.input),
    borderRadius: radii["input"]
  }
};
exports.borders = borders;
var componentStyles = (0, _createComponentStyles["default"])({
  fontSizes: fontSizes,
  sizes: _sizes["default"],
  borders: borders,
  colors: _colors["default"]
}); // boxShadows

exports.componentStyles = componentStyles;
var boxShadows = ["0 0 2px 0 rgba(0,0,0,.08),0 1px 4px 0 rgba(0,0,0,.16)", "0 0 2px 0 rgba(0,0,0,.08),0 2px 8px 0 rgba(0,0,0,.16)", "0 0 2px 0 rgba(0,0,0,.08),0 4px 16px 0 rgba(0,0,0,.16)", "0 0 2px 0 rgba(0,0,0,.08),0 8px 32px 0 rgba(0,0,0,.16)"];
exports.boxShadows = boxShadows;
var textShadows = {
  sm: "0 1px 2px rgba(0,0,0,0.5)",
  md: "0 2px 4px rgba(0,0,0,0.5)"
}; // animation duration

exports.textShadows = textShadows;
var duration = {
  fast: "150ms",
  normal: "300ms",
  slow: "450ms",
  slowest: "600ms"
}; // animation easing curves

exports.duration = duration;
var easeInOut = "cubic-bezier(0.5, 0, 0.25, 1)";
var easeOut = "cubic-bezier(0, 0, 0.25, 1)";
var easeIn = "cubic-bezier(0.5, 0, 1, 1)";
var timingFunctions = {
  easeInOut: easeInOut,
  easeOut: easeOut,
  easeIn: easeIn
}; // animation delay

var transitionDelays = {
  small: "60ms",
  medium: "160ms",
  large: "260ms",
  xLarge: "360ms"
};
var theme = {
  breakpoints: breakpoints,
  mediaQueries: mediaQueries,
  zIndices: zIndices,
  //sizes,
  space: space,
  fontSizes: fontSizes,
  fonts: fonts,
  fontWeights: _objectSpread({}, _typography["default"].fontWeights),
  lineHeights: _objectSpread({}, _typography["default"].lineHeights),
  letterSpacings: _objectSpread({}, _typography["default"].letterSpacings),
  colors: _colors["default"],
  textStyles: textStyles,
  colorStyles: colorStyles,
  componentStyles: componentStyles,
  radii: radii,
  radius: radius,
  borderWidths: borderWidths,
  borders: borders,
  boxShadows: boxShadows,
  textShadows: textShadows,
  duration: duration,
  timingFunctions: timingFunctions,
  transitionDelays: transitionDelays
};
var _default = theme;
exports["default"] = _default;