@artsy/palette 41.0.0-canary.1423.31655.0 → 41.0.0

package/dist/elements/Radio/tokens.js

@@ -8,33 +8,33 @@ var _themeGet = require("@styled-system/theme-get");
 var _styledComponents = require("styled-components");
 var RADIO_DOT_STATES = {
   default: {
-    resting: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";"], (0, _themeGet.themeGet)("colors.white100"), (0, _themeGet.themeGet)("colors.black30")),
-    selected: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";background-color:", ";"], (0, _themeGet.themeGet)("colors.white100"), (0, _themeGet.themeGet)("colors.black100"), (0, _themeGet.themeGet)("colors.black100"))
+    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"))
   },
   focus: {
-    resting: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";"], (0, _themeGet.themeGet)("colors.white100"), (0, _themeGet.themeGet)("colors.black100")),
-    selected: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";background-color:", ";"], (0, _themeGet.themeGet)("colors.white100"), (0, _themeGet.themeGet)("colors.black100"), (0, _themeGet.themeGet)("colors.black100"))
+    resting: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";"], (0, _themeGet.themeGet)("colors.mono0"), (0, _themeGet.themeGet)("colors.mono100")),
+    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"))
   },
   disabled: {
-    resting: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";"], (0, _themeGet.themeGet)("colors.white100"), (0, _themeGet.themeGet)("colors.black30")),
-    selected: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";background-color:", ";"], (0, _themeGet.themeGet)("colors.white100"), (0, _themeGet.themeGet)("colors.black30"), (0, _themeGet.themeGet)("colors.black30"))
+    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.mono30"), (0, _themeGet.themeGet)("colors.mono30"))
   },
   error: {
-    resting: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";"], (0, _themeGet.themeGet)("colors.white100"), (0, _themeGet.themeGet)("colors.red100")),
-    selected: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";background-color:", ";"], (0, _themeGet.themeGet)("colors.white100"), (0, _themeGet.themeGet)("colors.red100"), (0, _themeGet.themeGet)("colors.red100"))
+    resting: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";"], (0, _themeGet.themeGet)("colors.mono0"), (0, _themeGet.themeGet)("colors.red100")),
+    selected: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";background-color:", ";"], (0, _themeGet.themeGet)("colors.mono0"), (0, _themeGet.themeGet)("colors.red100"), (0, _themeGet.themeGet)("colors.red100"))
   },
   hover: {
-    resting: (0, _styledComponents.css)(["border:1px solid;color:transparent;border-color:", ";background-color:", ";"], (0, _themeGet.themeGet)("colors.blue100"), (0, _themeGet.themeGet)("colors.white100")),
-    selected: (0, _styledComponents.css)(["border:1px solid;color:", ";border-color:", ";background-color:", ";"], (0, _themeGet.themeGet)("colors.white100"), (0, _themeGet.themeGet)("colors.blue100"), (0, _themeGet.themeGet)("colors.blue100"))
+    resting: (0, _styledComponents.css)(["border:1px solid;color:transparent;border-color:", ";background-color:", ";"], (0, _themeGet.themeGet)("colors.blue100"), (0, _themeGet.themeGet)("colors.mono0")),
+    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 = {
-  default: (0, _styledComponents.css)(["color:", ";"], (0, _themeGet.themeGet)("colors.black60")),
-  focus: (0, _styledComponents.css)(["color:", ";> div > div:first-of-type{text-decoration:underline;}"], (0, _themeGet.themeGet)("colors.black100")),
-  selected: (0, _styledComponents.css)(["color:", ";"], (0, _themeGet.themeGet)("colors.black100")),
+  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")),
   hover: (0, _styledComponents.css)(["color:", ";> div > div:first-of-type{text-decoration:underline;}"], (0, _themeGet.themeGet)("colors.blue100")),
-  disabled: (0, _styledComponents.css)(["pointer-events:none;color:", ";"], (0, _themeGet.themeGet)("colors.black30")),
+  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;

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

@@ -1 +1 @@
-{"version":3,"file":"tokens.js","names":["_themeGet","require","_styledComponents","RADIO_DOT_STATES","default","resting","css","themeGet","selected","focus","disabled","error","hover","exports","RADIO_STATES","RADIO_SIZES","sm","labelFontSize","descriptionFontSize","dotSize","md","lg"],"sources":["../../../src/elements/Radio/tokens.ts"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport { css } from \"styled-components\"\nimport { ResponsiveValue } from \"styled-system\"\nimport { TextVariant } from \"../../Theme\"\n\nexport const RADIO_DOT_STATES = {\n  default: {\n    resting: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.white100\")};\n      border-color: ${themeGet(\"colors.black30\")};\n    `,\n    selected: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.white100\")};\n      border-color: ${themeGet(\"colors.black100\")};\n      background-color: ${themeGet(\"colors.black100\")};\n    `,\n  },\n  focus: {\n    resting: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.white100\")};\n      border-color: ${themeGet(\"colors.black100\")};\n    `,\n    selected: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.white100\")};\n      border-color: ${themeGet(\"colors.black100\")};\n      background-color: ${themeGet(\"colors.black100\")};\n    `,\n  },\n  disabled: {\n    resting: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.white100\")};\n      border-color: ${themeGet(\"colors.black30\")};\n    `,\n    selected: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.white100\")};\n      border-color: ${themeGet(\"colors.black30\")};\n      background-color: ${themeGet(\"colors.black30\")};\n    `,\n  },\n  error: {\n    resting: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.white100\")};\n      border-color: ${themeGet(\"colors.red100\")};\n    `,\n    selected: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.white100\")};\n      border-color: ${themeGet(\"colors.red100\")};\n      background-color: ${themeGet(\"colors.red100\")};\n    `,\n  },\n  hover: {\n    resting: css`\n      border: 1px solid;\n      color: transparent;\n      border-color: ${themeGet(\"colors.blue100\")};\n      background-color: ${themeGet(\"colors.white100\")};\n    `,\n    selected: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.white100\")};\n      border-color: ${themeGet(\"colors.blue100\")};\n      background-color: ${themeGet(\"colors.blue100\")};\n    `,\n  },\n}\n\nexport const RADIO_STATES = {\n  default: css`\n    color: ${themeGet(\"colors.black60\")};\n  `,\n  focus: css`\n    color: ${themeGet(\"colors.black100\")};\n\n    /* Label */\n    > div > div:first-of-type {\n      text-decoration: underline;\n    }\n  `,\n  selected: css`\n    color: ${themeGet(\"colors.black100\")};\n  `,\n  hover: css`\n    color: ${themeGet(\"colors.blue100\")};\n\n    /* Label */\n    > div > div:first-of-type {\n      text-decoration: underline;\n    }\n  `,\n  disabled: css`\n    pointer-events: none;\n    color: ${themeGet(\"colors.black30\")};\n  `,\n  error: css`\n    color: ${themeGet(\"colors.red100\")};\n  `,\n} as const\n\ninterface SizeVariant {\n  labelFontSize: ResponsiveValue<TextVariant>\n  descriptionFontSize: ResponsiveValue<TextVariant>\n  dotSize: string\n}\n\nexport const RADIO_SIZES: Record<string, SizeVariant> = {\n  sm: {\n    labelFontSize: \"sm-display\",\n    descriptionFontSize: \"xs\",\n    dotSize: \"20px\",\n  },\n  md: {\n    labelFontSize: \"md\",\n    descriptionFontSize: \"sm\",\n    dotSize: \"25px\",\n  },\n  lg: {\n    labelFontSize: \"lg-display\",\n    descriptionFontSize: \"md\",\n    dotSize: \"32px\",\n  },\n}\n"],"mappings":"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"}
+{"version":3,"file":"tokens.js","names":["_themeGet","require","_styledComponents","RADIO_DOT_STATES","default","resting","css","themeGet","selected","focus","disabled","error","hover","exports","RADIO_STATES","RADIO_SIZES","sm","labelFontSize","descriptionFontSize","dotSize","md","lg"],"sources":["../../../src/elements/Radio/tokens.ts"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport { css } from \"styled-components\"\nimport { ResponsiveValue } from \"styled-system\"\nimport { TextVariant } from \"../../Theme\"\n\nexport const RADIO_DOT_STATES = {\n  default: {\n    resting: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.mono0\")};\n      border-color: ${themeGet(\"colors.mono30\")};\n    `,\n    selected: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.mono0\")};\n      border-color: ${themeGet(\"colors.mono100\")};\n      background-color: ${themeGet(\"colors.mono100\")};\n    `,\n  },\n  focus: {\n    resting: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.mono0\")};\n      border-color: ${themeGet(\"colors.mono100\")};\n    `,\n    selected: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.mono0\")};\n      border-color: ${themeGet(\"colors.mono100\")};\n      background-color: ${themeGet(\"colors.mono100\")};\n    `,\n  },\n  disabled: {\n    resting: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.mono0\")};\n      border-color: ${themeGet(\"colors.mono30\")};\n    `,\n    selected: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.mono0\")};\n      border-color: ${themeGet(\"colors.mono30\")};\n      background-color: ${themeGet(\"colors.mono30\")};\n    `,\n  },\n  error: {\n    resting: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.mono0\")};\n      border-color: ${themeGet(\"colors.red100\")};\n    `,\n    selected: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.mono0\")};\n      border-color: ${themeGet(\"colors.red100\")};\n      background-color: ${themeGet(\"colors.red100\")};\n    `,\n  },\n  hover: {\n    resting: css`\n      border: 1px solid;\n      color: transparent;\n      border-color: ${themeGet(\"colors.blue100\")};\n      background-color: ${themeGet(\"colors.mono0\")};\n    `,\n    selected: css`\n      border: 1px solid;\n      color: ${themeGet(\"colors.mono0\")};\n      border-color: ${themeGet(\"colors.blue100\")};\n      background-color: ${themeGet(\"colors.blue100\")};\n    `,\n  },\n}\n\nexport const RADIO_STATES = {\n  default: css`\n    color: ${themeGet(\"colors.mono60\")};\n  `,\n  focus: css`\n    color: ${themeGet(\"colors.mono100\")};\n\n    /* Label */\n    > div > div:first-of-type {\n      text-decoration: underline;\n    }\n  `,\n  selected: css`\n    color: ${themeGet(\"colors.mono100\")};\n  `,\n  hover: css`\n    color: ${themeGet(\"colors.blue100\")};\n\n    /* Label */\n    > div > div:first-of-type {\n      text-decoration: underline;\n    }\n  `,\n  disabled: css`\n    pointer-events: none;\n    color: ${themeGet(\"colors.mono30\")};\n  `,\n  error: css`\n    color: ${themeGet(\"colors.red100\")};\n  `,\n} as const\n\ninterface SizeVariant {\n  labelFontSize: ResponsiveValue<TextVariant>\n  descriptionFontSize: ResponsiveValue<TextVariant>\n  dotSize: string\n}\n\nexport const RADIO_SIZES: Record<string, SizeVariant> = {\n  sm: {\n    labelFontSize: \"sm-display\",\n    descriptionFontSize: \"xs\",\n    dotSize: \"20px\",\n  },\n  md: {\n    labelFontSize: \"md\",\n    descriptionFontSize: \"sm\",\n    dotSize: \"25px\",\n  },\n  lg: {\n    labelFontSize: \"lg-display\",\n    descriptionFontSize: \"md\",\n    dotSize: \"32px\",\n  },\n}\n"],"mappings":"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"}

package/dist/elements/RadioGroup/RadioGroup.js

@@ -105,7 +105,7 @@ var RadioGroup = /*#__PURE__*/function (_React$Component) {
       }, rest), disabled && disabledText && /*#__PURE__*/_react.default.createElement(_Text.Text, {
         variant: "xs",
         mb: 1,
-        color: "black60"
+        color: "mono60"
       }, disabledText), this.renderRadioButtons());
     }
   }]);

