@artsy/palette 45.14.0-canary.1497.33070.0 → 45.14.0-canary.1497.33075.0

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

@@ -1 +1 @@
-{"version":3,"file":"Dropdown.story.js","names":["React","useEffect","useState","Position","Box","Button","Text","Dropdown","Clickable","Flex","Pill","ChevronSmallDownIcon","Spacer","STORYBOOK_PROPS_BLOCKLIST","component","title","tags","parameters","docs","description","controls","exclude","Default","args","placement","dropdown","createElement","width","p","as","display","variant","href","children","_ref","anchorRef","anchorProps","textAlign","_extends","ref","size","chromatic","disable","KeepInDOM","keepInDOM","_ref2","ChangeDimensions","render","_useState","_useState2","_slicedToArray","height","setHeight","setInterval","Math","floor","random","_ref3","FocusOrder","py","px","_ref4","mr","_ref5","OpenDropdownByClick","openDropdownByClick","_ref6","FilterExample","_ref7","Icon","iconPosition","OverflowingContent","Array","fill","map","_","i","key","_useState3","_useState4","setPlacement","Fragment","bg","y","mb","selected","onClick","alignItems","justifyContent","_ref8","DisabledTransition","num","concat","transition","_ref9","ReturnFocusDefault","color","tabIndex","_ref10","story","ReturnFocusDisabled","returnFocus","alert","_ref11","CustomDelay","gap","delay","_ref12","_ref13","_ref14"],"sources":["../../../../src/elements/Dropdown/Dropdown.story.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\"\nimport { Position } from \"../../utils\"\nimport { Box } from \"../Box\"\nimport { Button } from \"../Button\"\nimport { Text } from \"../Text\"\nimport { Dropdown } from \"./Dropdown\"\nimport { Clickable } from \"../Clickable\"\nimport { Flex } from \"../Flex\"\nimport { Pill } from \"../Pill\"\nimport ChevronSmallDownIcon from \"@artsy/icons/ChevronSmallDownIcon\"\nimport { Spacer } from \"../Spacer\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\n\nexport default {\n  component: Dropdown,\n  title: \"Components/Dropdown\",\n  tags: [\"autodocs\"],\n  parameters: {\n    docs: {\n      description: {\n        component:\n          \"A dropdown component that renders content in a positioned overlay with various placement options and interaction modes.\",\n      },\n    },\n    controls: {\n      exclude: STORYBOOK_PROPS_BLOCKLIST,\n    },\n  },\n}\n\nexport const Default = {\n  args: {\n    placement: \"bottom\",\n    dropdown: (\n      <Box width={300} p={2}>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n          One\n        </Text>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n          Two\n        </Text>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n          Three\n        </Text>\n      </Box>\n    ),\n    children: ({ anchorRef, anchorProps }) => (\n      <Box textAlign=\"center\">\n        <Button\n          ref={anchorRef}\n          variant=\"secondaryBlack\"\n          size=\"small\"\n          {...anchorProps}\n        >\n          Hover to display dropdown\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: { chromatic: { disable: true } },\n}\n\nexport const KeepInDOM = {\n  args: {\n    placement: \"bottom\",\n    keepInDOM: true,\n    dropdown: (\n      <Text p={2} variant=\"xs\">\n        Content remains in DOM\n      </Text>\n    ),\n    children: ({ anchorRef, anchorProps }) => (\n      <Button\n        ref={anchorRef}\n        variant=\"secondaryBlack\"\n        size=\"small\"\n        {...anchorProps}\n      >\n        Hover to display dropdown\n      </Button>\n    ),\n  },\n  parameters: { chromatic: { disable: true } },\n}\n\nexport const ChangeDimensions = {\n  render: () => {\n    const [height, setHeight] = useState(10)\n\n    useEffect(() => {\n      setInterval(() => {\n        setHeight(Math.floor(Math.random() * 100))\n      }, 1000)\n    }, [])\n\n    return (\n      <Dropdown\n        placement=\"bottom\"\n        dropdown={<Box height={height} width={300} />}\n      >\n        {({ anchorRef, anchorProps }) => {\n          return (\n            <Button\n              ref={anchorRef}\n              variant=\"secondaryBlack\"\n              size=\"small\"\n              {...anchorProps}\n            >\n              Hover to display dropdown\n            </Button>\n          )\n        }}\n      </Dropdown>\n    )\n  },\n}\n\nexport const FocusOrder = {\n  render: () => {\n    const dropdown = (\n      <Text variant=\"sm-display\">\n        <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n          First\n        </Clickable>\n        <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n          Second\n        </Clickable>\n        <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n          Third\n        </Clickable>\n      </Text>\n    )\n\n    return (\n      <Flex>\n        <Dropdown dropdown={dropdown} placement=\"bottom\">\n          {({ anchorRef, anchorProps }) => {\n            return (\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                mr={1}\n                {...anchorProps}\n              >\n                First Parent\n              </Button>\n            )\n          }}\n        </Dropdown>\n\n        <Dropdown dropdown={dropdown} placement=\"bottom\">\n          {({ anchorRef, anchorProps }) => {\n            return (\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                {...anchorProps}\n              >\n                Second Parent\n              </Button>\n            )\n          }}\n        </Dropdown>\n      </Flex>\n    )\n  },\n}\n\nexport const OpenDropdownByClick = {\n  render: () => {\n    const dropdown = (\n      <Text variant=\"sm-display\">\n        <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n          First\n        </Clickable>\n        <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n          Second\n        </Clickable>\n        <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n          Third\n        </Clickable>\n      </Text>\n    )\n\n    return (\n      <Flex>\n        <Dropdown dropdown={dropdown} openDropdownByClick>\n          {({ anchorRef, anchorProps }) => {\n            return (\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                mr={1}\n                {...anchorProps}\n              >\n                Click to display dropdown\n              </Button>\n            )\n          }}\n        </Dropdown>\n      </Flex>\n    )\n  },\n}\n\nexport const FilterExample = {\n  render: () => {\n    return (\n      <Dropdown\n        dropdown={\n          <Box p={1}>\n            <Text variant=\"xs\">Example content</Text>\n          </Box>\n        }\n        placement=\"bottom-start\"\n        openDropdownByClick\n      >\n        {({ anchorRef, anchorProps }) => {\n          return (\n            <Pill\n              ref={anchorRef as any}\n              Icon={ChevronSmallDownIcon}\n              iconPosition=\"right\"\n              {...anchorProps}\n            >\n              Example\n            </Pill>\n          )\n        }}\n      </Dropdown>\n    )\n  },\n}\n\nexport const OverflowingContent = {\n  render: () => {\n    const dropdown = (\n      <Text variant=\"sm-display\">\n        {new Array(100).fill(null).map((_, i) => (\n          <Clickable key={i} display=\"block\" width=\"100%\" py={1} px={2}>\n            Item {i}\n          </Clickable>\n        ))}\n      </Text>\n    )\n\n    const [placement, setPlacement] = useState<Position>(\"bottom\")\n\n    return (\n      <>\n        <Box height={200} bg=\"mono10\" />\n\n        <Spacer y={2} />\n\n        {[\"bottom\", \"top\", \"left\", \"right\"].map((p) => {\n          return (\n            <Pill\n              key={p}\n              size=\"small\"\n              mr={1}\n              mb={1}\n              selected={placement === p}\n              onClick={() => setPlacement(p as Position)}\n            >\n              {p}\n            </Pill>\n          )\n        })}\n\n        <Spacer y={2} />\n\n        <Flex alignItems=\"center\" justifyContent=\"center\">\n          <Dropdown\n            dropdown={dropdown}\n            openDropdownByClick\n            placement={placement}\n          >\n            {({ anchorRef, anchorProps }) => {\n              return (\n                <Button\n                  ref={anchorRef}\n                  variant=\"secondaryBlack\"\n                  size=\"small\"\n                  {...anchorProps}\n                >\n                  Click to display dropdown\n                </Button>\n              )\n            }}\n          </Dropdown>\n        </Flex>\n\n        <Spacer y={2} />\n\n        <Box height={5000} bg=\"mono10\" />\n      </>\n    )\n  },\n}\n\nexport const DisabledTransition = {\n  render: () => {\n    return (\n      <Flex>\n        {[1, 2, 3].map((num) => {\n          const dropdown = (\n            <Text\n              variant=\"sm-display\"\n              width=\"100vw\"\n              bg={`color-b${num}00`}\n              p={2}\n            >\n              <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n                Panel {num}: First Item\n              </Clickable>\n              <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n                Panel {num}: Second Item\n              </Clickable>\n              <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n                Panel {num}: Third Item\n              </Clickable>\n            </Text>\n          )\n\n          return (\n            <Dropdown\n              key={num}\n              dropdown={dropdown}\n              transition={false}\n              placement=\"bottom\"\n            >\n              {({ anchorRef, anchorProps }) => {\n                return (\n                  <Button\n                    ref={anchorRef}\n                    variant=\"secondaryBlack\"\n                    size=\"small\"\n                    mr={1}\n                    {...anchorProps}\n                  >\n                    Hover for dropdown {num}\n                  </Button>\n                )\n              }}\n            </Dropdown>\n          )\n        })}\n      </Flex>\n    )\n  },\n}\n\nexport const ReturnFocusDefault = {\n  args: {\n    placement: \"bottom\",\n    openDropdownByClick: true,\n    dropdown: (\n      <Box width={200} p={2}>\n        <Text variant=\"sm\" mb={1}>\n          Try this:\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          1. Click button to open dropdown\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          2. Press Tab to focus on links\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          3. Press Escape to close\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          4. Notice focus returns to button\n        </Text>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\" tabIndex={0} mb={1}>\n          Focusable Link 1\n        </Text>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\" tabIndex={0}>\n          Focusable Link 2\n        </Text>\n      </Box>\n    ),\n    children: ({ anchorRef, anchorProps }) => (\n      <Button\n        ref={anchorRef}\n        variant=\"secondaryBlack\"\n        size=\"small\"\n        {...anchorProps}\n      >\n        Click me (returnFocus=true)\n      </Button>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story:\n          \"Default behavior with `returnFocus=true`. When you close the dropdown (Escape key or click outside), focus returns to the trigger button for better accessibility.\",\n      },\n    },\n    chromatic: { disable: true },\n  },\n}\n\nexport const ReturnFocusDisabled = {\n  args: {\n    placement: \"bottom\",\n    openDropdownByClick: true,\n    returnFocus: false,\n    dropdown: (\n      <Box width={200} p={2}>\n        <Text variant=\"sm\" mb={1}>\n          Try this:\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          1. Click button to open dropdown\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          2. Press Tab to focus on button\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          3. Press Escape to close\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          4. Focus stays where it was\n        </Text>\n        <Button\n          variant=\"primaryBlack\"\n          size=\"small\"\n          onClick={() => {\n            alert(\"Modal opened! Focus should not return to dropdown trigger.\")\n          }}\n        >\n          Open Modal\n        </Button>\n      </Box>\n    ),\n    children: ({ anchorRef, anchorProps }) => (\n      <Button\n        ref={anchorRef}\n        variant=\"secondaryBlack\"\n        size=\"small\"\n        {...anchorProps}\n      >\n        Click me (returnFocus=false)\n      </Button>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story:\n          \"With `returnFocus=false`, focus does not return to the trigger when the dropdown closes. This is useful when the dropdown opens a modal or navigates to another page, where returning focus would be disruptive.\",\n      },\n    },\n    chromatic: { disable: true },\n  },\n}\n\nexport const CustomDelay = {\n  render: () => {\n    const dropdown = (\n      <Box width={250} p={2}>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n          One\n        </Text>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n          Two\n        </Text>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n          Three\n        </Text>\n      </Box>\n    )\n\n    return (\n      <Flex gap={2}>\n        <Dropdown dropdown={dropdown} placement=\"bottom\" delay={0}>\n          {({ anchorRef, anchorProps }) => {\n            return (\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                {...anchorProps}\n              >\n                No delay (default)\n              </Button>\n            )\n          }}\n        </Dropdown>\n\n        <Dropdown dropdown={dropdown} placement=\"bottom\" delay={500}>\n          {({ anchorRef, anchorProps }) => {\n            return (\n              <Button\n                ref={anchorRef}\n                variant=\"primaryBlack\"\n                size=\"small\"\n                {...anchorProps}\n              >\n                500ms delay\n              </Button>\n            )\n          }}\n        </Dropdown>\n\n        <Dropdown dropdown={dropdown} placement=\"bottom\" delay={1000}>\n          {({ anchorRef, anchorProps }) => {\n            return (\n              <Button\n                ref={anchorRef}\n                variant=\"tertiary\"\n                size=\"small\"\n                {...anchorProps}\n              >\n                1000ms delay\n              </Button>\n            )\n          }}\n        </Dropdown>\n      </Flex>\n    )\n  },\n  parameters: {\n    docs: {\n      description: {\n        story:\n          \"The `delay` prop allows you to configure how long to wait before showing the dropdown on hover. This is useful for preventing accidental triggers. The delay is ignored when `openDropdownByClick` is true.\",\n      },\n    },\n    chromatic: { disable: true },\n  },\n}\n"],"mappings":"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"}
+{"version":3,"file":"Dropdown.story.js","names":["React","useEffect","useState","Box","Button","Text","Dropdown","Clickable","Flex","Pill","ChevronSmallDownIcon","Spacer","STORYBOOK_PROPS_BLOCKLIST","component","title","tags","parameters","docs","description","controls","exclude","Default","args","placement","dropdown","createElement","width","p","as","display","variant","href","children","_ref","anchorRef","anchorProps","textAlign","_extends","ref","size","chromatic","disable","KeepInDOM","keepInDOM","_ref2","ChangeDimensions","render","_useState","_useState2","_slicedToArray","height","setHeight","setInterval","Math","floor","random","_ref3","FocusOrder","py","px","_ref4","mr","_ref5","OpenDropdownByClick","openDropdownByClick","_ref6","FilterExample","_ref7","Icon","iconPosition","OverflowingContent","Array","fill","map","_","i","key","_useState3","_useState4","setPlacement","Fragment","bg","y","mb","selected","onClick","alignItems","justifyContent","_ref8","DisabledTransition","num","concat","transition","_ref9","ReturnFocusDefault","color","tabIndex","_ref10","story","ReturnFocusDisabled","returnFocus","alert","_ref11","CustomDelay","gap","delay","_ref12","_ref13","_ref14"],"sources":["../../../../src/elements/Dropdown/Dropdown.story.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\"\nimport { Position } from \"../../utils\"\nimport { Box } from \"../Box\"\nimport { Button } from \"../Button\"\nimport { Text } from \"../Text\"\nimport { Dropdown } from \"./Dropdown\"\nimport { Clickable } from \"../Clickable\"\nimport { Flex } from \"../Flex\"\nimport { Pill } from \"../Pill\"\nimport ChevronSmallDownIcon from \"@artsy/icons/ChevronSmallDownIcon\"\nimport { Spacer } from \"../Spacer\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\n\nexport default {\n  component: Dropdown,\n  title: \"Components/Dropdown\",\n  tags: [\"autodocs\"],\n  parameters: {\n    docs: {\n      description: {\n        component:\n          \"A dropdown component that renders content in a positioned overlay with various placement options and interaction modes.\",\n      },\n    },\n    controls: {\n      exclude: STORYBOOK_PROPS_BLOCKLIST,\n    },\n  },\n}\n\nexport const Default = {\n  args: {\n    placement: \"bottom\",\n    dropdown: (\n      <Box width={300} p={2}>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n          One\n        </Text>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n          Two\n        </Text>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n          Three\n        </Text>\n      </Box>\n    ),\n    children: ({ anchorRef, anchorProps }) => (\n      <Box textAlign=\"center\">\n        <Button\n          ref={anchorRef}\n          variant=\"secondaryBlack\"\n          size=\"small\"\n          {...anchorProps}\n        >\n          Hover to display dropdown\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: { chromatic: { disable: true } },\n}\n\nexport const KeepInDOM = {\n  args: {\n    placement: \"bottom\",\n    keepInDOM: true,\n    dropdown: (\n      <Text p={2} variant=\"xs\">\n        Content remains in DOM\n      </Text>\n    ),\n    children: ({ anchorRef, anchorProps }) => (\n      <Button\n        ref={anchorRef}\n        variant=\"secondaryBlack\"\n        size=\"small\"\n        {...anchorProps}\n      >\n        Hover to display dropdown\n      </Button>\n    ),\n  },\n  parameters: { chromatic: { disable: true } },\n}\n\nexport const ChangeDimensions = {\n  render: () => {\n    const [height, setHeight] = useState(10)\n\n    useEffect(() => {\n      setInterval(() => {\n        setHeight(Math.floor(Math.random() * 100))\n      }, 1000)\n    }, [])\n\n    return (\n      <Dropdown\n        placement=\"bottom\"\n        dropdown={<Box height={height} width={300} />}\n      >\n        {({ anchorRef, anchorProps }) => {\n          return (\n            <Button\n              ref={anchorRef}\n              variant=\"secondaryBlack\"\n              size=\"small\"\n              {...anchorProps}\n            >\n              Hover to display dropdown\n            </Button>\n          )\n        }}\n      </Dropdown>\n    )\n  },\n}\n\nexport const FocusOrder = {\n  render: () => {\n    const dropdown = (\n      <Text variant=\"sm-display\">\n        <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n          First\n        </Clickable>\n        <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n          Second\n        </Clickable>\n        <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n          Third\n        </Clickable>\n      </Text>\n    )\n\n    return (\n      <Flex>\n        <Dropdown dropdown={dropdown} placement=\"bottom\">\n          {({ anchorRef, anchorProps }) => {\n            return (\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                mr={1}\n                {...anchorProps}\n              >\n                First Parent\n              </Button>\n            )\n          }}\n        </Dropdown>\n\n        <Dropdown dropdown={dropdown} placement=\"bottom\">\n          {({ anchorRef, anchorProps }) => {\n            return (\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                {...anchorProps}\n              >\n                Second Parent\n              </Button>\n            )\n          }}\n        </Dropdown>\n      </Flex>\n    )\n  },\n}\n\nexport const OpenDropdownByClick = {\n  render: () => {\n    const dropdown = (\n      <Text variant=\"sm-display\">\n        <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n          First\n        </Clickable>\n        <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n          Second\n        </Clickable>\n        <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n          Third\n        </Clickable>\n      </Text>\n    )\n\n    return (\n      <Flex>\n        <Dropdown dropdown={dropdown} openDropdownByClick>\n          {({ anchorRef, anchorProps }) => {\n            return (\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                mr={1}\n                {...anchorProps}\n              >\n                Click to display dropdown\n              </Button>\n            )\n          }}\n        </Dropdown>\n      </Flex>\n    )\n  },\n}\n\nexport const FilterExample = {\n  render: () => {\n    return (\n      <Dropdown\n        dropdown={\n          <Box p={1}>\n            <Text variant=\"xs\">Example content</Text>\n          </Box>\n        }\n        placement=\"bottom-start\"\n        openDropdownByClick\n      >\n        {({ anchorRef, anchorProps }) => {\n          return (\n            <Pill\n              ref={anchorRef as any}\n              Icon={ChevronSmallDownIcon}\n              iconPosition=\"right\"\n              {...anchorProps}\n            >\n              Example\n            </Pill>\n          )\n        }}\n      </Dropdown>\n    )\n  },\n}\n\nexport const OverflowingContent = {\n  render: () => {\n    const dropdown = (\n      <Text variant=\"sm-display\">\n        {new Array(100).fill(null).map((_, i) => (\n          <Clickable key={i} display=\"block\" width=\"100%\" py={1} px={2}>\n            Item {i}\n          </Clickable>\n        ))}\n      </Text>\n    )\n\n    const [placement, setPlacement] = useState<Position>(\"bottom\")\n\n    return (\n      <>\n        <Box height={200} bg=\"mono10\" />\n\n        <Spacer y={2} />\n\n        {[\"bottom\", \"top\", \"left\", \"right\"].map((p) => {\n          return (\n            <Pill\n              key={p}\n              size=\"small\"\n              mr={1}\n              mb={1}\n              selected={placement === p}\n              onClick={() => setPlacement(p as Position)}\n            >\n              {p}\n            </Pill>\n          )\n        })}\n\n        <Spacer y={2} />\n\n        <Flex alignItems=\"center\" justifyContent=\"center\">\n          <Dropdown\n            dropdown={dropdown}\n            openDropdownByClick\n            placement={placement}\n          >\n            {({ anchorRef, anchorProps }) => {\n              return (\n                <Button\n                  ref={anchorRef}\n                  variant=\"secondaryBlack\"\n                  size=\"small\"\n                  {...anchorProps}\n                >\n                  Click to display dropdown\n                </Button>\n              )\n            }}\n          </Dropdown>\n        </Flex>\n\n        <Spacer y={2} />\n\n        <Box height={5000} bg=\"mono10\" />\n      </>\n    )\n  },\n}\n\nexport const DisabledTransition = {\n  render: () => {\n    return (\n      <Flex>\n        {[1, 2, 3].map((num) => {\n          const dropdown = (\n            <Text\n              variant=\"sm-display\"\n              width=\"100vw\"\n              bg={`color-b${num}00`}\n              p={2}\n            >\n              <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n                Panel {num}: First Item\n              </Clickable>\n              <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n                Panel {num}: Second Item\n              </Clickable>\n              <Clickable display=\"block\" width=\"100%\" py={1} px={2}>\n                Panel {num}: Third Item\n              </Clickable>\n            </Text>\n          )\n\n          return (\n            <Dropdown\n              key={num}\n              dropdown={dropdown}\n              transition={false}\n              placement=\"bottom\"\n            >\n              {({ anchorRef, anchorProps }) => {\n                return (\n                  <Button\n                    ref={anchorRef}\n                    variant=\"secondaryBlack\"\n                    size=\"small\"\n                    mr={1}\n                    {...anchorProps}\n                  >\n                    Hover for dropdown {num}\n                  </Button>\n                )\n              }}\n            </Dropdown>\n          )\n        })}\n      </Flex>\n    )\n  },\n}\n\nexport const ReturnFocusDefault = {\n  args: {\n    placement: \"bottom\",\n    openDropdownByClick: true,\n    dropdown: (\n      <Box width={200} p={2}>\n        <Text variant=\"sm\" mb={1}>\n          Try this:\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          1. Click button to open dropdown\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          2. Press Tab to focus on links\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          3. Press Escape to close\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          4. Notice focus returns to button\n        </Text>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\" tabIndex={0} mb={1}>\n          Focusable Link 1\n        </Text>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\" tabIndex={0}>\n          Focusable Link 2\n        </Text>\n      </Box>\n    ),\n    children: ({ anchorRef, anchorProps }) => (\n      <Button\n        ref={anchorRef}\n        variant=\"secondaryBlack\"\n        size=\"small\"\n        {...anchorProps}\n      >\n        Click me (returnFocus=true)\n      </Button>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story:\n          \"Default behavior with `returnFocus=true`. When you close the dropdown (Escape key or click outside), focus returns to the trigger button for better accessibility.\",\n      },\n    },\n    chromatic: { disable: true },\n  },\n}\n\nexport const ReturnFocusDisabled = {\n  args: {\n    placement: \"bottom\",\n    openDropdownByClick: true,\n    returnFocus: false,\n    dropdown: (\n      <Box width={200} p={2}>\n        <Text variant=\"sm\" mb={1}>\n          Try this:\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          1. Click button to open dropdown\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          2. Press Tab to focus on button\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          3. Press Escape to close\n        </Text>\n        <Text variant=\"xs\" color=\"mono60\" mb={2}>\n          4. Focus stays where it was\n        </Text>\n        <Button\n          variant=\"primaryBlack\"\n          size=\"small\"\n          onClick={() => {\n            alert(\"Modal opened! Focus should not return to dropdown trigger.\")\n          }}\n        >\n          Open Modal\n        </Button>\n      </Box>\n    ),\n    children: ({ anchorRef, anchorProps }) => (\n      <Button\n        ref={anchorRef}\n        variant=\"secondaryBlack\"\n        size=\"small\"\n        {...anchorProps}\n      >\n        Click me (returnFocus=false)\n      </Button>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story:\n          \"With `returnFocus=false`, focus does not return to the trigger when the dropdown closes. This is useful when the dropdown opens a modal or navigates to another page, where returning focus would be disruptive.\",\n      },\n    },\n    chromatic: { disable: true },\n  },\n}\n\nexport const CustomDelay = {\n  render: () => {\n    const dropdown = (\n      <Box width={250} p={2}>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n          One\n        </Text>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n          Two\n        </Text>\n        <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n          Three\n        </Text>\n      </Box>\n    )\n\n    return (\n      <Flex gap={2}>\n        <Dropdown dropdown={dropdown} placement=\"bottom\" delay={0}>\n          {({ anchorRef, anchorProps }) => {\n            return (\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                {...anchorProps}\n              >\n                No delay (default)\n              </Button>\n            )\n          }}\n        </Dropdown>\n\n        <Dropdown dropdown={dropdown} placement=\"bottom\" delay={500}>\n          {({ anchorRef, anchorProps }) => {\n            return (\n              <Button\n                ref={anchorRef}\n                variant=\"primaryBlack\"\n                size=\"small\"\n                {...anchorProps}\n              >\n                500ms delay\n              </Button>\n            )\n          }}\n        </Dropdown>\n\n        <Dropdown dropdown={dropdown} placement=\"bottom\" delay={1000}>\n          {({ anchorRef, anchorProps }) => {\n            return (\n              <Button\n                ref={anchorRef}\n                variant=\"tertiary\"\n                size=\"small\"\n                {...anchorProps}\n              >\n                1000ms delay\n              </Button>\n            )\n          }}\n        </Dropdown>\n      </Flex>\n    )\n  },\n  parameters: {\n    docs: {\n      description: {\n        story:\n          \"The `delay` prop allows you to configure how long to wait before showing the dropdown on hover. This is useful for preventing accidental triggers. The delay is ignored when `openDropdownByClick` is true.\",\n      },\n    },\n    chromatic: { disable: true },\n  },\n}\n"],"mappings":"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"}

