@artsy/palette 44.0.1 → 44.2.0

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

@@ -1 +1 @@
-{"version":3,"file":"Dropdown.story.js","names":["_react","_interopRequireWildcard","require","_storybookStates","_utils","_Box","_Button","_Text","_Dropdown","_Clickable","_Flex","_Pill","_ChevronSmallDownIcon","_interopRequireDefault","_Spacer","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","_typeof","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_slicedToArray","arr","i","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","length","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_extends","assign","bind","target","arguments","source","apply","_default","exports","title","Default","createElement","States","states","keys","POSITION","map","placement","Dropdown","visible","dropdown","Box","width","p","Text","as","display","variant","href","_ref","anchorRef","anchorProps","textAlign","Button","ref","size","displayName","story","parameters","chromatic","disable","KeepInDOM","keepInDOM","_ref2","ChangeDimensions","_useState","useState","_useState2","height","setHeight","useEffect","setInterval","Math","floor","random","_ref3","FocusOrder","Clickable","py","px","Flex","_ref4","mr","_ref5","OpenDropdownByClick","openDropdownByClick","_ref6","FilterExample","_ref7","Pill","Icon","ChevronSmallDownIcon","iconPosition","OverflowingContent","fill","_","_useState3","_useState4","setPlacement","Fragment","bg","Spacer","y","mb","selected","onClick","alignItems","justifyContent","_ref8","DisabledTransition","num","concat","transition","_ref9"],"sources":["../../../src/elements/Dropdown/Dropdown.story.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\"\nimport { States } from \"storybook-states\"\nimport { Position, POSITION } from \"../../utils\"\nimport { Box } from \"../Box\"\nimport { Button } from \"../Button\"\nimport { Text } from \"../Text\"\nimport { Dropdown, DropdownProps } from \"./Dropdown\"\nimport { Clickable } from \"../Clickable\"\nimport { Flex } from \"../Flex\"\nimport { Pill } from \"../Pill\"\nimport ChevronSmallDownIcon from \"@artsy/icons/ChevronSmallDownIcon\"\nimport { Spacer } from \"../Spacer\"\n\nexport default {\n  title: \"Components/Dropdown\",\n}\n\nexport const Default = () => {\n  return (\n    <States<Partial<DropdownProps>>\n      states={Object.keys(POSITION).map((placement) => ({\n        placement: placement as Position,\n      }))}\n    >\n      <Dropdown\n        placement=\"bottom\"\n        visible\n        dropdown={\n          <Box width={300} p={2}>\n            <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n              One\n            </Text>\n\n            <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n              Two\n            </Text>\n\n            <Text as=\"a\" display=\"block\" variant=\"sm\" href=\"#\">\n              Three\n            </Text>\n          </Box>\n        }\n      >\n        {({ anchorRef, anchorProps }) => {\n          return (\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      </Dropdown>\n    </States>\n  )\n}\n\nDefault.story = {\n  parameters: { chromatic: { disable: true } },\n}\n\nexport const KeepInDOM = () => {\n  return (\n    <Dropdown\n      placement=\"bottom\"\n      keepInDOM\n      dropdown={\n        <Text p={2} variant=\"xs\">\n          Content remains in DOM\n        </Text>\n      }\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\nKeepInDOM.story = {\n  parameters: { chromatic: { disable: true } },\n}\n\nexport const ChangeDimensions = () => {\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 placement=\"bottom\" dropdown={<Box height={height} width={300} />}>\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\nexport const FocusOrder = () => {\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\nexport const OpenDropdownByClick = () => {\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\nexport const FilterExample = () => {\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\nexport const OverflowingContent = () => {\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 dropdown={dropdown} openDropdownByClick placement={placement}>\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\nexport const DisabledTransition = () => {\n  return (\n    <Flex>\n      {[1, 2, 3].map((num) => {\n        const dropdown = (\n          <Text variant=\"sm-display\" width=\"100vw\" bg={`color-b${num}00`} p={2}>\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"],"mappings":"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"}
+{"version":3,"file":"Dropdown.story.js","names":["_react","_interopRequireWildcard","require","_Box","_Button","_Text","_Dropdown","_Clickable","_Flex","_Pill","_ChevronSmallDownIcon","_interopRequireDefault","_Spacer","_storybookBlocklist","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","_typeof","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_slicedToArray","arr","i","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","length","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_extends","assign","bind","target","arguments","source","apply","_default","exports","component","Dropdown","title","tags","parameters","docs","description","controls","exclude","STORYBOOK_PROPS_BLOCKLIST","Default","args","placement","dropdown","createElement","Box","width","p","Text","as","display","variant","href","children","_ref","anchorRef","anchorProps","textAlign","Button","ref","size","chromatic","disable","KeepInDOM","keepInDOM","_ref2","ChangeDimensions","render","_useState","useState","_useState2","height","setHeight","useEffect","setInterval","Math","floor","random","_ref3","FocusOrder","Clickable","py","px","Flex","_ref4","mr","_ref5","OpenDropdownByClick","openDropdownByClick","_ref6","FilterExample","_ref7","Pill","Icon","ChevronSmallDownIcon","iconPosition","OverflowingContent","fill","map","_","_useState3","_useState4","setPlacement","Fragment","bg","Spacer","y","mb","selected","onClick","alignItems","justifyContent","_ref8","DisabledTransition","num","concat","transition","_ref9"],"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"],"mappings":"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"}

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