package/dist/elements/RadioGroup/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","names":["_react","_interopRequireDefault","require","_Flex","_Text","_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","_classCallCheck","instance","Constructor","TypeError","_defineProperties","props","descriptor","enumerable","configurable","writable","defineProperty","_toPropertyKey","_createClass","protoProps","staticProps","arg","_toPrimitive","_typeof","String","input","hint","prim","Symbol","toPrimitive","undefined","res","Number","_inherits","subClass","superClass","create","constructor","value","_setPrototypeOf","o","p","setPrototypeOf","__proto__","_createSuper","Derived","hasNativeReflectConstruct","_isNativeReflectConstruct","_createSuperInternal","Super","_getPrototypeOf","result","NewTarget","Reflect","construct","_possibleConstructorReturn","self","_assertThisInitialized","ReferenceError","sham","Proxy","Boolean","valueOf","e","getPrototypeOf","RadioGroup","_React$Component","_super","_this$props$defaultVa","_this","_len","args","Array","_key","concat","state","selectedOption","defaultValue","onSelect","_ref","update","deselectable","setState","componentDidUpdate","prevProps","renderRadioButtons","_this2","React","Children","map","children","child","cloneElement","disabled","selected","_child$props$onSelect","_child$props","render","_this$props","disabledText","_onSelect","_defaultValue","_children","rest","createElement","Flex","flexDirection","Text","variant","mb","color","Component","exports","displayName"],"sources":["../../../src/elements/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import React from \"react\"\nimport { Flex, FlexProps } from \"../Flex\"\nimport { RadioProps } from \"../Radio\"\nimport { Text } from \"../Text\"\n\nexport interface RadioGroupProps<T> extends FlexProps {\n  /** Ability to deselect the selection */\n  deselectable?: boolean\n  /** Disable interactions */\n  disabled?: boolean\n  /** Text to display when disabled */\n  disabledText?: string\n  /** Callback when selected */\n  onSelect?: (selectedOption: T) => void\n  /** Default value of radio button */\n  defaultValue?: T\n  /** Child <Radio /> elements */\n  children:\n    | Array<React.ReactElement<RadioProps<T>>>\n    | React.ReactElement<RadioProps<T>>\n}\n\ninterface RadioGroupState<T> {\n  selectedOption: T | null\n}\n\n/**\n * A stateful collection of Radio buttons\n */\nexport class RadioGroup<T> extends React.Component<\n  RadioGroupProps<T>,\n  RadioGroupState<T>\n> {\n  state = {\n    selectedOption: this.props.defaultValue ?? null,\n  }\n\n  componentDidUpdate(prevProps) {\n    if (prevProps.defaultValue !== this.props.defaultValue) {\n      this.setState({\n        selectedOption: this.props.defaultValue!,\n      })\n    }\n  }\n\n  onSelect = ({ value }) => {\n    // After state update, call back up the tree with the latest state\n    const update = () => {\n      if (this.props.onSelect) {\n        this.props.onSelect(this.state.selectedOption!)\n      }\n    }\n\n    if (this.props.deselectable) {\n      if (this.state.selectedOption === value) {\n        this.setState(\n          {\n            selectedOption: null,\n          },\n          update\n        )\n        return\n      }\n    }\n\n    this.setState({ selectedOption: value }, update)\n  }\n\n  renderRadioButtons() {\n    return React.Children.map(\n      this.props.children,\n      (child: React.ReactElement<RadioProps<T>>) => {\n        return React.cloneElement(child, {\n          disabled:\n            child.props.disabled !== undefined\n              ? child.props.disabled\n              : this.props.disabled,\n          onSelect: child.props.onSelect\n            ? (selected) => {\n                this.onSelect(selected)\n                child.props.onSelect?.(selected)\n              }\n            : this.onSelect,\n          // FIXME: Throw an error `child.props.selected' is set once we enable the dev code elimination.\n          selected: this.state.selectedOption === child.props.value,\n        })\n      }\n    )\n  }\n\n  render() {\n    const {\n      disabled,\n      disabledText,\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      onSelect: _onSelect,\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      defaultValue: _defaultValue,\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      children: _children,\n      ...rest\n    } = this.props\n    return (\n      <Flex flexDirection=\"column\" {...rest}>\n        {disabled && disabledText && (\n          <Text variant=\"xs\" mb={1} color=\"black60\">\n            {disabledText}\n          </Text>\n        )}\n\n        {this.renderRadioButtons()}\n      </Flex>\n    )\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"RadioGroup.js","names":["_react","_interopRequireDefault","require","_Flex","_Text","_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","_classCallCheck","instance","Constructor","TypeError","_defineProperties","props","descriptor","enumerable","configurable","writable","defineProperty","_toPropertyKey","_createClass","protoProps","staticProps","arg","_toPrimitive","_typeof","String","input","hint","prim","Symbol","toPrimitive","undefined","res","Number","_inherits","subClass","superClass","create","constructor","value","_setPrototypeOf","o","p","setPrototypeOf","__proto__","_createSuper","Derived","hasNativeReflectConstruct","_isNativeReflectConstruct","_createSuperInternal","Super","_getPrototypeOf","result","NewTarget","Reflect","construct","_possibleConstructorReturn","self","_assertThisInitialized","ReferenceError","sham","Proxy","Boolean","valueOf","e","getPrototypeOf","RadioGroup","_React$Component","_super","_this$props$defaultVa","_this","_len","args","Array","_key","concat","state","selectedOption","defaultValue","onSelect","_ref","update","deselectable","setState","componentDidUpdate","prevProps","renderRadioButtons","_this2","React","Children","map","children","child","cloneElement","disabled","selected","_child$props$onSelect","_child$props","render","_this$props","disabledText","_onSelect","_defaultValue","_children","rest","createElement","Flex","flexDirection","Text","variant","mb","color","Component","exports","displayName"],"sources":["../../../src/elements/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import React from \"react\"\nimport { Flex, FlexProps } from \"../Flex\"\nimport { RadioProps } from \"../Radio\"\nimport { Text } from \"../Text\"\n\nexport interface RadioGroupProps<T> extends FlexProps {\n  /** Ability to deselect the selection */\n  deselectable?: boolean\n  /** Disable interactions */\n  disabled?: boolean\n  /** Text to display when disabled */\n  disabledText?: string\n  /** Callback when selected */\n  onSelect?: (selectedOption: T) => void\n  /** Default value of radio button */\n  defaultValue?: T\n  /** Child <Radio /> elements */\n  children:\n    | Array<React.ReactElement<RadioProps<T>>>\n    | React.ReactElement<RadioProps<T>>\n}\n\ninterface RadioGroupState<T> {\n  selectedOption: T | null\n}\n\n/**\n * A stateful collection of Radio buttons\n */\nexport class RadioGroup<T> extends React.Component<\n  RadioGroupProps<T>,\n  RadioGroupState<T>\n> {\n  state = {\n    selectedOption: this.props.defaultValue ?? null,\n  }\n\n  componentDidUpdate(prevProps) {\n    if (prevProps.defaultValue !== this.props.defaultValue) {\n      this.setState({\n        selectedOption: this.props.defaultValue!,\n      })\n    }\n  }\n\n  onSelect = ({ value }) => {\n    // After state update, call back up the tree with the latest state\n    const update = () => {\n      if (this.props.onSelect) {\n        this.props.onSelect(this.state.selectedOption!)\n      }\n    }\n\n    if (this.props.deselectable) {\n      if (this.state.selectedOption === value) {\n        this.setState(\n          {\n            selectedOption: null,\n          },\n          update\n        )\n        return\n      }\n    }\n\n    this.setState({ selectedOption: value }, update)\n  }\n\n  renderRadioButtons() {\n    return React.Children.map(\n      this.props.children,\n      (child: React.ReactElement<RadioProps<T>>) => {\n        return React.cloneElement(child, {\n          disabled:\n            child.props.disabled !== undefined\n              ? child.props.disabled\n              : this.props.disabled,\n          onSelect: child.props.onSelect\n            ? (selected) => {\n                this.onSelect(selected)\n                child.props.onSelect?.(selected)\n              }\n            : this.onSelect,\n          // FIXME: Throw an error `child.props.selected' is set once we enable the dev code elimination.\n          selected: this.state.selectedOption === child.props.value,\n        })\n      }\n    )\n  }\n\n  render() {\n    const {\n      disabled,\n      disabledText,\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      onSelect: _onSelect,\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      defaultValue: _defaultValue,\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      children: _children,\n      ...rest\n    } = this.props\n    return (\n      <Flex flexDirection=\"column\" {...rest}>\n        {disabled && disabledText && (\n          <Text variant=\"xs\" mb={1} color=\"mono60\">\n            {disabledText}\n          </Text>\n        )}\n\n        {this.renderRadioButtons()}\n      </Flex>\n    )\n  }\n}\n"],"mappings":"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"}

package/dist/elements/Range/Range.js

@@ -128,17 +128,17 @@ Range.displayName = "Range";
 var Track = (0, _styledComponents.default)(_Flex.Flex).withConfig({
   displayName: "Range__Track",
   componentId: "sc-si9a6m-0"
-})(["align-items:center;position:relative;height:", "px;&:before{content:\"\";display:block;position:absolute;height:2px;left:0;right:0;top:50%;margin-top:-1px;background-color:", ";}"], RANGE_HANDLE_SIZE, (0, _themeGet.themeGet)("colors.black30"));
+})(["align-items:center;position:relative;height:", "px;&:before{content:\"\";display:block;position:absolute;height:2px;left:0;right:0;top:50%;margin-top:-1px;background-color:", ";}"], RANGE_HANDLE_SIZE, (0, _themeGet.themeGet)("colors.mono30"));
 var Selection = (0, _styledComponents.default)(_Box.Box).withConfig({
   displayName: "Range__Selection",
   componentId: "sc-si9a6m-1"
 })(["position:absolute;height:2px;left:0;right:0;top:50%;margin-top:-1px;background-color:", ";"], (0, _themeGet.themeGet)("colors.brand"));
 var railStyles = (0, _styledComponents.css)(["width:100%;height:", "px;"], RANGE_HANDLE_SIZE);
-var handleStyles = (0, _styledComponents.css)(["user-select:none;cursor:grab;width:", "px;height:", "px;background-color:", ";border-radius:50%;border:1px solid ", ";box-shadow:", ";"], RANGE_HANDLE_SIZE, RANGE_HANDLE_SIZE, (0, _themeGet.themeGet)("colors.white100"), (0, _themeGet.themeGet)("colors.black10"), (0, _themeGet.themeGet)("effects.flatShadow"));
+var handleStyles = (0, _styledComponents.css)(["user-select:none;cursor:grab;width:", "px;height:", "px;background-color:", ";border-radius:50%;border:1px solid ", ";box-shadow:", ";"], RANGE_HANDLE_SIZE, RANGE_HANDLE_SIZE, (0, _themeGet.themeGet)("colors.mono0"), (0, _themeGet.themeGet)("colors.mono10"), (0, _themeGet.themeGet)("effects.flatShadow"));
 var Slider = _styledComponents.default.input.withConfig({
   displayName: "Range__Slider",
   componentId: "sc-si9a6m-2"
-})(["appearance:none;background:transparent;position:relative;margin:0;width:100%;position:absolute;top:0;left:0;&::-webkit-slider-runnable-track{", "}&::-moz-range-track{", "}&::-webkit-slider-thumb{-webkit-appearance:none;", "}&::-moz-range-thumb{", "}&:active{&::-webkit-slider-thumb{box-shadow:none;background-color:", ";}&::-moz-range-thumb{box-shadow:none;background-color:", ";}}"], railStyles, railStyles, handleStyles, handleStyles, (0, _themeGet.themeGet)("colors.black5"), (0, _themeGet.themeGet)("colors.black5"));
+})(["appearance:none;background:transparent;position:relative;margin:0;width:100%;position:absolute;top:0;left:0;&::-webkit-slider-runnable-track{", "}&::-moz-range-track{", "}&::-webkit-slider-thumb{-webkit-appearance:none;", "}&::-moz-range-thumb{", "}&:active{&::-webkit-slider-thumb{box-shadow:none;background-color:", ";}&::-moz-range-thumb{box-shadow:none;background-color:", ";}}"], railStyles, railStyles, handleStyles, handleStyles, (0, _themeGet.themeGet)("colors.mono5"), (0, _themeGet.themeGet)("colors.mono5"));
 Slider.defaultProps = {
   type: "range"
 };

package/dist/elements/Range/Range.js.map

