@flodesk/grain 2.20.0 → 2.20.3

package/es/utilities/index.js

@@ -1,145 +1,21 @@
-"use strict";
-
-require("core-js/modules/es.object.define-property.js");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "getDimension", {
-  enumerable: true,
-  get: function get() {
-    return _responsive.getDimension;
-  }
-});
-Object.defineProperty(exports, "getResponsiveDimension", {
-  enumerable: true,
-  get: function get() {
-    return _responsive.getResponsiveDimension;
-  }
-});
-Object.defineProperty(exports, "breakpoints", {
-  enumerable: true,
-  get: function get() {
-    return _responsive.breakpoints;
-  }
-});
-Object.defineProperty(exports, "getTextSize", {
-  enumerable: true,
-  get: function get() {
-    return _responsive.getTextSize;
-  }
-});
-Object.defineProperty(exports, "getResponsiveTextSize", {
-  enumerable: true,
-  get: function get() {
-    return _responsive.getResponsiveTextSize;
-  }
-});
-Object.defineProperty(exports, "getResponsiveSpace", {
-  enumerable: true,
-  get: function get() {
-    return _responsive.getResponsiveSpace;
-  }
-});
-Object.defineProperty(exports, "getColor", {
-  enumerable: true,
-  get: function get() {
-    return _styles.getColor;
-  }
-});
-Object.defineProperty(exports, "getShadow", {
-  enumerable: true,
-  get: function get() {
-    return _styles.getShadow;
-  }
-});
-Object.defineProperty(exports, "getWeight", {
-  enumerable: true,
-  get: function get() {
-    return _styles.getWeight;
-  }
-});
-Object.defineProperty(exports, "getRadius", {
-  enumerable: true,
-  get: function get() {
-    return _styles.getRadius;
-  }
-});
-Object.defineProperty(exports, "getTransition", {
-  enumerable: true,
-  get: function get() {
-    return _styles.getTransition;
-  }
-});
-Object.defineProperty(exports, "getIconSize", {
-  enumerable: true,
-  get: function get() {
-    return _styles.getIconSize;
-  }
-});
-Object.defineProperty(exports, "getGridColumns", {
-  enumerable: true,
-  get: function get() {
-    return _styles.getGridColumns;
-  }
-});
-Object.defineProperty(exports, "getBorder", {
-  enumerable: true,
-  get: function get() {
-    return _styles.getBorder;
-  }
-});
-Object.defineProperty(exports, "isBrowser", {
-  enumerable: true,
-  get: function get() {
-    return _helpers.isBrowser;
-  }
-});
-Object.defineProperty(exports, "getCssVarCore", {
-  enumerable: true,
-  get: function get() {
-    return _helpers.getCssVarCore;
-  }
-});
-Object.defineProperty(exports, "getCssVar", {
-  enumerable: true,
-  get: function get() {
-    return _helpers.getCssVar;
-  }
-});
-Object.defineProperty(exports, "u", {
-  enumerable: true,
-  get: function get() {
-    return _helpers.u;
-  }
-});
-Object.defineProperty(exports, "isNumber", {
-  enumerable: true,
-  get: function get() {
-    return _helpers.isNumber;
-  }
-});
-Object.defineProperty(exports, "isString", {
-  enumerable: true,
-  get: function get() {
-    return _helpers.isString;
-  }
-});
-Object.defineProperty(exports, "isArray", {
-  enumerable: true,
-  get: function get() {
-    return _helpers.isArray;
-  }
-});
-Object.defineProperty(exports, "isObject", {
-  enumerable: true,
-  get: function get() {
-    return _helpers.isObject;
-  }
-});
-
-var _responsive = require("./responsive");
-
-var _styles = require("./styles");
-
-var _helpers = require("./helpers");
+export { getDimension } from "./responsive";
+export { getResponsiveDimension } from "./responsive";
+export { getColor } from "./styles";
+export { getShadow } from "./styles";
+export { getTextSize } from "./responsive";
+export { getResponsiveTextSize } from "./responsive";
+export { getWeight } from "./styles";
+export { getRadius } from "./styles";
+export { getTransition } from "./styles";
+export { getResponsiveSpace } from "./responsive";
+export { getIconSize } from "./styles";
+export { getGridColumns } from "./styles";
+export { getBorder } from "./styles";
+export { isBrowser } from "./helpers";
+export { getCssVarCore } from "./helpers";
+export { getCssVar } from "./helpers";
+export { u } from "./helpers";
+export { isNumber } from "./helpers";
+export { isString } from "./helpers";
+export { isArray } from "./helpers";
+export { isObject } from "./helpers";

