@flodesk/grain 10.17.2 → 10.17.4

package/es/icons/icon-rows-and-column.js

@@ -1,21 +0,0 @@
-import "core-js/modules/es.object.assign.js";
-
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-import * as React from 'react';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-
-var LayoutRowsAndColumn = function LayoutRowsAndColumn(props) {
-  return ___EmotionJSX("svg", _extends({
-    viewBox: "0 0 24 24",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, props), ___EmotionJSX("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M0 2a2 2 0 012-2h20a2 2 0 012 2v20a2 2 0 01-2 2H2a2 2 0 01-2-2V2zm22 0h-9v20h9V2zM2 2h9v9H2V2zm0 11v9h9v-9H2z",
-    fill: "currentColor"
-  }));
-};
-
-export default LayoutRowsAndColumn;

package/es/icons/icon-rows.js

@@ -1,21 +0,0 @@
-import "core-js/modules/es.object.assign.js";
-
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-import * as React from 'react';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-
-var LayoutRows = function LayoutRows(props) {
-  return ___EmotionJSX("svg", _extends({
-    viewBox: "0 0 24 24",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, props), ___EmotionJSX("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M2 0a2 2 0 00-2 2v20a2 2 0 002 2h20a2 2 0 002-2V2a2 2 0 00-2-2H2zm0 2h20v9H2V2zm0 11v9h20v-9H2z",
-    fill: "currentColor"
-  }));
-};
-
-export default LayoutRows;

package/es/icons/icon-strike.js

@@ -1,28 +0,0 @@
-import "core-js/modules/es.object.assign.js";
-
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-import * as React from 'react';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-
-var IconStrike = function IconStrike(props) {
-  return ___EmotionJSX("svg", _extends({
-    viewBox: "0 0 24 24",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, props), ___EmotionJSX("g", {
-    clipPath: "url(#prefix__clip0_1288_730)"
-  }, ___EmotionJSX("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M11.727.004c5.499-.149 7.8 3.742 8.25 5.804l-1.954.426c-.304-1.394-1.956-4.347-6.241-4.23C9.86 2.056 7.978 2.52 6.759 4c-.474.577-.772 1.446-.766 2.352.005.9.308 1.73.895 2.295.753.724 1.979 1.77 5.2 2.352H24v2H0v-2h6.583a9.682 9.682 0 01-1.081-.91c-1.056-1.017-1.5-2.407-1.51-3.724-.008-1.31.412-2.65 1.223-3.636C6.985.58 9.597.062 11.727.004zm.538 23.992c-5.498.15-7.8-3.742-8.25-5.803l1.955-.427c.304 1.394 1.956 4.347 6.241 4.23 1.921-.051 3.804-.516 5.022-1.997.475-.576.773-1.446.767-2.352-.006-.9-.308-1.73-.896-2.295A9.348 9.348 0 0016.72 15h2.61c.46.82.664 1.744.67 2.634.008 1.31-.412 2.651-1.223 3.636-1.77 2.15-4.382 2.668-6.512 2.726z",
-    fill: "currentColor"
-  })), ___EmotionJSX("defs", null, ___EmotionJSX("clipPath", {
-    id: "prefix__clip0_1288_730"
-  }, ___EmotionJSX("path", {
-    fill: "#fff",
-    d: "M0 0h24v24H0z"
-  }))));
-};
-
-export default IconStrike;

package/es/icons/icon-text-justify.js

@@ -1,21 +0,0 @@
-import "core-js/modules/es.object.assign.js";
-
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-import * as React from 'react';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-
-var IconTextJustify = function IconTextJustify(props) {
-  return ___EmotionJSX("svg", _extends({
-    viewBox: "0 0 24 24",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, props), ___EmotionJSX("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M0 5h24v2H0V5zm0 6h24v2H0v-2zm24 6H0v2h24v-2z",
-    fill: "currentColor"
-  }));
-};
-
-export default IconTextJustify;

package/es/icons/icon-underline.js

