@artsy/palette 45.13.1 → 45.14.0-canary.1497.33070.0

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

@@ -0,0 +1,173 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import React, { useEffect, useRef, useState } from "react";
+import styled from "styled-components";
+import { Box } from "../Box";
+import { Text } from "../Text";
+import { Image } from "../Image";
+import { ResponsiveBox, ResponsiveBoxAspectDimensions, ResponsiveBoxMaxDimensions, ResponsiveBoxProps } from "./ResponsiveBox";
+import { STORYBOOK_PROPS_BLOCKLIST } from "../../utils/storybookBlocklist";
+var Measure = function Measure(props) {
+  var _useState = useState({
+      width: 0,
+      height: 0
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    dimensions = _useState2[0],
+    setDimensions = _useState2[1];
+  var ref = useRef(null);
+  var check = function check() {
+    if (!ref.current) return;
+    setDimensions({
+      width: ref.current.offsetWidth,
+      height: ref.current.offsetHeight
+    });
+  };
+  useEffect(function () {
+    requestAnimationFrame(check);
+    window.addEventListener("resize", check);
+    return function () {
+      window.removeEventListener("resize", check);
+    };
+  });
+  return /*#__PURE__*/React.createElement(Box, {
+    width: "100%",
+    height: "100%",
+    p: 1,
+    ref: ref
+  }, /*#__PURE__*/React.createElement(Text, {
+    variant: "xs",
+    color: "mono0"
+  }, props.aspectWidth, ":", props.aspectHeight, /*#__PURE__*/React.createElement("br", null), ("maxWidth" in props || "maxHeight" in props) && /*#__PURE__*/React.createElement(React.Fragment, null, "with max dimensions of", " ", [props.maxHeight || 0, props.maxWidth || "_"].join(" × "), /*#__PURE__*/React.createElement("br", null)), "Renders @ ", dimensions.width, " \xD7 ", dimensions.height));
+};
+Measure.displayName = "Measure";
+var EXAMPLE_ASPECTS = [{
+  aspectWidth: 300,
+  aspectHeight: 400
+}, {
+  aspectWidth: 400,
+  aspectHeight: 300
+}];
+var EXAMPLE_MAXIMUMS = [{
+  maxHeight: 200,
+  maxWidth: 200
+}, {
+  maxHeight: 400,
+  maxWidth: 400
+}, {
+  maxHeight: 400
+}, {
+  maxWidth: 400
+}, {
+  maxHeight: 600,
+  maxWidth: 600
+}, {
+  maxHeight: 100,
+  maxWidth: 600
+}, {
+  maxHeight: 1024,
+  maxWidth: 1024
+}];
+export default {
+  component: ResponsiveBox,
+  title: "Components/ResponsiveBox",
+  tags: ["autodocs"],
+  parameters: {
+    docs: {
+      description: {
+        component: "A responsive container that maintains aspect ratio and optionally constrains maximum dimensions."
+      },
+      controls: {
+        exclude: STORYBOOK_PROPS_BLOCKLIST
+      }
+    }
+  }
+};
+export var Basic = {
+  render: function render() {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, EXAMPLE_ASPECTS.map(function (aspect, i) {
+      return EXAMPLE_MAXIMUMS.map(function (maximum, j) {
+        return /*#__PURE__*/React.createElement(ResponsiveBox, _extends({
+          key: [i, j].join(".")
+        }, aspect, maximum, {
+          bg: "brand",
+          my: 2
+        }), /*#__PURE__*/React.createElement(Measure, _extends({}, aspect, maximum)));
+      });
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Basic responsive boxes with various aspect ratios and maximum dimensions."
+      }
+    }
+  }
+};
+export var MaxWidth100 = {
+  render: function render() {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, EXAMPLE_ASPECTS.map(function (aspect, i) {
+      return /*#__PURE__*/React.createElement(ResponsiveBox, _extends({
+        key: i
+      }, aspect, {
+        maxWidth: "100%",
+        bg: "brand",
+        my: 2
+      }), /*#__PURE__*/React.createElement(Measure, _extends({}, aspect, {
+        maxWidth: "100%"
+      })));
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Responsive boxes constrained to 100% maximum width."
+      }
+    }
+  }
+};
+var Masonry = styled(Box).withConfig({
+  displayName: "ResponsiveBoxstory__Masonry",
+  componentId: "sc-m69kz2-0"
+})(["column-count:3;*{break-inside:avoid;}"]);
+export var ColumnsWithResponsiveImages = {
+  render: function render() {
+    return /*#__PURE__*/React.createElement(Masonry, null, new Array(12).fill(0).map(function (_, i) {
+      var orientation = i % 3 === 0 ? "portrait" : "landscape";
+      var width = orientation === "portrait" ? 200 : 300;
+      var height = orientation === "portrait" ? 300 : 200;
+      return (
+        /*#__PURE__*/
+        // Simply being wrapped in an extra `Box` causes a image loading bug in Chrome
+        React.createElement(Box, {
+          key: i
+        }, /*#__PURE__*/React.createElement(ResponsiveBox, {
+          aspectWidth: width,
+          aspectHeight: height,
+          maxWidth: "100%",
+          bg: "mono10",
+          mb: 2
+        }, /*#__PURE__*/React.createElement(Image, {
+          lazyLoad: true,
+          width: "100%",
+          height: "100%",
+          src: "https://picsum.photos/seed/".concat(i, "/").concat(width, "/").concat(height),
+          srcSet: "https://picsum.photos/seed/".concat(i, "/").concat(width, "/").concat(height, " 1x, https://picsum.photos/seed/").concat(i, "/").concat(width * 2, "/").concat(height * 2, " 2x")
+        })))
+      );
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Responsive images in a masonry layout with different orientations."
+      }
+    }
+  }
+};
+//# sourceMappingURL=ResponsiveBox.story.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ResponsiveBox.story.js","names":["React","useEffect","useRef","useState","styled","Box","Text","Image","ResponsiveBox","ResponsiveBoxAspectDimensions","ResponsiveBoxMaxDimensions","ResponsiveBoxProps","STORYBOOK_PROPS_BLOCKLIST","Measure","props","_useState","width","height","_useState2","_slicedToArray","dimensions","setDimensions","ref","check","current","offsetWidth","offsetHeight","requestAnimationFrame","window","addEventListener","removeEventListener","createElement","p","variant","color","aspectWidth","aspectHeight","Fragment","maxHeight","maxWidth","join","displayName","EXAMPLE_ASPECTS","EXAMPLE_MAXIMUMS","component","title","tags","parameters","docs","description","controls","exclude","Basic","render","map","aspect","i","maximum","j","_extends","key","bg","my","story","MaxWidth100","Masonry","withConfig","componentId","ColumnsWithResponsiveImages","Array","fill","_","orientation","mb","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\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\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    requestAnimationFrame(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 {\n  component: ResponsiveBox,\n  title: \"Components/ResponsiveBox\",\n  tags: [\"autodocs\"],\n  parameters: {\n    docs: {\n      description: {\n        component:\n          \"A responsive container that maintains aspect ratio and optionally constrains maximum dimensions.\",\n      },\n      controls: {\n        exclude: STORYBOOK_PROPS_BLOCKLIST,\n      },\n    },\n  },\n}\n\nexport const Basic = {\n  render: () => (\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  parameters: {\n    docs: {\n      description: {\n        story:\n          \"Basic responsive boxes with various aspect ratios and maximum dimensions.\",\n      },\n    },\n  },\n}\n\nexport const MaxWidth100 = {\n  render: () => (\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  parameters: {\n    docs: {\n      description: {\n        story: \"Responsive boxes constrained to 100% maximum width.\",\n      },\n    },\n  },\n}\n\nconst Masonry = styled(Box)`\n  column-count: 3;\n\n  * {\n    break-inside: avoid;\n  }\n`\n\nexport const ColumnsWithResponsiveImages = {\n  render: () => (\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  parameters: {\n    docs: {\n      description: {\n        story:\n          \"Responsive images in a masonry layout with different orientations.\",\n      },\n    },\n  },\n}\n"],"mappings":"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"}

package/dist/esm/elements/ResponsiveBox/index.js

@@ -0,0 +1,2 @@
+export * from "./ResponsiveBox";
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/elements/ResponsiveBox/index.ts"],"sourcesContent":["export * from \"./ResponsiveBox\"\n"],"mappings":"AAAA"}

package/dist/esm/elements/Select/Select.js

@@ -0,0 +1,132 @@
+var _excluded = ["description", "disabled", "error", "focus", "hover", "id", "name", "options", "required", "selected", "title", "onSelect", "onChange", "value"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import { themeGet } from "@styled-system/theme-get";
+import React, { forwardRef, useState } from "react";
+import styled, { css, ExecutionContext } from "styled-components";
+import { FORM_ELEMENT_TRANSITION } from "../../helpers";
+import { RequiredField } from "../../shared/RequiredField";
+import { Box, BoxProps, splitBoxProps } from "../Box";
+import { Text } from "../Text";
+import { Tooltip } from "../Tooltip";
+import { SELECT_STATES } from "./tokens";
+/** A drop-down select menu */
+export var Select = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var description = _ref.description,
+    disabled = _ref.disabled,
+    error = _ref.error,
+    focus = _ref.focus,
+    hover = _ref.hover,
+    id = _ref.id,
+    name = _ref.name,
+    options = _ref.options,
+    required = _ref.required,
+    selected = _ref.selected,
+    title = _ref.title,
+    onSelect = _ref.onSelect,
+    _onChange = _ref.onChange,
+    value = _ref.value,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var _splitBoxProps = splitBoxProps(rest),
+    _splitBoxProps2 = _slicedToArray(_splitBoxProps, 2),
+    boxProps = _splitBoxProps2[0],
+    selectProps = _splitBoxProps2[1];
+  // due to :has not available in Firefox yet, we need to add the styles to the label using JS
+  var _useState = useState(selected || value),
+    _useState2 = _slicedToArray(_useState, 2),
+    selectedOption = _useState2[0],
+    setSelectedOption = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isFocused = _useState4[0],
+    setIsFocused = _useState4[1];
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    isHovered = _useState6[0],
+    setIsHovered = _useState6[1];
+  return /*#__PURE__*/React.createElement(Box, _extends({
+    width: "100%"
+  }, boxProps), !!description && /*#__PURE__*/React.createElement(Tooltip, {
+    pointer: true,
+    content: description,
+    placement: "top-end"
+  }, /*#__PURE__*/React.createElement(Text, {
+    variant: "xs",
+    color: "mono60",
+    textAlign: "right"
+  }, /*#__PURE__*/React.createElement("u", null, "What is this?"))), /*#__PURE__*/React.createElement(Container, {
+    mt: !!title && !description ? 1 : 0,
+    disabled: !!disabled,
+    hover: !!hover || isHovered,
+    error: error,
+    focus: !!focus || isFocused,
+    title: title,
+    onMouseEnter: function onMouseEnter() {
+      return setIsHovered(true);
+    },
+    onMouseLeave: function onMouseLeave() {
+      return setIsHovered(false);
+    },
+    onFocus: function onFocus() {
+      return setIsFocused(true);
+    },
+    onBlur: function onBlur() {
+      return setIsFocused(false);
+    },
+    optionSelected: !!selectedOption
+  }, /*#__PURE__*/React.createElement("select", _extends({
+    ref: ref,
+    id: id,
+    disabled: disabled,
+    name: name,
+    value: selected || value,
+    onChange: function onChange(event) {
+      onSelect && onSelect(event.target.value);
+      _onChange && _onChange(event);
+      setSelectedOption(event.target.value);
+    }
+  }, selectProps), options.map(function (_ref2) {
+    var value = _ref2.value,
+      text = _ref2.text;
+    return /*#__PURE__*/React.createElement("option", {
+      value: value,
+      key: value
+    }, text);
+  })), !!title && /*#__PURE__*/React.createElement(StyledLabel, {
+    htmlFor: id
+  }, title, /*#__PURE__*/React.createElement("span", null))), required && !(error && typeof error === "string") && /*#__PURE__*/React.createElement(RequiredField, {
+    mt: 0.5,
+    ml: 1,
+    disabled: disabled
+  }), error && typeof error === "string" && /*#__PURE__*/React.createElement(Text, {
+    variant: "xs",
+    mt: 0.5,
+    ml: 1,
+    color: "red100"
+  }, error));
+});
+Select.displayName = "Select";
+var resetMixin = css(["appearance:none;background:none;border:none;outline:0;text-indent:0.01px;text-overflow:\"\";border-radius:0;&:-moz-focusring{color:transparent;text-shadow:0 0 0 black;}option:not(:checked){color:black;}"]);
+/** Creates a small caret */
+export var caretMixin = 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 ", ";}"], themeGet("space.1"), function (_ref3) {
+  var disabled = _ref3.disabled;
+  return disabled ? themeGet("colors.mono10") : themeGet("colors.mono100");
+});
+var Container = styled(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, themeGet("space.1"), themeGet("fonts.sans"), themeGet("colors.mono30"), function (props) {
+  return css(["", " ", " ", " ", " ", " &:hover{", "}&:focus{", "}&:disabled{cursor:default;", "}&:not(:focus):not(:has(option[value=\"\"]:checked)){", " ", "}&:not(:focus){", "}&:not(:focus):has(option[value=\"\"]:checked){", "}&:not(:focus){", "}"], SELECT_STATES.default, props.hover && SELECT_STATES.hover, props.focus && SELECT_STATES.focus, props.disabled && SELECT_STATES.disabled, props.error && SELECT_STATES.error, SELECT_STATES.hover, SELECT_STATES.focus, SELECT_STATES.disabled, !(props.disabled || props.focus) && SELECT_STATES.completed, props.error && SELECT_STATES.error, !!props.optionSelected && css(["", " ", ""], !(props.disabled || props.focus) && SELECT_STATES.completed, props.error && SELECT_STATES.error), props.title && css(["color:transparent;"]), props.title && !props.optionSelected && css(["color:transparent;"]));
+}, caretMixin);
+var StyledLabel = styled.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;}"], FORM_ELEMENT_TRANSITION, themeGet("fonts.sans"), themeGet("colors.mono0"), FORM_ELEMENT_TRANSITION);
+//# sourceMappingURL=Select.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Select.js","names":["themeGet","React","forwardRef","useState","styled","css","ExecutionContext","FORM_ELEMENT_TRANSITION","RequiredField","Box","BoxProps","splitBoxProps","Text","Tooltip","SELECT_STATES","Select","_ref","ref","description","disabled","error","focus","hover","id","name","options","required","selected","title","onSelect","onChange","value","rest","_objectWithoutProperties","_excluded","_splitBoxProps","_splitBoxProps2","_slicedToArray","boxProps","selectProps","_useState","_useState2","selectedOption","setSelectedOption","_useState3","_useState4","isFocused","setIsFocused","_useState5","_useState6","isHovered","setIsHovered","createElement","_extends","width","pointer","content","placement","variant","color","textAlign","Container","mt","onMouseEnter","onMouseLeave","onFocus","onBlur","optionSelected","event","target","map","_ref2","text","key","StyledLabel","htmlFor","ml","displayName","resetMixin","caretMixin","_ref3","withConfig","componentId","props","default","completed","label"],"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":"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"}