@@ -1,6 +1,250 @@
 import React from "react";
 declare const _default: {
+    component: React.FC<React.PropsWithChildren<import("./EntityHeader").EntityHeaderProps>>;
     title: string;
+    tags: string[];
+    parameters: {
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+        controls: {
+            exclude: string[];
+        };
+    };
 };
 export default _default;
-export declare const Default: () => React.JSX.Element;
+export declare const Default: {
+    args: {
+        name: string;
+        initials: string;
+        image: {
+            src: string;
+            srcSet: string;
+            lazyLoad: boolean;
+        };
+        meta: string;
+        href: string;
+        FollowButton: React.JSX.Element;
+        maxWidth: number;
+    };
+};
+export declare const NameOnly: {
+    args: {
+        name: string;
+        maxWidth: number;
+    };
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};
+export declare const SmallVariantWithInitials: {
+    args: {
+        smallVariant: boolean;
+        name: string;
+        initials: string;
+        maxWidth: number;
+    };
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};
+export declare const WithInitials: {
+    args: {
+        name: string;
+        initials: string;
+        maxWidth: number;
+    };
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};
+export declare const SmallVariantWithImage: {
+    args: {
+        smallVariant: boolean;
+        name: string;
+        image: {
+            src: string;
+            srcSet: string;
+            lazyLoad: boolean;
+        };
+        maxWidth: number;
+    };
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};
+export declare const WithImage: {
+    args: {
+        name: string;
+        image: {
+            src: string;
+            srcSet: string;
+            lazyLoad: boolean;
+        };
+        maxWidth: number;
+    };
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};
+export declare const WithMetaAndHref: {
+    args: {
+        initials: string;
+        name: string;
+        image: {
+            src: string;
+            srcSet: string;
+            lazyLoad: boolean;
+        };
+        meta: string;
+        href: string;
+        maxWidth: number;
+    };
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};
+export declare const SmallVariantWithButton: {
+    args: {
+        smallVariant: boolean;
+        name: string;
+        image: {
+            src: string;
+            srcSet: string;
+            lazyLoad: boolean;
+        };
+        FollowButton: React.JSX.Element;
+        maxWidth: number;
+    };
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};
+export declare const Complete: {
+    args: {
+        initials: string;
+        name: string;
+        image: {
+            src: string;
+            srcSet: string;
+            lazyLoad: boolean;
+        };
+        meta: string;
+        href: string;
+        FollowButton: React.JSX.Element;
+        maxWidth: number;
+    };
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};
+export declare const LongerName: {
+    args: {
+        initials: string;
+        name: string;
+        image: {
+            src: string;
+            srcSet: string;
+            lazyLoad: boolean;
+        };
+        meta: string;
+        href: string;
+        FollowButton: React.JSX.Element;
+        maxWidth: number;
+    };
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};
+export declare const WithSingleLabel: {
+    args: {
+        initials: string;
+        name: string;
+        image: {
+            src: string;
+            srcSet: string;
+            lazyLoad: boolean;
+        };
+        meta: string;
+        href: string;
+        FollowButton: React.JSX.Element;
+        labels: {
+            children: string;
+        }[];
+        maxWidth: number;
+    };
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};
+export declare const WithMultipleLabels: {
+    args: {
+        initials: string;
+        name: string;
+        image: {
+            src: string;
+            srcSet: string;
+            lazyLoad: boolean;
+        };
+        meta: string;
+        href: string;
+        FollowButton: React.JSX.Element;
+        labels: ({
+            children: string;
+            variant?: undefined;
+        } | {
+            children: string;
+            variant: string;
+        })[];
+        maxWidth: number;
+    };
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};