@@ -1,28 +0,0 @@
-import "core-js/modules/es.object.assign.js";
-
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-import * as React from 'react';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-
-var IconUnderline = function IconUnderline(props) {
-  return ___EmotionJSX("svg", _extends({
-    viewBox: "0 0 20 24",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, props), ___EmotionJSX("g", {
-    clipPath: "url(#prefix__clip0_1288_698)"
-  }, ___EmotionJSX("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M16 8.066V0h2v8.066c0 2.31-.405 4.764-1.623 6.671-1.262 1.976-3.334 3.266-6.377 3.266-3.043 0-5.115-1.29-6.377-3.266C2.405 12.83 2 10.376 2 8.066V0h2v8.066c0 2.13.383 4.145 1.31 5.595.882 1.383 2.31 2.342 4.69 2.342 2.38 0 3.808-.959 4.69-2.342.927-1.45 1.31-3.465 1.31-5.595zM20 22v2H0v-2h20z",
-    fill: "currentColor"
-  })), ___EmotionJSX("defs", null, ___EmotionJSX("clipPath", {
-    id: "prefix__clip0_1288_698"
-  }, ___EmotionJSX("path", {
-    fill: "#fff",
-    d: "M0 0h20v24H0z"
-  }))));
-};
-
-export default IconUnderline;

package/es/styles/base.js

@@ -1,2 +0,0 @@
-var base = "\n  :root {\n    --grn-lineHeight-fixed: 7px;\n    --grn-lineHeight-relative: 0.9em;\n    --grn-lineHeight-global: calc(var(--grn-lineHeight-fixed) + var(--grn-lineHeight-relative));\n\n    --grn-font-global: 'Flodesk Sans', sans-serif;\n    --grn-radius-button: var(--grn-radius-s);\n  }\n\n  .grn-context,\n  .grn-context * {\n    line-height: var(--grn-lineHeight-global);\n    outline-color: var(--grn-color-selection);\n  }\n\n  .grn-context {\n    font-family: var(--grn-font-global);\n    font-size: var(--grn-text-m);\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n\n  [data-theme],\n  .grn-context {\n    color: var(--grn-color-content);\n  }\n\n  *,\n  *:before,\n  *:after {\n    box-sizing: border-box;\n  }\n\n  .grn-link-context a {\n    transition: var(--grn-transition-slow);\n    text-underline-position: under;\n    text-underline-offset: calc(2px - 0.1em);\n    color: inherit;\n    cursor: pointer;\n    text-decoration-color: var(--grn-color-fade3);\n  }\n\n  .grn-link-context a:hover {\n    transition: var(--grn-transition-fast);\n    text-decoration-color: currentColor;\n  }\n\n  .grn-link-context a:active {\n    transition: var(--grn-transition-xxFast);\n  }\n";
-export default base;

package/es/styles/colors/core.js

