@artsy/palette 41.8.1 → 42.0.0

package/dist/elements/Popover/Popover.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.story.js","names":["_addonActions","require","_react","_interopRequireDefault","_storybookStates","_utils","_Box","_Button","_Flex","_Spacer","_Text","_Popover","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","CONTENT","_default","title","exports","Default","createElement","States","states","visible","onClose","action","onDismiss","popover","Text","variant","width","pointer","p","Fragment","Array","fill","map","_","overflowEllipsis","bg","px","py","placement","zIndex","ignoreClickOutside","Popover","_ref","onVisible","anchorRef","Box","textAlign","Button","ref","size","onClick","displayName","story","parameters","chromatic","disable","Placement","keys","POSITION","props","JSON","stringify","_ref2","maxWidth","mx","ManageFocus","manageFocus","_ref3","PopoverActions","_ref4","onHide","Spacer","y","Flex","flex","x","_ref5","CrashAtSpecificZoomLevels","height","_ref6","_ref7"],"sources":["../../../src/elements/Popover/Popover.story.tsx"],"sourcesContent":["import { action } from \"@storybook/addon-actions\"\nimport React from \"react\"\nimport { States } from \"storybook-states\"\nimport { Position, POSITION } from \"../../utils\"\nimport { Box } from \"../Box\"\nimport { Button } from \"../Button\"\nimport { Flex } from \"../Flex\"\nimport { Spacer } from \"../Spacer\"\nimport { Text } from \"../Text\"\nimport { Popover, PopoverProps } from \"./Popover\"\n\nconst CONTENT =\n  \"Lorem ipsum dolor sit amet consectetur adipisicing elit. Modi eius autem aliquid cumque, mollitia incidunt totam. Id ut quae hic in quisquam, cupiditate iure nobis, provident minus voluptatem tenetur consequatur.\"\n\nexport default {\n  title: \"Components/Popover\",\n}\n\nexport const Default = () => {\n  return (\n    <States<Partial<PopoverProps>>\n      states={[\n        {},\n        { visible: true },\n        { onClose: action(\"onClose\"), onDismiss: action(\"onDismiss\") },\n        {\n          visible: true,\n          popover: (\n            <Text variant=\"xs\" width={300}>\n              | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n              | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n              | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n              | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n              | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n              | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n              | | | — (Content interaction with close button.)\n            </Text>\n          ),\n        },\n        {\n          pointer: true,\n          visible: true,\n          p: 0,\n          popover: (\n            <>\n              {new Array(4).fill(0).map((_, i) => (\n                <Text\n                  key={i}\n                  variant=\"sm-display\"\n                  overflowEllipsis\n                  bg=\"red10\"\n                  px={1}\n                  py={0.5}\n                >\n                  Example Item\n                </Text>\n              ))}\n            </>\n          ),\n        },\n        {\n          variant: \"defaultDark\",\n          placement: \"bottom\",\n          visible: true,\n          pointer: true,\n          zIndex: 99,\n        },\n        {\n          ignoreClickOutside: true,\n        },\n      ]}\n    >\n      <Popover\n        placement=\"bottom\"\n        popover={\n          <Text variant=\"xs\" width={300}>\n            {CONTENT}\n          </Text>\n        }\n      >\n        {({ onVisible, anchorRef }) => {\n          return (\n            <Box textAlign=\"center\">\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                onClick={onVisible}\n              >\n                Click to display popover\n              </Button>\n            </Box>\n          )\n        }}\n      </Popover>\n    </States>\n  )\n}\n\nDefault.story = {\n  parameters: { chromatic: { disable: true } },\n}\n\nexport const Placement = () => {\n  return (\n    <States<Partial<PopoverProps>>\n      states={Object.keys(POSITION).map((placement) => ({\n        placement: placement as Position,\n      }))}\n    >\n      {(props) => {\n        return (\n          <Popover\n            popover={<Text variant=\"xs\">{JSON.stringify(props)}</Text>}\n            visible\n            variant=\"defaultDark\"\n            pointer\n            {...props}\n          >\n            {({ anchorRef }) => {\n              return (\n                <Text\n                  ref={anchorRef as any}\n                  variant=\"xs\"\n                  textAlign=\"center\"\n                  p={1}\n                  maxWidth=\"50%\"\n                  mx=\"auto\"\n                  bg=\"mono10\"\n                >\n                  {JSON.stringify(props)}\n                </Text>\n              )\n            }}\n          </Popover>\n        )\n      }}\n    </States>\n  )\n}\n\nPlacement.story = {\n  parameters: { chromatic: { disable: true } },\n}\n\nexport const ManageFocus = () => {\n  return (\n    <States<Partial<PopoverProps>>\n      states={[\n        { visible: true, manageFocus: false },\n        { visible: true, manageFocus: true },\n      ]}\n    >\n      <Popover\n        placement=\"bottom\"\n        popover={\n          <Text variant=\"xs\" width={300}>\n            {CONTENT}\n          </Text>\n        }\n      >\n        {({ onVisible, anchorRef }) => {\n          return (\n            <Box textAlign=\"center\">\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                onClick={onVisible}\n              >\n                Click to display popover\n              </Button>\n            </Box>\n          )\n        }}\n      </Popover>\n    </States>\n  )\n}\n\nexport const PopoverActions = () => {\n  return (\n    <States<Partial<PopoverProps>> states={[{ visible: true }]}>\n      <Popover\n        placement=\"bottom\"\n        popover={({ onHide, onDismiss }) => {\n          return (\n            <>\n              <Text variant=\"xs\" width={300}>\n                {CONTENT}\n              </Text>\n\n              <Spacer y={2} />\n\n              <Flex>\n                <Button\n                  flex={1}\n                  size=\"small\"\n                  variant=\"secondaryBlack\"\n                  onClick={onHide}\n                >\n                  Hide\n                </Button>\n\n                <Spacer x={1} />\n\n                <Button\n                  flex={1}\n                  size=\"small\"\n                  variant=\"secondaryBlack\"\n                  onClick={onDismiss}\n                >\n                  Dismiss\n                </Button>\n              </Flex>\n            </>\n          )\n        }}\n      >\n        {({ onVisible, anchorRef }) => {\n          return (\n            <Box textAlign=\"center\">\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                onClick={onVisible}\n              >\n                Click to display popover\n              </Button>\n            </Box>\n          )\n        }}\n      </Popover>\n    </States>\n  )\n}\n\nexport const CrashAtSpecificZoomLevels = () => {\n  return (\n    <>\n      <Box height={100}>Zoom to 90% in Chrome, click, then scroll.</Box>\n\n      <Box height={2000} bg=\"mono5\">\n        <Box height={200} />\n\n        <Popover\n          placement=\"top\"\n          popover={({ onHide, onDismiss }) => {\n            return (\n              <>\n                <Text variant=\"xs\" width={300}>\n                  {CONTENT}\n                </Text>\n\n                <Spacer y={2} />\n\n                <Flex>\n                  <Button\n                    flex={1}\n                    size=\"small\"\n                    variant=\"secondaryBlack\"\n                    onClick={onHide}\n                  >\n                    Hide\n                  </Button>\n\n                  <Spacer x={1} />\n\n                  <Button\n                    flex={1}\n                    size=\"small\"\n                    variant=\"secondaryBlack\"\n                    onClick={onDismiss}\n                  >\n                    Dismiss\n                  </Button>\n                </Flex>\n              </>\n            )\n          }}\n        >\n          {({ onVisible, anchorRef }) => {\n            return (\n              <Box textAlign=\"center\">\n                <Button\n                  ref={anchorRef}\n                  variant=\"secondaryBlack\"\n                  size=\"small\"\n                  onClick={onVisible}\n                >\n                  Click to display popover\n                </Button>\n              </Box>\n            )\n          }}\n        </Popover>\n      </Box>\n    </>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"Popover.story.js","names":["_addonActions","require","_react","_interopRequireDefault","_storybookStates","_utils","_Box","_Button","_Flex","_Spacer","_Text","_Popover","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","CONTENT","_default","exports","title","Default","createElement","States","states","visible","onClose","action","onDismiss","popover","Text","variant","width","pointer","p","Fragment","Array","fill","map","_","overflowEllipsis","bg","px","py","placement","zIndex","ignoreClickOutside","Popover","_ref","onVisible","anchorRef","Box","textAlign","Button","ref","size","onClick","displayName","story","parameters","chromatic","disable","Placement","keys","POSITION","props","JSON","stringify","_ref2","maxWidth","mx","ManageFocus","manageFocus","_ref3","PopoverActions","_ref4","onHide","Spacer","y","Flex","flex","x","_ref5","CrashAtSpecificZoomLevels","height","_ref6","_ref7"],"sources":["../../../src/elements/Popover/Popover.story.tsx"],"sourcesContent":["import { action } from \"@storybook/addon-actions\"\nimport React from \"react\"\nimport { States } from \"storybook-states\"\nimport { Position, POSITION } from \"../../utils\"\nimport { Box } from \"../Box\"\nimport { Button } from \"../Button\"\nimport { Flex } from \"../Flex\"\nimport { Spacer } from \"../Spacer\"\nimport { Text } from \"../Text\"\nimport { Popover, PopoverProps } from \"./Popover\"\n\nconst CONTENT =\n  \"Lorem ipsum dolor sit amet consectetur adipisicing elit. Modi eius autem aliquid cumque, mollitia incidunt totam. Id ut quae hic in quisquam, cupiditate iure nobis, provident minus voluptatem tenetur consequatur.\"\n\nexport default {\n  title: \"Components/Popover\",\n}\n\nexport const Default = () => {\n  return (\n    <States<Partial<PopoverProps>>\n      states={[\n        {},\n        { visible: true },\n        { onClose: action(\"onClose\"), onDismiss: action(\"onDismiss\") },\n        {\n          visible: true,\n          popover: (\n            <Text variant=\"xs\" width={300}>\n              | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n              | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n              | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n              | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n              | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n              | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n              | | | — (Content interaction with close button.)\n            </Text>\n          ),\n        },\n        {\n          pointer: true,\n          visible: true,\n          p: 0,\n          popover: (\n            <>\n              {new Array(4).fill(0).map((_, i) => (\n                <Text\n                  key={i}\n                  variant=\"sm-display\"\n                  overflowEllipsis\n                  bg=\"red10\"\n                  px={1}\n                  py={0.5}\n                >\n                  Example Item\n                </Text>\n              ))}\n            </>\n          ),\n        },\n        {\n          variant: \"defaultDark\",\n          placement: \"bottom\",\n          visible: true,\n          pointer: true,\n          zIndex: 99,\n        },\n        {\n          ignoreClickOutside: true,\n        },\n      ]}\n    >\n      <Popover\n        placement=\"bottom\"\n        popover={\n          <Text variant=\"xs\" width={300}>\n            {CONTENT}\n          </Text>\n        }\n      >\n        {({ onVisible, anchorRef }) => {\n          return (\n            <Box textAlign=\"center\">\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                onClick={onVisible}\n              >\n                Click to display popover\n              </Button>\n            </Box>\n          )\n        }}\n      </Popover>\n    </States>\n  )\n}\n\nDefault.story = {\n  parameters: { chromatic: { disable: true } },\n}\n\nexport const Placement = () => {\n  return (\n    <States<Partial<PopoverProps>>\n      states={Object.keys(POSITION).map((placement) => ({\n        placement: placement as Position,\n      }))}\n    >\n      {(props) => {\n        return (\n          <Popover\n            popover={<Text variant=\"xs\">{JSON.stringify(props)}</Text>}\n            visible\n            variant=\"defaultDark\"\n            pointer\n            {...props}\n          >\n            {({ anchorRef }) => {\n              return (\n                <Text\n                  ref={anchorRef as any}\n                  variant=\"xs\"\n                  textAlign=\"center\"\n                  p={1}\n                  maxWidth=\"50%\"\n                  mx=\"auto\"\n                  bg=\"mono10\"\n                >\n                  {JSON.stringify(props)}\n                </Text>\n              )\n            }}\n          </Popover>\n        )\n      }}\n    </States>\n  )\n}\n\nPlacement.story = {\n  parameters: { chromatic: { disable: true } },\n}\n\nexport const ManageFocus = () => {\n  return (\n    <States<Partial<PopoverProps>>\n      states={[\n        { visible: true, manageFocus: false },\n        { visible: true, manageFocus: true },\n      ]}\n    >\n      <Popover\n        placement=\"bottom\"\n        popover={\n          <Text variant=\"xs\" width={300}>\n            {CONTENT}\n          </Text>\n        }\n      >\n        {({ onVisible, anchorRef }) => {\n          return (\n            <Box textAlign=\"center\">\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                onClick={onVisible}\n              >\n                Click to display popover\n              </Button>\n            </Box>\n          )\n        }}\n      </Popover>\n    </States>\n  )\n}\n\nexport const PopoverActions = () => {\n  return (\n    <States<Partial<PopoverProps>> states={[{ visible: true }]}>\n      <Popover\n        placement=\"bottom\"\n        popover={({ onHide, onDismiss }) => {\n          return (\n            <>\n              <Text variant=\"xs\" width={300}>\n                {CONTENT}\n              </Text>\n\n              <Spacer y={2} />\n\n              <Flex>\n                <Button\n                  flex={1}\n                  size=\"small\"\n                  variant=\"secondaryBlack\"\n                  onClick={onHide}\n                >\n                  Hide\n                </Button>\n\n                <Spacer x={1} />\n\n                <Button\n                  flex={1}\n                  size=\"small\"\n                  variant=\"secondaryBlack\"\n                  onClick={onDismiss}\n                >\n                  Dismiss\n                </Button>\n              </Flex>\n            </>\n          )\n        }}\n      >\n        {({ onVisible, anchorRef }) => {\n          return (\n            <Box textAlign=\"center\">\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                onClick={onVisible}\n              >\n                Click to display popover\n              </Button>\n            </Box>\n          )\n        }}\n      </Popover>\n    </States>\n  )\n}\n\nexport const CrashAtSpecificZoomLevels = () => {\n  return (\n    <>\n      <Box height={100}>Zoom to 90% in Chrome, click, then scroll.</Box>\n\n      <Box height={2000} bg=\"mono5\">\n        <Box height={200} />\n\n        <Popover\n          placement=\"top\"\n          popover={({ onHide, onDismiss }) => {\n            return (\n              <>\n                <Text variant=\"xs\" width={300}>\n                  {CONTENT}\n                </Text>\n\n                <Spacer y={2} />\n\n                <Flex>\n                  <Button\n                    flex={1}\n                    size=\"small\"\n                    variant=\"secondaryBlack\"\n                    onClick={onHide}\n                  >\n                    Hide\n                  </Button>\n\n                  <Spacer x={1} />\n\n                  <Button\n                    flex={1}\n                    size=\"small\"\n                    variant=\"secondaryBlack\"\n                    onClick={onDismiss}\n                  >\n                    Dismiss\n                  </Button>\n                </Flex>\n              </>\n            )\n          }}\n        >\n          {({ onVisible, anchorRef }) => {\n            return (\n              <Box textAlign=\"center\">\n                <Button\n                  ref={anchorRef}\n                  variant=\"secondaryBlack\"\n                  size=\"small\"\n                  onClick={onVisible}\n                >\n                  Click to display popover\n                </Button>\n              </Box>\n            )\n          }}\n        </Popover>\n      </Box>\n    </>\n  )\n}\n"],"mappings":"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"}

