@pega/cosmos-react-core 5.0.0-dev.1.0 → 5.0.0-dev.10.0

package/lib/components/Button/BareButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BareButton.js","sourceRoot":"","sources":["../../../src/components/Button/BareButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EACV,MAAM,EAMN,SAAS,EACV,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAGvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAuBjD,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAA;;;;;;;;;2BASlB,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO;;CAE3D,CAAC;AAEF,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,UAAU,GAAsD,UAAU,CAC9E,SAAS,UAAU,CACjB,EACE,IAAI,GAAG,QAAQ,EACf,QAAQ,GAAG,KAAK,EAChB,IAAI,EACJ,GAAG,SAAS,EACoC,EAClD,GAA2B;IAE3B,MAAM,cAAc,GAAG,MAAM,EAAc,CAAC;IAC5C,MAAM,SAAS,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAE1C,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,cAAc,CAAC,OAAO,GAAG,SAAS,CAAC;QACrC,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,KAAC,gBAAgB,IACf,GAAG,EAAE,SAAS,EACd,EAAE,EAAE,IAAI,CAAC,CAAC,CAAE,GAAW,CAAC,CAAC,CAAC,SAAS,EACnC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,EAC7B,QAAQ,EAAE,QAAQ,KACd,SAAS,EACb,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,CAAC,CAAoD,EAAE,EAAE;YACnE,SAAS,CAAC,WAA6C,EAAE,CAAC,CAAC,CAAC,CAAC;YAC9D,CAAC,CAAC,OAAO,EAAE,CAAC;YACZ,cAAc,CAAC,OAAO,GAAG,CAAC,CAAC;QAC7B,CAAC,EACD,SAAS,EAAE,CAAC,CAAoD,EAAE,EAAE;YAClE,MAAM,WAAW,GAAG,cAAc,CAAC,OAAO,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,gBAAgB,CAAC;YACvF,cAAc,CAAC,OAAO,GAAG,SAAS,CAAC;YAEnC,IAAI,WAAW,IAAI,SAAS,CAAC,OAAO,KAAK,QAAQ,CAAC,aAAa,EAAE;gBAC/D,SAAS,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;aAC5B;YAED,OAAQ,SAAS,CAAC,SAA2C,EAAE,CAAC,CAAC,CAAC,CAAC;QACrE,CAAC,GACD,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import {\n  forwardRef,\n  useRef,\n  FunctionComponent,\n  PropsWithoutRef,\n  Ref,\n  MouseEvent,\n  MouseEventHandler,\n  useEffect\n} from 'react';\nimport styled from 'styled-components';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { useConsolidatedRef } from '../../hooks';\n\nimport { ButtonProps } from './Button';\n\nexport interface BareButtonProps extends BaseProps {\n  /** Text or content for the Button. */\n  children: ButtonProps['children'];\n  /**\n   * Determines if the Button will be disabled.\n   * @default false\n   */\n  disabled?: ButtonProps['disabled'];\n  /** A location to navigate to. Passing an href will render a Link styled as a Button. */\n  href?: ButtonProps['href'];\n  /**\n   * Controls the behavior of a Button within a Form.\n   * @default 'button'\n   */\n  type?: ButtonProps['type'];\n  /** Ref forwarded to the wrapping element. */\n  ref?: ButtonProps['ref'];\n}\n\nexport const StyledBareButton = styled.button`\n  background: none;\n  border: none;\n  outline: none;\n  cursor: pointer;\n  user-select: none;\n  color: inherit;\n\n  & + & {\n    margin-inline-start: ${props => props.theme.base.spacing};\n  }\n`;\n\nStyledBareButton.defaultProps = defaultThemeProp;\n\nconst BareButton: FunctionComponent<BareButtonProps & ForwardProps> = forwardRef(\n  function BareButton(\n    {\n      type = 'button',\n      disabled = false,\n      href,\n      ...restProps\n    }: PropsWithoutRef<BareButtonProps> & ForwardProps,\n    ref: Ref<HTMLButtonElement>\n  ) {\n    const mouseDownEvent = useRef<MouseEvent>();\n    const buttonRef = useConsolidatedRef(ref);\n\n    useEffect(() => {\n      return () => {\n        mouseDownEvent.current = undefined;\n      };\n    }, []);\n\n    return (\n      <StyledBareButton\n        ref={buttonRef}\n        as={href ? ('a' as any) : undefined}\n        type={href ? undefined : type}\n        disabled={disabled}\n        {...restProps}\n        href={href}\n        onMouseDown={(e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n          (restProps.onMouseDown as MouseEventHandler | undefined)?.(e);\n          e.persist();\n          mouseDownEvent.current = e;\n        }}\n        onMouseUp={(e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n          const shouldFocus = mouseDownEvent.current && !mouseDownEvent.current.defaultPrevented;\n          mouseDownEvent.current = undefined;\n\n          if (shouldFocus && buttonRef.current !== document.activeElement) {\n            buttonRef.current?.focus();\n          }\n\n          return (restProps.onMouseUp as MouseEventHandler | undefined)?.(e);\n        }}\n      />\n    );\n  }\n);\n\nexport default BareButton;\n"]}
+{"version":3,"file":"BareButton.js","sourceRoot":"","sources":["../../../src/components/Button/BareButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAGvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAuBjD,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAA;;;;;;;;;2BASlB,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO;;CAE3D,CAAC;AAEF,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,UAAU,GAAsD,UAAU,CAC9E,SAAS,UAAU,CACjB,EACE,IAAI,GAAG,QAAQ,EACf,QAAQ,GAAG,KAAK,EAChB,IAAI,EACJ,GAAG,SAAS,EACoC,EAClD,GAA2B;IAE3B,MAAM,cAAc,GAAG,MAAM,EAAc,CAAC;IAC5C,MAAM,SAAS,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAE1C,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,cAAc,CAAC,OAAO,GAAG,SAAS,CAAC;QACrC,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,KAAC,gBAAgB,IACf,GAAG,EAAE,SAAS,EACd,EAAE,EAAE,IAAI,CAAC,CAAC,CAAE,GAAW,CAAC,CAAC,CAAC,SAAS,EACnC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,EAC7B,QAAQ,EAAE,QAAQ,KACd,SAAS,EACb,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,CAAC,CAAoD,EAAE,EAAE;YACnE,SAAS,CAAC,WAA6C,EAAE,CAAC,CAAC,CAAC,CAAC;YAC9D,CAAC,CAAC,OAAO,EAAE,CAAC;YACZ,cAAc,CAAC,OAAO,GAAG,CAAC,CAAC;QAC7B,CAAC,EACD,SAAS,EAAE,CAAC,CAAoD,EAAE,EAAE;YAClE,MAAM,WAAW,GAAG,cAAc,CAAC,OAAO,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,gBAAgB,CAAC;YACvF,cAAc,CAAC,OAAO,GAAG,SAAS,CAAC;YAEnC,IAAI,WAAW,IAAI,SAAS,CAAC,OAAO,KAAK,QAAQ,CAAC,aAAa,EAAE;gBAC/D,SAAS,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;aAC5B;YAED,OAAQ,SAAS,CAAC,SAA2C,EAAE,CAAC,CAAC,CAAC,CAAC;QACrE,CAAC,GACD,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import { forwardRef, useRef, useEffect } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref, MouseEvent, MouseEventHandler } from 'react';\nimport styled from 'styled-components';\n\nimport type { BaseProps, ForwardProps } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { useConsolidatedRef } from '../../hooks';\n\nimport type { ButtonProps } from './Button';\n\nexport interface BareButtonProps extends BaseProps {\n  /** Text or content for the Button. */\n  children: ButtonProps['children'];\n  /**\n   * Determines if the Button will be disabled.\n   * @default false\n   */\n  disabled?: ButtonProps['disabled'];\n  /** A location to navigate to. Passing an href will render a Link styled as a Button. */\n  href?: ButtonProps['href'];\n  /**\n   * Controls the behavior of a Button within a Form.\n   * @default 'button'\n   */\n  type?: ButtonProps['type'];\n  /** Ref forwarded to the wrapping element. */\n  ref?: ButtonProps['ref'];\n}\n\nexport const StyledBareButton = styled.button`\n  background: none;\n  border: none;\n  outline: none;\n  cursor: pointer;\n  user-select: none;\n  color: inherit;\n\n  & + & {\n    margin-inline-start: ${props => props.theme.base.spacing};\n  }\n`;\n\nStyledBareButton.defaultProps = defaultThemeProp;\n\nconst BareButton: FunctionComponent<BareButtonProps & ForwardProps> = forwardRef(\n  function BareButton(\n    {\n      type = 'button',\n      disabled = false,\n      href,\n      ...restProps\n    }: PropsWithoutRef<BareButtonProps> & ForwardProps,\n    ref: Ref<HTMLButtonElement>\n  ) {\n    const mouseDownEvent = useRef<MouseEvent>();\n    const buttonRef = useConsolidatedRef(ref);\n\n    useEffect(() => {\n      return () => {\n        mouseDownEvent.current = undefined;\n      };\n    }, []);\n\n    return (\n      <StyledBareButton\n        ref={buttonRef}\n        as={href ? ('a' as any) : undefined}\n        type={href ? undefined : type}\n        disabled={disabled}\n        {...restProps}\n        href={href}\n        onMouseDown={(e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n          (restProps.onMouseDown as MouseEventHandler | undefined)?.(e);\n          e.persist();\n          mouseDownEvent.current = e;\n        }}\n        onMouseUp={(e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n          const shouldFocus = mouseDownEvent.current && !mouseDownEvent.current.defaultPrevented;\n          mouseDownEvent.current = undefined;\n\n          if (shouldFocus && buttonRef.current !== document.activeElement) {\n            buttonRef.current?.focus();\n          }\n\n          return (restProps.onMouseUp as MouseEventHandler | undefined)?.(e);\n        }}\n      />\n    );\n  }\n);\n\nexport default BareButton;\n"]}

package/lib/components/Button/BareRoleButton.d.ts