@@ -1,2 +0,0 @@
-var core = "\n  :root {\n    --white: hsl(0 0% 100%);\n    --H: 13.85;\n    --S: 7%;\n    --HS: var(--H) var(--S);\n    --bfS: 20%;\n    --wfS: calc(100% - var(--bfS));\n  }\n\n  :root {\n    --redHS: 6 55%;\n    --redL: 52%;\n\n    --grn-color-blue: hsl(218 74% 54%);\n    --grn-color-red: hsl(var(--redHS) var(--redL));\n    --grn-color-yellow: hsl(44 99% 59%);\n    --grn-color-green: hsl(153 22% 57%);\n  }\n\n  :root {\n    --shadeS-13: 20%;\n    --shadeS-12: 22%;\n    --shadeS-11: 15%;\n    --shadeS-10: 12%;\n    --shadeS-9: 9%;\n    --shadeS-8: 7%;\n    --shadeS-7: 5%;\n    --shadeS-6: 6%;\n    --shadeS-5: 7%;\n    --shadeS-4: 7%;\n    --shadeS-3: 7%;\n    --shadeS-2: 6%;\n    --shadeS-1: 6%;\n  }\n\n  :root {\n    --shade13-s: var(--shadeS-13);\n    --shade12-s: var(--shadeS-12);\n    --shade11-s: var(--shadeS-11);\n    --shade10-s: var(--shadeS-10);\n    --shade9-s: var(--shadeS-9);\n    --shade8-s: var(--shadeS-8);\n    --shade7-s: var(--shadeS-7);\n    --shade6-s: var(--shadeS-6);\n    --shade5-s: var(--shadeS-5);\n    --shade4-s: var(--shadeS-4);\n    --shade3-s: var(--shadeS-3);\n    --shade2-s: var(--shadeS-2);\n    --shade1-s: var(--shadeS-1);\n  }\n\n  [data-theme='dark'], [data-theme='invert'] {\n    --shade13-s: var(--shadeS-1);\n    --shade12-s: var(--shadeS-2);\n    --shade11-s: var(--shadeS-3);\n    --shade10-s: var(--shadeS-4);\n    --shade9-s: var(--shadeS-5);\n    --shade8-s: var(--shadeS-6);\n    --shade7-s: var(--shadeS-7);\n    --shade6-s: var(--shadeS-8);\n    --shade5-s: var(--shadeS-9);\n    --shade4-s: var(--shadeS-10);\n    --shade3-s: var(--shadeS-11);\n    --shade2-s: var(--shadeS-12);\n    --shade1-s: var(--shadeS-13);\n  }\n\n  :root,\n  [data-experimental] {\n    --grn-color-shadeTone13: hsl(var(--H) var(--shade13-s) 10%);\n    --grn-color-shadeTone12: hsl(var(--H) var(--shade12-s) 11.5%);\n    --grn-color-shadeTone11: hsl(var(--H) var(--shade11-s) 15%);\n    --grn-color-shadeTone10: hsl(var(--H) var(--shade10-s) 21%);\n    --grn-color-shadeTone9: hsl(var(--H) var(--shade9-s) 28%);\n    --grn-color-shadeTone8: hsl(var(--H) var(--shade8-s) 38%);\n    --grn-color-shadeTone7: hsl(var(--H) var(--shade7-s) 51%);\n    --grn-color-shadeTone6: hsl(var(--H) var(--shade6-s) 70%);\n    --grn-color-shadeTone5: hsl(var(--H) var(--shade5-s) 82%);\n    --grn-color-shadeTone4: hsl(var(--H) var(--shade4-s) 90%);\n    --grn-color-shadeTone3: hsl(var(--H) var(--shade3-s) 95%);\n    --grn-color-shadeTone2: hsl(var(--H) var(--shade2-s) 97.5%);\n    --grn-color-shadeTone1: hsl(var(--H) var(--shade1-s) 100%);\n\n    --fade10-a: 73%;\n    --fade9-a: 66%;\n    --fade8-a: 59%;\n    --fade7-a: 52%;\n    --fade6-a: 45%;\n    --fade5-a: 38%;\n    --fade4-a: 31%;\n    --fade3-a: 24%;\n    --fade2-a: 17%;\n    --fade1-a: 10%;\n\n    --fade-s: 20%;\n\n    --grn-color-lightFade10: hsl(var(--H) var(--fade-s) var(--wfS) / var(--fade10-a));\n    --grn-color-lightFade9: hsl(var(--H) var(--fade-s) var(--wfS) / var(--fade9-a));\n    --grn-color-lightFade8: hsl(var(--H) var(--fade-s) var(--wfS) / var(--fade8-a));\n    --grn-color-lightFade7: hsl(var(--H) var(--fade-s) var(--wfS) / var(--fade7-a));\n    --grn-color-lightFade6: hsl(var(--H) var(--fade-s) var(--wfS) / var(--fade6-a));\n    --grn-color-lightFade5: hsl(var(--H) var(--fade-s) var(--wfS) / var(--fade5-a));\n    --grn-color-lightFade4: hsl(var(--H) var(--fade-s) var(--wfS) / var(--fade4-a));\n    --grn-color-lightFade3: hsl(var(--H) var(--fade-s) var(--wfS) / var(--fade3-a));\n    --grn-color-lightFade2: hsl(var(--H) var(--fade-s) var(--wfS) / var(--fade2-a));\n    --grn-color-lightFade1: hsl(var(--H) var(--fade-s) var(--wfS) / var(--fade1-a));\n\n    --grn-color-darkFade10: hsl(var(--H) var(--fade-s) var(--bfS) / var(--fade10-a));\n    --grn-color-darkFade9: hsl(var(--H) var(--fade-s) var(--bfS) / var(--fade9-a));\n    --grn-color-darkFade8: hsl(var(--H) var(--fade-s) var(--bfS) / var(--fade8-a));\n    --grn-color-darkFade7: hsl(var(--H) var(--fade-s) var(--bfS) / var(--fade7-a));\n    --grn-color-darkFade6: hsl(var(--H) var(--fade-s) var(--bfS) / var(--fade6-a));\n    --grn-color-darkFade5: hsl(var(--H) var(--fade-s) var(--bfS) / var(--fade5-a));\n    --grn-color-darkFade4: hsl(var(--H) var(--fade-s) var(--bfS) / var(--fade4-a));\n    --grn-color-darkFade3: hsl(var(--H) var(--fade-s) var(--bfS) / var(--fade3-a));\n    --grn-color-darkFade2: hsl(var(--H) var(--fade-s) var(--bfS) / var(--fade2-a));\n    --grn-color-darkFade1: hsl(var(--H) var(--fade-s) var(--bfS) / var(--fade1-a));\n  }\n\n  :root {\n    --grn-color-warning: var(--grn-color-yellow);\n    --grn-color-danger: var(--grn-color-red);\n    --grn-color-success: var(--grn-color-green);\n    --grn-color-selection: var(--grn-color-blue);\n  }\n";
-export default core;