package/dist/elements/ProgressBar/ProgressBar.js

@@ -12,7 +12,7 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 /** ProgressBar */
-var ProgressBar = function ProgressBar(_ref) {
+var ProgressBar = exports.ProgressBar = function ProgressBar(_ref) {
   var percentComplete = _ref.percentComplete,
     _ref$highlight = _ref.highlight,
     highlight = _ref$highlight === void 0 ? "brand" : _ref$highlight,
@@ -44,6 +44,5 @@ var ProgressBar = function ProgressBar(_ref) {
     }
   }));
 };
-exports.ProgressBar = ProgressBar;
 ProgressBar.displayName = "ProgressBar";
 //# sourceMappingURL=ProgressBar.js.map

package/dist/elements/ProgressBar/ProgressBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBar.js","names":["_react","_interopRequireDefault","require","_Box","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","ProgressBar","_ref","percentComplete","_ref$highlight","highlight","_ref$showBackground","showBackground","_ref$transition","transition","rest","createElement","Box","tabIndex","role","height","position","overflow","mt","mb","bg","width","style","transform","concat","backfaceVisibility","exports","displayName"],"sources":["../../../src/elements/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import React from \"react\"\nimport { Color } from \"../../themes/types\"\nimport { Box, BoxProps } from \"../Box\"\n\nexport interface ProgressBarProps extends BoxProps {\n  percentComplete: number\n  highlight?: Color\n  showBackground?: boolean\n  transition?: string\n}\n\n/** ProgressBar */\nexport const ProgressBar: React.FC<\n  React.PropsWithChildren<ProgressBarProps>\n> = ({\n  percentComplete,\n  highlight = \"brand\",\n  showBackground = true,\n  transition = \"transform 1s ease\",\n  ...rest\n}) => {\n  return (\n    <Box\n      tabIndex={0}\n      role=\"progressbar\"\n      aria-valuenow={percentComplete}\n      aria-valuemin={0}\n      aria-valuemax={100}\n      height=\"2px\"\n      position=\"relative\"\n      overflow=\"hidden\"\n      mt={0.5}\n      mb={1}\n      bg={showBackground ? \"mono30\" : \"transparent\"}\n      {...rest}\n    >\n      <Box\n        bg={highlight}\n        width=\"100%\"\n        height=\"100%\"\n        style={{\n          transition,\n          transform: `translateX(-${100 - percentComplete}%)`,\n          backfaceVisibility: \"hidden\",\n        }}\n      />\n    </Box>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"ProgressBar.js","names":["_react","_interopRequireDefault","require","_Box","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","ProgressBar","exports","_ref","percentComplete","_ref$highlight","highlight","_ref$showBackground","showBackground","_ref$transition","transition","rest","createElement","Box","tabIndex","role","height","position","overflow","mt","mb","bg","width","style","transform","concat","backfaceVisibility","displayName"],"sources":["../../../src/elements/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import React from \"react\"\nimport { Color } from \"../../themes/types\"\nimport { Box, BoxProps } from \"../Box\"\n\nexport interface ProgressBarProps extends BoxProps {\n  percentComplete: number\n  highlight?: Color\n  showBackground?: boolean\n  transition?: string\n}\n\n/** ProgressBar */\nexport const ProgressBar: React.FC<\n  React.PropsWithChildren<ProgressBarProps>\n> = ({\n  percentComplete,\n  highlight = \"brand\",\n  showBackground = true,\n  transition = \"transform 1s ease\",\n  ...rest\n}) => {\n  return (\n    <Box\n      tabIndex={0}\n      role=\"progressbar\"\n      aria-valuenow={percentComplete}\n      aria-valuemin={0}\n      aria-valuemax={100}\n      height=\"2px\"\n      position=\"relative\"\n      overflow=\"hidden\"\n      mt={0.5}\n      mb={1}\n      bg={showBackground ? \"mono30\" : \"transparent\"}\n      {...rest}\n    >\n      <Box\n        bg={highlight}\n        width=\"100%\"\n        height=\"100%\"\n        style={{\n          transition,\n          transform: `translateX(-${100 - percentComplete}%)`,\n          backfaceVisibility: \"hidden\",\n        }}\n      />\n    </Box>\n  )\n}\n"],"mappings":"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"}

