@artsy/palette 39.0.3 → 40.0.0-canary.1408.31244.0

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

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

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

@@ -1,10 +1,11 @@
+import React from "react";
 declare const _default: {
     title: string;
 };
 export default _default;
-export declare const Default: () => JSX.Element;
+export declare const Default: () => React.JSX.Element;
 export declare const Demo: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         parameters: {
             chromatic: {

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

@@ -27,4 +27,4 @@ export interface RadioProps<T> extends FlexProps, Omit<React.HTMLAttributes<HTML
     }) => void;
 }
 /** A Radio button */
-export declare const Radio: <T>({ children, disabled, hover, focus, error, label, selected, value, size, onSelect, ...rest }: RadioProps<T>) => JSX.Element;
+export declare const Radio: <T>({ children, disabled, hover, focus, error, label, selected, value, size, onSelect, ...rest }: RadioProps<T>) => React.JSX.Element;

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

@@ -1,6 +1,7 @@
+import React from "react";
 declare const _default: {
     title: string;
 };
 export default _default;
-export declare const Default: () => JSX.Element;
-export declare const SplitLabel: () => JSX.Element;
+export declare const Default: () => React.JSX.Element;
+export declare const SplitLabel: () => React.JSX.Element;

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

@@ -6,6 +6,6 @@ export interface CheckProps {
     focus?: boolean;
     selected?: boolean;
 }
-export declare const RadioDot: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("../Box").BoxProps> & import("../Box").BoxProps, keyof import("../Box").BoxProps | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+export declare const RadioDot: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("../Box").BoxProps> & import("../Box").BoxProps, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, CheckProps>> & string;

package/dist/elements/RadioGroup/RadioGroup.d.ts

@@ -30,6 +30,6 @@ export declare class RadioGroup<T> extends React.Component<RadioGroupProps<T>, R
         value: any;
     }) => void;
     renderRadioButtons(): React.ReactElement<RadioProps<T>, string | React.JSXElementConstructor<any>>[];
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 export {};

package/dist/elements/RadioGroup/RadioGroup.story.d.ts

@@ -1,12 +1,13 @@
+import React from "react";
 declare const _default: {
     title: string;
 };
 export default _default;
-export declare const Default: () => JSX.Element;
+export declare const Default: () => React.JSX.Element;
 export declare const WithDefaultValue: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         name: string;
     };
 };
-export declare const OtherTypes: () => JSX.Element;
+export declare const OtherTypes: () => React.JSX.Element;

package/dist/elements/Range/Range.d.ts

@@ -9,4 +9,4 @@ export interface RangeProps extends BoxProps {
     value?: number[];
     onChange?: (range: [number, number]) => void;
 }
-export declare const Range: React.FC<RangeProps>;
+export declare const Range: React.FC<React.PropsWithChildren<RangeProps>>;

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<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.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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"}

package/dist/elements/Range/Range.story.d.ts

@@ -1,11 +1,12 @@
+import React from "react";
 declare const _default: {
     title: string;
 };
 export default _default;
-export declare const Default: () => JSX.Element;
-export declare const WithinModal: () => JSX.Element;
+export declare const Default: () => React.JSX.Element;
+export declare const WithinModal: () => React.JSX.Element;
 export declare const WithinDrawer: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         parameters: {
             chromatic: {
@@ -14,4 +15,4 @@ export declare const WithinDrawer: {
         };
     };
 };
-export declare const InContext: () => JSX.Element;
+export declare const InContext: () => React.JSX.Element;

package/dist/elements/ReadMore/ReadMore.d.ts

@@ -9,4 +9,4 @@ export interface ReadMoreProps {
     onReadMoreClicked?: () => void;
 }
 /** ReadMore */
-export declare const ReadMore: React.FC<ReadMoreProps>;
+export declare const ReadMore: React.FC<React.PropsWithChildren<ReadMoreProps>>;