@@ -1,5 +1,5 @@
-import { Ref, MouseEvent, KeyboardEvent, ReactNode, FunctionComponent } from 'react';
-import { BaseProps, ForwardProps } from '../../types';
+import type { Ref, MouseEvent, KeyboardEvent, ReactNode, FunctionComponent } from 'react';
+import type { BaseProps, ForwardProps } from '../../types';
 export interface BareRoleButtonProps extends BaseProps {
     children: ReactNode;
     onClick?: (e: MouseEvent<HTMLDivElement>) => void;

package/lib/components/Button/BareRoleButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BareRoleButton.d.ts","sourceRoot":"","sources":["../../../src/components/Button/BareRoleButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,GAAG,EAAE,UAAU,EAAE,aAAa,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAGjG,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEtD,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAClD,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,aAAa,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IACvD,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,oBAAoB,yGAEhC,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,mBAAmB,GAAG,YAAY,CAiCzE,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"BareRoleButton.d.ts","sourceRoot":"","sources":["../../../src/components/Button/BareRoleButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,GAAG,EAAE,UAAU,EAAE,aAAa,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG1F,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE3D,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAClD,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,aAAa,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IACvD,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,oBAAoB,yGAEhC,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,mBAAmB,GAAG,YAAY,CAiCzE,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/Button/BareRoleButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BareRoleButton.js","sourceRoot":"","sources":["../../../src/components/Button/BareRoleButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAgE,MAAM,OAAO,CAAC;AACjG,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAWvC,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAA;;CAE7C,CAAC;AAEF,MAAM,cAAc,GAA0D,UAAU,CACtF,SAAS,cAAc,CACrB,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,SAAS,EAAuB,EACnE,GAA+B;IAE/B,OAAO,CACL,KAAC,oBAAoB,OACf,SAAS,EACb,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,CAAC,CAAgC,EAAE,EAAE;YAC9C,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,GAAG,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,aAAa,EAAE;gBACvE,CAAC,CAAC,aAAgC,CAAC,KAAK,EAAE,CAAC;aAC7C;YAED,OAAO,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC;QACxB,CAAC,EACD,OAAO,EAAE,CAAC,CAA6B,EAAE,EAAE;YACzC,IACE,CAAC,CAAC,MAAM,YAAY,OAAO;gBAC3B,mEAAmE;gBACnE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,2CAA2C,CAAC,KAAK,CAAC,CAAC,aAAa;gBAEjF,OAAO;YAET,OAAO,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;QACtB,CAAC,EACD,GAAG,EAAE,GAAG,YAEP,QAAQ,GACY,CACxB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { forwardRef, Ref, MouseEvent, KeyboardEvent, ReactNode, FunctionComponent } from 'react';\nimport styled from 'styled-components';\n\nimport { BaseProps, ForwardProps } from '../../types';\n\nexport interface BareRoleButtonProps extends BaseProps {\n  children: ReactNode;\n  onClick?: (e: MouseEvent<HTMLDivElement>) => void;\n  onKeyDown?: (e: KeyboardEvent<HTMLDivElement>) => void;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport const StyledBareRoleButton = styled.div`\n  cursor: pointer;\n`;\n\nconst BareRoleButton: FunctionComponent<BareRoleButtonProps & ForwardProps> = forwardRef(\n  function BareRoleButton(\n    { children, onClick, onKeyDown, ...restProps }: BareRoleButtonProps,\n    ref: BareRoleButtonProps['ref']\n  ) {\n    return (\n      <StyledBareRoleButton\n        {...restProps}\n        tabIndex={0}\n        role='button'\n        onKeyDown={(e: KeyboardEvent<HTMLDivElement>) => {\n          if ((e.key === ' ' || e.key === 'Enter') && e.target === e.currentTarget) {\n            (e.currentTarget as HTMLDivElement).click();\n          }\n\n          return onKeyDown?.(e);\n        }}\n        onClick={(e: MouseEvent<HTMLDivElement>) => {\n          if (\n            e.target instanceof Element &&\n            // Ignore clicks on other interactive elements within this element.\n            e.target.closest(\"button, a, [role='button'], [role='link']\") !== e.currentTarget\n          )\n            return;\n\n          return onClick?.(e);\n        }}\n        ref={ref}\n      >\n        {children}\n      </StyledBareRoleButton>\n    );\n  }\n);\n\nexport default BareRoleButton;\n"]}
+{"version":3,"file":"BareRoleButton.js","sourceRoot":"","sources":["../../../src/components/Button/BareRoleButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAWvC,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAA;;CAE7C,CAAC;AAEF,MAAM,cAAc,GAA0D,UAAU,CACtF,SAAS,cAAc,CACrB,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,SAAS,EAAuB,EACnE,GAA+B;IAE/B,OAAO,CACL,KAAC,oBAAoB,OACf,SAAS,EACb,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,CAAC,CAAgC,EAAE,EAAE;YAC9C,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,GAAG,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,aAAa,EAAE;gBACvE,CAAC,CAAC,aAAgC,CAAC,KAAK,EAAE,CAAC;aAC7C;YAED,OAAO,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC;QACxB,CAAC,EACD,OAAO,EAAE,CAAC,CAA6B,EAAE,EAAE;YACzC,IACE,CAAC,CAAC,MAAM,YAAY,OAAO;gBAC3B,mEAAmE;gBACnE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,2CAA2C,CAAC,KAAK,CAAC,CAAC,aAAa;gBAEjF,OAAO;YAET,OAAO,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;QACtB,CAAC,EACD,GAAG,EAAE,GAAG,YAEP,QAAQ,GACY,CACxB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { Ref, MouseEvent, KeyboardEvent, ReactNode, FunctionComponent } from 'react';\nimport styled from 'styled-components';\n\nimport type { BaseProps, ForwardProps } from '../../types';\n\nexport interface BareRoleButtonProps extends BaseProps {\n  children: ReactNode;\n  onClick?: (e: MouseEvent<HTMLDivElement>) => void;\n  onKeyDown?: (e: KeyboardEvent<HTMLDivElement>) => void;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport const StyledBareRoleButton = styled.div`\n  cursor: pointer;\n`;\n\nconst BareRoleButton: FunctionComponent<BareRoleButtonProps & ForwardProps> = forwardRef(\n  function BareRoleButton(\n    { children, onClick, onKeyDown, ...restProps }: BareRoleButtonProps,\n    ref: BareRoleButtonProps['ref']\n  ) {\n    return (\n      <StyledBareRoleButton\n        {...restProps}\n        tabIndex={0}\n        role='button'\n        onKeyDown={(e: KeyboardEvent<HTMLDivElement>) => {\n          if ((e.key === ' ' || e.key === 'Enter') && e.target === e.currentTarget) {\n            (e.currentTarget as HTMLDivElement).click();\n          }\n\n          return onKeyDown?.(e);\n        }}\n        onClick={(e: MouseEvent<HTMLDivElement>) => {\n          if (\n            e.target instanceof Element &&\n            // Ignore clicks on other interactive elements within this element.\n            e.target.closest(\"button, a, [role='button'], [role='link']\") !== e.currentTarget\n          )\n            return;\n\n          return onClick?.(e);\n        }}\n        ref={ref}\n      >\n        {children}\n      </StyledBareRoleButton>\n    );\n  }\n);\n\nexport default BareRoleButton;\n"]}

package/lib/components/Button/Button.d.ts

@@ -1,6 +1,6 @@
-import { FunctionComponent, ReactNode, Ref } from 'react';
-import { DefaultTheme } from 'styled-components';
-import { BaseProps, ForwardProps, PropsWithDefaults, AsProp } from '../../types';
+import type { FunctionComponent, ReactNode, Ref } from 'react';
+import type { DefaultTheme } from 'styled-components';
+import type { BaseProps, ForwardProps, PropsWithDefaults, AsProp } from '../../types';
 export interface ButtonProps extends BaseProps, AsProp {
     /** Text or content for the Button. */
     children: ReactNode;

package/lib/components/Button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,iBAAiB,EACjB,SAAS,EAET,GAAG,EAGJ,MAAM,OAAO,CAAC;AACf,OAAe,EAAO,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAG9D,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAWjF,MAAM,WAAW,WAAY,SAAQ,SAAS,EAAE,MAAM;IACpD,sCAAsC;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2FAA2F;IAC3F,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;IAC/D;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC;IACrC;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oDAAoD;IACpD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4EAA4E;IAC5E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CAC9B;AAED,KAAK,uBAAuB,GAAG,iBAAiB,CAC9C,WAAW,EACX,SAAS,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,SAAS,CACrD,CAAC;AAgDF,eAAO,MAAM,YAAY,qGAyLxB,CAAC;AAIF,eAAO,MAAM,gBAAgB,gGA6C5B,CAAC;AAIF,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CAyExD,CAAC;AAEH,eAAe,MAAM,CAAC"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,iBAAiB,EACjB,SAAS,EAET,GAAG,EAGJ,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAGtD,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAWtF,MAAM,WAAW,WAAY,SAAQ,SAAS,EAAE,MAAM;IACpD,sCAAsC;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2FAA2F;IAC3F,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;IAC/D;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC;IACrC;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oDAAoD;IACpD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4EAA4E;IAC5E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CAC9B;AAED,KAAK,uBAAuB,GAAG,iBAAiB,CAC9C,WAAW,EACX,SAAS,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,SAAS,CACrD,CAAC;AAgDF,eAAO,MAAM,YAAY,qGAyLxB,CAAC;AAIF,eAAO,MAAM,gBAAgB,gGA6C5B,CAAC;AAIF,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CAyExD,CAAC;AAEH,eAAe,MAAM,CAAC"}

package/lib/components/Button/Button.js

@@ -44,7 +44,7 @@ const baseStyles = (theme) => {
   `;
 };
 export const StyledButton = styled.button.withConfig(omitProps('loading'))(({ variant, icon, loading, compact, theme }) => {
-    const { base: { spacing, 'border-radius': baseBorderRadius, palette: { 'primary-background': backgroundColor }, 'hit-area': { 'mouse-min': hitAreaMouse, 'finger-min': hitAreaFinger, 'compact-min': hitAreaCompact }, animation: { speed } }, components: { button: { color, 'secondary-color': buttonSecondaryColor, padding, 'border-radius': borderRadius, 'border-width': borderWidth, touch: { padding: touchPadding } } } } = theme;
+    const { base: { spacing, 'border-radius': baseBorderRadius, palette: { 'primary-background': backgroundColor }, 'hit-area': { 'mouse-min': hitAreaMouse, 'finger-min': hitAreaFinger, 'compact-min': hitAreaCompact }, animation: { speed } }, components: { button: { color, 'secondary-color': secondaryColor, padding, 'border-radius': borderRadius, 'border-width': borderWidth, touch: { padding: touchPadding } } } } = theme;
     const contrastColor = tryCatch(() => readableColor(color));
     // Base
     const base = baseStyles(theme);
@@ -114,15 +114,15 @@ export const StyledButton = styled.button.withConfig(omitProps('loading'))(({ va
       }
     `;
     // Secondary
-    const backgroundUsable = meetsContrastGuidelines(color, buttonSecondaryColor).AA;
-    const secondaryColor = backgroundUsable ? buttonSecondaryColor : readableColor(color);
-    const secondaryHoverBackgroundColor = tryCatch(() => mix(0.85, secondaryColor, color));
-    const secondaryHoverForegroundColor = readableHue(color, secondaryHoverBackgroundColor ?? 'transparent');
+    const backgroundUsable = meetsContrastGuidelines(color, secondaryColor).AA;
+    const usableColor = backgroundUsable ? color : readableHue(color, secondaryColor);
+    const secondaryHoverBackgroundColor = tryCatch(() => mix(0.85, secondaryColor, usableColor));
+    const secondaryHoverForegroundColor = readableHue(usableColor, secondaryHoverBackgroundColor ?? 'transparent');
     const secondary = css `
       --button-background-color: ${secondaryColor};
-      color: ${color};
+      color: ${usableColor};
       background-color: ${secondaryColor};
-      border-color: ${color};
+      border-color: ${usableColor};
 
       @media (hover: hover) {
         &:hover {

package/lib/components/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  useRef,\n  useEffect,\n  forwardRef,\n  FunctionComponent,\n  ReactNode,\n  PropsWithoutRef,\n  Ref,\n  MouseEvent,\n  MouseEventHandler\n} from 'react';\nimport styled, { css, DefaultTheme } from 'styled-components';\nimport { meetsContrastGuidelines, mix, readableColor } from 'polished';\n\nimport { BaseProps, ForwardProps, PropsWithDefaults, AsProp } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport { getHoverColors, omitProps, readableHue } from '../../styles';\nimport { useElement, useConsolidatedRef } from '../../hooks';\nimport Tooltip from '../Tooltip';\nimport Progress, { StyledProgressRing } from '../Progress';\nimport { StyledBackdrop } from '../Backdrop';\nimport { StyledIcon } from '../Icon';\nimport { StyledPopover } from '../Popover';\n\nexport interface ButtonProps extends BaseProps, AsProp {\n  /** Text or content for the Button. */\n  children: ReactNode;\n  /**\n   * Determines if the Button will be disabled.\n   * @default false\n   */\n  disabled?: boolean;\n  /** A location to navigate to. Passing an href will render an anchor styled as a Button. */\n  href?: string;\n  /**\n   * Controls the styling of the Button.\n   * @default 'secondary'\n   */\n  variant?: 'primary' | 'secondary' | 'simple' | 'link' | 'text';\n  /**\n   * Controls the behavior of a Button within a Form.\n   * @default 'button'\n   */\n  type?: 'button' | 'reset' | 'submit';\n  /**\n   * Set the Icon prop to `true` if you're using just an Icon in your Button. Make sure to pass an Icon as children if `true`.\n   * @default false\n   */\n  icon?: boolean;\n  /**\n   * Used for a smaller sized button.\n   * @default false\n   */\n  compact?: boolean;\n  /** The label text will be used inside a Tooltip. */\n  label?: string;\n  /** The aria label text will be inserted as the aria-label on the Button. */\n  'aria-label'?: string;\n  /**\n   * Optionally renders an indeterminate progress indicator in a button.\n   * @default false\n   */\n  loading?: boolean;\n  /** Ref forwarded to the wrapping element. */\n  ref?: Ref<HTMLButtonElement>;\n}\n\ntype ButtonPropsWithDefaults = PropsWithDefaults<\n  ButtonProps,\n  'variant' | 'type' | 'disabled' | 'icon' | 'loading'\n>;\n\nconst baseStyles = (theme: DefaultTheme) => {\n  const {\n    base: {\n      spacing,\n      animation: {\n        speed,\n        timing: { ease }\n      },\n      'disabled-opacity': disabledOpacity\n    },\n    components: {\n      button: { 'focus-shadow': focusShadow }\n    }\n  } = theme;\n\n  return css`\n    outline: none;\n    text-decoration: none;\n    transition-property: background-color, color, box-shadow;\n    transition-duration: calc(0.5 * ${speed});\n    transition-timing-function: ${ease};\n    cursor: pointer;\n\n    & + & {\n      margin-inline-start: ${spacing};\n    }\n\n    /* Not able to combine with selector above. Stylis bug? */\n    & + ${StyledPopover} + & {\n      margin-inline-start: ${spacing};\n    }\n\n    &:disabled,\n    &[disabled] {\n      opacity: ${disabledOpacity};\n      cursor: not-allowed;\n      pointer-events: none;\n    }\n\n    &:enabled:focus,\n    &:not([disabled]):focus {\n      box-shadow: ${focusShadow};\n    }\n  `;\n};\n\nexport const StyledButton = styled.button.withConfig<ButtonPropsWithDefaults>(omitProps('loading'))(\n  ({ variant, icon, loading, compact, theme }) => {\n    const {\n      base: {\n        spacing,\n        'border-radius': baseBorderRadius,\n        palette: { 'primary-background': backgroundColor },\n        'hit-area': {\n          'mouse-min': hitAreaMouse,\n          'finger-min': hitAreaFinger,\n          'compact-min': hitAreaCompact\n        },\n        animation: { speed }\n      },\n      components: {\n        button: {\n          color,\n          'secondary-color': buttonSecondaryColor,\n          padding,\n          'border-radius': borderRadius,\n          'border-width': borderWidth,\n          touch: { padding: touchPadding }\n        }\n      }\n    } = theme;\n    const contrastColor = tryCatch(() => readableColor(color));\n\n    // Base\n    const base = baseStyles(theme);\n\n    // Non-text base\n    const nonTextual = css`\n      position: relative;\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      min-height: ${hitAreaMouse};\n      min-width: ${hitAreaMouse};\n      border: ${borderWidth} solid transparent;\n      border-radius: calc(${baseBorderRadius} * ${borderRadius});\n      -webkit-user-select: none;\n      user-select: none;\n\n      ${!icon &&\n      css`\n        padding: ${padding};\n      `}\n\n      ${icon &&\n      css`\n        border-radius: calc(${baseBorderRadius} * ${borderRadius});\n\n        > svg {\n          display: block;\n        }\n      `}\n\n      ${compact &&\n      css`\n        min-height: ${hitAreaCompact};\n        min-width: ${hitAreaCompact};\n      `}\n\n      @media (pointer: coarse) {\n        border-radius: calc(${baseBorderRadius} * ${borderRadius});\n\n        ${!compact &&\n        css`\n          min-height: ${hitAreaFinger};\n          min-width: ${hitAreaFinger};\n        `}\n\n        ${!icon &&\n        css`\n          padding: ${touchPadding};\n        `}\n      }\n    `;\n\n    // Primary\n    const hoverColors = getHoverColors(color);\n    const hoverPrimaryColor = hoverColors.background;\n    const hoverContrastColor = hoverColors.foreground;\n    const primary = css`\n      --button-background-color: ${color};\n      color: ${contrastColor};\n      background-color: ${color};\n\n      @media (hover: hover) {\n        &:hover {\n          background-color: ${hoverPrimaryColor};\n          color: ${hoverContrastColor};\n          text-decoration: none;\n        }\n      }\n    `;\n\n    // Secondary\n    const backgroundUsable = meetsContrastGuidelines(color, buttonSecondaryColor).AA;\n    const secondaryColor = backgroundUsable ? buttonSecondaryColor : readableColor(color);\n    const secondaryHoverBackgroundColor = tryCatch(() => mix(0.85, secondaryColor, color));\n    const secondaryHoverForegroundColor = readableHue(\n      color,\n      secondaryHoverBackgroundColor ?? 'transparent'\n    );\n    const secondary = css`\n      --button-background-color: ${secondaryColor};\n      color: ${color};\n      background-color: ${secondaryColor};\n      border-color: ${color};\n\n      @media (hover: hover) {\n        &:hover {\n          color: ${secondaryHoverForegroundColor};\n          background-color: ${secondaryHoverBackgroundColor};\n          text-decoration: none;\n          border-color: ${secondaryHoverForegroundColor};\n        }\n      }\n    `;\n\n    // Simple\n    const simple = css`\n      --button-background-color: ${icon ? 'transparent' : backgroundColor};\n      color: ${icon ? 'currentColor' : color};\n      background-color: ${icon ? 'transparent' : backgroundColor};\n\n      @media (hover: hover) {\n        &:hover {\n          ${icon &&\n          css`\n            ::before {\n              content: '';\n              position: absolute;\n              top: calc(${borderWidth} * -1);\n              bottom: calc(${borderWidth} * -1);\n              left: calc(${borderWidth} * -1);\n              right: calc(${borderWidth} * -1);\n              border-radius: inherit;\n              background-color: currentColor;\n              opacity: 0.15;\n            }\n          `}\n\n          ${!icon &&\n          css`\n            background-color: ${secondaryHoverBackgroundColor};\n            color: ${secondaryHoverForegroundColor};\n            border-color: ${secondaryHoverForegroundColor};\n            text-decoration: none;\n          `}\n        }\n      }\n    `;\n\n    return css`\n      ${base}\n      ${nonTextual}\n      ${variant === 'primary' && primary}\n      ${variant === 'secondary' && secondary}\n      ${variant === 'simple' && simple}\n\n      ${loading &&\n      css`\n        ${StyledBackdrop} {\n          background-color: var(--button-background-color);\n          border-radius: inherit;\n        }\n\n        ${StyledProgressRing} {\n          width: 1em;\n          height: 1em;\n\n          ${!icon &&\n          css`\n            margin-inline-end: calc(${spacing} / 2);\n          `}\n\n          circle:nth-child(2) {\n            animation-duration: calc(${speed} * 2);\n          }\n        }\n      `}\n    `;\n  }\n);\n\nStyledButton.defaultProps = defaultThemeProp;\n\nexport const StyledButtonLink = styled.a.withConfig<ButtonPropsWithDefaults>(omitProps('loading'))(\n  ({ theme, variant }) => {\n    const {\n      base: {\n        palette: { 'foreground-color': textColor }\n      },\n      components: {\n        link: { color: linkColor }\n      }\n    } = theme;\n\n    const base = baseStyles(theme);\n\n    const textual = css`\n      background-color: transparent;\n      display: inline;\n      text-align: start;\n      border: none;\n\n      @media (hover: hover) {\n        &:hover {\n          text-decoration: underline;\n        }\n      }\n\n      > ${StyledIcon} {\n        vertical-align: bottom;\n      }\n    `;\n\n    const link = css`\n      color: ${linkColor};\n    `;\n\n    const text = css`\n      color: ${textColor};\n    `;\n\n    return css`\n      ${base}\n      ${textual}\n      ${variant === 'link' && link}\n      ${variant === 'text' && text}\n    `;\n  }\n);\n\nStyledButtonLink.defaultProps = defaultThemeProp;\n\nconst Button: FunctionComponent<ButtonProps & ForwardProps> = forwardRef(function Button(\n  {\n    variant = 'secondary',\n    type = 'button',\n    disabled = false,\n    icon = false,\n    compact = false,\n    href,\n    as,\n    forwardedAs,\n    label,\n    'aria-label': ariaLabel,\n    loading = false,\n    children,\n    ...restProps\n  }: PropsWithoutRef<ButtonProps> & ForwardProps,\n  ref: Ref<HTMLButtonElement>\n) {\n  const [buttonEl, setButtonEl] = useElement();\n  const mouseDownEvent = useRef<MouseEvent>();\n  const buttonRef = useConsolidatedRef<HTMLButtonElement>(ref, setButtonEl);\n  const isTextual = ['link', 'text'].includes(variant);\n  const showProgress = loading && !isTextual;\n  const StyledComp: React.ElementType = isTextual ? StyledButtonLink : StyledButton;\n\n  useEffect(() => {\n    return () => {\n      mouseDownEvent.current = undefined;\n    };\n  }, []);\n\n  return (\n    <>\n      <StyledComp\n        {...restProps}\n        ref={buttonRef}\n        as={as || (href ? 'a' : 'button')}\n        forwardedAs={forwardedAs || (href ? 'a' : 'button')}\n        variant={variant}\n        icon={icon}\n        compact={compact}\n        type={href ? undefined : type}\n        href={href}\n        disabled={disabled && !href}\n        loading={showProgress}\n        aria-label={ariaLabel || label}\n        onMouseDown={(e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n          (restProps.onMouseDown as MouseEventHandler | undefined)?.(e);\n          e.persist();\n          mouseDownEvent.current = e;\n        }}\n        onMouseUp={(e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n          const shouldFocus = mouseDownEvent.current && !mouseDownEvent.current.defaultPrevented;\n          mouseDownEvent.current = undefined;\n\n          if (shouldFocus && buttonRef.current !== document.activeElement) {\n            buttonRef.current?.focus();\n          }\n\n          return (restProps.onMouseUp as MouseEventHandler | undefined)?.(e);\n        }}\n      >\n        {showProgress && <Progress variant='ring' placement='inline' />}\n        {!icon || !showProgress ? children : null}\n      </StyledComp>\n\n      {buttonEl && label && (\n        <Tooltip target={buttonEl} showDelay='none' hideDelay='none' describeTarget={false}>\n          {label}\n        </Tooltip>\n      )}\n    </>\n  );\n});\n\nexport default Button;\n"]}
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, useEffect, forwardRef } from 'react';\nimport type {\n  FunctionComponent,\n  ReactNode,\n  PropsWithoutRef,\n  Ref,\n  MouseEvent,\n  MouseEventHandler\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport type { DefaultTheme } from 'styled-components';\nimport { meetsContrastGuidelines, mix, readableColor } from 'polished';\n\nimport type { BaseProps, ForwardProps, PropsWithDefaults, AsProp } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport { getHoverColors, omitProps, readableHue } from '../../styles';\nimport { useElement, useConsolidatedRef } from '../../hooks';\nimport Tooltip from '../Tooltip';\nimport Progress, { StyledProgressRing } from '../Progress';\nimport { StyledBackdrop } from '../Backdrop';\nimport { StyledIcon } from '../Icon';\nimport { StyledPopover } from '../Popover';\n\nexport interface ButtonProps extends BaseProps, AsProp {\n  /** Text or content for the Button. */\n  children: ReactNode;\n  /**\n   * Determines if the Button will be disabled.\n   * @default false\n   */\n  disabled?: boolean;\n  /** A location to navigate to. Passing an href will render an anchor styled as a Button. */\n  href?: string;\n  /**\n   * Controls the styling of the Button.\n   * @default 'secondary'\n   */\n  variant?: 'primary' | 'secondary' | 'simple' | 'link' | 'text';\n  /**\n   * Controls the behavior of a Button within a Form.\n   * @default 'button'\n   */\n  type?: 'button' | 'reset' | 'submit';\n  /**\n   * Set the Icon prop to `true` if you're using just an Icon in your Button. Make sure to pass an Icon as children if `true`.\n   * @default false\n   */\n  icon?: boolean;\n  /**\n   * Used for a smaller sized button.\n   * @default false\n   */\n  compact?: boolean;\n  /** The label text will be used inside a Tooltip. */\n  label?: string;\n  /** The aria label text will be inserted as the aria-label on the Button. */\n  'aria-label'?: string;\n  /**\n   * Optionally renders an indeterminate progress indicator in a button.\n   * @default false\n   */\n  loading?: boolean;\n  /** Ref forwarded to the wrapping element. */\n  ref?: Ref<HTMLButtonElement>;\n}\n\ntype ButtonPropsWithDefaults = PropsWithDefaults<\n  ButtonProps,\n  'variant' | 'type' | 'disabled' | 'icon' | 'loading'\n>;\n\nconst baseStyles = (theme: DefaultTheme) => {\n  const {\n    base: {\n      spacing,\n      animation: {\n        speed,\n        timing: { ease }\n      },\n      'disabled-opacity': disabledOpacity\n    },\n    components: {\n      button: { 'focus-shadow': focusShadow }\n    }\n  } = theme;\n\n  return css`\n    outline: none;\n    text-decoration: none;\n    transition-property: background-color, color, box-shadow;\n    transition-duration: calc(0.5 * ${speed});\n    transition-timing-function: ${ease};\n    cursor: pointer;\n\n    & + & {\n      margin-inline-start: ${spacing};\n    }\n\n    /* Not able to combine with selector above. Stylis bug? */\n    & + ${StyledPopover} + & {\n      margin-inline-start: ${spacing};\n    }\n\n    &:disabled,\n    &[disabled] {\n      opacity: ${disabledOpacity};\n      cursor: not-allowed;\n      pointer-events: none;\n    }\n\n    &:enabled:focus,\n    &:not([disabled]):focus {\n      box-shadow: ${focusShadow};\n    }\n  `;\n};\n\nexport const StyledButton = styled.button.withConfig<ButtonPropsWithDefaults>(omitProps('loading'))(\n  ({ variant, icon, loading, compact, theme }) => {\n    const {\n      base: {\n        spacing,\n        'border-radius': baseBorderRadius,\n        palette: { 'primary-background': backgroundColor },\n        'hit-area': {\n          'mouse-min': hitAreaMouse,\n          'finger-min': hitAreaFinger,\n          'compact-min': hitAreaCompact\n        },\n        animation: { speed }\n      },\n      components: {\n        button: {\n          color,\n          'secondary-color': secondaryColor,\n          padding,\n          'border-radius': borderRadius,\n          'border-width': borderWidth,\n          touch: { padding: touchPadding }\n        }\n      }\n    } = theme;\n    const contrastColor = tryCatch(() => readableColor(color));\n\n    // Base\n    const base = baseStyles(theme);\n\n    // Non-text base\n    const nonTextual = css`\n      position: relative;\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      min-height: ${hitAreaMouse};\n      min-width: ${hitAreaMouse};\n      border: ${borderWidth} solid transparent;\n      border-radius: calc(${baseBorderRadius} * ${borderRadius});\n      -webkit-user-select: none;\n      user-select: none;\n\n      ${!icon &&\n      css`\n        padding: ${padding};\n      `}\n\n      ${icon &&\n      css`\n        border-radius: calc(${baseBorderRadius} * ${borderRadius});\n\n        > svg {\n          display: block;\n        }\n      `}\n\n      ${compact &&\n      css`\n        min-height: ${hitAreaCompact};\n        min-width: ${hitAreaCompact};\n      `}\n\n      @media (pointer: coarse) {\n        border-radius: calc(${baseBorderRadius} * ${borderRadius});\n\n        ${!compact &&\n        css`\n          min-height: ${hitAreaFinger};\n          min-width: ${hitAreaFinger};\n        `}\n\n        ${!icon &&\n        css`\n          padding: ${touchPadding};\n        `}\n      }\n    `;\n\n    // Primary\n    const hoverColors = getHoverColors(color);\n    const hoverPrimaryColor = hoverColors.background;\n    const hoverContrastColor = hoverColors.foreground;\n    const primary = css`\n      --button-background-color: ${color};\n      color: ${contrastColor};\n      background-color: ${color};\n\n      @media (hover: hover) {\n        &:hover {\n          background-color: ${hoverPrimaryColor};\n          color: ${hoverContrastColor};\n          text-decoration: none;\n        }\n      }\n    `;\n\n    // Secondary\n    const backgroundUsable = meetsContrastGuidelines(color, secondaryColor).AA;\n    const usableColor = backgroundUsable ? color : readableHue(color, secondaryColor);\n    const secondaryHoverBackgroundColor = tryCatch(() => mix(0.85, secondaryColor, usableColor));\n    const secondaryHoverForegroundColor = readableHue(\n      usableColor,\n      secondaryHoverBackgroundColor ?? 'transparent'\n    );\n    const secondary = css`\n      --button-background-color: ${secondaryColor};\n      color: ${usableColor};\n      background-color: ${secondaryColor};\n      border-color: ${usableColor};\n\n      @media (hover: hover) {\n        &:hover {\n          color: ${secondaryHoverForegroundColor};\n          background-color: ${secondaryHoverBackgroundColor};\n          text-decoration: none;\n          border-color: ${secondaryHoverForegroundColor};\n        }\n      }\n    `;\n\n    // Simple\n    const simple = css`\n      --button-background-color: ${icon ? 'transparent' : backgroundColor};\n      color: ${icon ? 'currentColor' : color};\n      background-color: ${icon ? 'transparent' : backgroundColor};\n\n      @media (hover: hover) {\n        &:hover {\n          ${icon &&\n          css`\n            ::before {\n              content: '';\n              position: absolute;\n              top: calc(${borderWidth} * -1);\n              bottom: calc(${borderWidth} * -1);\n              left: calc(${borderWidth} * -1);\n              right: calc(${borderWidth} * -1);\n              border-radius: inherit;\n              background-color: currentColor;\n              opacity: 0.15;\n            }\n          `}\n\n          ${!icon &&\n          css`\n            background-color: ${secondaryHoverBackgroundColor};\n            color: ${secondaryHoverForegroundColor};\n            border-color: ${secondaryHoverForegroundColor};\n            text-decoration: none;\n          `}\n        }\n      }\n    `;\n\n    return css`\n      ${base}\n      ${nonTextual}\n      ${variant === 'primary' && primary}\n      ${variant === 'secondary' && secondary}\n      ${variant === 'simple' && simple}\n\n      ${loading &&\n      css`\n        ${StyledBackdrop} {\n          background-color: var(--button-background-color);\n          border-radius: inherit;\n        }\n\n        ${StyledProgressRing} {\n          width: 1em;\n          height: 1em;\n\n          ${!icon &&\n          css`\n            margin-inline-end: calc(${spacing} / 2);\n          `}\n\n          circle:nth-child(2) {\n            animation-duration: calc(${speed} * 2);\n          }\n        }\n      `}\n    `;\n  }\n);\n\nStyledButton.defaultProps = defaultThemeProp;\n\nexport const StyledButtonLink = styled.a.withConfig<ButtonPropsWithDefaults>(omitProps('loading'))(\n  ({ theme, variant }) => {\n    const {\n      base: {\n        palette: { 'foreground-color': textColor }\n      },\n      components: {\n        link: { color: linkColor }\n      }\n    } = theme;\n\n    const base = baseStyles(theme);\n\n    const textual = css`\n      background-color: transparent;\n      display: inline;\n      text-align: start;\n      border: none;\n\n      @media (hover: hover) {\n        &:hover {\n          text-decoration: underline;\n        }\n      }\n\n      > ${StyledIcon} {\n        vertical-align: bottom;\n      }\n    `;\n\n    const link = css`\n      color: ${linkColor};\n    `;\n\n    const text = css`\n      color: ${textColor};\n    `;\n\n    return css`\n      ${base}\n      ${textual}\n      ${variant === 'link' && link}\n      ${variant === 'text' && text}\n    `;\n  }\n);\n\nStyledButtonLink.defaultProps = defaultThemeProp;\n\nconst Button: FunctionComponent<ButtonProps & ForwardProps> = forwardRef(function Button(\n  {\n    variant = 'secondary',\n    type = 'button',\n    disabled = false,\n    icon = false,\n    compact = false,\n    href,\n    as,\n    forwardedAs,\n    label,\n    'aria-label': ariaLabel,\n    loading = false,\n    children,\n    ...restProps\n  }: PropsWithoutRef<ButtonProps> & ForwardProps,\n  ref: Ref<HTMLButtonElement>\n) {\n  const [buttonEl, setButtonEl] = useElement();\n  const mouseDownEvent = useRef<MouseEvent>();\n  const buttonRef = useConsolidatedRef<HTMLButtonElement>(ref, setButtonEl);\n  const isTextual = ['link', 'text'].includes(variant);\n  const showProgress = loading && !isTextual;\n  const StyledComp: React.ElementType = isTextual ? StyledButtonLink : StyledButton;\n\n  useEffect(() => {\n    return () => {\n      mouseDownEvent.current = undefined;\n    };\n  }, []);\n\n  return (\n    <>\n      <StyledComp\n        {...restProps}\n        ref={buttonRef}\n        as={as || (href ? 'a' : 'button')}\n        forwardedAs={forwardedAs || (href ? 'a' : 'button')}\n        variant={variant}\n        icon={icon}\n        compact={compact}\n        type={href ? undefined : type}\n        href={href}\n        disabled={disabled && !href}\n        loading={showProgress}\n        aria-label={ariaLabel || label}\n        onMouseDown={(e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n          (restProps.onMouseDown as MouseEventHandler | undefined)?.(e);\n          e.persist();\n          mouseDownEvent.current = e;\n        }}\n        onMouseUp={(e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n          const shouldFocus = mouseDownEvent.current && !mouseDownEvent.current.defaultPrevented;\n          mouseDownEvent.current = undefined;\n\n          if (shouldFocus && buttonRef.current !== document.activeElement) {\n            buttonRef.current?.focus();\n          }\n\n          return (restProps.onMouseUp as MouseEventHandler | undefined)?.(e);\n        }}\n      >\n        {showProgress && <Progress variant='ring' placement='inline' />}\n        {!icon || !showProgress ? children : null}\n      </StyledComp>\n\n      {buttonEl && label && (\n        <Tooltip target={buttonEl} showDelay='none' hideDelay='none' describeTarget={false}>\n          {label}\n        </Tooltip>\n      )}\n    </>\n  );\n});\n\nexport default Button;\n"]}

package/lib/components/Card/Card.d.ts

@@ -1,5 +1,5 @@
-import { FunctionComponent, Ref, ReactNode, MouseEventHandler } from 'react';
-import { ForwardProps, BaseProps, AsProp } from '../../types';
+import type { FunctionComponent, Ref, ReactNode, MouseEventHandler } from 'react';
+import type { ForwardProps, BaseProps, AsProp } from '../../types';
 export interface CardProps extends BaseProps, AsProp {
     /** Components and content for the Card. */
     children?: ReactNode;

package/lib/components/Card/Card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/components/Card/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EACjB,GAAG,EAEH,SAAS,EACT,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAKf,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAK9D,MAAM,WAAW,SAAU,SAAQ,SAAS,EAAE,MAAM;IAClD,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kCAAkC;IAClC,OAAO,CAAC,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;IACzC,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AAED,eAAO,MAAM,UAAU,6HAqCrB,CAAC;AAIH,QAAA,MAAM,IAAI,EAAE,iBAAiB,CAAC,SAAS,GAAG,YAAY,CA6BpD,CAAC;AAEH,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/components/Card/Card.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,GAAG,EAAmB,SAAS,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAKnG,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAKnE,MAAM,WAAW,SAAU,SAAQ,SAAS,EAAE,MAAM;IAClD,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kCAAkC;IAClC,OAAO,CAAC,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;IACzC,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AAED,eAAO,MAAM,UAAU,6HAqCrB,CAAC;AAIH,QAAA,MAAM,IAAI,EAAE,iBAAiB,CAAC,SAAS,GAAG,YAAY,CA6BpD,CAAC;AAEH,eAAe,IAAI,CAAC"}

package/lib/components/Card/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/components/Card/Card.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EAMX,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,IAAI,MAAM,SAAS,CAAC;AAE3B,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAE3C,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAiB9C,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAqB,KAAK,CAAC,EAAE;IACnE,MAAM,EACJ,eAAe,EAAE,YAAY,EAC7B,cAAc,EAAE,WAAW,EAC3B,UAAU,EACX,GAAG,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC;IAChC,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW;QACnC,CAAC,CAAC,GAAG,CAAA;;;wCAG+B,WAAW;;;;uCAIZ,WAAW;;OAE3C;QACH,CAAC,CAAC,SAAS,CAAC;IAEd,OAAO,GAAG,CAAA;MACN,aAAa;0BACO,UAAU;uBACb,YAAY;;;;;;QAM3B,WAAW;;QAEX,eAAe;;2BAEI,YAAY,IAAI,YAAY;;;;GAIpD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,IAAI,GAAgD,UAAU,CAAC,SAAS,IAAI,CAChF,EAAE,QAAQ,EAAE,EAAE,EAAE,OAAO,EAAE,WAAW,GAAG,KAAK,EAAE,GAAG,SAAS,EAA8B,EACxF,GAAqB;IAErB,MAAM,gBAAgB,GAAG;QACvB,GAAG,CAAC,OAAO,IAAI;YACb,OAAO;YACP,QAAQ,EAAE,CAAC;YACX,IAAI,EAAE,QAAQ;SACf,CAAC;QACF,GAAG,CAAC,WAAW,IAAI;YACjB,QAAQ,EAAE,CAAC;SACZ,CAAC;QACF,WAAW;KACZ,CAAC;IAEF,OAAO,CACL,KAAC,IAAI,IACH,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAClC,EAAE,EAAE,UAAU,EACd,WAAW,EAAE,EAAE,EACf,GAAG,EAAE,GAAG,KACJ,gBAAgB,KAChB,SAAS,YAEZ,QAAQ,GACJ,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,IAAI,CAAC","sourcesContent":["import {\n  forwardRef,\n  FunctionComponent,\n  Ref,\n  PropsWithoutRef,\n  ReactNode,\n  MouseEventHandler\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport Flex from '../Flex';\nimport { ForwardProps, BaseProps, AsProp } from '../../types';\nimport { StyledPopover } from '../Popover';\n\nimport { StyledCardMedia } from './CardMedia';\n\nexport interface CardProps extends BaseProps, AsProp {\n  /** Components and content for the Card. */\n  children?: ReactNode;\n  /**\n   * Enables the focus, hover, and active styles.\n   * @default false\n   * @deprecated\n   */\n  interactive?: boolean;\n  /** Callback for onClick event. */\n  onClick?: MouseEventHandler<HTMLElement>;\n  /** Ref forwarded to the wrapping element. */\n  ref?: Ref<HTMLElement>;\n}\n\nexport const StyledCard = styled.article<Partial<CardProps>>(props => {\n  const {\n    'border-radius': borderRadius,\n    'border-color': borderColor,\n    background\n  } = props.theme.components.card;\n  const interactive = props.interactive\n    ? css`\n        &:hover {\n          border: 0;\n          box-shadow: 0 0 0 0.0625rem ${borderColor};\n        }\n        &:focus {\n          border: 0;\n          box-shadow: 0 0 0 0.125rem ${borderColor};\n        }\n      `\n    : undefined;\n\n  return css`\n    ${StyledPopover} &, &:not(& &) {\n      background-color: ${background};\n      border-radius: ${borderRadius};\n\n      &:focus {\n        outline: none;\n      }\n\n      ${interactive}\n\n      ${StyledCardMedia} {\n        &:first-child img {\n          border-radius: ${borderRadius} ${borderRadius} 0 0;\n        }\n      }\n    }\n  `;\n});\n\nStyledCard.defaultProps = defaultThemeProp;\n\nconst Card: FunctionComponent<CardProps & ForwardProps> = forwardRef(function Card(\n  { children, as, onClick, interactive = false, ...restProps }: PropsWithoutRef<CardProps>,\n  ref: CardProps['ref']\n) {\n  const interactiveProps = {\n    ...(onClick && {\n      onClick,\n      tabIndex: 0,\n      role: 'button'\n    }),\n    ...(interactive && {\n      tabIndex: 0\n    }),\n    interactive\n  };\n\n  return (\n    <Flex\n      role='none'\n      container={{ direction: 'column' }}\n      as={StyledCard}\n      forwardedAs={as}\n      ref={ref}\n      {...interactiveProps}\n      {...restProps}\n    >\n      {children}\n    </Flex>\n  );\n});\n\nexport default Card;\n"]}
+{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/components/Card/Card.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,IAAI,MAAM,SAAS,CAAC;AAE3B,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAE3C,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAiB9C,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAqB,KAAK,CAAC,EAAE;IACnE,MAAM,EACJ,eAAe,EAAE,YAAY,EAC7B,cAAc,EAAE,WAAW,EAC3B,UAAU,EACX,GAAG,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC;IAChC,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW;QACnC,CAAC,CAAC,GAAG,CAAA;;;wCAG+B,WAAW;;;;uCAIZ,WAAW;;OAE3C;QACH,CAAC,CAAC,SAAS,CAAC;IAEd,OAAO,GAAG,CAAA;MACN,aAAa;0BACO,UAAU;uBACb,YAAY;;;;;;QAM3B,WAAW;;QAEX,eAAe;;2BAEI,YAAY,IAAI,YAAY;;;;GAIpD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,IAAI,GAAgD,UAAU,CAAC,SAAS,IAAI,CAChF,EAAE,QAAQ,EAAE,EAAE,EAAE,OAAO,EAAE,WAAW,GAAG,KAAK,EAAE,GAAG,SAAS,EAA8B,EACxF,GAAqB;IAErB,MAAM,gBAAgB,GAAG;QACvB,GAAG,CAAC,OAAO,IAAI;YACb,OAAO;YACP,QAAQ,EAAE,CAAC;YACX,IAAI,EAAE,QAAQ;SACf,CAAC;QACF,GAAG,CAAC,WAAW,IAAI;YACjB,QAAQ,EAAE,CAAC;SACZ,CAAC;QACF,WAAW;KACZ,CAAC;IAEF,OAAO,CACL,KAAC,IAAI,IACH,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAClC,EAAE,EAAE,UAAU,EACd,WAAW,EAAE,EAAE,EACf,GAAG,EAAE,GAAG,KACJ,gBAAgB,KAChB,SAAS,YAEZ,QAAQ,GACJ,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,IAAI,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { FunctionComponent, Ref, PropsWithoutRef, ReactNode, MouseEventHandler } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport Flex from '../Flex';\nimport type { ForwardProps, BaseProps, AsProp } from '../../types';\nimport { StyledPopover } from '../Popover';\n\nimport { StyledCardMedia } from './CardMedia';\n\nexport interface CardProps extends BaseProps, AsProp {\n  /** Components and content for the Card. */\n  children?: ReactNode;\n  /**\n   * Enables the focus, hover, and active styles.\n   * @default false\n   * @deprecated\n   */\n  interactive?: boolean;\n  /** Callback for onClick event. */\n  onClick?: MouseEventHandler<HTMLElement>;\n  /** Ref forwarded to the wrapping element. */\n  ref?: Ref<HTMLElement>;\n}\n\nexport const StyledCard = styled.article<Partial<CardProps>>(props => {\n  const {\n    'border-radius': borderRadius,\n    'border-color': borderColor,\n    background\n  } = props.theme.components.card;\n  const interactive = props.interactive\n    ? css`\n        &:hover {\n          border: 0;\n          box-shadow: 0 0 0 0.0625rem ${borderColor};\n        }\n        &:focus {\n          border: 0;\n          box-shadow: 0 0 0 0.125rem ${borderColor};\n        }\n      `\n    : undefined;\n\n  return css`\n    ${StyledPopover} &, &:not(& &) {\n      background-color: ${background};\n      border-radius: ${borderRadius};\n\n      &:focus {\n        outline: none;\n      }\n\n      ${interactive}\n\n      ${StyledCardMedia} {\n        &:first-child img {\n          border-radius: ${borderRadius} ${borderRadius} 0 0;\n        }\n      }\n    }\n  `;\n});\n\nStyledCard.defaultProps = defaultThemeProp;\n\nconst Card: FunctionComponent<CardProps & ForwardProps> = forwardRef(function Card(\n  { children, as, onClick, interactive = false, ...restProps }: PropsWithoutRef<CardProps>,\n  ref: CardProps['ref']\n) {\n  const interactiveProps = {\n    ...(onClick && {\n      onClick,\n      tabIndex: 0,\n      role: 'button'\n    }),\n    ...(interactive && {\n      tabIndex: 0\n    }),\n    interactive\n  };\n\n  return (\n    <Flex\n      role='none'\n      container={{ direction: 'column' }}\n      as={StyledCard}\n      forwardedAs={as}\n      ref={ref}\n      {...interactiveProps}\n      {...restProps}\n    >\n      {children}\n    </Flex>\n  );\n});\n\nexport default Card;\n"]}

package/lib/components/Card/CardContent.d.ts

@@ -1,6 +1,6 @@
-import { FunctionComponent, ReactNode } from 'react';
-import { BaseProps, ExcludeStrict, ForwardProps } from '../../types';
-import { FlexProps } from '../Flex';
+import type { FunctionComponent, ReactNode } from 'react';
+import type { BaseProps, ExcludeStrict, ForwardProps } from '../../types';
+import type { FlexProps } from '../Flex';
 export interface CardContentProps extends BaseProps {
     /** The content of the Card. */
     children: ReactNode;

package/lib/components/Card/CardContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardContent.d.ts","sourceRoot":"","sources":["../../../src/components/Card/CardContent.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAqB,SAAS,EAAE,MAAM,OAAO,CAAC;AAIxE,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AACrE,OAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAM1C,MAAM,WAAW,gBAAiB,SAAQ,SAAS;IACjD,+BAA+B;IAC/B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,IAAI,CAAC,CAAC;CACzD;AAED,eAAO,MAAM,iBAAiB,yGAY5B,CAAC;AAIH,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,CAUnE,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"CardContent.d.ts","sourceRoot":"","sources":["../../../src/components/Card/CardContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAqB,SAAS,EAAE,MAAM,OAAO,CAAC;AAI7E,OAAO,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE1E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAMzC,MAAM,WAAW,gBAAiB,SAAQ,SAAS;IACjD,+BAA+B;IAC/B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,IAAI,CAAC,CAAC;CACzD;AAED,eAAO,MAAM,iBAAiB,yGAY5B,CAAC;AAIH,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,CAUnE,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/lib/components/Card/CardContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardContent.js","sourceRoot":"","sources":["../../../src/components/Card/CardContent.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,IAAmB,MAAM,SAAS,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAE3C,OAAO,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AACpC,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAQhD,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxD,OAAO,GAAG,CAAA;MACN,aAAa,aAAa,UAAU,IAAI,UAAU;;4BAE5B,KAAK,CAAC,IAAI,CAAC,OAAO,UAAU,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,OAAO;;;YAGzE,gBAAgB;;;;GAIzB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,WAAW,GAAuD,CAAC,EACvE,QAAQ,EACR,SAAS,EACT,GAAG,SAAS,EACuC,EAAE,EAAE;IACvD,OAAO,CACL,KAAC,IAAI,OAAK,SAAS,EAAE,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,EAAE,EAAE,EAAE,iBAAiB,YACzF,QAAQ,GACJ,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { FunctionComponent, PropsWithChildren, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { BaseProps, ExcludeStrict, ForwardProps } from '../../types';\nimport Flex, { FlexProps } from '../Flex';\nimport { StyledPopover } from '../Popover';\n\nimport { StyledCard } from './Card';\nimport { StyledCardFooter } from './CardFooter';\n\nexport interface CardContentProps extends BaseProps {\n  /** The content of the Card. */\n  children: ReactNode;\n  container?: ExcludeStrict<FlexProps['container'], true>;\n}\n\nexport const StyledCardContent = styled.div(({ theme }) => {\n  return css`\n    ${StyledPopover} &, &:not(${StyledCard} ${StyledCard} > &) {\n      position: relative;\n      padding: calc(1.5 * ${theme.base.spacing}) calc(${theme.components.card.padding} * 2);\n\n      & + &,\n      & + ${StyledCardFooter} {\n        padding-block-start: 0;\n      }\n    }\n  `;\n});\n\nStyledCardContent.defaultProps = defaultThemeProp;\n\nconst CardContent: FunctionComponent<CardContentProps & ForwardProps> = ({\n  children,\n  container,\n  ...restProps\n}: PropsWithChildren<CardContentProps & ForwardProps>) => {\n  return (\n    <Flex {...restProps} container={{ direction: 'column', ...container }} as={StyledCardContent}>\n      {children}\n    </Flex>\n  );\n};\n\nexport default CardContent;\n"]}
+{"version":3,"file":"CardContent.js","sourceRoot":"","sources":["../../../src/components/Card/CardContent.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,IAAI,MAAM,SAAS,CAAC;AAE3B,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAE3C,OAAO,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AACpC,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAQhD,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxD,OAAO,GAAG,CAAA;MACN,aAAa,aAAa,UAAU,IAAI,UAAU;;4BAE5B,KAAK,CAAC,IAAI,CAAC,OAAO,UAAU,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,OAAO;;;YAGzE,gBAAgB;;;;GAIzB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,WAAW,GAAuD,CAAC,EACvE,QAAQ,EACR,SAAS,EACT,GAAG,SAAS,EACuC,EAAE,EAAE;IACvD,OAAO,CACL,KAAC,IAAI,OAAK,SAAS,EAAE,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,EAAE,EAAE,EAAE,iBAAiB,YACzF,QAAQ,GACJ,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import type { FunctionComponent, PropsWithChildren, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport type { BaseProps, ExcludeStrict, ForwardProps } from '../../types';\nimport Flex from '../Flex';\nimport type { FlexProps } from '../Flex';\nimport { StyledPopover } from '../Popover';\n\nimport { StyledCard } from './Card';\nimport { StyledCardFooter } from './CardFooter';\n\nexport interface CardContentProps extends BaseProps {\n  /** The content of the Card. */\n  children: ReactNode;\n  container?: ExcludeStrict<FlexProps['container'], true>;\n}\n\nexport const StyledCardContent = styled.div(({ theme }) => {\n  return css`\n    ${StyledPopover} &, &:not(${StyledCard} ${StyledCard} > &) {\n      position: relative;\n      padding: calc(1.5 * ${theme.base.spacing}) calc(${theme.components.card.padding} * 2);\n\n      & + &,\n      & + ${StyledCardFooter} {\n        padding-block-start: 0;\n      }\n    }\n  `;\n});\n\nStyledCardContent.defaultProps = defaultThemeProp;\n\nconst CardContent: FunctionComponent<CardContentProps & ForwardProps> = ({\n  children,\n  container,\n  ...restProps\n}: PropsWithChildren<CardContentProps & ForwardProps>) => {\n  return (\n    <Flex {...restProps} container={{ direction: 'column', ...container }} as={StyledCardContent}>\n      {children}\n    </Flex>\n  );\n};\n\nexport default CardContent;\n"]}

package/lib/components/Card/CardFooter.d.ts

@@ -1,6 +1,6 @@
-import { FunctionComponent } from 'react';
-import { FlexContainerProps } from '../Flex';
-import { BaseProps, ForwardProps } from '../../types';
+import type { FunctionComponent } from 'react';
+import type { FlexContainerProps } from '../Flex';
+import type { BaseProps, ForwardProps } from '../../types';
 export interface CardFooterProps extends BaseProps {
     /** [justify-content](https://css-tricks.com/almanac/properties/j/justify-content/) */
     justify?: FlexContainerProps['justify'];

package/lib/components/Card/CardFooter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardFooter.d.ts","sourceRoot":"","sources":["../../../src/components/Card/CardFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAqB,MAAM,OAAO,CAAC;AAI7D,OAAa,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAKtD,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD,sFAAsF;IACtF,OAAO,CAAC,EAAE,kBAAkB,CAAC,SAAS,CAAC,CAAC;CACzC;AAED,eAAO,MAAM,gBAAgB,4GAM3B,CAAC;AAIH,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CAkBjE,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"CardFooter.d.ts","sourceRoot":"","sources":["../../../src/components/Card/CardFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAqB,MAAM,OAAO,CAAC;AAKlE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAClD,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAK3D,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD,sFAAsF;IACtF,OAAO,CAAC,EAAE,kBAAkB,CAAC,SAAS,CAAC,CAAC;CACzC;AAED,eAAO,MAAM,gBAAgB,4GAM3B,CAAC;AAIH,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CAkBjE,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/lib/components/Card/CardFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardFooter.js","sourceRoot":"","sources":["../../../src/components/Card/CardFooter.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,IAA4B,MAAM,SAAS,CAAC;AAEnD,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAE3C,OAAO,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAOpC,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC1D,OAAO,GAAG,CAAA;MACN,aAAa,aAAa,UAAU,IAAI,UAAU;4BAC5B,KAAK,CAAC,IAAI,CAAC,OAAO,UAAU,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,OAAO;;GAElF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,UAAU,GAAsD,CACpE,KAAyC,EACzC,EAAE;IACF,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAElD,OAAO,CACL,KAAC,IAAI,IACH,EAAE,EAAE,gBAAgB,EACpB,SAAS,EAAE;YACT,IAAI,EAAE,MAAM;YACZ,UAAU,EAAE,QAAQ;YACpB,OAAO;SACR,KACG,SAAS,YAEZ,QAAQ,GACJ,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import { FunctionComponent, PropsWithChildren } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport Flex, { FlexContainerProps } from '../Flex';\nimport { BaseProps, ForwardProps } from '../../types';\nimport { StyledPopover } from '../Popover';\n\nimport { StyledCard } from './Card';\n\nexport interface CardFooterProps extends BaseProps {\n  /** [justify-content](https://css-tricks.com/almanac/properties/j/justify-content/) */\n  justify?: FlexContainerProps['justify'];\n}\n\nexport const StyledCardFooter = styled.footer(({ theme }) => {\n  return css`\n    ${StyledPopover} &, &:not(${StyledCard} ${StyledCard} > &) {\n      padding: calc(1.5 * ${theme.base.spacing}) calc(${theme.components.card.padding} * 2);\n    }\n  `;\n});\n\nStyledCardFooter.defaultProps = defaultThemeProp;\n\nconst CardFooter: FunctionComponent<CardFooterProps & ForwardProps> = (\n  props: PropsWithChildren<CardFooterProps>\n) => {\n  const { children, justify, ...restProps } = props;\n\n  return (\n    <Flex\n      as={StyledCardFooter}\n      container={{\n        wrap: 'wrap',\n        alignItems: 'center',\n        justify\n      }}\n      {...restProps}\n    >\n      {children}\n    </Flex>\n  );\n};\n\nexport default CardFooter;\n"]}
+{"version":3,"file":"CardFooter.js","sourceRoot":"","sources":["../../../src/components/Card/CardFooter.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,IAAI,MAAM,SAAS,CAAC;AAG3B,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAE3C,OAAO,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAOpC,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC1D,OAAO,GAAG,CAAA;MACN,aAAa,aAAa,UAAU,IAAI,UAAU;4BAC5B,KAAK,CAAC,IAAI,CAAC,OAAO,UAAU,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,OAAO;;GAElF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,UAAU,GAAsD,CACpE,KAAyC,EACzC,EAAE;IACF,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAElD,OAAO,CACL,KAAC,IAAI,IACH,EAAE,EAAE,gBAAgB,EACpB,SAAS,EAAE;YACT,IAAI,EAAE,MAAM;YACZ,UAAU,EAAE,QAAQ;YACpB,OAAO;SACR,KACG,SAAS,YAEZ,QAAQ,GACJ,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import type { FunctionComponent, PropsWithChildren } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport Flex from '../Flex';\nimport type { FlexContainerProps } from '../Flex';\nimport type { BaseProps, ForwardProps } from '../../types';\nimport { StyledPopover } from '../Popover';\n\nimport { StyledCard } from './Card';\n\nexport interface CardFooterProps extends BaseProps {\n  /** [justify-content](https://css-tricks.com/almanac/properties/j/justify-content/) */\n  justify?: FlexContainerProps['justify'];\n}\n\nexport const StyledCardFooter = styled.footer(({ theme }) => {\n  return css`\n    ${StyledPopover} &, &:not(${StyledCard} ${StyledCard} > &) {\n      padding: calc(1.5 * ${theme.base.spacing}) calc(${theme.components.card.padding} * 2);\n    }\n  `;\n});\n\nStyledCardFooter.defaultProps = defaultThemeProp;\n\nconst CardFooter: FunctionComponent<CardFooterProps & ForwardProps> = (\n  props: PropsWithChildren<CardFooterProps>\n) => {\n  const { children, justify, ...restProps } = props;\n\n  return (\n    <Flex\n      as={StyledCardFooter}\n      container={{\n        wrap: 'wrap',\n        alignItems: 'center',\n        justify\n      }}\n      {...restProps}\n    >\n      {children}\n    </Flex>\n  );\n};\n\nexport default CardFooter;\n"]}

package/lib/components/Card/CardHeader.d.ts

@@ -1,5 +1,5 @@
-import { FunctionComponent, ReactNode, Ref } from 'react';
-import { BaseProps, ForwardProps } from '../../types';
+import type { FunctionComponent, ReactNode, Ref } from 'react';
+import type { BaseProps, ForwardProps } from '../../types';
 export interface CardHeaderProps extends BaseProps {
     /** The Card header content. */
     children: ReactNode;

package/lib/components/Card/CardHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardHeader.d.ts","sourceRoot":"","sources":["../../../src/components/Card/CardHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAqB,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAKzF,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAMtD,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD,+BAA+B;IAC/B,QAAQ,EAAE,SAAS,CAAC;IACpB,yDAAyD;IACzD,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,gBAAgB,yHAc3B,CAAC;AAIH,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CAyBjE,CAAC;AAGF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"CardHeader.d.ts","sourceRoot":"","sources":["../../../src/components/Card/CardHeader.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAqB,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAKlF,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAM3D,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD,+BAA+B;IAC/B,QAAQ,EAAE,SAAS,CAAC;IACpB,yDAAyD;IACzD,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,gBAAgB,yHAc3B,CAAC;AAIH,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CAyBjE,CAAC;AAGF,eAAe,UAAU,CAAC"}

package/lib/components/Card/CardHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardHeader.js","sourceRoot":"","sources":["../../../src/components/Card/CardHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAwD,MAAM,OAAO,CAAC;AACzF,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,IAAI,MAAM,SAAS,CAAC;AAE3B,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAE3C,OAAO,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AACpC,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAWlD,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAkB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE;IACpF,OAAO,GAAG,CAAA;MACN,aAAa,aAAa,UAAU,IAAI,UAAU;4BAC5B,KAAK,CAAC,IAAI,CAAC,OAAO,UAAU,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,OAAO;;UAE3E,iBAAiB;;;;;UAKjB,OAAO,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,SAAS;;;GAG/C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,UAAU,GAAsD,UAAU,CAC9E,SAAS,UAAU,CACjB,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,SAAS,EAAsC,EACvE,GAA2B;IAE3B,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,EACvD,EAAE,EAAE,gBAAgB,KAChB,SAAS,EACb,GAAG,EAAE,GAAG,YAEP,OAAO,CAAC,CAAC,CAAC,CACT,8BACE,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,YACzD,QAAQ,GACJ,EACP,wBAAM,OAAO,GAAO,IACnB,CACJ,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,GACI,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC;AACtC,eAAe,UAAU,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithChildren, ReactNode, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport Flex from '../Flex';\nimport { BaseProps, ForwardProps } from '../../types';\nimport { StyledPopover } from '../Popover';\n\nimport { StyledCard } from './Card';\nimport { StyledCardContent } from './CardContent';\n\nexport interface CardHeaderProps extends BaseProps {\n  /** The Card header content. */\n  children: ReactNode;\n  /** Action Buttons that will render within the header. */\n  actions?: ReactNode;\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport const StyledCardHeader = styled.header<CardHeaderProps>(({ theme, onClick }) => {\n  return css`\n    ${StyledPopover} &, &:not(${StyledCard} ${StyledCard} > &) {\n      padding: calc(1.5 * ${theme.base.spacing}) calc(${theme.components.card.padding} * 2);\n\n      + ${StyledCardContent} {\n        padding-block-start: 0;\n      }\n\n      &:hover {\n        ${onClick ? 'cursor: pointer;' : undefined}\n      }\n    }\n  `;\n});\n\nStyledCardHeader.defaultProps = defaultThemeProp;\n\nconst CardHeader: FunctionComponent<CardHeaderProps & ForwardProps> = forwardRef(\n  function CardHeader(\n    { children, actions, ...restProps }: PropsWithChildren<CardHeaderProps>,\n    ref: CardHeaderProps['ref']\n  ) {\n    return (\n      <Flex\n        container={{ alignItems: 'center', justify: 'between' }}\n        as={StyledCardHeader}\n        {...restProps}\n        ref={ref}\n      >\n        {actions ? (\n          <>\n            <Flex container={{ alignItems: 'center' }} item={{ grow: 1 }}>\n              {children}\n            </Flex>\n            <div>{actions}</div>\n          </>\n        ) : (\n          children\n        )}\n      </Flex>\n    );\n  }\n);\n\nCardHeader.displayName = 'CardHeader';\nexport default CardHeader;\n"]}
+{"version":3,"file":"CardHeader.js","sourceRoot":"","sources":["../../../src/components/Card/CardHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,IAAI,MAAM,SAAS,CAAC;AAE3B,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAE3C,OAAO,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AACpC,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAWlD,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAkB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE;IACpF,OAAO,GAAG,CAAA;MACN,aAAa,aAAa,UAAU,IAAI,UAAU;4BAC5B,KAAK,CAAC,IAAI,CAAC,OAAO,UAAU,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,OAAO;;UAE3E,iBAAiB;;;;;UAKjB,OAAO,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,SAAS;;;GAG/C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,UAAU,GAAsD,UAAU,CAC9E,SAAS,UAAU,CACjB,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,SAAS,EAAsC,EACvE,GAA2B;IAE3B,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,EACvD,EAAE,EAAE,gBAAgB,KAChB,SAAS,EACb,GAAG,EAAE,GAAG,YAEP,OAAO,CAAC,CAAC,CAAC,CACT,8BACE,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,YACzD,QAAQ,GACJ,EACP,wBAAM,OAAO,GAAO,IACnB,CACJ,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,GACI,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC;AACtC,eAAe,UAAU,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { FunctionComponent, PropsWithChildren, ReactNode, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport Flex from '../Flex';\nimport type { BaseProps, ForwardProps } from '../../types';\nimport { StyledPopover } from '../Popover';\n\nimport { StyledCard } from './Card';\nimport { StyledCardContent } from './CardContent';\n\nexport interface CardHeaderProps extends BaseProps {\n  /** The Card header content. */\n  children: ReactNode;\n  /** Action Buttons that will render within the header. */\n  actions?: ReactNode;\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport const StyledCardHeader = styled.header<CardHeaderProps>(({ theme, onClick }) => {\n  return css`\n    ${StyledPopover} &, &:not(${StyledCard} ${StyledCard} > &) {\n      padding: calc(1.5 * ${theme.base.spacing}) calc(${theme.components.card.padding} * 2);\n\n      + ${StyledCardContent} {\n        padding-block-start: 0;\n      }\n\n      &:hover {\n        ${onClick ? 'cursor: pointer;' : undefined}\n      }\n    }\n  `;\n});\n\nStyledCardHeader.defaultProps = defaultThemeProp;\n\nconst CardHeader: FunctionComponent<CardHeaderProps & ForwardProps> = forwardRef(\n  function CardHeader(\n    { children, actions, ...restProps }: PropsWithChildren<CardHeaderProps>,\n    ref: CardHeaderProps['ref']\n  ) {\n    return (\n      <Flex\n        container={{ alignItems: 'center', justify: 'between' }}\n        as={StyledCardHeader}\n        {...restProps}\n        ref={ref}\n      >\n        {actions ? (\n          <>\n            <Flex container={{ alignItems: 'center' }} item={{ grow: 1 }}>\n              {children}\n            </Flex>\n            <div>{actions}</div>\n          </>\n        ) : (\n          children\n        )}\n      </Flex>\n    );\n  }\n);\n\nCardHeader.displayName = 'CardHeader';\nexport default CardHeader;\n"]}

package/lib/components/Card/CardMedia.d.ts

@@ -1,5 +1,5 @@
-import { FunctionComponent, ReactNode } from 'react';
-import { BaseProps, ForwardProps } from '../../types';
+import type { FunctionComponent, ReactNode } from 'react';
+import type { BaseProps, ForwardProps } from '../../types';
 export interface CardMediaProps extends BaseProps {
     /** The content for the media. */
     children: ReactNode;

package/lib/components/Card/CardMedia.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardMedia.d.ts","sourceRoot":"","sources":["../../../src/components/Card/CardMedia.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIrD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEtD,MAAM,WAAW,cAAe,SAAQ,SAAS;IAC/C,iCAAiC;IACjC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,QAAA,MAAM,eAAe,8HAOpB,CAAC;AAEF,QAAA,MAAM,SAAS,EAAE,iBAAiB,CAAC,cAAc,GAAG,YAAY,CAS/D,CAAC;AAEF,eAAe,SAAS,CAAC;AACzB,OAAO,EAAE,eAAe,EAAE,CAAC"}
+{"version":3,"file":"CardMedia.d.ts","sourceRoot":"","sources":["../../../src/components/Card/CardMedia.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAI1D,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE3D,MAAM,WAAW,cAAe,SAAQ,SAAS;IAC/C,iCAAiC;IACjC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,QAAA,MAAM,eAAe,8HAOpB,CAAC;AAEF,QAAA,MAAM,SAAS,EAAE,iBAAiB,CAAC,cAAc,GAAG,YAAY,CAS/D,CAAC;AAEF,eAAe,SAAS,CAAC;AACzB,OAAO,EAAE,eAAe,EAAE,CAAC"}

package/lib/components/Card/CardMedia.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardMedia.js","sourceRoot":"","sources":["../../../src/components/Card/CardMedia.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,IAAI,MAAM,SAAS,CAAC;AAQ3B,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAyB;;;;;;;CAO1D,CAAC;AAEF,MAAM,SAAS,GAAqD,CAAC,EACnE,QAAQ,EACR,GAAG,SAAS,EACG,EAAE,EAAE;IACnB,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,QAAC,EAAE,EAAE,eAAe,KAAM,SAAS,YAC/C,QAAQ,GACJ,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC;AACzB,OAAO,EAAE,eAAe,EAAE,CAAC","sourcesContent":["import { FunctionComponent, ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport Flex from '../Flex';\nimport { BaseProps, ForwardProps } from '../../types';\n\nexport interface CardMediaProps extends BaseProps {\n  /** The content for the media. */\n  children: ReactNode;\n}\n\nconst StyledCardMedia = styled.div<Partial<CardMediaProps>>`\n  img,\n  video,\n  audio {\n    object-fit: cover;\n    width: 100%;\n  }\n`;\n\nconst CardMedia: FunctionComponent<CardMediaProps & ForwardProps> = ({\n  children,\n  ...restProps\n}: CardMediaProps) => {\n  return (\n    <Flex container as={StyledCardMedia} {...restProps}>\n      {children}\n    </Flex>\n  );\n};\n\nexport default CardMedia;\nexport { StyledCardMedia };\n"]}
+{"version":3,"file":"CardMedia.js","sourceRoot":"","sources":["../../../src/components/Card/CardMedia.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,IAAI,MAAM,SAAS,CAAC;AAQ3B,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAyB;;;;;;;CAO1D,CAAC;AAEF,MAAM,SAAS,GAAqD,CAAC,EACnE,QAAQ,EACR,GAAG,SAAS,EACG,EAAE,EAAE;IACnB,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,QAAC,EAAE,EAAE,eAAe,KAAM,SAAS,YAC/C,QAAQ,GACJ,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC;AACzB,OAAO,EAAE,eAAe,EAAE,CAAC","sourcesContent":["import type { FunctionComponent, ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport Flex from '../Flex';\nimport type { BaseProps, ForwardProps } from '../../types';\n\nexport interface CardMediaProps extends BaseProps {\n  /** The content for the media. */\n  children: ReactNode;\n}\n\nconst StyledCardMedia = styled.div<Partial<CardMediaProps>>`\n  img,\n  video,\n  audio {\n    object-fit: cover;\n    width: 100%;\n  }\n`;\n\nconst CardMedia: FunctionComponent<CardMediaProps & ForwardProps> = ({\n  children,\n  ...restProps\n}: CardMediaProps) => {\n  return (\n    <Flex container as={StyledCardMedia} {...restProps}>\n      {children}\n    </Flex>\n  );\n};\n\nexport default CardMedia;\nexport { StyledCardMedia };\n"]}

package/lib/components/Card/CollapsibleCard.d.ts

@@ -1,5 +1,5 @@
-import { FunctionComponent, ReactElement, ReactNode } from 'react';
-import { CardProps } from './Card';
+import type { FunctionComponent, ReactElement, ReactNode } from 'react';
+import type { CardProps } from './Card';
 export interface CollapsibleCardProps extends CardProps {
     /** The header content. */
     header?: ReactElement;

package/lib/components/Card/CollapsibleCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CollapsibleCard.d.ts","sourceRoot":"","sources":["../../../src/components/Card/CollapsibleCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,YAAY,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;AAShG,OAAa,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAQzC,MAAM,WAAW,oBAAqB,SAAQ,SAAS;IACrD,0BAA0B;IAC1B,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,qDAAqD;IACrD,OAAO,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACxC,0BAA0B;IAC1B,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,2DAA2D;IAC3D,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,SAAS,EAAE,OAAO,CAAA;KAAE,KAAK,IAAI,CAAC;CACpD;AAeD,kBAAkB;AAClB,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,CAgC5D,CAAC;AAIF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"CollapsibleCard.d.ts","sourceRoot":"","sources":["../../../src/components/Card/CollapsibleCard.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,YAAY,EAAE,SAAS,EAAqB,MAAM,OAAO,CAAC;AAU3F,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAQxC,MAAM,WAAW,oBAAqB,SAAQ,SAAS;IACrD,0BAA0B;IAC1B,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,qDAAqD;IACrD,OAAO,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACxC,0BAA0B;IAC1B,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,2DAA2D;IAC3D,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,SAAS,EAAE,OAAO,CAAA;KAAE,KAAK,IAAI,CAAC;CACpD;AAeD,kBAAkB;AAClB,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,CAgC5D,CAAC;AAIF,eAAe,eAAe,CAAC"}

package/lib/components/Card/CollapsibleCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"CollapsibleCard.js","sourceRoot":"","sources":["../../../src/components/Card/CollapsibleCard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAiE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChG,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,aAAa,MAAM,+BAA+B,CAAC;AAC/D,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAE/C,OAAO,IAAmB,MAAM,QAAQ,CAAC;AACzC,OAAO,UAAU,MAAM,cAAc,CAAC;AACtC,OAAO,SAAS,MAAM,aAAa,CAAC;AACpC,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,UAAU,MAAM,cAAc,CAAC;AAEtC,YAAY,CAAC,aAAa,CAAC,CAAC;AAe5B,MAAM,YAAY,GAAkC,EAAE,CAAC;AAEvD,MAAM,kBAAkB,GAAG,MAAM,CAAC,MAAM,CAAyB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;IACxF,OAAO,GAAG,CAAA;qCACyB,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;QACvD,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI;iBACvB,SAAS,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,WAAW;oCACvB,KAAK,CAAC,IAAI,CAAC,OAAO;GACnD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,kBAAkB;AAClB,MAAM,eAAe,GAA4C,CAC/D,KAA8C,EAC9C,EAAE;IACF,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACnF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAElD,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,YAAY,CAAC,CAAC,SAAS,CAAC,CAAC;QACzB,QAAQ,EAAE,CAAC,EAAE,SAAS,EAAE,CAAC,SAAS,EAAE,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,OAAO,CACL,MAAC,IAAI,OAAK,SAAS,aAChB,KAAK,IAAI,KAAC,SAAS,cAAE,KAAK,GAAa,EACxC,MAAC,UAAU,IAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,aACnD,KAAC,kBAAkB,IACjB,EAAE,EAAE,MAAM,EACV,OAAO,EAAC,QAAQ,EAChB,IAAI,QACJ,OAAO,EAAE,cAAc,EACvB,SAAS,EAAE,SAAS,YAEpB,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,GAAG,GACP,EACpB,MAAM,IACI,EACb,MAAC,cAAc,IAAC,SAAS,EAAE,SAAS,aACjC,QAAQ,IAAI,KAAC,WAAW,cAAE,QAAQ,GAAe,EACjD,MAAM,IAAI,KAAC,UAAU,IAAC,OAAO,EAAC,QAAQ,YAAE,MAAM,GAAc,IAC9C,IACZ,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,CAAC,YAAY,GAAG,YAAY,CAAC;AAE5C,eAAe,eAAe,CAAC","sourcesContent":["import { FunctionComponent, ReactElement, ReactNode, PropsWithChildren, useState } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Button from '../Button';\nimport { defaultThemeProp } from '../../theme';\nimport Icon, { registerIcon } from '../Icon';\nimport * as caretDownIcon from '../Icon/icons/caret-down.icon';\nimport ExpandCollapse from '../ExpandCollapse';\n\nimport Card, { CardProps } from './Card';\nimport CardHeader from './CardHeader';\nimport CardMedia from './CardMedia';\nimport CardContent from './CardContent';\nimport CardFooter from './CardFooter';\n\nregisterIcon(caretDownIcon);\n\nexport interface CollapsibleCardProps extends CardProps {\n  /** The header content. */\n  header?: ReactElement;\n  /** Action Buttons that will render in the header. */\n  actions?: ReactElement | ReactElement[];\n  /** The footer content. */\n  footer?: ReactNode;\n  /** CardMedia content that will render above the header. */\n  media?: ReactElement;\n  /** Callback when the Card toggles from collapsed to expanded. */\n  onChange?: (event: { collapsed: boolean }) => void;\n}\n\nconst defaultProps: Partial<CollapsibleCardProps> = {};\n\nconst StyledToggleButton = styled.button<{ collapsed: boolean }>(({ theme, collapsed }) => {\n  return css`\n    transition: transform calc(2 * ${theme.base.animation.speed})\n      ${theme.base.animation.timing.ease};\n    transform: ${collapsed ? 'rotate(-90deg)' : 'rotate(0)'};\n    margin-inline-end: calc(0.5 * ${theme.base.spacing});\n  `;\n});\n\nStyledToggleButton.defaultProps = defaultThemeProp;\n\n/** @deprecated */\nconst CollapsibleCard: FunctionComponent<CollapsibleCardProps> = (\n  props: PropsWithChildren<CollapsibleCardProps>\n) => {\n  const { header, actions, footer, media, onChange, children, ...restProps } = props;\n  const [collapsed, setCollapsed] = useState(false);\n\n  const toggleCollapse = () => {\n    setCollapsed(!collapsed);\n    onChange?.({ collapsed: !collapsed });\n  };\n\n  return (\n    <Card {...restProps}>\n      {media && <CardMedia>{media}</CardMedia>}\n      <CardHeader actions={actions} onClick={toggleCollapse}>\n        <StyledToggleButton\n          as={Button}\n          variant='simple'\n          icon\n          onClick={toggleCollapse}\n          collapsed={collapsed}\n        >\n          <Icon name='caret-down' />\n        </StyledToggleButton>\n        {header}\n      </CardHeader>\n      <ExpandCollapse collapsed={collapsed}>\n        {children && <CardContent>{children}</CardContent>}\n        {footer && <CardFooter justify='center'>{footer}</CardFooter>}\n      </ExpandCollapse>\n    </Card>\n  );\n};\n\nCollapsibleCard.defaultProps = defaultProps;\n\nexport default CollapsibleCard;\n"]}
+{"version":3,"file":"CollapsibleCard.js","sourceRoot":"","sources":["../../../src/components/Card/CollapsibleCard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,aAAa,MAAM,+BAA+B,CAAC;AAC/D,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAE/C,OAAO,IAAI,MAAM,QAAQ,CAAC;AAE1B,OAAO,UAAU,MAAM,cAAc,CAAC;AACtC,OAAO,SAAS,MAAM,aAAa,CAAC;AACpC,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,UAAU,MAAM,cAAc,CAAC;AAEtC,YAAY,CAAC,aAAa,CAAC,CAAC;AAe5B,MAAM,YAAY,GAAkC,EAAE,CAAC;AAEvD,MAAM,kBAAkB,GAAG,MAAM,CAAC,MAAM,CAAyB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;IACxF,OAAO,GAAG,CAAA;qCACyB,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;QACvD,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI;iBACvB,SAAS,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,WAAW;oCACvB,KAAK,CAAC,IAAI,CAAC,OAAO;GACnD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,kBAAkB;AAClB,MAAM,eAAe,GAA4C,CAC/D,KAA8C,EAC9C,EAAE;IACF,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACnF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAElD,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,YAAY,CAAC,CAAC,SAAS,CAAC,CAAC;QACzB,QAAQ,EAAE,CAAC,EAAE,SAAS,EAAE,CAAC,SAAS,EAAE,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,OAAO,CACL,MAAC,IAAI,OAAK,SAAS,aAChB,KAAK,IAAI,KAAC,SAAS,cAAE,KAAK,GAAa,EACxC,MAAC,UAAU,IAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,aACnD,KAAC,kBAAkB,IACjB,EAAE,EAAE,MAAM,EACV,OAAO,EAAC,QAAQ,EAChB,IAAI,QACJ,OAAO,EAAE,cAAc,EACvB,SAAS,EAAE,SAAS,YAEpB,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,GAAG,GACP,EACpB,MAAM,IACI,EACb,MAAC,cAAc,IAAC,SAAS,EAAE,SAAS,aACjC,QAAQ,IAAI,KAAC,WAAW,cAAE,QAAQ,GAAe,EACjD,MAAM,IAAI,KAAC,UAAU,IAAC,OAAO,EAAC,QAAQ,YAAE,MAAM,GAAc,IAC9C,IACZ,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,CAAC,YAAY,GAAG,YAAY,CAAC;AAE5C,eAAe,eAAe,CAAC","sourcesContent":["import { useState } from 'react';\nimport type { FunctionComponent, ReactElement, ReactNode, PropsWithChildren } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Button from '../Button';\nimport { defaultThemeProp } from '../../theme';\nimport Icon, { registerIcon } from '../Icon';\nimport * as caretDownIcon from '../Icon/icons/caret-down.icon';\nimport ExpandCollapse from '../ExpandCollapse';\n\nimport Card from './Card';\nimport type { CardProps } from './Card';\nimport CardHeader from './CardHeader';\nimport CardMedia from './CardMedia';\nimport CardContent from './CardContent';\nimport CardFooter from './CardFooter';\n\nregisterIcon(caretDownIcon);\n\nexport interface CollapsibleCardProps extends CardProps {\n  /** The header content. */\n  header?: ReactElement;\n  /** Action Buttons that will render in the header. */\n  actions?: ReactElement | ReactElement[];\n  /** The footer content. */\n  footer?: ReactNode;\n  /** CardMedia content that will render above the header. */\n  media?: ReactElement;\n  /** Callback when the Card toggles from collapsed to expanded. */\n  onChange?: (event: { collapsed: boolean }) => void;\n}\n\nconst defaultProps: Partial<CollapsibleCardProps> = {};\n\nconst StyledToggleButton = styled.button<{ collapsed: boolean }>(({ theme, collapsed }) => {\n  return css`\n    transition: transform calc(2 * ${theme.base.animation.speed})\n      ${theme.base.animation.timing.ease};\n    transform: ${collapsed ? 'rotate(-90deg)' : 'rotate(0)'};\n    margin-inline-end: calc(0.5 * ${theme.base.spacing});\n  `;\n});\n\nStyledToggleButton.defaultProps = defaultThemeProp;\n\n/** @deprecated */\nconst CollapsibleCard: FunctionComponent<CollapsibleCardProps> = (\n  props: PropsWithChildren<CollapsibleCardProps>\n) => {\n  const { header, actions, footer, media, onChange, children, ...restProps } = props;\n  const [collapsed, setCollapsed] = useState(false);\n\n  const toggleCollapse = () => {\n    setCollapsed(!collapsed);\n    onChange?.({ collapsed: !collapsed });\n  };\n\n  return (\n    <Card {...restProps}>\n      {media && <CardMedia>{media}</CardMedia>}\n      <CardHeader actions={actions} onClick={toggleCollapse}>\n        <StyledToggleButton\n          as={Button}\n          variant='simple'\n          icon\n          onClick={toggleCollapse}\n          collapsed={collapsed}\n        >\n          <Icon name='caret-down' />\n        </StyledToggleButton>\n        {header}\n      </CardHeader>\n      <ExpandCollapse collapsed={collapsed}>\n        {children && <CardContent>{children}</CardContent>}\n        {footer && <CardFooter justify='center'>{footer}</CardFooter>}\n      </ExpandCollapse>\n    </Card>\n  );\n};\n\nCollapsibleCard.defaultProps = defaultProps;\n\nexport default CollapsibleCard;\n"]}

package/lib/components/Checkbox/Checkbox.d.ts

@@ -1,7 +1,7 @@
-import { ChangeEvent, FC } from 'react';
-import { FormControlProps } from '../FormControl';
-import { RadioCheckProps } from '../RadioCheck';
-import { ForwardProps, NoChildrenProp } from '../../types';
+import type { ChangeEvent, FC } from 'react';
+import type { FormControlProps } from '../FormControl';
+import type { RadioCheckProps } from '../RadioCheck';
+import type { ForwardProps, NoChildrenProp } from '../../types';
 export interface CheckboxProps extends NoChildrenProp {
     /**
      * Sets DOM id for the control and associates label element via 'for' attribute.

package/lib/components/Checkbox/Checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,EAAE,EAAmB,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAmB,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAE3D,MAAM,WAAW,aAAc,SAAQ,cAAc;IACnD;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,yEAAyE;IACzE,OAAO,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC;IACrC,oEAAoE;IACpE,cAAc,CAAC,EAAE,eAAe,CAAC,gBAAgB,CAAC,CAAC;IACnD;;;OAGG;IACH,aAAa,CAAC,EAAE,eAAe,CAAC,eAAe,CAAC,CAAC;IACjD,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;CACvD;AAGD,QAAA,MAAM,EAAE,EAAE,EAAE,CAAC,aAAa,GAAG,YAAY,CAKvC,CAAC;AAKH,eAAe,EAAE,CAAC"}
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,EAAE,EAAO,MAAM,OAAO,CAAC;AAElD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAEvD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,KAAK,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAEhE,MAAM,WAAW,aAAc,SAAQ,cAAc;IACnD;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,yEAAyE;IACzE,OAAO,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC;IACrC,oEAAoE;IACpE,cAAc,CAAC,EAAE,eAAe,CAAC,gBAAgB,CAAC,CAAC;IACnD;;;OAGG;IACH,aAAa,CAAC,EAAE,eAAe,CAAC,eAAe,CAAC,CAAC;IACjD,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;CACvD;AAGD,QAAA,MAAM,EAAE,EAAE,EAAE,CAAC,aAAa,GAAG,YAAY,CAKvC,CAAC;AAKH,eAAe,EAAE,CAAC"}

package/lib/components/Checkbox/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAmB,UAAU,EAAO,MAAM,OAAO,CAAC;AAGzD,OAAO,UAA+B,MAAM,eAAe,CAAC;AAgC5D,0FAA0F;AAC1F,MAAM,EAAE,GAAqC,UAAU,CAAC,SAAS,EAAE,CACjE,KAAoB,EACpB,GAA0B;IAE1B,OAAO,KAAC,UAAU,OAAK,KAAK,EAAE,IAAI,EAAC,UAAU,EAAC,GAAG,EAAE,GAAG,GAAI,CAAC;AAC7D,CAAC,CAAC,CAAC;AAEH,oCAAoC;AACpC,EAAE,CAAC,YAAY,GAAG,UAAU,CAAC,YAAY,CAAC;AAE1C,eAAe,EAAE,CAAC","sourcesContent":["import { ChangeEvent, FC, forwardRef, Ref } from 'react';\n\nimport { FormControlProps } from '../FormControl';\nimport RadioCheck, { RadioCheckProps } from '../RadioCheck';\nimport { ForwardProps, NoChildrenProp } from '../../types';\n\nexport interface CheckboxProps extends NoChildrenProp {\n  /**\n   * Sets DOM id for the control and associates label element via 'for' attribute.\n   * If an id is not pass, a random id will be generated for any render.\n   */\n  id?: FormControlProps['id'];\n  /** Pass a string or a fragment with an Icon and string. */\n  label?: FormControlProps['label'];\n  /** Indicate if the field is required. The browser defaults to false. */\n  required?: FormControlProps['required'];\n  /** Disable the control. The browser defaults to false. */\n  disabled?: FormControlProps['disabled'];\n  /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n  name?: FormControlProps['name'];\n  /** Sets checked prop via onChange when using as controlled component. */\n  checked?: RadioCheckProps['checked'];\n  /** Initialize checked prop when using as uncontrolled component. */\n  defaultChecked?: RadioCheckProps['defaultChecked'];\n  /**\n   * Sets Checkbox to an an [indeterminate state](https://css-tricks.com/almanac/selectors/i/indeterminate/#indeterminate-checkboxes).\n   * @default false\n   */\n  indeterminate?: RadioCheckProps['indeterminate'];\n  /** Set visual state based on a validation state. */\n  status?: FormControlProps['status'];\n  /** Callback invoked when this particular checkbox changes selection. */\n  onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n}\n\n// Odd issue with SB doc prop table not being generated when called Checkbox...so using CB\nconst CB: FC<CheckboxProps & ForwardProps> = forwardRef(function CB(\n  props: CheckboxProps,\n  ref: Ref<HTMLInputElement>\n) {\n  return <RadioCheck {...props} type='checkbox' ref={ref} />;\n});\n\n// Adding here for doc purposes only\nCB.defaultProps = RadioCheck.defaultProps;\n\nexport default CB;\n"]}
+{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAInC,OAAO,UAAU,MAAM,eAAe,CAAC;AAiCvC,0FAA0F;AAC1F,MAAM,EAAE,GAAqC,UAAU,CAAC,SAAS,EAAE,CACjE,KAAoB,EACpB,GAA0B;IAE1B,OAAO,KAAC,UAAU,OAAK,KAAK,EAAE,IAAI,EAAC,UAAU,EAAC,GAAG,EAAE,GAAG,GAAI,CAAC;AAC7D,CAAC,CAAC,CAAC;AAEH,oCAAoC;AACpC,EAAE,CAAC,YAAY,GAAG,UAAU,CAAC,YAAY,CAAC;AAE1C,eAAe,EAAE,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { ChangeEvent, FC, Ref } from 'react';\n\nimport type { FormControlProps } from '../FormControl';\nimport RadioCheck from '../RadioCheck';\nimport type { RadioCheckProps } from '../RadioCheck';\nimport type { ForwardProps, NoChildrenProp } from '../../types';\n\nexport interface CheckboxProps extends NoChildrenProp {\n  /**\n   * Sets DOM id for the control and associates label element via 'for' attribute.\n   * If an id is not pass, a random id will be generated for any render.\n   */\n  id?: FormControlProps['id'];\n  /** Pass a string or a fragment with an Icon and string. */\n  label?: FormControlProps['label'];\n  /** Indicate if the field is required. The browser defaults to false. */\n  required?: FormControlProps['required'];\n  /** Disable the control. The browser defaults to false. */\n  disabled?: FormControlProps['disabled'];\n  /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n  name?: FormControlProps['name'];\n  /** Sets checked prop via onChange when using as controlled component. */\n  checked?: RadioCheckProps['checked'];\n  /** Initialize checked prop when using as uncontrolled component. */\n  defaultChecked?: RadioCheckProps['defaultChecked'];\n  /**\n   * Sets Checkbox to an an [indeterminate state](https://css-tricks.com/almanac/selectors/i/indeterminate/#indeterminate-checkboxes).\n   * @default false\n   */\n  indeterminate?: RadioCheckProps['indeterminate'];\n  /** Set visual state based on a validation state. */\n  status?: FormControlProps['status'];\n  /** Callback invoked when this particular checkbox changes selection. */\n  onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n}\n\n// Odd issue with SB doc prop table not being generated when called Checkbox...so using CB\nconst CB: FC<CheckboxProps & ForwardProps> = forwardRef(function CB(\n  props: CheckboxProps,\n  ref: Ref<HTMLInputElement>\n) {\n  return <RadioCheck {...props} type='checkbox' ref={ref} />;\n});\n\n// Adding here for doc purposes only\nCB.defaultProps = RadioCheck.defaultProps;\n\nexport default CB;\n"]}

package/lib/components/ColorPicker/ColorPicker.d.ts

@@ -1,7 +1,7 @@
-import { FC, Ref, MouseEventHandler, ChangeEvent } from 'react';
-import { BaseProps, ForwardProps, NoChildrenProp, TestIdProp } from '../../types';
-import { FormFieldProps } from '../FormField';
-import { FormControlProps } from '../FormControl';
+import type { FC, Ref, MouseEventHandler, ChangeEvent } from 'react';
+import type { BaseProps, ForwardProps, NoChildrenProp, TestIdProp } from '../../types';
+import type { FormFieldProps } from '../FormField';
+import type { FormControlProps } from '../FormControl';
 export interface ColorPickerProps extends BaseProps, NoChildrenProp, TestIdProp {
     /** label for the color picker control */
     label: FormControlProps['label'];

package/lib/components/ColorPicker/ColorPicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker.d.ts","sourceRoot":"","sources":["../../../src/components/ColorPicker/ColorPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,EAAE,EAEF,GAAG,EAGH,iBAAiB,EAEjB,WAAW,EACZ,MAAM,OAAO,CAAC;AAIf,OAAO,EACL,SAAS,EACT,YAAY,EACZ,cAAc,EAEd,UAAU,EACX,MAAM,aAAa,CAAC;AAErB,OAAkB,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAEzD,OAAO,EAAE,gBAAgB,EAAqB,MAAM,gBAAgB,CAAC;AAMrE,MAAM,WAAW,gBAAiB,SAAQ,SAAS,EAAE,cAAc,EAAE,UAAU;IAC7E,yCAAyC;IACzC,KAAK,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACjC;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B;;;OAGG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,6CAA6C;IAC7C,MAAM,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAClC,+EAA+E;IAC/E,cAAc,CAAC,EAAE,cAAc,CAAC,gBAAgB,CAAC,CAAC;IAClD,kEAAkE;IAClE,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAC9B,wCAAwC;IACxC,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,+FAA+F;IAC/F,OAAO,CAAC,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;IAC9C,uCAAuC;IACvC,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED,KAAK,QAAQ,GAAG;IACd,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX,CAAC;AAEF,KAAK,QAAQ,GAAG;IACd,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX,CAAC;AAEF,KAAK,WAAW,GAAG;IACjB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,QAAQ,CAAC;IACd,GAAG,EAAE,QAAQ,CAAC;CACf,CAAC;AAEF,KAAK,kBAAkB,GAAG,CAAC,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;;;;AAoL7F,wBAA+D"}
+{"version":3,"file":"ColorPicker.d.ts","sourceRoot":"","sources":["../../../src/components/ColorPicker/ColorPicker.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,GAAG,EAAmB,iBAAiB,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAItF,OAAO,KAAK,EACV,SAAS,EACT,YAAY,EACZ,cAAc,EAEd,UAAU,EACX,MAAM,aAAa,CAAC;AAGrB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAGnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAMvD,MAAM,WAAW,gBAAiB,SAAQ,SAAS,EAAE,cAAc,EAAE,UAAU;IAC7E,yCAAyC;IACzC,KAAK,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACjC;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B;;;OAGG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,6CAA6C;IAC7C,MAAM,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAClC,+EAA+E;IAC/E,cAAc,CAAC,EAAE,cAAc,CAAC,gBAAgB,CAAC,CAAC;IAClD,kEAAkE;IAClE,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAC9B,wCAAwC;IACxC,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,+FAA+F;IAC/F,OAAO,CAAC,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;IAC9C,uCAAuC;IACvC,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED,KAAK,QAAQ,GAAG;IACd,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX,CAAC;AAEF,KAAK,QAAQ,GAAG;IACd,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX,CAAC;AAEF,KAAK,WAAW,GAAG;IACjB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,QAAQ,CAAC;IACd,GAAG,EAAE,QAAQ,CAAC;CACf,CAAC;AAEF,KAAK,kBAAkB,GAAG,CAAC,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;;;;AAoL7F,wBAA+D"}

package/lib/components/ColorPicker/ColorPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker.js","sourceRoot":"","sources":["../../../src/components/ColorPicker/ColorPicker.tsx"],"names":[],"mappings":";AAAA,OAAO,EAEL,UAAU,EAEV,QAAQ,EAGR,SAAS,EAEV,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAShE,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,SAA6B,MAAM,cAAc,CAAC;AACzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAoB,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACrE,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,kBAAkB,EAAE,MAAM,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEpF,OAAO,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAsE/D,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAClC,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,EAAE,EAAE;IACxB,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC;IAC3C,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC,CAAC;IAErE,OAAO,GAAG,CAAA;QACN,iBAAiB;;;UAGf,CAAC,UAAU;QACb,GAAG,CAAA;;SAEF;;UAEC,CAAC,UAAU;QACb,GAAG,CAAA;gCACqB,KAAK,CAAC,IAAI,CAAC,OAAO;SACzC;;;wBAGe,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;;;;;YAKnC,YAAY;;;2BAGG,IAAI,WAAW,WAAW;;cAEvC,UAAU;QACV,CAAC,CAAC,GAAG,CAAA;gCACa,IAAI,WAAW,WAAW;iBACzC;QACH,CAAC,CAAC,GAAG,CAAA;oCACiB,IAAI,MAAM,WAAW;uCAClB,KAAK,CAAC,IAAI,CAAC,OAAO;uCAClB,WAAW;sBAC5B,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC;iBACrD;;;;qBAII,IAAI;sBACH,IAAI;;;;;;;;;;yBAUD,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC;;;;;;2BAMvB,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC;;;;KAI/C,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,WAAW,GAAwC,UAAU,CAAC,SAAS,WAAW,CACtF,KAAwC,EACxC,GAA4B;IAE5B,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,EACJ,MAAM,EACN,EAAE,GAAG,GAAG,EACR,KAAK,GAAG,SAAS,EACjB,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,UAAU,GAAG,KAAK,EAClB,MAAM,EACN,OAAO,EACP,QAAQ,EACR,aAAa,EACb,cAAc,EACd,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,qBAAqB,CAAC,CAAC;IAE1D,MAAM,QAAQ,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IACzC,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9D,MAAM,eAAe,GAAG,GAAG,EAAE;QAC3B,IAAI,eAAe,EAAE;YACnB,aAAa,EAAE,EAAE,CAAC;SACnB;QAED,kBAAkB,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC,CAAC;IAEF,aAAa,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,EAAE,eAAe,CAAC,CAAC;IAExD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,eAAe,EAAE;YACnB,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;YAC3B,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;SAC5B;IACH,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAEtB,MAAM,eAAe,GAAG,CAAC,CAAgC,EAAE,EAAE;QAC3D,MAAM,KAAK,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QAC7B,MAAM,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC;QACxD,MAAM,EAAE,GAAG,EAAE,CAAC,EAAE,UAAU,EAAE,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC;QAClE,QAAQ,EAAE,CACR;YACE,GAAG,EAAE,KAAK;YACV,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;YAChB,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;SACjB,EACD,CAAC,CACF,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,SAAS,IACR,MAAM,EAAE,OAAO,EACf,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,CAAC,CAAC,SAAS,EACtD,EAAE,EAAE,iBAAiB,EACrB,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,YAE9B,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,EACnC,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,CAAC,CAAC,SAAS,EACrD,EAAE,EAAE,iBAAiB,EACrB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,QAAQ,IAAI,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC,IAAI,CAAC,aAE1E,+BACe,OAAO,CAAC,OAAO,KACxB,SAAS,EACb,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,EACpC,GAAG,EAAE,QAAQ,EACb,YAAY,EAAE,KAAK,EACnB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,eAAe,GACzB,EACF,cAAK,KAAK,EAAE,EAAE,eAAe,EAAE,KAAK,EAAE,GAAI,EACzC,CAAC,UAAU,IAAI,KAAK,IAChB,GACG,CACb,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,WAAW,CAAC,WAAW,EAAE,qBAAqB,CAAC,CAAC","sourcesContent":["import {\n  FC,\n  forwardRef,\n  Ref,\n  useState,\n  PropsWithoutRef,\n  MouseEventHandler,\n  useEffect,\n  ChangeEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { hideVisually, parseToHsl, parseToRgb } from 'polished';\n\nimport {\n  BaseProps,\n  ForwardProps,\n  NoChildrenProp,\n  PropsWithDefaults,\n  TestIdProp\n} from '../../types';\nimport { withTestIds } from '../../utils';\nimport FormField, { FormFieldProps } from '../FormField';\nimport { defaultThemeProp } from '../../theme';\nimport { FormControlProps, StyledFormControl } from '../FormControl';\nimport Flex from '../Flex';\nimport { useConsolidatedRef, useUID, useOuterEvent, useTestIds } from '../../hooks';\n\nimport { getColorPickerTestIds } from './ColorPicker.test-ids';\n\nexport interface ColorPickerProps extends BaseProps, NoChildrenProp, TestIdProp {\n  /** label for the color picker control */\n  label: FormControlProps['label'];\n  /**\n   * Sets DOM id for the control and associates label element via 'for' attribute.\n   * If an id is not passed, a random id will be generated for any render.\n   */\n  id?: FormControlProps['id'];\n  /**\n   * Color picker value in hex\n   * @default '#000000'\n   */\n  value?: FormControlProps['value'];\n  /**\n   * Show color swatch without hex value display.\n   * @default false\n   */\n  swatchOnly?: boolean;\n  /** Indicate if the field is required. The browser defaults to false. */\n  required?: FormControlProps['required'];\n  /** Disable the control. */\n  disabled?: FormControlProps['disabled'];\n  /** Visually hides the label region. */\n  labelHidden?: FormControlProps['labelHidden'];\n  /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n  info?: FormControlProps['info'];\n  /** Set visual state based on a validation state. */\n  status?: FormControlProps['status'];\n  /** Makes the input non editable and non clickable. The browser defaults to false. */\n  readOnly?: FormControlProps['readOnly'];\n  /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n  name?: FormControlProps['name'];\n  /** Layout field elements inline in a row. */\n  inline?: FormFieldProps['inline'];\n  /** Button when clicked will show additional information on the color picker */\n  additionalInfo?: FormFieldProps['additionalInfo'];\n  /** onChange event handler that gets called on change of value. */\n  onChange?: ColorChangeHandler;\n  /** onBeforeClose of the color picker */\n  onBeforeClose?: () => void;\n  /** Called when the underlying input element is clicked. This should be rarely if ever used. */\n  onClick?: MouseEventHandler<HTMLInputElement>;\n  /** Ref placed on the input element. */\n  ref?: Ref<HTMLInputElement>;\n}\n\ntype RGBColor = {\n  r: number;\n  g: number;\n  b: number;\n};\n\ntype HSLColor = {\n  h: number;\n  s: number;\n  l: number;\n};\n\ntype ColorResult = {\n  hex: string;\n  rgb: RGBColor;\n  hsl: HSLColor;\n};\n\ntype ColorChangeHandler = (color: ColorResult, event: ChangeEvent<HTMLInputElement>) => void;\n\ntype ColorPickerPropsWithDefaults = PropsWithDefaults<ColorPickerProps, 'value' | 'swatchOnly'>;\n\nconst StyledColorPicker = styled.div<Pick<ColorPickerPropsWithDefaults, 'swatchOnly'>>(\n  ({ theme, swatchOnly }) => {\n    const size = theme.components.input.height;\n    const borderWidth = theme.components['form-control']['border-width'];\n\n    return css`\n      ${StyledFormControl} {\n        overflow: hidden;\n        text-transform: uppercase;\n        ${!swatchOnly &&\n        css`\n          min-width: 8rem;\n        `}\n\n        ${!swatchOnly &&\n        css`\n          padding-inline-end: ${theme.base.spacing};\n        `}\n\n        &:focus-within {\n          box-shadow: ${theme.base.shadow.focus};\n          border: none;\n        }\n\n        & > input {\n          ${hideVisually}\n\n          & + div {\n            height: calc(${size} - (2 * ${borderWidth}));\n\n            ${swatchOnly\n              ? css`\n                  width: calc(${size} - (2 * ${borderWidth}));\n                `\n              : css`\n                  min-width: calc(${size} - ${borderWidth});\n                  margin-inline-end: ${theme.base.spacing};\n                  border-inline-end: ${borderWidth} solid\n                    ${theme.components['form-control']['border-color']};\n                `}\n          }\n\n          &:focus + div {\n            width: ${size};\n            height: ${size};\n          }\n        }\n\n        & input {\n          height: 2rem !important;\n          min-height: 2rem;\n          color: #000000 !important;\n          background-color: #ffffff !important;\n          font-size: 0.8125rem !important;\n          font-family: ${theme.base['font-family']};\n\n          & + label {\n            font-weight: 600;\n            color: rgba(0, 0, 0, 0.6) !important;\n            font-size: 0.8125rem !important;\n            font-family: ${theme.base['font-family']};\n          }\n        }\n      }\n    `;\n  }\n);\n\nStyledColorPicker.defaultProps = defaultThemeProp;\n\nconst ColorPicker: FC<ColorPickerProps & ForwardProps> = forwardRef(function ColorPicker(\n  props: PropsWithoutRef<ColorPickerProps>,\n  ref: ColorPickerProps['ref']\n) {\n  const uid = useUID();\n  const {\n    testId,\n    id = uid,\n    value = '#000000',\n    label,\n    info,\n    disabled,\n    status,\n    required,\n    readOnly,\n    labelHidden,\n    swatchOnly = false,\n    inline,\n    onClick,\n    onChange,\n    onBeforeClose,\n    additionalInfo,\n    ...restProps\n  } = props;\n\n  const testIds = useTestIds(testId, getColorPickerTestIds);\n\n  const inputRef = useConsolidatedRef(ref);\n  const [showColorPicker, setShowColorPicker] = useState(false);\n\n  const hideColorPicker = () => {\n    if (showColorPicker) {\n      onBeforeClose?.();\n    }\n\n    setShowColorPicker(false);\n  };\n\n  useOuterEvent('mousedown', [inputRef], hideColorPicker);\n\n  useEffect(() => {\n    if (showColorPicker) {\n      inputRef?.current?.focus();\n      inputRef?.current?.click();\n    }\n  }, [showColorPicker]);\n\n  const onChangeHandler = (e: ChangeEvent<HTMLInputElement>) => {\n    const color = e.target.value;\n    const { red: r, green: g, blue: b } = parseToRgb(color);\n    const { hue: h, saturation: s, lightness: l } = parseToHsl(color);\n    onChange?.(\n      {\n        hex: color,\n        rgb: { r, g, b },\n        hsl: { h, s, l }\n      },\n      e\n    );\n  };\n\n  return (\n    <FormField\n      testId={testIds}\n      inline={inline}\n      container={inline ? { justify: 'between' } : undefined}\n      as={StyledColorPicker}\n      id={id}\n      label={label}\n      labelHidden={labelHidden}\n      swatchOnly={swatchOnly}\n      info={info}\n      disabled={disabled}\n      status={status}\n      required={required}\n      additionalInfo={additionalInfo}\n    >\n      <Flex\n        container={{ alignItems: 'center' }}\n        item={swatchOnly ? { alignSelf: 'start' } : undefined}\n        as={StyledFormControl}\n        disabled={disabled}\n        status={status}\n        required={required}\n        readOnly={readOnly}\n        onClick={readOnly || disabled ? undefined : () => setShowColorPicker(true)}\n      >\n        <input\n          data-testid={testIds.control}\n          {...restProps}\n          id={id}\n          type={readOnly ? undefined : 'color'}\n          ref={inputRef}\n          defaultValue={value}\n          disabled={disabled}\n          required={required}\n          readOnly={readOnly}\n          onChange={onChangeHandler}\n        />\n        <div style={{ backgroundColor: value }} />\n        {!swatchOnly && value}\n      </Flex>\n    </FormField>\n  );\n});\n\nexport default withTestIds(ColorPicker, getColorPickerTestIds);\n"]}
+{"version":3,"file":"ColorPicker.js","sourceRoot":"","sources":["../../../src/components/ColorPicker/ColorPicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useEffect } from 'react';\nimport type { FC, Ref, PropsWithoutRef, MouseEventHandler, ChangeEvent } from 'react';\nimport styled, { css } from 'styled-components';\nimport { hideVisually, parseToHsl, parseToRgb } from 'polished';\n\nimport type {\n  BaseProps,\n  ForwardProps,\n  NoChildrenProp,\n  PropsWithDefaults,\n  TestIdProp\n} from '../../types';\nimport { withTestIds } from '../../utils';\nimport FormField from '../FormField';\nimport type { FormFieldProps } from '../FormField';\nimport { defaultThemeProp } from '../../theme';\nimport { StyledFormControl } from '../FormControl';\nimport type { FormControlProps } from '../FormControl';\nimport Flex from '../Flex';\nimport { useConsolidatedRef, useUID, useOuterEvent, useTestIds } from '../../hooks';\n\nimport { getColorPickerTestIds } from './ColorPicker.test-ids';\n\nexport interface ColorPickerProps extends BaseProps, NoChildrenProp, TestIdProp {\n  /** label for the color picker control */\n  label: FormControlProps['label'];\n  /**\n   * Sets DOM id for the control and associates label element via 'for' attribute.\n   * If an id is not passed, a random id will be generated for any render.\n   */\n  id?: FormControlProps['id'];\n  /**\n   * Color picker value in hex\n   * @default '#000000'\n   */\n  value?: FormControlProps['value'];\n  /**\n   * Show color swatch without hex value display.\n   * @default false\n   */\n  swatchOnly?: boolean;\n  /** Indicate if the field is required. The browser defaults to false. */\n  required?: FormControlProps['required'];\n  /** Disable the control. */\n  disabled?: FormControlProps['disabled'];\n  /** Visually hides the label region. */\n  labelHidden?: FormControlProps['labelHidden'];\n  /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n  info?: FormControlProps['info'];\n  /** Set visual state based on a validation state. */\n  status?: FormControlProps['status'];\n  /** Makes the input non editable and non clickable. The browser defaults to false. */\n  readOnly?: FormControlProps['readOnly'];\n  /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n  name?: FormControlProps['name'];\n  /** Layout field elements inline in a row. */\n  inline?: FormFieldProps['inline'];\n  /** Button when clicked will show additional information on the color picker */\n  additionalInfo?: FormFieldProps['additionalInfo'];\n  /** onChange event handler that gets called on change of value. */\n  onChange?: ColorChangeHandler;\n  /** onBeforeClose of the color picker */\n  onBeforeClose?: () => void;\n  /** Called when the underlying input element is clicked. This should be rarely if ever used. */\n  onClick?: MouseEventHandler<HTMLInputElement>;\n  /** Ref placed on the input element. */\n  ref?: Ref<HTMLInputElement>;\n}\n\ntype RGBColor = {\n  r: number;\n  g: number;\n  b: number;\n};\n\ntype HSLColor = {\n  h: number;\n  s: number;\n  l: number;\n};\n\ntype ColorResult = {\n  hex: string;\n  rgb: RGBColor;\n  hsl: HSLColor;\n};\n\ntype ColorChangeHandler = (color: ColorResult, event: ChangeEvent<HTMLInputElement>) => void;\n\ntype ColorPickerPropsWithDefaults = PropsWithDefaults<ColorPickerProps, 'value' | 'swatchOnly'>;\n\nconst StyledColorPicker = styled.div<Pick<ColorPickerPropsWithDefaults, 'swatchOnly'>>(\n  ({ theme, swatchOnly }) => {\n    const size = theme.components.input.height;\n    const borderWidth = theme.components['form-control']['border-width'];\n\n    return css`\n      ${StyledFormControl} {\n        overflow: hidden;\n        text-transform: uppercase;\n        ${!swatchOnly &&\n        css`\n          min-width: 8rem;\n        `}\n\n        ${!swatchOnly &&\n        css`\n          padding-inline-end: ${theme.base.spacing};\n        `}\n\n        &:focus-within {\n          box-shadow: ${theme.base.shadow.focus};\n          border: none;\n        }\n\n        & > input {\n          ${hideVisually}\n\n          & + div {\n            height: calc(${size} - (2 * ${borderWidth}));\n\n            ${swatchOnly\n              ? css`\n                  width: calc(${size} - (2 * ${borderWidth}));\n                `\n              : css`\n                  min-width: calc(${size} - ${borderWidth});\n                  margin-inline-end: ${theme.base.spacing};\n                  border-inline-end: ${borderWidth} solid\n                    ${theme.components['form-control']['border-color']};\n                `}\n          }\n\n          &:focus + div {\n            width: ${size};\n            height: ${size};\n          }\n        }\n\n        & input {\n          height: 2rem !important;\n          min-height: 2rem;\n          color: #000000 !important;\n          background-color: #ffffff !important;\n          font-size: 0.8125rem !important;\n          font-family: ${theme.base['font-family']};\n\n          & + label {\n            font-weight: 600;\n            color: rgba(0, 0, 0, 0.6) !important;\n            font-size: 0.8125rem !important;\n            font-family: ${theme.base['font-family']};\n          }\n        }\n      }\n    `;\n  }\n);\n\nStyledColorPicker.defaultProps = defaultThemeProp;\n\nconst ColorPicker: FC<ColorPickerProps & ForwardProps> = forwardRef(function ColorPicker(\n  props: PropsWithoutRef<ColorPickerProps>,\n  ref: ColorPickerProps['ref']\n) {\n  const uid = useUID();\n  const {\n    testId,\n    id = uid,\n    value = '#000000',\n    label,\n    info,\n    disabled,\n    status,\n    required,\n    readOnly,\n    labelHidden,\n    swatchOnly = false,\n    inline,\n    onClick,\n    onChange,\n    onBeforeClose,\n    additionalInfo,\n    ...restProps\n  } = props;\n\n  const testIds = useTestIds(testId, getColorPickerTestIds);\n\n  const inputRef = useConsolidatedRef(ref);\n  const [showColorPicker, setShowColorPicker] = useState(false);\n\n  const hideColorPicker = () => {\n    if (showColorPicker) {\n      onBeforeClose?.();\n    }\n\n    setShowColorPicker(false);\n  };\n\n  useOuterEvent('mousedown', [inputRef], hideColorPicker);\n\n  useEffect(() => {\n    if (showColorPicker) {\n      inputRef?.current?.focus();\n      inputRef?.current?.click();\n    }\n  }, [showColorPicker]);\n\n  const onChangeHandler = (e: ChangeEvent<HTMLInputElement>) => {\n    const color = e.target.value;\n    const { red: r, green: g, blue: b } = parseToRgb(color);\n    const { hue: h, saturation: s, lightness: l } = parseToHsl(color);\n    onChange?.(\n      {\n        hex: color,\n        rgb: { r, g, b },\n        hsl: { h, s, l }\n      },\n      e\n    );\n  };\n\n  return (\n    <FormField\n      testId={testIds}\n      inline={inline}\n      container={inline ? { justify: 'between' } : undefined}\n      as={StyledColorPicker}\n      id={id}\n      label={label}\n      labelHidden={labelHidden}\n      swatchOnly={swatchOnly}\n      info={info}\n      disabled={disabled}\n      status={status}\n      required={required}\n      additionalInfo={additionalInfo}\n    >\n      <Flex\n        container={{ alignItems: 'center' }}\n        item={swatchOnly ? { alignSelf: 'start' } : undefined}\n        as={StyledFormControl}\n        disabled={disabled}\n        status={status}\n        required={required}\n        readOnly={readOnly}\n        onClick={readOnly || disabled ? undefined : () => setShowColorPicker(true)}\n      >\n        <input\n          data-testid={testIds.control}\n          {...restProps}\n          id={id}\n          type={readOnly ? undefined : 'color'}\n          ref={inputRef}\n          defaultValue={value}\n          disabled={disabled}\n          required={required}\n          readOnly={readOnly}\n          onChange={onChangeHandler}\n        />\n        <div style={{ backgroundColor: value }} />\n        {!swatchOnly && value}\n      </Flex>\n    </FormField>\n  );\n});\n\nexport default withTestIds(ColorPicker, getColorPickerTestIds);\n"]}

package/lib/components/ComboBox/ComboBox.d.ts

@@ -1,6 +1,6 @@
-import { FunctionComponent } from 'react';
-import { ForwardProps } from '../../types';
-import ComboBoxProps from './ComboBox.types';
+import type { FunctionComponent } from 'react';
+import type { ForwardProps } from '../../types';
+import type ComboBoxProps from './ComboBox.types';
 declare const _default: FunctionComponent<ComboBoxProps & ForwardProps> & {
     getTestIds: (testIdProp?: string | undefined) => import("../../types").TestIdsRecord<readonly ["control", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
 };

package/lib/components/ComboBox/ComboBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ComboBox.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EASlB,MAAM,OAAO,CAAC;AAKf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAsB3C,OAAO,aAAa,MAAM,kBAAkB,CAAC;;;;AA2T7C,wBAAyD"}
+{"version":3,"file":"ComboBox.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,iBAAiB,EAKlB,MAAM,OAAO,CAAC;AAKf,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAuBhD,OAAO,KAAK,aAAa,MAAM,kBAAkB,CAAC;;;;AAoWlD,wBAAyD"}