package/dist/esm/elements/EntityHeader/EntityHeader.js

@@ -3,9 +3,8 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import React from "react";
-import { Label, LabelProps } from "../Label";
-import { Flex, FlexProps } from "../Flex";
-import { ImageProps } from "../Image";
+import { Label } from "../Label";
+import { Flex } from "../Flex";
 import { Avatar } from "../Avatar";
 import { Text } from "../Text";
 /**

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

@@ -1 +1 @@
-{"version":3,"file":"EntityHeader.js","names":["React","Label","LabelProps","Flex","FlexProps","ImageProps","Avatar","Text","EntityHeader","_ref","name","href","meta","initials","imageUrl","image","smallVariant","FollowButton","labels","rest","_objectWithoutProperties","_excluded","createElement","_extends","alignItems","justifyContent","as","style","textDecoration","mr","size","src","flexDirection","variant","map","label","i","Fragment","key","color","displayName"],"sources":["../../../../src/elements/EntityHeader/EntityHeader.tsx"],"sourcesContent":["import React from \"react\"\nimport { Label, LabelProps } from \"../Label\"\nimport { Flex, FlexProps } from \"../Flex\"\nimport { ImageProps } from \"../Image\"\nimport { Avatar } from \"../Avatar\"\nimport { Text } from \"../Text\"\n\nexport interface EntityHeaderProps extends FlexProps {\n  href?: string\n  /** @deprecated: use `image` instead */\n  imageUrl?: string\n  /** Pass props to the underlying `Image` in `Avatar` */\n  image?: Omit<Partial<ImageProps>, \"size\">\n  initials?: string\n  meta?: string\n  name: string\n  labels?: LabelProps[]\n  smallVariant?: boolean\n  FollowButton?: JSX.Element\n  onClick?: (event: React.MouseEvent<HTMLElement>) => void\n}\n/**\n * Component that is used as entity header that is paired with rich information about the entity.\n * @deprecated: Use EntityHeader fragment container patterns within Force instead\n */\n\nexport const EntityHeader: React.FC<\n  React.PropsWithChildren<EntityHeaderProps>\n> = ({\n  name,\n  href,\n  meta,\n  initials,\n  imageUrl,\n  image,\n  smallVariant,\n  FollowButton,\n  labels,\n  ...rest\n}) => {\n  return (\n    <Flex alignItems=\"center\" justifyContent=\"space-between\" {...rest}>\n      <Flex\n        alignItems=\"center\"\n        {...(href ? { as: \"a\", href, style: { textDecoration: \"none\" } } : {})}\n      >\n        {(imageUrl || image || initials) && (\n          <Flex mr={1}>\n            <Avatar\n              size={smallVariant ? \"xxs\" : \"xs\"}\n              src={imageUrl}\n              initials={initials}\n              {...(image ?? {})}\n            />\n          </Flex>\n        )}\n\n        <Flex flexDirection=\"column\" mr={1}>\n          <Text variant=\"sm-display\">{name}</Text>\n\n          <Text variant=\"sm-display\">\n            {labels?.map((label, i) => (\n              <React.Fragment key={i}>\n                <Label {...label} />{\" \"}\n              </React.Fragment>\n            ))}\n          </Text>\n\n          {meta && (\n            <Text variant=\"xs\" color=\"mono60\">\n              {meta}\n            </Text>\n          )}\n        </Flex>\n      </Flex>\n\n      {FollowButton}\n    </Flex>\n  )\n}\n\nEntityHeader.displayName = \"EntityHeader\"\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,KAAK,EAAEC,UAAU;AAC1B,SAASC,IAAI,EAAEC,SAAS;AACxB,SAASC,UAAU;AACnB,SAASC,MAAM;AACf,SAASC,IAAI;AAgBb;AACA;AACA;AACA;;AAEA,OAAO,IAAMC,YAEZ,GAAG,SAFSA,YAEZA,CAAAC,IAAA,EAWK;EAAA,IAVJC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IACJC,IAAI,GAAAF,IAAA,CAAJE,IAAI;IACJC,IAAI,GAAAH,IAAA,CAAJG,IAAI;IACJC,QAAQ,GAAAJ,IAAA,CAARI,QAAQ;IACRC,QAAQ,GAAAL,IAAA,CAARK,QAAQ;IACRC,KAAK,GAAAN,IAAA,CAALM,KAAK;IACLC,YAAY,GAAAP,IAAA,CAAZO,YAAY;IACZC,YAAY,GAAAR,IAAA,CAAZQ,YAAY;IACZC,MAAM,GAAAT,IAAA,CAANS,MAAM;IACHC,IAAI,GAAAC,wBAAA,CAAAX,IAAA,EAAAY,SAAA;EAEP,oBACErB,KAAA,CAAAsB,aAAA,CAACnB,IAAI,EAAAoB,QAAA;IAACC,UAAU,EAAC,QAAQ;IAACC,cAAc,EAAC;EAAe,GAAKN,IAAI,gBAC/DnB,KAAA,CAAAsB,aAAA,CAACnB,IAAI,EAAAoB,QAAA;IACHC,UAAU,EAAC;EAAQ,GACdb,IAAI,GAAG;IAAEe,EAAE,EAAE,GAAG;IAAEf,IAAI,EAAJA,IAAI;IAAEgB,KAAK,EAAE;MAAEC,cAAc,EAAE;IAAO;EAAE,CAAC,GAAG,CAAC,CAAC,GAEpE,CAACd,QAAQ,IAAIC,KAAK,IAAIF,QAAQ,kBAC7Bb,KAAA,CAAAsB,aAAA,CAACnB,IAAI;IAAC0B,EAAE,EAAE;EAAE,gBACV7B,KAAA,CAAAsB,aAAA,CAAChB,MAAM,EAAAiB,QAAA;IACLO,IAAI,EAAEd,YAAY,GAAG,KAAK,GAAG,IAAK;IAClCe,GAAG,EAAEjB,QAAS;IACdD,QAAQ,EAAEA;EAAS,GACdE,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,CAAC,CAAC,EAChB,CAEL,eAEDf,KAAA,CAAAsB,aAAA,CAACnB,IAAI;IAAC6B,aAAa,EAAC,QAAQ;IAACH,EAAE,EAAE;EAAE,gBACjC7B,KAAA,CAAAsB,aAAA,CAACf,IAAI;IAAC0B,OAAO,EAAC;EAAY,GAAEvB,IAAI,CAAQ,eAExCV,KAAA,CAAAsB,aAAA,CAACf,IAAI;IAAC0B,OAAO,EAAC;EAAY,GACvBf,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEgB,GAAG,CAAC,UAACC,KAAK,EAAEC,CAAC;IAAA,oBACpBpC,KAAA,CAAAsB,aAAA,CAACtB,KAAK,CAACqC,QAAQ;MAACC,GAAG,EAAEF;IAAE,gBACrBpC,KAAA,CAAAsB,aAAA,CAACrB,KAAK,EAAKkC,KAAK,CAAI,EAAC,GAAG,CACT;EAAA,CAClB,CAAC,CACG,EAENvB,IAAI,iBACHZ,KAAA,CAAAsB,aAAA,CAACf,IAAI;IAAC0B,OAAO,EAAC,IAAI;IAACM,KAAK,EAAC;EAAQ,GAC9B3B,IAAI,CAER,CACI,CACF,EAENK,YAAY,CACR;AAEX,CAAC;AArDYT,YAEZ,CAAAgC,WAAA;AAqDDhC,YAAY,CAACgC,WAAW,GAAG,cAAc"}
+{"version":3,"file":"EntityHeader.js","names":["React","Label","Flex","Avatar","Text","EntityHeader","_ref","name","href","meta","initials","imageUrl","image","smallVariant","FollowButton","labels","rest","_objectWithoutProperties","_excluded","createElement","_extends","alignItems","justifyContent","as","style","textDecoration","mr","size","src","flexDirection","variant","map","label","i","Fragment","key","color","displayName"],"sources":["../../../../src/elements/EntityHeader/EntityHeader.tsx"],"sourcesContent":["import React from \"react\"\nimport { Label, LabelProps } from \"../Label\"\nimport { Flex, FlexProps } from \"../Flex\"\nimport { ImageProps } from \"../Image\"\nimport { Avatar } from \"../Avatar\"\nimport { Text } from \"../Text\"\n\nexport interface EntityHeaderProps extends FlexProps {\n  href?: string\n  /** @deprecated: use `image` instead */\n  imageUrl?: string\n  /** Pass props to the underlying `Image` in `Avatar` */\n  image?: Omit<Partial<ImageProps>, \"size\">\n  initials?: string\n  meta?: string\n  name: string\n  labels?: LabelProps[]\n  smallVariant?: boolean\n  FollowButton?: JSX.Element\n  onClick?: (event: React.MouseEvent<HTMLElement>) => void\n}\n/**\n * Component that is used as entity header that is paired with rich information about the entity.\n * @deprecated: Use EntityHeader fragment container patterns within Force instead\n */\n\nexport const EntityHeader: React.FC<\n  React.PropsWithChildren<EntityHeaderProps>\n> = ({\n  name,\n  href,\n  meta,\n  initials,\n  imageUrl,\n  image,\n  smallVariant,\n  FollowButton,\n  labels,\n  ...rest\n}) => {\n  return (\n    <Flex alignItems=\"center\" justifyContent=\"space-between\" {...rest}>\n      <Flex\n        alignItems=\"center\"\n        {...(href ? { as: \"a\", href, style: { textDecoration: \"none\" } } : {})}\n      >\n        {(imageUrl || image || initials) && (\n          <Flex mr={1}>\n            <Avatar\n              size={smallVariant ? \"xxs\" : \"xs\"}\n              src={imageUrl}\n              initials={initials}\n              {...(image ?? {})}\n            />\n          </Flex>\n        )}\n\n        <Flex flexDirection=\"column\" mr={1}>\n          <Text variant=\"sm-display\">{name}</Text>\n\n          <Text variant=\"sm-display\">\n            {labels?.map((label, i) => (\n              <React.Fragment key={i}>\n                <Label {...label} />{\" \"}\n              </React.Fragment>\n            ))}\n          </Text>\n\n          {meta && (\n            <Text variant=\"xs\" color=\"mono60\">\n              {meta}\n            </Text>\n          )}\n        </Flex>\n      </Flex>\n\n      {FollowButton}\n    </Flex>\n  )\n}\n\nEntityHeader.displayName = \"EntityHeader\"\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,KAAK;AACd,SAASC,IAAI;AAEb,SAASC,MAAM;AACf,SAASC,IAAI;AAgBb;AACA;AACA;AACA;;AAEA,OAAO,IAAMC,YAEZ,GAAG,SAFSA,YAEZA,CAAAC,IAAA,EAWK;EAAA,IAVJC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IACJC,IAAI,GAAAF,IAAA,CAAJE,IAAI;IACJC,IAAI,GAAAH,IAAA,CAAJG,IAAI;IACJC,QAAQ,GAAAJ,IAAA,CAARI,QAAQ;IACRC,QAAQ,GAAAL,IAAA,CAARK,QAAQ;IACRC,KAAK,GAAAN,IAAA,CAALM,KAAK;IACLC,YAAY,GAAAP,IAAA,CAAZO,YAAY;IACZC,YAAY,GAAAR,IAAA,CAAZQ,YAAY;IACZC,MAAM,GAAAT,IAAA,CAANS,MAAM;IACHC,IAAI,GAAAC,wBAAA,CAAAX,IAAA,EAAAY,SAAA;EAEP,oBACElB,KAAA,CAAAmB,aAAA,CAACjB,IAAI,EAAAkB,QAAA;IAACC,UAAU,EAAC,QAAQ;IAACC,cAAc,EAAC;EAAe,GAAKN,IAAI,gBAC/DhB,KAAA,CAAAmB,aAAA,CAACjB,IAAI,EAAAkB,QAAA;IACHC,UAAU,EAAC;EAAQ,GACdb,IAAI,GAAG;IAAEe,EAAE,EAAE,GAAG;IAAEf,IAAI,EAAJA,IAAI;IAAEgB,KAAK,EAAE;MAAEC,cAAc,EAAE;IAAO;EAAE,CAAC,GAAG,CAAC,CAAC,GAEpE,CAACd,QAAQ,IAAIC,KAAK,IAAIF,QAAQ,kBAC7BV,KAAA,CAAAmB,aAAA,CAACjB,IAAI;IAACwB,EAAE,EAAE;EAAE,gBACV1B,KAAA,CAAAmB,aAAA,CAAChB,MAAM,EAAAiB,QAAA;IACLO,IAAI,EAAEd,YAAY,GAAG,KAAK,GAAG,IAAK;IAClCe,GAAG,EAAEjB,QAAS;IACdD,QAAQ,EAAEA;EAAS,GACdE,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,CAAC,CAAC,EAChB,CAEL,eAEDZ,KAAA,CAAAmB,aAAA,CAACjB,IAAI;IAAC2B,aAAa,EAAC,QAAQ;IAACH,EAAE,EAAE;EAAE,gBACjC1B,KAAA,CAAAmB,aAAA,CAACf,IAAI;IAAC0B,OAAO,EAAC;EAAY,GAAEvB,IAAI,CAAQ,eAExCP,KAAA,CAAAmB,aAAA,CAACf,IAAI;IAAC0B,OAAO,EAAC;EAAY,GACvBf,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEgB,GAAG,CAAC,UAACC,KAAK,EAAEC,CAAC;IAAA,oBACpBjC,KAAA,CAAAmB,aAAA,CAACnB,KAAK,CAACkC,QAAQ;MAACC,GAAG,EAAEF;IAAE,gBACrBjC,KAAA,CAAAmB,aAAA,CAAClB,KAAK,EAAK+B,KAAK,CAAI,EAAC,GAAG,CACT;EAAA,CAClB,CAAC,CACG,EAENvB,IAAI,iBACHT,KAAA,CAAAmB,aAAA,CAACf,IAAI;IAAC0B,OAAO,EAAC,IAAI;IAACM,KAAK,EAAC;EAAQ,GAC9B3B,IAAI,CAER,CACI,CACF,EAENK,YAAY,CACR;AAEX,CAAC;AArDYT,YAEZ,CAAAgC,WAAA;AAqDDhC,YAAY,CAACgC,WAAW,GAAG,cAAc"}

package/dist/esm/elements/Expandable/Expandable.js

@@ -13,7 +13,7 @@ import { isText } from "../../helpers/isText";
 import ChevronUpIcon from "@artsy/icons/ChevronUpIcon";
 import ChevronDownIcon from "@artsy/icons/ChevronDownIcon";
 import { Box, splitBoxProps } from "../Box";
-import { Clickable, ClickableProps } from "../Clickable";
+import { Clickable } from "../Clickable";
 import { Flex } from "../Flex";
 import { Text } from "../Text";
 /**

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

@@ -1 +1 @@
-{"version":3,"file":"Expandable.js","names":["React","useEffect","useState","isText","ChevronUpIcon","ChevronDownIcon","Box","splitBoxProps","Clickable","ClickableProps","Flex","Text","Expandable","_ref","label","expandedProp","expanded","children","disabled","onClick","onToggle","_ref$borderColor","borderColor","rest","_objectWithoutProperties","_excluded","_useState","_useState2","_slicedToArray","setExpanded","undefined","_splitBoxProps","_splitBoxProps2","boxProps","clickableProps","handleClick","event","prevExpanded","isExpanded","createElement","_extends","width","display","alignItems","justifyContent","borderTop","pt","pb","flex","variant","Fragment","height","ml","mr","overflow","style","visibility","displayName"],"sources":["../../../../src/elements/Expandable/Expandable.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\"\nimport { isText } from \"../../helpers/isText\"\nimport ChevronUpIcon from \"@artsy/icons/ChevronUpIcon\"\nimport ChevronDownIcon from \"@artsy/icons/ChevronDownIcon\"\nimport { Box, splitBoxProps } from \"../Box\"\nimport { Clickable, ClickableProps } from \"../Clickable\"\nimport { Flex } from \"../Flex\"\nimport { Text } from \"../Text\"\n\ntype ChildrenFunction = (props: {\n  setExpanded: React.Dispatch<React.SetStateAction<boolean | undefined>>\n  expanded: boolean\n}) => React.ReactNode\n\nexport interface ExpandableProps extends Omit<ClickableProps, \"children\"> {\n  label?: string | JSX.Element\n  expanded?: boolean\n  children: React.ReactNode | ChildrenFunction\n  onToggle?: (isExpanded: boolean) => void\n}\n\n/**\n * A toggleable component used to show / hide content\n */\nexport const Expandable = ({\n  label,\n  expanded: expandedProp,\n  children,\n  disabled,\n  onClick,\n  onToggle,\n  borderColor = \"mono60\",\n  ...rest\n}: ExpandableProps) => {\n  const [expanded, setExpanded] = useState(expandedProp)\n\n  useEffect(() => {\n    if (expandedProp !== undefined) {\n      setExpanded(expandedProp)\n    }\n  }, [expandedProp])\n\n  const [boxProps, clickableProps] = splitBoxProps(rest)\n\n  const handleClick = (\n    event: React.MouseEvent<HTMLButtonElement, MouseEvent>\n  ) => {\n    setExpanded((prevExpanded) => {\n      const isExpanded = !prevExpanded\n      onToggle && onToggle(isExpanded)\n      return isExpanded\n    })\n\n    onClick && onClick(event)\n  }\n\n  return (\n    <Box {...boxProps}>\n      <Clickable\n        width=\"100%\"\n        display=\"flex\"\n        alignItems=\"center\"\n        justifyContent=\"space-between\"\n        borderTop=\"1px solid\"\n        borderColor={borderColor}\n        pt={2}\n        pb={1}\n        disabled={disabled}\n        aria-expanded={expanded}\n        onClick={handleClick}\n        {...clickableProps}\n      >\n        <Flex flex={1} display=\"flex\" alignItems=\"center\">\n          {isText(label) ? <Text variant=\"sm-display\">{label}</Text> : label}\n        </Flex>\n\n        {!disabled && (\n          <>\n            {expanded ? (\n              <ChevronUpIcon\n                width={14}\n                height={14}\n                ml={1}\n                mr={1}\n                aria-hidden=\"true\"\n              />\n            ) : (\n              <ChevronDownIcon\n                width={14}\n                height={14}\n                ml={1}\n                mr={1}\n                aria-hidden=\"true\"\n              />\n            )}\n          </>\n        )}\n      </Clickable>\n\n      <Box\n        overflow=\"hidden\"\n        height={expanded ? \"auto\" : \"0px\"}\n        style={{ visibility: expanded ? \"visible\" : \"hidden\" }}\n      >\n        {typeof children === \"function\"\n          ? (children as ChildrenFunction)({ setExpanded, expanded: !!expanded })\n          : children}\n      </Box>\n    </Box>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"Expandable.js","names":["React","useEffect","useState","isText","ChevronUpIcon","ChevronDownIcon","Box","splitBoxProps","Clickable","Flex","Text","Expandable","_ref","label","expandedProp","expanded","children","disabled","onClick","onToggle","_ref$borderColor","borderColor","rest","_objectWithoutProperties","_excluded","_useState","_useState2","_slicedToArray","setExpanded","undefined","_splitBoxProps","_splitBoxProps2","boxProps","clickableProps","handleClick","event","prevExpanded","isExpanded","createElement","_extends","width","display","alignItems","justifyContent","borderTop","pt","pb","flex","variant","Fragment","height","ml","mr","overflow","style","visibility","displayName"],"sources":["../../../../src/elements/Expandable/Expandable.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\"\nimport { isText } from \"../../helpers/isText\"\nimport ChevronUpIcon from \"@artsy/icons/ChevronUpIcon\"\nimport ChevronDownIcon from \"@artsy/icons/ChevronDownIcon\"\nimport { Box, splitBoxProps } from \"../Box\"\nimport { Clickable, ClickableProps } from \"../Clickable\"\nimport { Flex } from \"../Flex\"\nimport { Text } from \"../Text\"\n\ntype ChildrenFunction = (props: {\n  setExpanded: React.Dispatch<React.SetStateAction<boolean | undefined>>\n  expanded: boolean\n}) => React.ReactNode\n\nexport interface ExpandableProps extends Omit<ClickableProps, \"children\"> {\n  label?: string | JSX.Element\n  expanded?: boolean\n  children: React.ReactNode | ChildrenFunction\n  onToggle?: (isExpanded: boolean) => void\n}\n\n/**\n * A toggleable component used to show / hide content\n */\nexport const Expandable = ({\n  label,\n  expanded: expandedProp,\n  children,\n  disabled,\n  onClick,\n  onToggle,\n  borderColor = \"mono60\",\n  ...rest\n}: ExpandableProps) => {\n  const [expanded, setExpanded] = useState(expandedProp)\n\n  useEffect(() => {\n    if (expandedProp !== undefined) {\n      setExpanded(expandedProp)\n    }\n  }, [expandedProp])\n\n  const [boxProps, clickableProps] = splitBoxProps(rest)\n\n  const handleClick = (\n    event: React.MouseEvent<HTMLButtonElement, MouseEvent>\n  ) => {\n    setExpanded((prevExpanded) => {\n      const isExpanded = !prevExpanded\n      onToggle && onToggle(isExpanded)\n      return isExpanded\n    })\n\n    onClick && onClick(event)\n  }\n\n  return (\n    <Box {...boxProps}>\n      <Clickable\n        width=\"100%\"\n        display=\"flex\"\n        alignItems=\"center\"\n        justifyContent=\"space-between\"\n        borderTop=\"1px solid\"\n        borderColor={borderColor}\n        pt={2}\n        pb={1}\n        disabled={disabled}\n        aria-expanded={expanded}\n        onClick={handleClick}\n        {...clickableProps}\n      >\n        <Flex flex={1} display=\"flex\" alignItems=\"center\">\n          {isText(label) ? <Text variant=\"sm-display\">{label}</Text> : label}\n        </Flex>\n\n        {!disabled && (\n          <>\n            {expanded ? (\n              <ChevronUpIcon\n                width={14}\n                height={14}\n                ml={1}\n                mr={1}\n                aria-hidden=\"true\"\n              />\n            ) : (\n              <ChevronDownIcon\n                width={14}\n                height={14}\n                ml={1}\n                mr={1}\n                aria-hidden=\"true\"\n              />\n            )}\n          </>\n        )}\n      </Clickable>\n\n      <Box\n        overflow=\"hidden\"\n        height={expanded ? \"auto\" : \"0px\"}\n        style={{ visibility: expanded ? \"visible\" : \"hidden\" }}\n      >\n        {typeof children === \"function\"\n          ? (children as ChildrenFunction)({ setExpanded, expanded: !!expanded })\n          : children}\n      </Box>\n    </Box>\n  )\n}\n"],"mappings":"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"}

package/dist/esm/elements/FilterSelect/Components/FilterInput.js

@@ -2,7 +2,6 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 import * as React from "react";
 import CloseStrokeIcon from "@artsy/icons/CloseStrokeIcon";
 import SearchIcon from "@artsy/icons/SearchIcon";
-import { InputProps } from "../../Input";
 import { LabeledInput } from "../../LabeledInput";
 import { Clickable } from "../../Clickable";
 import { useRef } from "react";

package/dist/esm/elements/FilterSelect/Components/FilterInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterInput.js","names":["React","CloseStrokeIcon","SearchIcon","InputProps","LabeledInput","Clickable","useRef","useFilterSelectContext","FilterInput","props","_useFilterSelectConte","query","setQuery","placeholder","ref","handleChange","event","target","value","handleClick","_ref$current","current","focus","createElement","_extends","role","label","display","onClick","style","pointerEvents","onChange","displayName"],"sources":["../../../../../src/elements/FilterSelect/Components/FilterInput.tsx"],"sourcesContent":["import * as React from \"react\"\nimport CloseStrokeIcon from \"@artsy/icons/CloseStrokeIcon\"\nimport SearchIcon from \"@artsy/icons/SearchIcon\"\nimport { InputProps } from \"../../Input\"\nimport { LabeledInput } from \"../../LabeledInput\"\nimport { Clickable } from \"../../Clickable\"\nimport { useRef } from \"react\"\nimport { useFilterSelectContext } from \"./FilterSelectContext\"\n\nexport type FilterInputProps = InputProps\n\nexport const FilterInput: React.FC<React.PropsWithChildren<InputProps>> = (\n  props\n) => {\n  const { query, setQuery, placeholder } = useFilterSelectContext()\n  const ref = useRef<HTMLInputElement | null>(null)\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    setQuery(event.target.value)\n  }\n\n  const handleClick = () => {\n    setQuery(\"\")\n    ref.current?.focus()\n  }\n\n  return (\n    <LabeledInput\n      ref={ref}\n      role=\"search\"\n      label={\n        query !== \"\" ? (\n          // Active state\n          <Clickable\n            display=\"flex\"\n            onClick={handleClick}\n            aria-label=\"Clear search input\"\n          >\n            <CloseStrokeIcon />\n          </Clickable>\n        ) : (\n          // Resting state\n          <SearchIcon style={{ pointerEvents: \"none\" }} />\n        )\n      }\n      onChange={handleChange}\n      value={query}\n      placeholder={placeholder}\n      {...props}\n    />\n  )\n}\n"],"mappings":";AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,eAAe,MAAM,8BAA8B;AAC1D,OAAOC,UAAU,MAAM,yBAAyB;AAChD,SAASC,UAAU;AACnB,SAASC,YAAY;AACrB,SAASC,SAAS;AAClB,SAASC,MAAM,QAAQ,OAAO;AAC9B,SAASC,sBAAsB;AAI/B,OAAO,IAAMC,WAA0D,GAAG,SAA7DA,WAA0DA,CACrEC,KAAK,EACF;EACH,IAAAC,qBAAA,GAAyCH,sBAAsB,EAAE;IAAzDI,KAAK,GAAAD,qBAAA,CAALC,KAAK;IAAEC,QAAQ,GAAAF,qBAAA,CAARE,QAAQ;IAAEC,WAAW,GAAAH,qBAAA,CAAXG,WAAW;EACpC,IAAMC,GAAG,GAAGR,MAAM,CAA0B,IAAI,CAAC;EAEjD,IAAMS,YAAY,GAAG,SAAfA,YAAYA,CAAIC,KAA0C,EAAK;IACnEJ,QAAQ,CAACI,KAAK,CAACC,MAAM,CAACC,KAAK,CAAC;EAC9B,CAAC;EAED,IAAMC,WAAW,GAAG,SAAdA,WAAWA,CAAA,EAAS;IAAA,IAAAC,YAAA;IACxBR,QAAQ,CAAC,EAAE,CAAC;IACZ,CAAAQ,YAAA,GAAAN,GAAG,CAACO,OAAO,cAAAD,YAAA,uBAAXA,YAAA,CAAaE,KAAK,EAAE;EACtB,CAAC;EAED,oBACEtB,KAAA,CAAAuB,aAAA,CAACnB,YAAY,EAAAoB,QAAA;IACXV,GAAG,EAAEA,GAAI;IACTW,IAAI,EAAC,QAAQ;IACbC,KAAK,EACHf,KAAK,KAAK,EAAE;IAAA;IACV;IACAX,KAAA,CAAAuB,aAAA,CAAClB,SAAS;MACRsB,OAAO,EAAC,MAAM;MACdC,OAAO,EAAET,WAAY;MACrB,cAAW;IAAoB,gBAE/BnB,KAAA,CAAAuB,aAAA,CAACtB,eAAe,OAAG,CACT;IAAA;IAEZ;IACAD,KAAA,CAAAuB,aAAA,CAACrB,UAAU;MAAC2B,KAAK,EAAE;QAAEC,aAAa,EAAE;MAAO;IAAE,EAEhD;IACDC,QAAQ,EAAEhB,YAAa;IACvBG,KAAK,EAAEP,KAAM;IACbE,WAAW,EAAEA;EAAY,GACrBJ,KAAK,EACT;AAEN,CAAC;AAxCYD,WAA0D,CAAAwB,WAAA"}
+{"version":3,"file":"FilterInput.js","names":["React","CloseStrokeIcon","SearchIcon","LabeledInput","Clickable","useRef","useFilterSelectContext","FilterInput","props","_useFilterSelectConte","query","setQuery","placeholder","ref","handleChange","event","target","value","handleClick","_ref$current","current","focus","createElement","_extends","role","label","display","onClick","style","pointerEvents","onChange","displayName"],"sources":["../../../../../src/elements/FilterSelect/Components/FilterInput.tsx"],"sourcesContent":["import * as React from \"react\"\nimport CloseStrokeIcon from \"@artsy/icons/CloseStrokeIcon\"\nimport SearchIcon from \"@artsy/icons/SearchIcon\"\nimport { InputProps } from \"../../Input\"\nimport { LabeledInput } from \"../../LabeledInput\"\nimport { Clickable } from \"../../Clickable\"\nimport { useRef } from \"react\"\nimport { useFilterSelectContext } from \"./FilterSelectContext\"\n\nexport type FilterInputProps = InputProps\n\nexport const FilterInput: React.FC<React.PropsWithChildren<InputProps>> = (\n  props\n) => {\n  const { query, setQuery, placeholder } = useFilterSelectContext()\n  const ref = useRef<HTMLInputElement | null>(null)\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    setQuery(event.target.value)\n  }\n\n  const handleClick = () => {\n    setQuery(\"\")\n    ref.current?.focus()\n  }\n\n  return (\n    <LabeledInput\n      ref={ref}\n      role=\"search\"\n      label={\n        query !== \"\" ? (\n          // Active state\n          <Clickable\n            display=\"flex\"\n            onClick={handleClick}\n            aria-label=\"Clear search input\"\n          >\n            <CloseStrokeIcon />\n          </Clickable>\n        ) : (\n          // Resting state\n          <SearchIcon style={{ pointerEvents: \"none\" }} />\n        )\n      }\n      onChange={handleChange}\n      value={query}\n      placeholder={placeholder}\n      {...props}\n    />\n  )\n}\n"],"mappings":";AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,eAAe,MAAM,8BAA8B;AAC1D,OAAOC,UAAU,MAAM,yBAAyB;AAEhD,SAASC,YAAY;AACrB,SAASC,SAAS;AAClB,SAASC,MAAM,QAAQ,OAAO;AAC9B,SAASC,sBAAsB;AAI/B,OAAO,IAAMC,WAA0D,GAAG,SAA7DA,WAA0DA,CACrEC,KAAK,EACF;EACH,IAAAC,qBAAA,GAAyCH,sBAAsB,EAAE;IAAzDI,KAAK,GAAAD,qBAAA,CAALC,KAAK;IAAEC,QAAQ,GAAAF,qBAAA,CAARE,QAAQ;IAAEC,WAAW,GAAAH,qBAAA,CAAXG,WAAW;EACpC,IAAMC,GAAG,GAAGR,MAAM,CAA0B,IAAI,CAAC;EAEjD,IAAMS,YAAY,GAAG,SAAfA,YAAYA,CAAIC,KAA0C,EAAK;IACnEJ,QAAQ,CAACI,KAAK,CAACC,MAAM,CAACC,KAAK,CAAC;EAC9B,CAAC;EAED,IAAMC,WAAW,GAAG,SAAdA,WAAWA,CAAA,EAAS;IAAA,IAAAC,YAAA;IACxBR,QAAQ,CAAC,EAAE,CAAC;IACZ,CAAAQ,YAAA,GAAAN,GAAG,CAACO,OAAO,cAAAD,YAAA,uBAAXA,YAAA,CAAaE,KAAK,EAAE;EACtB,CAAC;EAED,oBACErB,KAAA,CAAAsB,aAAA,CAACnB,YAAY,EAAAoB,QAAA;IACXV,GAAG,EAAEA,GAAI;IACTW,IAAI,EAAC,QAAQ;IACbC,KAAK,EACHf,KAAK,KAAK,EAAE;IAAA;IACV;IACAV,KAAA,CAAAsB,aAAA,CAAClB,SAAS;MACRsB,OAAO,EAAC,MAAM;MACdC,OAAO,EAAET,WAAY;MACrB,cAAW;IAAoB,gBAE/BlB,KAAA,CAAAsB,aAAA,CAACrB,eAAe,OAAG,CACT;IAAA;IAEZ;IACAD,KAAA,CAAAsB,aAAA,CAACpB,UAAU;MAAC0B,KAAK,EAAE;QAAEC,aAAa,EAAE;MAAO;IAAE,EAEhD;IACDC,QAAQ,EAAEhB,YAAa;IACvBG,KAAK,EAAEP,KAAM;IACbE,WAAW,EAAEA;EAAY,GACrBJ,KAAK,EACT;AAEN,CAAC;AAxCYD,WAA0D,CAAAwB,WAAA"}