package/dist/elements/ReadMore/ReadMore.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReadMore.js","names":["_react","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_truncHtml","_Clickable","_Text","_Box","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","_typeof","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","ReadMore","_ref","expandedHTML","content","disabled","_ref$inlineReadMoreLi","inlineReadMoreLink","isExpanded","_ref$maxChars","maxChars","Infinity","onReadLessClicked","onReadMoreClicked","_useState","useState","_useState2","expanded","setExpanded","charCount","replace","HTML_TAG_REGEX","truncatedHTML","truncate","html","visible","handleClick","expandedState","createElement","dangerouslySetInnerHTML","__html","Container","Fragment","Box","Clickable","cursor","textDecoration","onClick","Text","variant","fontWeight","as","style","exports","displayName","styled","div","withConfig","componentId"],"sources":["../../../src/elements/ReadMore/ReadMore.tsx"],"sourcesContent":["import React, { useState } from \"react\"\nimport styled from \"styled-components\"\nimport truncate from \"trunc-html\"\nimport { Clickable } from \"../Clickable\"\nimport { Text } from \"../Text\"\nimport { Box } from \"../Box\"\n\nexport interface ReadMoreProps {\n  content: string\n  disabled?: boolean\n  inlineReadMoreLink?: boolean\n  isExpanded?: boolean\n  maxChars?: number\n  onReadLessClicked?: () => void\n  onReadMoreClicked?: () => void\n}\n\n/** ReadMore */\nexport const ReadMore: React.FC<ReadMoreProps> = ({\n  content: expandedHTML,\n  disabled,\n  inlineReadMoreLink = true,\n  isExpanded,\n  maxChars = Infinity,\n  onReadLessClicked,\n  onReadMoreClicked,\n}) => {\n  const [expanded, setExpanded] = useState(!!isExpanded)\n\n  if (typeof expandedHTML !== \"string\") return null\n\n  const charCount = expandedHTML.replace(HTML_TAG_REGEX, \"\").length\n\n  const truncatedHTML = truncate(expandedHTML, maxChars).html\n\n  const visible = charCount > maxChars\n\n  const handleClick = () => {\n    if (disabled) return\n    setExpanded((expandedState) => !expandedState)\n\n    expanded\n      ? onReadLessClicked && onReadLessClicked()\n      : onReadMoreClicked && onReadMoreClicked()\n  }\n\n  if (!visible) {\n    return (\n      <span\n        dangerouslySetInnerHTML={{\n          __html: expandedHTML,\n        }}\n      />\n    )\n  }\n\n  return (\n    <Container aria-expanded={expanded}>\n      {expanded ? (\n        <>\n          <Box dangerouslySetInnerHTML={{ __html: expandedHTML }} />\n\n          <Clickable\n            cursor=\"pointer\"\n            textDecoration=\"underline\"\n            onClick={handleClick}\n          >\n            <Text variant=\"xs\" fontWeight=\"bold\">\n              Read less\n            </Text>\n          </Clickable>\n        </>\n      ) : (\n        <Clickable onClick={handleClick}>\n          {inlineReadMoreLink ? (\n            <>\n              <span dangerouslySetInnerHTML={{ __html: truncatedHTML }} />{\" \"}\n            </>\n          ) : (\n            <Box dangerouslySetInnerHTML={{ __html: truncatedHTML }} />\n          )}\n\n          <Text\n            as=\"span\"\n            variant=\"xs\"\n            fontWeight=\"bold\"\n            style={{ textDecoration: \"underline\" }}\n          >\n            Read more\n          </Text>\n        </Clickable>\n      )}\n    </Container>\n  )\n}\n\nconst Container = styled.div`\n  > * > span > *:last-child {\n    display: inherit;\n  }\n`\n\nContainer.displayName = \"Container\"\n\nconst HTML_TAG_REGEX = /(<([^>]+)>)/gi\n"],"mappings":"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"}
+{"version":3,"file":"ReadMore.js","names":["_react","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_truncHtml","_Clickable","_Text","_Box","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","_typeof","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","ReadMore","_ref","expandedHTML","content","disabled","_ref$inlineReadMoreLi","inlineReadMoreLink","isExpanded","_ref$maxChars","maxChars","Infinity","onReadLessClicked","onReadMoreClicked","_useState","useState","_useState2","expanded","setExpanded","charCount","replace","HTML_TAG_REGEX","truncatedHTML","truncate","html","visible","handleClick","expandedState","createElement","dangerouslySetInnerHTML","__html","Container","Fragment","Box","Clickable","cursor","textDecoration","onClick","Text","variant","fontWeight","as","style","exports","displayName","styled","div","withConfig","componentId"],"sources":["../../../src/elements/ReadMore/ReadMore.tsx"],"sourcesContent":["import React, { useState } from \"react\"\nimport styled from \"styled-components\"\nimport truncate from \"trunc-html\"\nimport { Clickable } from \"../Clickable\"\nimport { Text } from \"../Text\"\nimport { Box } from \"../Box\"\n\nexport interface ReadMoreProps {\n  content: string\n  disabled?: boolean\n  inlineReadMoreLink?: boolean\n  isExpanded?: boolean\n  maxChars?: number\n  onReadLessClicked?: () => void\n  onReadMoreClicked?: () => void\n}\n\n/** ReadMore */\nexport const ReadMore: React.FC<React.PropsWithChildren<ReadMoreProps>> = ({\n  content: expandedHTML,\n  disabled,\n  inlineReadMoreLink = true,\n  isExpanded,\n  maxChars = Infinity,\n  onReadLessClicked,\n  onReadMoreClicked,\n}) => {\n  const [expanded, setExpanded] = useState(!!isExpanded)\n\n  if (typeof expandedHTML !== \"string\") return null\n\n  const charCount = expandedHTML.replace(HTML_TAG_REGEX, \"\").length\n\n  const truncatedHTML = truncate(expandedHTML, maxChars).html\n\n  const visible = charCount > maxChars\n\n  const handleClick = () => {\n    if (disabled) return\n    setExpanded((expandedState) => !expandedState)\n\n    expanded\n      ? onReadLessClicked && onReadLessClicked()\n      : onReadMoreClicked && onReadMoreClicked()\n  }\n\n  if (!visible) {\n    return (\n      <span\n        dangerouslySetInnerHTML={{\n          __html: expandedHTML,\n        }}\n      />\n    )\n  }\n\n  return (\n    <Container aria-expanded={expanded}>\n      {expanded ? (\n        <>\n          <Box dangerouslySetInnerHTML={{ __html: expandedHTML }} />\n\n          <Clickable\n            cursor=\"pointer\"\n            textDecoration=\"underline\"\n            onClick={handleClick}\n          >\n            <Text variant=\"xs\" fontWeight=\"bold\">\n              Read less\n            </Text>\n          </Clickable>\n        </>\n      ) : (\n        <Clickable onClick={handleClick}>\n          {inlineReadMoreLink ? (\n            <>\n              <span dangerouslySetInnerHTML={{ __html: truncatedHTML }} />{\" \"}\n            </>\n          ) : (\n            <Box dangerouslySetInnerHTML={{ __html: truncatedHTML }} />\n          )}\n\n          <Text\n            as=\"span\"\n            variant=\"xs\"\n            fontWeight=\"bold\"\n            style={{ textDecoration: \"underline\" }}\n          >\n            Read more\n          </Text>\n        </Clickable>\n      )}\n    </Container>\n  )\n}\n\nconst Container = styled.div`\n  > * > span > *:last-child {\n    display: inherit;\n  }\n`\n\nContainer.displayName = \"Container\"\n\nconst HTML_TAG_REGEX = /(<([^>]+)>)/gi\n"],"mappings":"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"}