@@ -1 +1 @@
-{"version":3,"file":"Range.js","names":["_themeGet","require","React","_interopRequireWildcard","_styledComponents","_utils","_remapValue","_Box","_Flex","_excluded","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_toConsumableArray","arr","_arrayWithoutHoles","_iterableToArray","_unsupportedIterableToArray","_nonIterableSpread","TypeError","iter","Symbol","iterator","Array","from","isArray","_arrayLikeToArray","_slicedToArray","i","_arrayWithHoles","_iterableToArrayLimit","_nonIterableRest","o","minLen","n","toString","slice","constructor","name","test","len","length","arr2","_i","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","_objectWithoutProperties","source","excluded","target","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","RANGE_HANDLE_SIZE","exports","Range","_ref","ariaLabels","min","max","step","_ref$value","onChange","rest","minRef","useRef","maxRef","_useState","useState","_useState2","values","setValues","_useState3","_useState4","maxWidth","setMaxWidth","handleMinChange","_ref2","valueAsNumber","handleMaxChange","_ref3","useEffect","handleResize","current","offsetWidth","requestAnimationFrame","window","addEventListener","passive","removeEventListener","useUpdateEffect","selectionRectangle","concat","remapValue","maxRectangle","createElement","Track","Selection","style","clip","Slider","ref","onInput","displayName","styled","Flex","withConfig","componentId","themeGet","Box","railStyles","css","handleStyles","input","defaultProps","type"],"sources":["../../../src/elements/Range/Range.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport * as React from \"react\"\nimport { useEffect, useRef, useState } from \"react\"\nimport styled, { css } from \"styled-components\"\nimport { useUpdateEffect } from \"../../utils\"\nimport { remapValue } from \"../../utils/remapValue\"\nimport { Box, BoxProps } from \"../Box\"\nimport { Flex } from \"../Flex\"\n\nexport const RANGE_HANDLE_SIZE = 24\n\nexport interface RangeProps extends BoxProps {\n  ariaLabels?: [string, string]\n  min: number\n  max: number\n  step: number\n  value?: number[]\n  onChange?: (range: [number, number]) => void\n}\n\nexport const Range: React.FC<React.PropsWithChildren<RangeProps>> = ({\n  ariaLabels,\n  min,\n  max,\n  step,\n  value = [0, max],\n  onChange,\n  ...rest\n}) => {\n  const minRef = useRef<HTMLInputElement | null>(null)\n  const maxRef = useRef<HTMLInputElement | null>(null)\n\n  const [values, setValues] = useState(value)\n\n  const [maxWidth, setMaxWidth] = useState(0)\n\n  const handleMinChange = ({\n    target: { valueAsNumber: value },\n  }: React.ChangeEvent<HTMLInputElement>) => {\n    if (value > values[1] - step) return\n    setValues([value, values[1]])\n    onChange?.([value, values[1]])\n  }\n\n  const handleMaxChange = ({\n    target: { valueAsNumber: value },\n  }: React.ChangeEvent<HTMLInputElement>) => {\n    if (value < values[0] + step) return\n    setValues([values[0], value])\n    onChange?.([values[0], value])\n  }\n\n  useEffect(() => {\n    const handleResize = () => {\n      if (!maxRef.current) return\n      setMaxWidth(maxRef.current.offsetWidth)\n    }\n\n    requestAnimationFrame(handleResize)\n\n    window.addEventListener(\"resize\", handleResize, { passive: true })\n\n    return () => {\n      window.removeEventListener(\"resize\", handleResize)\n    }\n  }, [])\n\n  // Sync local state with value prop\n  useUpdateEffect(() => {\n    setValues(value)\n  }, [...value])\n\n  const selectionRectangle = `rect(0, ${remapValue(\n    values[1],\n    { min, max },\n    { min: 0, max: maxWidth - RANGE_HANDLE_SIZE }\n  )}px, 2px, ${remapValue(\n    values[0],\n    { min, max },\n    { min: 0, max: maxWidth - RANGE_HANDLE_SIZE }\n  )}px)`\n\n  const maxRectangle = `rect(0, ${maxWidth}px, ${RANGE_HANDLE_SIZE}px, ${remapValue(\n    values[1],\n    { min, max },\n    { min: 0, max: maxWidth - RANGE_HANDLE_SIZE }\n  )}px)`\n\n  return (\n    <Track {...rest}>\n      <Selection style={{ clip: selectionRectangle }} />\n\n      <Slider\n        ref={minRef as any}\n        min={min}\n        max={max}\n        step={step}\n        onInput={handleMinChange}\n        value={values[0]}\n        aria-label={ariaLabels?.[0]}\n      />\n\n      <Slider\n        ref={maxRef as any}\n        min={min}\n        max={max}\n        step={step}\n        onInput={handleMaxChange}\n        value={values[1]}\n        style={{ clip: maxRectangle }}\n        aria-label={ariaLabels?.[1]}\n      />\n    </Track>\n  )\n}\n\nconst Track = styled(Flex)`\n  align-items: center;\n  position: relative;\n  height: ${RANGE_HANDLE_SIZE}px;\n\n  &:before {\n    content: \"\";\n    display: block;\n    position: absolute;\n    height: 2px;\n    left: 0;\n    right: 0;\n    top: 50%;\n    margin-top: -1px;\n    background-color: ${themeGet(\"colors.black30\")};\n  }\n`\n\nconst Selection = styled(Box)`\n  position: absolute;\n  height: 2px;\n  left: 0;\n  right: 0;\n  top: 50%;\n  margin-top: -1px;\n  background-color: ${themeGet(\"colors.brand\")};\n`\n\nconst railStyles = css`\n  width: 100%;\n  height: ${RANGE_HANDLE_SIZE}px;\n`\n\nconst handleStyles = css`\n  user-select: none;\n  cursor: grab;\n  width: ${RANGE_HANDLE_SIZE}px;\n  height: ${RANGE_HANDLE_SIZE}px;\n  background-color: ${themeGet(\"colors.white100\")};\n  border-radius: 50%;\n  border: 1px solid ${themeGet(\"colors.black10\")};\n  box-shadow: ${themeGet(\"effects.flatShadow\")};\n`\n\nconst Slider = styled.input`\n  appearance: none;\n  background: transparent;\n  position: relative;\n  margin: 0;\n  width: 100%;\n  position: absolute;\n  top: 0;\n  left: 0;\n\n  &::-webkit-slider-runnable-track {\n    ${railStyles}\n  }\n\n  &::-moz-range-track {\n    ${railStyles}\n  }\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    ${handleStyles}\n  }\n\n  &::-moz-range-thumb {\n    ${handleStyles}\n  }\n\n  &:active {\n    &::-webkit-slider-thumb {\n      box-shadow: none;\n      background-color: ${themeGet(\"colors.black5\")};\n    }\n\n    &::-moz-range-thumb {\n      box-shadow: none;\n      background-color: ${themeGet(\"colors.black5\")};\n    }\n  }\n`\n\nSlider.defaultProps = {\n  type: \"range\",\n}\n"],"mappings":"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"}
+{"version":3,"file":"Range.js","names":["_themeGet","require","React","_interopRequireWildcard","_styledComponents","_utils","_remapValue","_Box","_Flex","_excluded","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_toConsumableArray","arr","_arrayWithoutHoles","_iterableToArray","_unsupportedIterableToArray","_nonIterableSpread","TypeError","iter","Symbol","iterator","Array","from","isArray","_arrayLikeToArray","_slicedToArray","i","_arrayWithHoles","_iterableToArrayLimit","_nonIterableRest","o","minLen","n","toString","slice","constructor","name","test","len","length","arr2","_i","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","_objectWithoutProperties","source","excluded","target","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","RANGE_HANDLE_SIZE","exports","Range","_ref","ariaLabels","min","max","step","_ref$value","onChange","rest","minRef","useRef","maxRef","_useState","useState","_useState2","values","setValues","_useState3","_useState4","maxWidth","setMaxWidth","handleMinChange","_ref2","valueAsNumber","handleMaxChange","_ref3","useEffect","handleResize","current","offsetWidth","requestAnimationFrame","window","addEventListener","passive","removeEventListener","useUpdateEffect","selectionRectangle","concat","remapValue","maxRectangle","createElement","Track","Selection","style","clip","Slider","ref","onInput","displayName","styled","Flex","withConfig","componentId","themeGet","Box","railStyles","css","handleStyles","input","defaultProps","type"],"sources":["../../../src/elements/Range/Range.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport * as React from \"react\"\nimport { useEffect, useRef, useState } from \"react\"\nimport styled, { css } from \"styled-components\"\nimport { useUpdateEffect } from \"../../utils\"\nimport { remapValue } from \"../../utils/remapValue\"\nimport { Box, BoxProps } from \"../Box\"\nimport { Flex } from \"../Flex\"\n\nexport const RANGE_HANDLE_SIZE = 24\n\nexport interface RangeProps extends BoxProps {\n  ariaLabels?: [string, string]\n  min: number\n  max: number\n  step: number\n  value?: number[]\n  onChange?: (range: [number, number]) => void\n}\n\nexport const Range: React.FC<React.PropsWithChildren<RangeProps>> = ({\n  ariaLabels,\n  min,\n  max,\n  step,\n  value = [0, max],\n  onChange,\n  ...rest\n}) => {\n  const minRef = useRef<HTMLInputElement | null>(null)\n  const maxRef = useRef<HTMLInputElement | null>(null)\n\n  const [values, setValues] = useState(value)\n\n  const [maxWidth, setMaxWidth] = useState(0)\n\n  const handleMinChange = ({\n    target: { valueAsNumber: value },\n  }: React.ChangeEvent<HTMLInputElement>) => {\n    if (value > values[1] - step) return\n    setValues([value, values[1]])\n    onChange?.([value, values[1]])\n  }\n\n  const handleMaxChange = ({\n    target: { valueAsNumber: value },\n  }: React.ChangeEvent<HTMLInputElement>) => {\n    if (value < values[0] + step) return\n    setValues([values[0], value])\n    onChange?.([values[0], value])\n  }\n\n  useEffect(() => {\n    const handleResize = () => {\n      if (!maxRef.current) return\n      setMaxWidth(maxRef.current.offsetWidth)\n    }\n\n    requestAnimationFrame(handleResize)\n\n    window.addEventListener(\"resize\", handleResize, { passive: true })\n\n    return () => {\n      window.removeEventListener(\"resize\", handleResize)\n    }\n  }, [])\n\n  // Sync local state with value prop\n  useUpdateEffect(() => {\n    setValues(value)\n  }, [...value])\n\n  const selectionRectangle = `rect(0, ${remapValue(\n    values[1],\n    { min, max },\n    { min: 0, max: maxWidth - RANGE_HANDLE_SIZE }\n  )}px, 2px, ${remapValue(\n    values[0],\n    { min, max },\n    { min: 0, max: maxWidth - RANGE_HANDLE_SIZE }\n  )}px)`\n\n  const maxRectangle = `rect(0, ${maxWidth}px, ${RANGE_HANDLE_SIZE}px, ${remapValue(\n    values[1],\n    { min, max },\n    { min: 0, max: maxWidth - RANGE_HANDLE_SIZE }\n  )}px)`\n\n  return (\n    <Track {...rest}>\n      <Selection style={{ clip: selectionRectangle }} />\n\n      <Slider\n        ref={minRef as any}\n        min={min}\n        max={max}\n        step={step}\n        onInput={handleMinChange}\n        value={values[0]}\n        aria-label={ariaLabels?.[0]}\n      />\n\n      <Slider\n        ref={maxRef as any}\n        min={min}\n        max={max}\n        step={step}\n        onInput={handleMaxChange}\n        value={values[1]}\n        style={{ clip: maxRectangle }}\n        aria-label={ariaLabels?.[1]}\n      />\n    </Track>\n  )\n}\n\nconst Track = styled(Flex)`\n  align-items: center;\n  position: relative;\n  height: ${RANGE_HANDLE_SIZE}px;\n\n  &:before {\n    content: \"\";\n    display: block;\n    position: absolute;\n    height: 2px;\n    left: 0;\n    right: 0;\n    top: 50%;\n    margin-top: -1px;\n    background-color: ${themeGet(\"colors.mono30\")};\n  }\n`\n\nconst Selection = styled(Box)`\n  position: absolute;\n  height: 2px;\n  left: 0;\n  right: 0;\n  top: 50%;\n  margin-top: -1px;\n  background-color: ${themeGet(\"colors.brand\")};\n`\n\nconst railStyles = css`\n  width: 100%;\n  height: ${RANGE_HANDLE_SIZE}px;\n`\n\nconst handleStyles = css`\n  user-select: none;\n  cursor: grab;\n  width: ${RANGE_HANDLE_SIZE}px;\n  height: ${RANGE_HANDLE_SIZE}px;\n  background-color: ${themeGet(\"colors.mono0\")};\n  border-radius: 50%;\n  border: 1px solid ${themeGet(\"colors.mono10\")};\n  box-shadow: ${themeGet(\"effects.flatShadow\")};\n`\n\nconst Slider = styled.input`\n  appearance: none;\n  background: transparent;\n  position: relative;\n  margin: 0;\n  width: 100%;\n  position: absolute;\n  top: 0;\n  left: 0;\n\n  &::-webkit-slider-runnable-track {\n    ${railStyles}\n  }\n\n  &::-moz-range-track {\n    ${railStyles}\n  }\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    ${handleStyles}\n  }\n\n  &::-moz-range-thumb {\n    ${handleStyles}\n  }\n\n  &:active {\n    &::-webkit-slider-thumb {\n      box-shadow: none;\n      background-color: ${themeGet(\"colors.mono5\")};\n    }\n\n    &::-moz-range-thumb {\n      box-shadow: none;\n      background-color: ${themeGet(\"colors.mono5\")};\n    }\n  }\n`\n\nSlider.defaultProps = {\n  type: \"range\",\n}\n"],"mappings":"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"}