package/dist/esm/elements/FilterSelect/Components/FilterSelectResultItem.js

@@ -1,6 +1,6 @@
 import React from "react";
 import { Checkbox } from "../../Checkbox";
-import { Item, useFilterSelectContext } from "./FilterSelectContext";
+import { useFilterSelectContext } from "./FilterSelectContext";
 import { Radio } from "../../Radio";
 export var FilterSelectResultItem = function FilterSelectResultItem(props) {
   var _useFilterSelectConte = useFilterSelectContext(),

package/dist/esm/elements/FilterSelect/Components/FilterSelectResultItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterSelectResultItem.js","names":["React","Checkbox","Item","useFilterSelectContext","Radio","FilterSelectResultItem","props","_useFilterSelectConte","renderItemLabel","selectedItems","toggleSelectedItem","multiselect","isSelected","find","item","value","label","Component","createElement","onSelect","selected","key","my","displayName"],"sources":["../../../../../src/elements/FilterSelect/Components/FilterSelectResultItem.tsx"],"sourcesContent":["import React from \"react\"\nimport { Checkbox } from \"../../Checkbox\"\nimport { Item, useFilterSelectContext } from \"./FilterSelectContext\"\nimport { Radio } from \"../../Radio\"\n\nexport const FilterSelectResultItem: React.FC<React.PropsWithChildren<Item>> = (props) => {\n  const {\n    renderItemLabel,\n    selectedItems,\n    toggleSelectedItem,\n    multiselect,\n  } = useFilterSelectContext()\n\n  const isSelected = !!selectedItems.find(\n    (item: Item) => item.value === props.value\n  )\n  const label = renderItemLabel ? renderItemLabel(props) : props.label\n  const Component = multiselect ? Checkbox : Radio\n\n  return (\n    <Component\n      onSelect={() => toggleSelectedItem(props)}\n      selected={isSelected}\n      key={props.value}\n      my={1}\n    >\n      {label}\n    </Component>\n  )\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ;AACjB,SAASC,IAAI,EAAEC,sBAAsB;AACrC,SAASC,KAAK;AAEd,OAAO,IAAMC,sBAA+D,GAAG,SAAlEA,sBAA+DA,CAAIC,KAAK,EAAK;EACxF,IAAAC,qBAAA,GAKIJ,sBAAsB,EAAE;IAJ1BK,eAAe,GAAAD,qBAAA,CAAfC,eAAe;IACfC,aAAa,GAAAF,qBAAA,CAAbE,aAAa;IACbC,kBAAkB,GAAAH,qBAAA,CAAlBG,kBAAkB;IAClBC,WAAW,GAAAJ,qBAAA,CAAXI,WAAW;EAGb,IAAMC,UAAU,GAAG,CAAC,CAACH,aAAa,CAACI,IAAI,CACrC,UAACC,IAAU;IAAA,OAAKA,IAAI,CAACC,KAAK,KAAKT,KAAK,CAACS,KAAK;EAAA,EAC3C;EACD,IAAMC,KAAK,GAAGR,eAAe,GAAGA,eAAe,CAACF,KAAK,CAAC,GAAGA,KAAK,CAACU,KAAK;EACpE,IAAMC,SAAS,GAAGN,WAAW,GAAGV,QAAQ,GAAGG,KAAK;EAEhD,oBACEJ,KAAA,CAAAkB,aAAA,CAACD,SAAS;IACRE,QAAQ,EAAE,SAAVA,QAAQA,CAAA;MAAA,OAAQT,kBAAkB,CAACJ,KAAK,CAAC;IAAA,CAAC;IAC1Cc,QAAQ,EAAER,UAAW;IACrBS,GAAG,EAAEf,KAAK,CAACS,KAAM;IACjBO,EAAE,EAAE;EAAE,GAELN,KAAK,CACI;AAEhB,CAAC;AAxBYX,sBAA+D,CAAAkB,WAAA"}
+{"version":3,"file":"FilterSelectResultItem.js","names":["React","Checkbox","useFilterSelectContext","Radio","FilterSelectResultItem","props","_useFilterSelectConte","renderItemLabel","selectedItems","toggleSelectedItem","multiselect","isSelected","find","item","value","label","Component","createElement","onSelect","selected","key","my","displayName"],"sources":["../../../../../src/elements/FilterSelect/Components/FilterSelectResultItem.tsx"],"sourcesContent":["import React from \"react\"\nimport { Checkbox } from \"../../Checkbox\"\nimport { Item, useFilterSelectContext } from \"./FilterSelectContext\"\nimport { Radio } from \"../../Radio\"\n\nexport const FilterSelectResultItem: React.FC<React.PropsWithChildren<Item>> = (props) => {\n  const {\n    renderItemLabel,\n    selectedItems,\n    toggleSelectedItem,\n    multiselect,\n  } = useFilterSelectContext()\n\n  const isSelected = !!selectedItems.find(\n    (item: Item) => item.value === props.value\n  )\n  const label = renderItemLabel ? renderItemLabel(props) : props.label\n  const Component = multiselect ? Checkbox : Radio\n\n  return (\n    <Component\n      onSelect={() => toggleSelectedItem(props)}\n      selected={isSelected}\n      key={props.value}\n      my={1}\n    >\n      {label}\n    </Component>\n  )\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ;AACjB,SAAeC,sBAAsB;AACrC,SAASC,KAAK;AAEd,OAAO,IAAMC,sBAA+D,GAAG,SAAlEA,sBAA+DA,CAAIC,KAAK,EAAK;EACxF,IAAAC,qBAAA,GAKIJ,sBAAsB,EAAE;IAJ1BK,eAAe,GAAAD,qBAAA,CAAfC,eAAe;IACfC,aAAa,GAAAF,qBAAA,CAAbE,aAAa;IACbC,kBAAkB,GAAAH,qBAAA,CAAlBG,kBAAkB;IAClBC,WAAW,GAAAJ,qBAAA,CAAXI,WAAW;EAGb,IAAMC,UAAU,GAAG,CAAC,CAACH,aAAa,CAACI,IAAI,CACrC,UAACC,IAAU;IAAA,OAAKA,IAAI,CAACC,KAAK,KAAKT,KAAK,CAACS,KAAK;EAAA,EAC3C;EACD,IAAMC,KAAK,GAAGR,eAAe,GAAGA,eAAe,CAACF,KAAK,CAAC,GAAGA,KAAK,CAACU,KAAK;EACpE,IAAMC,SAAS,GAAGN,WAAW,GAAGT,QAAQ,GAAGE,KAAK;EAEhD,oBACEH,KAAA,CAAAiB,aAAA,CAACD,SAAS;IACRE,QAAQ,EAAE,SAAVA,QAAQA,CAAA;MAAA,OAAQT,kBAAkB,CAACJ,KAAK,CAAC;IAAA,CAAC;IAC1Cc,QAAQ,EAAER,UAAW;IACrBS,GAAG,EAAEf,KAAK,CAACS,KAAM;IACjBO,EAAE,EAAE;EAAE,GAELN,KAAK,CACI;AAEhB,CAAC;AAxBYX,sBAA+D,CAAAkB,WAAA"}

package/dist/esm/elements/FilterSelect/FilterSelect.js

@@ -10,7 +10,7 @@ import * as React from "react";
 import { ShowMore } from "../ShowMore";
 import { Flex } from "../Flex";
 import { FilterSelectResultItem } from "./Components/FilterSelectResultItem";
-import { FilterSelectContextProvider, FilterSelectState, Items, useFilterSelectContext } from "./Components/FilterSelectContext";
+import { FilterSelectContextProvider, useFilterSelectContext } from "./Components/FilterSelectContext";
 import { FilterInput } from "./Components/FilterInput";
 import { VisuallyHidden } from "../VisuallyHidden";
 import { Text } from "../Text";

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

@@ -1 +1 @@
-{"version":3,"file":"FilterSelect.js","names":["intersection","orderBy","uniqBy","React","ShowMore","Flex","FilterSelectResultItem","FilterSelectContextProvider","FilterSelectState","Items","useFilterSelectContext","FilterInput","VisuallyHidden","Text","INITIAL_ITEMS_TO_SHOW","useUpdateEffect","Box","Clickable","Stack","FilterSelect","props","createElement","_FilterSelect","displayName","_useFilterSelectConte","enableSelectAll","filteredItems","initialItemsToShow","isFiltered","items","moveSelectedToTop","multiselect","onChange","order","query","selectedItems","console","error","length","orderItems","_toConsumableArray","itemsOrdered","filteredItemsOrdered","itemsSorted","concat","x","value","expanded","isBelowTheFoldSelected","showNoResults","showSelectAll","flexDirection","mb","variant","Fragment","SelectAll","map","item","_extends","key","initial","textDecoration","mt","textAlign","resultsSorted","selected","_ref","results","slice","_ref2","isSelected","_useFilterSelectConte2","onSelectAll","setSelectedItems","isClearDisabled","my","gap","className","onClick","disabled","color"],"sources":["../../../../src/elements/FilterSelect/FilterSelect.tsx"],"sourcesContent":["import { intersection, orderBy, uniqBy } from \"es-toolkit\"\nimport * as React from \"react\"\nimport { ShowMore } from \"../ShowMore\"\nimport { Flex } from \"../Flex\"\nimport { FilterSelectResultItem } from \"./Components/FilterSelectResultItem\"\nimport {\n  FilterSelectContextProvider,\n  FilterSelectState,\n  Items,\n  useFilterSelectContext,\n} from \"./Components/FilterSelectContext\"\nimport { FilterInput } from \"./Components/FilterInput\"\nimport { VisuallyHidden } from \"../VisuallyHidden\"\nimport { Text } from \"../Text\"\nimport { INITIAL_ITEMS_TO_SHOW } from \"../ShowMore\"\nimport { useUpdateEffect } from \"../../utils\"\nimport { Box } from \"../Box\"\nimport { Clickable } from \"../Clickable\"\nimport { Stack } from \"../Stack\"\n\nexport type FilterSelectProps = Partial<FilterSelectState>\n\nexport const FilterSelect: React.FC<\n  React.PropsWithChildren<FilterSelectProps>\n> = (props) => {\n  return (\n    <FilterSelectContextProvider {...props}>\n      <_FilterSelect />\n    </FilterSelectContextProvider>\n  )\n}\n\nconst _FilterSelect: React.FC<React.PropsWithChildren<unknown>> = () => {\n  const {\n    enableSelectAll,\n    filteredItems,\n    initialItemsToShow,\n    isFiltered,\n    items,\n    moveSelectedToTop,\n    multiselect,\n    onChange,\n    order,\n    query,\n    selectedItems,\n  } = useFilterSelectContext()\n\n  if (!multiselect && enableSelectAll) {\n    console.error(\n      \"FilterSelect: enableSelectAll is only available with multiselect mode.\"\n    )\n  }\n\n  // Dispatch change event\n  useUpdateEffect(() => {\n    if (onChange) {\n      onChange({\n        items,\n        filteredItems,\n        selectedItems,\n        query,\n      })\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [onChange, selectedItems])\n\n  if (items.length === 0) {\n    return null\n  }\n\n  const orderItems = (items: Items) => orderBy([...items], order[0], order[1])\n  const itemsOrdered = orderItems(items)\n  const filteredItemsOrdered = orderItems(filteredItems)\n  const itemsSorted =\n    multiselect && moveSelectedToTop\n      ? // Move selected items to the top\n        uniqBy(selectedItems.concat(itemsOrdered), (x) => x.value)\n      : itemsOrdered\n  const expanded = isBelowTheFoldSelected(selectedItems, itemsSorted)\n  const showNoResults = filteredItems.length === 0 && query !== \"\"\n  const showSelectAll = multiselect && enableSelectAll && !showNoResults\n\n  return (\n    <Flex flexDirection=\"column\">\n      <FilterInput mb={1} />\n\n      {query !== \"\" && (\n        <VisuallyHidden aria-live=\"polite\">\n          {`${filteredItems.length} result${\n            filteredItems.length === 1 ? \"\" : \"s\"\n          }`}\n        </VisuallyHidden>\n      )}\n\n      {showNoResults && <Text variant=\"sm\">No results.</Text>}\n\n      {isFiltered ? (\n        <>\n          {showSelectAll && <SelectAll />}\n          {filteredItemsOrdered.map((item) => (\n            <FilterSelectResultItem key={item.value} {...item} />\n          ))}\n        </>\n      ) : (\n        <ShowMore\n          expanded={expanded}\n          initial={initialItemsToShow}\n          variant={\"xs\"}\n          textDecoration=\"underline\"\n          mt={1}\n          textAlign=\"left\"\n        >\n          {itemsSorted.map((item) => {\n            return <FilterSelectResultItem key={item.value} {...item} />\n          })}\n        </ShowMore>\n      )}\n    </Flex>\n  )\n}\n\nexport const isBelowTheFoldSelected = (selectedItems, resultsSorted) => {\n  const selected = selectedItems.map(({ value }) => value)\n  const results = resultsSorted\n    .slice(INITIAL_ITEMS_TO_SHOW)\n    .map(({ value }) => value)\n  const isSelected = intersection(selected, results).length > 0\n  return isSelected\n}\n\nconst SelectAll: React.FC = () => {\n  const {\n    items,\n    filteredItems,\n    onSelectAll,\n    query,\n    selectedItems,\n    setSelectedItems,\n  } = useFilterSelectContext()\n\n  const isClearDisabled = selectedItems.length === 0\n\n  return (\n    <Box my={1}>\n      <Stack gap={2} flexDirection={\"row\"}>\n        <Clickable\n          data-testid=\"filterSelect-selectAll\"\n          className=\"selectAll\"\n          onClick={() => {\n            setSelectedItems(filteredItems)\n            onSelectAll?.({\n              items,\n              filteredItems,\n              selectedItems: filteredItems,\n              query,\n            })\n          }}\n          textDecoration=\"underline\"\n        >\n          <Text variant=\"xs\">Select all</Text>\n        </Clickable>\n\n        <Clickable\n          data-testid=\"filterSelect-clear\"\n          className=\"clear\"\n          onClick={() => setSelectedItems([])}\n          textDecoration=\"underline\"\n          disabled={isClearDisabled}\n          color={isClearDisabled ? \"mono60\" : \"mono100\"}\n        >\n          <Text variant=\"xs\">Clear</Text>\n        </Clickable>\n      </Stack>\n    </Box>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"FilterSelect.js","names":["intersection","orderBy","uniqBy","React","ShowMore","Flex","FilterSelectResultItem","FilterSelectContextProvider","useFilterSelectContext","FilterInput","VisuallyHidden","Text","INITIAL_ITEMS_TO_SHOW","useUpdateEffect","Box","Clickable","Stack","FilterSelect","props","createElement","_FilterSelect","displayName","_useFilterSelectConte","enableSelectAll","filteredItems","initialItemsToShow","isFiltered","items","moveSelectedToTop","multiselect","onChange","order","query","selectedItems","console","error","length","orderItems","_toConsumableArray","itemsOrdered","filteredItemsOrdered","itemsSorted","concat","x","value","expanded","isBelowTheFoldSelected","showNoResults","showSelectAll","flexDirection","mb","variant","Fragment","SelectAll","map","item","_extends","key","initial","textDecoration","mt","textAlign","resultsSorted","selected","_ref","results","slice","_ref2","isSelected","_useFilterSelectConte2","onSelectAll","setSelectedItems","isClearDisabled","my","gap","className","onClick","disabled","color"],"sources":["../../../../src/elements/FilterSelect/FilterSelect.tsx"],"sourcesContent":["import { intersection, orderBy, uniqBy } from \"es-toolkit\"\nimport * as React from \"react\"\nimport { ShowMore } from \"../ShowMore\"\nimport { Flex } from \"../Flex\"\nimport { FilterSelectResultItem } from \"./Components/FilterSelectResultItem\"\nimport {\n  FilterSelectContextProvider,\n  FilterSelectState,\n  Items,\n  useFilterSelectContext,\n} from \"./Components/FilterSelectContext\"\nimport { FilterInput } from \"./Components/FilterInput\"\nimport { VisuallyHidden } from \"../VisuallyHidden\"\nimport { Text } from \"../Text\"\nimport { INITIAL_ITEMS_TO_SHOW } from \"../ShowMore\"\nimport { useUpdateEffect } from \"../../utils\"\nimport { Box } from \"../Box\"\nimport { Clickable } from \"../Clickable\"\nimport { Stack } from \"../Stack\"\n\nexport type FilterSelectProps = Partial<FilterSelectState>\n\nexport const FilterSelect: React.FC<\n  React.PropsWithChildren<FilterSelectProps>\n> = (props) => {\n  return (\n    <FilterSelectContextProvider {...props}>\n      <_FilterSelect />\n    </FilterSelectContextProvider>\n  )\n}\n\nconst _FilterSelect: React.FC<React.PropsWithChildren<unknown>> = () => {\n  const {\n    enableSelectAll,\n    filteredItems,\n    initialItemsToShow,\n    isFiltered,\n    items,\n    moveSelectedToTop,\n    multiselect,\n    onChange,\n    order,\n    query,\n    selectedItems,\n  } = useFilterSelectContext()\n\n  if (!multiselect && enableSelectAll) {\n    console.error(\n      \"FilterSelect: enableSelectAll is only available with multiselect mode.\"\n    )\n  }\n\n  // Dispatch change event\n  useUpdateEffect(() => {\n    if (onChange) {\n      onChange({\n        items,\n        filteredItems,\n        selectedItems,\n        query,\n      })\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [onChange, selectedItems])\n\n  if (items.length === 0) {\n    return null\n  }\n\n  const orderItems = (items: Items) => orderBy([...items], order[0], order[1])\n  const itemsOrdered = orderItems(items)\n  const filteredItemsOrdered = orderItems(filteredItems)\n  const itemsSorted =\n    multiselect && moveSelectedToTop\n      ? // Move selected items to the top\n        uniqBy(selectedItems.concat(itemsOrdered), (x) => x.value)\n      : itemsOrdered\n  const expanded = isBelowTheFoldSelected(selectedItems, itemsSorted)\n  const showNoResults = filteredItems.length === 0 && query !== \"\"\n  const showSelectAll = multiselect && enableSelectAll && !showNoResults\n\n  return (\n    <Flex flexDirection=\"column\">\n      <FilterInput mb={1} />\n\n      {query !== \"\" && (\n        <VisuallyHidden aria-live=\"polite\">\n          {`${filteredItems.length} result${\n            filteredItems.length === 1 ? \"\" : \"s\"\n          }`}\n        </VisuallyHidden>\n      )}\n\n      {showNoResults && <Text variant=\"sm\">No results.</Text>}\n\n      {isFiltered ? (\n        <>\n          {showSelectAll && <SelectAll />}\n          {filteredItemsOrdered.map((item) => (\n            <FilterSelectResultItem key={item.value} {...item} />\n          ))}\n        </>\n      ) : (\n        <ShowMore\n          expanded={expanded}\n          initial={initialItemsToShow}\n          variant={\"xs\"}\n          textDecoration=\"underline\"\n          mt={1}\n          textAlign=\"left\"\n        >\n          {itemsSorted.map((item) => {\n            return <FilterSelectResultItem key={item.value} {...item} />\n          })}\n        </ShowMore>\n      )}\n    </Flex>\n  )\n}\n\nexport const isBelowTheFoldSelected = (selectedItems, resultsSorted) => {\n  const selected = selectedItems.map(({ value }) => value)\n  const results = resultsSorted\n    .slice(INITIAL_ITEMS_TO_SHOW)\n    .map(({ value }) => value)\n  const isSelected = intersection(selected, results).length > 0\n  return isSelected\n}\n\nconst SelectAll: React.FC = () => {\n  const {\n    items,\n    filteredItems,\n    onSelectAll,\n    query,\n    selectedItems,\n    setSelectedItems,\n  } = useFilterSelectContext()\n\n  const isClearDisabled = selectedItems.length === 0\n\n  return (\n    <Box my={1}>\n      <Stack gap={2} flexDirection={\"row\"}>\n        <Clickable\n          data-testid=\"filterSelect-selectAll\"\n          className=\"selectAll\"\n          onClick={() => {\n            setSelectedItems(filteredItems)\n            onSelectAll?.({\n              items,\n              filteredItems,\n              selectedItems: filteredItems,\n              query,\n            })\n          }}\n          textDecoration=\"underline\"\n        >\n          <Text variant=\"xs\">Select all</Text>\n        </Clickable>\n\n        <Clickable\n          data-testid=\"filterSelect-clear\"\n          className=\"clear\"\n          onClick={() => setSelectedItems([])}\n          textDecoration=\"underline\"\n          disabled={isClearDisabled}\n          color={isClearDisabled ? \"mono60\" : \"mono100\"}\n        >\n          <Text variant=\"xs\">Clear</Text>\n        </Clickable>\n      </Stack>\n    </Box>\n  )\n}\n"],"mappings":"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"}

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

@@ -1,3 +1,3 @@
-export { FilterSelectChangeState, Item as FilterSelectItem, Items as FilterSelectItems } from "./Components/FilterSelectContext";
 export * from "./FilterSelect";
+export {};
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["FilterSelectChangeState","Item","FilterSelectItem","Items","FilterSelectItems"],"sources":["../../../../src/elements/FilterSelect/index.tsx"],"sourcesContent":["export {\n  FilterSelectChangeState,\n  Item as FilterSelectItem,\n  Items as FilterSelectItems,\n} from \"./Components/FilterSelectContext\"\nexport * from \"./FilterSelect\"\n"],"mappings":"AAAA,SACEA,uBAAuB,EACvBC,IAAI,IAAIC,gBAAgB,EACxBC,KAAK,IAAIC,iBAAiB;AAE5B"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/elements/FilterSelect/index.tsx"],"sourcesContent":["export type {\n  FilterSelectChangeState,\n  Item as FilterSelectItem,\n  Items as FilterSelectItems,\n} from \"./Components/FilterSelectContext\"\nexport * from \"./FilterSelect\"\n"],"mappings":"AAKA;AAA8B"}