package/es/styles/colors/experimental.js

@@ -1,2 +0,0 @@
-var experimental = "\n  [data-experimental='true'] {\n    --grn-radius-button: 1000px;\n  }\n";
-export default experimental;

package/es/styles/colors/index.js

@@ -1,4 +0,0 @@
-import core from './core';
-import theme from './theme';
-import experimental from './experimental';
-export default [core, theme, experimental].join('\n');

package/es/styles/colors/theme.js

@@ -1,2 +0,0 @@
-var theme = "\n  /* light */\n\n  :root,\n  [data-theme='light'],\n  [data-theme='dark'] [data-theme='invert'] {\n    --grn-color-fade10: var(--grn-color-darkFade10);\n    --grn-color-fade9: var(--grn-color-darkFade9);\n    --grn-color-fade8: var(--grn-color-darkFade8);\n    --grn-color-fade7: var(--grn-color-darkFade7);\n    --grn-color-fade6: var(--grn-color-darkFade6);\n    --grn-color-fade5: var(--grn-color-darkFade5);\n    --grn-color-fade4: var(--grn-color-darkFade4);\n    --grn-color-fade3: var(--grn-color-darkFade3);\n    --grn-color-fade2: var(--grn-color-darkFade2);\n    --grn-color-fade1: var(--grn-color-darkFade1);\n\n    --grn-color-shade1: var(--grn-color-shadeTone1);\n    --grn-color-shade2: var(--grn-color-shadeTone2);\n    --grn-color-shade3: var(--grn-color-shadeTone3);\n    --grn-color-shade4: var(--grn-color-shadeTone4);\n    --grn-color-shade5: var(--grn-color-shadeTone5);\n    --grn-color-shade6: var(--grn-color-shadeTone6);\n    --grn-color-shade7: var(--grn-color-shadeTone7);\n    --grn-color-shade8: var(--grn-color-shadeTone8);\n    --grn-color-shade9: var(--grn-color-shadeTone9);\n    --grn-color-shade10: var(--grn-color-shadeTone10);\n    --grn-color-shade11: var(--grn-color-shadeTone11);\n    --grn-color-shade12: var(--grn-color-shadeTone12);\n    --grn-color-shade13: var(--grn-color-shadeTone13);\n  }\n\n  /* dark */\n\n  [data-theme='dark'],\n  [data-theme='light'] [data-theme='invert'] {\n    --grn-color-fade10: var(--grn-color-lightFade10);\n    --grn-color-fade9: var(--grn-color-lightFade9);\n    --grn-color-fade8: var(--grn-color-lightFade8);\n    --grn-color-fade7: var(--grn-color-lightFade7);\n    --grn-color-fade6: var(--grn-color-lightFade6);\n    --grn-color-fade5: var(--grn-color-lightFade5);\n    --grn-color-fade4: var(--grn-color-lightFade4);\n    --grn-color-fade3: var(--grn-color-lightFade3);\n    --grn-color-fade2: var(--grn-color-lightFade2);\n    --grn-color-fade1: var(--grn-color-lightFade1);\n\n    --grn-color-shade1: var(--grn-color-shadeTone13);\n    --grn-color-shade2: var(--grn-color-shadeTone12);\n    --grn-color-shade3: var(--grn-color-shadeTone11);\n    --grn-color-shade4: var(--grn-color-shadeTone10);\n    --grn-color-shade5: var(--grn-color-shadeTone9);\n    --grn-color-shade6: var(--grn-color-shadeTone8);\n    --grn-color-shade7: var(--grn-color-shadeTone7);\n    --grn-color-shade8: var(--grn-color-shadeTone6);\n    --grn-color-shade9: var(--grn-color-shadeTone5);\n    --grn-color-shade10: var(--grn-color-shadeTone4);\n    --grn-color-shade11: var(--grn-color-shadeTone3);\n    --grn-color-shade12: var(--grn-color-shadeTone2);\n    --grn-color-shade13: var(--grn-color-shadeTone1);\n  }\n\n  /* light */\n\n  :root,\n  [data-theme='light'],\n  [data-theme='dark'] [data-theme='invert'] {\n    --contentL: 20%;\n    --backgroundL: 80%;\n    --grn-color-floatingBackground: var(--grn-color-shade1);\n    --grn-color-floatingBackground: var(--grn-color-shade1);\n  }\n\n  /* dark */\n\n  [data-theme='dark'],\n  [data-theme='light'] [data-theme='invert'] {\n    --contentL: 80%;\n    --backgroundL: 20%;\n    --grn-color-floatingBackground: var(--grn-color-shade2);\n    --grn-color-floatingBackground: var(--grn-color-shade2);\n  }\n\n  /* light + dark */\n\n  :root,\n  [data-theme] {\n    --grn-color-content: var(--grn-color-shade12);\n    --grn-color-content2: var(--grn-color-fade7);\n    --grn-color-content3: var(--grn-color-fade5);\n    --grn-color-disabledContent: var(--grn-color-shade7);\n    --grn-color-icon: var(--grn-color-fade7);\n    --grn-color-disabledIcon: var(--grn-color-fade4);\n\n    --grn-color-background: var(--grn-color-shade1);\n    --grn-color-background2: var(--grn-color-shade2);\n    --grn-color-background3: var(--grn-color-shade3);\n    --grn-color-disabledBackground: var(--grn-color-shade4);\n\n    --grn-color-border: hsl(var(--HS) var(--contentL) / 12%);\n    --grn-color-border2: hsl(var(--HS) var(--contentL) / 20%);\n  }\n";
-export default theme;