package/dist/elements/ReadMore/ReadMore.story.d.ts

@@ -1,51 +1,52 @@
+import React from "react";
 declare const _default: {
     title: string;
 };
 export default _default;
 export declare const WithCharacterCap: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const ShortContent: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const AsString: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const CharacterCapWithHtml: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithCustomizableTypography: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithCustomizableTypography2: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const CharacterCapWithHtmlDisabled: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithBottomReadMore: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         name: string;
     };

package/dist/elements/ResponsiveBox/ResponsiveBox.d.ts

@@ -18,4 +18,4 @@ export interface ResponsiveBoxAspectDimensions {
 /** ResponsiveBoxProps */
 export declare type ResponsiveBoxProps = Omit<BoxProps, "maxWidth" | "maxHeight"> & ResponsiveBoxAspectDimensions & ResponsiveBoxMaxDimensions;
 /** ResponsiveBox */
-export declare const ResponsiveBox: React.FC<ResponsiveBoxProps>;
+export declare const ResponsiveBox: React.FC<React.PropsWithChildren<ResponsiveBoxProps>>;

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

@@ -1 +1 @@
-{"version":3,"file":"ResponsiveBox.js","names":["_proportionalScale","require","_react","_interopRequireDefault","_Box","_excluded","_excluded2","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","ownKeys","object","enumerableOnly","keys","getOwnPropertySymbols","symbols","filter","sym","getOwnPropertyDescriptor","enumerable","push","_objectSpread","forEach","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","value","_toPropertyKey","configurable","writable","arg","_toPrimitive","_typeof","String","input","hint","prim","Symbol","toPrimitive","undefined","res","TypeError","Number","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","responsiveScale","args","maxWidth","paddingBottom","width","aspectWidth","height","aspectHeight","rest","scaled","scale","concat","ResponsiveBox","_ref","children","createElement","Box","position","overflow","style","aspectRatio","exports","displayName"],"sources":["../../../src/elements/ResponsiveBox/ResponsiveBox.tsx"],"sourcesContent":["import { paddingBottom, scale } from \"proportional-scale\"\nimport React from \"react\"\nimport { Box, BoxProps } from \"../Box\"\n\n/** ResponsiveBoxMaxDimensions */\nexport type ResponsiveBoxMaxDimensions =\n  | {\n      maxWidth: number\n      maxHeight: number\n    }\n  | { maxWidth: number }\n  | { maxHeight: number }\n  | { maxWidth: \"100%\" }\n\nexport interface ResponsiveBoxAspectDimensions {\n  aspectWidth: number\n  aspectHeight: number\n}\n\nconst responsiveScale = (\n  args: ResponsiveBoxAspectDimensions & ResponsiveBoxMaxDimensions\n) => {\n  if (\"maxWidth\" in args && args.maxWidth === \"100%\") {\n    return {\n      maxWidth: \"100%\",\n      paddingBottom: paddingBottom({\n        width: args.aspectWidth,\n        height: args.aspectHeight,\n      }),\n    }\n  }\n\n  const { aspectWidth: width, aspectHeight: height, ...rest } = args\n  const scaled = scale({ width, height, ...rest })\n\n  return {\n    maxWidth: `${scaled.width}px`,\n    paddingBottom: scaled.paddingBottom,\n  }\n}\n\n/** ResponsiveBoxProps */\nexport type ResponsiveBoxProps = Omit<BoxProps, \"maxWidth\" | \"maxHeight\"> &\n  ResponsiveBoxAspectDimensions &\n  ResponsiveBoxMaxDimensions\n\n/** ResponsiveBox */\nexport const ResponsiveBox: React.FC<ResponsiveBoxProps> = ({\n  aspectWidth,\n  aspectHeight,\n  children,\n  ...rest\n}) => {\n  const scaled = responsiveScale({ aspectHeight, aspectWidth, ...rest })\n\n  return (\n    <Box\n      position=\"relative\"\n      width=\"100%\"\n      overflow=\"hidden\"\n      style={{\n        aspectRatio: `${aspectWidth} / ${aspectHeight}`,\n        maxWidth: scaled.maxWidth,\n      }}\n      {...rest}\n    >\n      {children}\n    </Box>\n  )\n}\n\nResponsiveBox.displayName = \"ResponsiveBox\"\n"],"mappings":"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"}
+{"version":3,"file":"ResponsiveBox.js","names":["_proportionalScale","require","_react","_interopRequireDefault","_Box","_excluded","_excluded2","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","ownKeys","object","enumerableOnly","keys","getOwnPropertySymbols","symbols","filter","sym","getOwnPropertyDescriptor","enumerable","push","_objectSpread","forEach","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","value","_toPropertyKey","configurable","writable","arg","_toPrimitive","_typeof","String","input","hint","prim","Symbol","toPrimitive","undefined","res","TypeError","Number","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","responsiveScale","args","maxWidth","paddingBottom","width","aspectWidth","height","aspectHeight","rest","scaled","scale","concat","ResponsiveBox","_ref","children","createElement","Box","position","overflow","style","aspectRatio","exports","displayName"],"sources":["../../../src/elements/ResponsiveBox/ResponsiveBox.tsx"],"sourcesContent":["import { paddingBottom, scale } from \"proportional-scale\"\nimport React from \"react\"\nimport { Box, BoxProps } from \"../Box\"\n\n/** ResponsiveBoxMaxDimensions */\nexport type ResponsiveBoxMaxDimensions =\n  | {\n      maxWidth: number\n      maxHeight: number\n    }\n  | { maxWidth: number }\n  | { maxHeight: number }\n  | { maxWidth: \"100%\" }\n\nexport interface ResponsiveBoxAspectDimensions {\n  aspectWidth: number\n  aspectHeight: number\n}\n\nconst responsiveScale = (\n  args: ResponsiveBoxAspectDimensions & ResponsiveBoxMaxDimensions\n) => {\n  if (\"maxWidth\" in args && args.maxWidth === \"100%\") {\n    return {\n      maxWidth: \"100%\",\n      paddingBottom: paddingBottom({\n        width: args.aspectWidth,\n        height: args.aspectHeight,\n      }),\n    }\n  }\n\n  const { aspectWidth: width, aspectHeight: height, ...rest } = args\n  const scaled = scale({ width, height, ...rest })\n\n  return {\n    maxWidth: `${scaled.width}px`,\n    paddingBottom: scaled.paddingBottom,\n  }\n}\n\n/** ResponsiveBoxProps */\nexport type ResponsiveBoxProps = Omit<BoxProps, \"maxWidth\" | \"maxHeight\"> &\n  ResponsiveBoxAspectDimensions &\n  ResponsiveBoxMaxDimensions\n\n/** ResponsiveBox */\nexport const ResponsiveBox: React.FC<React.PropsWithChildren<ResponsiveBoxProps>> = ({\n  aspectWidth,\n  aspectHeight,\n  children,\n  ...rest\n}) => {\n  const scaled = responsiveScale({ aspectHeight, aspectWidth, ...rest })\n\n  return (\n    <Box\n      position=\"relative\"\n      width=\"100%\"\n      overflow=\"hidden\"\n      style={{\n        aspectRatio: `${aspectWidth} / ${aspectHeight}`,\n        maxWidth: scaled.maxWidth,\n      }}\n      {...rest}\n    >\n      {children}\n    </Box>\n  )\n}\n\nResponsiveBox.displayName = \"ResponsiveBox\"\n"],"mappings":"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"}

package/dist/elements/ResponsiveBox/ResponsiveBox.story.d.ts

@@ -1,12 +1,13 @@
+import React from "react";
 declare const _default: {
     title: string;
 };
 export default _default;
-export declare const Basic: () => JSX.Element;
+export declare const Basic: () => React.JSX.Element;
 export declare const MaxWidth100: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         name: string;
     };
 };
-export declare const ColumnsWithResponsiveImages: () => JSX.Element;
+export declare const ColumnsWithResponsiveImages: () => React.JSX.Element;

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<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>> = (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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"}

package/dist/elements/Select/Select.d.ts

@@ -1,4 +1,4 @@
-import React, { ForwardRefExoticComponent, Ref } from "react";
+import React from "react";
 import { BoxProps } from "../Box";
 export interface Option {
     value: string;
@@ -18,8 +18,6 @@ export interface SelectProps extends BoxProps, Omit<React.SelectHTMLAttributes<H
     onSelect?: (value: string) => void;
 }
 /** A drop-down select menu */
-export declare const Select: ForwardRefExoticComponent<SelectProps & {
-    ref?: Ref<HTMLElement>;
-}>;
+export declare const Select: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLElement>>;
 /** Creates a small caret */
 export declare const caretMixin: import("styled-components").RuleSet<object>;

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, {\n  forwardRef,\n  ForwardRefExoticComponent,\n  Ref,\n  useState,\n} 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: ForwardRefExoticComponent<\n  SelectProps & { ref?: Ref<HTMLElement> }\n> = forwardRef(\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=\"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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"}