package/dist/elements/Range/Range.story.js

@@ -54,7 +54,7 @@ var WithinModal = function WithinModal() {
     dialogProps: {
       width: 400,
       height: 400,
-      bg: "black5"
+      bg: "mono5"
     }
   }, /*#__PURE__*/_react.default.createElement(_Box.Box, {
     width: 400,
@@ -110,7 +110,7 @@ var InContext = function InContext() {
   return /*#__PURE__*/_react.default.createElement(_Box.Box, {
     p: 2,
     border: "1px solid",
-    borderColor: "black10",
+    borderColor: "mono10",
     width: 375
   }, /*#__PURE__*/_react.default.createElement(_Flex.Flex, null, /*#__PURE__*/_react.default.createElement(_LabeledInput.LabeledInput, {
     title: "Min",

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

@@ -1 +1 @@
-{"version":3,"file":"Range.story.js","names":["_addonActions","require","_react","_interopRequireWildcard","_storybookStates","_Box","_Modal","_Range","_LabeledInput","_Flex","_Spacer","_Text","_Drawer","_Button","_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","step","max","Range","min","onChange","action","ariaLabels","displayName","WithinModal","ModalBase","width","height","dialogProps","bg","Box","WithinDrawer","_useState","useState","_useState2","open","setOpen","Fragment","Button","onClick","Drawer","onClose","p","story","parameters","chromatic","disable","InContext","_useState3","_useState4","_useState4$","setMinMax","border","borderColor","Flex","LabeledInput","label","flex","Spacer","x","y","justifyContent","Text","variant"],"sources":["../../../src/elements/Range/Range.story.tsx"],"sourcesContent":["import { action } from \"@storybook/addon-actions\"\nimport React, { useState } from \"react\"\nimport { States } from \"storybook-states\"\nimport { Box } from \"../Box\"\nimport { ModalBase } from \"../Modal\"\nimport { Range, RangeProps } from \"./Range\"\nimport { LabeledInput } from \"../LabeledInput\"\nimport { Flex } from \"../Flex\"\nimport { Spacer } from \"../Spacer\"\nimport { Text } from \"../Text\"\nimport { Drawer } from \"../Drawer\"\nimport { Button } from \"../Button\"\n\nexport default {\n  title: \"Components/Range\",\n}\n\nexport const Default = () => {\n  return (\n    <States<Partial<RangeProps>>\n      states={[{}, { value: [1100, 3450] }, { step: 1, max: 10 }]}\n    >\n      <Range\n        min={0}\n        max={5000}\n        step={10}\n        onChange={action(\"onChange\")}\n        ariaLabels={[\"Min price\", \"Max price\"]}\n      />\n    </States>\n  )\n}\n\nexport const WithinModal = () => {\n  return (\n    <ModalBase\n      width=\"100%\"\n      height=\"100%\"\n      dialogProps={{ width: 400, height: 400, bg: \"black5\" }}\n    >\n      <Box width={400} height={400}>\n        <Range min={0} max={5000} step={10} onChange={action(\"onChange\")} />\n      </Box>\n    </ModalBase>\n  )\n}\n\nexport const WithinDrawer = () => {\n  const [open, setOpen] = useState(false)\n  return (\n    <>\n      <Button\n        onClick={() => {\n          setOpen(true)\n        }}\n      >\n        Open\n      </Button>\n\n      <Drawer\n        open={open}\n        onClose={() => {\n          setOpen(false)\n        }}\n      >\n        <Box width={400} p={2}>\n          <Range min={0} max={5000} step={10} onChange={action(\"onChange\")} />\n        </Box>\n      </Drawer>\n    </>\n  )\n}\n\nWithinDrawer.story = {\n  parameters: { chromatic: { disable: true } },\n}\n\nexport const InContext = () => {\n  const [[min, max], setMinMax] = useState<number[]>([0, 50000])\n\n  return (\n    <Box p={2} border=\"1px solid\" borderColor=\"black10\" width={375}>\n      <Flex>\n        <LabeledInput title=\"Min\" label=\"$USD\" flex={1} value={min} />\n\n        <Spacer x={1} />\n\n        <LabeledInput title=\"Max\" label=\"$USD\" flex={1} value={max} />\n      </Flex>\n\n      <Spacer y={1} />\n\n      <Range\n        min={0}\n        max={50000}\n        step={100}\n        value={[min, max]}\n        onChange={setMinMax}\n      />\n\n      <Spacer y={0.5} />\n\n      <Flex justifyContent=\"space-between\">\n        <Text variant=\"xs\">$0</Text>\n\n        <Text variant=\"xs\">$50000+</Text>\n      </Flex>\n    </Box>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"Range.story.js","names":["_addonActions","require","_react","_interopRequireWildcard","_storybookStates","_Box","_Modal","_Range","_LabeledInput","_Flex","_Spacer","_Text","_Drawer","_Button","_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","step","max","Range","min","onChange","action","ariaLabels","displayName","WithinModal","ModalBase","width","height","dialogProps","bg","Box","WithinDrawer","_useState","useState","_useState2","open","setOpen","Fragment","Button","onClick","Drawer","onClose","p","story","parameters","chromatic","disable","InContext","_useState3","_useState4","_useState4$","setMinMax","border","borderColor","Flex","LabeledInput","label","flex","Spacer","x","y","justifyContent","Text","variant"],"sources":["../../../src/elements/Range/Range.story.tsx"],"sourcesContent":["import { action } from \"@storybook/addon-actions\"\nimport React, { useState } from \"react\"\nimport { States } from \"storybook-states\"\nimport { Box } from \"../Box\"\nimport { ModalBase } from \"../Modal\"\nimport { Range, RangeProps } from \"./Range\"\nimport { LabeledInput } from \"../LabeledInput\"\nimport { Flex } from \"../Flex\"\nimport { Spacer } from \"../Spacer\"\nimport { Text } from \"../Text\"\nimport { Drawer } from \"../Drawer\"\nimport { Button } from \"../Button\"\n\nexport default {\n  title: \"Components/Range\",\n}\n\nexport const Default = () => {\n  return (\n    <States<Partial<RangeProps>>\n      states={[{}, { value: [1100, 3450] }, { step: 1, max: 10 }]}\n    >\n      <Range\n        min={0}\n        max={5000}\n        step={10}\n        onChange={action(\"onChange\")}\n        ariaLabels={[\"Min price\", \"Max price\"]}\n      />\n    </States>\n  )\n}\n\nexport const WithinModal = () => {\n  return (\n    <ModalBase\n      width=\"100%\"\n      height=\"100%\"\n      dialogProps={{ width: 400, height: 400, bg: \"mono5\" }}\n    >\n      <Box width={400} height={400}>\n        <Range min={0} max={5000} step={10} onChange={action(\"onChange\")} />\n      </Box>\n    </ModalBase>\n  )\n}\n\nexport const WithinDrawer = () => {\n  const [open, setOpen] = useState(false)\n  return (\n    <>\n      <Button\n        onClick={() => {\n          setOpen(true)\n        }}\n      >\n        Open\n      </Button>\n\n      <Drawer\n        open={open}\n        onClose={() => {\n          setOpen(false)\n        }}\n      >\n        <Box width={400} p={2}>\n          <Range min={0} max={5000} step={10} onChange={action(\"onChange\")} />\n        </Box>\n      </Drawer>\n    </>\n  )\n}\n\nWithinDrawer.story = {\n  parameters: { chromatic: { disable: true } },\n}\n\nexport const InContext = () => {\n  const [[min, max], setMinMax] = useState<number[]>([0, 50000])\n\n  return (\n    <Box p={2} border=\"1px solid\" borderColor=\"mono10\" width={375}>\n      <Flex>\n        <LabeledInput title=\"Min\" label=\"$USD\" flex={1} value={min} />\n\n        <Spacer x={1} />\n\n        <LabeledInput title=\"Max\" label=\"$USD\" flex={1} value={max} />\n      </Flex>\n\n      <Spacer y={1} />\n\n      <Range\n        min={0}\n        max={50000}\n        step={100}\n        value={[min, max]}\n        onChange={setMinMax}\n      />\n\n      <Spacer y={0.5} />\n\n      <Flex justifyContent=\"space-between\">\n        <Text variant=\"xs\">$0</Text>\n\n        <Text variant=\"xs\">$50000+</Text>\n      </Flex>\n    </Box>\n  )\n}\n"],"mappings":"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"}

package/dist/elements/ResponsiveBox/ResponsiveBox.story.js

@@ -51,7 +51,7 @@ var Measure = function Measure(props) {
     ref: ref
   }, /*#__PURE__*/_react.default.createElement(_Text.Text, {
     variant: "xs",
-    color: "white100"
+    color: "mono0"
   }, props.aspectWidth, ":", props.aspectHeight, /*#__PURE__*/_react.default.createElement("br", null), ("maxWidth" in props || "maxHeight" in props) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "with max dimensions of", " ", [props.maxHeight || 0, props.maxWidth || "_"].join(" × "), /*#__PURE__*/_react.default.createElement("br", null)), "Renders @ ", dimensions.width, " \xD7 ", dimensions.height));
 };
 Measure.displayName = "Measure";
@@ -134,7 +134,7 @@ var ColumnsWithResponsiveImages = function ColumnsWithResponsiveImages() {
         aspectWidth: width,
         aspectHeight: height,
         maxWidth: "100%",
-        bg: "black10",
+        bg: "mono10",
         mb: 2
       }, /*#__PURE__*/_react.default.createElement(_Image.Image, {
         lazyLoad: true,

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

@@ -1 +1 @@
-{"version":3,"file":"ResponsiveBox.story.js","names":["_react","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_Box","_Text","_Image","_ResponsiveBox","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","_typeof","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","Measure","props","_useState","useState","width","height","_useState2","dimensions","setDimensions","ref","useRef","check","current","offsetWidth","offsetHeight","useEffect","window","addEventListener","removeEventListener","createElement","Box","p","Text","variant","color","aspectWidth","aspectHeight","Fragment","maxHeight","maxWidth","join","displayName","EXAMPLE_ASPECTS","EXAMPLE_MAXIMUMS","_default","title","exports","Basic","map","aspect","maximum","j","ResponsiveBox","bg","my","MaxWidth100","story","Masonry","styled","withConfig","componentId","ColumnsWithResponsiveImages","fill","_","orientation","mb","Image","lazyLoad","src","concat","srcSet"],"sources":["../../../src/elements/ResponsiveBox/ResponsiveBox.story.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\"\nimport styled from \"styled-components\"\nimport { Box } from \"../Box\"\nimport { Text } from \"../Text\"\nimport { Image } from \"../Image\"\nimport {\n  ResponsiveBox,\n  ResponsiveBoxAspectDimensions,\n  ResponsiveBoxMaxDimensions,\n  ResponsiveBoxProps,\n} from \"./ResponsiveBox\"\n\nconst Measure: React.FC<React.PropsWithChildren<ResponsiveBoxProps>> = (props) => {\n  const [dimensions, setDimensions] = useState({ width: 0, height: 0 })\n\n  const ref = useRef<null | HTMLDivElement>(null)\n\n  const check = () => {\n    if (!ref.current) return\n    setDimensions({\n      width: ref.current!.offsetWidth,\n      height: ref.current!.offsetHeight,\n    })\n  }\n\n  useEffect(() => {\n    check()\n    window.addEventListener(\"resize\", check)\n    return () => {\n      window.removeEventListener(\"resize\", check)\n    }\n  })\n\n  return (\n    <Box width=\"100%\" height=\"100%\" p={1} ref={ref as any}>\n      <Text variant=\"xs\" color=\"white100\">\n        {props.aspectWidth}:{props.aspectHeight}\n        <br />\n        {(\"maxWidth\" in props || \"maxHeight\" in props) && (\n          <>\n            with max dimensions of{\" \"}\n            {[\n              (props as any).maxHeight || 0,\n              (props as any).maxWidth || \"_\",\n            ].join(\" × \")}\n            <br />\n          </>\n        )}\n        Renders @ {dimensions.width} × {dimensions.height}\n      </Text>\n    </Box>\n  )\n}\n\nconst EXAMPLE_ASPECTS: ResponsiveBoxAspectDimensions[] = [\n  { aspectWidth: 300, aspectHeight: 400 },\n  { aspectWidth: 400, aspectHeight: 300 },\n]\n\nconst EXAMPLE_MAXIMUMS: ResponsiveBoxMaxDimensions[] = [\n  { maxHeight: 200, maxWidth: 200 },\n  { maxHeight: 400, maxWidth: 400 },\n  { maxHeight: 400 },\n  { maxWidth: 400 },\n  { maxHeight: 600, maxWidth: 600 },\n  { maxHeight: 100, maxWidth: 600 },\n  { maxHeight: 1024, maxWidth: 1024 },\n]\n\nexport default { title: \"Components/ResponsiveBox\" }\n\nexport const Basic = () => {\n  return (\n    <>\n      {EXAMPLE_ASPECTS.map((aspect, i) =>\n        EXAMPLE_MAXIMUMS.map((maximum, j) => {\n          return (\n            <ResponsiveBox\n              key={[i, j].join(\".\")}\n              {...aspect}\n              {...maximum}\n              bg=\"brand\"\n              my={2}\n            >\n              <Measure {...aspect} {...maximum} />\n            </ResponsiveBox>\n          )\n        })\n      )}\n    </>\n  )\n}\n\nexport const MaxWidth100 = () => {\n  return (\n    <>\n      {EXAMPLE_ASPECTS.map((aspect, i) => {\n        return (\n          <ResponsiveBox key={i} {...aspect} maxWidth=\"100%\" bg=\"brand\" my={2}>\n            <Measure {...aspect} maxWidth=\"100%\" />\n          </ResponsiveBox>\n        )\n      })}\n    </>\n  )\n}\n\nMaxWidth100.story = {\n  name: \"maxWidth: 100%\",\n}\n\nconst Masonry = styled(Box)`\n  column-count: 3;\n\n  * {\n    break-inside: avoid;\n  }\n`\n\nexport const ColumnsWithResponsiveImages = () => {\n  return (\n    (<Masonry>\n      {new Array(12).fill(0).map((_, i) => {\n        const orientation = i % 3 === 0 ? \"portrait\" : \"landscape\"\n        const width = orientation === \"portrait\" ? 200 : 300\n        const height = orientation === \"portrait\" ? 300 : 200\n\n        return (\n          // Simply being wrapped in an extra `Box` causes a image loading bug in Chrome\n          (<Box key={i}>\n            <ResponsiveBox\n              aspectWidth={width}\n              aspectHeight={height}\n              maxWidth=\"100%\"\n              bg=\"black10\"\n              mb={2}\n            >\n              <Image\n                lazyLoad\n                width=\"100%\"\n                height=\"100%\"\n                src={`https://picsum.photos/seed/${i}/${width}/${height}`}\n                srcSet={`https://picsum.photos/seed/${i}/${width}/${height} 1x, https://picsum.photos/seed/${i}/${\n                  width * 2\n                }/${height * 2} 2x`}\n              />\n            </ResponsiveBox>\n          </Box>)\n        );\n      })}\n    </Masonry>)\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ResponsiveBox.story.js","names":["_react","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_Box","_Text","_Image","_ResponsiveBox","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","_typeof","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","Measure","props","_useState","useState","width","height","_useState2","dimensions","setDimensions","ref","useRef","check","current","offsetWidth","offsetHeight","useEffect","window","addEventListener","removeEventListener","createElement","Box","p","Text","variant","color","aspectWidth","aspectHeight","Fragment","maxHeight","maxWidth","join","displayName","EXAMPLE_ASPECTS","EXAMPLE_MAXIMUMS","_default","title","exports","Basic","map","aspect","maximum","j","ResponsiveBox","bg","my","MaxWidth100","story","Masonry","styled","withConfig","componentId","ColumnsWithResponsiveImages","fill","_","orientation","mb","Image","lazyLoad","src","concat","srcSet"],"sources":["../../../src/elements/ResponsiveBox/ResponsiveBox.story.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\"\nimport styled from \"styled-components\"\nimport { Box } from \"../Box\"\nimport { Text } from \"../Text\"\nimport { Image } from \"../Image\"\nimport {\n  ResponsiveBox,\n  ResponsiveBoxAspectDimensions,\n  ResponsiveBoxMaxDimensions,\n  ResponsiveBoxProps,\n} from \"./ResponsiveBox\"\n\nconst Measure: React.FC<React.PropsWithChildren<ResponsiveBoxProps>> = (\n  props\n) => {\n  const [dimensions, setDimensions] = useState({ width: 0, height: 0 })\n\n  const ref = useRef<null | HTMLDivElement>(null)\n\n  const check = () => {\n    if (!ref.current) return\n    setDimensions({\n      width: ref.current!.offsetWidth,\n      height: ref.current!.offsetHeight,\n    })\n  }\n\n  useEffect(() => {\n    check()\n    window.addEventListener(\"resize\", check)\n    return () => {\n      window.removeEventListener(\"resize\", check)\n    }\n  })\n\n  return (\n    <Box width=\"100%\" height=\"100%\" p={1} ref={ref as any}>\n      <Text variant=\"xs\" color=\"mono0\">\n        {props.aspectWidth}:{props.aspectHeight}\n        <br />\n        {(\"maxWidth\" in props || \"maxHeight\" in props) && (\n          <>\n            with max dimensions of{\" \"}\n            {[\n              (props as any).maxHeight || 0,\n              (props as any).maxWidth || \"_\",\n            ].join(\" × \")}\n            <br />\n          </>\n        )}\n        Renders @ {dimensions.width} × {dimensions.height}\n      </Text>\n    </Box>\n  )\n}\n\nconst EXAMPLE_ASPECTS: ResponsiveBoxAspectDimensions[] = [\n  { aspectWidth: 300, aspectHeight: 400 },\n  { aspectWidth: 400, aspectHeight: 300 },\n]\n\nconst EXAMPLE_MAXIMUMS: ResponsiveBoxMaxDimensions[] = [\n  { maxHeight: 200, maxWidth: 200 },\n  { maxHeight: 400, maxWidth: 400 },\n  { maxHeight: 400 },\n  { maxWidth: 400 },\n  { maxHeight: 600, maxWidth: 600 },\n  { maxHeight: 100, maxWidth: 600 },\n  { maxHeight: 1024, maxWidth: 1024 },\n]\n\nexport default { title: \"Components/ResponsiveBox\" }\n\nexport const Basic = () => {\n  return (\n    <>\n      {EXAMPLE_ASPECTS.map((aspect, i) =>\n        EXAMPLE_MAXIMUMS.map((maximum, j) => {\n          return (\n            <ResponsiveBox\n              key={[i, j].join(\".\")}\n              {...aspect}\n              {...maximum}\n              bg=\"brand\"\n              my={2}\n            >\n              <Measure {...aspect} {...maximum} />\n            </ResponsiveBox>\n          )\n        })\n      )}\n    </>\n  )\n}\n\nexport const MaxWidth100 = () => {\n  return (\n    <>\n      {EXAMPLE_ASPECTS.map((aspect, i) => {\n        return (\n          <ResponsiveBox key={i} {...aspect} maxWidth=\"100%\" bg=\"brand\" my={2}>\n            <Measure {...aspect} maxWidth=\"100%\" />\n          </ResponsiveBox>\n        )\n      })}\n    </>\n  )\n}\n\nMaxWidth100.story = {\n  name: \"maxWidth: 100%\",\n}\n\nconst Masonry = styled(Box)`\n  column-count: 3;\n\n  * {\n    break-inside: avoid;\n  }\n`\n\nexport const ColumnsWithResponsiveImages = () => {\n  return (\n    <Masonry>\n      {new Array(12).fill(0).map((_, i) => {\n        const orientation = i % 3 === 0 ? \"portrait\" : \"landscape\"\n        const width = orientation === \"portrait\" ? 200 : 300\n        const height = orientation === \"portrait\" ? 300 : 200\n\n        return (\n          // Simply being wrapped in an extra `Box` causes a image loading bug in Chrome\n          <Box key={i}>\n            <ResponsiveBox\n              aspectWidth={width}\n              aspectHeight={height}\n              maxWidth=\"100%\"\n              bg=\"mono10\"\n              mb={2}\n            >\n              <Image\n                lazyLoad\n                width=\"100%\"\n                height=\"100%\"\n                src={`https://picsum.photos/seed/${i}/${width}/${height}`}\n                srcSet={`https://picsum.photos/seed/${i}/${width}/${height} 1x, https://picsum.photos/seed/${i}/${\n                  width * 2\n                }/${height * 2} 2x`}\n              />\n            </ResponsiveBox>\n          </Box>\n        )\n      })}\n    </Masonry>\n  )\n}\n"],"mappings":"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"}

package/dist/elements/Select/Select.js

@@ -68,7 +68,7 @@ var Select = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     placement: "top-end"
   }, /*#__PURE__*/_react.default.createElement(_Text.Text, {
     variant: "xs",
-    color: "black60",
+    color: "mono60",
     textAlign: "right"
   }, /*#__PURE__*/_react.default.createElement("u", null, "What is this?"))), /*#__PURE__*/_react.default.createElement(Container, {
     mt: !!title && !description ? 1 : 0,
@@ -127,17 +127,17 @@ var resetMixin = (0, _styledComponents.css)(["appearance:none;background:none;bo
 /** Creates a small caret */
 var caretMixin = (0, _styledComponents.css)(["&::after{content:\"\";cursor:inherit;width:0;height:0;position:absolute;top:50%;transform:translateY(-50%);right:", ";pointer-events:none;border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid ", ";}"], (0, _themeGet.themeGet)("space.1"), function (_ref3) {
   var disabled = _ref3.disabled;
-  return disabled ? (0, _themeGet.themeGet)("colors.black10") : (0, _themeGet.themeGet)("colors.black100");
+  return disabled ? (0, _themeGet.themeGet)("colors.mono10") : (0, _themeGet.themeGet)("colors.mono100");
 });
 exports.caretMixin = caretMixin;
 var Container = (0, _styledComponents.default)(_Box.Box).withConfig({
   displayName: "Select__Container",
   componentId: "sc-1weszjl-0"
-})(["position:relative;width:100%;> select{", ";width:100%;padding:0 24px 0 ", ";font-family:", ";border:1px solid;border-radius:3px;border-color:", ";cursor:pointer;line-height:1;transition:color 0.25s,background-color 0.25s,border-color 0.25s;", ";}", ""], resetMixin, (0, _themeGet.themeGet)("space.1"), (0, _themeGet.themeGet)("fonts.sans"), (0, _themeGet.themeGet)("colors.black30"), function (props) {
+})(["position:relative;width:100%;> select{", ";width:100%;padding:0 24px 0 ", ";font-family:", ";border:1px solid;border-radius:3px;border-color:", ";cursor:pointer;line-height:1;transition:color 0.25s,background-color 0.25s,border-color 0.25s;", ";}", ""], resetMixin, (0, _themeGet.themeGet)("space.1"), (0, _themeGet.themeGet)("fonts.sans"), (0, _themeGet.themeGet)("colors.mono30"), function (props) {
   return (0, _styledComponents.css)(["", " ", " ", " ", " ", " &:hover{", "}&:focus{", "}&:disabled{cursor:default;", "}&:not(:focus):not(:has(option[value=\"\"]:checked)){", " ", "}&:not(:focus){", "}&:not(:focus):has(option[value=\"\"]:checked){", "}&:not(:focus){", "}"], _tokens.SELECT_STATES.default, props.hover && _tokens.SELECT_STATES.hover, props.focus && _tokens.SELECT_STATES.focus, props.disabled && _tokens.SELECT_STATES.disabled, props.error && _tokens.SELECT_STATES.error, _tokens.SELECT_STATES.hover, _tokens.SELECT_STATES.focus, _tokens.SELECT_STATES.disabled, !(props.disabled || props.focus) && _tokens.SELECT_STATES.completed, props.error && _tokens.SELECT_STATES.error, !!props.optionSelected && (0, _styledComponents.css)(["", " ", ""], !(props.disabled || props.focus) && _tokens.SELECT_STATES.completed, props.error && _tokens.SELECT_STATES.error), props.title && (0, _styledComponents.css)(["color:transparent;"]), props.title && !props.optionSelected && (0, _styledComponents.css)(["color:transparent;"]));
 }, caretMixin);
 var StyledLabel = _styledComponents.default.label.withConfig({
   displayName: "Select__StyledLabel",
   componentId: "sc-1weszjl-1"
-})(["position:absolute;top:50%;left:5px;padding:0 5px;pointer-events:none;transform:translateY(-50%);transition:", ";transition-property:color,font-size,transform;background-color:transparent;font-family:", ";& > span{background-color:", ";height:100%;width:100%;display:block;position:absolute;top:0;left:0;z-index:-1;transition:", ";transition-property:height,top;transition-delay:0.1s;}"], _helpers.FORM_ELEMENT_TRANSITION, (0, _themeGet.themeGet)("fonts.sans"), (0, _themeGet.themeGet)("colors.white100"), _helpers.FORM_ELEMENT_TRANSITION);
+})(["position:absolute;top:50%;left:5px;padding:0 5px;pointer-events:none;transform:translateY(-50%);transition:", ";transition-property:color,font-size,transform;background-color:transparent;font-family:", ";& > span{background-color:", ";height:100%;width:100%;display:block;position:absolute;top:0;left:0;z-index:-1;transition:", ";transition-property:height,top;transition-delay:0.1s;}"], _helpers.FORM_ELEMENT_TRANSITION, (0, _themeGet.themeGet)("fonts.sans"), (0, _themeGet.themeGet)("colors.mono0"), _helpers.FORM_ELEMENT_TRANSITION);
 //# sourceMappingURL=Select.js.map

package/dist/elements/Select/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","names":["_themeGet","require","_react","_interopRequireWildcard","_styledComponents","_helpers","_RequiredField","_Box","_Text","_Tooltip","_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","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Select","forwardRef","_ref","ref","description","disabled","error","focus","hover","id","options","required","selected","title","onSelect","onChange","rest","_splitBoxProps","splitBoxProps","_splitBoxProps2","boxProps","selectProps","_useState","useState","_useState2","selectedOption","setSelectedOption","_useState3","_useState4","isFocused","setIsFocused","_useState5","_useState6","isHovered","setIsHovered","createElement","Box","width","Tooltip","pointer","content","placement","Text","variant","color","textAlign","Container","mt","onMouseEnter","onMouseLeave","onFocus","onBlur","optionSelected","event","map","_ref2","text","StyledLabel","htmlFor","RequiredField","ml","exports","displayName","resetMixin","css","caretMixin","themeGet","_ref3","styled","withConfig","componentId","props","SELECT_STATES","completed","label","FORM_ELEMENT_TRANSITION"],"sources":["../../../src/elements/Select/Select.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport React, { forwardRef, useState } from \"react\"\nimport styled, { css, ExecutionContext } from \"styled-components\"\nimport { FORM_ELEMENT_TRANSITION } from \"../../helpers\"\nimport { RequiredField } from \"../../shared/RequiredField\"\nimport { Box, BoxProps, splitBoxProps } from \"../Box\"\nimport { Text } from \"../Text\"\nimport { Tooltip } from \"../Tooltip\"\nimport { SELECT_STATES } from \"./tokens\"\n\nexport interface Option {\n  value: string\n  text: string\n}\n\nexport interface SelectProps\n  extends BoxProps,\n    Omit<React.SelectHTMLAttributes<HTMLSelectElement>, \"onSelect\" | \"size\"> {\n  description?: string\n  disabled?: boolean\n  error?: string | boolean\n  focus?: boolean\n  hover?: boolean\n  name?: string\n  options: Option[]\n  required?: boolean\n  selected?: string\n  title?: string\n  onSelect?: (value: string) => void\n}\n\n/** A drop-down select menu */\nexport const Select = forwardRef<HTMLElement, SelectProps>(\n  (\n    {\n      description,\n      disabled,\n      error,\n      focus,\n      hover,\n      id,\n      name,\n      options,\n      required,\n      selected,\n      title,\n      onSelect,\n      onChange,\n      value,\n      ...rest\n    },\n    ref\n  ) => {\n    const [boxProps, selectProps] = splitBoxProps(rest)\n    // due to :has not available in Firefox yet, we need to add the styles to the label using JS\n    const [selectedOption, setSelectedOption] = useState(selected || value)\n    const [isFocused, setIsFocused] = useState(false)\n    const [isHovered, setIsHovered] = useState(false)\n\n    return (\n      <Box width=\"100%\" {...boxProps}>\n        {!!description && (\n          <Tooltip pointer content={description} placement=\"top-end\">\n            <Text variant=\"xs\" color=\"black60\" textAlign=\"right\">\n              <u>What is this?</u>\n            </Text>\n          </Tooltip>\n        )}\n\n        <Container\n          mt={!!title && !description ? 1 : 0}\n          disabled={!!disabled}\n          hover={!!hover || isHovered}\n          error={error!}\n          focus={!!focus || isFocused}\n          title={title}\n          onMouseEnter={() => setIsHovered(true)}\n          onMouseLeave={() => setIsHovered(false)}\n          onFocus={() => setIsFocused(true)}\n          onBlur={() => setIsFocused(false)}\n          optionSelected={!!selectedOption}\n        >\n          <select\n            ref={ref as any}\n            id={id}\n            disabled={disabled}\n            name={name}\n            value={selected || value}\n            onChange={(event) => {\n              onSelect && onSelect(event.target.value)\n              onChange && onChange(event)\n              setSelectedOption(event.target.value)\n            }}\n            {...selectProps}\n          >\n            {options.map(({ value, text }) => {\n              return (\n                <option value={value} key={value}>\n                  {text}\n                </option>\n              )\n            })}\n          </select>\n\n          {!!title && (\n            <StyledLabel htmlFor={id}>\n              {title}\n\n              <span />\n            </StyledLabel>\n          )}\n        </Container>\n\n        {required && !(error && typeof error === \"string\") && (\n          <RequiredField mt={0.5} ml={1} disabled={disabled} />\n        )}\n\n        {error && typeof error === \"string\" && (\n          <Text variant=\"xs\" mt={0.5} ml={1} color=\"red100\">\n            {error}\n          </Text>\n        )}\n      </Box>\n    )\n  }\n)\n\nSelect.displayName = \"Select\"\n\nconst resetMixin = css`\n  appearance: none;\n  background: none;\n  border: none;\n  outline: 0;\n  text-indent: 0.01px;\n  text-overflow: \"\";\n  border-radius: 0;\n\n  &:-moz-focusring {\n    color: transparent;\n    text-shadow: 0 0 0 black;\n  }\n\n  option:not(:checked) {\n    color: black; /* prevent <option>s from becoming transparent as well */\n  }\n`\n\ninterface CaretProps extends ExecutionContext {\n  disabled?: boolean\n}\n\n/** Creates a small caret */\nexport const caretMixin = css`\n  &::after {\n    content: \"\";\n    cursor: inherit;\n    width: 0;\n    height: 0;\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    right: ${themeGet(\"space.1\")};\n    pointer-events: none;\n    border-left: 4px solid transparent;\n    border-right: 4px solid transparent;\n    border-top: 4px solid\n      ${({ disabled }: CaretProps) => {\n        return disabled\n          ? themeGet(\"colors.black10\")\n          : themeGet(\"colors.black100\")\n      }};\n  }\n`\n\ntype ContainerProps = Required<\n  Pick<SelectProps, \"disabled\" | \"error\" | \"hover\" | \"focus\">\n  // adding optionSelected here to use it locally without adding it to the Select's props\n> & { optionSelected: boolean }\n\nconst Container = styled(Box)<ContainerProps>`\n  position: relative;\n  width: 100%;\n\n  > select {\n    ${resetMixin};\n    width: 100%;\n    /* 24px = space.1 + 4px-wide caret + space.1 */\n    padding: 0 24px 0 ${themeGet(\"space.1\")};\n    font-family: ${themeGet(\"fonts.sans\")};\n    border: 1px solid;\n    border-radius: 3px;\n    border-color: ${themeGet(\"colors.black30\")};\n    cursor: pointer;\n    line-height: 1;\n    transition: color 0.25s, background-color 0.25s, border-color 0.25s;\n\n    ${(props) => {\n      return css`\n        ${SELECT_STATES.default}\n\n        ${props.hover && SELECT_STATES.hover}\n        ${props.focus && SELECT_STATES.focus}\n        ${props.disabled && SELECT_STATES.disabled}\n        ${props.error && SELECT_STATES.error}\n\n        &:hover {\n          ${SELECT_STATES.hover}\n        }\n\n        &:focus {\n          ${SELECT_STATES.focus}\n        }\n\n        &:disabled {\n          cursor: default;\n          ${SELECT_STATES.disabled}\n        }\n\n        &:not(:focus):not(:has(option[value=\"\"]:checked)) {\n          ${!(props.disabled || props.focus) && SELECT_STATES.completed}\n          ${props.error && SELECT_STATES.error}\n        }\n\n        &:not(:focus) {\n          // Firefox polyfill for :has\n          ${!!props.optionSelected &&\n          css`\n            ${!(props.disabled || props.focus) && SELECT_STATES.completed}\n            ${props.error && SELECT_STATES.error}\n          `}\n        }\n\n        &:not(:focus):has(option[value=\"\"]:checked) {\n          ${props.title &&\n          css`\n            color: transparent;\n          `}\n        }\n\n        &:not(:focus) {\n          // Firefox polyfill for :has\n          ${props.title &&\n          !props.optionSelected &&\n          css`\n            color: transparent;\n          `}\n        }\n      `\n    }};\n  }\n\n  ${caretMixin}\n`\n\nconst StyledLabel = styled.label`\n  position: absolute;\n  top: 50%;\n  left: 5px;\n  padding: 0 5px;\n  pointer-events: none;\n  transform: translateY(-50%);\n  transition: ${FORM_ELEMENT_TRANSITION};\n  transition-property: color, font-size, transform;\n  background-color: transparent;\n  font-family: ${themeGet(\"fonts.sans\")};\n\n  & > span {\n    background-color: ${themeGet(\"colors.white100\")};\n    height: 100%;\n    width: 100%;\n    display: block;\n    position: absolute;\n    top: 0;\n    left: 0;\n    z-index: -1;\n    transition: ${FORM_ELEMENT_TRANSITION};\n    transition-property: height, top;\n    transition-delay: 0.1s;\n  }\n`\n"],"mappings":"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"}
+{"version":3,"file":"Select.js","names":["_themeGet","require","_react","_interopRequireWildcard","_styledComponents","_helpers","_RequiredField","_Box","_Text","_Tooltip","_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","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Select","forwardRef","_ref","ref","description","disabled","error","focus","hover","id","options","required","selected","title","onSelect","onChange","rest","_splitBoxProps","splitBoxProps","_splitBoxProps2","boxProps","selectProps","_useState","useState","_useState2","selectedOption","setSelectedOption","_useState3","_useState4","isFocused","setIsFocused","_useState5","_useState6","isHovered","setIsHovered","createElement","Box","width","Tooltip","pointer","content","placement","Text","variant","color","textAlign","Container","mt","onMouseEnter","onMouseLeave","onFocus","onBlur","optionSelected","event","map","_ref2","text","StyledLabel","htmlFor","RequiredField","ml","exports","displayName","resetMixin","css","caretMixin","themeGet","_ref3","styled","withConfig","componentId","props","SELECT_STATES","completed","label","FORM_ELEMENT_TRANSITION"],"sources":["../../../src/elements/Select/Select.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport React, { forwardRef, useState } from \"react\"\nimport styled, { css, ExecutionContext } from \"styled-components\"\nimport { FORM_ELEMENT_TRANSITION } from \"../../helpers\"\nimport { RequiredField } from \"../../shared/RequiredField\"\nimport { Box, BoxProps, splitBoxProps } from \"../Box\"\nimport { Text } from \"../Text\"\nimport { Tooltip } from \"../Tooltip\"\nimport { SELECT_STATES } from \"./tokens\"\n\nexport interface Option {\n  value: string\n  text: string\n}\n\nexport interface SelectProps\n  extends BoxProps,\n    Omit<React.SelectHTMLAttributes<HTMLSelectElement>, \"onSelect\" | \"size\"> {\n  description?: string\n  disabled?: boolean\n  error?: string | boolean\n  focus?: boolean\n  hover?: boolean\n  name?: string\n  options: Option[]\n  required?: boolean\n  selected?: string\n  title?: string\n  onSelect?: (value: string) => void\n}\n\n/** A drop-down select menu */\nexport const Select = forwardRef<HTMLElement, SelectProps>(\n  (\n    {\n      description,\n      disabled,\n      error,\n      focus,\n      hover,\n      id,\n      name,\n      options,\n      required,\n      selected,\n      title,\n      onSelect,\n      onChange,\n      value,\n      ...rest\n    },\n    ref\n  ) => {\n    const [boxProps, selectProps] = splitBoxProps(rest)\n    // due to :has not available in Firefox yet, we need to add the styles to the label using JS\n    const [selectedOption, setSelectedOption] = useState(selected || value)\n    const [isFocused, setIsFocused] = useState(false)\n    const [isHovered, setIsHovered] = useState(false)\n\n    return (\n      <Box width=\"100%\" {...boxProps}>\n        {!!description && (\n          <Tooltip pointer content={description} placement=\"top-end\">\n            <Text variant=\"xs\" color=\"mono60\" textAlign=\"right\">\n              <u>What is this?</u>\n            </Text>\n          </Tooltip>\n        )}\n\n        <Container\n          mt={!!title && !description ? 1 : 0}\n          disabled={!!disabled}\n          hover={!!hover || isHovered}\n          error={error!}\n          focus={!!focus || isFocused}\n          title={title}\n          onMouseEnter={() => setIsHovered(true)}\n          onMouseLeave={() => setIsHovered(false)}\n          onFocus={() => setIsFocused(true)}\n          onBlur={() => setIsFocused(false)}\n          optionSelected={!!selectedOption}\n        >\n          <select\n            ref={ref as any}\n            id={id}\n            disabled={disabled}\n            name={name}\n            value={selected || value}\n            onChange={(event) => {\n              onSelect && onSelect(event.target.value)\n              onChange && onChange(event)\n              setSelectedOption(event.target.value)\n            }}\n            {...selectProps}\n          >\n            {options.map(({ value, text }) => {\n              return (\n                <option value={value} key={value}>\n                  {text}\n                </option>\n              )\n            })}\n          </select>\n\n          {!!title && (\n            <StyledLabel htmlFor={id}>\n              {title}\n\n              <span />\n            </StyledLabel>\n          )}\n        </Container>\n\n        {required && !(error && typeof error === \"string\") && (\n          <RequiredField mt={0.5} ml={1} disabled={disabled} />\n        )}\n\n        {error && typeof error === \"string\" && (\n          <Text variant=\"xs\" mt={0.5} ml={1} color=\"red100\">\n            {error}\n          </Text>\n        )}\n      </Box>\n    )\n  }\n)\n\nSelect.displayName = \"Select\"\n\nconst resetMixin = css`\n  appearance: none;\n  background: none;\n  border: none;\n  outline: 0;\n  text-indent: 0.01px;\n  text-overflow: \"\";\n  border-radius: 0;\n\n  &:-moz-focusring {\n    color: transparent;\n    text-shadow: 0 0 0 black;\n  }\n\n  option:not(:checked) {\n    color: black; /* prevent <option>s from becoming transparent as well */\n  }\n`\n\ninterface CaretProps extends ExecutionContext {\n  disabled?: boolean\n}\n\n/** Creates a small caret */\nexport const caretMixin = css`\n  &::after {\n    content: \"\";\n    cursor: inherit;\n    width: 0;\n    height: 0;\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    right: ${themeGet(\"space.1\")};\n    pointer-events: none;\n    border-left: 4px solid transparent;\n    border-right: 4px solid transparent;\n    border-top: 4px solid\n      ${({ disabled }: CaretProps) => {\n        return disabled ? themeGet(\"colors.mono10\") : themeGet(\"colors.mono100\")\n      }};\n  }\n`\n\ntype ContainerProps = Required<\n  Pick<SelectProps, \"disabled\" | \"error\" | \"hover\" | \"focus\">\n  // adding optionSelected here to use it locally without adding it to the Select's props\n> & { optionSelected: boolean }\n\nconst Container = styled(Box)<ContainerProps>`\n  position: relative;\n  width: 100%;\n\n  > select {\n    ${resetMixin};\n    width: 100%;\n    /* 24px = space.1 + 4px-wide caret + space.1 */\n    padding: 0 24px 0 ${themeGet(\"space.1\")};\n    font-family: ${themeGet(\"fonts.sans\")};\n    border: 1px solid;\n    border-radius: 3px;\n    border-color: ${themeGet(\"colors.mono30\")};\n    cursor: pointer;\n    line-height: 1;\n    transition: color 0.25s, background-color 0.25s, border-color 0.25s;\n\n    ${(props) => {\n      return css`\n        ${SELECT_STATES.default}\n\n        ${props.hover && SELECT_STATES.hover}\n        ${props.focus && SELECT_STATES.focus}\n        ${props.disabled && SELECT_STATES.disabled}\n        ${props.error && SELECT_STATES.error}\n\n        &:hover {\n          ${SELECT_STATES.hover}\n        }\n\n        &:focus {\n          ${SELECT_STATES.focus}\n        }\n\n        &:disabled {\n          cursor: default;\n          ${SELECT_STATES.disabled}\n        }\n\n        &:not(:focus):not(:has(option[value=\"\"]:checked)) {\n          ${!(props.disabled || props.focus) && SELECT_STATES.completed}\n          ${props.error && SELECT_STATES.error}\n        }\n\n        &:not(:focus) {\n          // Firefox polyfill for :has\n          ${!!props.optionSelected &&\n          css`\n            ${!(props.disabled || props.focus) && SELECT_STATES.completed}\n            ${props.error && SELECT_STATES.error}\n          `}\n        }\n\n        &:not(:focus):has(option[value=\"\"]:checked) {\n          ${props.title &&\n          css`\n            color: transparent;\n          `}\n        }\n\n        &:not(:focus) {\n          // Firefox polyfill for :has\n          ${props.title &&\n          !props.optionSelected &&\n          css`\n            color: transparent;\n          `}\n        }\n      `\n    }};\n  }\n\n  ${caretMixin}\n`\n\nconst StyledLabel = styled.label`\n  position: absolute;\n  top: 50%;\n  left: 5px;\n  padding: 0 5px;\n  pointer-events: none;\n  transform: translateY(-50%);\n  transition: ${FORM_ELEMENT_TRANSITION};\n  transition-property: color, font-size, transform;\n  background-color: transparent;\n  font-family: ${themeGet(\"fonts.sans\")};\n\n  & > span {\n    background-color: ${themeGet(\"colors.mono0\")};\n    height: 100%;\n    width: 100%;\n    display: block;\n    position: absolute;\n    top: 0;\n    left: 0;\n    z-index: -1;\n    transition: ${FORM_ELEMENT_TRANSITION};\n    transition-property: height, top;\n    transition-delay: 0.1s;\n  }\n`\n"],"mappings":";;;;;;;AAAA,IAAAA,SAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AACA,IAAAG,iBAAA,GAAAD,uBAAA,CAAAF,OAAA;AACA,IAAAI,QAAA,GAAAJ,OAAA;AACA,IAAAK,cAAA,GAAAL,OAAA;AACA,IAAAM,IAAA,GAAAN,OAAA;AACA,IAAAO,KAAA,GAAAP,OAAA;AACA,IAAAQ,QAAA,GAAAR,OAAA;AACA,IAAAS,OAAA,GAAAT,OAAA;AAAwC,IAAAU,SAAA;AAAA,SAAAC,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAV,wBAAAc,GAAA,EAAAJ,WAAA,SAAAA,WAAA,IAAAI,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,aAAAE,OAAA,CAAAF,GAAA,yBAAAA,GAAA,4BAAAG,OAAA,EAAAH,GAAA,UAAAI,KAAA,GAAAT,wBAAA,CAAAC,WAAA,OAAAQ,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAL,GAAA,YAAAI,KAAA,CAAAE,GAAA,CAAAN,GAAA,SAAAO,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAZ,GAAA,QAAAY,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAf,GAAA,EAAAY,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAX,GAAA,EAAAY,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAZ,GAAA,CAAAY,GAAA,SAAAL,MAAA,CAAAJ,OAAA,GAAAH,GAAA,MAAAI,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAjB,GAAA,EAAAO,MAAA,YAAAA,MAAA;AAAA,SAAAW,SAAA,IAAAA,QAAA,GAAAT,MAAA,CAAAU,MAAA,GAAAV,MAAA,CAAAU,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAV,GAAA,IAAAa,MAAA,QAAAhB,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAU,MAAA,EAAAb,GAAA,KAAAS,MAAA,CAAAT,GAAA,IAAAa,MAAA,CAAAb,GAAA,gBAAAS,MAAA,YAAAH,QAAA,CAAAQ,KAAA,OAAAH,SAAA;AAAA,SAAAI,eAAAC,GAAA,EAAAN,CAAA,WAAAO,eAAA,CAAAD,GAAA,KAAAE,qBAAA,CAAAF,GAAA,EAAAN,CAAA,KAAAS,2BAAA,CAAAH,GAAA,EAAAN,CAAA,KAAAU,gBAAA;AAAA,SAAAA,iBAAA,cAAAC,SAAA;AAAA,SAAAF,4BAAAG,CAAA,EAAAC,MAAA,SAAAD,CAAA,qBAAAA,CAAA,sBAAAE,iBAAA,CAAAF,CAAA,EAAAC,MAAA,OAAAE,CAAA,GAAA5B,MAAA,CAAAI,SAAA,CAAAyB,QAAA,CAAAvB,IAAA,CAAAmB,CAAA,EAAAK,KAAA,aAAAF,CAAA,iBAAAH,CAAA,CAAAM,WAAA,EAAAH,CAAA,GAAAH,CAAA,CAAAM,WAAA,CAAAC,IAAA,MAAAJ,CAAA,cAAAA,CAAA,mBAAAK,KAAA,CAAAC,IAAA,CAAAT,CAAA,OAAAG,CAAA,+DAAAO,IAAA,CAAAP,CAAA,UAAAD,iBAAA,CAAAF,CAAA,EAAAC,MAAA;AAAA,SAAAC,kBAAAR,GAAA,EAAAiB,GAAA,QAAAA,GAAA,YAAAA,GAAA,GAAAjB,GAAA,CAAAJ,MAAA,EAAAqB,GAAA,GAAAjB,GAAA,CAAAJ,MAAA,WAAAF,CAAA,MAAAwB,IAAA,OAAAJ,KAAA,CAAAG,GAAA,GAAAvB,CAAA,GAAAuB,GAAA,EAAAvB,CAAA,MAAAwB,IAAA,CAAAxB,CAAA,IAAAM,GAAA,CAAAN,CAAA,YAAAwB,IAAA;AAAA,SAAAhB,sBAAAF,GAAA,EAAAN,CAAA,QAAAyB,EAAA,WAAAnB,GAAA,gCAAAoB,MAAA,IAAApB,GAAA,CAAAoB,MAAA,CAAAC,QAAA,KAAArB,GAAA,4BAAAmB,EAAA,QAAAG,EAAA,EAAAC,EAAA,EAAAC,EAAA,EAAAC,EAAA,EAAAC,IAAA,OAAAC,EAAA,OAAAC,EAAA,iBAAAJ,EAAA,IAAAL,EAAA,GAAAA,EAAA,CAAAhC,IAAA,CAAAa,GAAA,GAAA6B,IAAA,QAAAnC,CAAA,QAAAb,MAAA,CAAAsC,EAAA,MAAAA,EAAA,UAAAQ,EAAA,uBAAAA,EAAA,IAAAL,EAAA,GAAAE,EAAA,CAAArC,IAAA,CAAAgC,EAAA,GAAAW,IAAA,MAAAJ,IAAA,CAAAK,IAAA,CAAAT,EAAA,CAAAU,KAAA,GAAAN,IAAA,CAAA9B,MAAA,KAAAF,CAAA,GAAAiC,EAAA,sBAAAM,GAAA,IAAAL,EAAA,OAAAL,EAAA,GAAAU,GAAA,yBAAAN,EAAA,YAAAR,EAAA,CAAAe,MAAA,KAAAT,EAAA,GAAAN,EAAA,CAAAe,MAAA,IAAArD,MAAA,CAAA4C,EAAA,MAAAA,EAAA,2BAAAG,EAAA,QAAAL,EAAA,aAAAG,IAAA;AAAA,SAAAzB,gBAAAD,GAAA,QAAAc,KAAA,CAAAqB,OAAA,CAAAnC,GAAA,UAAAA,GAAA;AAAA,SAAAoC,yBAAAvC,MAAA,EAAAwC,QAAA,QAAAxC,MAAA,yBAAAJ,MAAA,GAAA6C,6BAAA,CAAAzC,MAAA,EAAAwC,QAAA,OAAArD,GAAA,EAAAU,CAAA,MAAAb,MAAA,CAAA0D,qBAAA,QAAAC,gBAAA,GAAA3D,MAAA,CAAA0D,qBAAA,CAAA1C,MAAA,QAAAH,CAAA,MAAAA,CAAA,GAAA8C,gBAAA,CAAA5C,MAAA,EAAAF,CAAA,MAAAV,GAAA,GAAAwD,gBAAA,CAAA9C,CAAA,OAAA2C,QAAA,CAAAI,OAAA,CAAAzD,GAAA,uBAAAH,MAAA,CAAAI,SAAA,CAAAyD,oBAAA,CAAAvD,IAAA,CAAAU,MAAA,EAAAb,GAAA,aAAAS,MAAA,CAAAT,GAAA,IAAAa,MAAA,CAAAb,GAAA,cAAAS,MAAA;AAAA,SAAA6C,8BAAAzC,MAAA,EAAAwC,QAAA,QAAAxC,MAAA,yBAAAJ,MAAA,WAAAkD,UAAA,GAAA9D,MAAA,CAAA+D,IAAA,CAAA/C,MAAA,OAAAb,GAAA,EAAAU,CAAA,OAAAA,CAAA,MAAAA,CAAA,GAAAiD,UAAA,CAAA/C,MAAA,EAAAF,CAAA,MAAAV,GAAA,GAAA2D,UAAA,CAAAjD,CAAA,OAAA2C,QAAA,CAAAI,OAAA,CAAAzD,GAAA,kBAAAS,MAAA,CAAAT,GAAA,IAAAa,MAAA,CAAAb,GAAA,YAAAS,MAAA;AAuBxC;AACO,IAAMoD,MAAM,gBAAG,IAAAC,iBAAU,EAC9B,UAAAC,IAAA,EAkBEC,GAAG,EACA;EAAA,IAjBDC,WAAW,GAAAF,IAAA,CAAXE,WAAW;IACXC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACRC,KAAK,GAAAJ,IAAA,CAALI,KAAK;IACLC,KAAK,GAAAL,IAAA,CAALK,KAAK;IACLC,KAAK,GAAAN,IAAA,CAALM,KAAK;IACLC,EAAE,GAAAP,IAAA,CAAFO,EAAE;IACFzC,IAAI,GAAAkC,IAAA,CAAJlC,IAAI;IACJ0C,OAAO,GAAAR,IAAA,CAAPQ,OAAO;IACPC,QAAQ,GAAAT,IAAA,CAARS,QAAQ;IACRC,QAAQ,GAAAV,IAAA,CAARU,QAAQ;IACRC,KAAK,GAAAX,IAAA,CAALW,KAAK;IACLC,QAAQ,GAAAZ,IAAA,CAARY,QAAQ;IACRC,SAAQ,GAAAb,IAAA,CAARa,QAAQ;IACR5B,KAAK,GAAAe,IAAA,CAALf,KAAK;IACF6B,IAAI,GAAAzB,wBAAA,CAAAW,IAAA,EAAAjF,SAAA;EAIT,IAAAgG,cAAA,GAAgC,IAAAC,kBAAa,EAACF,IAAI,CAAC;IAAAG,eAAA,GAAAjE,cAAA,CAAA+D,cAAA;IAA5CG,QAAQ,GAAAD,eAAA;IAAEE,WAAW,GAAAF,eAAA;EAC5B;EACA,IAAAG,SAAA,GAA4C,IAAAC,eAAQ,EAACX,QAAQ,IAAIzB,KAAK,CAAC;IAAAqC,UAAA,GAAAtE,cAAA,CAAAoE,SAAA;IAAhEG,cAAc,GAAAD,UAAA;IAAEE,iBAAiB,GAAAF,UAAA;EACxC,IAAAG,UAAA,GAAkC,IAAAJ,eAAQ,EAAC,KAAK,CAAC;IAAAK,UAAA,GAAA1E,cAAA,CAAAyE,UAAA;IAA1CE,SAAS,GAAAD,UAAA;IAAEE,YAAY,GAAAF,UAAA;EAC9B,IAAAG,UAAA,GAAkC,IAAAR,eAAQ,EAAC,KAAK,CAAC;IAAAS,UAAA,GAAA9E,cAAA,CAAA6E,UAAA;IAA1CE,SAAS,GAAAD,UAAA;IAAEE,YAAY,GAAAF,UAAA;EAE9B,oBACExH,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,CAACtH,IAAA,CAAAuH,GAAG,EAAA3F,QAAA;IAAC4F,KAAK,EAAC;EAAM,GAAKjB,QAAQ,GAC3B,CAAC,CAAChB,WAAW,iBACZ5F,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,CAACpH,QAAA,CAAAuH,OAAO;IAACC,OAAO;IAACC,OAAO,EAAEpC,WAAY;IAACqC,SAAS,EAAC;EAAS,gBACxDjI,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,CAACrH,KAAA,CAAA4H,IAAI;IAACC,OAAO,EAAC,IAAI;IAACC,KAAK,EAAC,QAAQ;IAACC,SAAS,EAAC;EAAO,gBACjDrI,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,YAAG,eAAa,CAAI,CACf,CAEV,eAED3H,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,CAACW,SAAS;IACRC,EAAE,EAAE,CAAC,CAAClC,KAAK,IAAI,CAACT,WAAW,GAAG,CAAC,GAAG,CAAE;IACpCC,QAAQ,EAAE,CAAC,CAACA,QAAS;IACrBG,KAAK,EAAE,CAAC,CAACA,KAAK,IAAIyB,SAAU;IAC5B3B,KAAK,EAAEA,KAAO;IACdC,KAAK,EAAE,CAAC,CAACA,KAAK,IAAIsB,SAAU;IAC5BhB,KAAK,EAAEA,KAAM;IACbmC,YAAY,EAAE,SAAAA,aAAA;MAAA,OAAMd,YAAY,CAAC,IAAI,CAAC;IAAA,CAAC;IACvCe,YAAY,EAAE,SAAAA,aAAA;MAAA,OAAMf,YAAY,CAAC,KAAK,CAAC;IAAA,CAAC;IACxCgB,OAAO,EAAE,SAAAA,QAAA;MAAA,OAAMpB,YAAY,CAAC,IAAI,CAAC;IAAA,CAAC;IAClCqB,MAAM,EAAE,SAAAA,OAAA;MAAA,OAAMrB,YAAY,CAAC,KAAK,CAAC;IAAA,CAAC;IAClCsB,cAAc,EAAE,CAAC,CAAC3B;EAAe,gBAEjCjH,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,WAAA1F,QAAA;IACE0D,GAAG,EAAEA,GAAW;IAChBM,EAAE,EAAEA,EAAG;IACPJ,QAAQ,EAAEA,QAAS;IACnBrC,IAAI,EAAEA,IAAK;IACXmB,KAAK,EAAEyB,QAAQ,IAAIzB,KAAM;IACzB4B,QAAQ,EAAE,SAAAA,SAACsC,KAAK,EAAK;MACnBvC,QAAQ,IAAIA,QAAQ,CAACuC,KAAK,CAACzG,MAAM,CAACuC,KAAK,CAAC;MACxC4B,SAAQ,IAAIA,SAAQ,CAACsC,KAAK,CAAC;MAC3B3B,iBAAiB,CAAC2B,KAAK,CAACzG,MAAM,CAACuC,KAAK,CAAC;IACvC;EAAE,GACEkC,WAAW,GAEdX,OAAO,CAAC4C,GAAG,CAAC,UAAAC,KAAA,EAAqB;IAAA,IAAlBpE,KAAK,GAAAoE,KAAA,CAALpE,KAAK;MAAEqE,IAAI,GAAAD,KAAA,CAAJC,IAAI;IACzB,oBACEhJ,MAAA,CAAAkB,OAAA,CAAAyG,aAAA;MAAQhD,KAAK,EAAEA,KAAM;MAAChD,GAAG,EAAEgD;IAAM,GAC9BqE,IAAI,CACE;EAEb,CAAC,CAAC,CACK,EAER,CAAC,CAAC3C,KAAK,iBACNrG,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,CAACsB,WAAW;IAACC,OAAO,EAAEjD;EAAG,GACtBI,KAAK,eAENrG,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,cAAQ,CAEX,CACS,EAEXxB,QAAQ,IAAI,EAAEL,KAAK,IAAI,OAAOA,KAAK,KAAK,QAAQ,CAAC,iBAChD9F,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,CAACvH,cAAA,CAAA+I,aAAa;IAACZ,EAAE,EAAE,GAAI;IAACa,EAAE,EAAE,CAAE;IAACvD,QAAQ,EAAEA;EAAS,EACnD,EAEAC,KAAK,IAAI,OAAOA,KAAK,KAAK,QAAQ,iBACjC9F,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,CAACrH,KAAA,CAAA4H,IAAI;IAACC,OAAO,EAAC,IAAI;IAACI,EAAE,EAAE,GAAI;IAACa,EAAE,EAAE,CAAE;IAAChB,KAAK,EAAC;EAAQ,GAC9CtC,KAAK,CAET,CACG;AAEV,CAAC,CACF;AAAAuD,OAAA,CAAA7D,MAAA,GAAAA,MAAA;AAEDA,MAAM,CAAC8D,WAAW,GAAG,QAAQ;AAE7B,IAAMC,UAAU,OAAGC,qBAAG,iNAiBrB;AAMD;AACO,IAAMC,UAAU,OAAGD,qBAAG,kPAShB,IAAAE,kBAAQ,EAAC,SAAS,CAAC,EAKxB,UAAAC,KAAA,EAA8B;EAAA,IAA3B9D,QAAQ,GAAA8D,KAAA,CAAR9D,QAAQ;EACX,OAAOA,QAAQ,GAAG,IAAA6D,kBAAQ,EAAC,eAAe,CAAC,GAAG,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC;AAC1E,CAAC,CAEN;AAAAL,OAAA,CAAAI,UAAA,GAAAA,UAAA;AAOD,IAAMnB,SAAS,GAAG,IAAAsB,yBAAM,EAAChC,QAAG,CAAC,CAAAiC,UAAA;EAAAP,WAAA;EAAAQ,WAAA;AAAA,mQAKvBP,UAAU,EAGQ,IAAAG,kBAAQ,EAAC,SAAS,CAAC,EACxB,IAAAA,kBAAQ,EAAC,YAAY,CAAC,EAGrB,IAAAA,kBAAQ,EAAC,eAAe,CAAC,EAKvC,UAACK,KAAK,EAAK;EACX,WAAOP,qBAAG,iPACNQ,qBAAa,CAAC9I,OAAO,EAErB6I,KAAK,CAAC/D,KAAK,IAAIgE,qBAAa,CAAChE,KAAK,EAClC+D,KAAK,CAAChE,KAAK,IAAIiE,qBAAa,CAACjE,KAAK,EAClCgE,KAAK,CAAClE,QAAQ,IAAImE,qBAAa,CAACnE,QAAQ,EACxCkE,KAAK,CAACjE,KAAK,IAAIkE,qBAAa,CAAClE,KAAK,EAGhCkE,qBAAa,CAAChE,KAAK,EAInBgE,qBAAa,CAACjE,KAAK,EAKnBiE,qBAAa,CAACnE,QAAQ,EAItB,EAAEkE,KAAK,CAAClE,QAAQ,IAAIkE,KAAK,CAAChE,KAAK,CAAC,IAAIiE,qBAAa,CAACC,SAAS,EAC3DF,KAAK,CAACjE,KAAK,IAAIkE,qBAAa,CAAClE,KAAK,EAKlC,CAAC,CAACiE,KAAK,CAACnB,cAAc,QACxBY,qBAAG,iBACC,EAAEO,KAAK,CAAClE,QAAQ,IAAIkE,KAAK,CAAChE,KAAK,CAAC,IAAIiE,qBAAa,CAACC,SAAS,EAC3DF,KAAK,CAACjE,KAAK,IAAIkE,qBAAa,CAAClE,KAAK,CACrC,EAICiE,KAAK,CAAC1D,KAAK,QACbmD,qBAAG,yBAEF,EAKCO,KAAK,CAAC1D,KAAK,IACb,CAAC0D,KAAK,CAACnB,cAAc,QACrBY,qBAAG,yBAEF;AAGP,CAAC,EAGDC,UAAU,CACb;AAED,IAAMR,WAAW,GAAGW,yBAAM,CAACM,KAAK,CAAAL,UAAA;EAAAP,WAAA;EAAAQ,WAAA;AAAA,yYAOhBK,gCAAuB,EAGtB,IAAAT,kBAAQ,EAAC,YAAY,CAAC,EAGf,IAAAA,kBAAQ,EAAC,cAAc,CAAC,EAQ9BS,gCAAuB,CAIxC"}