package/es/styles/index.js

@@ -1,6 +0,0 @@
-import variables from './variables';
-import colors from './colors';
-import shadows from './shadows';
-import base from './base';
-import utilities from './utilities';
-export default [variables, colors, shadows, base, utilities].join('\n');

package/es/styles/shadows.js

@@ -1,2 +0,0 @@
-var shadows = "\n  :root,\n  [data-theme='light'],\n  [data-theme='dark'] [data-theme='invert'] {\n    --alphaRatio: 0.6;\n  }\n\n  [data-theme='dark'],\n  [data-theme='light'] [data-theme='invert'] {\n    --alphaRatio: 0.8;\n  }\n\n  :root,\n  [data-theme] {\n    --c: 0 0% 0%;\n    --blurRatio: 1.7;\n    --yRatio: 1.1;\n    --spreadRatio: 2;\n    --ratioCurve: 0.9;\n\n    --rc1: var(--ratioCurve) * 1;\n    --rc2: var(--ratioCurve) * 2;\n    --rc3: var(--ratioCurve) * 3;\n    --rc4: var(--ratioCurve) * 4;\n\n    --b1: 1px;\n    --b2: calc(var(--b1) * var(--rc2) * var(--blurRatio));\n    --b3: calc(var(--b2) * var(--rc3) * var(--blurRatio));\n    --b4: calc(var(--b3) * var(--rc4) * var(--blurRatio));\n\n    --y1: 1px;\n    --y2: calc(var(--y1) * var(--rc2) * var(--yRatio));\n    --y3: calc(var(--y2) * var(--rc3) * var(--yRatio));\n    --y4: calc(var(--y3) * var(--rc4) * var(--yRatio));\n\n    --a1: 5%;\n    --a2: calc(var(--a1) * var(--rc2) * var(--alphaRatio));\n    --a3: calc(var(--a2) * var(--rc3) * var(--alphaRatio));\n    --a4: calc(var(--a3) * var(--rc4) * var(--alphaRatio));\n\n    --s1: -0.1px;\n    --s2: calc(var(--s1) * var(--rc2) * var(--spreadRatio));\n    --s3: calc(var(--s2) * var(--rc3) * var(--spreadRatio));\n    --s4: calc(var(--s3) * var(--rc4) * var(--spreadRatio));\n\n    --shadow1: 0 var(--y1) var(--b1) var(--s1) hsl(var(--c) / var(--a1));\n    --shadow2: 0 var(--y2) var(--b2) var(--s2) hsl(var(--c) / var(--a2));\n    --shadow3: 0 var(--y3) var(--b3) var(--s3) hsl(var(--c) / var(--a3));\n    --shadow4: 0 var(--y4) var(--b4) var(--s4) hsl(var(--c) / var(--a4));\n\n    --grn-shadow-s: var(--shadow1), var(--shadow2);\n\n    --grn-shadow-m: var(--grn-shadow-s), var(--shadow3);\n\n    --grn-shadow-l: var(--grn-shadow-m), var(--shadow4);\n  }\n";
-export default shadows;

