@spothero/ui 17.0.3 → 17.1.0-beta.0

package/dist/components/styles.js

@@ -1,153 +1,175 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 Object.defineProperty(exports, "Accordion", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _styles2.default;
   }
 });
 Object.defineProperty(exports, "Alert", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _styles6.default;
   }
 });
 Object.defineProperty(exports, "Badge", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _styles12.default;
   }
 });
 Object.defineProperty(exports, "Button", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _Button.default;
   }
 });
 Object.defineProperty(exports, "Checkbox", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _styles5.default;
   }
 });
 Object.defineProperty(exports, "Divider", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _Divider.default;
   }
 });
 Object.defineProperty(exports, "GridItem", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _GridItem.default;
   }
 });
 Object.defineProperty(exports, "Heading", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _Heading.default;
   }
 });
 Object.defineProperty(exports, "Input", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _styles9.default;
   }
 });
 Object.defineProperty(exports, "Link", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _Link.default;
   }
 });
 Object.defineProperty(exports, "List", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _styles.default;
   }
 });
 Object.defineProperty(exports, "Modal", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _styles10.default;
   }
 });
 Object.defineProperty(exports, "Popover", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _styles8.default;
   }
 });
 Object.defineProperty(exports, "Radio", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _styles11.default;
   }
 });
 Object.defineProperty(exports, "Select", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _styles4.default;
   }
 });
 Object.defineProperty(exports, "Skeleton", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _Skeleton.default;
   }
 });
 Object.defineProperty(exports, "Spinner", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _Spinner.default;
   }
 });
 Object.defineProperty(exports, "Switch", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _styles7.default;
   }
 });
 Object.defineProperty(exports, "Table", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _Table.default;
   }
 });
 Object.defineProperty(exports, "Tabs", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _styles3.default;
   }
 });
 Object.defineProperty(exports, "Text", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _Text.default;
   }
 });
+
 var _styles = _interopRequireDefault(require("./List/styles"));
+
 var _Table = _interopRequireDefault(require("./Table/Table.styles"));
+
 var _Text = _interopRequireDefault(require("./Text/Text.styles"));
+
 var _Link = _interopRequireDefault(require("./Link/Link.styles"));
+
 var _styles2 = _interopRequireDefault(require("./Accordion/styles"));
+
 var _Button = _interopRequireDefault(require("./Button/Button.styles"));
+
 var _GridItem = _interopRequireDefault(require("./Grid/GridItem.styles"));
+
 var _Spinner = _interopRequireDefault(require("./Spinner/Spinner.styles"));
+
 var _Heading = _interopRequireDefault(require("./Heading/Heading.styles"));
+
 var _Divider = _interopRequireDefault(require("./Divider/Divider.styles"));
+
 var _styles3 = _interopRequireDefault(require("./Tabs/styles"));
+
 var _styles4 = _interopRequireDefault(require("./Select/styles"));
+
 var _styles5 = _interopRequireDefault(require("./Checkbox/styles"));
+
 var _styles6 = _interopRequireDefault(require("./Alert/styles"));
+
 var _styles7 = _interopRequireDefault(require("./Switch/styles"));
+
 var _styles8 = _interopRequireDefault(require("./Popover/styles"));
+
 var _styles9 = _interopRequireDefault(require("./Input/styles"));
+
 var _styles10 = _interopRequireDefault(require("./Modal/styles"));
+
 var _styles11 = _interopRequireDefault(require("./Radio/styles"));
+
 var _Skeleton = _interopRequireDefault(require("./Skeleton/Skeleton.styles"));
+
 var _styles12 = _interopRequireDefault(require("./Badge/styles"));

package/dist/theme/base/breakpoints.js

@@ -4,14 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _themeTools = require("@chakra-ui/theme-tools");
+
 /**
  * The "base" breakpoint is Chakra's default non-responsive value (from 0 upwards).
  * While we don't explicitly enable a "mobile" breakpoint, we can consider "base" and
  * "mobile" the same for all intents and purposes for mobile-first responsive styling.
  * @see https://chakra-ui.com/docs/features/responsive-styles#customizing-breakpoints
  */