package/dist/elements/ProgressBar/ProgressBar.story.js

@@ -13,14 +13,13 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 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 = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+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 = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-var _default = {
+var _default = exports.default = {
   title: "Components/ProgressBar"
 };
-exports.default = _default;
-var Default = function Default() {
+var Default = exports.Default = function Default() {
   return /*#__PURE__*/_react.default.createElement(_storybookStates.States, {
     states: [{
       percentComplete: 0
@@ -41,9 +40,8 @@ var Default = function Default() {
     percentComplete: 40
   }));
 };
-exports.Default = Default;
 Default.displayName = "Default";
-var Demo = function Demo() {
+var Demo = exports.Demo = function Demo() {
   var _useState = (0, _react.useState)(0),
     _useState2 = _slicedToArray(_useState, 2),
     progress = _useState2[0],
@@ -60,7 +58,6 @@ var Demo = function Demo() {
     percentComplete: progress
   }));
 };
-exports.Demo = Demo;
 Demo.displayName = "Demo";
 Demo.story = {
   parameters: {

package/dist/elements/ProgressBar/ProgressBar.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBar.story.js","names":["_react","_interopRequireWildcard","require","_storybookStates","_ProgressBar","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_slicedToArray","arr","i","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","length","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_default","title","exports","Default","createElement","States","states","percentComplete","highlight","showBackground","ProgressBar","displayName","Demo","_useState","useState","_useState2","progress","setProgress","useEffect","timer","setInterval","Math","floor","random","clearInterval","story","parameters","chromatic","disable"],"sources":["../../../src/elements/ProgressBar/ProgressBar.story.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\"\nimport { States } from \"storybook-states\"\nimport { ProgressBar, ProgressBarProps } from \"./ProgressBar\"\n\nexport default {\n  title: \"Components/ProgressBar\",\n}\n\nexport const Default = () => {\n  return (\n    <States<ProgressBarProps>\n      states={[\n        { percentComplete: 0 },\n        { percentComplete: 1 },\n        { percentComplete: 50 },\n        { percentComplete: 100 },\n        { percentComplete: 50, highlight: \"red100\" },\n        { percentComplete: 50, showBackground: false },\n      ]}\n    >\n      <ProgressBar percentComplete={40} />\n    </States>\n  )\n}\n\nexport const Demo = () => {\n  const [progress, setProgress] = useState(0)\n\n  useEffect(() => {\n    const timer = setInterval(\n      () => setProgress(Math.floor(Math.random() * Math.floor(100))),\n      500\n    )\n    return () => clearInterval(timer)\n  }, [])\n\n  return (\n    <States<Partial<ProgressBarProps>>>\n      <ProgressBar percentComplete={progress} />\n    </States>\n  )\n}\n\nDemo.story = {\n  parameters: { chromatic: { disable: true } },\n}\n"],"mappings":"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"}
+{"version":3,"file":"ProgressBar.story.js","names":["_react","_interopRequireWildcard","require","_storybookStates","_ProgressBar","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_slicedToArray","arr","i","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","length","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_default","exports","title","Default","createElement","States","states","percentComplete","highlight","showBackground","ProgressBar","displayName","Demo","_useState","useState","_useState2","progress","setProgress","useEffect","timer","setInterval","Math","floor","random","clearInterval","story","parameters","chromatic","disable"],"sources":["../../../src/elements/ProgressBar/ProgressBar.story.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\"\nimport { States } from \"storybook-states\"\nimport { ProgressBar, ProgressBarProps } from \"./ProgressBar\"\n\nexport default {\n  title: \"Components/ProgressBar\",\n}\n\nexport const Default = () => {\n  return (\n    <States<ProgressBarProps>\n      states={[\n        { percentComplete: 0 },\n        { percentComplete: 1 },\n        { percentComplete: 50 },\n        { percentComplete: 100 },\n        { percentComplete: 50, highlight: \"red100\" },\n        { percentComplete: 50, showBackground: false },\n      ]}\n    >\n      <ProgressBar percentComplete={40} />\n    </States>\n  )\n}\n\nexport const Demo = () => {\n  const [progress, setProgress] = useState(0)\n\n  useEffect(() => {\n    const timer = setInterval(\n      () => setProgress(Math.floor(Math.random() * Math.floor(100))),\n      500\n    )\n    return () => clearInterval(timer)\n  }, [])\n\n  return (\n    <States<Partial<ProgressBarProps>>>\n      <ProgressBar percentComplete={progress} />\n    </States>\n  )\n}\n\nDemo.story = {\n  parameters: { chromatic: { disable: true } },\n}\n"],"mappings":"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"}

package/dist/elements/ProgressDots/ProgressDots.d.ts

@@ -11,7 +11,7 @@ declare const VARIANTS: {
         flex: number;
     };
 };
-declare type Variant = keyof typeof VARIANTS;
+type Variant = keyof typeof VARIANTS;
 /** ProgressDotsProps */
 export interface ProgressDotsProps extends BoxProps {
     activeIndex: number;

package/dist/elements/ProgressDots/ProgressDots.js

@@ -32,7 +32,7 @@ var VARIANTS = {
 /**
  * Renders an `amount` of dots and announces progress when updated
  */
-var ProgressDots = function ProgressDots(_ref) {
+var ProgressDots = exports.ProgressDots = function ProgressDots(_ref) {
   var activeIndex = _ref.activeIndex,
     amount = _ref.amount,
     _ref$variant = _ref.variant,
@@ -76,7 +76,6 @@ var ProgressDots = function ProgressDots(_ref) {
     "aria-atomic": "true"
   }, "Page ", activeIndex + 1, " of ", amount));
 };
-exports.ProgressDots = ProgressDots;
 var Indicator = (0, _styledComponents.default)(_Box.Box).withConfig({
   displayName: "ProgressDots__Indicator",
   componentId: "sc-1ri84c3-0"

package/dist/elements/ProgressDots/ProgressDots.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressDots.js","names":["_react","_interopRequireDefault","require","_styledComponents","_styledSystem","_Box","_Clickable","_VisuallyHidden","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","VARIANTS","dot","width","height","borderRadius","dash","flex","ProgressDots","_ref","activeIndex","amount","_ref$variant","variant","indicatorVariant","onClick","rest","createElement","Fragment","Box","role","display","alignItems","justifyContent","my","Array","from","map","_","indicator","Indicator","bg","mx","handleClick","Clickable","position","top","bottom","left","VisuallyHidden","exports","styled","withConfig","displayName","componentId","variants"],"sources":["../../../src/elements/ProgressDots/ProgressDots.tsx"],"sourcesContent":["import React from \"react\"\nimport styled from \"styled-components\"\nimport { variant } from \"styled-system\"\nimport { Box, BoxProps } from \"../Box\"\nimport { Clickable } from \"../Clickable\"\nimport { VisuallyHidden } from \"../VisuallyHidden\"\n\nconst VARIANTS = {\n  dot: {\n    width: \"5px\",\n    height: \"5px\",\n    borderRadius: \"50%\",\n  },\n  dash: {\n    height: \"1px\",\n    flex: 1,\n  },\n}\n\ntype Variant = keyof typeof VARIANTS\n\n/** ProgressDotsProps */\nexport interface ProgressDotsProps extends BoxProps {\n  activeIndex: number\n  amount: number\n  variant?: Variant\n  onClick?: (index: number) => void\n}\n\n/**\n * Renders an `amount` of dots and announces progress when updated\n */\nexport const ProgressDots: React.FC<\n  React.PropsWithChildren<ProgressDotsProps>\n> = ({\n  activeIndex,\n  amount,\n  variant: indicatorVariant = \"dot\",\n  onClick,\n  ...rest\n}) => {\n  return (\n    <>\n      <Box\n        role=\"presentation\"\n        display=\"flex\"\n        alignItems=\"center\"\n        justifyContent=\"center\"\n        my={0.5}\n        {...rest}\n      >\n        {Array.from(Array(amount)).map((_, i) => {\n          const indicator = (\n            <Indicator\n              key={i}\n              variant={indicatorVariant}\n              bg={i === activeIndex ? \"mono100\" : \"mono30\"}\n              mx={0.5}\n            />\n          )\n\n          const handleClick = () => onClick && onClick(i)\n\n          if (onClick) {\n            return (\n              <Clickable\n                key={i}\n                display=\"block\"\n                position=\"relative\"\n                width={indicatorVariant === \"dash\" ? \"100%\" : \"auto\"}\n                onClick={handleClick}\n              >\n                {/* Pads out hit area. */}\n                <Box\n                  position=\"absolute\"\n                  top={-10}\n                  bottom={-10}\n                  left={0}\n                  width=\"100%\"\n                />\n\n                {indicator}\n              </Clickable>\n            )\n          }\n\n          return indicator\n        })}\n      </Box>\n\n      <VisuallyHidden aria-live=\"polite\" aria-atomic=\"true\">\n        Page {activeIndex + 1} of {amount}\n      </VisuallyHidden>\n    </>\n  )\n}\n\nconst Indicator = styled(Box)<{\n  variant: Variant\n  onClick?: (index: number) => void\n}>`\n  ${variant({ variants: VARIANTS })}\n  transition: background-color 250ms;\n`\n\nIndicator.displayName = \"Indicator\"\n"],"mappings":"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"}
+{"version":3,"file":"ProgressDots.js","names":["_react","_interopRequireDefault","require","_styledComponents","_styledSystem","_Box","_Clickable","_VisuallyHidden","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","VARIANTS","dot","width","height","borderRadius","dash","flex","ProgressDots","exports","_ref","activeIndex","amount","_ref$variant","variant","indicatorVariant","onClick","rest","createElement","Fragment","Box","role","display","alignItems","justifyContent","my","Array","from","map","_","indicator","Indicator","bg","mx","handleClick","Clickable","position","top","bottom","left","VisuallyHidden","styled","withConfig","displayName","componentId","variants"],"sources":["../../../src/elements/ProgressDots/ProgressDots.tsx"],"sourcesContent":["import React from \"react\"\nimport styled from \"styled-components\"\nimport { variant } from \"styled-system\"\nimport { Box, BoxProps } from \"../Box\"\nimport { Clickable } from \"../Clickable\"\nimport { VisuallyHidden } from \"../VisuallyHidden\"\n\nconst VARIANTS = {\n  dot: {\n    width: \"5px\",\n    height: \"5px\",\n    borderRadius: \"50%\",\n  },\n  dash: {\n    height: \"1px\",\n    flex: 1,\n  },\n}\n\ntype Variant = keyof typeof VARIANTS\n\n/** ProgressDotsProps */\nexport interface ProgressDotsProps extends BoxProps {\n  activeIndex: number\n  amount: number\n  variant?: Variant\n  onClick?: (index: number) => void\n}\n\n/**\n * Renders an `amount` of dots and announces progress when updated\n */\nexport const ProgressDots: React.FC<\n  React.PropsWithChildren<ProgressDotsProps>\n> = ({\n  activeIndex,\n  amount,\n  variant: indicatorVariant = \"dot\",\n  onClick,\n  ...rest\n}) => {\n  return (\n    <>\n      <Box\n        role=\"presentation\"\n        display=\"flex\"\n        alignItems=\"center\"\n        justifyContent=\"center\"\n        my={0.5}\n        {...rest}\n      >\n        {Array.from(Array(amount)).map((_, i) => {\n          const indicator = (\n            <Indicator\n              key={i}\n              variant={indicatorVariant}\n              bg={i === activeIndex ? \"mono100\" : \"mono30\"}\n              mx={0.5}\n            />\n          )\n\n          const handleClick = () => onClick && onClick(i)\n\n          if (onClick) {\n            return (\n              <Clickable\n                key={i}\n                display=\"block\"\n                position=\"relative\"\n                width={indicatorVariant === \"dash\" ? \"100%\" : \"auto\"}\n                onClick={handleClick}\n              >\n                {/* Pads out hit area. */}\n                <Box\n                  position=\"absolute\"\n                  top={-10}\n                  bottom={-10}\n                  left={0}\n                  width=\"100%\"\n                />\n\n                {indicator}\n              </Clickable>\n            )\n          }\n\n          return indicator\n        })}\n      </Box>\n\n      <VisuallyHidden aria-live=\"polite\" aria-atomic=\"true\">\n        Page {activeIndex + 1} of {amount}\n      </VisuallyHidden>\n    </>\n  )\n}\n\nconst Indicator = styled(Box)<{\n  variant: Variant\n  onClick?: (index: number) => void\n}>`\n  ${variant({ variants: VARIANTS })}\n  transition: background-color 250ms;\n`\n\nIndicator.displayName = \"Indicator\"\n"],"mappings":"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"}

package/dist/elements/ProgressDots/ProgressDots.story.js

@@ -14,14 +14,13 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 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 = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+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 = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-var _default = {
+var _default = exports.default = {
   title: "Components/ProgressDots"
 };
-exports.default = _default;
-var Default = function Default() {
+var Default = exports.Default = function Default() {
   return /*#__PURE__*/_react.default.createElement(_storybookStates.States, {
     states: [{
       activeIndex: 0,
@@ -62,9 +61,8 @@ var Default = function Default() {
     amount: 5
   }));
 };
-exports.Default = Default;
 Default.displayName = "Default";
-var Demo = function Demo() {
+var Demo = exports.Demo = function Demo() {
   var _useState = (0, _react.useState)(0),
     _useState2 = _slicedToArray(_useState, 2),
     index = _useState2[0],
@@ -82,7 +80,6 @@ var Demo = function Demo() {
     onClick: setIndex
   }));
 };
-exports.Demo = Demo;
 Demo.story = {
   parameters: {
     chromatic: {

package/dist/elements/ProgressDots/ProgressDots.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressDots.story.js","names":["_addonActions","require","_react","_interopRequireWildcard","_storybookStates","_ProgressDots","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_slicedToArray","arr","i","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","length","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_default","title","exports","Default","createElement","States","states","activeIndex","amount","variant","onClick","action","ProgressDots","displayName","Demo","_useState","useState","_useState2","index","setIndex","Fragment","my","story","parameters","chromatic","disable"],"sources":["../../../src/elements/ProgressDots/ProgressDots.story.tsx"],"sourcesContent":["import { action } from \"@storybook/addon-actions\"\nimport React, { useState } from \"react\"\nimport { States } from \"storybook-states\"\nimport { ProgressDots, ProgressDotsProps } from \"./ProgressDots\"\n\nexport default {\n  title: \"Components/ProgressDots\",\n}\n\nexport const Default = () => {\n  return (\n    <States<ProgressDotsProps>\n      states={[\n        { activeIndex: 0, amount: 5 },\n        { activeIndex: 2, amount: 5 },\n        { activeIndex: 4, amount: 5 },\n        { activeIndex: 0, amount: 25 },\n        { variant: \"dash\", activeIndex: 0, amount: 5 },\n        { variant: \"dash\", activeIndex: 2, amount: 5 },\n        { variant: \"dash\", activeIndex: 4, amount: 5 },\n        { variant: \"dash\", activeIndex: 0, amount: 25 },\n        {\n          variant: \"dash\",\n          activeIndex: 0,\n          amount: 5,\n          onClick: action(\"onClick\"),\n        },\n      ]}\n    >\n      <ProgressDots activeIndex={0} amount={5} />\n    </States>\n  )\n}\n\nexport const Demo = () => {\n  const [index, setIndex] = useState(0)\n\n  return (\n    <>\n      <ProgressDots activeIndex={index} amount={5} my={2} onClick={setIndex} />\n\n      <ProgressDots\n        variant=\"dash\"\n        activeIndex={index}\n        amount={5}\n        my={2}\n        onClick={setIndex}\n      />\n    </>\n  )\n}\n\nDemo.story = {\n  parameters: { chromatic: { disable: true } },\n}\n"],"mappings":"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"}
+{"version":3,"file":"ProgressDots.story.js","names":["_addonActions","require","_react","_interopRequireWildcard","_storybookStates","_ProgressDots","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_slicedToArray","arr","i","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","length","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_default","exports","title","Default","createElement","States","states","activeIndex","amount","variant","onClick","action","ProgressDots","displayName","Demo","_useState","useState","_useState2","index","setIndex","Fragment","my","story","parameters","chromatic","disable"],"sources":["../../../src/elements/ProgressDots/ProgressDots.story.tsx"],"sourcesContent":["import { action } from \"@storybook/addon-actions\"\nimport React, { useState } from \"react\"\nimport { States } from \"storybook-states\"\nimport { ProgressDots, ProgressDotsProps } from \"./ProgressDots\"\n\nexport default {\n  title: \"Components/ProgressDots\",\n}\n\nexport const Default = () => {\n  return (\n    <States<ProgressDotsProps>\n      states={[\n        { activeIndex: 0, amount: 5 },\n        { activeIndex: 2, amount: 5 },\n        { activeIndex: 4, amount: 5 },\n        { activeIndex: 0, amount: 25 },\n        { variant: \"dash\", activeIndex: 0, amount: 5 },\n        { variant: \"dash\", activeIndex: 2, amount: 5 },\n        { variant: \"dash\", activeIndex: 4, amount: 5 },\n        { variant: \"dash\", activeIndex: 0, amount: 25 },\n        {\n          variant: \"dash\",\n          activeIndex: 0,\n          amount: 5,\n          onClick: action(\"onClick\"),\n        },\n      ]}\n    >\n      <ProgressDots activeIndex={0} amount={5} />\n    </States>\n  )\n}\n\nexport const Demo = () => {\n  const [index, setIndex] = useState(0)\n\n  return (\n    <>\n      <ProgressDots activeIndex={index} amount={5} my={2} onClick={setIndex} />\n\n      <ProgressDots\n        variant=\"dash\"\n        activeIndex={index}\n        amount={5}\n        my={2}\n        onClick={setIndex}\n      />\n    </>\n  )\n}\n\nDemo.story = {\n  parameters: { chromatic: { disable: true } },\n}\n"],"mappings":"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"}

package/dist/elements/Radio/Radio.js

@@ -20,7 +20,7 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 /** A Radio button */
-var Radio = function Radio(_ref) {
+var Radio = exports.Radio = function Radio(_ref) {
   var children = _ref.children,
     disabled = _ref.disabled,
     hover = _ref.hover,
@@ -90,7 +90,6 @@ var Radio = function Radio(_ref) {
     color: "mono60"
   }, description) : description));
 };
-exports.Radio = Radio;
 Radio.displayName = "Radio";
 var Container = (0, _styledComponents.default)(_Flex.Flex).withConfig({
   displayName: "Radio__Container",

package/dist/elements/Radio/Radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.js","names":["_react","_interopRequireDefault","require","_styledComponents","_interopRequireWildcard","_Flex","_isText","_Text","_RadioDot","_tokens","_excluded","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Radio","_ref","children","disabled","hover","focus","error","label","selected","value","_ref$size","size","onSelect","rest","handleClick","handleKeyPress","event","preventDefault","title","description","createElement","Container","as","alignItems","role","onClick","tabIndex","onKeyPress","Flex","height","RADIO_SIZES","dotSize","width","alignSelf","mr","RadioDot","flexDirection","flex","isText","Text","variant","labelFontSize","lineHeight","undefined","descriptionFontSize","color","exports","displayName","styled","withConfig","componentId","props","css","RADIO_STATES","RADIO_DOT_STATES","resting"],"sources":["../../../src/elements/Radio/Radio.tsx"],"sourcesContent":["import React from \"react\"\nimport styled, { css } from \"styled-components\"\nimport { Flex, FlexProps } from \"../../elements/Flex\"\nimport { isText } from \"../../helpers/isText\"\nimport { Text } from \"../Text\"\nimport { RadioDot } from \"./RadioDot\"\nimport { RADIO_DOT_STATES, RADIO_STATES, RADIO_SIZES } from \"./tokens\"\n\nexport interface RadioProps<T>\n  extends FlexProps,\n    Omit<React.HTMLAttributes<HTMLDivElement>, \"onSelect\"> {\n  /** Disable interactions */\n  disabled?: boolean\n  /** Select the button on render. If the Radio is inside a RadioGroup, use RadioGroup.defaultValue instead. */\n  selected?: boolean\n  /** Show an error indicator */\n  error?: boolean\n  /** Show hover state on render */\n  hover?: boolean\n  /** Forces focus state */\n  focus?: boolean\n  /** Value of radio button */\n  value?: T\n  /** Name of the radio button */\n  name?: string\n  /** The label content, if not specified the children will be used  */\n  label?: React.ReactNode\n  /** The radio size, if not specified, \"sm\" will be used  */\n  size?: keyof typeof RADIO_SIZES\n  /** Callback when selected */\n  onSelect?: (selected: { selected: boolean; value: T }) => void\n}\n\n/** A Radio button */\nexport const Radio = <T,>({\n  children,\n  disabled,\n  hover,\n  focus,\n  error,\n  label,\n  selected,\n  value,\n  size = \"sm\",\n  onSelect,\n  ...rest\n}: RadioProps<T>) => {\n  const handleClick = () => {\n    onSelect && onSelect({ selected: !selected, value: value! })\n  }\n\n  const handleKeyPress = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key === \" \") {\n      event.preventDefault()\n      onSelect && onSelect({ selected: !selected, value: value! })\n    }\n  }\n\n  // TODO: Re-name props to match <Input />\n  const title = label ? label : children\n  const description = label ? children : null\n\n  return (\n    <Container\n      as=\"label\"\n      alignItems=\"center\"\n      role=\"radio\"\n      aria-checked={selected}\n      onClick={handleClick}\n      tabIndex={disabled ? -1 : 0}\n      onKeyPress={handleKeyPress}\n      disabled={disabled}\n      hover={hover}\n      focus={focus}\n      selected={selected}\n      error={error}\n      {...rest}\n    >\n      <Flex\n        height={RADIO_SIZES[size].dotSize}\n        width={RADIO_SIZES[size].dotSize}\n        alignSelf=\"start\"\n        mr={1}\n      >\n        <RadioDot\n          disabled={disabled}\n          hover={hover}\n          focus={focus}\n          selected={selected}\n          error={error}\n        />\n      </Flex>\n\n      <Flex flexDirection=\"column\" flex={1}>\n        <Flex alignItems=\"center\" flex={1}>\n          {isText(title) ? (\n            <Text\n              variant={RADIO_SIZES[size].labelFontSize}\n              lineHeight={description ? undefined : 1}\n            >\n              {title}\n            </Text>\n          ) : (\n            title\n          )}\n        </Flex>\n\n        {isText(description) ? (\n          <Text variant={RADIO_SIZES[size].descriptionFontSize} color=\"mono60\">\n            {description}\n          </Text>\n        ) : (\n          description\n        )}\n      </Flex>\n    </Container>\n  )\n}\n\nconst Container = styled(Flex)<{\n  disabled?: boolean\n  error?: boolean\n  hover?: boolean\n  focus?: boolean\n  selected?: boolean\n  as?: React.ElementType\n}>`\n  ${(props) => {\n    return css`\n      ${props.selected ? RADIO_STATES.selected : RADIO_STATES.default}\n      ${props.focus && RADIO_STATES.focus}\n      ${props.hover && RADIO_STATES.hover}\n      ${props.disabled && RADIO_STATES.disabled}\n      ${props.error && RADIO_STATES.error}\n\n      &:hover {\n        ${!props.error &&\n        !props.disabled &&\n        css`\n          ${RADIO_STATES.hover}\n\n          // Radio\n          > ${RadioDot} {\n            ${props.selected\n              ? RADIO_DOT_STATES.hover.selected\n              : RADIO_DOT_STATES.hover.resting}\n          }\n        `}\n      }\n\n      &:focus {\n        ${RADIO_STATES.focus}\n\n        // Radio\n        > ${RadioDot} {\n          ${props.selected\n            ? RADIO_DOT_STATES.focus.selected\n            : RADIO_DOT_STATES.focus.resting}\n        }\n      }\n\n      &:disabled {\n        pointer-events: none;\n        ${RADIO_STATES.disabled}\n      }\n    `\n  }}\n`\n"],"mappings":"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"}
+{"version":3,"file":"Radio.js","names":["_react","_interopRequireDefault","require","_styledComponents","_interopRequireWildcard","_Flex","_isText","_Text","_RadioDot","_tokens","_excluded","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Radio","exports","_ref","children","disabled","hover","focus","error","label","selected","value","_ref$size","size","onSelect","rest","handleClick","handleKeyPress","event","preventDefault","title","description","createElement","Container","as","alignItems","role","onClick","tabIndex","onKeyPress","Flex","height","RADIO_SIZES","dotSize","width","alignSelf","mr","RadioDot","flexDirection","flex","isText","Text","variant","labelFontSize","lineHeight","undefined","descriptionFontSize","color","displayName","styled","withConfig","componentId","props","css","RADIO_STATES","RADIO_DOT_STATES","resting"],"sources":["../../../src/elements/Radio/Radio.tsx"],"sourcesContent":["import React from \"react\"\nimport styled, { css } from \"styled-components\"\nimport { Flex, FlexProps } from \"../../elements/Flex\"\nimport { isText } from \"../../helpers/isText\"\nimport { Text } from \"../Text\"\nimport { RadioDot } from \"./RadioDot\"\nimport { RADIO_DOT_STATES, RADIO_STATES, RADIO_SIZES } from \"./tokens\"\n\nexport interface RadioProps<T>\n  extends FlexProps,\n    Omit<React.HTMLAttributes<HTMLDivElement>, \"onSelect\"> {\n  /** Disable interactions */\n  disabled?: boolean\n  /** Select the button on render. If the Radio is inside a RadioGroup, use RadioGroup.defaultValue instead. */\n  selected?: boolean\n  /** Show an error indicator */\n  error?: boolean\n  /** Show hover state on render */\n  hover?: boolean\n  /** Forces focus state */\n  focus?: boolean\n  /** Value of radio button */\n  value?: T\n  /** Name of the radio button */\n  name?: string\n  /** The label content, if not specified the children will be used  */\n  label?: React.ReactNode\n  /** The radio size, if not specified, \"sm\" will be used  */\n  size?: keyof typeof RADIO_SIZES\n  /** Callback when selected */\n  onSelect?: (selected: { selected: boolean; value: T }) => void\n}\n\n/** A Radio button */\nexport const Radio = <T,>({\n  children,\n  disabled,\n  hover,\n  focus,\n  error,\n  label,\n  selected,\n  value,\n  size = \"sm\",\n  onSelect,\n  ...rest\n}: RadioProps<T>) => {\n  const handleClick = () => {\n    onSelect && onSelect({ selected: !selected, value: value! })\n  }\n\n  const handleKeyPress = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key === \" \") {\n      event.preventDefault()\n      onSelect && onSelect({ selected: !selected, value: value! })\n    }\n  }\n\n  // TODO: Re-name props to match <Input />\n  const title = label ? label : children\n  const description = label ? children : null\n\n  return (\n    <Container\n      as=\"label\"\n      alignItems=\"center\"\n      role=\"radio\"\n      aria-checked={selected}\n      onClick={handleClick}\n      tabIndex={disabled ? -1 : 0}\n      onKeyPress={handleKeyPress}\n      disabled={disabled}\n      hover={hover}\n      focus={focus}\n      selected={selected}\n      error={error}\n      {...rest}\n    >\n      <Flex\n        height={RADIO_SIZES[size].dotSize}\n        width={RADIO_SIZES[size].dotSize}\n        alignSelf=\"start\"\n        mr={1}\n      >\n        <RadioDot\n          disabled={disabled}\n          hover={hover}\n          focus={focus}\n          selected={selected}\n          error={error}\n        />\n      </Flex>\n\n      <Flex flexDirection=\"column\" flex={1}>\n        <Flex alignItems=\"center\" flex={1}>\n          {isText(title) ? (\n            <Text\n              variant={RADIO_SIZES[size].labelFontSize}\n              lineHeight={description ? undefined : 1}\n            >\n              {title}\n            </Text>\n          ) : (\n            title\n          )}\n        </Flex>\n\n        {isText(description) ? (\n          <Text variant={RADIO_SIZES[size].descriptionFontSize} color=\"mono60\">\n            {description}\n          </Text>\n        ) : (\n          description\n        )}\n      </Flex>\n    </Container>\n  )\n}\n\nconst Container = styled(Flex)<{\n  disabled?: boolean\n  error?: boolean\n  hover?: boolean\n  focus?: boolean\n  selected?: boolean\n  as?: React.ElementType\n}>`\n  ${(props) => {\n    return css`\n      ${props.selected ? RADIO_STATES.selected : RADIO_STATES.default}\n      ${props.focus && RADIO_STATES.focus}\n      ${props.hover && RADIO_STATES.hover}\n      ${props.disabled && RADIO_STATES.disabled}\n      ${props.error && RADIO_STATES.error}\n\n      &:hover {\n        ${!props.error &&\n        !props.disabled &&\n        css`\n          ${RADIO_STATES.hover}\n\n          // Radio\n          > ${RadioDot} {\n            ${props.selected\n              ? RADIO_DOT_STATES.hover.selected\n              : RADIO_DOT_STATES.hover.resting}\n          }\n        `}\n      }\n\n      &:focus {\n        ${RADIO_STATES.focus}\n\n        // Radio\n        > ${RadioDot} {\n          ${props.selected\n            ? RADIO_DOT_STATES.focus.selected\n            : RADIO_DOT_STATES.focus.resting}\n        }\n      }\n\n      &:disabled {\n        pointer-events: none;\n        ${RADIO_STATES.disabled}\n      }\n    `\n  }}\n`\n"],"mappings":"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"}

package/dist/elements/Radio/Radio.story.js

@@ -10,11 +10,10 @@ var _Flex = require("../Flex");
 var _Text = require("../Text");
 var _Radio = require("./Radio");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var _default = {
+var _default = exports.default = {
   title: "Components/Radio"
 };
-exports.default = _default;
-var Default = function Default() {
+var Default = exports.Default = function Default() {
   return /*#__PURE__*/_react.default.createElement(_storybookStates.States, {
     states: [{}, {
       selected: true
@@ -57,9 +56,8 @@ var Default = function Default() {
     }]
   }, /*#__PURE__*/_react.default.createElement(_Radio.Radio, null, "A label"));
 };
-exports.Default = Default;
 Default.displayName = "Default";
-var SplitLabel = function SplitLabel() {
+var SplitLabel = exports.SplitLabel = function SplitLabel() {
   return /*#__PURE__*/_react.default.createElement(_Radio.Radio, null, /*#__PURE__*/_react.default.createElement(_Flex.Flex, {
     justifyContent: "space-between",
     flex: 1
@@ -70,6 +68,5 @@ var SplitLabel = function SplitLabel() {
     color: "mono60"
   }, "Subtitle")));
 };
-exports.SplitLabel = SplitLabel;
 SplitLabel.displayName = "SplitLabel";
 //# sourceMappingURL=Radio.story.js.map

package/dist/elements/Radio/Radio.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.story.js","names":["_react","_interopRequireDefault","require","_storybookStates","_Flex","_Text","_Radio","obj","__esModule","default","_default","title","exports","Default","createElement","States","states","selected","focus","hover","disabled","error","label","width","children","size","Radio","displayName","SplitLabel","Flex","justifyContent","flex","Text","variant","color"],"sources":["../../../src/elements/Radio/Radio.story.tsx"],"sourcesContent":["import React from \"react\"\nimport { States } from \"storybook-states\"\nimport { Flex } from \"../Flex\"\nimport { Text } from \"../Text\"\nimport { Radio, RadioProps } from \"./Radio\"\n\nexport default {\n  title: \"Components/Radio\",\n}\n\nexport const Default = () => {\n  return (\n    <States<RadioProps<string>>\n      states={[\n        {},\n        { selected: true },\n        { focus: true },\n        { focus: true, selected: true },\n        { hover: true },\n        { hover: true, selected: true },\n        { disabled: true },\n        { disabled: true, selected: true },\n        { error: true },\n        { error: true, selected: true },\n        {\n          label: \"A label that takes up multiple lines\",\n          width: \"200px\",\n          children: \"This is my description\",\n        },\n        {\n          label: \"A small sized radio\",\n          size: \"sm\",\n          children: \"This is my description\",\n        },\n        {\n          label: \"A medium sized radio\",\n          size: \"md\",\n          children: \"This is my description\",\n        },\n        {\n          label: \"A large sized radio\",\n          size: \"lg\",\n          children: \"This is my description\",\n        },\n      ]}\n    >\n      <Radio>A label</Radio>\n    </States>\n  )\n}\n\nexport const SplitLabel = () => {\n  return (\n    <Radio>\n      <Flex justifyContent=\"space-between\" flex={1}>\n        <Text variant=\"sm-display\">Label</Text>\n\n        <Text variant=\"xs\" color=\"mono60\">\n          Subtitle\n        </Text>\n      </Flex>\n    </Radio>\n  )\n}\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,gBAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AAA2C,SAAAD,uBAAAM,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,IAAAG,QAAA,GAE5B;EACbC,KAAK,EAAE;AACT,CAAC;AAAAC,OAAA,CAAAH,OAAA,GAAAC,QAAA;AAEM,IAAMG,OAAO,GAAG,SAAVA,OAAOA,CAAA,EAAS;EAC3B,oBACEb,MAAA,CAAAS,OAAA,CAAAK,aAAA,CAACX,gBAAA,CAAAY,MAAM;IACLC,MAAM,EAAE,CACN,CAAC,CAAC,EACF;MAAEC,QAAQ,EAAE;IAAK,CAAC,EAClB;MAAEC,KAAK,EAAE;IAAK,CAAC,EACf;MAAEA,KAAK,EAAE,IAAI;MAAED,QAAQ,EAAE;IAAK,CAAC,EAC/B;MAAEE,KAAK,EAAE;IAAK,CAAC,EACf;MAAEA,KAAK,EAAE,IAAI;MAAEF,QAAQ,EAAE;IAAK,CAAC,EAC/B;MAAEG,QAAQ,EAAE;IAAK,CAAC,EAClB;MAAEA,QAAQ,EAAE,IAAI;MAAEH,QAAQ,EAAE;IAAK,CAAC,EAClC;MAAEI,KAAK,EAAE;IAAK,CAAC,EACf;MAAEA,KAAK,EAAE,IAAI;MAAEJ,QAAQ,EAAE;IAAK,CAAC,EAC/B;MACEK,KAAK,EAAE,sCAAsC;MAC7CC,KAAK,EAAE,OAAO;MACdC,QAAQ,EAAE;IACZ,CAAC,EACD;MACEF,KAAK,EAAE,qBAAqB;MAC5BG,IAAI,EAAE,IAAI;MACVD,QAAQ,EAAE;IACZ,CAAC,EACD;MACEF,KAAK,EAAE,sBAAsB;MAC7BG,IAAI,EAAE,IAAI;MACVD,QAAQ,EAAE;IACZ,CAAC,EACD;MACEF,KAAK,EAAE,qBAAqB;MAC5BG,IAAI,EAAE,IAAI;MACVD,QAAQ,EAAE;IACZ,CAAC;EACD,gBAEFxB,MAAA,CAAAS,OAAA,CAAAK,aAAA,CAACR,MAAA,CAAAoB,KAAK,QAAC,SAAO,CAAQ,CACf;AAEb,CAAC;AAAAd,OAAA,CAAAC,OAAA,GAAAA,OAAA;AAvCYA,OAAO,CAAAc,WAAA;AAyCb,IAAMC,UAAU,GAAG,SAAbA,UAAUA,CAAA,EAAS;EAC9B,oBACE5B,MAAA,CAAAS,OAAA,CAAAK,aAAA,CAACR,MAAA,CAAAoB,KAAK,qBACJ1B,MAAA,CAAAS,OAAA,CAAAK,aAAA,CAACV,KAAA,CAAAyB,IAAI;IAACC,cAAc,EAAC,eAAe;IAACC,IAAI,EAAE;EAAE,gBAC3C/B,MAAA,CAAAS,OAAA,CAAAK,aAAA,CAACT,KAAA,CAAA2B,IAAI;IAACC,OAAO,EAAC;EAAY,GAAC,OAAK,CAAO,eAEvCjC,MAAA,CAAAS,OAAA,CAAAK,aAAA,CAACT,KAAA,CAAA2B,IAAI;IAACC,OAAO,EAAC,IAAI;IAACC,KAAK,EAAC;EAAQ,GAAC,UAElC,CAAO,CACF,CACD;AAEZ,CAAC;AAAAtB,OAAA,CAAAgB,UAAA,GAAAA,UAAA;AAZYA,UAAU,CAAAD,WAAA"}
+{"version":3,"file":"Radio.story.js","names":["_react","_interopRequireDefault","require","_storybookStates","_Flex","_Text","_Radio","obj","__esModule","default","_default","exports","title","Default","createElement","States","states","selected","focus","hover","disabled","error","label","width","children","size","Radio","displayName","SplitLabel","Flex","justifyContent","flex","Text","variant","color"],"sources":["../../../src/elements/Radio/Radio.story.tsx"],"sourcesContent":["import React from \"react\"\nimport { States } from \"storybook-states\"\nimport { Flex } from \"../Flex\"\nimport { Text } from \"../Text\"\nimport { Radio, RadioProps } from \"./Radio\"\n\nexport default {\n  title: \"Components/Radio\",\n}\n\nexport const Default = () => {\n  return (\n    <States<RadioProps<string>>\n      states={[\n        {},\n        { selected: true },\n        { focus: true },\n        { focus: true, selected: true },\n        { hover: true },\n        { hover: true, selected: true },\n        { disabled: true },\n        { disabled: true, selected: true },\n        { error: true },\n        { error: true, selected: true },\n        {\n          label: \"A label that takes up multiple lines\",\n          width: \"200px\",\n          children: \"This is my description\",\n        },\n        {\n          label: \"A small sized radio\",\n          size: \"sm\",\n          children: \"This is my description\",\n        },\n        {\n          label: \"A medium sized radio\",\n          size: \"md\",\n          children: \"This is my description\",\n        },\n        {\n          label: \"A large sized radio\",\n          size: \"lg\",\n          children: \"This is my description\",\n        },\n      ]}\n    >\n      <Radio>A label</Radio>\n    </States>\n  )\n}\n\nexport const SplitLabel = () => {\n  return (\n    <Radio>\n      <Flex justifyContent=\"space-between\" flex={1}>\n        <Text variant=\"sm-display\">Label</Text>\n\n        <Text variant=\"xs\" color=\"mono60\">\n          Subtitle\n        </Text>\n      </Flex>\n    </Radio>\n  )\n}\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,gBAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AAA2C,SAAAD,uBAAAM,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,IAAAG,QAAA,GAAAC,OAAA,CAAAF,OAAA,GAE5B;EACbG,KAAK,EAAE;AACT,CAAC;AAEM,IAAMC,OAAO,GAAAF,OAAA,CAAAE,OAAA,GAAG,SAAVA,OAAOA,CAAA,EAAS;EAC3B,oBACEb,MAAA,CAAAS,OAAA,CAAAK,aAAA,CAACX,gBAAA,CAAAY,MAAM;IACLC,MAAM,EAAE,CACN,CAAC,CAAC,EACF;MAAEC,QAAQ,EAAE;IAAK,CAAC,EAClB;MAAEC,KAAK,EAAE;IAAK,CAAC,EACf;MAAEA,KAAK,EAAE,IAAI;MAAED,QAAQ,EAAE;IAAK,CAAC,EAC/B;MAAEE,KAAK,EAAE;IAAK,CAAC,EACf;MAAEA,KAAK,EAAE,IAAI;MAAEF,QAAQ,EAAE;IAAK,CAAC,EAC/B;MAAEG,QAAQ,EAAE;IAAK,CAAC,EAClB;MAAEA,QAAQ,EAAE,IAAI;MAAEH,QAAQ,EAAE;IAAK,CAAC,EAClC;MAAEI,KAAK,EAAE;IAAK,CAAC,EACf;MAAEA,KAAK,EAAE,IAAI;MAAEJ,QAAQ,EAAE;IAAK,CAAC,EAC/B;MACEK,KAAK,EAAE,sCAAsC;MAC7CC,KAAK,EAAE,OAAO;MACdC,QAAQ,EAAE;IACZ,CAAC,EACD;MACEF,KAAK,EAAE,qBAAqB;MAC5BG,IAAI,EAAE,IAAI;MACVD,QAAQ,EAAE;IACZ,CAAC,EACD;MACEF,KAAK,EAAE,sBAAsB;MAC7BG,IAAI,EAAE,IAAI;MACVD,QAAQ,EAAE;IACZ,CAAC,EACD;MACEF,KAAK,EAAE,qBAAqB;MAC5BG,IAAI,EAAE,IAAI;MACVD,QAAQ,EAAE;IACZ,CAAC;EACD,gBAEFxB,MAAA,CAAAS,OAAA,CAAAK,aAAA,CAACR,MAAA,CAAAoB,KAAK,QAAC,SAAO,CAAQ,CACf;AAEb,CAAC;AAvCYb,OAAO,CAAAc,WAAA;AAyCb,IAAMC,UAAU,GAAAjB,OAAA,CAAAiB,UAAA,GAAG,SAAbA,UAAUA,CAAA,EAAS;EAC9B,oBACE5B,MAAA,CAAAS,OAAA,CAAAK,aAAA,CAACR,MAAA,CAAAoB,KAAK,qBACJ1B,MAAA,CAAAS,OAAA,CAAAK,aAAA,CAACV,KAAA,CAAAyB,IAAI;IAACC,cAAc,EAAC,eAAe;IAACC,IAAI,EAAE;EAAE,gBAC3C/B,MAAA,CAAAS,OAAA,CAAAK,aAAA,CAACT,KAAA,CAAA2B,IAAI;IAACC,OAAO,EAAC;EAAY,GAAC,OAAK,CAAO,eAEvCjC,MAAA,CAAAS,OAAA,CAAAK,aAAA,CAACT,KAAA,CAAA2B,IAAI;IAACC,OAAO,EAAC,IAAI;IAACC,KAAK,EAAC;EAAQ,GAAC,UAElC,CAAO,CACF,CACD;AAEZ,CAAC;AAZYN,UAAU,CAAAD,WAAA"}

package/dist/elements/Radio/RadioDot.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export interface CheckProps {
     disabled?: boolean;
     error?: boolean;
@@ -7,5 +6,5 @@ export interface CheckProps {
     selected?: boolean;
 }
 export declare const RadioDot: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("../Box").BoxProps> & import("../Box").BoxProps, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, CheckProps>> & string;

package/dist/elements/Radio/RadioDot.js

@@ -8,7 +8,7 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _Box = require("../Box");
 var _tokens = require("./tokens");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var RadioDot = (0, _styledComponents.default)(_Box.Box).withConfig({
+var RadioDot = exports.RadioDot = (0, _styledComponents.default)(_Box.Box).withConfig({
   displayName: "RadioDot",
   componentId: "sc-1m6kyb-0"
 })(["width:100%;height:100%;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background-color 0.25s,border-color 0.25s,color 0.25s;", ";&::after{content:\"\";display:block;width:12px;height:12px;border-radius:50%;transition:background-color 0.25s;background-color:currentColor;}"], function (props) {
@@ -28,5 +28,4 @@ var RadioDot = (0, _styledComponents.default)(_Box.Box).withConfig({
   }();
   return props.selected ? mode.selected : mode.resting;
 });
-exports.RadioDot = RadioDot;
 //# sourceMappingURL=RadioDot.js.map

package/dist/elements/Radio/RadioDot.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioDot.js","names":["_styledComponents","_interopRequireDefault","require","_Box","_tokens","obj","__esModule","default","RadioDot","styled","Box","withConfig","displayName","componentId","props","mode","disabled","RADIO_DOT_STATES","hover","focus","error","selected","resting","exports"],"sources":["../../../src/elements/Radio/RadioDot.tsx"],"sourcesContent":["import styled from \"styled-components\"\nimport { Box } from \"../Box\"\nimport { RADIO_DOT_STATES } from \"./tokens\"\n\nexport interface CheckProps {\n  disabled?: boolean\n  error?: boolean\n  hover?: boolean\n  focus?: boolean\n  selected?: boolean\n}\n\nexport const RadioDot = styled(Box)<CheckProps>`\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  transition: background-color 0.25s, border-color 0.25s, color 0.25s;\n\n  ${(props) => {\n    const mode = (() => {\n      switch (true) {\n        case props.disabled:\n          return RADIO_DOT_STATES.disabled\n        case props.hover:\n          return RADIO_DOT_STATES.hover\n        case props.focus:\n          return RADIO_DOT_STATES.focus\n        case props.error:\n          return RADIO_DOT_STATES.error\n        default:\n          return RADIO_DOT_STATES.default\n      }\n    })()\n\n    return props.selected ? mode.selected : mode.resting\n  }};\n\n  /* Dot  */\n  &::after {\n    content: \"\";\n    display: block;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    transition: background-color 0.25s;\n    background-color: currentColor;\n  }\n`\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,IAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AAA2C,SAAAD,uBAAAI,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAUpC,IAAMG,QAAQ,GAAG,IAAAC,yBAAM,EAACC,QAAG,CAAC,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,2UAU/B,UAACC,KAAK,EAAK;EACX,IAAMC,IAAI,GAAI,YAAM;IAClB,QAAQ,IAAI;MACV,KAAKD,KAAK,CAACE,QAAQ;QACjB,OAAOC,wBAAgB,CAACD,QAAQ;MAClC,KAAKF,KAAK,CAACI,KAAK;QACd,OAAOD,wBAAgB,CAACC,KAAK;MAC/B,KAAKJ,KAAK,CAACK,KAAK;QACd,OAAOF,wBAAgB,CAACE,KAAK;MAC/B,KAAKL,KAAK,CAACM,KAAK;QACd,OAAOH,wBAAgB,CAACG,KAAK;MAC/B;QACE,OAAOH,wBAAgB,CAACV,OAAO;IAAA;EAErC,CAAC,EAAG;EAEJ,OAAOO,KAAK,CAACO,QAAQ,GAAGN,IAAI,CAACM,QAAQ,GAAGN,IAAI,CAACO,OAAO;AACtD,CAAC,CAYF;AAAAC,OAAA,CAAAf,QAAA,GAAAA,QAAA"}
+{"version":3,"file":"RadioDot.js","names":["_styledComponents","_interopRequireDefault","require","_Box","_tokens","obj","__esModule","default","RadioDot","exports","styled","Box","withConfig","displayName","componentId","props","mode","disabled","RADIO_DOT_STATES","hover","focus","error","selected","resting"],"sources":["../../../src/elements/Radio/RadioDot.tsx"],"sourcesContent":["import styled from \"styled-components\"\nimport { Box } from \"../Box\"\nimport { RADIO_DOT_STATES } from \"./tokens\"\n\nexport interface CheckProps {\n  disabled?: boolean\n  error?: boolean\n  hover?: boolean\n  focus?: boolean\n  selected?: boolean\n}\n\nexport const RadioDot = styled(Box)<CheckProps>`\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  transition: background-color 0.25s, border-color 0.25s, color 0.25s;\n\n  ${(props) => {\n    const mode = (() => {\n      switch (true) {\n        case props.disabled:\n          return RADIO_DOT_STATES.disabled\n        case props.hover:\n          return RADIO_DOT_STATES.hover\n        case props.focus:\n          return RADIO_DOT_STATES.focus\n        case props.error:\n          return RADIO_DOT_STATES.error\n        default:\n          return RADIO_DOT_STATES.default\n      }\n    })()\n\n    return props.selected ? mode.selected : mode.resting\n  }};\n\n  /* Dot  */\n  &::after {\n    content: \"\";\n    display: block;\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    transition: background-color 0.25s;\n    background-color: currentColor;\n  }\n`\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,IAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AAA2C,SAAAD,uBAAAI,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAUpC,IAAMG,QAAQ,GAAAC,OAAA,CAAAD,QAAA,GAAG,IAAAE,yBAAM,EAACC,QAAG,CAAC,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,2UAU/B,UAACC,KAAK,EAAK;EACX,IAAMC,IAAI,GAAI,YAAM;IAClB,QAAQ,IAAI;MACV,KAAKD,KAAK,CAACE,QAAQ;QACjB,OAAOC,wBAAgB,CAACD,QAAQ;MAClC,KAAKF,KAAK,CAACI,KAAK;QACd,OAAOD,wBAAgB,CAACC,KAAK;MAC/B,KAAKJ,KAAK,CAACK,KAAK;QACd,OAAOF,wBAAgB,CAACE,KAAK;MAC/B,KAAKL,KAAK,CAACM,KAAK;QACd,OAAOH,wBAAgB,CAACG,KAAK;MAC/B;QACE,OAAOH,wBAAgB,CAACX,OAAO;IAAA;EAErC,CAAC,EAAG;EAEJ,OAAOQ,KAAK,CAACO,QAAQ,GAAGN,IAAI,CAACM,QAAQ,GAAGN,IAAI,CAACO,OAAO;AACtD,CAAC,CAYF"}

package/dist/elements/Radio/tokens.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.RADIO_STATES = exports.RADIO_SIZES = exports.RADIO_DOT_STATES = void 0;
 var _themeGet = require("@styled-system/theme-get");
 var _styledComponents = require("styled-components");
-var RADIO_DOT_STATES = {
+var RADIO_DOT_STATES = exports.RADIO_DOT_STATES = {
   default: {
     resting: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";"], (0, _themeGet.themeGet)("colors.mono0"), (0, _themeGet.themeGet)("colors.mono30")),
     selected: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";background-color:", ";"], (0, _themeGet.themeGet)("colors.mono0"), (0, _themeGet.themeGet)("colors.mono100"), (0, _themeGet.themeGet)("colors.mono100"))
@@ -28,8 +28,7 @@ var RADIO_DOT_STATES = {
     selected: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";background-color:", ";"], (0, _themeGet.themeGet)("colors.mono0"), (0, _themeGet.themeGet)("colors.blue100"), (0, _themeGet.themeGet)("colors.blue100"))
   }
 };
-exports.RADIO_DOT_STATES = RADIO_DOT_STATES;
-var RADIO_STATES = {
+var RADIO_STATES = exports.RADIO_STATES = {
   default: (0, _styledComponents.css)(["color:", ";"], (0, _themeGet.themeGet)("colors.mono60")),
   focus: (0, _styledComponents.css)(["color:", ";> div > div:first-of-type{text-decoration:underline;}"], (0, _themeGet.themeGet)("colors.mono100")),
   selected: (0, _styledComponents.css)(["color:", ";"], (0, _themeGet.themeGet)("colors.mono100")),
@@ -37,8 +36,7 @@ var RADIO_STATES = {
   disabled: (0, _styledComponents.css)(["pointer-events:none;color:", ";"], (0, _themeGet.themeGet)("colors.mono30")),
   error: (0, _styledComponents.css)(["color:", ";"], (0, _themeGet.themeGet)("colors.red100"))
 };
-exports.RADIO_STATES = RADIO_STATES;
-var RADIO_SIZES = {
+var RADIO_SIZES = exports.RADIO_SIZES = {
   sm: {
     labelFontSize: "sm-display",
     descriptionFontSize: "xs",
@@ -55,5 +53,4 @@ var RADIO_SIZES = {
     dotSize: "32px"
   }
 };
-exports.RADIO_SIZES = RADIO_SIZES;
 //# sourceMappingURL=tokens.js.map