package/es/styles/utilities.js

@@ -1,108 +0,0 @@
-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.object.to-string.js";
-import "core-js/modules/web.dom-collections.for-each.js";
-import "core-js/modules/es.array.includes.js";
-import "core-js/modules/es.string.includes.js";
-import "core-js/modules/es.array.concat.js";
-import "core-js/modules/es.object.entries.js";
-import "core-js/modules/es.symbol.js";
-import "core-js/modules/es.symbol.description.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 { styleConfig } from '../utilities';
-import { propNameToShort } from '../utilities/style-config';
-import { breakpoints, deviceShort } from '../variables';
-
-var generateUtilityClassDeclarations = function generateUtilityClassDeclarations(propertySets) {
-  var css = '';
-  propertySets.forEach(function (set) {
-    set.variables.forEach(function (variable) {
-      set.props.forEach(function (prop) {
-        var property = prop.property;
-        var cssValue = set.valueTransformer ? set.valueTransformer(variable) : variable;
-        var hasHover = prop.propName.includes('Hover');
-        var selector = ".".concat(propNameToShort(prop.propName), "-").concat(variable);
-        var declaration = "{".concat(property, ": ").concat(cssValue, "}");
-        if (!hasHover) css += "".concat(selector, " ").concat(declaration);
-        if (hasHover) css += "".concat(selector, ":hover ").concat(declaration);
-      });
-    });
-  });
-  return css;
-};
-
-var generateStyleClassDeclarations = function generateStyleClassDeclarations(propertySets) {
-  var css = '';
-  propertySets.forEach(function (set) {
-    set.props.forEach(function (prop) {
-      var property = prop.property;
-      var propName = prop.propName;
-      var cssVar = "--".concat(propNameToShort(propName));
-      var hasHover = prop.propName.includes('Hover');
-      var declaration = "{".concat(property, ": var(").concat(cssVar, ")}");
-      if (!hasHover) css += "[style*=\"".concat(cssVar, ":\"] ").concat(declaration);
-      if (hasHover) css += "[style*=\"".concat(cssVar, ":\"]:hover ").concat(declaration);
-
-      if (set.isResponsive) {
-        var device = deviceShort.default;
-        css += "\n          [style*=\"".concat(cssVar, "-").concat(device, "\"] {").concat(property, ": var(").concat(cssVar, "-").concat(device, ")}\n        ");
-        Object.entries(breakpoints).forEach(function (_ref) {
-          var _ref2 = _slicedToArray(_ref, 2),
-              deviceName = _ref2[0],
-              screenSize = _ref2[1];
-
-          var device = deviceShort[deviceName];
-          css += "\n            @media (max-width: ".concat(screenSize, "px) {\n              [style*=\"").concat(cssVar, "-").concat(device, "\"] {").concat(property, ": var(").concat(cssVar, "-").concat(device, ")}\n            }\n          ");
-        });
-      }
-    });
-  });
-  return css;
-};
-
-var spaceProps = styleConfig.spaceProps,
-    colorProps = styleConfig.colorProps,
-    shadowProps = styleConfig.shadowProps,
-    radiusProps = styleConfig.radiusProps,
-    positionProps = styleConfig.positionProps,
-    overflowProps = styleConfig.overflowProps,
-    transitionProps = styleConfig.transitionProps,
-    cursorProps = styleConfig.cursorProps,
-    dimensionProps = styleConfig.dimensionProps,
-    aspectRatioProps = styleConfig.aspectRatioProps,
-    orderProps = styleConfig.orderProps,
-    flexProps = styleConfig.flexProps,
-    sizeProps = styleConfig.sizeProps,
-    opacityProps = styleConfig.opacityProps,
-    alignSelfProps = styleConfig.alignSelfProps,
-    borderColorProps = styleConfig.borderColorProps,
-    borderWidthProps = styleConfig.borderWidthProps,
-    borderSideProps = styleConfig.borderSideProps,
-    alignProps = styleConfig.alignProps,
-    weightProps = styleConfig.weightProps,
-    textDisplayProps = styleConfig.textDisplayProps,
-    zIndexProps = styleConfig.zIndexProps,
-    letterSpacingProps = styleConfig.letterSpacingProps,
-    textTransformProps = styleConfig.textTransformProps;
-var classAndStyleDeclarationProps = [spaceProps, colorProps, shadowProps, radiusProps, transitionProps, sizeProps, borderColorProps, alignProps];
-var classDeclarationProps = [].concat(classAndStyleDeclarationProps, [positionProps, overflowProps, cursorProps, sizeProps, alignSelfProps, borderWidthProps, weightProps, textDisplayProps, borderSideProps, textTransformProps]);
-var styleDeclarationProps = [].concat(classAndStyleDeclarationProps, [dimensionProps, aspectRatioProps, orderProps, flexProps, opacityProps, zIndexProps, letterSpacingProps]);
-var defaultBorder = "\n  [class*=\"bd\"] {\n    border-color: var(--grn-color-border);\n    border-width: 1px;\n  }\n";
-var utilities = "\n  ".concat(defaultBorder, "\n  ").concat(generateUtilityClassDeclarations(classDeclarationProps), ";\n  ").concat(generateStyleClassDeclarations(styleDeclarationProps), ";\n");
-export default utilities;