package/es/utilities/responsive.js

@@ -1,33 +1,36 @@
-"use strict";
-
-require("core-js/modules/es.object.define-property.js");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getResponsiveTextSize = exports.getTextSize = exports.getResponsiveSpace = exports.getResponsiveDimension = exports.getSpace = exports.getDimension = exports.mapObjToMedia = exports.getMediaCss = void 0;
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-require("core-js/modules/es.array.concat.js");
-
-require("core-js/modules/es.array.map.js");
-
-require("core-js/modules/es.object.entries.js");
-
-require("core-js/modules/es.array.reverse.js");
-
-var _ = require(".");
-
-var _variables = require("../variables");
-
-var getMediaCss = function getMediaCss(breakpoint, property, value) {
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import "core-js/modules/es.array.concat.js";
+import "core-js/modules/es.array.map.js";
+import "core-js/modules/es.object.entries.js";
+import "core-js/modules/es.array.reverse.js";
+import "core-js/modules/es.symbol.js";
+import "core-js/modules/es.symbol.description.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.symbol.iterator.js";
+import "core-js/modules/es.array.iterator.js";
+import "core-js/modules/es.string.iterator.js";
+import "core-js/modules/web.dom-collections.iterator.js";
+import "core-js/modules/es.array.slice.js";
+import "core-js/modules/es.array.from.js";
+import "core-js/modules/es.regexp.exec.js";
+import { getCssVar, isNumber, isString, u, isObject } from ".";
+import { vars, varInfo } from "../variables";
+export var getMediaCss = function getMediaCss(breakpoint, property, value) {
   var getValue = function getValue(val) {
     if (val === 0) return val;
-    if ((0, _.isNumber)(val)) return (0, _.u)(val);
-    if ((0, _.isString)(val)) return val;
+    if (isNumber(val)) return u(val);
+    if (isString(val)) return val;
   };
 
   if (breakpoint === "default") {
@@ -36,19 +39,15 @@ var getMediaCss = function getMediaCss(breakpoint, property, value) {
 
   return "\n    @media ".concat(breakpoint, " {\n      ").concat(property, ": ").concat(getValue(value), ";\n    }\n  ");
 };
-
-exports.getMediaCss = getMediaCss;
-
-var mapObjToMedia = function mapObjToMedia(property, obj, varName) {
-  var varGroupName = _variables.varNames[varName].group;
-  var varPrefix = _variables.varNames[varName].prefix;
+export var mapObjToMedia = function mapObjToMedia(property, obj, type) {
+  var varPrefix = varInfo[type].prefix;
   var declarations = Object.entries(obj).map(function (_ref) {
-    var _ref2 = (0, _slicedToArray2.default)(_ref, 2),
+    var _ref2 = _slicedToArray(_ref, 2),
         breakpoint = _ref2[0],
         value = _ref2[1];
 
-    if (value in _variables.vars[varGroupName]) {
-      return getMediaCss(breakpoint, property, (0, _.getCssVar)(varPrefix, value));
+    if (value in vars[type]) {
+      return getMediaCss(breakpoint, property, getCssVar(varPrefix, value));
     }
 
     return getMediaCss(breakpoint, property, value);
@@ -57,72 +56,52 @@ var mapObjToMedia = function mapObjToMedia(property, obj, varName) {
   declarations.reverse().join("");
   return declarations;
 };
-
-exports.mapObjToMedia = mapObjToMedia;
-
-var getDimension = function getDimension(dimension) {
+export var getDimension = function getDimension(dimension) {
   if (dimension === 0) return dimension;
-  if ((0, _.isString)(dimension)) return dimension;
-  if ((0, _.isNumber)(dimension)) return (0, _.u)(dimension);
+  if (isString(dimension)) return dimension;
+  if (isNumber(dimension)) return u(dimension);
 };
-
-exports.getDimension = getDimension;
-
-var getSpace = function getSpace(value) {
-  if (value in _variables.vars.spaces) {
-    return (0, _.getCssVar)(_variables.varNames.space.prefix, value);
+export var getSpace = function getSpace(value) {
+  if (value in vars.spaces) {
+    return getCssVar(varInfo.spaces.prefix, value);
   }
 
   if (value === 0) return value;
-  if ((0, _.isString)(value)) return value;
-  if ((0, _.isNumber)(value)) return (0, _.u)(value);
+  if (isString(value)) return value;
+  if (isNumber(value)) return u(value);
 };
-
-exports.getSpace = getSpace;
-
-var getResponsiveDimension = function getResponsiveDimension(property, dimension) {
+export var getResponsiveDimension = function getResponsiveDimension(property, dimension) {
   if (!dimension) return;
 
-  if ((0, _.isObject)(dimension)) {
-    return mapObjToMedia(property, dimension, _variables.varNames.space.prefix);
+  if (isObject(dimension)) {
+    return mapObjToMedia(property, dimension, varInfo.spaces.name);
   }
 
   return "".concat(property, ": ").concat(getDimension(dimension));
 };
-
-exports.getResponsiveDimension = getResponsiveDimension;
-
-var getResponsiveSpace = function getResponsiveSpace(property, space) {
+export var getResponsiveSpace = function getResponsiveSpace(property, space) {
   if (!space) return;
 
-  if ((0, _.isObject)(space)) {
-    return mapObjToMedia(property, space, _variables.varNames.space.prefix);
+  if (isObject(space)) {
+    return mapObjToMedia(property, space, varInfo.spaces.name);
   }
 
   return "".concat(property, ": ").concat(getSpace(space));
 };
-
-exports.getResponsiveSpace = getResponsiveSpace;
-
-var getTextSize = function getTextSize(size) {
-  if (size in _variables.vars.texts) {
-    return (0, _.getCssVar)(_variables.varNames.text.prefix, size);
+export var getTextSize = function getTextSize(size) {
+  if (size in vars.texts) {
+    return getCssVar(varInfo.texts.prefix, size);
   }
 
-  if ((0, _.isString)(size)) return size;
+  if (isString(size)) return size;
 };
-
-exports.getTextSize = getTextSize;
-
-var getResponsiveTextSize = function getResponsiveTextSize(size) {
+export var getResponsiveTextSize = function getResponsiveTextSize(size) {
   if (!size) return;
   var property = "font-size";
 
-  if ((0, _.isObject)(size)) {
-    return mapObjToMedia(property, size, _variables.varNames.text.prefix);
+  if (isObject(size)) {
+    return mapObjToMedia(property, size, varInfo.texts.name);
   }
 
   return "".concat(property, ": ").concat(getTextSize(size));
-};
-
-exports.getResponsiveTextSize = getResponsiveTextSize;
+};

package/es/utilities/styles.js

@@ -1,121 +1,79 @@
-"use strict";
+import "core-js/modules/es.array.map.js";
+import "core-js/modules/es.array.concat.js";
+import "core-js/modules/es.object.define-property.js";
+import "core-js/modules/es.object.keys.js";
+import "core-js/modules/es.symbol.js";
+import "core-js/modules/es.array.filter.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.object.get-own-property-descriptor.js";
+import "core-js/modules/web.dom-collections.for-each.js";
+import "core-js/modules/es.object.get-own-property-descriptors.js";
+import "core-js/modules/es.object.define-properties.js";
 
-require("core-js/modules/es.object.keys.js");
-
-require("core-js/modules/es.symbol.js");
-
-require("core-js/modules/es.array.filter.js");
-
-require("core-js/modules/es.object.to-string.js");
-
-require("core-js/modules/es.object.get-own-property-descriptor.js");
-
-require("core-js/modules/web.dom-collections.for-each.js");
-
-require("core-js/modules/es.object.get-own-property-descriptors.js");
-
-require("core-js/modules/es.object.define-properties.js");
-
-require("core-js/modules/es.object.define-property.js");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getBorder = exports.getGridColumns = exports.getIconSize = exports.getTransition = exports.getRadius = exports.getWeight = exports.getShadow = exports.getColor = void 0;
-
-require("core-js/modules/es.array.map.js");
-
-require("core-js/modules/es.array.concat.js");
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _ = require(".");
-
-var _variables = require("../variables");
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-var _responsive = require("./responsive");
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+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; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import { getCssVar, isNumber, isString, u, isArray } from ".";
+import { vars, varInfo } from "../variables";
+import { getDimension } from "./responsive";
 
-var allColors = _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, _variables.vars.colors.baseColors), _variables.vars.colors.greys), _variables.vars.colors.semanticColors), _variables.vars.colors.fades);
+var allColors = _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, vars.colors.bases), vars.colors.greys), vars.colors.semantics), vars.colors.fades);
 
-var getColor = function getColor(color) {
+export var getColor = function getColor(color) {
   if (color in allColors) {
-    return (0, _.getCssVar)(_variables.varNames.color.prefix, color);
+    return getCssVar(varInfo.colors.prefix, color);
   }
 
   return color;
 };
-
-exports.getColor = getColor;
-
-var getShadow = function getShadow(shadow) {
-  if (shadow in _variables.vars.shadows) {
-    return (0, _.getCssVar)(_variables.varNames.shadow.prefix, shadow);
+export var getShadow = function getShadow(shadow) {
+  if (shadow in vars.shadows) {
+    return getCssVar(varInfo.shadows.prefix, shadow);
   }
 
   return shadow;
 };
-
-exports.getShadow = getShadow;
-
-var getWeight = function getWeight(weight) {
-  if (weight in _variables.vars.weights) {
-    return (0, _.getCssVar)(_variables.varNames.weight.prefix, weight);
+export var getWeight = function getWeight(weight) {
+  if (weight in vars.weights) {
+    return getCssVar(varInfo.weights.prefix, weight);
   }
 };
-
-exports.getWeight = getWeight;
-
-var getRadius = function getRadius(radius) {
-  if (radius in _variables.vars.radiuses) {
-    return (0, _.getCssVar)(_variables.varNames.radius.prefix, radius);
+export var getRadius = function getRadius(radius) {
+  if (radius in vars.radii) {
+    return getCssVar(varInfo.radii.prefix, radius);
   }
 
   if (radius === 0) return radius;
-  if ((0, _.isString)(radius)) return radius;
-  if ((0, _.isNumber)(radius)) return (0, _.u)(radius);
+  if (isString(radius)) return radius;
+  if (isNumber(radius)) return u(radius);
 };
-
-exports.getRadius = getRadius;
-
-var getTransition = function getTransition(transition) {
-  if (transition in _variables.vars.transitions) {
-    return (0, _.getCssVar)(_variables.varNames.transition.prefix, transition);
+export var getTransition = function getTransition(transition) {
+  if (transition in vars.transitions) {
+    return getCssVar(varInfo.transitions.prefix, transition);
   }
 };
-
-exports.getTransition = getTransition;
-
-var getIconSize = function getIconSize(size) {
-  if (size in _variables.vars.icons) {
-    return (0, _.getCssVar)(_variables.varNames.icon.prefix, size);
+export var getIconSize = function getIconSize(size) {
+  if (size in vars.icons) {
+    return getCssVar(varInfo.icons.prefix, size);
   }
 
-  return (0, _responsive.getDimension)(size);
+  return getDimension(size);
 };
-
-exports.getIconSize = getIconSize;
-
-var getGridColumns = function getGridColumns(columns) {
+export var getGridColumns = function getGridColumns(columns) {
   if (columns) {
-    if ((0, _.isArray)(columns)) {
+    if (isArray(columns)) {
       return columns.map(function (column) {
-        return (0, _responsive.getDimension)(column);
+        return getDimension(column);
       }).join(" ");
     }
 
-    if ((0, _.isString)(columns)) return columns;
+    if (isString(columns)) return columns;
   }
 };
-
-exports.getGridColumns = getGridColumns;
-
-var getBorder = function getBorder(borderSide, borderWidth, borderColor) {
+export var getBorder = function getBorder(borderSide, borderWidth, borderColor) {
   var borderSides = {
     all: ["top", "right", "bottom", "left"],
     x: ["right", "left"],
@@ -129,8 +87,6 @@ var getBorder = function getBorder(borderSide, borderWidth, borderColor) {
   if (borderSide in borderSides) {
     return "\n      ".concat(borderSides[borderSide].map(function (side) {
       return "border-".concat(side, "-style: solid");
-    }).join(";"), ";\n\n      border-color: ").concat(getColor(borderColor), ";\n      border-width: ").concat((0, _responsive.getDimension)(borderWidth), ";\n    ");
+    }).join(";"), ";\n\n      border-color: ").concat(getColor(borderColor), ";\n      border-width: ").concat(getDimension(borderWidth), ";\n    ");
   }
-};
-
-exports.getBorder = getBorder;
+};