package/dist/esm/elements/Flex/Flex.js

@@ -1,5 +1,5 @@
 import styled from "styled-components";
-import { Box, BoxProps } from "../Box";
+import { Box } from "../Box";
 
 /**
  * Flex is Box with display: flex

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

@@ -1 +1 @@
-{"version":3,"file":"Flex.js","names":["styled","Box","BoxProps","Flex","withConfig","displayName","componentId","defaultProps","display"],"sources":["../../../../src/elements/Flex/Flex.tsx"],"sourcesContent":["import styled from \"styled-components\"\nimport { Box, BoxProps } from \"../Box\"\n\n/**\n * Flex is Box with display: flex\n */\nexport type FlexProps = BoxProps\n\n/**\n * Flex is Box with display: flex\n */\nexport const Flex = styled(Box)<FlexProps>``\n\nFlex.defaultProps = {\n  display: \"flex\",\n}\n\nFlex.displayName = \"Flex\"\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SAASC,GAAG,EAAEC,QAAQ;;AAEtB;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAO,IAAMC,IAAI,GAAGH,MAAM,CAACC,GAAG,CAAC,CAAAG,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,QAAa;AAE5CH,IAAI,CAACI,YAAY,GAAG;EAClBC,OAAO,EAAE;AACX,CAAC;AAEDL,IAAI,CAACE,WAAW,GAAG,MAAM"}
+{"version":3,"file":"Flex.js","names":["styled","Box","Flex","withConfig","displayName","componentId","defaultProps","display"],"sources":["../../../../src/elements/Flex/Flex.tsx"],"sourcesContent":["import styled from \"styled-components\"\nimport { Box, BoxProps } from \"../Box\"\n\n/**\n * Flex is Box with display: flex\n */\nexport type FlexProps = BoxProps\n\n/**\n * Flex is Box with display: flex\n */\nexport const Flex = styled(Box)<FlexProps>``\n\nFlex.defaultProps = {\n  display: \"flex\",\n}\n\nFlex.displayName = \"Flex\"\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SAASC,GAAG;;AAEZ;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAO,IAAMC,IAAI,GAAGF,MAAM,CAACC,GAAG,CAAC,CAAAE,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,QAAa;AAE5CH,IAAI,CAACI,YAAY,GAAG;EAClBC,OAAO,EAAE;AACX,CAAC;AAEDL,IAAI,CAACE,WAAW,GAAG,MAAM"}

package/dist/esm/elements/FullBleed/FullBleed.js

@@ -1,5 +1,5 @@
 import styled from "styled-components";
-import { Box, BoxProps } from "../Box";
+import { Box } from "../Box";
 
 /** FullBleedProps */
 

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

@@ -1 +1 @@
-{"version":3,"file":"FullBleed.js","names":["styled","Box","BoxProps","FullBleed","withConfig","displayName","componentId","defaultProps","position","left","right","width","maxWidth","marginLeft","marginRight"],"sources":["../../../../src/elements/FullBleed/FullBleed.tsx"],"sourcesContent":["import styled from \"styled-components\"\nimport { Box, BoxProps } from \"../Box\"\n\n/** FullBleedProps */\nexport type FullBleedProps = BoxProps\n\n/**\n * Utility to break out of parent containers\n */\nexport const FullBleed = styled(Box)``\n\nFullBleed.defaultProps = {\n  position: \"relative\",\n  left: \"50%\",\n  right: \"50%\",\n  width: \"100vw\",\n  maxWidth: \"100vw\",\n  marginLeft: \"-50vw\",\n  marginRight: \"-50vw\",\n}\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SAASC,GAAG,EAAEC,QAAQ;;AAEtB;;AAGA;AACA;AACA;AACA,OAAO,IAAMC,SAAS,GAAGH,MAAM,CAACC,GAAG,CAAC,CAAAG,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,QAAE;AAEtCH,SAAS,CAACI,YAAY,GAAG;EACvBC,QAAQ,EAAE,UAAU;EACpBC,IAAI,EAAE,KAAK;EACXC,KAAK,EAAE,KAAK;EACZC,KAAK,EAAE,OAAO;EACdC,QAAQ,EAAE,OAAO;EACjBC,UAAU,EAAE,OAAO;EACnBC,WAAW,EAAE;AACf,CAAC"}
+{"version":3,"file":"FullBleed.js","names":["styled","Box","FullBleed","withConfig","displayName","componentId","defaultProps","position","left","right","width","maxWidth","marginLeft","marginRight"],"sources":["../../../../src/elements/FullBleed/FullBleed.tsx"],"sourcesContent":["import styled from \"styled-components\"\nimport { Box, BoxProps } from \"../Box\"\n\n/** FullBleedProps */\nexport type FullBleedProps = BoxProps\n\n/**\n * Utility to break out of parent containers\n */\nexport const FullBleed = styled(Box)``\n\nFullBleed.defaultProps = {\n  position: \"relative\",\n  left: \"50%\",\n  right: \"50%\",\n  width: \"100vw\",\n  maxWidth: \"100vw\",\n  marginLeft: \"-50vw\",\n  marginRight: \"-50vw\",\n}\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SAASC,GAAG;;AAEZ;;AAGA;AACA;AACA;AACA,OAAO,IAAMC,SAAS,GAAGF,MAAM,CAACC,GAAG,CAAC,CAAAE,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,QAAE;AAEtCH,SAAS,CAACI,YAAY,GAAG;EACvBC,QAAQ,EAAE,UAAU;EACpBC,IAAI,EAAE,KAAK;EACXC,KAAK,EAAE,KAAK;EACZC,KAAK,EAAE,OAAO;EACdC,QAAQ,EAAE,OAAO;EACjBC,UAAU,EAAE,OAAO;EACnBC,WAAW,EAAE;AACf,CAAC"}

package/dist/esm/elements/GridColumns/GridColumns.js

@@ -4,10 +4,10 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 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 React, { useMemo } from "react";
 import styled from "styled-components";
-import { gridColumn, GridColumnProps } from "styled-system";
-import { Box, BoxProps } from "../Box";
-import { CSSGrid, CSSGridProps } from "../CSSGrid";
-import { calculateGridColumn, ColumnCell, GRID_COLUMN_FULL_WIDTHS } from "./calculateGridColumn";
+import { gridColumn } from "styled-system";
+import { Box } from "../Box";
+import { CSSGrid } from "../CSSGrid";
+import { calculateGridColumn, GRID_COLUMN_FULL_WIDTHS } from "./calculateGridColumn";
 
 /** GridColumns implements `Box` and the common grid properties */
 

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

@@ -1 +1 @@
-{"version":3,"file":"GridColumns.js","names":["React","useMemo","styled","gridColumn","GridColumnProps","Box","BoxProps","CSSGrid","CSSGridProps","calculateGridColumn","ColumnCell","GRID_COLUMN_FULL_WIDTHS","GridColumns","withConfig","displayName","componentId","defaultProps","gridColumnGap","gridRowGap","Cell","Column","_ref","span","start","wrap","rest","_objectWithoutProperties","_excluded","gridColumnValue","createElement","Fragment","_extends","ColumnWrap","_ref2","display","map","value","includes"],"sources":["../../../../src/elements/GridColumns/GridColumns.tsx"],"sourcesContent":["import React, { useMemo } from \"react\"\nimport styled from \"styled-components\"\nimport { gridColumn, GridColumnProps } from \"styled-system\"\nimport { Box, BoxProps } from \"../Box\"\nimport { CSSGrid, CSSGridProps } from \"../CSSGrid\"\nimport {\n  calculateGridColumn,\n  ColumnCell,\n  GRID_COLUMN_FULL_WIDTHS,\n} from \"./calculateGridColumn\"\n\n/** GridColumns implements `Box` and the common grid properties */\nexport type GridColumnsProps = Omit<CSSGridProps, \"gridTemplateColumns\">\n\n/**\n * A 12-column fluid grid\n */\nexport const GridColumns = styled(CSSGrid)`\n  grid-template-columns: repeat(12, 1fr);\n`\n\nGridColumns.defaultProps = {\n  gridColumnGap: [1, 2],\n  gridRowGap: [1, 2],\n}\n\ntype CellProps = ColumnCell & GridColumnProps & BoxProps\n\nconst Cell = styled(Box)<CellProps>`\n  ${gridColumn}\n`\n\n/** Column implements `Box` and `gridColumn` */\nexport type ColumnProps = CellProps & {\n  /** denotes whether or not to break to a new row after column */\n  wrap?: boolean\n  children?: React.ReactNode\n}\n\n/**\n * A column sits within the GridColumns and spans the columns,\n * sitting between gutters.\n */\nexport const Column: React.FC<React.PropsWithChildren<ColumnProps>> = ({\n  span,\n  start,\n  wrap,\n  ...rest\n}) => {\n  const gridColumnValue = useMemo(() => {\n    return calculateGridColumn({ span, start })\n  }, [span, start])\n\n  return (\n    <>\n      <Cell gridColumn={gridColumnValue} {...rest} />\n      {wrap && <ColumnWrap gridColumnValue={gridColumnValue} />}\n    </>\n  )\n}\n\nconst ColumnWrap: React.FC<React.PropsWithChildren<{ gridColumnValue: string[] }>> = ({\n  gridColumnValue,\n}) => {\n  return (\n    <Cell\n      // Spans the remainder of the columns until the end\n      gridColumn={[\"auto / -1\"]}\n      // Hides the break if the value presented is going to span the full\n      // width of the column anyway. Prevents duplicated row gaps.\n      display={gridColumnValue.map((value) => {\n        return GRID_COLUMN_FULL_WIDTHS.includes(value) ? \"none\" : \"block\"\n      })}\n    />\n  )\n}\n"],"mappings":";;;;AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAASC,UAAU,EAAEC,eAAe,QAAQ,eAAe;AAC3D,SAASC,GAAG,EAAEC,QAAQ;AACtB,SAASC,OAAO,EAAEC,YAAY;AAC9B,SACEC,mBAAmB,EACnBC,UAAU,EACVC,uBAAuB;;AAGzB;;AAGA;AACA;AACA;AACA,OAAO,IAAMC,WAAW,GAAGV,MAAM,CAACK,OAAO,CAAC,CAAAM,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,6CAEzC;AAEDH,WAAW,CAACI,YAAY,GAAG;EACzBC,aAAa,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;EACrBC,UAAU,EAAE,CAAC,CAAC,EAAE,CAAC;AACnB,CAAC;AAID,IAAMC,IAAI,GAAGjB,MAAM,CAACG,GAAG,CAAC,CAAAQ,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,aACpBZ,UAAU,CACb;;AAED;;AAOA;AACA;AACA;AACA;AACA,OAAO,IAAMiB,MAAsD,GAAG,SAAzDA,MAAsDA,CAAAC,IAAA,EAK7D;EAAA,IAJJC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IACJC,KAAK,GAAAF,IAAA,CAALE,KAAK;IACLC,IAAI,GAAAH,IAAA,CAAJG,IAAI;IACDC,IAAI,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAEP,IAAMC,eAAe,GAAG3B,OAAO,CAAC,YAAM;IACpC,OAAOQ,mBAAmB,CAAC;MAAEa,IAAI,EAAJA,IAAI;MAAEC,KAAK,EAALA;IAAM,CAAC,CAAC;EAC7C,CAAC,EAAE,CAACD,IAAI,EAAEC,KAAK,CAAC,CAAC;EAEjB,oBACEvB,KAAA,CAAA6B,aAAA,CAAA7B,KAAA,CAAA8B,QAAA,qBACE9B,KAAA,CAAA6B,aAAA,CAACV,IAAI,EAAAY,QAAA;IAAC5B,UAAU,EAAEyB;EAAgB,GAAKH,IAAI,EAAI,EAC9CD,IAAI,iBAAIxB,KAAA,CAAA6B,aAAA,CAACG,UAAU;IAACJ,eAAe,EAAEA;EAAgB,EAAG,CACxD;AAEP,CAAC;AAED,IAAMI,UAA4E,GAAG,SAA/EA,UAA4EA,CAAAC,KAAA,EAE5E;EAAA,IADJL,eAAe,GAAAK,KAAA,CAAfL,eAAe;EAEf,oBACE5B,KAAA,CAAA6B,aAAA,CAACV;EACC;EAAA;IACAhB,UAAU,EAAE,CAAC,WAAW;IACxB;IACA;IAAA;IACA+B,OAAO,EAAEN,eAAe,CAACO,GAAG,CAAC,UAACC,KAAK,EAAK;MACtC,OAAOzB,uBAAuB,CAAC0B,QAAQ,CAACD,KAAK,CAAC,GAAG,MAAM,GAAG,OAAO;IACnE,CAAC;EAAE,EACH;AAEN,CAAC;AAdKJ,UAA4E,CAAAlB,WAAA"}
+{"version":3,"file":"GridColumns.js","names":["React","useMemo","styled","gridColumn","Box","CSSGrid","calculateGridColumn","GRID_COLUMN_FULL_WIDTHS","GridColumns","withConfig","displayName","componentId","defaultProps","gridColumnGap","gridRowGap","Cell","Column","_ref","span","start","wrap","rest","_objectWithoutProperties","_excluded","gridColumnValue","createElement","Fragment","_extends","ColumnWrap","_ref2","display","map","value","includes"],"sources":["../../../../src/elements/GridColumns/GridColumns.tsx"],"sourcesContent":["import React, { useMemo } from \"react\"\nimport styled from \"styled-components\"\nimport { gridColumn, GridColumnProps } from \"styled-system\"\nimport { Box, BoxProps } from \"../Box\"\nimport { CSSGrid, CSSGridProps } from \"../CSSGrid\"\nimport {\n  calculateGridColumn,\n  ColumnCell,\n  GRID_COLUMN_FULL_WIDTHS,\n} from \"./calculateGridColumn\"\n\n/** GridColumns implements `Box` and the common grid properties */\nexport type GridColumnsProps = Omit<CSSGridProps, \"gridTemplateColumns\">\n\n/**\n * A 12-column fluid grid\n */\nexport const GridColumns = styled(CSSGrid)`\n  grid-template-columns: repeat(12, 1fr);\n`\n\nGridColumns.defaultProps = {\n  gridColumnGap: [1, 2],\n  gridRowGap: [1, 2],\n}\n\ntype CellProps = ColumnCell & GridColumnProps & BoxProps\n\nconst Cell = styled(Box)<CellProps>`\n  ${gridColumn}\n`\n\n/** Column implements `Box` and `gridColumn` */\nexport type ColumnProps = CellProps & {\n  /** denotes whether or not to break to a new row after column */\n  wrap?: boolean\n  children?: React.ReactNode\n}\n\n/**\n * A column sits within the GridColumns and spans the columns,\n * sitting between gutters.\n */\nexport const Column: React.FC<React.PropsWithChildren<ColumnProps>> = ({\n  span,\n  start,\n  wrap,\n  ...rest\n}) => {\n  const gridColumnValue = useMemo(() => {\n    return calculateGridColumn({ span, start })\n  }, [span, start])\n\n  return (\n    <>\n      <Cell gridColumn={gridColumnValue} {...rest} />\n      {wrap && <ColumnWrap gridColumnValue={gridColumnValue} />}\n    </>\n  )\n}\n\nconst ColumnWrap: React.FC<React.PropsWithChildren<{ gridColumnValue: string[] }>> = ({\n  gridColumnValue,\n}) => {\n  return (\n    <Cell\n      // Spans the remainder of the columns until the end\n      gridColumn={[\"auto / -1\"]}\n      // Hides the break if the value presented is going to span the full\n      // width of the column anyway. Prevents duplicated row gaps.\n      display={gridColumnValue.map((value) => {\n        return GRID_COLUMN_FULL_WIDTHS.includes(value) ? \"none\" : \"block\"\n      })}\n    />\n  )\n}\n"],"mappings":";;;;AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAASC,UAAU,QAAyB,eAAe;AAC3D,SAASC,GAAG;AACZ,SAASC,OAAO;AAChB,SACEC,mBAAmB,EAEnBC,uBAAuB;;AAGzB;;AAGA;AACA;AACA;AACA,OAAO,IAAMC,WAAW,GAAGN,MAAM,CAACG,OAAO,CAAC,CAAAI,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,6CAEzC;AAEDH,WAAW,CAACI,YAAY,GAAG;EACzBC,aAAa,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;EACrBC,UAAU,EAAE,CAAC,CAAC,EAAE,CAAC;AACnB,CAAC;AAID,IAAMC,IAAI,GAAGb,MAAM,CAACE,GAAG,CAAC,CAAAK,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,aACpBR,UAAU,CACb;;AAED;;AAOA;AACA;AACA;AACA;AACA,OAAO,IAAMa,MAAsD,GAAG,SAAzDA,MAAsDA,CAAAC,IAAA,EAK7D;EAAA,IAJJC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IACJC,KAAK,GAAAF,IAAA,CAALE,KAAK;IACLC,IAAI,GAAAH,IAAA,CAAJG,IAAI;IACDC,IAAI,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAEP,IAAMC,eAAe,GAAGvB,OAAO,CAAC,YAAM;IACpC,OAAOK,mBAAmB,CAAC;MAAEY,IAAI,EAAJA,IAAI;MAAEC,KAAK,EAALA;IAAM,CAAC,CAAC;EAC7C,CAAC,EAAE,CAACD,IAAI,EAAEC,KAAK,CAAC,CAAC;EAEjB,oBACEnB,KAAA,CAAAyB,aAAA,CAAAzB,KAAA,CAAA0B,QAAA,qBACE1B,KAAA,CAAAyB,aAAA,CAACV,IAAI,EAAAY,QAAA;IAACxB,UAAU,EAAEqB;EAAgB,GAAKH,IAAI,EAAI,EAC9CD,IAAI,iBAAIpB,KAAA,CAAAyB,aAAA,CAACG,UAAU;IAACJ,eAAe,EAAEA;EAAgB,EAAG,CACxD;AAEP,CAAC;AAED,IAAMI,UAA4E,GAAG,SAA/EA,UAA4EA,CAAAC,KAAA,EAE5E;EAAA,IADJL,eAAe,GAAAK,KAAA,CAAfL,eAAe;EAEf,oBACExB,KAAA,CAAAyB,aAAA,CAACV;EACC;EAAA;IACAZ,UAAU,EAAE,CAAC,WAAW;IACxB;IACA;IAAA;IACA2B,OAAO,EAAEN,eAAe,CAACO,GAAG,CAAC,UAACC,KAAK,EAAK;MACtC,OAAOzB,uBAAuB,CAAC0B,QAAQ,CAACD,KAAK,CAAC,GAAG,MAAM,GAAG,OAAO;IACnE,CAAC;EAAE,EACH;AAEN,CAAC;AAdKJ,UAA4E,CAAAlB,WAAA"}

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

@@ -1,3 +1,3 @@
-export { ColumnSpan, ColumnStart } from "./calculateGridColumn";
 export * from "./GridColumns";
+export {};
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ColumnSpan","ColumnStart"],"sources":["../../../../src/elements/GridColumns/index.ts"],"sourcesContent":["export { ColumnSpan, ColumnStart } from \"./calculateGridColumn\"\nexport * from \"./GridColumns\"\n"],"mappings":"AAAA,SAASA,UAAU,EAAEC,WAAW;AAChC"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/elements/GridColumns/index.ts"],"sourcesContent":["export type { ColumnSpan, ColumnStart } from \"./calculateGridColumn\"\nexport * from \"./GridColumns\"\n"],"mappings":"AACA;AAA6B"}