package/dist/esm/elements/Select/Select.story.js

@@ -0,0 +1,246 @@
+import { Select } from "./Select";
+import { STORYBOOK_PROPS_BLOCKLIST } from "../../utils/storybookBlocklist";
+export default {
+  component: Select,
+  title: "Components/Select",
+  tags: ["autodocs"],
+  parameters: {
+    docs: {
+      description: {
+        component: "A styled select dropdown component with options, states, and form validation."
+      }
+    },
+    controls: {
+      exclude: STORYBOOK_PROPS_BLOCKLIST
+    }
+  }
+};
+var OPTIONS = [{
+  text: "Please select",
+  value: ""
+}, {
+  text: "Default",
+  value: "-decayed_merch"
+}, {
+  text: "Price (desc.)",
+  value: "-has_price,-prices"
+}, {
+  text: "Price (asc.)",
+  value: "-has_price,prices"
+}, {
+  text: "Recently updated",
+  value: "-partner_updated_at"
+}, {
+  text: "Recently added",
+  value: "-published_at"
+}, {
+  text: "Artwork year (desc.)",
+  value: "-year"
+}, {
+  text: "Artwork year (asc.)",
+  value: "year"
+}];
+export var Default = {
+  args: {
+    options: OPTIONS
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Default Select component."
+      }
+    }
+  }
+};
+export var Focus = {
+  args: {
+    options: OPTIONS,
+    focus: true
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Select with focus state."
+      }
+    }
+  }
+};
+export var Hover = {
+  args: {
+    options: OPTIONS,
+    hover: true
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Select with hover state."
+      }
+    }
+  }
+};
+export var WithError = {
+  args: {
+    options: OPTIONS,
+    error: "Something went wrong."
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Select with error state."
+      }
+    }
+  }
+};
+export var Disabled = {
+  args: {
+    options: OPTIONS,
+    disabled: true
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Select disabled state."
+      }
+    }
+  }
+};
+export var WithTitle = {
+  args: {
+    options: OPTIONS,
+    title: "Sort"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Select with title."
+      }
+    }
+  }
+};
+export var WithTitleAndDescription = {
+  args: {
+    options: OPTIONS,
+    title: "Sort",
+    description: "A description of sorting"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Select with title and description."
+      }
+    }
+  }
+};
+export var WithTitleAndFocus = {
+  args: {
+    options: OPTIONS,
+    title: "Sort",
+    focus: true
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Select with title and focus state."
+      }
+    }
+  }
+};
+export var WithTitleAndHover = {
+  args: {
+    options: OPTIONS,
+    title: "Sort",
+    hover: true
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Select with title and hover state."
+      }
+    }
+  }
+};
+export var WithTitleAndError = {
+  args: {
+    options: OPTIONS,
+    title: "Sort",
+    error: "Something went wrong."
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Select with title and error state."
+      }
+    }
+  }
+};
+export var WithTitleDisabled = {
+  args: {
+    options: OPTIONS,
+    title: "Sort",
+    disabled: true
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Select with title and disabled state."
+      }
+    }
+  }
+};
+export var Required = {
+  args: {
+    options: OPTIONS,
+    title: "Sort",
+    required: true
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Select with required state."
+      }
+    }
+  }
+};
+export var WithSelectedValue = {
+  args: {
+    options: OPTIONS,
+    selected: "year"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Select with pre-selected value."
+      }
+    }
+  }
+};
+export var WithCustomId = {
+  args: {
+    options: OPTIONS,
+    title: "Pick something",
+    required: true,
+    id: "pick"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Select with custom id."
+      }
+    }
+  }
+};
+export var WithDescriptionOnly = {
+  args: {
+    options: OPTIONS,
+    title: "Pick something",
+    description: "This matters a lot."
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Select with descriptive text."
+      }
+    }
+  }
+};
+//# sourceMappingURL=Select.story.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Select.story.js","names":["Select","STORYBOOK_PROPS_BLOCKLIST","component","title","tags","parameters","docs","description","controls","exclude","OPTIONS","text","value","Default","args","options","story","Focus","focus","Hover","hover","WithError","error","Disabled","disabled","WithTitle","WithTitleAndDescription","WithTitleAndFocus","WithTitleAndHover","WithTitleAndError","WithTitleDisabled","Required","required","WithSelectedValue","selected","WithCustomId","id","WithDescriptionOnly"],"sources":["../../../../src/elements/Select/Select.story.tsx"],"sourcesContent":["import { Select } from \"./Select\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\n\nexport default {\n  component: Select,\n  title: \"Components/Select\",\n  tags: [\"autodocs\"],\n  parameters: {\n    docs: {\n      description: {\n        component:\n          \"A styled select dropdown component with options, states, and form validation.\",\n      },\n    },\n    controls: {\n        exclude: STORYBOOK_PROPS_BLOCKLIST,\n      },\n  },\n}\n\nconst OPTIONS = [\n  { text: \"Please select\", value: \"\" },\n  { text: \"Default\", value: \"-decayed_merch\" },\n  { text: \"Price (desc.)\", value: \"-has_price,-prices\" },\n  { text: \"Price (asc.)\", value: \"-has_price,prices\" },\n  { text: \"Recently updated\", value: \"-partner_updated_at\" },\n  { text: \"Recently added\", value: \"-published_at\" },\n  { text: \"Artwork year (desc.)\", value: \"-year\" },\n  { text: \"Artwork year (asc.)\", value: \"year\" },\n]\n\nexport const Default = {\n  args: {\n    options: OPTIONS,\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Default Select component.\",\n      },\n    },\n  },\n}\n\nexport const Focus = {\n  args: {\n    options: OPTIONS,\n    focus: true,\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Select with focus state.\",\n      },\n    },\n  },\n}\n\nexport const Hover = {\n  args: {\n    options: OPTIONS,\n    hover: true,\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Select with hover state.\",\n      },\n    },\n  },\n}\n\nexport const WithError = {\n  args: {\n    options: OPTIONS,\n    error: \"Something went wrong.\",\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Select with error state.\",\n      },\n    },\n  },\n}\n\nexport const Disabled = {\n  args: {\n    options: OPTIONS,\n    disabled: true,\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Select disabled state.\",\n      },\n    },\n  },\n}\n\nexport const WithTitle = {\n  args: {\n    options: OPTIONS,\n    title: \"Sort\",\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Select with title.\",\n      },\n    },\n  },\n}\n\nexport const WithTitleAndDescription = {\n  args: {\n    options: OPTIONS,\n    title: \"Sort\",\n    description: \"A description of sorting\",\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Select with title and description.\",\n      },\n    },\n  },\n}\n\nexport const WithTitleAndFocus = {\n  args: {\n    options: OPTIONS,\n    title: \"Sort\",\n    focus: true,\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Select with title and focus state.\",\n      },\n    },\n  },\n}\n\nexport const WithTitleAndHover = {\n  args: {\n    options: OPTIONS,\n    title: \"Sort\",\n    hover: true,\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Select with title and hover state.\",\n      },\n    },\n  },\n}\n\nexport const WithTitleAndError = {\n  args: {\n    options: OPTIONS,\n    title: \"Sort\",\n    error: \"Something went wrong.\",\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Select with title and error state.\",\n      },\n    },\n  },\n}\n\nexport const WithTitleDisabled = {\n  args: {\n    options: OPTIONS,\n    title: \"Sort\",\n    disabled: true,\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Select with title and disabled state.\",\n      },\n    },\n  },\n}\n\nexport const Required = {\n  args: {\n    options: OPTIONS,\n    title: \"Sort\",\n    required: true,\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Select with required state.\",\n      },\n    },\n  },\n}\n\nexport const WithSelectedValue = {\n  args: {\n    options: OPTIONS,\n    selected: \"year\",\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Select with pre-selected value.\",\n      },\n    },\n  },\n}\n\nexport const WithCustomId = {\n  args: {\n    options: OPTIONS,\n    title: \"Pick something\",\n    required: true,\n    id: \"pick\",\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Select with custom id.\",\n      },\n    },\n  },\n}\n\nexport const WithDescriptionOnly = {\n  args: {\n    options: OPTIONS,\n    title: \"Pick something\",\n    description: \"This matters a lot.\",\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Select with descriptive text.\",\n      },\n    },\n  },\n}\n"],"mappings":"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"}

package/dist/esm/elements/Select/index.js

@@ -0,0 +1,2 @@
+export * from "./Select";
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/elements/Select/index.tsx"],"sourcesContent":["export * from \"./Select\"\n"],"mappings":"AAAA"}