package/es/styles/variables.js

@@ -1,2 +0,0 @@
-var variables = "\n  :root {\n    --grn-unit: 8px;\n  }\n\n  :root {\n    --grn-text-s: 12px;\n    --grn-text-m: 14px;\n    --grn-text-l: 18px;\n    --grn-text-xl: 24px;\n    --grn-text-xxl: 30px;\n  }\n\n  /* text size \u2715 ~1.2 */\n  :root {\n    --grn-icon-s: 14px;\n    --grn-icon-m: 18px;\n    --grn-icon-l: 22px;\n    --grn-icon-xl: 28px;\n    --grn-icon-xxl: 36px;\n  }\n\n  :root {\n    --grn-weight-normal: 400;\n    --grn-weight-medium: 500;\n  }\n\n  :root {\n    --grn-space-xs: calc(var(--grn-unit) / 2);\n    --grn-space-s: calc(var(--grn-unit) * 1);\n    --grn-space-s2: calc(var(--grn-unit) * 1.5);\n    --grn-space-m: calc(var(--grn-unit) * 2);\n    --grn-space-l: calc(var(--grn-unit) * 3);\n    --grn-space-l2: calc(var(--grn-unit) * 4);\n    --grn-space-xl: calc(var(--grn-unit) * 5);\n    --grn-space-xl2: calc(var(--grn-unit) * 6);\n    --grn-space-xxl: calc(var(--grn-unit) * 7);\n  }\n\n  :root {\n    --grn-radius-s: 3px;\n    --grn-radius-m: 6px;\n    --grn-radius-l: 10px;\n  }\n\n  :root {\n    --grn-transition-slow: 400ms;\n    --grn-transition-fast: 200ms;\n    --grn-transition-xFast: 160ms;\n    --grn-transition-xxFast: 80ms;\n  }\n\n  :root,\n  [data-theme] {\n    --grn-space-betweenFormTitleAndContent: var(--grn-space-l);\n    --grn-space-betweenFormContents: var(--grn-space-m);\n    --grn-space-betweenFormContentAndActions: var(--grn-space-xl);\n    --grn-space-betweenFormControlAndLabel: var(--grn-space-s);\n    --grn-space-fieldPaddingX: 12px;\n\n    --grn-color-fieldBorder: var(--grn-color-fade3);\n    --grn-color-fieldBorderHover: var(--grn-color-fade6);\n    --grn-color-fieldBorderFocus: var(--grn-color-shade9);\n    --grn-color-fieldBorderDisabled: var(--grn-color-shade5);\n    --grn-color-fieldBackgroundDisabled: var(--grn-color-shade2);\n    --grn-color-backdrop: hsl(var(--H) 15% 10% / 0.6);\n\n    --grn-transition-leave: var(--grn-transition-slow);\n    --grn-transition-hover: var(--grn-transition-fast);\n    --grn-transition-active: var(--grn-transition-xxFast);\n  }\n";
-export default variables;