-const breakpoints = (0, _themeTools.createBreakpoints)({
+var breakpoints = (0, _themeTools.createBreakpoints)({
   mobileXL: '30rem',
   // 480px
   tablet: '48rem',
@@ -19,6 +21,7 @@ const breakpoints = (0, _themeTools.createBreakpoints)({
   desktop: '64rem',
   // 1024px
   desktopXL: '90rem' // 1440px
+
 });
 var _default = breakpoints;
 exports.default = _default;

package/dist/theme/base/colors.js

@@ -1,13 +1,32 @@
 "use strict";
 
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-const white = '#ffffff';
-const black = '#000000';
-const brandBlue = '#0082ff';
-const gray = {
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+
+function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, 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 = 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; }
+
+var white = '#ffffff';
+var black = '#000000';
+var brandBlue = '#0082ff';
+var gray = {
   50: '#f6f7f9',
   100: '#e1e6ec',
   200: '#cbd4de',
@@ -19,7 +38,7 @@ const gray = {
   800: '#2f3f4b',
   900: '#26323c'
 };
-const blue = {
+var blue = {
   50: '#f6fbfd',
   100: '#e6f8fd',
   200: '#c0e9fb',
@@ -31,7 +50,7 @@ const blue = {
   800: '#1735a6',
   900: '#132b7f'
 };
-const navy = {
+var navy = {
   50: '#f4fafc',
   100: '#e4f7fb',
   200: '#bfebf6',
@@ -43,7 +62,7 @@ const navy = {
   800: '#194185',
   900: '#002d5b'
 };
-const green = {
+var green = {
   50: '#ecf8f7',
   100: '#d3f7ef',
   200: '#a4f3d9',
@@ -55,7 +74,7 @@ const green = {
   800: '#11703e',
   900: '#115a35'
 };
-const yellow = {
+var yellow = {
   50: '#f9f5e5',
   100: '#faf0bd',
   200: '#f6e67c',
@@ -67,7 +86,7 @@ const yellow = {
   800: '#8e440e',
   900: '#743710'
 };
-const red = {
+var red = {
   50: '#fdf9f8',
   100: '#fdeef3',
   200: '#fbcee6',
@@ -79,33 +98,27 @@ const red = {
   800: '#b4193c',
   900: '#901530'
 };
-const colors = {
-  primary: {
-    ...blue,
+var colors = {
+  primary: _objectSpread(_objectSpread({}, blue), {}, {
     default: blue['500']
-  },
-  secondary: {
-    ...navy,
+  }),
+  secondary: _objectSpread(_objectSpread({}, navy), {}, {
     default: navy['900']
-  },
-  gray: {
-    ...gray,
+  }),
+  gray: _objectSpread(_objectSpread({}, gray), {}, {
     light: gray['50'],
     medium: gray['200'],
     dark: gray['600']
-  },
-  red: {
-    ...red,
+  }),
+  red: _objectSpread(_objectSpread({}, red), {}, {
     default: red['700']
-  },
-  green: {
-    ...green,
+  }),
+  green: _objectSpread(_objectSpread({}, green), {}, {
     default: green['700']
-  },
-  yellow: {
-    ...yellow,
+  }),
+  yellow: _objectSpread(_objectSpread({}, yellow), {}, {
     default: yellow['400']
-  },
+  }),
   success: green['700'],
   warning: yellow['400'],
   error: red['700'],
@@ -125,11 +138,11 @@ const colors = {
   },
   background: {
     gray: gray['50'],
-    white
+    white: white
   },
-  white,
-  black,
-  brandBlue
+  white: white,
+  black: black,
+  brandBlue: brandBlue
 };
 var _default = colors;
 exports.default = _default;

package/dist/theme/base/index.js

@@ -1,53 +1,59 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 Object.defineProperty(exports, "breakpoints", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _breakpoints.default;
   }
 });
 Object.defineProperty(exports, "colors", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _colors.default;
   }
 });
 Object.defineProperty(exports, "fontSizes", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _typography.fontSizes;
   }
 });
 Object.defineProperty(exports, "fontWeights", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _typography.fontWeights;
   }
 });
 Object.defineProperty(exports, "fonts", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _typography.fonts;
   }
 });
 Object.defineProperty(exports, "sizes", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _sizes.default;
   }
 });
 Object.defineProperty(exports, "zIndices", {
   enumerable: true,
-  get: function () {
+  get: function get() {
     return _zindices.default;
   }
 });
+
 var _sizes = _interopRequireDefault(require("./sizes"));
+
 var _colors = _interopRequireDefault(require("./colors"));
+
 var _zindices = _interopRequireDefault(require("./zindices"));
+
 var _breakpoints = _interopRequireDefault(require("./breakpoints"));
+
 var _typography = require("./typography");

package/dist/theme/base/sizes.js

@@ -4,16 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-const container = {
+var container = {
   base: '100%',
   // 640px
   tablet: '45rem',
   // 720px
   desktop: '72rem' // 1152px
-};
 
-const sizes = {
-  container,
+};
+var sizes = {
+  container: container,
   0: '0',
   0.5: '0.125rem',
   // 2px

package/dist/theme/base/typography.js

@@ -4,12 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.fonts = exports.fontWeights = exports.fontSizes = void 0;
-const fonts = {
-  heading: `"Open Sans", sans-serif`,
-  body: `"Open Sans", sans-serif`
+var fonts = {
+  heading: "\"Open Sans\", sans-serif",
+  body: "\"Open Sans\", sans-serif"
 };
 exports.fonts = fonts;
-const fontSizes = {
+var fontSizes = {
   '5xl': '3.5rem',
   // 56px
   '4xl': '3rem',
@@ -29,9 +29,10 @@ const fontSizes = {
   sm: '0.875rem',
   // 14px
   xs: '0.75rem' // 12px
+
 };
 exports.fontSizes = fontSizes;
-const fontWeights = {
+var fontWeights = {
   light: 300,
   normal: 400,
   semibold: 600,

package/dist/theme/base/zindices.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-const indices = {
+var indices = {
   hide: -100,
   // equivalent to $z-index-negative in fe-core (https://github.com/spothero/fe-core/blob/main/utils/_defaults.scss)
   auto: 'auto',
@@ -29,6 +29,7 @@ const indices = {
   layer9: 900,
   // equivalent to $z-index-notification in fe-core
   layer10: 1000 // equivalent to $z-index-top in fe-core
+
 };
 var _default = indices;
 exports.default = _default;

package/dist/theme/global.js

@@ -1,14 +1,21 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.LegacyOverrides = exports.Fonts = void 0;
+
+var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
+
 var _react = _interopRequireDefault(require("react"));
+
 var _react2 = require("@emotion/react");
+
 var _base = require("./base");
-const global = {
+
+var global = {
   'html, body': {
     color: 'text.primary.light'
   },
@@ -24,96 +31,22 @@ const global = {
 };
 var _default = global;
 exports.default = _default;
-const Fonts = () => /*#__PURE__*/_react.default.createElement(_react2.Global, {
-  styles: `
-            @import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap');
-            /* Copied from https://fonts.googleapis.com/css2?family=Open+Sans:wght@700&display=swap */
-            /* latin-ext */
-            @font-face {
-                font-family: 'Open Sans';
-                font-style: normal;
-                font-weight: 700;
-                src: url(https://fonts.gstatic.com/s/opensans/v18/mem5YaGs126MiZpBA-UN7rgOXOhpKKSTj5PW.woff2) format('woff2');
-                unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-            }
-            /* latin-ext */
-            @font-face {
-                font-family: 'Open Sans';
-                font-style: normal;
-                font-weight: 600;
-                src: url(https://fonts.gstatic.com/s/opensans/v18/mem5YaGs126MiZpBA-UNirkOXOhpKKSTj5PW.woff2) format('woff2');
-                unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-            }
-            /* latin-ext */
-            @font-face {
-                font-family: 'Open Sans';
-                font-style: normal;
-                font-weight: 400;
-                src: url(https://fonts.gstatic.com/s/opensans/v18/mem8YaGs126MiZpBA-UFW50bf8pkAp6a.woff2) format('woff2');
-                unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-            }
-            /* latin-ext */
-            @font-face {
-                font-family: 'Open Sans';
-                font-style: normal;
-                font-weight: 300;
-                src: url(https://fonts.gstatic.com/s/opensans/v18/mem5YaGs126MiZpBA-UN_r8OXOhpKKSTj5PW.woff2) format('woff2');
-                unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-            }
-        `
-});
-exports.Fonts = Fonts;
-const LegacyOverrides = _ref => {
-  let {
-    useLegacyOverrides
-  } = _ref;
-  return useLegacyOverrides ? /*#__PURE__*/_react.default.createElement(_react2.Global, {
-    styles: `
-        h1,
-        h2,
-        h3,
-        h4,
-        h5,
-        h6 {
-            margin-top: 0;
-            font-weight: ${_base.fontWeights.semibold};
-        }
-
-        .heading-sm {
-            font-size: ${_base.fontSizes.base};
-        }
-        .heading-md {
-            font-size: ${_base.fontSizes.md};
-        }
-        .heading-lg {
-            font-size: ${_base.fontSizes['5xl']};
-        }
-
-        p {
-            line-height: 1.5;
-        }
-
-        a {
-            outline: none;
-            text-align: left;
-            color: ${_base.colors.primary.default};
-            text-decoration: none;
 
-            &:active,
-            &:focus {
-                outline: none;
-            }
+var Fonts = function Fonts() {
+  return /*#__PURE__*/_react.default.createElement(_react2.Global, {
+    styles: "\n            @import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap');\n            /* Copied from https://fonts.googleapis.com/css2?family=Open+Sans:wght@700&display=swap */\n            /* latin-ext */\n            @font-face {\n                font-family: 'Open Sans';\n                font-style: normal;\n                font-weight: 700;\n                src: url(https://fonts.gstatic.com/s/opensans/v18/mem5YaGs126MiZpBA-UN7rgOXOhpKKSTj5PW.woff2) format('woff2');\n                unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;\n            }\n            /* latin-ext */\n            @font-face {\n                font-family: 'Open Sans';\n                font-style: normal;\n                font-weight: 600;\n                src: url(https://fonts.gstatic.com/s/opensans/v18/mem5YaGs126MiZpBA-UNirkOXOhpKKSTj5PW.woff2) format('woff2');\n                unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;\n            }\n            /* latin-ext */\n            @font-face {\n                font-family: 'Open Sans';\n                font-style: normal;\n                font-weight: 400;\n                src: url(https://fonts.gstatic.com/s/opensans/v18/mem8YaGs126MiZpBA-UFW50bf8pkAp6a.woff2) format('woff2');\n                unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;\n            }\n            /* latin-ext */\n            @font-face {\n                font-family: 'Open Sans';\n                font-style: normal;\n                font-weight: 300;\n                src: url(https://fonts.gstatic.com/s/opensans/v18/mem5YaGs126MiZpBA-UN_r8OXOhpKKSTj5PW.woff2) format('woff2');\n                unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;\n            }\n        "
+  });
+};
 
-            &:hover {
-                color: ${_base.colors.primary['700']};
-            }
-        }
+exports.Fonts = Fonts;
 
-        small {
-            font-size: ${_base.fontSizes.xs};
-        }
+var LegacyOverrides = function LegacyOverrides(_ref) {
+  var _context, _context2, _context3, _context4, _context5, _context6;
 
-        `
+  var useLegacyOverrides = _ref.useLegacyOverrides;
+  return useLegacyOverrides ? /*#__PURE__*/_react.default.createElement(_react2.Global, {
+    styles: (0, _concat.default)(_context = (0, _concat.default)(_context2 = (0, _concat.default)(_context3 = (0, _concat.default)(_context4 = (0, _concat.default)(_context5 = (0, _concat.default)(_context6 = "\n        h1,\n        h2,\n        h3,\n        h4,\n        h5,\n        h6 {\n            margin-top: 0;\n            font-weight: ".concat(_base.fontWeights.semibold, ";\n        }\n\n        .heading-sm {\n            font-size: ")).call(_context6, _base.fontSizes.base, ";\n        }\n        .heading-md {\n            font-size: ")).call(_context5, _base.fontSizes.md, ";\n        }\n        .heading-lg {\n            font-size: ")).call(_context4, _base.fontSizes['5xl'], ";\n        }\n\n        p {\n            line-height: 1.5;\n        }\n\n        a {\n            outline: none;\n            text-align: left;\n            color: ")).call(_context3, _base.colors.primary.default, ";\n            text-decoration: none;\n\n            &:active,\n            &:focus {\n                outline: none;\n            }\n\n            &:hover {\n                color: ")).call(_context2, _base.colors.primary['700'], ";\n            }\n        }\n\n        small {\n            font-size: ")).call(_context, _base.fontSizes.xs, ";\n        }\n\n        ")
   }) : null;
 };
+
 exports.LegacyOverrides = LegacyOverrides;