@artsy/palette 39.0.4 → 40.0.0-canary.1408.31249.0

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

@@ -1 +1 @@
-{"version":3,"file":"BaseTabs.story.js","names":["_addonActions","require","_react","_interopRequireDefault","_storybookStates","_BaseTabs","_Box","_Clickable","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","RouterLink","_ref","to","children","rest","createElement","href","displayName","_default","title","exports","_BaseTab","States","states","focus","hover","active","BaseTab","Default","fill","justifyContent","BaseTabs","AsA","as","story","name","AsClickable","Clickable","onClick","action","AsRouterLink","activeClassName","garbage","Overflowing","map","label","Fill","Box","m","my","BreakingOutOfContainerMargin","bg","mx","px","NestedChildren","Fragment"],"sources":["../../../src/elements/BaseTabs/BaseTabs.story.tsx"],"sourcesContent":["import { action } from \"@storybook/addon-actions\"\nimport React from \"react\"\nimport { States } from \"storybook-states\"\nimport { BaseTab, BaseTabs } from \"../BaseTabs\"\nimport { Box } from \"../Box\"\nimport { Clickable } from \"../Clickable\"\nimport { BaseTabProps } from \"./BaseTab\"\nimport { BaseTabsProps } from \"./BaseTabs\"\n\n// Fake `RouterLink`\nconst RouterLink: React.FC<{ to: string }> = ({ to, children, ...rest }) => {\n  return (\n    <a href={to} {...rest}>\n      {children}\n    </a>\n  )\n}\n\nexport default { title: \"Components/BaseTabs\" }\n\nexport const _BaseTab = () => {\n  return (\n    <States<BaseTabProps>\n      states={[{}, { focus: true }, { hover: true }, { active: true }]}\n    >\n      <BaseTab>Example</BaseTab>\n    </States>\n  )\n}\n\nexport const Default = () => {\n  return (\n    <States<Partial<BaseTabsProps>>\n      states={[{}, { fill: true }, { justifyContent: \"center\" }]}\n    >\n      <BaseTabs>\n        <BaseTab>First</BaseTab>\n        <BaseTab>Second</BaseTab>\n        <BaseTab active>Active</BaseTab>\n        <BaseTab>Last</BaseTab>\n      </BaseTabs>\n    </States>\n  )\n}\n\nexport const AsA = () => {\n  return (\n    <BaseTabs>\n      <BaseTab as=\"a\" href=\"#overview\">\n        Overview\n      </BaseTab>\n\n      <BaseTab as=\"a\" href=\"#cv\">\n        CV\n      </BaseTab>\n\n      <BaseTab as=\"a\" href=\"#shows\" active>\n        Shows\n      </BaseTab>\n\n      <BaseTab as=\"a\" href=\"#auction-results\">\n        Auction Results\n      </BaseTab>\n\n      <BaseTab as=\"a\" href=\"#articles\">\n        Articles\n      </BaseTab>\n\n      <BaseTab as=\"a\" href=\"#related-artists\">\n        Related Artists\n      </BaseTab>\n    </BaseTabs>\n  )\n}\n\nAsA.story = {\n  name: 'as=\"a\"',\n}\n\nexport const AsClickable = () => {\n  return (\n    <BaseTabs>\n      <BaseTab as={Clickable} onClick={action(\"onClick\")}>\n        Overview\n      </BaseTab>\n\n      <BaseTab as={Clickable} onClick={action(\"onClick\")}>\n        CV\n      </BaseTab>\n\n      <BaseTab as={Clickable} onClick={action(\"onClick\")} active>\n        Shows\n      </BaseTab>\n\n      <BaseTab as={Clickable} onClick={action(\"onClick\")}>\n        Auction Results\n      </BaseTab>\n\n      <BaseTab as={Clickable} onClick={action(\"onClick\")}>\n        Articles\n      </BaseTab>\n\n      <BaseTab as={Clickable} onClick={action(\"onClick\")}>\n        Related Artists\n      </BaseTab>\n    </BaseTabs>\n  )\n}\n\nAsClickable.story = {\n  name: \"as={Clickable}\",\n}\n\nexport const AsRouterLink = () => {\n  return (\n    <BaseTabs>\n      <BaseTab as={RouterLink} to=\"#example\" activeClassName=\"active\" garbage>\n        Example\n      </BaseTab>\n    </BaseTabs>\n  )\n}\n\nAsRouterLink.story = {\n  name: \"as={RouterLink}\",\n}\n\nexport const Overflowing = () => {\n  return (\n    <BaseTabs>\n      {[\n        \"Artworks (580656)\",\n        \"Artists (8)\",\n        \"Collections (7)\",\n        \"Artist Series (13)\",\n        \"Galleries (4)\",\n        \"Shows (3667)\",\n        \"Categories (21)\",\n        \"Articles (656)\",\n        \"Auctions (23)\",\n        \"More (46)\",\n      ].map((label, i) => {\n        return (\n          <BaseTab key={label} active={i === 1}>\n            {label}\n          </BaseTab>\n        )\n      })}\n    </BaseTabs>\n  )\n}\n\nexport const Fill = () => {\n  return (\n    <Box m={3}>\n      <BaseTabs fill my={3}>\n        <BaseTab as=\"a\" href=\"#\">\n          One\n        </BaseTab>\n      </BaseTabs>\n\n      <BaseTabs fill my={3}>\n        <BaseTab as=\"a\" href=\"#\">\n          One\n        </BaseTab>\n\n        <BaseTab as=\"a\" href=\"#\" active>\n          Two\n        </BaseTab>\n      </BaseTabs>\n\n      <BaseTabs fill my={3}>\n        <BaseTab as=\"a\" href=\"#\">\n          One\n        </BaseTab>\n\n        <BaseTab as=\"a\" href=\"#\" active>\n          Two\n        </BaseTab>\n\n        <BaseTab as=\"a\" href=\"#\">\n          Three\n        </BaseTab>\n      </BaseTabs>\n    </Box>\n  )\n}\n\nexport const BreakingOutOfContainerMargin = () => {\n  return (\n    <Box m={6} bg=\"black10\">\n      <BaseTabs mx={-6} px={6}>\n        <BaseTab active>\n          Rail border should extend past black10 background\n        </BaseTab>\n      </BaseTabs>\n    </Box>\n  )\n}\n\nBreakingOutOfContainerMargin.story = {\n  name: \"Breaking out of container margin\",\n}\n\nexport const NestedChildren = () => {\n  return (\n    <BaseTabs>\n      <>\n        <BaseTab>First</BaseTab>\n        <BaseTab>Second</BaseTab>\n        <>\n          <BaseTab active>Active</BaseTab>\n          <BaseTab>Last</BaseTab>\n        </>\n      </>\n    </BaseTabs>\n  )\n}\n\nNestedChildren.story = {\n  name: \"nested children\",\n}\n"],"mappings":"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"}
+{"version":3,"file":"BaseTabs.story.js","names":["_addonActions","require","_react","_interopRequireDefault","_storybookStates","_BaseTabs","_Box","_Clickable","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","RouterLink","_ref","to","children","rest","createElement","href","displayName","_default","title","exports","_BaseTab","States","states","focus","hover","active","BaseTab","Default","fill","justifyContent","BaseTabs","AsA","as","story","name","AsClickable","Clickable","onClick","action","AsRouterLink","activeClassName","garbage","Overflowing","map","label","Fill","Box","m","my","BreakingOutOfContainerMargin","bg","mx","px","NestedChildren","Fragment"],"sources":["../../../src/elements/BaseTabs/BaseTabs.story.tsx"],"sourcesContent":["import { action } from \"@storybook/addon-actions\"\nimport React from \"react\"\nimport { States } from \"storybook-states\"\nimport { BaseTab, BaseTabs } from \"../BaseTabs\"\nimport { Box } from \"../Box\"\nimport { Clickable } from \"../Clickable\"\nimport { BaseTabProps } from \"./BaseTab\"\nimport { BaseTabsProps } from \"./BaseTabs\"\n\n// Fake `RouterLink`\nconst RouterLink: React.FC<React.PropsWithChildren<{ to: string }>> = ({ to, children, ...rest }) => {\n  return (\n    <a href={to} {...rest}>\n      {children}\n    </a>\n  )\n}\n\nexport default { title: \"Components/BaseTabs\" }\n\nexport const _BaseTab = () => {\n  return (\n    <States<BaseTabProps>\n      states={[{}, { focus: true }, { hover: true }, { active: true }]}\n    >\n      <BaseTab>Example</BaseTab>\n    </States>\n  )\n}\n\nexport const Default = () => {\n  return (\n    <States<Partial<BaseTabsProps>>\n      states={[{}, { fill: true }, { justifyContent: \"center\" }]}\n    >\n      <BaseTabs>\n        <BaseTab>First</BaseTab>\n        <BaseTab>Second</BaseTab>\n        <BaseTab active>Active</BaseTab>\n        <BaseTab>Last</BaseTab>\n      </BaseTabs>\n    </States>\n  )\n}\n\nexport const AsA = () => {\n  return (\n    <BaseTabs>\n      <BaseTab as=\"a\" href=\"#overview\">\n        Overview\n      </BaseTab>\n\n      <BaseTab as=\"a\" href=\"#cv\">\n        CV\n      </BaseTab>\n\n      <BaseTab as=\"a\" href=\"#shows\" active>\n        Shows\n      </BaseTab>\n\n      <BaseTab as=\"a\" href=\"#auction-results\">\n        Auction Results\n      </BaseTab>\n\n      <BaseTab as=\"a\" href=\"#articles\">\n        Articles\n      </BaseTab>\n\n      <BaseTab as=\"a\" href=\"#related-artists\">\n        Related Artists\n      </BaseTab>\n    </BaseTabs>\n  )\n}\n\nAsA.story = {\n  name: 'as=\"a\"',\n}\n\nexport const AsClickable = () => {\n  return (\n    <BaseTabs>\n      <BaseTab as={Clickable} onClick={action(\"onClick\")}>\n        Overview\n      </BaseTab>\n\n      <BaseTab as={Clickable} onClick={action(\"onClick\")}>\n        CV\n      </BaseTab>\n\n      <BaseTab as={Clickable} onClick={action(\"onClick\")} active>\n        Shows\n      </BaseTab>\n\n      <BaseTab as={Clickable} onClick={action(\"onClick\")}>\n        Auction Results\n      </BaseTab>\n\n      <BaseTab as={Clickable} onClick={action(\"onClick\")}>\n        Articles\n      </BaseTab>\n\n      <BaseTab as={Clickable} onClick={action(\"onClick\")}>\n        Related Artists\n      </BaseTab>\n    </BaseTabs>\n  )\n}\n\nAsClickable.story = {\n  name: \"as={Clickable}\",\n}\n\nexport const AsRouterLink = () => {\n  return (\n    <BaseTabs>\n      <BaseTab as={RouterLink} to=\"#example\" activeClassName=\"active\" garbage>\n        Example\n      </BaseTab>\n    </BaseTabs>\n  )\n}\n\nAsRouterLink.story = {\n  name: \"as={RouterLink}\",\n}\n\nexport const Overflowing = () => {\n  return (\n    <BaseTabs>\n      {[\n        \"Artworks (580656)\",\n        \"Artists (8)\",\n        \"Collections (7)\",\n        \"Artist Series (13)\",\n        \"Galleries (4)\",\n        \"Shows (3667)\",\n        \"Categories (21)\",\n        \"Articles (656)\",\n        \"Auctions (23)\",\n        \"More (46)\",\n      ].map((label, i) => {\n        return (\n          <BaseTab key={label} active={i === 1}>\n            {label}\n          </BaseTab>\n        )\n      })}\n    </BaseTabs>\n  )\n}\n\nexport const Fill = () => {\n  return (\n    <Box m={3}>\n      <BaseTabs fill my={3}>\n        <BaseTab as=\"a\" href=\"#\">\n          One\n        </BaseTab>\n      </BaseTabs>\n\n      <BaseTabs fill my={3}>\n        <BaseTab as=\"a\" href=\"#\">\n          One\n        </BaseTab>\n\n        <BaseTab as=\"a\" href=\"#\" active>\n          Two\n        </BaseTab>\n      </BaseTabs>\n\n      <BaseTabs fill my={3}>\n        <BaseTab as=\"a\" href=\"#\">\n          One\n        </BaseTab>\n\n        <BaseTab as=\"a\" href=\"#\" active>\n          Two\n        </BaseTab>\n\n        <BaseTab as=\"a\" href=\"#\">\n          Three\n        </BaseTab>\n      </BaseTabs>\n    </Box>\n  )\n}\n\nexport const BreakingOutOfContainerMargin = () => {\n  return (\n    <Box m={6} bg=\"black10\">\n      <BaseTabs mx={-6} px={6}>\n        <BaseTab active>\n          Rail border should extend past black10 background\n        </BaseTab>\n      </BaseTabs>\n    </Box>\n  )\n}\n\nBreakingOutOfContainerMargin.story = {\n  name: \"Breaking out of container margin\",\n}\n\nexport const NestedChildren = () => {\n  return (\n    <BaseTabs>\n      <>\n        <BaseTab>First</BaseTab>\n        <BaseTab>Second</BaseTab>\n        <>\n          <BaseTab active>Active</BaseTab>\n          <BaseTab>Last</BaseTab>\n        </>\n      </>\n    </BaseTabs>\n  )\n}\n\nNestedChildren.story = {\n  name: \"nested children\",\n}\n"],"mappings":"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"}