package/es/utilities/attributes.js

@@ -1,66 +0,0 @@
-import "core-js/modules/es.object.values.js";
-import "core-js/modules/es.object.to-string.js";
-import "core-js/modules/web.dom-collections.for-each.js";
-import "core-js/modules/es.array.concat.js";
-import "core-js/modules/es.object.keys.js";
-import { breakpoints, deviceShort } from '../variables';
-import { isObject } from './helpers';
-import { propNameToShort, styleConfig } from './style-config';
-var mediaQueries = {
-  tablet: "@media (max-width: ".concat(breakpoints.tablet, "px)"),
-  mobile: "@media (max-width: ".concat(breakpoints.mobile, "px)")
-};
-export var generateStyleAttributes = function generateStyleAttributes(props) {
-  var styles = {};
-  var styleConfigValues = Object.values(styleConfig);
-  styleConfigValues.forEach(function (propsSet) {
-    propsSet.props.forEach(function (_ref) {
-      var propName = _ref.propName;
-      var value = props[propName];
-      var hasVariable = propsSet.variableChecker ? propsSet.variableChecker(value) : false;
-      var hasTransformer = propsSet.valueTransformer ? true : false;
-      if (hasVariable) return;
-      if (value === null || value === undefined || value === '') return;
-      var cssValue = hasTransformer ? propsSet.valueTransformer(value) : value;
-      var propNameShort = propNameToShort(propName);
-
-      if (!isObject(value)) {
-        styles["--".concat(propNameShort)] = cssValue;
-      } else {
-        var def = value.default,
-            mobile = value.mobile,
-            tablet = value.tablet; // accept fixed string media queries to help migration
-
-        var mobileMediaValue = value[mediaQueries.mobile];
-        var tabletMediaValue = value[mediaQueries.tablet];
-        var mob = mobileMediaValue || mobile;
-        var tab = tabletMediaValue || tablet;
-        styles["--".concat(propNameShort, "-").concat(deviceShort.default)] = hasTransformer ? propsSet.valueTransformer(def) : def;
-        styles["--".concat(propNameShort, "-").concat(deviceShort.mobile)] = hasTransformer ? propsSet.valueTransformer(mob) : mob;
-        styles["--".concat(propNameShort, "-").concat(deviceShort.tablet)] = hasTransformer ? propsSet.valueTransformer(tab) : tab;
-      }
-    });
-  });
-  return styles;
-};
-export var generateClassNameAttributes = function generateClassNameAttributes(props) {
-  var classNames = [];
-  var propKeys = Object.keys(props);
-  var styleConfigValues = Object.values(styleConfig);
-  propKeys.forEach(function (prop) {
-    styleConfigValues.forEach(function (styleConfigItem) {
-      styleConfigItem.props.forEach(function (propItem) {
-        if (propItem.propName === prop) {
-          var propName = propItem.propName;
-          var value = props[propName];
-          var hasVariable = styleConfigItem.variableChecker ? styleConfigItem.variableChecker(value) : false;
-          if (!hasVariable) return;
-          if (value === null || value === undefined || value === '') return;
-          var className = "".concat(propNameToShort(propName), "-").concat(value);
-          classNames.push(className);
-        }
-      });
-    });
-  });
-  return classNames.join(' ');
-};