package/dist/esm/elements/HTML/HTML.js

@@ -4,9 +4,9 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import { themeGet } from "@styled-system/theme-get";
-import React, { HTMLAttributes } from "react";
+import React from "react";
 import styled, { css } from "styled-components";
-import { Text, TextProps } from "../Text";
+import { Text } from "../Text";
 
 /**
  * HTML

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

@@ -1 +1 @@
-{"version":3,"file":"HTML.js","names":["themeGet","React","HTMLAttributes","styled","css","Text","TextProps","htmlMixin","Container","withConfig","displayName","componentId","defaultProps","variant","HTML","props","html","htmlRest","_objectWithoutProperties","_excluded","createElement","_extends","dangerouslySetInnerHTML","__html","children","childrenRest","_excluded2"],"sources":["../../../../src/elements/HTML/HTML.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport React, { HTMLAttributes } from \"react\"\nimport styled, { css } from \"styled-components\"\nimport { Text, TextProps } from \"../Text\"\n\n/**\n * HTML\n */\nexport type HTMLProps = TextProps &\n  HTMLAttributes<HTMLDivElement | HTMLHeadingElement | HTMLParagraphElement> &\n  ({ html: string } | { children: React.ReactNode })\n\n/**\n * Sets reasonable defaults for tags that we might encounter in Markdown output.\n */\nexport const htmlMixin = css`\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  ul,\n  ol,\n  p,\n  blockquote,\n  pre,\n  hr {\n    margin: ${themeGet(\"space.1\")} 0;\n\n    &:first-child {\n      margin-top: 0;\n    }\n\n    &:last-child {\n      margin-bottom: 0;\n    }\n  }\n\n  hr {\n    height: 1px;\n    width: 100%;\n    border: 0;\n    background-color: ${themeGet(\"colors.mono10\")};\n  }\n`\n\nconst Container = styled(Text)`\n  ${htmlMixin}\n`\n\nContainer.defaultProps = {\n  variant: \"sm\",\n}\n\n/**\n * Sets reasonable defaults for tags that we might encounter in Markdown output.\n * If `html` prop is passed; it's set as innerHTML, otherwise contents are wrapped\n * with default HTML styling.\n */\nexport const HTML: React.FC<React.PropsWithChildren<HTMLProps>> = (props) => {\n  if (\"html\" in props) {\n    const { html, ...htmlRest } = props\n    return (\n      <Container dangerouslySetInnerHTML={{ __html: html }} {...htmlRest} />\n    )\n  }\n\n  const { children, ...childrenRest } = props\n  return <Container {...childrenRest}>{children}</Container>\n}\n\nHTML.displayName = \"HTML\"\n"],"mappings":";;;;;AAAA,SAASA,QAAQ,QAAQ,0BAA0B;AACnD,OAAOC,KAAK,IAAIC,cAAc,QAAQ,OAAO;AAC7C,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAC/C,SAASC,IAAI,EAAEC,SAAS;;AAExB;AACA;AACA;;AAKA;AACA;AACA;AACA,OAAO,IAAMC,SAAS,GAAGH,GAAG,kLAYdJ,QAAQ,CAAC,SAAS,CAAC,EAeTA,QAAQ,CAAC,eAAe,CAAC,CAEhD;AAED,IAAMQ,SAAS,GAAGL,MAAM,CAACE,IAAI,CAAC,CAAAI,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,aAC1BJ,SAAS,CACZ;AAEDC,SAAS,CAACI,YAAY,GAAG;EACvBC,OAAO,EAAE;AACX,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMC,IAAkD,GAAG,SAArDA,IAAkDA,CAAIC,KAAK,EAAK;EAC3E,IAAI,MAAM,IAAIA,KAAK,EAAE;IACnB,IAAQC,IAAI,GAAkBD,KAAK,CAA3BC,IAAI;MAAKC,QAAQ,GAAAC,wBAAA,CAAKH,KAAK,EAAAI,SAAA;IACnC,oBACElB,KAAA,CAAAmB,aAAA,CAACZ,SAAS,EAAAa,QAAA;MAACC,uBAAuB,EAAE;QAAEC,MAAM,EAAEP;MAAK;IAAE,GAAKC,QAAQ,EAAI;EAE1E;EAEA,IAAQO,QAAQ,GAAsBT,KAAK,CAAnCS,QAAQ;IAAKC,YAAY,GAAAP,wBAAA,CAAKH,KAAK,EAAAW,UAAA;EAC3C,oBAAOzB,KAAA,CAAAmB,aAAA,CAACZ,SAAS,EAAKiB,YAAY,EAAGD,QAAQ,CAAa;AAC5D,CAAC;AAVYV,IAAkD,CAAAJ,WAAA;AAY/DI,IAAI,CAACJ,WAAW,GAAG,MAAM"}
+{"version":3,"file":"HTML.js","names":["themeGet","React","styled","css","Text","htmlMixin","Container","withConfig","displayName","componentId","defaultProps","variant","HTML","props","html","htmlRest","_objectWithoutProperties","_excluded","createElement","_extends","dangerouslySetInnerHTML","__html","children","childrenRest","_excluded2"],"sources":["../../../../src/elements/HTML/HTML.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport React, { HTMLAttributes } from \"react\"\nimport styled, { css } from \"styled-components\"\nimport { Text, TextProps } from \"../Text\"\n\n/**\n * HTML\n */\nexport type HTMLProps = TextProps &\n  HTMLAttributes<HTMLDivElement | HTMLHeadingElement | HTMLParagraphElement> &\n  ({ html: string } | { children: React.ReactNode })\n\n/**\n * Sets reasonable defaults for tags that we might encounter in Markdown output.\n */\nexport const htmlMixin = css`\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  ul,\n  ol,\n  p,\n  blockquote,\n  pre,\n  hr {\n    margin: ${themeGet(\"space.1\")} 0;\n\n    &:first-child {\n      margin-top: 0;\n    }\n\n    &:last-child {\n      margin-bottom: 0;\n    }\n  }\n\n  hr {\n    height: 1px;\n    width: 100%;\n    border: 0;\n    background-color: ${themeGet(\"colors.mono10\")};\n  }\n`\n\nconst Container = styled(Text)`\n  ${htmlMixin}\n`\n\nContainer.defaultProps = {\n  variant: \"sm\",\n}\n\n/**\n * Sets reasonable defaults for tags that we might encounter in Markdown output.\n * If `html` prop is passed; it's set as innerHTML, otherwise contents are wrapped\n * with default HTML styling.\n */\nexport const HTML: React.FC<React.PropsWithChildren<HTMLProps>> = (props) => {\n  if (\"html\" in props) {\n    const { html, ...htmlRest } = props\n    return (\n      <Container dangerouslySetInnerHTML={{ __html: html }} {...htmlRest} />\n    )\n  }\n\n  const { children, ...childrenRest } = props\n  return <Container {...childrenRest}>{children}</Container>\n}\n\nHTML.displayName = \"HTML\"\n"],"mappings":";;;;;AAAA,SAASA,QAAQ,QAAQ,0BAA0B;AACnD,OAAOC,KAAK,MAA0B,OAAO;AAC7C,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAC/C,SAASC,IAAI;;AAEb;AACA;AACA;;AAKA;AACA;AACA;AACA,OAAO,IAAMC,SAAS,GAAGF,GAAG,kLAYdH,QAAQ,CAAC,SAAS,CAAC,EAeTA,QAAQ,CAAC,eAAe,CAAC,CAEhD;AAED,IAAMM,SAAS,GAAGJ,MAAM,CAACE,IAAI,CAAC,CAAAG,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,aAC1BJ,SAAS,CACZ;AAEDC,SAAS,CAACI,YAAY,GAAG;EACvBC,OAAO,EAAE;AACX,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMC,IAAkD,GAAG,SAArDA,IAAkDA,CAAIC,KAAK,EAAK;EAC3E,IAAI,MAAM,IAAIA,KAAK,EAAE;IACnB,IAAQC,IAAI,GAAkBD,KAAK,CAA3BC,IAAI;MAAKC,QAAQ,GAAAC,wBAAA,CAAKH,KAAK,EAAAI,SAAA;IACnC,oBACEhB,KAAA,CAAAiB,aAAA,CAACZ,SAAS,EAAAa,QAAA;MAACC,uBAAuB,EAAE;QAAEC,MAAM,EAAEP;MAAK;IAAE,GAAKC,QAAQ,EAAI;EAE1E;EAEA,IAAQO,QAAQ,GAAsBT,KAAK,CAAnCS,QAAQ;IAAKC,YAAY,GAAAP,wBAAA,CAAKH,KAAK,EAAAW,UAAA;EAC3C,oBAAOvB,KAAA,CAAAiB,aAAA,CAACZ,SAAS,EAAKiB,YAAY,EAAGD,QAAQ,CAAa;AAC5D,CAAC;AAVYV,IAAkD,CAAAJ,WAAA;AAY/DI,IAAI,CAACJ,WAAW,GAAG,MAAM"}