package/dist/elements/EntityHeader/EntityHeader.story.js

@@ -3,15 +3,26 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.Default = void 0;
+exports.default = exports.WithSingleLabel = exports.WithMultipleLabels = exports.WithMetaAndHref = exports.WithInitials = exports.WithImage = exports.SmallVariantWithInitials = exports.SmallVariantWithImage = exports.SmallVariantWithButton = exports.NameOnly = exports.LongerName = exports.Default = exports.Complete = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _storybookStates = require("storybook-states");
 var _Button = require("../Button");
 var _EntityHeader = require("./EntityHeader");
+var _storybookBlocklist = require("../../utils/storybookBlocklist");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 var _default = exports.default = {
-  title: "Components/EntityHeader"
+  component: _EntityHeader.EntityHeader,
+  title: "Components/EntityHeader",
+  tags: ["autodocs"],
+  parameters: {
+    docs: {
+      description: {
+        component: "A header component for displaying entity information including name, image, metadata, and action buttons."
+      }
+    },
+    controls: {
+      exclude: _storybookBlocklist.STORYBOOK_PROPS_BLOCKLIST
+    }
+  }
 };
 var FollowButton = function FollowButton() {
   return /*#__PURE__*/_react.default.createElement(_Button.Button, {
@@ -28,78 +39,200 @@ var imageProps = {
   srcSet: "https://picsum.photos/seed/example/110/110 1x, https://picsum.photos/seed/example/220/220 2x",
   lazyLoad: true
 };
-var Default = exports.Default = function Default() {
-  return /*#__PURE__*/_react.default.createElement(_storybookStates.States, {
-    states: [{
-      name: "Francesca DiMattio"
-    }, {
-      smallVariant: true,
-      name: "Francesca DiMattio",
-      initials: "FD"
-    }, {
-      name: "Francesca DiMattio",
-      initials: "FD"
-    }, {
-      smallVariant: true,
-      name: "Francesca DiMattio",
-      image: imageProps
-    }, {
-      name: "Francesca DiMattio",
-      image: imageProps
-    }, {
-      initials: "FD",
-      name: "Francesca DiMattio",
-      image: imageProps,
-      meta: "American, b. 1979",
-      href: "http://www.artsy.net/artist/francesca-dimattio"
-    }, {
-      smallVariant: true,
-      name: "Francesca DiMattio",
-      image: imageProps,
-      FollowButton: /*#__PURE__*/_react.default.createElement(FollowButton, null)
-    }, {
-      initials: "FD",
-      name: "Francesca DiMattio",
-      image: imageProps,
-      meta: "American, b. 1979",
-      href: "http://www.artsy.net/artist/francesca-dimattio",
-      FollowButton: /*#__PURE__*/_react.default.createElement(FollowButton, null)
-    }, {
-      initials: "FLD",
-      name: "Francesca Longer DiMattio",
-      image: imageProps,
-      meta: "American, b. Founded 1979",
-      href: "http://www.artsy.net/artist/francesca-dimattio",
-      FollowButton: /*#__PURE__*/_react.default.createElement(FollowButton, null)
-    }, {
-      initials: "FLD",
-      name: "Francesca Much Longer DiMattio",
-      image: imageProps,
-      meta: "American, b. Founded 1979",
-      href: "http://www.artsy.net/artist/francesca-dimattio",
-      FollowButton: /*#__PURE__*/_react.default.createElement(FollowButton, null),
-      labels: [{
-        children: "Black Owned"
-      }]
+var Default = exports.Default = {
+  args: {
+    name: "Francesca DiMattio",
+    initials: "FD",
+    image: imageProps,
+    meta: "American, b. 1979",
+    href: "http://www.artsy.net/artist/francesca-dimattio",
+    FollowButton: /*#__PURE__*/_react.default.createElement(FollowButton, null),
+    maxWidth: 350
+  }
+};
+var NameOnly = exports.NameOnly = {
+  args: {
+    name: "Francesca DiMattio",
+    maxWidth: 350
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "EntityHeader with only a name."
+      }
+    }
+  }
+};
+var SmallVariantWithInitials = exports.SmallVariantWithInitials = {
+  args: {
+    smallVariant: true,
+    name: "Francesca DiMattio",
+    initials: "FD",
+    maxWidth: 350
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Small variant EntityHeader with initials."
+      }
+    }
+  }
+};
+var WithInitials = exports.WithInitials = {
+  args: {
+    name: "Francesca DiMattio",
+    initials: "FD",
+    maxWidth: 350
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "EntityHeader with initials displayed."
+      }
+    }
+  }
+};
+var SmallVariantWithImage = exports.SmallVariantWithImage = {
+  args: {
+    smallVariant: true,
+    name: "Francesca DiMattio",
+    image: imageProps,
+    maxWidth: 350
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Small variant EntityHeader with image."
+      }
+    }
+  }
+};
+var WithImage = exports.WithImage = {
+  args: {
+    name: "Francesca DiMattio",
+    image: imageProps,
+    maxWidth: 350
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "EntityHeader with image."
+      }
+    }
+  }
+};
+var WithMetaAndHref = exports.WithMetaAndHref = {
+  args: {
+    initials: "FD",
+    name: "Francesca DiMattio",
+    image: imageProps,
+    meta: "American, b. 1979",
+    href: "http://www.artsy.net/artist/francesca-dimattio",
+    maxWidth: 350
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "EntityHeader with metadata and link."
+      }
+    }
+  }
+};
+var SmallVariantWithButton = exports.SmallVariantWithButton = {
+  args: {
+    smallVariant: true,
+    name: "Francesca DiMattio",
+    image: imageProps,
+    FollowButton: /*#__PURE__*/_react.default.createElement(FollowButton, null),
+    maxWidth: 350
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Small variant EntityHeader with action button."
+      }
+    }
+  }
+};
+var Complete = exports.Complete = {
+  args: {
+    initials: "FD",
+    name: "Francesca DiMattio",
+    image: imageProps,
+    meta: "American, b. 1979",
+    href: "http://www.artsy.net/artist/francesca-dimattio",
+    FollowButton: /*#__PURE__*/_react.default.createElement(FollowButton, null),
+    maxWidth: 350
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Complete EntityHeader with all features."
+      }
+    }
+  }
+};
+var LongerName = exports.LongerName = {
+  args: {
+    initials: "FLD",
+    name: "Francesca Longer DiMattio",
+    image: imageProps,
+    meta: "American, b. Founded 1979",
+    href: "http://www.artsy.net/artist/francesca-dimattio",
+    FollowButton: /*#__PURE__*/_react.default.createElement(FollowButton, null),
+    maxWidth: 350
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "EntityHeader with longer name to test text wrapping."
+      }
+    }
+  }
+};
+var WithSingleLabel = exports.WithSingleLabel = {
+  args: {
+    initials: "FLD",
+    name: "Francesca Much Longer DiMattio",
+    image: imageProps,
+    meta: "American, b. Founded 1979",
+    href: "http://www.artsy.net/artist/francesca-dimattio",
+    FollowButton: /*#__PURE__*/_react.default.createElement(FollowButton, null),
+    labels: [{
+      children: "Black Owned"
+    }],
+    maxWidth: 350
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "EntityHeader with a single label."
+      }
+    }
+  }
+};
+var WithMultipleLabels = exports.WithMultipleLabels = {
+  args: {
+    initials: "FLD",
+    name: "Francesca Much Longer DiMattio",
+    image: imageProps,
+    meta: "American, b. Founded 1979",
+    href: "http://www.artsy.net/artist/francesca-dimattio",
+    FollowButton: /*#__PURE__*/_react.default.createElement(FollowButton, null),
+    labels: [{
+      children: "Black Owned"
     }, {
-      initials: "FLD",
-      name: "Francesca Much Longer DiMattio",
-      image: imageProps,
-      meta: "American, b. Founded 1979",
-      href: "http://www.artsy.net/artist/francesca-dimattio",
-      FollowButton: /*#__PURE__*/_react.default.createElement(FollowButton, null),
-      labels: [{
-        children: "Black Owned"
-      }, {
-        children: "Women Owned",
-        variant: "brand"
-      }]
-    }]
-  }, function (props) {
-    return /*#__PURE__*/_react.default.createElement(_EntityHeader.EntityHeader, _extends({}, props, {
-      maxWidth: 350
-    }));
-  });
+      children: "Women Owned",
+      variant: "brand"
+    }],
+    maxWidth: 350
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "EntityHeader with multiple labels in different variants."
+      }
+    }
+  }
 };
-Default.displayName = "Default";
 //# sourceMappingURL=EntityHeader.story.js.map