package/dist/elements/BorderBox/BorderBox.d.ts

@@ -6,6 +6,6 @@ export declare type BorderBoxProps = BoxProps;
  * @deprecated: Use `Box` along with props e.g. `border="1px solid" borderColor="black10" p={2}`,
  * as needed.
  */
-export declare const BorderBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof BoxProps> & BoxProps, keyof BoxProps | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+export declare const BorderBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof BoxProps> & BoxProps, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, never>> & string;

package/dist/elements/BorderBox/BorderBoxBase.d.ts

@@ -7,6 +7,6 @@ export interface BorderBoxProps extends FlexProps {
  * A `div` that has a common border and padding set by default
  * @deprecated: Use `Box`
  */
-export declare const BorderBoxBase: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("..").BoxProps> & import("..").BoxProps, keyof import("..").BoxProps | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+export declare const BorderBoxBase: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("..").BoxProps> & import("..").BoxProps, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, keyof import("..").BoxProps> & import("..").BoxProps, BorderBoxProps>> & string;

package/dist/elements/BorderedRadio/BorderedRadio.d.ts

@@ -2,4 +2,4 @@
 import { RadioProps } from "../Radio";
 export declare type BorderedRadioProps<T = any> = RadioProps<T>;
 /** A radio button with a border */
-export declare const BorderedRadio: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadioProps<unknown>, BorderedRadioProps<any>>> & string & Omit<(<T>({ children, disabled, hover, focus, error, label, selected, value, size, onSelect, ...rest }: RadioProps<T>) => JSX.Element), keyof import("react").Component<any, {}, any>>;
+export declare const BorderedRadio: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadioProps<unknown>, BorderedRadioProps<any>>> & string & Omit<(<T>({ children, disabled, hover, focus, error, label, selected, value, size, onSelect, ...rest }: RadioProps<T>) => import("react").JSX.Element), keyof import("react").Component<any, {}, any>>;

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

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

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

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

package/dist/elements/Breadcrumbs/Breadcrumbs.d.ts

@@ -8,4 +8,4 @@ export declare type BreadcrumbsProps = BoxProps;
  * a website or web application. Breadcrumbs are often placed horizontally
  * before a page's main content.
  */
-export declare const Breadcrumbs: React.FC<BreadcrumbsProps>;
+export declare const Breadcrumbs: React.FC<React.PropsWithChildren<BreadcrumbsProps>>;

package/dist/elements/Breadcrumbs/Breadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumbs.js","names":["_themeGet","require","_react","_interopRequireDefault","_styledComponents","_flattenChildren","_Box","_Flex","_Join","_Text","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Li","styled","Text","withConfig","displayName","componentId","themeGet","Breadcrumbs","_ref","children","rest","cells","flattenChildren","createElement","Box","as","Flex","Join","separator","size","color","mx","map","cell","React","cloneElement","exports"],"sources":["../../../src/elements/Breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport React from \"react\"\nimport styled from \"styled-components\"\nimport { flattenChildren } from \"../../helpers/flattenChildren\"\nimport { Box, BoxProps } from \"../Box\"\nimport { Flex } from \"../Flex\"\nimport { Join } from \"../Join\"\nimport { Text } from \"../Text\"\n\nconst Li = styled(Text)`\n  > a {\n    color: ${themeGet(\"colors.black60\")};\n    text-decoration: none;\n\n    &:hover {\n      color: ${themeGet(\"colors.blue100\")};\n      text-decoration: underline;\n    }\n  }\n\n  &:last-of-type {\n    > a {\n      color: ${themeGet(\"colors.black100\")};\n\n      &:hover {\n        color: ${themeGet(\"colors.black100\")};\n        text-decoration: none;\n      }\n    }\n  }\n`\n\n/** Breadcrumbs extends Box */\nexport type BreadcrumbsProps = BoxProps\n\n/**\n * A breadcrumb trail consists of a list of links to the parent pages of the\n * current page in hierarchical order. It helps users find their place within\n * a website or web application. Breadcrumbs are often placed horizontally\n * before a page's main content.\n */\nexport const Breadcrumbs: React.FC<BreadcrumbsProps> = ({\n  children,\n  ...rest\n}) => {\n  const cells = flattenChildren(children)\n\n  return (\n    <Box as=\"nav\" aria-label=\"Breadcrumb\" {...rest}>\n      <Flex as=\"ol\">\n        <Join\n          separator={\n            <Text as=\"span\" size=\"xs\" color=\"black60\" mx={1} aria-hidden=\"true\">\n              /\n            </Text>\n          }\n        >\n          {cells.map((cell: React.ReactElement<any>, i) => {\n            return (\n              <Li as=\"li\" size=\"xs\" key={i}>\n                {i === cells.length - 1\n                  ? React.cloneElement(cell, { \"aria-current\": \"page\" })\n                  : cell}\n              </Li>\n            )\n          })}\n        </Join>\n      </Flex>\n    </Box>\n  )\n}\n"],"mappings":";;;;;;AAAA,IAAAA,SAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,iBAAA,GAAAD,sBAAA,CAAAF,OAAA;AACA,IAAAI,gBAAA,GAAAJ,OAAA;AACA,IAAAK,IAAA,GAAAL,OAAA;AACA,IAAAM,KAAA,GAAAN,OAAA;AACA,IAAAO,KAAA,GAAAP,OAAA;AACA,IAAAQ,KAAA,GAAAR,OAAA;AAA8B,IAAAS,SAAA;AAAA,SAAAP,uBAAAQ,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAAA,SAAAQ,yBAAAN,MAAA,EAAAO,QAAA,QAAAP,MAAA,yBAAAJ,MAAA,GAAAY,6BAAA,CAAAR,MAAA,EAAAO,QAAA,OAAAN,GAAA,EAAAJ,CAAA,MAAAJ,MAAA,CAAAgB,qBAAA,QAAAC,gBAAA,GAAAjB,MAAA,CAAAgB,qBAAA,CAAAT,MAAA,QAAAH,CAAA,MAAAA,CAAA,GAAAa,gBAAA,CAAAX,MAAA,EAAAF,CAAA,MAAAI,GAAA,GAAAS,gBAAA,CAAAb,CAAA,OAAAU,QAAA,CAAAI,OAAA,CAAAV,GAAA,uBAAAR,MAAA,CAAAS,SAAA,CAAAU,oBAAA,CAAAR,IAAA,CAAAJ,MAAA,EAAAC,GAAA,aAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,cAAAL,MAAA;AAAA,SAAAY,8BAAAR,MAAA,EAAAO,QAAA,QAAAP,MAAA,yBAAAJ,MAAA,WAAAiB,UAAA,GAAApB,MAAA,CAAAqB,IAAA,CAAAd,MAAA,OAAAC,GAAA,EAAAJ,CAAA,OAAAA,CAAA,MAAAA,CAAA,GAAAgB,UAAA,CAAAd,MAAA,EAAAF,CAAA,MAAAI,GAAA,GAAAY,UAAA,CAAAhB,CAAA,OAAAU,QAAA,CAAAI,OAAA,CAAAV,GAAA,kBAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,YAAAL,MAAA;AAE9B,IAAMmB,EAAE,GAAG,IAAAC,yBAAM,EAACC,UAAI,CAAC,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,qKAEV,IAAAC,kBAAQ,EAAC,gBAAgB,CAAC,EAIxB,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAO1B,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,EAGzB,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,CAK3C;;AAED;;AAGA;AACA;AACA;AACA;AACA;AACA;AACO,IAAMC,WAAuC,GAAG,SAA1CA,WAAuCA,CAAAC,IAAA,EAG9C;EAAA,IAFJC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACLC,IAAI,GAAAnB,wBAAA,CAAAiB,IAAA,EAAAnC,SAAA;EAEP,IAAMsC,KAAK,GAAG,IAAAC,gCAAe,EAACH,QAAQ,CAAC;EAEvC,oBACE5C,MAAA,CAAAW,OAAA,CAAAqC,aAAA,CAAC5C,IAAA,CAAA6C,GAAG,EAAArC,QAAA;IAACsC,EAAE,EAAC,KAAK;IAAC,cAAW;EAAY,GAAKL,IAAI,gBAC5C7C,MAAA,CAAAW,OAAA,CAAAqC,aAAA,CAAC3C,KAAA,CAAA8C,IAAI;IAACD,EAAE,EAAC;EAAI,gBACXlD,MAAA,CAAAW,OAAA,CAAAqC,aAAA,CAAC1C,KAAA,CAAA8C,IAAI;IACHC,SAAS,eACPrD,MAAA,CAAAW,OAAA,CAAAqC,aAAA,CAACzC,KAAA,CAAA8B,IAAI;MAACa,EAAE,EAAC,MAAM;MAACI,IAAI,EAAC,IAAI;MAACC,KAAK,EAAC,SAAS;MAACC,EAAE,EAAE,CAAE;MAAC,eAAY;IAAM,GAAC,GAEpE;EACD,GAEAV,KAAK,CAACW,GAAG,CAAC,UAACC,IAA6B,EAAEzC,CAAC,EAAK;IAC/C,oBACEjB,MAAA,CAAAW,OAAA,CAAAqC,aAAA,CAACb,EAAE;MAACe,EAAE,EAAC,IAAI;MAACI,IAAI,EAAC,IAAI;MAACjC,GAAG,EAAEJ;IAAE,GAC1BA,CAAC,KAAK6B,KAAK,CAAC3B,MAAM,GAAG,CAAC,gBACnBwC,cAAK,CAACC,YAAY,CAACF,IAAI,EAAE;MAAE,cAAc,EAAE;IAAO,CAAC,CAAC,GACpDA,IAAI,CACL;EAET,CAAC,CAAC,CACG,CACF,CACH;AAEV,CAAC;AAAAG,OAAA,CAAAnB,WAAA,GAAAA,WAAA;AA7BYA,WAAuC,CAAAH,WAAA"}
+{"version":3,"file":"Breadcrumbs.js","names":["_themeGet","require","_react","_interopRequireDefault","_styledComponents","_flattenChildren","_Box","_Flex","_Join","_Text","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Li","styled","Text","withConfig","displayName","componentId","themeGet","Breadcrumbs","_ref","children","rest","cells","flattenChildren","createElement","Box","as","Flex","Join","separator","size","color","mx","map","cell","React","cloneElement","exports"],"sources":["../../../src/elements/Breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport React from \"react\"\nimport styled from \"styled-components\"\nimport { flattenChildren } from \"../../helpers/flattenChildren\"\nimport { Box, BoxProps } from \"../Box\"\nimport { Flex } from \"../Flex\"\nimport { Join } from \"../Join\"\nimport { Text } from \"../Text\"\n\nconst Li = styled(Text)`\n  > a {\n    color: ${themeGet(\"colors.black60\")};\n    text-decoration: none;\n\n    &:hover {\n      color: ${themeGet(\"colors.blue100\")};\n      text-decoration: underline;\n    }\n  }\n\n  &:last-of-type {\n    > a {\n      color: ${themeGet(\"colors.black100\")};\n\n      &:hover {\n        color: ${themeGet(\"colors.black100\")};\n        text-decoration: none;\n      }\n    }\n  }\n`\n\n/** Breadcrumbs extends Box */\nexport type BreadcrumbsProps = BoxProps\n\n/**\n * A breadcrumb trail consists of a list of links to the parent pages of the\n * current page in hierarchical order. It helps users find their place within\n * a website or web application. Breadcrumbs are often placed horizontally\n * before a page's main content.\n */\nexport const Breadcrumbs: React.FC<React.PropsWithChildren<BreadcrumbsProps>> = ({\n  children,\n  ...rest\n}) => {\n  const cells = flattenChildren(children)\n\n  return (\n    <Box as=\"nav\" aria-label=\"Breadcrumb\" {...rest}>\n      <Flex as=\"ol\">\n        <Join\n          separator={\n            <Text as=\"span\" size=\"xs\" color=\"black60\" mx={1} aria-hidden=\"true\">\n              /\n            </Text>\n          }\n        >\n          {cells.map((cell: React.ReactElement<any>, i) => {\n            return (\n              <Li as=\"li\" size=\"xs\" key={i}>\n                {i === cells.length - 1\n                  ? React.cloneElement(cell, { \"aria-current\": \"page\" })\n                  : cell}\n              </Li>\n            )\n          })}\n        </Join>\n      </Flex>\n    </Box>\n  )\n}\n"],"mappings":"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"}

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

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