package/dist/esm/elements/HorizontalOverflow/HorizontalOverflow.js

@@ -13,10 +13,10 @@ import composeRefs from "@seznam/compose-react-refs";
 import { themeGet } from "@styled-system/theme-get";
 import React, { forwardRef, useEffect, useRef, useState } from "react";
 import styled from "styled-components";
-import { border, BorderProps, compose, justifyContent, JustifyContentProps, padding, PaddingProps } from "styled-system";
+import { border, compose, justifyContent, padding } from "styled-system";
 import { visuallyDisableScrollbar } from "../../helpers/visuallyDisableScrollbar";
 import { splitProps } from "../../utils/splitProps";
-import { Box, BoxProps } from "../Box";
+import { Box } from "../Box";
 var splitRailProps = splitProps(compose(padding, justifyContent, border));
 var Overlay = styled(Box).withConfig({
   displayName: "HorizontalOverflow__Overlay",

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

@@ -1 +1 @@
-{"version":3,"file":"HorizontalOverflow.js","names":["composeRefs","themeGet","React","forwardRef","useEffect","useRef","useState","styled","border","BorderProps","compose","justifyContent","JustifyContentProps","padding","PaddingProps","visuallyDisableScrollbar","splitProps","Box","BoxProps","splitRailProps","Overlay","withConfig","displayName","componentId","_ref2","atEnd","Viewport","Rail","HorizontalOverflow","_ref3","forwardedRef","children","rest","_objectWithoutProperties","_excluded","ref","updateAtEnd","window","addEventListener","removeEventListener","_splitRailProps","_splitRailProps2","_slicedToArray","railProps","_splitRailProps2$","_ref","boxProps","_excluded2","_useState","_useState2","setAtEnd","current","_ref$current","scrollLeft","scrollWidth","clientWidth","Math","abs","createElement","_extends","onScroll","display","verticalAlign"],"sources":["../../../../src/elements/HorizontalOverflow/HorizontalOverflow.tsx"],"sourcesContent":["import composeRefs from \"@seznam/compose-react-refs\"\nimport { themeGet } from \"@styled-system/theme-get\"\nimport React, { forwardRef, useEffect, useRef, useState } from \"react\"\nimport styled from \"styled-components\"\nimport {\n  border,\n  BorderProps,\n  compose,\n  justifyContent,\n  JustifyContentProps,\n  padding,\n  PaddingProps,\n} from \"styled-system\"\nimport { visuallyDisableScrollbar } from \"../../helpers/visuallyDisableScrollbar\"\nimport { splitProps } from \"../../utils/splitProps\"\nimport { Box, BoxProps } from \"../Box\"\n\nconst splitRailProps = splitProps<\n  PaddingProps & JustifyContentProps & BorderProps\n>(compose(padding, justifyContent, border))\n\nconst Overlay = styled(Box)<{ atEnd: boolean }>`\n  position: relative;\n\n  /* Fade-out gradient */\n  &::after {\n    display: block;\n    content: \"\";\n    position: absolute;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    width: ${themeGet(\"space.6\")};\n    z-index: 1;\n    pointer-events: none;\n    background: ${themeGet(\"effects.fadeRight\")};\n    /* Hide when scrolled all the way over */\n    transition: opacity 250ms;\n    opacity: ${({ atEnd }) => (atEnd ? 0 : 1)};\n  }\n`\n\nconst Viewport = styled(Box)`\n  height: 100%;\n  overflow-x: auto;\n  -webkit-overflow-scrolling: touch;\n  ${visuallyDisableScrollbar}\n`\n\nconst Rail = styled(Box)`\n  white-space: nowrap;\n  min-width: 100%;\n  height: 100%;\n`\n\nexport type HorizontalOverflowProps = BoxProps & { children: React.ReactNode }\n\nexport const HorizontalOverflow = forwardRef<\n  HTMLDivElement,\n  HorizontalOverflowProps\n>(({ children, ...rest }, forwardedRef) => {\n  const ref = useRef<HTMLDivElement | null>()\n\n  useEffect(() => {\n    updateAtEnd()\n    window.addEventListener(\"resize\", updateAtEnd)\n    return () => {\n      window.removeEventListener(\"resize\", updateAtEnd)\n    }\n  }, [])\n\n  // FIXME: REACT_18_UPGRADE\n  // @ts-ignore\n  const [railProps, { ref: _ref, ...boxProps }] = splitRailProps(rest)\n\n  const [atEnd, setAtEnd] = useState(false)\n\n  const updateAtEnd = () => {\n    if (!ref.current) return\n\n    const {\n      current: { scrollLeft, scrollWidth, clientWidth },\n    } = ref\n\n    // Check if we're at the end of the scroll (within 1px)\n    if (Math.abs(scrollLeft + clientWidth - scrollWidth) <= 1) {\n      setAtEnd(true)\n      return\n    }\n\n    setAtEnd(false)\n  }\n\n  return (\n    <Overlay atEnd={atEnd} {...boxProps}>\n      <Viewport\n        ref={composeRefs(ref, forwardedRef) as any}\n        onScroll={updateAtEnd}\n      >\n        <Rail display=\"inline-flex\" verticalAlign=\"top\" {...railProps}>\n          {children}\n        </Rail>\n      </Viewport>\n    </Overlay>\n  )\n})\n\nHorizontalOverflow.displayName = \"HorizontalOverflow\"\n"],"mappings":"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"}
+{"version":3,"file":"HorizontalOverflow.js","names":["composeRefs","themeGet","React","forwardRef","useEffect","useRef","useState","styled","border","compose","justifyContent","padding","visuallyDisableScrollbar","splitProps","Box","splitRailProps","Overlay","withConfig","displayName","componentId","_ref2","atEnd","Viewport","Rail","HorizontalOverflow","_ref3","forwardedRef","children","rest","_objectWithoutProperties","_excluded","ref","updateAtEnd","window","addEventListener","removeEventListener","_splitRailProps","_splitRailProps2","_slicedToArray","railProps","_splitRailProps2$","_ref","boxProps","_excluded2","_useState","_useState2","setAtEnd","current","_ref$current","scrollLeft","scrollWidth","clientWidth","Math","abs","createElement","_extends","onScroll","display","verticalAlign"],"sources":["../../../../src/elements/HorizontalOverflow/HorizontalOverflow.tsx"],"sourcesContent":["import composeRefs from \"@seznam/compose-react-refs\"\nimport { themeGet } from \"@styled-system/theme-get\"\nimport React, { forwardRef, useEffect, useRef, useState } from \"react\"\nimport styled from \"styled-components\"\nimport {\n  border,\n  BorderProps,\n  compose,\n  justifyContent,\n  JustifyContentProps,\n  padding,\n  PaddingProps,\n} from \"styled-system\"\nimport { visuallyDisableScrollbar } from \"../../helpers/visuallyDisableScrollbar\"\nimport { splitProps } from \"../../utils/splitProps\"\nimport { Box, BoxProps } from \"../Box\"\n\nconst splitRailProps = splitProps<\n  PaddingProps & JustifyContentProps & BorderProps\n>(compose(padding, justifyContent, border))\n\nconst Overlay = styled(Box)<{ atEnd: boolean }>`\n  position: relative;\n\n  /* Fade-out gradient */\n  &::after {\n    display: block;\n    content: \"\";\n    position: absolute;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    width: ${themeGet(\"space.6\")};\n    z-index: 1;\n    pointer-events: none;\n    background: ${themeGet(\"effects.fadeRight\")};\n    /* Hide when scrolled all the way over */\n    transition: opacity 250ms;\n    opacity: ${({ atEnd }) => (atEnd ? 0 : 1)};\n  }\n`\n\nconst Viewport = styled(Box)`\n  height: 100%;\n  overflow-x: auto;\n  -webkit-overflow-scrolling: touch;\n  ${visuallyDisableScrollbar}\n`\n\nconst Rail = styled(Box)`\n  white-space: nowrap;\n  min-width: 100%;\n  height: 100%;\n`\n\nexport type HorizontalOverflowProps = BoxProps & { children: React.ReactNode }\n\nexport const HorizontalOverflow = forwardRef<\n  HTMLDivElement,\n  HorizontalOverflowProps\n>(({ children, ...rest }, forwardedRef) => {\n  const ref = useRef<HTMLDivElement | null>()\n\n  useEffect(() => {\n    updateAtEnd()\n    window.addEventListener(\"resize\", updateAtEnd)\n    return () => {\n      window.removeEventListener(\"resize\", updateAtEnd)\n    }\n  }, [])\n\n  // FIXME: REACT_18_UPGRADE\n  // @ts-ignore\n  const [railProps, { ref: _ref, ...boxProps }] = splitRailProps(rest)\n\n  const [atEnd, setAtEnd] = useState(false)\n\n  const updateAtEnd = () => {\n    if (!ref.current) return\n\n    const {\n      current: { scrollLeft, scrollWidth, clientWidth },\n    } = ref\n\n    // Check if we're at the end of the scroll (within 1px)\n    if (Math.abs(scrollLeft + clientWidth - scrollWidth) <= 1) {\n      setAtEnd(true)\n      return\n    }\n\n    setAtEnd(false)\n  }\n\n  return (\n    <Overlay atEnd={atEnd} {...boxProps}>\n      <Viewport\n        ref={composeRefs(ref, forwardedRef) as any}\n        onScroll={updateAtEnd}\n      >\n        <Rail display=\"inline-flex\" verticalAlign=\"top\" {...railProps}>\n          {children}\n        </Rail>\n      </Viewport>\n    </Overlay>\n  )\n})\n\nHorizontalOverflow.displayName = \"HorizontalOverflow\"\n"],"mappings":"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"}

package/dist/esm/elements/Image/Image.js

@@ -15,7 +15,7 @@ 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 React, { useState, useRef, useEffect } from "react";
-import { Box, BoxProps, splitBoxProps } from "../Box";
+import { Box, splitBoxProps } from "../Box";
 import styled from "styled-components";
 import isPropValid from "@emotion/is-prop-valid";
 export var Image = function Image(_ref) {