package/dist/elements/Button/Button.d.ts

@@ -27,11 +27,9 @@ export interface ButtonProps extends BoxProps, React.ButtonHTMLAttributes<HTMLBu
     /** Forces success state */
     success?: boolean;
     /** Optional icon slot */
-    Icon?: React.FunctionComponent<BoxProps & {
+    Icon?: React.FunctionComponent<React.PropsWithChildren<BoxProps & {
         fill?: ResponsiveValue<string>;
-    }>;
+    }>>;
 }
-export declare const Button: React.ForwardRefExoticComponent<ButtonProps & {
-    ref?: React.Ref<HTMLElement>;
-}>;
+export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLElement>>;
 export declare const buttonMixin: import("styled-components").RuleSet<object>;

package/dist/elements/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","names":["_composeReactRefs","_interopRequireDefault","require","_react","_interopRequireWildcard","_styledComponents","_styledSystem","_CheckmarkIcon","_themes","_Box","_Spinner","_Text","_tokens","_excluded","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Button","React","forwardRef","_ref","forwardedRef","children","loading","success","_ref$size","size","onClick","_ref$alignItems","alignItems","_ref$justifyContent","justifyContent","Icon","rest","ref","useRef","handleClick","event","useEffect","current","_ref$current","blur","createElement","Container","composeRefs","$loading","tabIndex","display","Spinner","color","Text","lineHeight","variant","getTextVariant","opacity","width","fill","mr","ml","exports","displayName","defaultProps","buttonMixin","css","styled","button","withConfig","componentId","prop","variants","BUTTON_SIZES","props","hover","BUTTON_VARIANTS","active","focus","disabled","THEME","mediaQueries","boxMixin","BUTTON_TEXT_SIZES","Array","isArray","map","s","large"],"sources":["../../../src/elements/Button/Button.tsx"],"sourcesContent":["import composeRefs from \"@seznam/compose-react-refs\"\nimport React, { useEffect, useRef } from \"react\"\nimport styled, { css } from \"styled-components\"\nimport { ResponsiveValue, variant } from \"styled-system\"\nimport CheckmarkIcon from \"@artsy/icons/CheckmarkIcon\"\nimport { TextVariant } from \"@artsy/palette-tokens/dist/typography/v3\"\nimport { THEME } from \"../../themes\"\nimport { boxMixin, BoxProps } from \"../Box\"\nimport { Spinner } from \"../Spinner\"\nimport { Text, TextProps } from \"../Text\"\nimport { BUTTON_SIZES, BUTTON_TEXT_SIZES, BUTTON_VARIANTS } from \"./tokens\"\nimport { ButtonSize, ButtonVariant } from \"./types\"\n\nexport interface ButtonProps\n  extends BoxProps,\n    React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /**\n   * @description\n   * The theme of the button. It's possible to pass an array that\n   * behaves accordingly to the media breakpoints [\"sm\", \"md\", \"lg\", \"xl\"]\n   * @example\n   * \"primaryBlack\"\n   * \"primaryWhite\"\n   * [\"primaryGray\", \"secondaryBlack\"]\n   * @see {@link ButtonVariant}\n   */\n  variant?: ResponsiveValue<ButtonVariant>\n  /** Size of the button */\n  size?: ResponsiveValue<ButtonSize>\n  /** Displays a loader in the button */\n  loading?: boolean\n  /** Forces hover state */\n  hover?: boolean\n  /** Forces focus state */\n  focus?: boolean\n  /** Forces active state */\n  active?: boolean\n  /** Forces success state */\n  success?: boolean\n  /** Optional icon slot */\n  Icon?: React.FunctionComponent<BoxProps & { fill?: ResponsiveValue<string> }>\n}\n\nexport const Button: React.ForwardRefExoticComponent<\n  ButtonProps & { ref?: React.Ref<HTMLElement> }\n> = React.forwardRef(\n  (\n    {\n      children,\n      loading,\n      success,\n      size = \"large\",\n      onClick,\n      alignItems = \"center\",\n      justifyContent = \"center\",\n      Icon,\n      ...rest\n    },\n    forwardedRef\n  ) => {\n    const ref = useRef<HTMLButtonElement | null>(null)\n\n    const handleClick = (\n      event: React.MouseEvent<HTMLButtonElement, MouseEvent>\n    ) => {\n      if (!loading && onClick) {\n        onClick(event)\n      }\n    }\n\n    useEffect(() => {\n      if (loading && ref.current !== null) {\n        ref.current?.blur()\n      }\n    }, [loading])\n\n    return (\n      <Container\n        ref={composeRefs(ref, forwardedRef) as any}\n        onClick={handleClick}\n        size={size}\n        $loading={loading}\n        success={success}\n        tabIndex={loading ? -1 : 0}\n        display=\"inline-flex\"\n        alignItems={alignItems}\n        justifyContent={justifyContent}\n        {...rest}\n      >\n        {loading && <Spinner size={size} color=\"currentColor\" />}\n\n        <Text\n          lineHeight={1}\n          variant={getTextVariant(size)}\n          opacity={loading ? 0 : 1}\n          display=\"flex\"\n          alignItems={alignItems}\n          justifyContent={justifyContent}\n          width=\"100%\"\n        >\n          {!success && Icon && (\n            <Icon fill=\"currentColor\" mr={0.5} ml={-0.5} aria-hidden=\"true\" />\n          )}\n\n          {success && (\n            <CheckmarkIcon\n              fill=\"currentColor\"\n              mr={0.5}\n              ml={-0.5}\n              aria-hidden=\"true\"\n            />\n          )}\n\n          {children}\n        </Text>\n      </Container>\n    )\n  }\n)\n\nButton.displayName = \"Button\"\n\nButton.defaultProps = {\n  size: \"large\",\n  variant: \"primaryBlack\",\n}\n\ntype ContainerProps = Pick<\n  ButtonProps,\n  \"active\" | \"disabled\" | \"focus\" | \"hover\" | \"size\" | \"success\"\n> & {\n  $loading?: boolean\n}\n\nexport const buttonMixin = css`\n  cursor: pointer;\n  position: relative;\n  white-space: nowrap;\n  font-weight: normal;\n  text-align: center;\n  border: 1px solid;\n  text-decoration: none;\n  transition: color 0.25s ease, border-color 0.25s ease,\n    background-color 0.25s ease, box-shadow 0.25s ease;\n`\n\nconst Container = styled.button<ContainerProps & ButtonProps>`\n  ${buttonMixin};\n\n  /* Handle sizing */\n  ${variant({ prop: \"size\", variants: BUTTON_SIZES })}\n\n  ${(props) => {\n    // Handle props driven states\n    if (props.hover) {\n      return variant({ variants: BUTTON_VARIANTS.hover })\n    }\n\n    if (props.active) {\n      return variant({ variants: BUTTON_VARIANTS.active })\n    }\n\n    if (props.success) {\n      return variant({ variants: BUTTON_VARIANTS.success })\n    }\n\n    if (props.focus) {\n      return css`\n        outline: 0;\n        ${variant({ variants: BUTTON_VARIANTS.focus })}\n      `\n    }\n\n    if (props.$loading) {\n      return css`\n        cursor: auto;\n        transition: none;\n        pointer-events: none;\n        ${variant({ variants: BUTTON_VARIANTS.loading })}\n      `\n    }\n\n    if (props.disabled) {\n      return css`\n        pointer-events: none;\n        ${variant({ variants: BUTTON_VARIANTS.disabled })}\n      `\n    }\n\n    return variant({ variants: BUTTON_VARIANTS.default })\n  }}\n\n  ${() => {\n    // Handle pseudo classes\n    return css`\n      @media ${THEME.mediaQueries.hover} {\n        &:hover {\n          ${variant({ variants: BUTTON_VARIANTS.hover })}\n        }\n      }\n\n      &:focus {\n        outline: 0;\n        ${variant({ variants: BUTTON_VARIANTS.focus })}\n      }\n\n      &:active {\n        ${variant({ variants: BUTTON_VARIANTS.active })}\n      }\n\n      &:disabled {\n        pointer-events: none;\n        ${variant({ variants: BUTTON_VARIANTS.disabled })}\n      }\n    `\n  }};\n\n  ${boxMixin};\n`\n\nconst getTextVariant = (\n  size: ResponsiveValue<ButtonSize>\n): TextProps[\"variant\"] => {\n  if (typeof size === \"string\") {\n    return BUTTON_TEXT_SIZES[size]\n  }\n\n  if (Array.isArray(size)) {\n    return size.map((s) => BUTTON_TEXT_SIZES[s!] as TextVariant)\n  }\n\n  return BUTTON_TEXT_SIZES.large\n}\n"],"mappings":"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"}
+{"version":3,"file":"Button.js","names":["_composeReactRefs","_interopRequireDefault","require","_react","_interopRequireWildcard","_styledComponents","_styledSystem","_CheckmarkIcon","_themes","_Box","_Spinner","_Text","_tokens","_excluded","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Button","React","forwardRef","_ref","forwardedRef","children","loading","success","_ref$size","size","onClick","_ref$alignItems","alignItems","_ref$justifyContent","justifyContent","Icon","rest","ref","useRef","handleClick","event","useEffect","current","_ref$current","blur","createElement","Container","composeRefs","$loading","tabIndex","display","Spinner","color","Text","lineHeight","variant","getTextVariant","opacity","width","fill","mr","ml","exports","displayName","defaultProps","buttonMixin","css","styled","button","withConfig","componentId","prop","variants","BUTTON_SIZES","props","hover","BUTTON_VARIANTS","active","focus","disabled","THEME","mediaQueries","boxMixin","BUTTON_TEXT_SIZES","Array","isArray","map","s","large"],"sources":["../../../src/elements/Button/Button.tsx"],"sourcesContent":["import composeRefs from \"@seznam/compose-react-refs\"\nimport React, { useEffect, useRef } from \"react\"\nimport styled, { css } from \"styled-components\"\nimport { ResponsiveValue, variant } from \"styled-system\"\nimport CheckmarkIcon from \"@artsy/icons/CheckmarkIcon\"\nimport { TextVariant } from \"@artsy/palette-tokens/dist/typography/v3\"\nimport { THEME } from \"../../themes\"\nimport { boxMixin, BoxProps } from \"../Box\"\nimport { Spinner } from \"../Spinner\"\nimport { Text, TextProps } from \"../Text\"\nimport { BUTTON_SIZES, BUTTON_TEXT_SIZES, BUTTON_VARIANTS } from \"./tokens\"\nimport { ButtonSize, ButtonVariant } from \"./types\"\n\nexport interface ButtonProps\n  extends BoxProps,\n    React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /**\n   * @description\n   * The theme of the button. It's possible to pass an array that\n   * behaves accordingly to the media breakpoints [\"sm\", \"md\", \"lg\", \"xl\"]\n   * @example\n   * \"primaryBlack\"\n   * \"primaryWhite\"\n   * [\"primaryGray\", \"secondaryBlack\"]\n   * @see {@link ButtonVariant}\n   */\n  variant?: ResponsiveValue<ButtonVariant>\n  /** Size of the button */\n  size?: ResponsiveValue<ButtonSize>\n  /** Displays a loader in the button */\n  loading?: boolean\n  /** Forces hover state */\n  hover?: boolean\n  /** Forces focus state */\n  focus?: boolean\n  /** Forces active state */\n  active?: boolean\n  /** Forces success state */\n  success?: boolean\n  /** Optional icon slot */\n  Icon?: React.FunctionComponent<\n    React.PropsWithChildren<BoxProps & { fill?: ResponsiveValue<string> }>\n  >\n}\n\nexport const Button = React.forwardRef<HTMLElement, ButtonProps>(\n  (\n    {\n      children,\n      loading,\n      success,\n      size = \"large\",\n      onClick,\n      alignItems = \"center\",\n      justifyContent = \"center\",\n      Icon,\n      ...rest\n    },\n    forwardedRef\n  ) => {\n    const ref = useRef<HTMLButtonElement | null>(null)\n\n    const handleClick = (\n      event: React.MouseEvent<HTMLButtonElement, MouseEvent>\n    ) => {\n      if (!loading && onClick) {\n        onClick(event)\n      }\n    }\n\n    useEffect(() => {\n      if (loading && ref.current !== null) {\n        ref.current?.blur()\n      }\n    }, [loading])\n\n    return (\n      <Container\n        ref={composeRefs(ref, forwardedRef) as any}\n        onClick={handleClick}\n        size={size}\n        $loading={loading}\n        success={success}\n        tabIndex={loading ? -1 : 0}\n        display=\"inline-flex\"\n        alignItems={alignItems}\n        justifyContent={justifyContent}\n        {...rest}\n      >\n        {loading && <Spinner size={size} color=\"currentColor\" />}\n\n        <Text\n          lineHeight={1}\n          variant={getTextVariant(size)}\n          opacity={loading ? 0 : 1}\n          display=\"flex\"\n          alignItems={alignItems}\n          justifyContent={justifyContent}\n          width=\"100%\"\n        >\n          {!success && Icon && (\n            <Icon fill=\"currentColor\" mr={0.5} ml={-0.5} aria-hidden=\"true\" />\n          )}\n\n          {success && (\n            <CheckmarkIcon\n              fill=\"currentColor\"\n              mr={0.5}\n              ml={-0.5}\n              aria-hidden=\"true\"\n            />\n          )}\n\n          {children}\n        </Text>\n      </Container>\n    )\n  }\n)\n\nButton.displayName = \"Button\"\n\nButton.defaultProps = {\n  size: \"large\",\n  variant: \"primaryBlack\",\n}\n\ntype ContainerProps = Pick<\n  ButtonProps,\n  \"active\" | \"disabled\" | \"focus\" | \"hover\" | \"size\" | \"success\"\n> & {\n  $loading?: boolean\n}\n\nexport const buttonMixin = css`\n  cursor: pointer;\n  position: relative;\n  white-space: nowrap;\n  font-weight: normal;\n  text-align: center;\n  border: 1px solid;\n  text-decoration: none;\n  transition: color 0.25s ease, border-color 0.25s ease,\n    background-color 0.25s ease, box-shadow 0.25s ease;\n`\n\nconst Container = styled.button<ContainerProps & ButtonProps>`\n  ${buttonMixin};\n\n  /* Handle sizing */\n  ${variant({ prop: \"size\", variants: BUTTON_SIZES })}\n\n  ${(props) => {\n    // Handle props driven states\n    if (props.hover) {\n      return variant({ variants: BUTTON_VARIANTS.hover })\n    }\n\n    if (props.active) {\n      return variant({ variants: BUTTON_VARIANTS.active })\n    }\n\n    if (props.success) {\n      return variant({ variants: BUTTON_VARIANTS.success })\n    }\n\n    if (props.focus) {\n      return css`\n        outline: 0;\n        ${variant({ variants: BUTTON_VARIANTS.focus })}\n      `\n    }\n\n    if (props.$loading) {\n      return css`\n        cursor: auto;\n        transition: none;\n        pointer-events: none;\n        ${variant({ variants: BUTTON_VARIANTS.loading })}\n      `\n    }\n\n    if (props.disabled) {\n      return css`\n        pointer-events: none;\n        ${variant({ variants: BUTTON_VARIANTS.disabled })}\n      `\n    }\n\n    return variant({ variants: BUTTON_VARIANTS.default })\n  }}\n\n  ${() => {\n    // Handle pseudo classes\n    return css`\n      @media ${THEME.mediaQueries.hover} {\n        &:hover {\n          ${variant({ variants: BUTTON_VARIANTS.hover })}\n        }\n      }\n\n      &:focus {\n        outline: 0;\n        ${variant({ variants: BUTTON_VARIANTS.focus })}\n      }\n\n      &:active {\n        ${variant({ variants: BUTTON_VARIANTS.active })}\n      }\n\n      &:disabled {\n        pointer-events: none;\n        ${variant({ variants: BUTTON_VARIANTS.disabled })}\n      }\n    `\n  }};\n\n  ${boxMixin};\n`\n\nconst getTextVariant = (\n  size: ResponsiveValue<ButtonSize>\n): TextProps[\"variant\"] => {\n  if (typeof size === \"string\") {\n    return BUTTON_TEXT_SIZES[size]\n  }\n\n  if (Array.isArray(size)) {\n    return size.map((s) => BUTTON_TEXT_SIZES[s!] as TextVariant)\n  }\n\n  return BUTTON_TEXT_SIZES.large\n}\n"],"mappings":"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"}

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

@@ -1,28 +1,29 @@
+import React from "react";
 declare const _default: {
     title: string;
 };
 export default _default;
 export declare const _States: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         name: string;
     };
 };
-export declare const Sizes: () => JSX.Element;
-export declare const Variants: () => JSX.Element;
+export declare const Sizes: () => React.JSX.Element;
+export declare const Variants: () => React.JSX.Element;
 export declare const NativeButtonProps: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithBoxProps: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         name: string;
     };
 };
-export declare const Loading: () => JSX.Element;
-export declare const As: () => JSX.Element;
-export declare const WithIcon: () => JSX.Element;
-export declare const ResponsiveSize: () => JSX.Element;
+export declare const Loading: () => React.JSX.Element;
+export declare const As: () => React.JSX.Element;
+export declare const WithIcon: () => React.JSX.Element;
+export declare const ResponsiveSize: () => React.JSX.Element;

package/dist/elements/CSSGrid/CSSGrid.d.ts

@@ -9,6 +9,6 @@ export interface CSSGridProps extends GridProps, BoxProps {
 /**
  * A utility component that encapsulates CSS grid behavior
  */
-export declare const CSSGrid: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof BoxProps> & BoxProps, keyof BoxProps | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+export declare const CSSGrid: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof BoxProps> & BoxProps, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, CSSGridProps>> & string;

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

@@ -1,9 +1,10 @@
+import React from "react";
 declare const _default: {
     title: string;
 };
 export default _default;
 export declare const CssGridWithResponsiveProps: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         name: string;
         parameters: {

package/dist/elements/Cards/Card.d.ts

@@ -13,4 +13,4 @@ export interface CardProps extends BoxProps {
  * `Card` is a card with one image one tall image, and text for title
  * and subtitle at the bottom.
  */
-export declare const Card: React.FC<CardProps>;
+export declare const Card: React.FC<React.PropsWithChildren<CardProps>>;

package/dist/elements/Cards/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","names":["_react","_interopRequireDefault","require","_Image","_Box","_Text","_ResponsiveBox","_Theme","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Card","_ref","image","title","subtitle","status","_ref$maxWidth","maxWidth","_ref$aspectWidth","aspectWidth","_ref$aspectHeight","aspectHeight","rest","_useTheme","useTheme","theme","hasInfo","createElement","Box","ResponsiveBox","Image","alt","height","width","style","objectFit","src","position","bottom","left","background","effects","overlayGradient","p","textShadow","Text","variant","color","exports","displayName"],"sources":["../../../src/elements/Cards/Card.tsx"],"sourcesContent":["import React from \"react\"\nimport { Image, ImageProps } from \"../Image\"\nimport { Box, BoxProps } from \"../Box\"\nimport { Text } from \"../Text\"\nimport { ResponsiveBox } from \"../ResponsiveBox\"\nimport { useTheme } from \"../../Theme\"\n\nexport interface CardProps extends BoxProps {\n  image: string | ImageProps | null | undefined\n  title?: string | null\n  subtitle?: string | null\n  status?: string | null\n  aspectWidth?: number\n  aspectHeight?: number\n}\n\n/**\n * `Card` is a card with one image one tall image, and text for title\n * and subtitle at the bottom.\n */\nexport const Card: React.FC<CardProps> = ({\n  image,\n  title,\n  subtitle,\n  status,\n  maxWidth = 280,\n  aspectWidth = 280,\n  aspectHeight = 370,\n  ...rest\n}) => {\n  const { theme } = useTheme()\n\n  const hasInfo = title || subtitle || status\n\n  return (\n    <Box maxWidth={maxWidth} {...rest}>\n      <ResponsiveBox\n        aspectWidth={aspectWidth}\n        aspectHeight={aspectHeight}\n        maxWidth=\"100%\"\n      >\n        <Image\n          alt=\"\"\n          height=\"100%\"\n          width=\"100%\"\n          style={{ objectFit: \"cover\" }}\n          {...(typeof image === \"string\" ? { src: image } : image)}\n        />\n\n        {hasInfo && (\n          <Box\n            position=\"absolute\"\n            width=\"100%\"\n            height=\"50%\"\n            bottom={0}\n            left={0}\n            background={theme.effects.overlayGradient}\n          />\n        )}\n\n        <Box\n          position=\"absolute\"\n          bottom={0}\n          left={0}\n          width=\"100%\"\n          p={2}\n          style={{ textShadow: theme.effects.textShadow }}\n        >\n          {status && (\n            <Text variant=\"xs\" color=\"white100\">\n              {status}\n            </Text>\n          )}\n\n          {title && (\n            <Text variant=\"sm-display\" color=\"white100\">\n              {title}\n            </Text>\n          )}\n\n          {subtitle && (\n            <Text variant=\"sm-display\" color=\"black15\">\n              {subtitle}\n            </Text>\n          )}\n        </Box>\n      </ResponsiveBox>\n    </Box>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"Card.js","names":["_react","_interopRequireDefault","require","_Image","_Box","_Text","_ResponsiveBox","_Theme","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Card","_ref","image","title","subtitle","status","_ref$maxWidth","maxWidth","_ref$aspectWidth","aspectWidth","_ref$aspectHeight","aspectHeight","rest","_useTheme","useTheme","theme","hasInfo","createElement","Box","ResponsiveBox","Image","alt","height","width","style","objectFit","src","position","bottom","left","background","effects","overlayGradient","p","textShadow","Text","variant","color","exports","displayName"],"sources":["../../../src/elements/Cards/Card.tsx"],"sourcesContent":["import React from \"react\"\nimport { Image, ImageProps } from \"../Image\"\nimport { Box, BoxProps } from \"../Box\"\nimport { Text } from \"../Text\"\nimport { ResponsiveBox } from \"../ResponsiveBox\"\nimport { useTheme } from \"../../Theme\"\n\nexport interface CardProps extends BoxProps {\n  image: string | ImageProps | null | undefined\n  title?: string | null\n  subtitle?: string | null\n  status?: string | null\n  aspectWidth?: number\n  aspectHeight?: number\n}\n\n/**\n * `Card` is a card with one image one tall image, and text for title\n * and subtitle at the bottom.\n */\nexport const Card: React.FC<React.PropsWithChildren<CardProps>> = ({\n  image,\n  title,\n  subtitle,\n  status,\n  maxWidth = 280,\n  aspectWidth = 280,\n  aspectHeight = 370,\n  ...rest\n}) => {\n  const { theme } = useTheme()\n\n  const hasInfo = title || subtitle || status\n\n  return (\n    <Box maxWidth={maxWidth} {...rest}>\n      <ResponsiveBox\n        aspectWidth={aspectWidth}\n        aspectHeight={aspectHeight}\n        maxWidth=\"100%\"\n      >\n        <Image\n          alt=\"\"\n          height=\"100%\"\n          width=\"100%\"\n          style={{ objectFit: \"cover\" }}\n          {...(typeof image === \"string\" ? { src: image } : image)}\n        />\n\n        {hasInfo && (\n          <Box\n            position=\"absolute\"\n            width=\"100%\"\n            height=\"50%\"\n            bottom={0}\n            left={0}\n            background={theme.effects.overlayGradient}\n          />\n        )}\n\n        <Box\n          position=\"absolute\"\n          bottom={0}\n          left={0}\n          width=\"100%\"\n          p={2}\n          style={{ textShadow: theme.effects.textShadow }}\n        >\n          {status && (\n            <Text variant=\"xs\" color=\"white100\">\n              {status}\n            </Text>\n          )}\n\n          {title && (\n            <Text variant=\"sm-display\" color=\"white100\">\n              {title}\n            </Text>\n          )}\n\n          {subtitle && (\n            <Text variant=\"sm-display\" color=\"black15\">\n              {subtitle}\n            </Text>\n          )}\n        </Box>\n      </ResponsiveBox>\n    </Box>\n  )\n}\n"],"mappings":"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"}

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

@@ -1,9 +1,10 @@
+import React from "react";
 declare const _default: {
     title: string;
 };
 export default _default;
 export declare const Single: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         parameters: {
             chromatic: {
@@ -13,7 +14,7 @@ export declare const Single: {
     };
 };
 export declare const Triptych: {
-    (): JSX.Element;
+    (): React.JSX.Element;
     story: {
         parameters: {
             chromatic: {

package/dist/elements/Cards/TriptychCard.d.ts

@@ -15,5 +15,5 @@ export declare const isArrayOfStrings: (images: Images) => images is string[];
  * one tall or two square images on the right, and text for title and subtitle
  * at the bottom.
  */
-export declare const TriptychCard: React.FC<TriptychCardProps>;
+export declare const TriptychCard: React.FC<React.PropsWithChildren<TriptychCardProps>>;
 export {};

package/dist/elements/Cards/TriptychCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"TriptychCard.js","names":["_react","_interopRequireDefault","require","_Image","_Box","_ResponsiveBox","_Flex","_Text","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","_toConsumableArray","arr","_arrayWithoutHoles","_iterableToArray","_unsupportedIterableToArray","_nonIterableSpread","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","iter","Symbol","iterator","isArray","len","arr2","isArrayOfStrings","images","every","src","exports","TriptychCard","_ref","title","subtitle","status","rest","imgs","map","createElement","Box","ResponsiveBox","aspectWidth","aspectHeight","maxWidth","mb","Flex","flexDirection","width","height","bg","borderRight","borderColor","Image","alt","style","objectFit","Fragment","flexShrink","borderLeft","borderBottom","borderTop","Text","variant","color","displayName"],"sources":["../../../src/elements/Cards/TriptychCard.tsx"],"sourcesContent":["import React from \"react\"\nimport { Image, ImageProps } from \"../Image\"\nimport { Box, BoxProps } from \"../Box\"\nimport { ResponsiveBox } from \"../ResponsiveBox\"\nimport { Flex } from \"../Flex\"\nimport { Text } from \"../Text\"\n\ntype Images = ImageProps[] | string[]\n\nexport interface TriptychCardProps extends BoxProps {\n  /** 1, 2, or 3 images */\n  images: Images\n  title?: string | null\n  subtitle?: string | null\n  status?: string | null\n}\n\nexport const isArrayOfStrings = (images: Images): images is string[] =>\n  [...images].every((src) => typeof src === \"string\")\n\n/**\n * `TriptychCard` is a card with a layout one square image on the left,\n * one tall or two square images on the right, and text for title and subtitle\n * at the bottom.\n */\n\nexport const TriptychCard: React.FC<TriptychCardProps> = ({\n  images,\n  title,\n  subtitle,\n  status,\n  ...rest\n}) => {\n  const imgs: ImageProps[] = (isArrayOfStrings(images)\n    ? images.map((src) => ({ src }))\n    : images\n  ).slice(0, 3)\n\n  return (\n    <Box {...rest}>\n      <ResponsiveBox aspectWidth={3} aspectHeight={2} maxWidth=\"100%\" mb={1}>\n        <Flex flexDirection=\"row\" width=\"100%\" height=\"100%\">\n          {(() => {\n            switch (imgs.length) {\n              case 1:\n                return (\n                  <ResponsiveBox\n                    aspectWidth={3}\n                    aspectHeight={2}\n                    maxWidth=\"100%\"\n                    bg=\"black10\"\n                    borderRight=\"1px solid\"\n                    borderColor=\"white100\"\n                  >\n                    <Image\n                      alt=\"\"\n                      height=\"100%\"\n                      width=\"100%\"\n                      style={{ objectFit: \"cover\" }}\n                      {...imgs[0]}\n                    />\n                  </ResponsiveBox>\n                )\n\n              case 2:\n                return (\n                  <>\n                    <ResponsiveBox\n                      aspectWidth={1}\n                      aspectHeight={1}\n                      maxWidth=\"100%\"\n                      bg=\"black10\"\n                      borderRight=\"1px solid\"\n                      borderColor=\"white100\"\n                    >\n                      <Image\n                        alt=\"\"\n                        height=\"100%\"\n                        width=\"100%\"\n                        style={{ objectFit: \"cover\" }}\n                        {...imgs[0]}\n                      />\n                    </ResponsiveBox>\n\n                    <Flex width=\"33.33%\" flexShrink={0}>\n                      <ResponsiveBox\n                        aspectWidth={1}\n                        aspectHeight={2}\n                        maxWidth=\"100%\"\n                        bg=\"black10\"\n                        borderLeft=\"1px solid\"\n                        borderColor=\"white100\"\n                      >\n                        <Image\n                          alt=\"\"\n                          height=\"100%\"\n                          width=\"100%\"\n                          style={{ objectFit: \"cover\" }}\n                          {...imgs[1]}\n                        />\n                      </ResponsiveBox>\n                    </Flex>\n                  </>\n                )\n              case 3:\n                return (\n                  <>\n                    <ResponsiveBox\n                      aspectWidth={1}\n                      aspectHeight={1}\n                      maxWidth=\"100%\"\n                      bg=\"black10\"\n                      borderRight=\"1px solid\"\n                      borderColor=\"white100\"\n                    >\n                      <Image\n                        alt=\"\"\n                        height=\"100%\"\n                        width=\"100%\"\n                        style={{ objectFit: \"cover\" }}\n                        {...imgs[0]}\n                      />\n                    </ResponsiveBox>\n\n                    <Flex width=\"33.33%\" flexShrink={0} flexDirection=\"column\">\n                      <ResponsiveBox\n                        aspectWidth={1}\n                        aspectHeight={1}\n                        maxWidth=\"100%\"\n                        bg=\"black10\"\n                        borderLeft=\"1px solid\"\n                        borderBottom=\"1px solid\"\n                        borderColor=\"white100\"\n                      >\n                        <Image\n                          alt=\"\"\n                          height=\"100%\"\n                          width=\"100%\"\n                          style={{ objectFit: \"cover\" }}\n                          {...imgs[1]}\n                        />\n                      </ResponsiveBox>\n\n                      <ResponsiveBox\n                        aspectWidth={1}\n                        aspectHeight={1}\n                        maxWidth=\"100%\"\n                        bg=\"black10\"\n                        borderLeft=\"1px solid\"\n                        borderTop=\"1px solid\"\n                        borderColor=\"white100\"\n                      >\n                        <Image\n                          alt=\"\"\n                          height=\"100%\"\n                          width=\"100%\"\n                          style={{ objectFit: \"cover\" }}\n                          {...imgs[2]}\n                        />\n                      </ResponsiveBox>\n                    </Flex>\n                  </>\n                )\n            }\n          })()}\n        </Flex>\n      </ResponsiveBox>\n\n      {status && <Text variant=\"xs\">{status}</Text>}\n\n      <Text variant=\"sm-display\">{title}</Text>\n\n      {subtitle && (\n        <Text variant=\"sm-display\" color=\"black60\">\n          {subtitle}\n        </Text>\n      )}\n    </Box>\n  )\n}\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,IAAA,GAAAF,OAAA;AACA,IAAAG,cAAA,GAAAH,OAAA;AACA,IAAAI,KAAA,GAAAJ,OAAA;AACA,IAAAK,KAAA,GAAAL,OAAA;AAA8B,IAAAM,SAAA;AAAA,SAAAP,uBAAAQ,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAAA,SAAAQ,yBAAAN,MAAA,EAAAO,QAAA,QAAAP,MAAA,yBAAAJ,MAAA,GAAAY,6BAAA,CAAAR,MAAA,EAAAO,QAAA,OAAAN,GAAA,EAAAJ,CAAA,MAAAJ,MAAA,CAAAgB,qBAAA,QAAAC,gBAAA,GAAAjB,MAAA,CAAAgB,qBAAA,CAAAT,MAAA,QAAAH,CAAA,MAAAA,CAAA,GAAAa,gBAAA,CAAAX,MAAA,EAAAF,CAAA,MAAAI,GAAA,GAAAS,gBAAA,CAAAb,CAAA,OAAAU,QAAA,CAAAI,OAAA,CAAAV,GAAA,uBAAAR,MAAA,CAAAS,SAAA,CAAAU,oBAAA,CAAAR,IAAA,CAAAJ,MAAA,EAAAC,GAAA,aAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,cAAAL,MAAA;AAAA,SAAAY,8BAAAR,MAAA,EAAAO,QAAA,QAAAP,MAAA,yBAAAJ,MAAA,WAAAiB,UAAA,GAAApB,MAAA,CAAAqB,IAAA,CAAAd,MAAA,OAAAC,GAAA,EAAAJ,CAAA,OAAAA,CAAA,MAAAA,CAAA,GAAAgB,UAAA,CAAAd,MAAA,EAAAF,CAAA,MAAAI,GAAA,GAAAY,UAAA,CAAAhB,CAAA,OAAAU,QAAA,CAAAI,OAAA,CAAAV,GAAA,kBAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,YAAAL,MAAA;AAAA,SAAAmB,mBAAAC,GAAA,WAAAC,kBAAA,CAAAD,GAAA,KAAAE,gBAAA,CAAAF,GAAA,KAAAG,2BAAA,CAAAH,GAAA,KAAAI,kBAAA;AAAA,SAAAA,mBAAA,cAAAC,SAAA;AAAA,SAAAF,4BAAAG,CAAA,EAAAC,MAAA,SAAAD,CAAA,qBAAAA,CAAA,sBAAAE,iBAAA,CAAAF,CAAA,EAAAC,MAAA,OAAAE,CAAA,GAAAhC,MAAA,CAAAS,SAAA,CAAAwB,QAAA,CAAAtB,IAAA,CAAAkB,CAAA,EAAAK,KAAA,aAAAF,CAAA,iBAAAH,CAAA,CAAAM,WAAA,EAAAH,CAAA,GAAAH,CAAA,CAAAM,WAAA,CAAAC,IAAA,MAAAJ,CAAA,cAAAA,CAAA,mBAAAK,KAAA,CAAAC,IAAA,CAAAT,CAAA,OAAAG,CAAA,+DAAAO,IAAA,CAAAP,CAAA,UAAAD,iBAAA,CAAAF,CAAA,EAAAC,MAAA;AAAA,SAAAL,iBAAAe,IAAA,eAAAC,MAAA,oBAAAD,IAAA,CAAAC,MAAA,CAAAC,QAAA,aAAAF,IAAA,+BAAAH,KAAA,CAAAC,IAAA,CAAAE,IAAA;AAAA,SAAAhB,mBAAAD,GAAA,QAAAc,KAAA,CAAAM,OAAA,CAAApB,GAAA,UAAAQ,iBAAA,CAAAR,GAAA;AAAA,SAAAQ,kBAAAR,GAAA,EAAAqB,GAAA,QAAAA,GAAA,YAAAA,GAAA,GAAArB,GAAA,CAAAjB,MAAA,EAAAsC,GAAA,GAAArB,GAAA,CAAAjB,MAAA,WAAAF,CAAA,MAAAyC,IAAA,OAAAR,KAAA,CAAAO,GAAA,GAAAxC,CAAA,GAAAwC,GAAA,EAAAxC,CAAA,MAAAyC,IAAA,CAAAzC,CAAA,IAAAmB,GAAA,CAAAnB,CAAA,YAAAyC,IAAA;AAYvB,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAIC,MAAc;EAAA,OAC7CzB,kBAAA,CAAIyB,MAAM,EAAEC,KAAK,CAAC,UAACC,GAAG;IAAA,OAAK,OAAOA,GAAG,KAAK,QAAQ;EAAA,EAAC;AAAA;;AAErD;AACA;AACA;AACA;AACA;AAJAC,OAAA,CAAAJ,gBAAA,GAAAA,gBAAA;AAMO,IAAMK,YAAyC,GAAG,SAA5CA,YAAyCA,CAAAC,IAAA,EAMhD;EAAA,IALJL,MAAM,GAAAK,IAAA,CAANL,MAAM;IACNM,KAAK,GAAAD,IAAA,CAALC,KAAK;IACLC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IACRC,MAAM,GAAAH,IAAA,CAANG,MAAM;IACHC,IAAI,GAAA3C,wBAAA,CAAAuC,IAAA,EAAAzD,SAAA;EAEP,IAAM8D,IAAkB,GAAG,CAACX,gBAAgB,CAACC,MAAM,CAAC,GAChDA,MAAM,CAACW,GAAG,CAAC,UAACT,GAAG;IAAA,OAAM;MAAEA,GAAG,EAAHA;IAAI,CAAC;EAAA,CAAC,CAAC,GAC9BF,MAAM,EACRb,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC;EAEb,oBACE/C,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACpE,IAAA,CAAAqE,GAAG,EAAKJ,IAAI,eACXrE,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACnE,cAAA,CAAAqE,aAAa;IAACC,WAAW,EAAE,CAAE;IAACC,YAAY,EAAE,CAAE;IAACC,QAAQ,EAAC,MAAM;IAACC,EAAE,EAAE;EAAE,gBACpE9E,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAAClE,KAAA,CAAAyE,IAAI;IAACC,aAAa,EAAC,KAAK;IAACC,KAAK,EAAC,MAAM;IAACC,MAAM,EAAC;EAAM,GAChD,YAAM;IACN,QAAQZ,IAAI,CAACnD,MAAM;MACjB,KAAK,CAAC;QACJ,oBACEnB,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACnE,cAAA,CAAAqE,aAAa;UACZC,WAAW,EAAE,CAAE;UACfC,YAAY,EAAE,CAAE;UAChBC,QAAQ,EAAC,MAAM;UACfM,EAAE,EAAC,SAAS;UACZC,WAAW,EAAC,WAAW;UACvBC,WAAW,EAAC;QAAU,gBAEtBrF,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACrE,MAAA,CAAAmF,KAAK,EAAA1E,QAAA;UACJ2E,GAAG,EAAC,EAAE;UACNL,MAAM,EAAC,MAAM;UACbD,KAAK,EAAC,MAAM;UACZO,KAAK,EAAE;YAAEC,SAAS,EAAE;UAAQ;QAAE,GAC1BnB,IAAI,CAAC,CAAC,CAAC,EACX,CACY;MAGpB,KAAK,CAAC;QACJ,oBACEtE,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAAAxE,MAAA,CAAAW,OAAA,CAAA+E,QAAA,qBACE1F,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACnE,cAAA,CAAAqE,aAAa;UACZC,WAAW,EAAE,CAAE;UACfC,YAAY,EAAE,CAAE;UAChBC,QAAQ,EAAC,MAAM;UACfM,EAAE,EAAC,SAAS;UACZC,WAAW,EAAC,WAAW;UACvBC,WAAW,EAAC;QAAU,gBAEtBrF,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACrE,MAAA,CAAAmF,KAAK,EAAA1E,QAAA;UACJ2E,GAAG,EAAC,EAAE;UACNL,MAAM,EAAC,MAAM;UACbD,KAAK,EAAC,MAAM;UACZO,KAAK,EAAE;YAAEC,SAAS,EAAE;UAAQ;QAAE,GAC1BnB,IAAI,CAAC,CAAC,CAAC,EACX,CACY,eAEhBtE,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAAClE,KAAA,CAAAyE,IAAI;UAACE,KAAK,EAAC,QAAQ;UAACU,UAAU,EAAE;QAAE,gBACjC3F,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACnE,cAAA,CAAAqE,aAAa;UACZC,WAAW,EAAE,CAAE;UACfC,YAAY,EAAE,CAAE;UAChBC,QAAQ,EAAC,MAAM;UACfM,EAAE,EAAC,SAAS;UACZS,UAAU,EAAC,WAAW;UACtBP,WAAW,EAAC;QAAU,gBAEtBrF,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACrE,MAAA,CAAAmF,KAAK,EAAA1E,QAAA;UACJ2E,GAAG,EAAC,EAAE;UACNL,MAAM,EAAC,MAAM;UACbD,KAAK,EAAC,MAAM;UACZO,KAAK,EAAE;YAAEC,SAAS,EAAE;UAAQ;QAAE,GAC1BnB,IAAI,CAAC,CAAC,CAAC,EACX,CACY,CACX,CACN;MAEP,KAAK,CAAC;QACJ,oBACEtE,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAAAxE,MAAA,CAAAW,OAAA,CAAA+E,QAAA,qBACE1F,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACnE,cAAA,CAAAqE,aAAa;UACZC,WAAW,EAAE,CAAE;UACfC,YAAY,EAAE,CAAE;UAChBC,QAAQ,EAAC,MAAM;UACfM,EAAE,EAAC,SAAS;UACZC,WAAW,EAAC,WAAW;UACvBC,WAAW,EAAC;QAAU,gBAEtBrF,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACrE,MAAA,CAAAmF,KAAK,EAAA1E,QAAA;UACJ2E,GAAG,EAAC,EAAE;UACNL,MAAM,EAAC,MAAM;UACbD,KAAK,EAAC,MAAM;UACZO,KAAK,EAAE;YAAEC,SAAS,EAAE;UAAQ;QAAE,GAC1BnB,IAAI,CAAC,CAAC,CAAC,EACX,CACY,eAEhBtE,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAAClE,KAAA,CAAAyE,IAAI;UAACE,KAAK,EAAC,QAAQ;UAACU,UAAU,EAAE,CAAE;UAACX,aAAa,EAAC;QAAQ,gBACxDhF,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACnE,cAAA,CAAAqE,aAAa;UACZC,WAAW,EAAE,CAAE;UACfC,YAAY,EAAE,CAAE;UAChBC,QAAQ,EAAC,MAAM;UACfM,EAAE,EAAC,SAAS;UACZS,UAAU,EAAC,WAAW;UACtBC,YAAY,EAAC,WAAW;UACxBR,WAAW,EAAC;QAAU,gBAEtBrF,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACrE,MAAA,CAAAmF,KAAK,EAAA1E,QAAA;UACJ2E,GAAG,EAAC,EAAE;UACNL,MAAM,EAAC,MAAM;UACbD,KAAK,EAAC,MAAM;UACZO,KAAK,EAAE;YAAEC,SAAS,EAAE;UAAQ;QAAE,GAC1BnB,IAAI,CAAC,CAAC,CAAC,EACX,CACY,eAEhBtE,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACnE,cAAA,CAAAqE,aAAa;UACZC,WAAW,EAAE,CAAE;UACfC,YAAY,EAAE,CAAE;UAChBC,QAAQ,EAAC,MAAM;UACfM,EAAE,EAAC,SAAS;UACZS,UAAU,EAAC,WAAW;UACtBE,SAAS,EAAC,WAAW;UACrBT,WAAW,EAAC;QAAU,gBAEtBrF,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACrE,MAAA,CAAAmF,KAAK,EAAA1E,QAAA;UACJ2E,GAAG,EAAC,EAAE;UACNL,MAAM,EAAC,MAAM;UACbD,KAAK,EAAC,MAAM;UACZO,KAAK,EAAE;YAAEC,SAAS,EAAE;UAAQ;QAAE,GAC1BnB,IAAI,CAAC,CAAC,CAAC,EACX,CACY,CACX,CACN;IACJ;EAEP,CAAC,EAAG,CACC,CACO,EAEfF,MAAM,iBAAIpE,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACjE,KAAA,CAAAwF,IAAI;IAACC,OAAO,EAAC;EAAI,GAAE5B,MAAM,CAAQ,eAE7CpE,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACjE,KAAA,CAAAwF,IAAI;IAACC,OAAO,EAAC;EAAY,GAAE9B,KAAK,CAAQ,EAExCC,QAAQ,iBACPnE,MAAA,CAAAW,OAAA,CAAA6D,aAAA,CAACjE,KAAA,CAAAwF,IAAI;IAACC,OAAO,EAAC,YAAY;IAACC,KAAK,EAAC;EAAS,GACvC9B,QAAQ,CAEZ,CACG;AAEV,CAAC;AAAAJ,OAAA,CAAAC,YAAA,GAAAA,YAAA;AAzJYA,YAAyC,CAAAkC,WAAA"}
+{"version":3,"file":"TriptychCard.js","names":["_react","_interopRequireDefault","require","_Image","_Box","_ResponsiveBox","_Flex","_Text","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","_toConsumableArray","arr","_arrayWithoutHoles","_iterableToArray","_unsupportedIterableToArray","_nonIterableSpread","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","iter","Symbol","iterator","isArray","len","arr2","isArrayOfStrings","images","every","src","exports","TriptychCard","_ref","title","subtitle","status","rest","imgs","map","createElement","Box","ResponsiveBox","aspectWidth","aspectHeight","maxWidth","mb","Flex","flexDirection","width","height","bg","borderRight","borderColor","Image","alt","style","objectFit","Fragment","flexShrink","borderLeft","borderBottom","borderTop","Text","variant","color","displayName"],"sources":["../../../src/elements/Cards/TriptychCard.tsx"],"sourcesContent":["import React from \"react\"\nimport { Image, ImageProps } from \"../Image\"\nimport { Box, BoxProps } from \"../Box\"\nimport { ResponsiveBox } from \"../ResponsiveBox\"\nimport { Flex } from \"../Flex\"\nimport { Text } from \"../Text\"\n\ntype Images = ImageProps[] | string[]\n\nexport interface TriptychCardProps extends BoxProps {\n  /** 1, 2, or 3 images */\n  images: Images\n  title?: string | null\n  subtitle?: string | null\n  status?: string | null\n}\n\nexport const isArrayOfStrings = (images: Images): images is string[] =>\n  [...images].every((src) => typeof src === \"string\")\n\n/**\n * `TriptychCard` is a card with a layout one square image on the left,\n * one tall or two square images on the right, and text for title and subtitle\n * at the bottom.\n */\n\nexport const TriptychCard: React.FC<React.PropsWithChildren<TriptychCardProps>> = ({\n  images,\n  title,\n  subtitle,\n  status,\n  ...rest\n}) => {\n  const imgs: ImageProps[] = (isArrayOfStrings(images)\n    ? images.map((src) => ({ src }))\n    : images\n  ).slice(0, 3)\n\n  return (\n    <Box {...rest}>\n      <ResponsiveBox aspectWidth={3} aspectHeight={2} maxWidth=\"100%\" mb={1}>\n        <Flex flexDirection=\"row\" width=\"100%\" height=\"100%\">\n          {(() => {\n            switch (imgs.length) {\n              case 1:\n                return (\n                  <ResponsiveBox\n                    aspectWidth={3}\n                    aspectHeight={2}\n                    maxWidth=\"100%\"\n                    bg=\"black10\"\n                    borderRight=\"1px solid\"\n                    borderColor=\"white100\"\n                  >\n                    <Image\n                      alt=\"\"\n                      height=\"100%\"\n                      width=\"100%\"\n                      style={{ objectFit: \"cover\" }}\n                      {...imgs[0]}\n                    />\n                  </ResponsiveBox>\n                )\n\n              case 2:\n                return (\n                  <>\n                    <ResponsiveBox\n                      aspectWidth={1}\n                      aspectHeight={1}\n                      maxWidth=\"100%\"\n                      bg=\"black10\"\n                      borderRight=\"1px solid\"\n                      borderColor=\"white100\"\n                    >\n                      <Image\n                        alt=\"\"\n                        height=\"100%\"\n                        width=\"100%\"\n                        style={{ objectFit: \"cover\" }}\n                        {...imgs[0]}\n                      />\n                    </ResponsiveBox>\n\n                    <Flex width=\"33.33%\" flexShrink={0}>\n                      <ResponsiveBox\n                        aspectWidth={1}\n                        aspectHeight={2}\n                        maxWidth=\"100%\"\n                        bg=\"black10\"\n                        borderLeft=\"1px solid\"\n                        borderColor=\"white100\"\n                      >\n                        <Image\n                          alt=\"\"\n                          height=\"100%\"\n                          width=\"100%\"\n                          style={{ objectFit: \"cover\" }}\n                          {...imgs[1]}\n                        />\n                      </ResponsiveBox>\n                    </Flex>\n                  </>\n                )\n              case 3:\n                return (\n                  <>\n                    <ResponsiveBox\n                      aspectWidth={1}\n                      aspectHeight={1}\n                      maxWidth=\"100%\"\n                      bg=\"black10\"\n                      borderRight=\"1px solid\"\n                      borderColor=\"white100\"\n                    >\n                      <Image\n                        alt=\"\"\n                        height=\"100%\"\n                        width=\"100%\"\n                        style={{ objectFit: \"cover\" }}\n                        {...imgs[0]}\n                      />\n                    </ResponsiveBox>\n\n                    <Flex width=\"33.33%\" flexShrink={0} flexDirection=\"column\">\n                      <ResponsiveBox\n                        aspectWidth={1}\n                        aspectHeight={1}\n                        maxWidth=\"100%\"\n                        bg=\"black10\"\n                        borderLeft=\"1px solid\"\n                        borderBottom=\"1px solid\"\n                        borderColor=\"white100\"\n                      >\n                        <Image\n                          alt=\"\"\n                          height=\"100%\"\n                          width=\"100%\"\n                          style={{ objectFit: \"cover\" }}\n                          {...imgs[1]}\n                        />\n                      </ResponsiveBox>\n\n                      <ResponsiveBox\n                        aspectWidth={1}\n                        aspectHeight={1}\n                        maxWidth=\"100%\"\n                        bg=\"black10\"\n                        borderLeft=\"1px solid\"\n                        borderTop=\"1px solid\"\n                        borderColor=\"white100\"\n                      >\n                        <Image\n                          alt=\"\"\n                          height=\"100%\"\n                          width=\"100%\"\n                          style={{ objectFit: \"cover\" }}\n                          {...imgs[2]}\n                        />\n                      </ResponsiveBox>\n                    </Flex>\n                  </>\n                )\n            }\n          })()}\n        </Flex>\n      </ResponsiveBox>\n\n      {status && <Text variant=\"xs\">{status}</Text>}\n\n      <Text variant=\"sm-display\">{title}</Text>\n\n      {subtitle && (\n        <Text variant=\"sm-display\" color=\"black60\">\n          {subtitle}\n        </Text>\n      )}\n    </Box>\n  )\n}\n"],"mappings":"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"}

package/dist/elements/Carousel/Carousel.d.ts

@@ -8,13 +8,13 @@ export declare type CarouselRailProps = BoxProps & {
     transition?: ResponsiveValue<string>;
 };
 /** A `CarouselRail` slides back and forth within the viewport */
-export declare const CarouselRail: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Pick<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof BoxProps> & BoxProps, keyof BoxProps | "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+export declare const CarouselRail: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof BoxProps> & BoxProps, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, CarouselRailProps>> & string;
 /** CarouselCellProps */
 export declare type CarouselCellProps = BoxProps;
 /** A `CarouselCell` wraps a single child in the carousel */
-export declare const CarouselCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Pick<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof BoxProps> & BoxProps, keyof BoxProps | "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+export declare const CarouselCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof BoxProps> & BoxProps, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, never>> & string;
 /**
@@ -24,9 +24,9 @@ export declare const CELL_GAP_PADDING_AMOUNT: SpacingUnit[];
 export interface CarouselProps extends BoxProps {
     initialIndex?: number;
     children: React.ReactNode;
-    Next?: typeof CarouselNext | React.FC<CarouselNavigationProps>;
-    Previous?: typeof CarouselPrevious | React.FC<CarouselNavigationProps>;
-    Rail?: typeof CarouselRail | React.FC<CarouselRailProps>;
+    Next?: typeof CarouselNext | React.FC<React.PropsWithChildren<CarouselNavigationProps>>;
+    Previous?: typeof CarouselPrevious | React.FC<React.PropsWithChildren<CarouselNavigationProps>>;
+    Rail?: typeof CarouselRail | React.FC<React.PropsWithChildren<CarouselRailProps>>;
     /**
      * If providing a custom `Cell` you must forward a ref so
      * that cell widths can be calculated.
@@ -42,4 +42,4 @@ export interface CarouselProps extends BoxProps {
  * of the viewport, it presents navigation arrows and allows a user to page
  * through them.
  */
-export declare const Carousel: React.FC<CarouselProps>;
+export declare const Carousel: React.FC<React.PropsWithChildren<CarouselProps>>;