@salt-ds/core 1.48.0 → 1.50.0

package/dist-es/accordion/AccordionContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionContext.js","sources":["../src/accordion/AccordionContext.ts"],"sourcesContent":["import { type SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\n\nexport interface AccordionContextValue {\n  value: string;\n  expanded: boolean;\n  toggle: (event: SyntheticEvent<HTMLButtonElement>) => void;\n  disabled: boolean;\n  indicatorSide: \"left\" | \"right\";\n  headerId: string;\n  setHeaderId: (id: string) => void;\n  panelId: string;\n  setPanelId: (id: string) => void;\n  status?: \"error\" | \"warning\" | \"success\";\n}\n\nexport const AccordionContext = createContext<AccordionContextValue>(\n  \"AccordionContext\",\n  {\n    value: \"\",\n    expanded: false,\n    toggle: () => undefined,\n    disabled: false,\n    indicatorSide: \"left\",\n    headerId: \"\",\n    setHeaderId: () => undefined,\n    panelId: \"\",\n    setPanelId: () => undefined,\n  },\n);\n\nexport function useAccordion() {\n  return useContext(AccordionContext);\n}\n"],"names":[],"mappings":";;;;;;;;;AAgBO,MAAM,gBAAmB,GAAA,aAAA;AAAA,EAC9B,kBAAA;AAAA,EACA;AAAA,IACE,KAAO,EAAA,EAAA;AAAA,IACP,QAAU,EAAA,KAAA;AAAA,IACV,QAAQ,MAAM,MAAA;AAAA,IACd,QAAU,EAAA,KAAA;AAAA,IACV,aAAe,EAAA,MAAA;AAAA,IACf,QAAU,EAAA,EAAA;AAAA,IACV,aAAa,MAAM,MAAA;AAAA,IACnB,OAAS,EAAA,EAAA;AAAA,IACT,YAAY,MAAM;AAAA;AAEtB;AAEO,SAAS,YAAe,GAAA;AAC7B,EAAA,OAAO,WAAW,gBAAgB,CAAA;AACpC;;;;"}
+{"version":3,"file":"AccordionContext.js","sources":["../src/accordion/AccordionContext.ts"],"sourcesContent":["import { type SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\n\nexport interface AccordionContextValue {\n  value: string;\n  expanded: boolean;\n  toggle: (event: SyntheticEvent<HTMLButtonElement>) => void;\n  disabled: boolean;\n  indicatorSide: \"left\" | \"right\";\n  headerId: string;\n  setHeaderId: (id: string) => void;\n  panelId: string;\n  setPanelId: (id: string) => void;\n  status?: \"error\" | \"warning\" | \"success\";\n}\n\nexport const AccordionContext = createContext<AccordionContextValue>(\n  \"AccordionContext\",\n  {\n    value: \"\",\n    expanded: false,\n    toggle: () => undefined,\n    disabled: false,\n    indicatorSide: \"left\",\n    headerId: \"\",\n    setHeaderId: () => undefined,\n    panelId: \"\",\n    setPanelId: () => undefined,\n  },\n);\n\nexport function useAccordion() {\n  return useContext(AccordionContext);\n}\n"],"names":[],"mappings":";;;;;;;;;AAgBO,MAAM,gBAAA,GAAmB,aAAA;AAAA,EAC9B,kBAAA;AAAA,EACA;AAAA,IACE,KAAA,EAAO,EAAA;AAAA,IACP,QAAA,EAAU,KAAA;AAAA,IACV,QAAQ,MAAM,MAAA;AAAA,IACd,QAAA,EAAU,KAAA;AAAA,IACV,aAAA,EAAe,MAAA;AAAA,IACf,QAAA,EAAU,EAAA;AAAA,IACV,aAAa,MAAM,MAAA;AAAA,IACnB,OAAA,EAAS,EAAA;AAAA,IACT,YAAY,MAAM;AAAA;AAEtB;AAEO,SAAS,YAAA,GAAe;AAC7B,EAAA,OAAO,WAAW,gBAAgB,CAAA;AACpC;;;;"}

package/dist-es/accordion/AccordionGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionGroup.js","sources":["../src/accordion/AccordionGroup.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport accordionGroupCss from \"./AccordionGroup.css\";\n\nexport interface AccordionGroupProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The child Accordions to be rendered\n   */\n  children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordionGroup\");\n\nexport const AccordionGroup = forwardRef<HTMLDivElement, AccordionGroupProps>(\n  function AccordionGroup(props, ref) {\n    const { className, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-accordion-group\",\n      css: accordionGroupCss,\n      window: targetWindow,\n    });\n\n    return (\n      <div className={clsx(withBaseName(), className)} ref={ref} {...rest} />\n    );\n  },\n);\n"],"names":["AccordionGroup","accordionGroupCss"],"mappings":";;;;;;;;;;;;AAkBA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA;AAE/C,MAAM,cAAiB,GAAA,UAAA;AAAA,EAC5B,SAASA,eAAe,CAAA,KAAA,EAAO,GAAK,EAAA;AAClC,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAS,GAAA,KAAA;AAE/B,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,sBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IACE,uBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,IAAK,CAAA,YAAA,IAAgB,SAAS,CAAA,EAAG,GAAW,EAAA,GAAG,IAAM,EAAA,CAAA;AAAA;AAG3E;;;;"}
+{"version":3,"file":"AccordionGroup.js","sources":["../src/accordion/AccordionGroup.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport accordionGroupCss from \"./AccordionGroup.css\";\n\nexport interface AccordionGroupProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The child Accordions to be rendered\n   */\n  children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordionGroup\");\n\nexport const AccordionGroup = forwardRef<HTMLDivElement, AccordionGroupProps>(\n  function AccordionGroup(props, ref) {\n    const { className, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-accordion-group\",\n      css: accordionGroupCss,\n      window: targetWindow,\n    });\n\n    return (\n      <div className={clsx(withBaseName(), className)} ref={ref} {...rest} />\n    );\n  },\n);\n"],"names":["AccordionGroup","accordionGroupCss"],"mappings":";;;;;;;;;;;;AAkBA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA;AAE/C,MAAM,cAAA,GAAiB,UAAA;AAAA,EAC5B,SAASA,eAAAA,CAAe,KAAA,EAAO,GAAA,EAAK;AAClC,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,KAAA;AAE/B,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,sBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,IAAA,CAAK,YAAA,IAAgB,SAAS,CAAA,EAAG,GAAA,EAAW,GAAG,IAAA,EAAM,CAAA;AAAA,EAEzE;AACF;;;;"}

package/dist-es/accordion/AccordionHeader.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltAccordionHeader {\n  display: flex;\n  gap: var(--salt-spacing-100);\n  padding: var(--salt-spacing-50) var(--salt-spacing-100);\n  border: 0;\n  width: 100%;\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  background: transparent;\n  font-size: var(--salt-text-fontSize);\n  line-height: var(--salt-text-lineHeight);\n  font-family: var(--salt-text-fontFamily);\n  color: var(--salt-content-primary-foreground);\n  font-weight: var(--salt-text-fontWeight-strong);\n  text-align: left;\n  cursor: var(--salt-cursor-hover);\n  box-sizing: border-box;\n  -webkit-tap-highlight-color: transparent;\n}\n\n.saltAccordionHeader:focus-visible {\n  outline: var(--salt-focused-outline);\n  outline-offset: calc(-1 * var(--salt-focused-outlineWidth));\n}\n\n.saltAccordionHeader-content {\n  padding: var(--salt-spacing-75) 0;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.saltAccordionHeader .saltAccordionHeader-icon {\n  height: var(--salt-size-base);\n}\n\n.saltAccordionHeader-error {\n  background: var(--salt-status-error-background);\n}\n\n.saltAccordionHeader-error:focus-visible {\n  outline-color: var(--salt-status-error-borderColor);\n}\n\n.saltAccordionHeader-warning {\n  background: var(--salt-status-warning-background);\n}\n\n.saltAccordionHeader-warning:focus-visible {\n  outline-color: var(--salt-status-warning-borderColor);\n}\n\n.saltAccordionHeader-success {\n  background: var(--salt-status-success-background);\n}\n\n.saltAccordionHeader-success:focus-visible {\n  outline-color: var(--salt-status-error-borderColor);\n}\n\n.saltAccordionHeader .saltAccordionHeader-statusIndicator {\n  height: var(--salt-size-base);\n  margin-left: auto;\n}\n\n.saltAccordionHeader:disabled {\n  background: transparent;\n  color: var(--salt-content-primary-foreground-disabled);\n  cursor: var(--salt-cursor-disabled);\n}\n";
+var css_248z = ".saltAccordionHeader {\n  display: flex;\n  gap: var(--salt-spacing-100);\n  padding: var(--salt-spacing-50) var(--salt-spacing-100);\n  border: 0;\n  width: 100%;\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  background: transparent;\n  font-size: var(--salt-text-fontSize);\n  line-height: var(--salt-text-lineHeight);\n  font-family: var(--salt-text-fontFamily);\n  color: var(--salt-content-primary-foreground);\n  font-weight: var(--salt-text-fontWeight-strong);\n  text-align: left;\n  cursor: var(--salt-cursor-hover);\n  box-sizing: border-box;\n  -webkit-tap-highlight-color: transparent;\n}\n\n.saltAccordionHeader:focus-visible {\n  outline: var(--salt-focused-outline);\n  outline-offset: calc(-1 * var(--salt-focused-outlineWidth));\n}\n\n.saltAccordionHeader-content {\n  padding: var(--salt-spacing-75) 0;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.saltAccordionHeader .saltAccordionHeader-icon {\n  height: var(--salt-size-base);\n}\n\n.saltAccordionHeader-error {\n  background: var(--salt-status-error-background);\n}\n\n.saltAccordionHeader-error:focus-visible {\n  outline-color: var(--salt-status-error-borderColor);\n}\n\n.saltAccordionHeader-warning {\n  background: var(--salt-status-warning-background);\n}\n\n.saltAccordionHeader-warning:focus-visible {\n  outline-color: var(--salt-status-warning-borderColor);\n}\n\n.saltAccordionHeader-success {\n  background: var(--salt-status-success-background);\n}\n\n.saltAccordionHeader-success:focus-visible {\n  outline-color: var(--salt-status-success-borderColor);\n}\n\n.saltAccordionHeader .saltAccordionHeader-statusIndicator {\n  height: var(--salt-size-base);\n  margin-left: auto;\n}\n\n.saltAccordionHeader:disabled {\n  background: transparent;\n  color: var(--salt-content-primary-foreground-disabled);\n  cursor: var(--salt-cursor-disabled);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=AccordionHeader.css.js.map

package/dist-es/accordion/AccordionHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionHeader.js","sources":["../src/accordion/AccordionHeader.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type MouseEvent,\n  type ReactNode,\n} from \"react\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { StatusIndicator } from \"../status-indicator\";\nimport { makePrefixer, useIsomorphicLayoutEffect } from \"../utils\";\n\nimport { useAccordion } from \"./AccordionContext\";\nimport accordionHeaderCss from \"./AccordionHeader.css\";\n\nexport interface AccordionHeaderProps\n  extends ComponentPropsWithoutRef<\"button\"> {\n  /**\n   * The content of the Accordion Header\n   */\n  children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordionHeader\");\n\nfunction ExpansionIcon({ expanded }: { expanded: boolean }) {\n  const { CollapseIcon, ExpandIcon } = useIcon();\n  if (expanded) {\n    return <CollapseIcon aria-hidden className={withBaseName(\"icon\")} />;\n  }\n\n  return <ExpandIcon aria-hidden className={withBaseName(\"icon\")} />;\n}\n\nexport const AccordionHeader = forwardRef<\n  HTMLButtonElement,\n  AccordionHeaderProps\n>(function AccordionHeader(props, ref) {\n  const { children, className, onClick, id, ...rest } = props;\n  const {\n    value,\n    expanded,\n    toggle,\n    indicatorSide,\n    disabled,\n    headerId,\n    panelId,\n    setHeaderId,\n    status,\n  } = useAccordion();\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-accordion-header\",\n    css: accordionHeaderCss,\n    window: targetWindow,\n  });\n\n  const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n    toggle(event);\n    onClick?.(event);\n  };\n\n  useIsomorphicLayoutEffect(() => {\n    if (id) {\n      setHeaderId(id);\n    }\n  }, [id, setHeaderId]);\n\n  return (\n    <button\n      ref={ref}\n      className={clsx(\n        withBaseName(),\n        { [withBaseName(status ?? \"\")]: status },\n        className,\n      )}\n      disabled={disabled}\n      onClick={handleClick}\n      aria-expanded={expanded}\n      id={headerId}\n      aria-controls={panelId}\n      value={value}\n      type=\"button\"\n      {...rest}\n    >\n      {indicatorSide === \"left\" && <ExpansionIcon expanded={expanded} />}\n      <span className={withBaseName(\"content\")}>{children}</span>\n      {status && !disabled && (\n        <StatusIndicator\n          className={withBaseName(\"statusIndicator\")}\n          status={status}\n        />\n      )}\n      {indicatorSide === \"right\" && <ExpansionIcon expanded={expanded} />}\n    </button>\n  );\n});\n"],"names":["AccordionHeader","accordionHeaderCss"],"mappings":";;;;;;;;;;;;;;;;AAwBA,MAAM,YAAA,GAAe,aAAa,qBAAqB,CAAA;AAEvD,SAAS,aAAA,CAAc,EAAE,QAAA,EAAmC,EAAA;AAC1D,EAAA,MAAM,EAAE,YAAA,EAAc,UAAW,EAAA,GAAI,OAAQ,EAAA;AAC7C,EAAA,IAAI,QAAU,EAAA;AACZ,IAAA,2BAAQ,YAAa,EAAA,EAAA,aAAA,EAAW,MAAC,SAAW,EAAA,YAAA,CAAa,MAAM,CAAG,EAAA,CAAA;AAAA;AAGpE,EAAA,2BAAQ,UAAW,EAAA,EAAA,aAAA,EAAW,MAAC,SAAW,EAAA,YAAA,CAAa,MAAM,CAAG,EAAA,CAAA;AAClE;AAEO,MAAM,eAAkB,GAAA,UAAA,CAG7B,SAASA,gBAAAA,CAAgB,OAAO,GAAK,EAAA;AACrC,EAAA,MAAM,EAAE,QAAU,EAAA,SAAA,EAAW,SAAS,EAAI,EAAA,GAAG,MAAS,GAAA,KAAA;AACtD,EAAM,MAAA;AAAA,IACJ,KAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA;AAAA,IACA,aAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,IACA,WAAA;AAAA,IACA;AAAA,MACE,YAAa,EAAA;AAEjB,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,uBAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,WAAA,GAAc,CAAC,KAAyC,KAAA;AAC5D,IAAA,MAAA,CAAO,KAAK,CAAA;AACZ,IAAU,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAA,KAAA,CAAA;AAAA,GACZ;AAEA,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,EAAI,EAAA;AACN,MAAA,WAAA,CAAY,EAAE,CAAA;AAAA;AAChB,GACC,EAAA,CAAC,EAAI,EAAA,WAAW,CAAC,CAAA;AAEpB,EACE,uBAAA,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,EAAE,CAAC,YAAA,CAAa,UAAU,EAAE,CAAC,GAAG,MAAO,EAAA;AAAA,QACvC;AAAA,OACF;AAAA,MACA,QAAA;AAAA,MACA,OAAS,EAAA,WAAA;AAAA,MACT,eAAe,EAAA,QAAA;AAAA,MACf,EAAI,EAAA,QAAA;AAAA,MACJ,eAAe,EAAA,OAAA;AAAA,MACf,KAAA;AAAA,MACA,IAAK,EAAA,QAAA;AAAA,MACJ,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAkB,aAAA,KAAA,MAAA,oBAAW,GAAA,CAAA,aAAA,EAAA,EAAc,QAAoB,EAAA,CAAA;AAAA,4BAC/D,MAAK,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,SAAS,GAAI,QAAS,EAAA,CAAA;AAAA,QACnD,MAAA,IAAU,CAAC,QACV,oBAAA,GAAA;AAAA,UAAC,eAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,aAAa,iBAAiB,CAAA;AAAA,YACzC;AAAA;AAAA,SACF;AAAA,QAED,aAAkB,KAAA,OAAA,oBAAY,GAAA,CAAA,aAAA,EAAA,EAAc,QAAoB,EAAA;AAAA;AAAA;AAAA,GACnE;AAEJ,CAAC;;;;"}
+{"version":3,"file":"AccordionHeader.js","sources":["../src/accordion/AccordionHeader.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type MouseEvent,\n  type ReactNode,\n} from \"react\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { StatusIndicator } from \"../status-indicator\";\nimport { makePrefixer, useIsomorphicLayoutEffect } from \"../utils\";\n\nimport { useAccordion } from \"./AccordionContext\";\nimport accordionHeaderCss from \"./AccordionHeader.css\";\n\nexport interface AccordionHeaderProps\n  extends ComponentPropsWithoutRef<\"button\"> {\n  /**\n   * The content of the Accordion Header\n   */\n  children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordionHeader\");\n\nfunction ExpansionIcon({ expanded }: { expanded: boolean }) {\n  const { CollapseIcon, ExpandIcon } = useIcon();\n  if (expanded) {\n    return <CollapseIcon aria-hidden className={withBaseName(\"icon\")} />;\n  }\n\n  return <ExpandIcon aria-hidden className={withBaseName(\"icon\")} />;\n}\n\nexport const AccordionHeader = forwardRef<\n  HTMLButtonElement,\n  AccordionHeaderProps\n>(function AccordionHeader(props, ref) {\n  const { children, className, onClick, id, ...rest } = props;\n  const {\n    value,\n    expanded,\n    toggle,\n    indicatorSide,\n    disabled,\n    headerId,\n    panelId,\n    setHeaderId,\n    status,\n  } = useAccordion();\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-accordion-header\",\n    css: accordionHeaderCss,\n    window: targetWindow,\n  });\n\n  const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n    toggle(event);\n    onClick?.(event);\n  };\n\n  useIsomorphicLayoutEffect(() => {\n    if (id) {\n      setHeaderId(id);\n    }\n  }, [id, setHeaderId]);\n\n  return (\n    <button\n      ref={ref}\n      className={clsx(\n        withBaseName(),\n        { [withBaseName(status ?? \"\")]: status },\n        className,\n      )}\n      disabled={disabled}\n      onClick={handleClick}\n      aria-expanded={expanded}\n      id={headerId}\n      aria-controls={panelId}\n      value={value}\n      type=\"button\"\n      {...rest}\n    >\n      {indicatorSide === \"left\" && <ExpansionIcon expanded={expanded} />}\n      <span className={withBaseName(\"content\")}>{children}</span>\n      {status && !disabled && (\n        <StatusIndicator\n          className={withBaseName(\"statusIndicator\")}\n          status={status}\n        />\n      )}\n      {indicatorSide === \"right\" && <ExpansionIcon expanded={expanded} />}\n    </button>\n  );\n});\n"],"names":["AccordionHeader","accordionHeaderCss"],"mappings":";;;;;;;;;;;;;;;;AAwBA,MAAM,YAAA,GAAe,aAAa,qBAAqB,CAAA;AAEvD,SAAS,aAAA,CAAc,EAAE,QAAA,EAAS,EAA0B;AAC1D,EAAA,MAAM,EAAE,YAAA,EAAc,UAAA,EAAW,GAAI,OAAA,EAAQ;AAC7C,EAAA,IAAI,QAAA,EAAU;AACZ,IAAA,2BAAQ,YAAA,EAAA,EAAa,aAAA,EAAW,MAAC,SAAA,EAAW,YAAA,CAAa,MAAM,CAAA,EAAG,CAAA;AAAA,EACpE;AAEA,EAAA,2BAAQ,UAAA,EAAA,EAAW,aAAA,EAAW,MAAC,SAAA,EAAW,YAAA,CAAa,MAAM,CAAA,EAAG,CAAA;AAClE;AAEO,MAAM,eAAA,GAAkB,UAAA,CAG7B,SAASA,gBAAAA,CAAgB,OAAO,GAAA,EAAK;AACrC,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,SAAS,EAAA,EAAI,GAAG,MAAK,GAAI,KAAA;AACtD,EAAA,MAAM;AAAA,IACJ,KAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA;AAAA,IACA,aAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,IACA,WAAA;AAAA,IACA;AAAA,MACE,YAAA,EAAa;AAEjB,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,uBAAA;AAAA,IACR,GAAA,EAAKC,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAyC;AAC5D,IAAA,MAAA,CAAO,KAAK,CAAA;AACZ,IAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AAAA,EACZ,CAAA;AAEA,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,EAAA,EAAI;AACN,MAAA,WAAA,CAAY,EAAE,CAAA;AAAA,IAChB;AAAA,EACF,CAAA,EAAG,CAAC,EAAA,EAAI,WAAW,CAAC,CAAA;AAEpB,EAAA,uBACE,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,IAAA;AAAA,QACT,YAAA,EAAa;AAAA,QACb,EAAE,CAAC,YAAA,CAAa,UAAU,EAAE,CAAC,GAAG,MAAA,EAAO;AAAA,QACvC;AAAA,OACF;AAAA,MACA,QAAA;AAAA,MACA,OAAA,EAAS,WAAA;AAAA,MACT,eAAA,EAAe,QAAA;AAAA,MACf,EAAA,EAAI,QAAA;AAAA,MACJ,eAAA,EAAe,OAAA;AAAA,MACf,KAAA;AAAA,MACA,IAAA,EAAK,QAAA;AAAA,MACJ,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,aAAA,KAAkB,MAAA,oBAAU,GAAA,CAAC,aAAA,EAAA,EAAc,QAAA,EAAoB,CAAA;AAAA,4BAC/D,MAAA,EAAA,EAAK,SAAA,EAAW,YAAA,CAAa,SAAS,GAAI,QAAA,EAAS,CAAA;AAAA,QACnD,MAAA,IAAU,CAAC,QAAA,oBACV,GAAA;AAAA,UAAC,eAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,aAAa,iBAAiB,CAAA;AAAA,YACzC;AAAA;AAAA,SACF;AAAA,QAED,aAAA,KAAkB,OAAA,oBAAW,GAAA,CAAC,aAAA,EAAA,EAAc,QAAA,EAAoB;AAAA;AAAA;AAAA,GACnE;AAEJ,CAAC;;;;"}

package/dist-es/accordion/AccordionPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionPanel.js","sources":["../src/accordion/AccordionPanel.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\n\nimport { makePrefixer, useIsomorphicLayoutEffect } from \"../utils\";\nimport { useAccordion } from \"./AccordionContext\";\nimport accordionPanelCss from \"./AccordionPanel.css\";\n\nexport interface AccordionPanelProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of the Accordion Panel\n   */\n  children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordionPanel\");\n\nexport const AccordionPanel = forwardRef<HTMLDivElement, AccordionPanelProps>(\n  function AccordionPanel(props, ref) {\n    const { children, className, id, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-accordion-panel\",\n      css: accordionPanelCss,\n      window: targetWindow,\n    });\n\n    const { headerId, panelId, setPanelId, expanded, indicatorSide } =\n      useAccordion();\n\n    useIsomorphicLayoutEffect(() => {\n      if (id) {\n        setPanelId(id);\n      }\n    }, [id, setPanelId]);\n\n    return (\n      <div\n        ref={ref}\n        className={clsx(withBaseName(), className)}\n        role=\"region\"\n        id={panelId}\n        aria-labelledby={headerId}\n        aria-hidden={!expanded ? \"true\" : undefined}\n        hidden={!expanded}\n        {...rest}\n      >\n        <div className={withBaseName(\"inner\")}>\n          <div\n            className={clsx(withBaseName(\"content\"), {\n              [withBaseName(\"indentedContent\")]: indicatorSide === \"left\",\n            })}\n          >\n            {children}\n          </div>\n        </div>\n      </div>\n    );\n  },\n);\n"],"names":["AccordionPanel","accordionPanelCss"],"mappings":";;;;;;;;;;;;;;AAoBA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA;AAE/C,MAAM,cAAiB,GAAA,UAAA;AAAA,EAC5B,SAASA,eAAe,CAAA,KAAA,EAAO,GAAK,EAAA;AAClC,IAAA,MAAM,EAAE,QAAU,EAAA,SAAA,EAAW,EAAI,EAAA,GAAG,MAAS,GAAA,KAAA;AAE7C,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,sBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,EAAE,QAAU,EAAA,OAAA,EAAS,YAAY,QAAU,EAAA,aAAA,KAC/C,YAAa,EAAA;AAEf,IAAA,yBAAA,CAA0B,MAAM;AAC9B,MAAA,IAAI,EAAI,EAAA;AACN,QAAA,UAAA,CAAW,EAAE,CAAA;AAAA;AACf,KACC,EAAA,CAAC,EAAI,EAAA,UAAU,CAAC,CAAA;AAEnB,IACE,uBAAA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,IAAK,EAAA,QAAA;AAAA,QACL,EAAI,EAAA,OAAA;AAAA,QACJ,iBAAiB,EAAA,QAAA;AAAA,QACjB,aAAA,EAAa,CAAC,QAAA,GAAW,MAAS,GAAA,MAAA;AAAA,QAClC,QAAQ,CAAC,QAAA;AAAA,QACR,GAAG,IAAA;AAAA,QAEJ,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,YAAA,CAAa,OAAO,CAClC,EAAA,QAAA,kBAAA,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAW,EAAA,IAAA,CAAK,YAAa,CAAA,SAAS,CAAG,EAAA;AAAA,cACvC,CAAC,YAAA,CAAa,iBAAiB,CAAC,GAAG,aAAkB,KAAA;AAAA,aACtD,CAAA;AAAA,YAEA;AAAA;AAAA,SAEL,EAAA;AAAA;AAAA,KACF;AAAA;AAGN;;;;"}
+{"version":3,"file":"AccordionPanel.js","sources":["../src/accordion/AccordionPanel.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\n\nimport { makePrefixer, useIsomorphicLayoutEffect } from \"../utils\";\nimport { useAccordion } from \"./AccordionContext\";\nimport accordionPanelCss from \"./AccordionPanel.css\";\n\nexport interface AccordionPanelProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of the Accordion Panel\n   */\n  children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordionPanel\");\n\nexport const AccordionPanel = forwardRef<HTMLDivElement, AccordionPanelProps>(\n  function AccordionPanel(props, ref) {\n    const { children, className, id, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-accordion-panel\",\n      css: accordionPanelCss,\n      window: targetWindow,\n    });\n\n    const { headerId, panelId, setPanelId, expanded, indicatorSide } =\n      useAccordion();\n\n    useIsomorphicLayoutEffect(() => {\n      if (id) {\n        setPanelId(id);\n      }\n    }, [id, setPanelId]);\n\n    return (\n      <div\n        ref={ref}\n        className={clsx(withBaseName(), className)}\n        role=\"region\"\n        id={panelId}\n        aria-labelledby={headerId}\n        aria-hidden={!expanded ? \"true\" : undefined}\n        hidden={!expanded}\n        {...rest}\n      >\n        <div className={withBaseName(\"inner\")}>\n          <div\n            className={clsx(withBaseName(\"content\"), {\n              [withBaseName(\"indentedContent\")]: indicatorSide === \"left\",\n            })}\n          >\n            {children}\n          </div>\n        </div>\n      </div>\n    );\n  },\n);\n"],"names":["AccordionPanel","accordionPanelCss"],"mappings":";;;;;;;;;;;;;;AAoBA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA;AAE/C,MAAM,cAAA,GAAiB,UAAA;AAAA,EAC5B,SAASA,eAAAA,CAAe,KAAA,EAAO,GAAA,EAAK;AAClC,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,EAAA,EAAI,GAAG,MAAK,GAAI,KAAA;AAE7C,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,sBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,EAAE,QAAA,EAAU,OAAA,EAAS,YAAY,QAAA,EAAU,aAAA,KAC/C,YAAA,EAAa;AAEf,IAAA,yBAAA,CAA0B,MAAM;AAC9B,MAAA,IAAI,EAAA,EAAI;AACN,QAAA,UAAA,CAAW,EAAE,CAAA;AAAA,MACf;AAAA,IACF,CAAA,EAAG,CAAC,EAAA,EAAI,UAAU,CAAC,CAAA;AAEnB,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,IAAA,EAAK,QAAA;AAAA,QACL,EAAA,EAAI,OAAA;AAAA,QACJ,iBAAA,EAAiB,QAAA;AAAA,QACjB,aAAA,EAAa,CAAC,QAAA,GAAW,MAAA,GAAS,MAAA;AAAA,QAClC,QAAQ,CAAC,QAAA;AAAA,QACR,GAAG,IAAA;AAAA,QAEJ,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,YAAA,CAAa,OAAO,CAAA,EAClC,QAAA,kBAAA,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,IAAA,CAAK,YAAA,CAAa,SAAS,CAAA,EAAG;AAAA,cACvC,CAAC,YAAA,CAAa,iBAAiB,CAAC,GAAG,aAAA,KAAkB;AAAA,aACtD,CAAA;AAAA,YAEA;AAAA;AAAA,SACH,EACF;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;;;;"}

package/dist-es/aria-announcer/AriaAnnounce.js.map

@@ -1 +1 @@
-{"version":3,"file":"AriaAnnounce.js","sources":["../src/aria-announcer/AriaAnnounce.tsx"],"sourcesContent":["import { type ComponentType, useEffect } from \"react\";\n\nimport { useAriaAnnouncer } from \"./useAriaAnnouncer\";\n\nexport interface AriaAnnounceProps {\n  /**\n   * String which will be announced by screen readers on change\n   */\n  announcement?: string;\n}\n\nexport const AriaAnnounce: ComponentType<AriaAnnounceProps> = ({\n  announcement,\n}) => {\n  const { announce } = useAriaAnnouncer();\n\n  useEffect(() => {\n    if (announcement) {\n      announce(announcement);\n    }\n  }, [announce, announcement]);\n\n  // biome-ignore lint/complexity/noUselessFragments: If we return null here, react-docgen wouldn't be able to locate the component.\n  return <></>;\n};\n"],"names":[],"mappings":";;;;AAWO,MAAM,eAAiD,CAAC;AAAA,EAC7D;AACF,CAAM,KAAA;AACJ,EAAM,MAAA,EAAE,QAAS,EAAA,GAAI,gBAAiB,EAAA;AAEtC,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,YAAc,EAAA;AAChB,MAAA,QAAA,CAAS,YAAY,CAAA;AAAA;AACvB,GACC,EAAA,CAAC,QAAU,EAAA,YAAY,CAAC,CAAA;AAG3B,EAAA,uBAAS,GAAA,CAAA,QAAA,EAAA,EAAA,CAAA;AACX;;;;"}
+{"version":3,"file":"AriaAnnounce.js","sources":["../src/aria-announcer/AriaAnnounce.tsx"],"sourcesContent":["import { type ComponentType, useEffect } from \"react\";\n\nimport { useAriaAnnouncer } from \"./useAriaAnnouncer\";\n\nexport interface AriaAnnounceProps {\n  /**\n   * String which will be announced by screen readers on change\n   */\n  announcement?: string;\n}\n\nexport const AriaAnnounce: ComponentType<AriaAnnounceProps> = ({\n  announcement,\n}) => {\n  const { announce } = useAriaAnnouncer();\n\n  useEffect(() => {\n    if (announcement) {\n      announce(announcement);\n    }\n  }, [announce, announcement]);\n\n  // biome-ignore lint/complexity/noUselessFragments: If we return null here, react-docgen wouldn't be able to locate the component.\n  return <></>;\n};\n"],"names":[],"mappings":";;;;AAWO,MAAM,eAAiD,CAAC;AAAA,EAC7D;AACF,CAAA,KAAM;AACJ,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,gBAAA,EAAiB;AAEtC,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,YAAA,EAAc;AAChB,MAAA,QAAA,CAAS,YAAY,CAAA;AAAA,IACvB;AAAA,EACF,CAAA,EAAG,CAAC,QAAA,EAAU,YAAY,CAAC,CAAA;AAG3B,EAAA,uBAAO,GAAA,CAAA,QAAA,EAAA,EAAE,CAAA;AACX;;;;"}

package/dist-es/aria-announcer/AriaAnnouncerContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"AriaAnnouncerContext.js","sources":["../src/aria-announcer/AriaAnnouncerContext.ts"],"sourcesContent":["import { createContext } from \"react\";\n\nexport type AnnounceFn = (announcement: string, delay?: number) => void;\n\nexport type AriaAnnouncer = {\n  announce: AnnounceFn;\n};\n\nexport const AriaAnnouncerContext = createContext<AriaAnnouncer | undefined>(\n  undefined,\n);\n"],"names":[],"mappings":";;AAQO,MAAM,oBAAuB,GAAA,aAAA;AAAA,EAClC;AACF;;;;"}
+{"version":3,"file":"AriaAnnouncerContext.js","sources":["../src/aria-announcer/AriaAnnouncerContext.ts"],"sourcesContent":["import { createContext } from \"react\";\n\nexport type AnnounceFn = (announcement: string, delay?: number) => void;\n\nexport type AriaAnnouncer = {\n  announce: AnnounceFn;\n};\n\nexport const AriaAnnouncerContext = createContext<AriaAnnouncer | undefined>(\n  undefined,\n);\n"],"names":[],"mappings":";;AAQO,MAAM,oBAAA,GAAuB,aAAA;AAAA,EAClC;AACF;;;;"}

package/dist-es/aria-announcer/AriaAnnouncerProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"AriaAnnouncerProvider.js","sources":["../src/aria-announcer/AriaAnnouncerProvider.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\n\nimport { AriaAnnouncerContext } from \"./AriaAnnouncerContext\";\n\nexport const ARIA_ANNOUNCE_DELAY = 150;\n\nexport interface AriaAnnouncerProviderProps {\n  children?: ReactNode;\n  /**\n   * Style overrides for the aria-live element\n   */\n  style?: CSSProperties;\n}\n\nexport function AriaAnnouncerProvider({\n  children,\n  style,\n}: AriaAnnouncerProviderProps) {\n  // announcement that gets rendered inside aria-live and read out by screen readers\n  const [currentAnnouncement, setCurrentAnnouncement] = useState(\"\");\n  // queue that stores all the requested announcements\n  const announcementsRef = useRef<string[]>([]);\n  // we use this variable to decide whether to start the announcement queue if one is not already in progress\n  const isAnnouncingRef = useRef(false);\n  // we need to keep track of the state of the component mount since all the async function calls\n  // might trigger a setState after a component has been unmounted\n  const mountedRef = useRef(true);\n\n  // announceAll will get called recursively until all the announcements are rendered and cleared from the queue\n  const announceAll = useCallback(() => {\n    isAnnouncingRef.current = true;\n    if (mountedRef.current) {\n      setCurrentAnnouncement(\"\");\n      requestAnimationFrame(() => {\n        if (mountedRef.current && announcementsRef.current.length) {\n          const announcement = announcementsRef.current.shift() as string;\n          setCurrentAnnouncement(announcement);\n          setTimeout(() => {\n            announceAll();\n          }, ARIA_ANNOUNCE_DELAY);\n        } else {\n          isAnnouncingRef.current = false;\n        }\n      });\n    }\n  }, []);\n\n  const announce = useCallback(\n    (announcement: string) => {\n      announcementsRef.current.push(announcement);\n      if (!isAnnouncingRef.current) {\n        announceAll();\n      }\n    },\n    [announceAll],\n  );\n\n  useEffect(() => {\n    mountedRef.current = true;\n    return () => {\n      mountedRef.current = false;\n    };\n  }, []);\n\n  const value = useMemo(() => ({ announce }), [announce]);\n  return (\n    <AriaAnnouncerContext.Provider value={value}>\n      {children}\n      <div\n        aria-atomic=\"true\"\n        aria-live=\"assertive\"\n        // hidden styling based on https://tailwindcss.com/docs/screen-readers\n        style={{\n          position: \"absolute\",\n          height: 1,\n          width: 1,\n          padding: 0,\n          margin: -1,\n          overflow: \"hidden\",\n          clip: \"rect(0, 0, 0, 0)\",\n          whiteSpace: \"nowrap\",\n          borderWidth: 0,\n          ...style,\n        }}\n      >\n        {currentAnnouncement}\n      </div>\n    </AriaAnnouncerContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;AAYO,MAAM,mBAAsB,GAAA;AAU5B,SAAS,qBAAsB,CAAA;AAAA,EACpC,QAAA;AAAA,EACA;AACF,CAA+B,EAAA;AAE7B,EAAA,MAAM,CAAC,mBAAA,EAAqB,sBAAsB,CAAA,GAAI,SAAS,EAAE,CAAA;AAEjE,EAAM,MAAA,gBAAA,GAAmB,MAAiB,CAAA,EAAE,CAAA;AAE5C,EAAM,MAAA,eAAA,GAAkB,OAAO,KAAK,CAAA;AAGpC,EAAM,MAAA,UAAA,GAAa,OAAO,IAAI,CAAA;AAG9B,EAAM,MAAA,WAAA,GAAc,YAAY,MAAM;AACpC,IAAA,eAAA,CAAgB,OAAU,GAAA,IAAA;AAC1B,IAAA,IAAI,WAAW,OAAS,EAAA;AACtB,MAAA,sBAAA,CAAuB,EAAE,CAAA;AACzB,MAAA,qBAAA,CAAsB,MAAM;AAC1B,QAAA,IAAI,UAAW,CAAA,OAAA,IAAW,gBAAiB,CAAA,OAAA,CAAQ,MAAQ,EAAA;AACzD,UAAM,MAAA,YAAA,GAAe,gBAAiB,CAAA,OAAA,CAAQ,KAAM,EAAA;AACpD,UAAA,sBAAA,CAAuB,YAAY,CAAA;AACnC,UAAA,UAAA,CAAW,MAAM;AACf,YAAY,WAAA,EAAA;AAAA,aACX,mBAAmB,CAAA;AAAA,SACjB,MAAA;AACL,UAAA,eAAA,CAAgB,OAAU,GAAA,KAAA;AAAA;AAC5B,OACD,CAAA;AAAA;AACH,GACF,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,QAAW,GAAA,WAAA;AAAA,IACf,CAAC,YAAyB,KAAA;AACxB,MAAiB,gBAAA,CAAA,OAAA,CAAQ,KAAK,YAAY,CAAA;AAC1C,MAAI,IAAA,CAAC,gBAAgB,OAAS,EAAA;AAC5B,QAAY,WAAA,EAAA;AAAA;AACd,KACF;AAAA,IACA,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,UAAA,CAAW,OAAU,GAAA,IAAA;AACrB,IAAA,OAAO,MAAM;AACX,MAAA,UAAA,CAAW,OAAU,GAAA,KAAA;AAAA,KACvB;AAAA,GACF,EAAG,EAAE,CAAA;AAEL,EAAM,MAAA,KAAA,GAAQ,QAAQ,OAAO,EAAE,UAAa,CAAA,EAAA,CAAC,QAAQ,CAAC,CAAA;AACtD,EAAA,uBACG,IAAA,CAAA,oBAAA,CAAqB,QAArB,EAAA,EAA8B,KAC5B,EAAA,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,oBACD,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,aAAY,EAAA,MAAA;AAAA,QACZ,WAAU,EAAA,WAAA;AAAA,QAEV,KAAO,EAAA;AAAA,UACL,QAAU,EAAA,UAAA;AAAA,UACV,MAAQ,EAAA,CAAA;AAAA,UACR,KAAO,EAAA,CAAA;AAAA,UACP,OAAS,EAAA,CAAA;AAAA,UACT,MAAQ,EAAA,EAAA;AAAA,UACR,QAAU,EAAA,QAAA;AAAA,UACV,IAAM,EAAA,kBAAA;AAAA,UACN,UAAY,EAAA,QAAA;AAAA,UACZ,WAAa,EAAA,CAAA;AAAA,UACb,GAAG;AAAA,SACL;AAAA,QAEC,QAAA,EAAA;AAAA;AAAA;AACH,GACF,EAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"AriaAnnouncerProvider.js","sources":["../src/aria-announcer/AriaAnnouncerProvider.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\n\nimport { AriaAnnouncerContext } from \"./AriaAnnouncerContext\";\n\nexport const ARIA_ANNOUNCE_DELAY = 150;\n\nexport interface AriaAnnouncerProviderProps {\n  children?: ReactNode;\n  /**\n   * Style overrides for the aria-live element\n   */\n  style?: CSSProperties;\n}\n\nexport function AriaAnnouncerProvider({\n  children,\n  style,\n}: AriaAnnouncerProviderProps) {\n  // announcement that gets rendered inside aria-live and read out by screen readers\n  const [currentAnnouncement, setCurrentAnnouncement] = useState(\"\");\n  // queue that stores all the requested announcements\n  const announcementsRef = useRef<string[]>([]);\n  // we use this variable to decide whether to start the announcement queue if one is not already in progress\n  const isAnnouncingRef = useRef(false);\n  // we need to keep track of the state of the component mount since all the async function calls\n  // might trigger a setState after a component has been unmounted\n  const mountedRef = useRef(true);\n\n  // announceAll will get called recursively until all the announcements are rendered and cleared from the queue\n  const announceAll = useCallback(() => {\n    isAnnouncingRef.current = true;\n    if (mountedRef.current) {\n      setCurrentAnnouncement(\"\");\n      requestAnimationFrame(() => {\n        if (mountedRef.current && announcementsRef.current.length) {\n          const announcement = announcementsRef.current.shift() as string;\n          setCurrentAnnouncement(announcement);\n          setTimeout(() => {\n            announceAll();\n          }, ARIA_ANNOUNCE_DELAY);\n        } else {\n          isAnnouncingRef.current = false;\n        }\n      });\n    }\n  }, []);\n\n  const announce = useCallback(\n    (announcement: string) => {\n      announcementsRef.current.push(announcement);\n      if (!isAnnouncingRef.current) {\n        announceAll();\n      }\n    },\n    [announceAll],\n  );\n\n  useEffect(() => {\n    mountedRef.current = true;\n    return () => {\n      mountedRef.current = false;\n    };\n  }, []);\n\n  const value = useMemo(() => ({ announce }), [announce]);\n  return (\n    <AriaAnnouncerContext.Provider value={value}>\n      {children}\n      <div\n        aria-atomic=\"true\"\n        aria-live=\"assertive\"\n        // hidden styling based on https://tailwindcss.com/docs/screen-readers\n        style={{\n          position: \"absolute\",\n          height: 1,\n          width: 1,\n          padding: 0,\n          margin: -1,\n          overflow: \"hidden\",\n          clip: \"rect(0, 0, 0, 0)\",\n          whiteSpace: \"nowrap\",\n          borderWidth: 0,\n          ...style,\n        }}\n      >\n        {currentAnnouncement}\n      </div>\n    </AriaAnnouncerContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;AAYO,MAAM,mBAAA,GAAsB;AAU5B,SAAS,qBAAA,CAAsB;AAAA,EACpC,QAAA;AAAA,EACA;AACF,CAAA,EAA+B;AAE7B,EAAA,MAAM,CAAC,mBAAA,EAAqB,sBAAsB,CAAA,GAAI,SAAS,EAAE,CAAA;AAEjE,EAAA,MAAM,gBAAA,GAAmB,MAAA,CAAiB,EAAE,CAAA;AAE5C,EAAA,MAAM,eAAA,GAAkB,OAAO,KAAK,CAAA;AAGpC,EAAA,MAAM,UAAA,GAAa,OAAO,IAAI,CAAA;AAG9B,EAAA,MAAM,WAAA,GAAc,YAAY,MAAM;AACpC,IAAA,eAAA,CAAgB,OAAA,GAAU,IAAA;AAC1B,IAAA,IAAI,WAAW,OAAA,EAAS;AACtB,MAAA,sBAAA,CAAuB,EAAE,CAAA;AACzB,MAAA,qBAAA,CAAsB,MAAM;AAC1B,QAAA,IAAI,UAAA,CAAW,OAAA,IAAW,gBAAA,CAAiB,OAAA,CAAQ,MAAA,EAAQ;AACzD,UAAA,MAAM,YAAA,GAAe,gBAAA,CAAiB,OAAA,CAAQ,KAAA,EAAM;AACpD,UAAA,sBAAA,CAAuB,YAAY,CAAA;AACnC,UAAA,UAAA,CAAW,MAAM;AACf,YAAA,WAAA,EAAY;AAAA,UACd,GAAG,mBAAmB,CAAA;AAAA,QACxB,CAAA,MAAO;AACL,UAAA,eAAA,CAAgB,OAAA,GAAU,KAAA;AAAA,QAC5B;AAAA,MACF,CAAC,CAAA;AAAA,IACH;AAAA,EACF,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,QAAA,GAAW,WAAA;AAAA,IACf,CAAC,YAAA,KAAyB;AACxB,MAAA,gBAAA,CAAiB,OAAA,CAAQ,KAAK,YAAY,CAAA;AAC1C,MAAA,IAAI,CAAC,gBAAgB,OAAA,EAAS;AAC5B,QAAA,WAAA,EAAY;AAAA,MACd;AAAA,IACF,CAAA;AAAA,IACA,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,UAAA,CAAW,OAAA,GAAU,IAAA;AACrB,IAAA,OAAO,MAAM;AACX,MAAA,UAAA,CAAW,OAAA,GAAU,KAAA;AAAA,IACvB,CAAA;AAAA,EACF,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,KAAA,GAAQ,QAAQ,OAAO,EAAE,UAAS,CAAA,EAAI,CAAC,QAAQ,CAAC,CAAA;AACtD,EAAA,uBACE,IAAA,CAAC,oBAAA,CAAqB,QAAA,EAArB,EAA8B,KAAA,EAC5B,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,oBACD,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,aAAA,EAAY,MAAA;AAAA,QACZ,WAAA,EAAU,WAAA;AAAA,QAEV,KAAA,EAAO;AAAA,UACL,QAAA,EAAU,UAAA;AAAA,UACV,MAAA,EAAQ,CAAA;AAAA,UACR,KAAA,EAAO,CAAA;AAAA,UACP,OAAA,EAAS,CAAA;AAAA,UACT,MAAA,EAAQ,EAAA;AAAA,UACR,QAAA,EAAU,QAAA;AAAA,UACV,IAAA,EAAM,kBAAA;AAAA,UACN,UAAA,EAAY,QAAA;AAAA,UACZ,WAAA,EAAa,CAAA;AAAA,UACb,GAAG;AAAA,SACL;AAAA,QAEC,QAAA,EAAA;AAAA;AAAA;AACH,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist-es/aria-announcer/useAriaAnnouncer.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAriaAnnouncer.js","sources":["../src/aria-announcer/useAriaAnnouncer.ts"],"sourcesContent":["import { useCallback, useContext, useEffect, useMemo, useRef } from \"react\";\nimport { debounce } from \"../utils/debounce\";\nimport {\n  type AriaAnnouncer,\n  AriaAnnouncerContext,\n} from \"./AriaAnnouncerContext\";\n\nexport type useAnnouncerOptions = {\n  debounce?: number;\n};\nexport type useAriaAnnouncerHook = (\n  options?: useAnnouncerOptions,\n) => AriaAnnouncer;\n\nlet warnedOnce = false;\n\nexport const useAriaAnnouncer: useAriaAnnouncerHook = ({\n  debounce: debounceInterval = 0,\n} = {}) => {\n  const context = useContext(AriaAnnouncerContext);\n  const mountedRef = useRef(true);\n  const baseAnnounce = useCallback(\n    (announcement: string, delay?: number) => {\n      const isReactAnnouncerInstalled = context?.announce;\n\n      if (process.env.NODE_ENV !== \"production\") {\n        if (isReactAnnouncerInstalled && warnedOnce) {\n          console.warn(\n            \"useAriaAnnouncer is being used without an AriaAnnouncerProvider. Your application should be wrapped in an AriaAnnouncerProvider\",\n          );\n          warnedOnce = true;\n        }\n      }\n\n      function makeAnnouncement() {\n        if (mountedRef.current) {\n          if (isReactAnnouncerInstalled) {\n            context.announce(announcement);\n          }\n        }\n      }\n\n      if (delay) {\n        setTimeout(makeAnnouncement, delay);\n      } else {\n        makeAnnouncement();\n      }\n    },\n    [context],\n  );\n\n  const announce = useMemo(\n    () =>\n      debounceInterval > 0\n        ? debounce(baseAnnounce, debounceInterval)\n        : baseAnnounce,\n    [baseAnnounce, debounceInterval],\n  );\n\n  const ariaAnnouncer = useMemo(\n    () => ({\n      ...context,\n      announce,\n    }),\n    [context, announce],\n  );\n\n  useEffect(() => {\n    mountedRef.current = true;\n    return () => {\n      mountedRef.current = false;\n    };\n  }, []);\n\n  return ariaAnnouncer;\n};\n"],"names":[],"mappings":";;;;AAgBO,MAAM,mBAAyC,CAAC;AAAA,EACrD,UAAU,gBAAmB,GAAA;AAC/B,CAAA,GAAI,EAAO,KAAA;AACT,EAAM,MAAA,OAAA,GAAU,WAAW,oBAAoB,CAAA;AAC/C,EAAM,MAAA,UAAA,GAAa,OAAO,IAAI,CAAA;AAC9B,EAAA,MAAM,YAAe,GAAA,WAAA;AAAA,IACnB,CAAC,cAAsB,KAAmB,KAAA;AACxC,MAAA,MAAM,4BAA4B,OAAS,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAA,QAAA;AAE3C,MAAI,IAAA,OAAA,CAAQ,GAAI,CAAA,QAAA,KAAa,YAAc,EAAA;AAS3C,MAAA,SAAS,gBAAmB,GAAA;AAC1B,QAAA,IAAI,WAAW,OAAS,EAAA;AACtB,UAAA,IAAI,yBAA2B,EAAA;AAC7B,YAAA,OAAA,CAAQ,SAAS,YAAY,CAAA;AAAA;AAC/B;AACF;AAGF,MAAA,IAAI,KAAO,EAAA;AACT,QAAA,UAAA,CAAW,kBAAkB,KAAK,CAAA;AAAA,OAC7B,MAAA;AACL,QAAiB,gBAAA,EAAA;AAAA;AACnB,KACF;AAAA,IACA,CAAC,OAAO;AAAA,GACV;AAEA,EAAA,MAAM,QAAW,GAAA,OAAA;AAAA,IACf,MACE,gBAAmB,GAAA,CAAA,GACf,QAAS,CAAA,YAAA,EAAc,gBAAgB,CACvC,GAAA,YAAA;AAAA,IACN,CAAC,cAAc,gBAAgB;AAAA,GACjC;AAEA,EAAA,MAAM,aAAgB,GAAA,OAAA;AAAA,IACpB,OAAO;AAAA,MACL,GAAG,OAAA;AAAA,MACH;AAAA,KACF,CAAA;AAAA,IACA,CAAC,SAAS,QAAQ;AAAA,GACpB;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,UAAA,CAAW,OAAU,GAAA,IAAA;AACrB,IAAA,OAAO,MAAM;AACX,MAAA,UAAA,CAAW,OAAU,GAAA,KAAA;AAAA,KACvB;AAAA,GACF,EAAG,EAAE,CAAA;AAEL,EAAO,OAAA,aAAA;AACT;;;;"}
+{"version":3,"file":"useAriaAnnouncer.js","sources":["../src/aria-announcer/useAriaAnnouncer.ts"],"sourcesContent":["import { useCallback, useContext, useEffect, useMemo, useRef } from \"react\";\nimport { debounce } from \"../utils/debounce\";\nimport {\n  type AriaAnnouncer,\n  AriaAnnouncerContext,\n} from \"./AriaAnnouncerContext\";\n\nexport type useAnnouncerOptions = {\n  debounce?: number;\n};\nexport type useAriaAnnouncerHook = (\n  options?: useAnnouncerOptions,\n) => AriaAnnouncer;\n\nlet warnedOnce = false;\n\nexport const useAriaAnnouncer: useAriaAnnouncerHook = ({\n  debounce: debounceInterval = 0,\n} = {}) => {\n  const context = useContext(AriaAnnouncerContext);\n  const mountedRef = useRef(true);\n  const baseAnnounce = useCallback(\n    (announcement: string, delay?: number) => {\n      const isReactAnnouncerInstalled = context?.announce;\n\n      if (process.env.NODE_ENV !== \"production\") {\n        if (isReactAnnouncerInstalled && warnedOnce) {\n          console.warn(\n            \"useAriaAnnouncer is being used without an AriaAnnouncerProvider. Your application should be wrapped in an AriaAnnouncerProvider\",\n          );\n          warnedOnce = true;\n        }\n      }\n\n      function makeAnnouncement() {\n        if (mountedRef.current) {\n          if (isReactAnnouncerInstalled) {\n            context.announce(announcement);\n          }\n        }\n      }\n\n      if (delay) {\n        setTimeout(makeAnnouncement, delay);\n      } else {\n        makeAnnouncement();\n      }\n    },\n    [context],\n  );\n\n  const announce = useMemo(\n    () =>\n      debounceInterval > 0\n        ? debounce(baseAnnounce, debounceInterval)\n        : baseAnnounce,\n    [baseAnnounce, debounceInterval],\n  );\n\n  const ariaAnnouncer = useMemo(\n    () => ({\n      ...context,\n      announce,\n    }),\n    [context, announce],\n  );\n\n  useEffect(() => {\n    mountedRef.current = true;\n    return () => {\n      mountedRef.current = false;\n    };\n  }, []);\n\n  return ariaAnnouncer;\n};\n"],"names":[],"mappings":";;;;AAgBO,MAAM,mBAAyC,CAAC;AAAA,EACrD,UAAU,gBAAA,GAAmB;AAC/B,CAAA,GAAI,EAAC,KAAM;AACT,EAAA,MAAM,OAAA,GAAU,WAAW,oBAAoB,CAAA;AAC/C,EAAA,MAAM,UAAA,GAAa,OAAO,IAAI,CAAA;AAC9B,EAAA,MAAM,YAAA,GAAe,WAAA;AAAA,IACnB,CAAC,cAAsB,KAAA,KAAmB;AACxC,MAAA,MAAM,4BAA4B,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAS,QAAA;AAE3C,MAAA,IAAI,OAAA,CAAQ,GAAA,CAAI,QAAA,KAAa,YAAA,EAAc;AAS3C,MAAA,SAAS,gBAAA,GAAmB;AAC1B,QAAA,IAAI,WAAW,OAAA,EAAS;AACtB,UAAA,IAAI,yBAAA,EAA2B;AAC7B,YAAA,OAAA,CAAQ,SAAS,YAAY,CAAA;AAAA,UAC/B;AAAA,QACF;AAAA,MACF;AAEA,MAAA,IAAI,KAAA,EAAO;AACT,QAAA,UAAA,CAAW,kBAAkB,KAAK,CAAA;AAAA,MACpC,CAAA,MAAO;AACL,QAAA,gBAAA,EAAiB;AAAA,MACnB;AAAA,IACF,CAAA;AAAA,IACA,CAAC,OAAO;AAAA,GACV;AAEA,EAAA,MAAM,QAAA,GAAW,OAAA;AAAA,IACf,MACE,gBAAA,GAAmB,CAAA,GACf,QAAA,CAAS,YAAA,EAAc,gBAAgB,CAAA,GACvC,YAAA;AAAA,IACN,CAAC,cAAc,gBAAgB;AAAA,GACjC;AAEA,EAAA,MAAM,aAAA,GAAgB,OAAA;AAAA,IACpB,OAAO;AAAA,MACL,GAAG,OAAA;AAAA,MACH;AAAA,KACF,CAAA;AAAA,IACA,CAAC,SAAS,QAAQ;AAAA,GACpB;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,UAAA,CAAW,OAAA,GAAU,IAAA;AACrB,IAAA,OAAO,MAAM;AACX,MAAA,UAAA,CAAW,OAAA,GAAU,KAAA;AAAA,IACvB,CAAA;AAAA,EACF,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,OAAO,aAAA;AACT;;;;"}

package/dist-es/avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sources":["../src/avatar/Avatar.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { makePrefixer } from \"../utils\";\nimport avatarCss from \"./Avatar.css\";\nimport { useAvatarImage } from \"./useAvatarImage\";\n\nexport type NameToInitials = (name?: string) => string;\n\nexport interface AvatarProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * The name that Avatar represents.\n   */\n  name?: string;\n  /**\n   * Defines the function that gets initials. Default is capital first letter of each separate word in name.\n   * If a function is not passed or returns undefined, Avatar will default to Icon.\n   */\n  nameToInitials?: NameToInitials;\n  /**\n   * Image src of Avatar.\n   */\n  src?: string;\n  /**\n   * Multiplier for the base avatar.\n   */\n  size?: number;\n  /**\n   * Icon to be used as a default item. Defaults to `UserIcon`.\n   */\n  fallbackIcon?: ReactNode;\n  /**\n   * Changes Avatar's color.\n   */\n  color?:\n    | \"accent\"\n    | \"category-1\"\n    | \"category-2\"\n    | \"category-3\"\n    | \"category-4\"\n    | \"category-5\"\n    | \"category-6\"\n    | \"category-7\"\n    | \"category-8\"\n    | \"category-9\"\n    | \"category-10\"\n    | \"category-11\"\n    | \"category-12\"\n    | \"category-13\"\n    | \"category-14\"\n    | \"category-15\"\n    | \"category-16\"\n    | \"category-17\"\n    | \"category-18\"\n    | \"category-19\"\n    | \"category-20\";\n}\n\nconst withBaseName = makePrefixer(\"saltAvatar\");\nconst DEFAULT_AVATAR_SIZE = 2; // medium\n\nconst defaultNameToInitials = (name?: string) =>\n  name\n    ?.split(\" \")\n    .slice(0, 2)\n    .map((n) => n[0])\n    .join(\"\")\n    .toUpperCase();\n\nexport const Avatar = forwardRef<HTMLDivElement, AvatarProps>(function Avatar(\n  {\n    className,\n    children: childrenProp,\n    color = \"accent\",\n    name,\n    nameToInitials = defaultNameToInitials,\n    src,\n    size = DEFAULT_AVATAR_SIZE,\n    style: styleProp,\n    fallbackIcon: fallbackIconProp,\n    ...rest\n  },\n  ref,\n) {\n  const targetWindow = useWindow();\n  const { UserIcon } = useIcon();\n\n  const fallbackIcon =\n    fallbackIconProp === undefined ? (\n      <UserIcon aria-hidden />\n    ) : (\n      fallbackIconProp\n    );\n\n  useComponentCssInjection({\n    testId: \"salt-avatar\",\n    css: avatarCss,\n    window: targetWindow,\n  });\n\n  let children: ReactNode;\n\n  const style = {\n    ...styleProp,\n    \"--saltAvatar-size-multiplier\": `${size}`,\n  };\n\n  const status = useAvatarImage({ src });\n  const hasImgNotFailing = status === \"loaded\";\n  if (hasImgNotFailing) {\n    children = <img alt=\"\" src={src} />;\n  } else if (childrenProp != null) {\n    children = childrenProp;\n  }\n\n  const avatarInitials = nameToInitials(name);\n\n  const ariaProps = name\n    ? {\n        role: \"img\",\n        \"aria-label\": name,\n      }\n    : {};\n\n  return (\n    <div\n      ref={ref}\n      style={style}\n      className={clsx(\n        withBaseName(),\n        withBaseName(color),\n        {\n          [withBaseName(\"withImage\")]: hasImgNotFailing,\n        },\n        className,\n      )}\n      {...ariaProps}\n      {...rest}\n    >\n      {children || avatarInitials || fallbackIcon}\n    </div>\n  );\n});\n"],"names":["Avatar","avatarCss"],"mappings":";;;;;;;;;;;;;;AA4DA,MAAM,YAAA,GAAe,aAAa,YAAY,CAAA;AAC9C,MAAM,mBAAsB,GAAA,CAAA;AAE5B,MAAM,wBAAwB,CAAC,IAAA,KAC7B,IACI,IAAA,IAAA,GAAA,MAAA,GAAA,IAAA,CAAA,KAAA,CAAM,KACP,KAAM,CAAA,CAAA,EAAG,CACT,CAAA,CAAA,GAAA,CAAI,CAAC,CAAM,KAAA,CAAA,CAAE,CAAC,CAAA,CAAA,CACd,KAAK,EACL,CAAA,CAAA,WAAA,EAAA;AAEQ,MAAA,MAAA,GAAS,UAAwC,CAAA,SAASA,OACrE,CAAA;AAAA,EACE,SAAA;AAAA,EACA,QAAU,EAAA,YAAA;AAAA,EACV,KAAQ,GAAA,QAAA;AAAA,EACR,IAAA;AAAA,EACA,cAAiB,GAAA,qBAAA;AAAA,EACjB,GAAA;AAAA,EACA,IAAO,GAAA,mBAAA;AAAA,EACP,KAAO,EAAA,SAAA;AAAA,EACP,YAAc,EAAA,gBAAA;AAAA,EACd,GAAG;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAM,MAAA,EAAE,QAAS,EAAA,GAAI,OAAQ,EAAA;AAE7B,EAAA,MAAM,eACJ,gBAAqB,KAAA,MAAA,uBAClB,QAAS,EAAA,EAAA,aAAA,EAAW,MAAC,CAEtB,GAAA,gBAAA;AAGJ,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,aAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAI,IAAA,QAAA;AAEJ,EAAA,MAAM,KAAQ,GAAA;AAAA,IACZ,GAAG,SAAA;AAAA,IACH,8BAAA,EAAgC,GAAG,IAAI,CAAA;AAAA,GACzC;AAEA,EAAA,MAAM,MAAS,GAAA,cAAA,CAAe,EAAE,GAAA,EAAK,CAAA;AACrC,EAAA,MAAM,mBAAmB,MAAW,KAAA,QAAA;AACpC,EAAA,IAAI,gBAAkB,EAAA;AACpB,IAAA,QAAA,mBAAY,GAAA,CAAA,KAAA,EAAA,EAAI,GAAI,EAAA,EAAA,EAAG,GAAU,EAAA,CAAA;AAAA,GACnC,MAAA,IAAW,gBAAgB,IAAM,EAAA;AAC/B,IAAW,QAAA,GAAA,YAAA;AAAA;AAGb,EAAM,MAAA,cAAA,GAAiB,eAAe,IAAI,CAAA;AAE1C,EAAA,MAAM,YAAY,IACd,GAAA;AAAA,IACE,IAAM,EAAA,KAAA;AAAA,IACN,YAAc,EAAA;AAAA,MAEhB,EAAC;AAEL,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,KAAA;AAAA,MACA,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,KAAK,CAAA;AAAA,QAClB;AAAA,UACE,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG;AAAA,SAC/B;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MACH,GAAG,IAAA;AAAA,MAEH,sBAAY,cAAkB,IAAA;AAAA;AAAA,GACjC;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Avatar.js","sources":["../src/avatar/Avatar.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { makePrefixer } from \"../utils\";\nimport avatarCss from \"./Avatar.css\";\nimport { useAvatarImage } from \"./useAvatarImage\";\n\nexport type NameToInitials = (name?: string) => string;\n\nexport interface AvatarProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * The name that Avatar represents.\n   */\n  name?: string;\n  /**\n   * Defines the function that gets initials. Default is capital first letter of each separate word in name.\n   * If a function is not passed or returns undefined, Avatar will default to Icon.\n   */\n  nameToInitials?: NameToInitials;\n  /**\n   * Image src of Avatar.\n   */\n  src?: string;\n  /**\n   * Multiplier for the base avatar.\n   */\n  size?: number;\n  /**\n   * Icon to be used as a default item. Defaults to `UserIcon`.\n   */\n  fallbackIcon?: ReactNode;\n  /**\n   * Changes Avatar's color.\n   */\n  color?:\n    | \"accent\"\n    | \"category-1\"\n    | \"category-2\"\n    | \"category-3\"\n    | \"category-4\"\n    | \"category-5\"\n    | \"category-6\"\n    | \"category-7\"\n    | \"category-8\"\n    | \"category-9\"\n    | \"category-10\"\n    | \"category-11\"\n    | \"category-12\"\n    | \"category-13\"\n    | \"category-14\"\n    | \"category-15\"\n    | \"category-16\"\n    | \"category-17\"\n    | \"category-18\"\n    | \"category-19\"\n    | \"category-20\";\n}\n\nconst withBaseName = makePrefixer(\"saltAvatar\");\nconst DEFAULT_AVATAR_SIZE = 2; // medium\n\nconst defaultNameToInitials = (name?: string) =>\n  name\n    ?.split(\" \")\n    .slice(0, 2)\n    .map((n) => n[0])\n    .join(\"\")\n    .toUpperCase();\n\nexport const Avatar = forwardRef<HTMLDivElement, AvatarProps>(function Avatar(\n  {\n    className,\n    children: childrenProp,\n    color = \"accent\",\n    name,\n    nameToInitials = defaultNameToInitials,\n    src,\n    size = DEFAULT_AVATAR_SIZE,\n    style: styleProp,\n    fallbackIcon: fallbackIconProp,\n    ...rest\n  },\n  ref,\n) {\n  const targetWindow = useWindow();\n  const { UserIcon } = useIcon();\n\n  const fallbackIcon =\n    fallbackIconProp === undefined ? (\n      <UserIcon aria-hidden />\n    ) : (\n      fallbackIconProp\n    );\n\n  useComponentCssInjection({\n    testId: \"salt-avatar\",\n    css: avatarCss,\n    window: targetWindow,\n  });\n\n  let children: ReactNode;\n\n  const style = {\n    ...styleProp,\n    \"--saltAvatar-size-multiplier\": `${size}`,\n  };\n\n  const status = useAvatarImage({ src });\n  const hasImgNotFailing = status === \"loaded\";\n  if (hasImgNotFailing) {\n    children = <img alt=\"\" src={src} />;\n  } else if (childrenProp != null) {\n    children = childrenProp;\n  }\n\n  const avatarInitials = nameToInitials(name);\n\n  const ariaProps = name\n    ? {\n        role: \"img\",\n        \"aria-label\": name,\n      }\n    : {};\n\n  return (\n    <div\n      ref={ref}\n      style={style}\n      className={clsx(\n        withBaseName(),\n        withBaseName(color),\n        {\n          [withBaseName(\"withImage\")]: hasImgNotFailing,\n        },\n        className,\n      )}\n      {...ariaProps}\n      {...rest}\n    >\n      {children || avatarInitials || fallbackIcon}\n    </div>\n  );\n});\n"],"names":["Avatar","avatarCss"],"mappings":";;;;;;;;;;;;;;AA4DA,MAAM,YAAA,GAAe,aAAa,YAAY,CAAA;AAC9C,MAAM,mBAAA,GAAsB,CAAA;AAE5B,MAAM,wBAAwB,CAAC,IAAA,KAC7B,IAAA,IAAA,IAAA,GAAA,MAAA,GAAA,IAAA,CACI,KAAA,CAAM,KACP,KAAA,CAAM,CAAA,EAAG,CAAA,CAAA,CACT,GAAA,CAAI,CAAC,CAAA,KAAM,CAAA,CAAE,CAAC,CAAA,CAAA,CACd,KAAK,EAAA,CAAA,CACL,WAAA,EAAA;AAEE,MAAM,MAAA,GAAS,UAAA,CAAwC,SAASA,OAAAA,CACrE;AAAA,EACE,SAAA;AAAA,EACA,QAAA,EAAU,YAAA;AAAA,EACV,KAAA,GAAQ,QAAA;AAAA,EACR,IAAA;AAAA,EACA,cAAA,GAAiB,qBAAA;AAAA,EACjB,GAAA;AAAA,EACA,IAAA,GAAO,mBAAA;AAAA,EACP,KAAA,EAAO,SAAA;AAAA,EACP,YAAA,EAAc,gBAAA;AAAA,EACd,GAAG;AACL,CAAA,EACA,GAAA,EACA;AACA,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,OAAA,EAAQ;AAE7B,EAAA,MAAM,eACJ,gBAAA,KAAqB,MAAA,uBAClB,QAAA,EAAA,EAAS,aAAA,EAAW,MAAC,CAAA,GAEtB,gBAAA;AAGJ,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,aAAA;AAAA,IACR,GAAA,EAAKC,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,IAAI,QAAA;AAEJ,EAAA,MAAM,KAAA,GAAQ;AAAA,IACZ,GAAG,SAAA;AAAA,IACH,8BAAA,EAAgC,GAAG,IAAI,CAAA;AAAA,GACzC;AAEA,EAAA,MAAM,MAAA,GAAS,cAAA,CAAe,EAAE,GAAA,EAAK,CAAA;AACrC,EAAA,MAAM,mBAAmB,MAAA,KAAW,QAAA;AACpC,EAAA,IAAI,gBAAA,EAAkB;AACpB,IAAA,QAAA,mBAAW,GAAA,CAAC,KAAA,EAAA,EAAI,GAAA,EAAI,EAAA,EAAG,GAAA,EAAU,CAAA;AAAA,EACnC,CAAA,MAAA,IAAW,gBAAgB,IAAA,EAAM;AAC/B,IAAA,QAAA,GAAW,YAAA;AAAA,EACb;AAEA,EAAA,MAAM,cAAA,GAAiB,eAAe,IAAI,CAAA;AAE1C,EAAA,MAAM,YAAY,IAAA,GACd;AAAA,IACE,IAAA,EAAM,KAAA;AAAA,IACN,YAAA,EAAc;AAAA,MAEhB,EAAC;AAEL,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,KAAA;AAAA,MACA,SAAA,EAAW,IAAA;AAAA,QACT,YAAA,EAAa;AAAA,QACb,aAAa,KAAK,CAAA;AAAA,QAClB;AAAA,UACE,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG;AAAA,SAC/B;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MACH,GAAG,IAAA;AAAA,MAEH,sBAAY,cAAA,IAAkB;AAAA;AAAA,GACjC;AAEJ,CAAC;;;;"}

package/dist-es/avatar/useAvatarImage.js

@@ -1,4 +1,4 @@
-import { useState, useEffect } from 'react';
+import { useRef, useState } from 'react';
 import 'clsx';
 import 'react/jsx-runtime';
 import { useIsomorphicLayoutEffect } from '../utils/useIsomorphicLayoutEffect.js';
@@ -6,29 +6,57 @@ import '../utils/useFloatingUI/useFloatingUI.js';
 import '../utils/useId.js';
 import '../salt-provider/SaltProvider.js';
 import '../viewport/ViewportProvider.js';
+import { useIsHydrated } from './useIsHydrated.js';
 
-function useAvatarImage({ src }) {
-  const [status, setStatus] = useState("loading");
-  useEffect(() => {
-    setStatus(src ? "loading" : "pending");
-  }, [src]);
+function resolveStatus(image, src) {
+  if (!image) {
+    return "pending";
+  }
+  if (!src) {
+    return "error";
+  }
+  if (image.src !== src) {
+    image.src = src;
+  }
+  return image.complete && image.naturalWidth > 0 ? "loaded" : "loading";
+}
+function useAvatarImage({
+  src,
+  referrerPolicy,
+  crossOrigin
+}) {
+  const isHydrated = useIsHydrated();
+  const imageRef = useRef(null);
+  const image = (() => {
+    if (!isHydrated) return null;
+    if (!imageRef.current) {
+      imageRef.current = new Image();
+    }
+    return imageRef.current;
+  })();
+  const [status, setStatus] = useState(
+    () => resolveStatus(image, src)
+  );
   useIsomorphicLayoutEffect(() => {
-    if (!src) {
-      return;
+    setStatus(resolveStatus(image, src));
+  }, [image, src]);
+  useIsomorphicLayoutEffect(() => {
+    if (!image) return;
+    const handleLoad = () => setStatus("loaded");
+    const handleError = () => setStatus("error");
+    image.addEventListener("load", handleLoad);
+    image.addEventListener("error", handleError);
+    if (referrerPolicy) {
+      image.referrerPolicy = referrerPolicy;
+    }
+    if (typeof crossOrigin === "string") {
+      image.crossOrigin = crossOrigin;
     }
-    let active = true;
-    const image = new Image();
-    image.src = src;
-    const onLoad = () => active && setStatus("loaded");
-    const onError = () => active && setStatus("error");
-    image.addEventListener("load", onLoad, { once: true });
-    image.addEventListener("error", onError, { once: true });
     return () => {
-      image.removeEventListener("load", onLoad);
-      image.removeEventListener("load", onError);
-      active = false;
+      image.removeEventListener("load", handleLoad);
+      image.removeEventListener("error", handleError);
     };
-  }, [src]);
+  }, [image, crossOrigin, referrerPolicy]);
   return status;
 }
 

package/dist-es/avatar/useAvatarImage.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAvatarImage.js","sources":["../src/avatar/useAvatarImage.ts"],"sourcesContent":["import { type ImgHTMLAttributes, useEffect, useState } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../utils\";\n\nexport function useAvatarImage({ src }: ImgHTMLAttributes<HTMLImageElement>) {\n  const [status, setStatus] = useState<\n    \"pending\" | \"loading\" | \"loaded\" | \"error\"\n  >(\"loading\");\n\n  useEffect(() => {\n    setStatus(src ? \"loading\" : \"pending\");\n  }, [src]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (!src) {\n      return;\n    }\n\n    let active = true;\n    const image = new Image();\n    image.src = src;\n    const onLoad = () => active && setStatus(\"loaded\");\n    const onError = () => active && setStatus(\"error\");\n\n    image.addEventListener(\"load\", onLoad, { once: true });\n    image.addEventListener(\"error\", onError, { once: true });\n\n    return () => {\n      image.removeEventListener(\"load\", onLoad);\n      image.removeEventListener(\"load\", onError);\n      active = false;\n    };\n  }, [src]);\n\n  return status;\n}\n"],"names":[],"mappings":";;;;;;;;;AAGgB,SAAA,cAAA,CAAe,EAAE,GAAA,EAA4C,EAAA;AAC3E,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,SAE1B,SAAS,CAAA;AAEX,EAAA,SAAA,CAAU,MAAM;AACd,IAAU,SAAA,CAAA,GAAA,GAAM,YAAY,SAAS,CAAA;AAAA,GACvC,EAAG,CAAC,GAAG,CAAC,CAAA;AAER,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,CAAC,GAAK,EAAA;AACR,MAAA;AAAA;AAGF,IAAA,IAAI,MAAS,GAAA,IAAA;AACb,IAAM,MAAA,KAAA,GAAQ,IAAI,KAAM,EAAA;AACxB,IAAA,KAAA,CAAM,GAAM,GAAA,GAAA;AACZ,IAAA,MAAM,MAAS,GAAA,MAAM,MAAU,IAAA,SAAA,CAAU,QAAQ,CAAA;AACjD,IAAA,MAAM,OAAU,GAAA,MAAM,MAAU,IAAA,SAAA,CAAU,OAAO,CAAA;AAEjD,IAAA,KAAA,CAAM,iBAAiB,MAAQ,EAAA,MAAA,EAAQ,EAAE,IAAA,EAAM,MAAM,CAAA;AACrD,IAAA,KAAA,CAAM,iBAAiB,OAAS,EAAA,OAAA,EAAS,EAAE,IAAA,EAAM,MAAM,CAAA;AAEvD,IAAA,OAAO,MAAM;AACX,MAAM,KAAA,CAAA,mBAAA,CAAoB,QAAQ,MAAM,CAAA;AACxC,MAAM,KAAA,CAAA,mBAAA,CAAoB,QAAQ,OAAO,CAAA;AACzC,MAAS,MAAA,GAAA,KAAA;AAAA,KACX;AAAA,GACF,EAAG,CAAC,GAAG,CAAC,CAAA;AAER,EAAO,OAAA,MAAA;AACT;;;;"}
+{"version":3,"file":"useAvatarImage.js","sources":["../src/avatar/useAvatarImage.ts"],"sourcesContent":["import { type ImgHTMLAttributes, useRef, useState } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../utils\";\nimport { useIsHydrated } from \"./useIsHydrated\";\n\ntype ImageLoadingStatus = \"pending\" | \"loading\" | \"loaded\" | \"error\";\n\nfunction resolveStatus(\n  image: HTMLImageElement | null,\n  src?: string,\n): ImageLoadingStatus {\n  if (!image) {\n    return \"pending\";\n  }\n  if (!src) {\n    return \"error\";\n  }\n  if (image.src !== src) {\n    image.src = src;\n  }\n  return image.complete && image.naturalWidth > 0 ? \"loaded\" : \"loading\";\n}\n\nexport function useAvatarImage({\n  src,\n  referrerPolicy,\n  crossOrigin,\n}: ImgHTMLAttributes<HTMLImageElement>) {\n  const isHydrated = useIsHydrated();\n  const imageRef = useRef<HTMLImageElement | null>(null);\n  const image = (() => {\n    if (!isHydrated) return null;\n    if (!imageRef.current) {\n      imageRef.current = new Image();\n    }\n    return imageRef.current;\n  })();\n\n  const [status, setStatus] = useState<ImageLoadingStatus>(() =>\n    resolveStatus(image, src),\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    setStatus(resolveStatus(image, src));\n  }, [image, src]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (!image) return;\n\n    const handleLoad = () => setStatus(\"loaded\");\n    const handleError = () => setStatus(\"error\");\n    image.addEventListener(\"load\", handleLoad);\n    image.addEventListener(\"error\", handleError);\n    if (referrerPolicy) {\n      image.referrerPolicy = referrerPolicy;\n    }\n    if (typeof crossOrigin === \"string\") {\n      image.crossOrigin = crossOrigin;\n    }\n\n    return () => {\n      image.removeEventListener(\"load\", handleLoad);\n      image.removeEventListener(\"error\", handleError);\n    };\n  }, [image, crossOrigin, referrerPolicy]);\n\n  return status;\n}\n"],"names":[],"mappings":";;;;;;;;;;AAMA,SAAS,aAAA,CACP,OACA,GAAA,EACoB;AACpB,EAAA,IAAI,CAAC,KAAA,EAAO;AACV,IAAA,OAAO,SAAA;AAAA,EACT;AACA,EAAA,IAAI,CAAC,GAAA,EAAK;AACR,IAAA,OAAO,OAAA;AAAA,EACT;AACA,EAAA,IAAI,KAAA,CAAM,QAAQ,GAAA,EAAK;AACrB,IAAA,KAAA,CAAM,GAAA,GAAM,GAAA;AAAA,EACd;AACA,EAAA,OAAO,KAAA,CAAM,QAAA,IAAY,KAAA,CAAM,YAAA,GAAe,IAAI,QAAA,GAAW,SAAA;AAC/D;AAEO,SAAS,cAAA,CAAe;AAAA,EAC7B,GAAA;AAAA,EACA,cAAA;AAAA,EACA;AACF,CAAA,EAAwC;AACtC,EAAA,MAAM,aAAa,aAAA,EAAc;AACjC,EAAA,MAAM,QAAA,GAAW,OAAgC,IAAI,CAAA;AACrD,EAAA,MAAM,SAAS,MAAM;AACnB,IAAA,IAAI,CAAC,YAAY,OAAO,IAAA;AACxB,IAAA,IAAI,CAAC,SAAS,OAAA,EAAS;AACrB,MAAA,QAAA,CAAS,OAAA,GAAU,IAAI,KAAA,EAAM;AAAA,IAC/B;AACA,IAAA,OAAO,QAAA,CAAS,OAAA;AAAA,EAClB,CAAA,GAAG;AAEH,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,QAAA;AAAA,IAA6B,MACvD,aAAA,CAAc,KAAA,EAAO,GAAG;AAAA,GAC1B;AAEA,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,SAAA,CAAU,aAAA,CAAc,KAAA,EAAO,GAAG,CAAC,CAAA;AAAA,EACrC,CAAA,EAAG,CAAC,KAAA,EAAO,GAAG,CAAC,CAAA;AAEf,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,CAAC,KAAA,EAAO;AAEZ,IAAA,MAAM,UAAA,GAAa,MAAM,SAAA,CAAU,QAAQ,CAAA;AAC3C,IAAA,MAAM,WAAA,GAAc,MAAM,SAAA,CAAU,OAAO,CAAA;AAC3C,IAAA,KAAA,CAAM,gBAAA,CAAiB,QAAQ,UAAU,CAAA;AACzC,IAAA,KAAA,CAAM,gBAAA,CAAiB,SAAS,WAAW,CAAA;AAC3C,IAAA,IAAI,cAAA,EAAgB;AAClB,MAAA,KAAA,CAAM,cAAA,GAAiB,cAAA;AAAA,IACzB;AACA,IAAA,IAAI,OAAO,gBAAgB,QAAA,EAAU;AACnC,MAAA,KAAA,CAAM,WAAA,GAAc,WAAA;AAAA,IACtB;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,KAAA,CAAM,mBAAA,CAAoB,QAAQ,UAAU,CAAA;AAC5C,MAAA,KAAA,CAAM,mBAAA,CAAoB,SAAS,WAAW,CAAA;AAAA,IAChD,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,KAAA,EAAO,WAAA,EAAa,cAAc,CAAC,CAAA;AAEvC,EAAA,OAAO,MAAA;AACT;;;;"}

package/dist-es/avatar/useIsHydrated.js

@@ -0,0 +1,16 @@
+import { useSyncExternalStore } from 'use-sync-external-store/shim';
+
+function subscribe() {
+  return () => {
+  };
+}
+function useIsHydrated() {
+  return useSyncExternalStore(
+    subscribe,
+    () => true,
+    () => false
+  );
+}
+
+export { useIsHydrated };
+//# sourceMappingURL=useIsHydrated.js.map

package/dist-es/avatar/useIsHydrated.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsHydrated.js","sources":["../src/avatar/useIsHydrated.ts"],"sourcesContent":["import { useSyncExternalStore } from \"use-sync-external-store/shim\";\n\nfunction subscribe() {\n  return () => {};\n}\n\n// TODO consider moving this to utils\nexport function useIsHydrated() {\n  return useSyncExternalStore(\n    subscribe,\n    () => true,\n    () => false,\n  );\n}\n"],"names":[],"mappings":";;AAEA,SAAS,SAAA,GAAY;AACnB,EAAA,OAAO,MAAM;AAAA,EAAC,CAAA;AAChB;AAGO,SAAS,aAAA,GAAgB;AAC9B,EAAA,OAAO,oBAAA;AAAA,IACL,SAAA;AAAA,IACA,MAAM,IAAA;AAAA,IACN,MAAM;AAAA,GACR;AACF;;;;"}

package/dist-es/badge/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","sources":["../src/badge/Badge.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\nimport { makePrefixer } from \"../utils\";\n\nimport badgeCss from \"./Badge.css\";\n\nexport interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {\n  /**\n   * The number to display on the badge. If `value` is not provided,\n   * the badge will render as a dot badge.\n   */\n  value?: number | string;\n  /**\n   * If a child is provided the Badge will render top right. By defualt renders inline.\n   */\n  children?: ReactNode;\n  /**\n   * The max number to display on the badge.\n   */\n  max?: number;\n}\nconst withBaseName = makePrefixer(\"saltBadge\");\n\nexport const Badge = forwardRef<HTMLSpanElement, BadgeProps>(function Badge(\n  { value, max = 999, className, children, ...rest },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-badge\",\n    css: badgeCss,\n    window: targetWindow,\n  });\n\n  const valueText =\n    typeof value === \"number\" && value > max ? `${max}+` : value;\n\n  const dotBadge = typeof value === \"undefined\";\n\n  return (\n    <span className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n      {children}\n      <span\n        className={clsx(withBaseName(\"badge\"), {\n          [withBaseName(\"topRight\")]: children,\n          [withBaseName(\"dotBadge\")]: dotBadge,\n        })}\n      >\n        {valueText}\n      </span>\n    </span>\n  );\n});\n"],"names":["Badge","badgeCss"],"mappings":";;;;;;;;;;;;AAuBA,MAAM,YAAA,GAAe,aAAa,WAAW,CAAA;AAEtC,MAAM,KAAQ,GAAA,UAAA,CAAwC,SAASA,MAAAA,CACpE,EAAE,KAAA,EAAO,GAAM,GAAA,GAAA,EAAK,SAAW,EAAA,QAAA,EAAU,GAAG,IAAA,IAC5C,GACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,SAAA,GACJ,OAAO,KAAU,KAAA,QAAA,IAAY,QAAQ,GAAM,GAAA,CAAA,EAAG,GAAG,CAAM,CAAA,CAAA,GAAA,KAAA;AAEzD,EAAM,MAAA,QAAA,GAAW,OAAO,KAAU,KAAA,WAAA;AAElC,EACE,uBAAA,IAAA,CAAC,MAAK,EAAA,EAAA,SAAA,EAAW,IAAK,CAAA,YAAA,IAAgB,SAAS,CAAA,EAAG,GAAW,EAAA,GAAG,IAC7D,EAAA,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,oBACD,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAA,IAAA,CAAK,YAAa,CAAA,OAAO,CAAG,EAAA;AAAA,UACrC,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,QAAA;AAAA,UAC5B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG;AAAA,SAC7B,CAAA;AAAA,QAEA,QAAA,EAAA;AAAA;AAAA;AACH,GACF,EAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Badge.js","sources":["../src/badge/Badge.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\nimport { makePrefixer } from \"../utils\";\n\nimport badgeCss from \"./Badge.css\";\n\nexport interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {\n  /**\n   * The number to display on the badge. If `value` is not provided,\n   * the badge will render as a dot badge.\n   */\n  value?: number | string;\n  /**\n   * If a child is provided the Badge will render top right. By defualt renders inline.\n   */\n  children?: ReactNode;\n  /**\n   * The max number to display on the badge.\n   */\n  max?: number;\n}\nconst withBaseName = makePrefixer(\"saltBadge\");\n\nexport const Badge = forwardRef<HTMLSpanElement, BadgeProps>(function Badge(\n  { value, max = 999, className, children, ...rest },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-badge\",\n    css: badgeCss,\n    window: targetWindow,\n  });\n\n  const valueText =\n    typeof value === \"number\" && value > max ? `${max}+` : value;\n\n  const dotBadge = typeof value === \"undefined\";\n\n  return (\n    <span className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n      {children}\n      <span\n        className={clsx(withBaseName(\"badge\"), {\n          [withBaseName(\"topRight\")]: children,\n          [withBaseName(\"dotBadge\")]: dotBadge,\n        })}\n      >\n        {valueText}\n      </span>\n    </span>\n  );\n});\n"],"names":["Badge","badgeCss"],"mappings":";;;;;;;;;;;;AAuBA,MAAM,YAAA,GAAe,aAAa,WAAW,CAAA;AAEtC,MAAM,KAAA,GAAQ,UAAA,CAAwC,SAASA,MAAAA,CACpE,EAAE,KAAA,EAAO,GAAA,GAAM,GAAA,EAAK,SAAA,EAAW,QAAA,EAAU,GAAG,IAAA,IAC5C,GAAA,EACA;AACA,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,YAAA;AAAA,IACR,GAAA,EAAKC,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,SAAA,GACJ,OAAO,KAAA,KAAU,QAAA,IAAY,QAAQ,GAAA,GAAM,CAAA,EAAG,GAAG,CAAA,CAAA,CAAA,GAAM,KAAA;AAEzD,EAAA,MAAM,QAAA,GAAW,OAAO,KAAA,KAAU,WAAA;AAElC,EAAA,uBACE,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,IAAA,CAAK,YAAA,IAAgB,SAAS,CAAA,EAAG,GAAA,EAAW,GAAG,IAAA,EAC7D,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,oBACD,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,IAAA,CAAK,YAAA,CAAa,OAAO,CAAA,EAAG;AAAA,UACrC,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,QAAA;AAAA,UAC5B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG;AAAA,SAC7B,CAAA;AAAA,QAEA,QAAA,EAAA;AAAA;AAAA;AACH,GAAA,EACF,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/banner/Banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.js","sources":["../src/banner/Banner.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes } from \"react\";\nimport { StatusIndicator, type ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\n\nimport bannerCss from \"./Banner.css\";\n\nexport interface BannerProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Emphasize the styling by applying a background color: defaults to false\n   */\n  variant?: \"primary\" | \"secondary\";\n  /**\n   *  A string to determine the current state of the Banner\n   */\n  status?: ValidationStatus;\n}\n\nconst withBaseName = makePrefixer(\"saltBanner\");\n\nexport const Banner = forwardRef<HTMLDivElement, BannerProps>(function Banner(\n  { children, className, variant = \"primary\", status = \"info\", ...rest },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-banner\",\n    css: bannerCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      className={clsx(\n        withBaseName(),\n        withBaseName(status),\n        withBaseName(variant),\n        className,\n      )}\n      ref={ref}\n      {...rest}\n      aria-live=\"polite\"\n    >\n      <StatusIndicator status={status} className={withBaseName(\"icon\")} />\n      {children}\n    </div>\n  );\n});\n"],"names":["Banner","bannerCss"],"mappings":";;;;;;;;;;;;;AAoBA,MAAM,YAAA,GAAe,aAAa,YAAY,CAAA;AAEvC,MAAM,MAAS,GAAA,UAAA,CAAwC,SAASA,OAAAA,CACrE,EAAE,QAAU,EAAA,SAAA,EAAW,OAAU,GAAA,SAAA,EAAW,MAAS,GAAA,MAAA,EAAQ,GAAG,IAAA,IAChE,GACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,aAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EACE,uBAAA,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,MAAM,CAAA;AAAA,QACnB,aAAa,OAAO,CAAA;AAAA,QACpB;AAAA,OACF;AAAA,MACA,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MACJ,WAAU,EAAA,QAAA;AAAA,MAEV,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,eAAgB,EAAA,EAAA,MAAA,EAAgB,SAAW,EAAA,YAAA,CAAa,MAAM,CAAG,EAAA,CAAA;AAAA,QACjE;AAAA;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Banner.js","sources":["../src/banner/Banner.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes } from \"react\";\nimport { StatusIndicator, type ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\n\nimport bannerCss from \"./Banner.css\";\n\nexport interface BannerProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Emphasize the styling by applying a background color: defaults to false\n   */\n  variant?: \"primary\" | \"secondary\";\n  /**\n   *  A string to determine the current state of the Banner\n   */\n  status?: ValidationStatus;\n}\n\nconst withBaseName = makePrefixer(\"saltBanner\");\n\nexport const Banner = forwardRef<HTMLDivElement, BannerProps>(function Banner(\n  { children, className, variant = \"primary\", status = \"info\", ...rest },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-banner\",\n    css: bannerCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      className={clsx(\n        withBaseName(),\n        withBaseName(status),\n        withBaseName(variant),\n        className,\n      )}\n      ref={ref}\n      {...rest}\n      aria-live=\"polite\"\n    >\n      <StatusIndicator status={status} className={withBaseName(\"icon\")} />\n      {children}\n    </div>\n  );\n});\n"],"names":["Banner","bannerCss"],"mappings":";;;;;;;;;;;;;AAoBA,MAAM,YAAA,GAAe,aAAa,YAAY,CAAA;AAEvC,MAAM,MAAA,GAAS,UAAA,CAAwC,SAASA,OAAAA,CACrE,EAAE,QAAA,EAAU,SAAA,EAAW,OAAA,GAAU,SAAA,EAAW,MAAA,GAAS,MAAA,EAAQ,GAAG,IAAA,IAChE,GAAA,EACA;AACA,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,aAAA;AAAA,IACR,GAAA,EAAKC,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,IAAA;AAAA,QACT,YAAA,EAAa;AAAA,QACb,aAAa,MAAM,CAAA;AAAA,QACnB,aAAa,OAAO,CAAA;AAAA,QACpB;AAAA,OACF;AAAA,MACA,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MACJ,WAAA,EAAU,QAAA;AAAA,MAEV,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,eAAA,EAAA,EAAgB,MAAA,EAAgB,SAAA,EAAW,YAAA,CAAa,MAAM,CAAA,EAAG,CAAA;AAAA,QACjE;AAAA;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}

package/dist-es/banner/BannerActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerActions.js","sources":["../src/banner/BannerActions.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport bannerActionsCss from \"./BannerActions.css\";\n\nconst withBaseName = makePrefixer(\"saltBannerActions\");\n\ninterface BannerActionsProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of BannerActions\n   */\n  children: ReactNode;\n}\n\nexport const BannerActions = forwardRef<HTMLDivElement, BannerActionsProps>(\n  function BannerActions(props, ref) {\n    const { className, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-banner-actions\",\n      css: bannerActionsCss,\n      window: targetWindow,\n    });\n\n    return (\n      <div className={clsx(withBaseName(), className)} {...rest} ref={ref} />\n    );\n  },\n);\n"],"names":["BannerActions","bannerActionsCss"],"mappings":";;;;;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAS9C,MAAM,aAAgB,GAAA,UAAA;AAAA,EAC3B,SAASA,cAAc,CAAA,KAAA,EAAO,GAAK,EAAA;AACjC,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAS,GAAA,KAAA;AAE/B,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IACE,uBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,IAAK,CAAA,YAAA,IAAgB,SAAS,CAAA,EAAI,GAAG,IAAA,EAAM,GAAU,EAAA,CAAA;AAAA;AAG3E;;;;"}
+{"version":3,"file":"BannerActions.js","sources":["../src/banner/BannerActions.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport bannerActionsCss from \"./BannerActions.css\";\n\nconst withBaseName = makePrefixer(\"saltBannerActions\");\n\ninterface BannerActionsProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of BannerActions\n   */\n  children: ReactNode;\n}\n\nexport const BannerActions = forwardRef<HTMLDivElement, BannerActionsProps>(\n  function BannerActions(props, ref) {\n    const { className, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-banner-actions\",\n      css: bannerActionsCss,\n      window: targetWindow,\n    });\n\n    return (\n      <div className={clsx(withBaseName(), className)} {...rest} ref={ref} />\n    );\n  },\n);\n"],"names":["BannerActions","bannerActionsCss"],"mappings":";;;;;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAS9C,MAAM,aAAA,GAAgB,UAAA;AAAA,EAC3B,SAASA,cAAAA,CAAc,KAAA,EAAO,GAAA,EAAK;AACjC,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,KAAA;AAE/B,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,qBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,IAAA,CAAK,YAAA,IAAgB,SAAS,CAAA,EAAI,GAAG,IAAA,EAAM,GAAA,EAAU,CAAA;AAAA,EAEzE;AACF;;;;"}

package/dist-es/banner/BannerContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerContent.js","sources":["../src/banner/BannerContent.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport bannerContentCss from \"./BannerContent.css\";\n\nconst withBaseName = makePrefixer(\"saltBannerContent\");\n\ninterface BannerContentProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of BannerContent\n   */\n  children: ReactNode;\n}\n\nexport const BannerContent = forwardRef<HTMLDivElement, BannerContentProps>(\n  function BannerContent(props, ref) {\n    const { className, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-banner-content\",\n      css: bannerContentCss,\n      window: targetWindow,\n    });\n\n    return (\n      <div className={clsx(withBaseName(), className)} {...rest} ref={ref} />\n    );\n  },\n);\n"],"names":["BannerContent","bannerContentCss"],"mappings":";;;;;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAS9C,MAAM,aAAgB,GAAA,UAAA;AAAA,EAC3B,SAASA,cAAc,CAAA,KAAA,EAAO,GAAK,EAAA;AACjC,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAS,GAAA,KAAA;AAE/B,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IACE,uBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,IAAK,CAAA,YAAA,IAAgB,SAAS,CAAA,EAAI,GAAG,IAAA,EAAM,GAAU,EAAA,CAAA;AAAA;AAG3E;;;;"}
+{"version":3,"file":"BannerContent.js","sources":["../src/banner/BannerContent.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport bannerContentCss from \"./BannerContent.css\";\n\nconst withBaseName = makePrefixer(\"saltBannerContent\");\n\ninterface BannerContentProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of BannerContent\n   */\n  children: ReactNode;\n}\n\nexport const BannerContent = forwardRef<HTMLDivElement, BannerContentProps>(\n  function BannerContent(props, ref) {\n    const { className, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-banner-content\",\n      css: bannerContentCss,\n      window: targetWindow,\n    });\n\n    return (\n      <div className={clsx(withBaseName(), className)} {...rest} ref={ref} />\n    );\n  },\n);\n"],"names":["BannerContent","bannerContentCss"],"mappings":";;;;;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAS9C,MAAM,aAAA,GAAgB,UAAA;AAAA,EAC3B,SAASA,cAAAA,CAAc,KAAA,EAAO,GAAA,EAAK;AACjC,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,KAAA;AAE/B,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,qBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,IAAA,CAAK,YAAA,IAAgB,SAAS,CAAA,EAAI,GAAG,IAAA,EAAM,GAAA,EAAU,CAAA;AAAA,EAEzE;AACF;;;;"}

package/dist-es/border-item/BorderItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"BorderItem.js","sources":["../src/border-item/BorderItem.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ElementType,\n  type ForwardedRef,\n  type FunctionComponent,\n  forwardRef,\n} from \"react\";\nimport { GridItem, type GridItemProps } from \"../grid-item\";\nimport {\n  makePrefixer,\n  type PolymorphicComponentPropWithRef,\n  type ResponsiveProp,\n} from \"../utils\";\nimport borderItemCss from \"./BorderItem.css\";\n\nexport const BORDER_POSITION = [\n  \"north\",\n  \"west\",\n  \"center\",\n  \"east\",\n  \"south\",\n] as const;\n\nexport type BorderPosition = (typeof BORDER_POSITION)[number];\n\nexport type BorderItemProps<T extends ElementType> =\n  PolymorphicComponentPropWithRef<\n    T,\n    {\n      /**\n       * Aligns a grid item inside a cell along the inline (row) axis. Defaults to \"stretch\"\n       */\n      horizontalAlignment?: GridItemProps<T>[\"horizontalAlignment\"];\n      /**\n       * Aligns a grid item inside a cell along the block (column) axis. Defaults to \"stretch\"\n       */\n      verticalAlignment?: GridItemProps<T>[\"verticalAlignment\"];\n      /**\n       * Position in the Border Layout\n       */\n      position: BorderPosition;\n      /**\n       * Defines if the item should stick to the edges of its container. Defaults to \"false\"\n       */\n      sticky?: boolean;\n      /**\n       * Defines the margin around the component. It can be specified as a number (which acts as a multiplier) or a string representing the margin value. Default is `0`.\n       */\n      margin?: ResponsiveProp<number | string>;\n      /**\n       * Defines the padding within the component. It can be specified as a number (which acts as a multiplier) or a string representing the padding value. Default is `0`.\n       */\n      padding?: ResponsiveProp<number | string>;\n    }\n  >;\n\nconst withBaseName = makePrefixer(\"saltBorderItem\");\n\ntype BorderItemComponent = <T extends ElementType = \"div\">(\n  props: BorderItemProps<T>,\n) => ReturnType<FunctionComponent>;\n\nexport const BorderItem: BorderItemComponent = forwardRef(function BorderItem<\n  T extends ElementType,\n>(props: unknown, ref?: ForwardedRef<unknown>) {\n  // Props need to be typed this way due to polymorphic types not working with required props.\n  const {\n    as,\n    children,\n    className,\n    position,\n    sticky = false,\n    style,\n    ...rest\n  } = props as BorderItemProps<T>;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-border-item\",\n    css: borderItemCss,\n    window: targetWindow,\n  });\n\n  const gridItemStyles = {\n    ...style,\n    \"--gridItem-gridArea\": position,\n  };\n\n  return (\n    <GridItem\n      as={as as ElementType}\n      ref={ref}\n      className={clsx(\n        withBaseName(),\n        \"saltGridItem-area\",\n        {\n          [withBaseName(\"sticky\")]: sticky,\n        },\n        className,\n      )}\n      style={gridItemStyles}\n      {...rest}\n    >\n      {children}\n    </GridItem>\n  );\n});\n"],"names":["BorderItem","borderItemCss"],"mappings":";;;;;;;;;;;;;AAiBO,MAAM,eAAkB,GAAA;AAAA,EAC7B,OAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAA;AAAA,EACA;AACF;AAmCA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA;AAM3C,MAAM,UAAkC,GAAA,UAAA,CAAW,SAASA,WAAAA,CAEjE,OAAgB,GAA6B,EAAA;AAE7C,EAAM,MAAA;AAAA,IACJ,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAS,GAAA,KAAA;AAAA,IACT,KAAA;AAAA,IACA,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,cAAiB,GAAA;AAAA,IACrB,GAAG,KAAA;AAAA,IACH,qBAAuB,EAAA;AAAA,GACzB;AAEA,EACE,uBAAA,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,GAAA;AAAA,MACA,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,mBAAA;AAAA,QACA;AAAA,UACE,CAAC,YAAA,CAAa,QAAQ,CAAC,GAAG;AAAA,SAC5B;AAAA,QACA;AAAA,OACF;AAAA,MACA,KAAO,EAAA,cAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}
+{"version":3,"file":"BorderItem.js","sources":["../src/border-item/BorderItem.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ElementType,\n  type ForwardedRef,\n  type FunctionComponent,\n  forwardRef,\n} from \"react\";\nimport { GridItem, type GridItemProps } from \"../grid-item\";\nimport {\n  makePrefixer,\n  type PolymorphicComponentPropWithRef,\n  type ResponsiveProp,\n} from \"../utils\";\nimport borderItemCss from \"./BorderItem.css\";\n\nexport const BORDER_POSITION = [\n  \"north\",\n  \"west\",\n  \"center\",\n  \"east\",\n  \"south\",\n] as const;\n\nexport type BorderPosition = (typeof BORDER_POSITION)[number];\n\nexport type BorderItemProps<T extends ElementType> =\n  PolymorphicComponentPropWithRef<\n    T,\n    {\n      /**\n       * Aligns a grid item inside a cell along the inline (row) axis. Defaults to \"stretch\"\n       */\n      horizontalAlignment?: GridItemProps<T>[\"horizontalAlignment\"];\n      /**\n       * Aligns a grid item inside a cell along the block (column) axis. Defaults to \"stretch\"\n       */\n      verticalAlignment?: GridItemProps<T>[\"verticalAlignment\"];\n      /**\n       * Position in the Border Layout\n       */\n      position: BorderPosition;\n      /**\n       * Defines if the item should stick to the edges of its container. Defaults to \"false\"\n       */\n      sticky?: boolean;\n      /**\n       * Defines the margin around the component. It can be specified as a number (which acts as a multiplier) or a string representing the margin value. Default is `0`.\n       */\n      margin?: ResponsiveProp<number | string>;\n      /**\n       * Defines the padding within the component. It can be specified as a number (which acts as a multiplier) or a string representing the padding value. Default is `0`.\n       */\n      padding?: ResponsiveProp<number | string>;\n    }\n  >;\n\nconst withBaseName = makePrefixer(\"saltBorderItem\");\n\ntype BorderItemComponent = <T extends ElementType = \"div\">(\n  props: BorderItemProps<T>,\n) => ReturnType<FunctionComponent>;\n\nexport const BorderItem: BorderItemComponent = forwardRef(function BorderItem<\n  T extends ElementType,\n>(props: unknown, ref?: ForwardedRef<unknown>) {\n  // Props need to be typed this way due to polymorphic types not working with required props.\n  const {\n    as,\n    children,\n    className,\n    position,\n    sticky = false,\n    style,\n    ...rest\n  } = props as BorderItemProps<T>;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-border-item\",\n    css: borderItemCss,\n    window: targetWindow,\n  });\n\n  const gridItemStyles = {\n    ...style,\n    \"--gridItem-gridArea\": position,\n  };\n\n  return (\n    <GridItem\n      as={as as ElementType}\n      ref={ref}\n      className={clsx(\n        withBaseName(),\n        \"saltGridItem-area\",\n        {\n          [withBaseName(\"sticky\")]: sticky,\n        },\n        className,\n      )}\n      style={gridItemStyles}\n      {...rest}\n    >\n      {children}\n    </GridItem>\n  );\n});\n"],"names":["BorderItem","borderItemCss"],"mappings":";;;;;;;;;;;;;AAiBO,MAAM,eAAA,GAAkB;AAAA,EAC7B,OAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAA;AAAA,EACA;AACF;AAmCA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA;AAM3C,MAAM,UAAA,GAAkC,UAAA,CAAW,SAASA,WAAAA,CAEjE,OAAgB,GAAA,EAA6B;AAE7C,EAAA,MAAM;AAAA,IACJ,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA,GAAS,KAAA;AAAA,IACT,KAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,kBAAA;AAAA,IACR,GAAA,EAAKC,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,cAAA,GAAiB;AAAA,IACrB,GAAG,KAAA;AAAA,IACH,qBAAA,EAAuB;AAAA,GACzB;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,GAAA;AAAA,MACA,SAAA,EAAW,IAAA;AAAA,QACT,YAAA,EAAa;AAAA,QACb,mBAAA;AAAA,QACA;AAAA,UACE,CAAC,YAAA,CAAa,QAAQ,CAAC,GAAG;AAAA,SAC5B;AAAA,QACA;AAAA,OACF;AAAA,MACA,KAAA,EAAO,cAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}

package/dist-es/border-layout/BorderLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"BorderLayout.js","sources":["../src/border-layout/BorderLayout.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  Children,\n  type ElementType,\n  type ForwardedRef,\n  type FunctionComponent,\n  forwardRef,\n  isValidElement,\n  type ReactNode,\n  useEffect,\n} from \"react\";\n\nimport type { BorderPosition } from \"../border-item\";\nimport { GridLayout, type GridLayoutProps } from \"../grid-layout\";\nimport {\n  makePrefixer,\n  type PolymorphicComponentPropWithRef,\n  type ResponsiveProp,\n} from \"../utils\";\n\nexport type BorderLayoutProps<T extends ElementType> =\n  PolymorphicComponentPropWithRef<\n    T,\n    {\n      /**\n       * Defines the size of the gutter between the columns and the rows by setting a density multiplier. Defaults to 0\n       */\n      gap?: GridLayoutProps<T>[\"gap\"];\n      /**\n       * Defines the size of the gutter between the columns by setting a density multiplier. Defaults to 0\n       */\n      columnGap?: GridLayoutProps<T>[\"columnGap\"];\n      /**\n       * Defines the size of the gutter between the rows by setting a density multiplier. Defaults to 0\n       */\n      rowGap?: GridLayoutProps<T>[\"rowGap\"];\n      /**\n       * Border item components to be rendered.\n       */\n      children: ReactNode;\n      /**\n       * Defines the margin around the component. It can be specified as a number (which acts as a multiplier) or a string representing the margin value. Default is `0`.\n       */\n      margin?: ResponsiveProp<number | string>;\n      /**\n       * Defines the padding within the component. It can be specified as a number (which acts as a multiplier) or a string representing the padding value. Default is `0`.\n       */\n      padding?: ResponsiveProp<number | string>;\n    }\n  >;\n\nconst withBaseName = makePrefixer(\"saltBorderLayout\");\n\nconst numberOfColumns = 3;\n\ntype BorderLayoutComponent = <T extends ElementType = \"div\">(\n  props: BorderLayoutProps<T>,\n) => ReturnType<FunctionComponent>;\n\nexport const BorderLayout: BorderLayoutComponent = forwardRef(\n  function BorderLayout<T extends ElementType>(\n    props: unknown,\n    ref?: ForwardedRef<unknown>,\n  ) {\n    // Props need to be typed this way due to polymorphic types not working with required props.\n    const { as, children, className, gap, style, ...rest } =\n      props as BorderLayoutProps<T>;\n\n    const borderAreas = Children.map(\n      children,\n      (child) => isValidElement(child) && child.props.position,\n    ) as BorderPosition[];\n\n    const topSection = borderAreas.includes(\"north\")\n      ? \"north \".repeat(numberOfColumns)\n      : \"none \".repeat(numberOfColumns);\n\n    const leftSection = borderAreas.includes(\"west\") ? \"west\" : \"center\";\n\n    const rightSection = borderAreas.includes(\"east\") ? \"east\" : \"center\";\n\n    const midSection = `${leftSection} center ${rightSection}`;\n\n    const bottomSection = borderAreas.includes(\"south\")\n      ? \"south \".repeat(numberOfColumns)\n      : \"none \".repeat(numberOfColumns);\n\n    const gridTemplateAreas = `\"${topSection}\" \"${midSection}\" \"${bottomSection}\"`;\n\n    const hasMainSection = borderAreas.includes(\"center\");\n\n    useEffect(() => {\n      if (process.env.NODE_ENV !== \"production\") {\n        if (!hasMainSection) {\n          console.warn(\n            \"No main section has been found. A main section should be provided.\",\n          );\n        }\n      }\n    }, [hasMainSection]);\n\n    const borderLayoutStyles = {\n      ...style,\n      \"--gridLayout-gridTemplate\": gridTemplateAreas,\n    };\n\n    return (\n      <GridLayout\n        as={as as ElementType}\n        className={clsx(withBaseName(), className, \"saltGridLayout-area\")}\n        columns={numberOfColumns}\n        gap={gap || 0}\n        style={borderLayoutStyles}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </GridLayout>\n    );\n  },\n);\n"],"names":["BorderLayout"],"mappings":";;;;;;;;;;AAmDA,MAAM,YAAA,GAAe,aAAa,kBAAkB,CAAA;AAEpD,MAAM,eAAkB,GAAA,CAAA;AAMjB,MAAM,YAAsC,GAAA,UAAA;AAAA,EACjD,SAASA,aACP,CAAA,KAAA,EACA,GACA,EAAA;AAEA,IAAM,MAAA,EAAE,IAAI,QAAU,EAAA,SAAA,EAAW,KAAK,KAAO,EAAA,GAAG,MAC9C,GAAA,KAAA;AAEF,IAAA,MAAM,cAAc,QAAS,CAAA,GAAA;AAAA,MAC3B,QAAA;AAAA,MACA,CAAC,KAAU,KAAA,cAAA,CAAe,KAAK,CAAA,IAAK,MAAM,KAAM,CAAA;AAAA,KAClD;AAEA,IAAM,MAAA,UAAA,GAAa,WAAY,CAAA,QAAA,CAAS,OAAO,CAAA,GAC3C,QAAS,CAAA,MAAA,CAAO,eAAe,CAAA,GAC/B,OAAQ,CAAA,MAAA,CAAO,eAAe,CAAA;AAElC,IAAA,MAAM,WAAc,GAAA,WAAA,CAAY,QAAS,CAAA,MAAM,IAAI,MAAS,GAAA,QAAA;AAE5D,IAAA,MAAM,YAAe,GAAA,WAAA,CAAY,QAAS,CAAA,MAAM,IAAI,MAAS,GAAA,QAAA;AAE7D,IAAA,MAAM,UAAa,GAAA,CAAA,EAAG,WAAW,CAAA,QAAA,EAAW,YAAY,CAAA,CAAA;AAExD,IAAM,MAAA,aAAA,GAAgB,WAAY,CAAA,QAAA,CAAS,OAAO,CAAA,GAC9C,QAAS,CAAA,MAAA,CAAO,eAAe,CAAA,GAC/B,OAAQ,CAAA,MAAA,CAAO,eAAe,CAAA;AAElC,IAAA,MAAM,oBAAoB,CAAI,CAAA,EAAA,UAAU,CAAM,GAAA,EAAA,UAAU,MAAM,aAAa,CAAA,CAAA,CAAA;AAE3E,IAAM,MAAA,cAAA,GAAiB,WAAY,CAAA,QAAA,CAAS,QAAQ,CAAA;AAEpD,IAAA,SAAA,CAAU,MAAM;AACd,MAAI,IAAA,OAAA,CAAQ,GAAI,CAAA,QAAA,KAAa,YAAc,EAAA;AACzC,QAAA,IAAI,CAAC,cAAgB,EAAA;AACnB,UAAQ,OAAA,CAAA,IAAA;AAAA,YACN;AAAA,WACF;AAAA;AACF;AACF,KACF,EAAG,CAAC,cAAc,CAAC,CAAA;AAEnB,IAAA,MAAM,kBAAqB,GAAA;AAAA,MACzB,GAAG,KAAA;AAAA,MACH,2BAA6B,EAAA;AAAA,KAC/B;AAEA,IACE,uBAAA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,EAAA;AAAA,QACA,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,WAAW,qBAAqB,CAAA;AAAA,QAChE,OAAS,EAAA,eAAA;AAAA,QACT,KAAK,GAAO,IAAA,CAAA;AAAA,QACZ,KAAO,EAAA,kBAAA;AAAA,QACP,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA;AAGN;;;;"}
+{"version":3,"file":"BorderLayout.js","sources":["../src/border-layout/BorderLayout.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  Children,\n  type ElementType,\n  type ForwardedRef,\n  type FunctionComponent,\n  forwardRef,\n  isValidElement,\n  type ReactNode,\n  useEffect,\n} from \"react\";\n\nimport type { BorderPosition } from \"../border-item\";\nimport { GridLayout, type GridLayoutProps } from \"../grid-layout\";\nimport {\n  makePrefixer,\n  type PolymorphicComponentPropWithRef,\n  type ResponsiveProp,\n} from \"../utils\";\n\nexport type BorderLayoutProps<T extends ElementType> =\n  PolymorphicComponentPropWithRef<\n    T,\n    {\n      /**\n       * Defines the size of the gutter between the columns and the rows by setting a density multiplier. Defaults to 0\n       */\n      gap?: GridLayoutProps<T>[\"gap\"];\n      /**\n       * Defines the size of the gutter between the columns by setting a density multiplier. Defaults to 0\n       */\n      columnGap?: GridLayoutProps<T>[\"columnGap\"];\n      /**\n       * Defines the size of the gutter between the rows by setting a density multiplier. Defaults to 0\n       */\n      rowGap?: GridLayoutProps<T>[\"rowGap\"];\n      /**\n       * Border item components to be rendered.\n       */\n      children: ReactNode;\n      /**\n       * Defines the margin around the component. It can be specified as a number (which acts as a multiplier) or a string representing the margin value. Default is `0`.\n       */\n      margin?: ResponsiveProp<number | string>;\n      /**\n       * Defines the padding within the component. It can be specified as a number (which acts as a multiplier) or a string representing the padding value. Default is `0`.\n       */\n      padding?: ResponsiveProp<number | string>;\n    }\n  >;\n\nconst withBaseName = makePrefixer(\"saltBorderLayout\");\n\nconst numberOfColumns = 3;\n\ntype BorderLayoutComponent = <T extends ElementType = \"div\">(\n  props: BorderLayoutProps<T>,\n) => ReturnType<FunctionComponent>;\n\nexport const BorderLayout: BorderLayoutComponent = forwardRef(\n  function BorderLayout<T extends ElementType>(\n    props: unknown,\n    ref?: ForwardedRef<unknown>,\n  ) {\n    // Props need to be typed this way due to polymorphic types not working with required props.\n    const { as, children, className, gap, style, ...rest } =\n      props as BorderLayoutProps<T>;\n\n    const borderAreas = Children.map(\n      children,\n      (child) => isValidElement(child) && child.props.position,\n    ) as BorderPosition[];\n\n    const topSection = borderAreas.includes(\"north\")\n      ? \"north \".repeat(numberOfColumns)\n      : \"none \".repeat(numberOfColumns);\n\n    const leftSection = borderAreas.includes(\"west\") ? \"west\" : \"center\";\n\n    const rightSection = borderAreas.includes(\"east\") ? \"east\" : \"center\";\n\n    const midSection = `${leftSection} center ${rightSection}`;\n\n    const bottomSection = borderAreas.includes(\"south\")\n      ? \"south \".repeat(numberOfColumns)\n      : \"none \".repeat(numberOfColumns);\n\n    const gridTemplateAreas = `\"${topSection}\" \"${midSection}\" \"${bottomSection}\"`;\n\n    const hasMainSection = borderAreas.includes(\"center\");\n\n    useEffect(() => {\n      if (process.env.NODE_ENV !== \"production\") {\n        if (!hasMainSection) {\n          console.warn(\n            \"No main section has been found. A main section should be provided.\",\n          );\n        }\n      }\n    }, [hasMainSection]);\n\n    const borderLayoutStyles = {\n      ...style,\n      \"--gridLayout-gridTemplate\": gridTemplateAreas,\n    };\n\n    return (\n      <GridLayout\n        as={as as ElementType}\n        className={clsx(withBaseName(), className, \"saltGridLayout-area\")}\n        columns={numberOfColumns}\n        gap={gap || 0}\n        style={borderLayoutStyles}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </GridLayout>\n    );\n  },\n);\n"],"names":["BorderLayout"],"mappings":";;;;;;;;;;AAmDA,MAAM,YAAA,GAAe,aAAa,kBAAkB,CAAA;AAEpD,MAAM,eAAA,GAAkB,CAAA;AAMjB,MAAM,YAAA,GAAsC,UAAA;AAAA,EACjD,SAASA,aAAAA,CACP,KAAA,EACA,GAAA,EACA;AAEA,IAAA,MAAM,EAAE,IAAI,QAAA,EAAU,SAAA,EAAW,KAAK,KAAA,EAAO,GAAG,MAAK,GACnD,KAAA;AAEF,IAAA,MAAM,cAAc,QAAA,CAAS,GAAA;AAAA,MAC3B,QAAA;AAAA,MACA,CAAC,KAAA,KAAU,cAAA,CAAe,KAAK,CAAA,IAAK,MAAM,KAAA,CAAM;AAAA,KAClD;AAEA,IAAA,MAAM,UAAA,GAAa,WAAA,CAAY,QAAA,CAAS,OAAO,CAAA,GAC3C,QAAA,CAAS,MAAA,CAAO,eAAe,CAAA,GAC/B,OAAA,CAAQ,MAAA,CAAO,eAAe,CAAA;AAElC,IAAA,MAAM,WAAA,GAAc,WAAA,CAAY,QAAA,CAAS,MAAM,IAAI,MAAA,GAAS,QAAA;AAE5D,IAAA,MAAM,YAAA,GAAe,WAAA,CAAY,QAAA,CAAS,MAAM,IAAI,MAAA,GAAS,QAAA;AAE7D,IAAA,MAAM,UAAA,GAAa,CAAA,EAAG,WAAW,CAAA,QAAA,EAAW,YAAY,CAAA,CAAA;AAExD,IAAA,MAAM,aAAA,GAAgB,WAAA,CAAY,QAAA,CAAS,OAAO,CAAA,GAC9C,QAAA,CAAS,MAAA,CAAO,eAAe,CAAA,GAC/B,OAAA,CAAQ,MAAA,CAAO,eAAe,CAAA;AAElC,IAAA,MAAM,oBAAoB,CAAA,CAAA,EAAI,UAAU,CAAA,GAAA,EAAM,UAAU,MAAM,aAAa,CAAA,CAAA,CAAA;AAE3E,IAAA,MAAM,cAAA,GAAiB,WAAA,CAAY,QAAA,CAAS,QAAQ,CAAA;AAEpD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,OAAA,CAAQ,GAAA,CAAI,QAAA,KAAa,YAAA,EAAc;AACzC,QAAA,IAAI,CAAC,cAAA,EAAgB;AACnB,UAAA,OAAA,CAAQ,IAAA;AAAA,YACN;AAAA,WACF;AAAA,QACF;AAAA,MACF;AAAA,IACF,CAAA,EAAG,CAAC,cAAc,CAAC,CAAA;AAEnB,IAAA,MAAM,kBAAA,GAAqB;AAAA,MACzB,GAAG,KAAA;AAAA,MACH,2BAAA,EAA6B;AAAA,KAC/B;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,EAAA;AAAA,QACA,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,WAAW,qBAAqB,CAAA;AAAA,QAChE,OAAA,EAAS,eAAA;AAAA,QACT,KAAK,GAAA,IAAO,CAAA;AAAA,QACZ,KAAA,EAAO,kBAAA;AAAA,QACP,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;;;;"}

package/dist-es/breakpoints/BreakpointProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"BreakpointProvider.js","sources":["../src/breakpoints/BreakpointProvider.tsx"],"sourcesContent":["import { type ReactNode, useContext, useMemo, useState } from \"react\";\nimport { createContext } from \"../utils/createContext\";\nimport { useIsomorphicLayoutEffect } from \"../utils/useIsomorphicLayoutEffect\";\nimport type { Breakpoints } from \"./Breakpoints\";\n\ntype Breakpoint = keyof Breakpoints;\n\ninterface BreakpointContext {\n  matchedBreakpoints: Breakpoint[];\n}\n\nconst Context = createContext<BreakpointContext>(\"BreakpointContext\", {\n  matchedBreakpoints: [],\n});\n\ninterface BreakpointProviderProps {\n  children?: ReactNode;\n  matchedBreakpoints: Breakpoint[];\n}\n\nexport function BreakpointProvider(props: BreakpointProviderProps) {\n  const { children, matchedBreakpoints } = props;\n\n  return (\n    <Context.Provider value={{ matchedBreakpoints }}>\n      {children}\n    </Context.Provider>\n  );\n}\n\nexport function useMatchedBreakpoints(breakpoints: Breakpoints): Breakpoint[] {\n  const entries = useMemo(\n    () => Object.entries(breakpoints).sort(([, a], [, b]) => b - a),\n    [breakpoints],\n  );\n\n  const supportsMatchMedia =\n    typeof window !== \"undefined\" && typeof window.matchMedia === \"function\";\n\n  const [matchedBreakpoints, setMatchedBreakpoints] = useState<\n    Partial<Record<Breakpoint, boolean>>\n  >(Object.fromEntries(entries.map(([bp]) => [bp as Breakpoint, false])));\n\n  useIsomorphicLayoutEffect(() => {\n    if (!supportsMatchMedia) {\n      return;\n    }\n\n    const queries = entries.map(([, value]) => `(min-width: ${value}px)`);\n\n    const matchers = queries.map((query, index) => {\n      const mq = window.matchMedia(query);\n      const bp = entries[index][0] as Breakpoint;\n\n      return {\n        mq,\n        handler: () => {\n          setMatchedBreakpoints((prev) => {\n            return {\n              ...prev,\n              [bp]: mq.matches,\n            };\n          });\n        },\n      };\n    });\n\n    for (const { mq, handler } of matchers) {\n      handler();\n      mq.addEventListener(\"change\", handler);\n    }\n\n    return () => {\n      for (const { mq, handler } of matchers) {\n        mq.removeEventListener(\"change\", handler);\n      }\n    };\n  }, [supportsMatchMedia, entries]);\n\n  return Object.keys(matchedBreakpoints).filter(\n    (bp) => matchedBreakpoints[bp as Breakpoint],\n  ) as Breakpoint[];\n}\n\nexport function useBreakpoint(): BreakpointContext & {\n  breakpoint: Breakpoint | null;\n} {\n  const { matchedBreakpoints } = useContext(Context);\n\n  return {\n    matchedBreakpoints,\n    breakpoint: matchedBreakpoints[0] ?? null,\n  };\n}\n"],"names":[],"mappings":";;;;;AAWA,MAAM,OAAA,GAAU,cAAiC,mBAAqB,EAAA;AAAA,EACpE,oBAAoB;AACtB,CAAC,CAAA;AAOM,SAAS,mBAAmB,KAAgC,EAAA;AACjE,EAAM,MAAA,EAAE,QAAU,EAAA,kBAAA,EAAuB,GAAA,KAAA;AAEzC,EACE,uBAAA,GAAA,CAAC,QAAQ,QAAR,EAAA,EAAiB,OAAO,EAAE,kBAAA,IACxB,QACH,EAAA,CAAA;AAEJ;AAEO,SAAS,sBAAsB,WAAwC,EAAA;AAC5E,EAAA,MAAM,OAAU,GAAA,OAAA;AAAA,IACd,MAAM,MAAO,CAAA,OAAA,CAAQ,WAAW,CAAA,CAAE,KAAK,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,CAAA,KAAM,IAAI,CAAC,CAAA;AAAA,IAC9D,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,MAAM,qBACJ,OAAO,MAAA,KAAW,WAAe,IAAA,OAAO,OAAO,UAAe,KAAA,UAAA;AAEhE,EAAA,MAAM,CAAC,kBAAoB,EAAA,qBAAqB,IAAI,QAElD,CAAA,MAAA,CAAO,YAAY,OAAQ,CAAA,GAAA,CAAI,CAAC,CAAC,EAAE,CAAM,KAAA,CAAC,IAAkB,KAAK,CAAC,CAAC,CAAC,CAAA;AAEtE,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,CAAC,kBAAoB,EAAA;AACvB,MAAA;AAAA;AAGF,IAAM,MAAA,OAAA,GAAU,OAAQ,CAAA,GAAA,CAAI,CAAC,GAAG,KAAK,CAAA,KAAM,CAAe,YAAA,EAAA,KAAK,CAAK,GAAA,CAAA,CAAA;AAEpE,IAAA,MAAM,QAAW,GAAA,OAAA,CAAQ,GAAI,CAAA,CAAC,OAAO,KAAU,KAAA;AAC7C,MAAM,MAAA,EAAA,GAAK,MAAO,CAAA,UAAA,CAAW,KAAK,CAAA;AAClC,MAAA,MAAM,EAAK,GAAA,OAAA,CAAQ,KAAK,CAAA,CAAE,CAAC,CAAA;AAE3B,MAAO,OAAA;AAAA,QACL,EAAA;AAAA,QACA,SAAS,MAAM;AACb,UAAA,qBAAA,CAAsB,CAAC,IAAS,KAAA;AAC9B,YAAO,OAAA;AAAA,cACL,GAAG,IAAA;AAAA,cACH,CAAC,EAAE,GAAG,EAAG,CAAA;AAAA,aACX;AAAA,WACD,CAAA;AAAA;AACH,OACF;AAAA,KACD,CAAA;AAED,IAAA,KAAA,MAAW,EAAE,EAAA,EAAI,OAAQ,EAAA,IAAK,QAAU,EAAA;AACtC,MAAQ,OAAA,EAAA;AACR,MAAG,EAAA,CAAA,gBAAA,CAAiB,UAAU,OAAO,CAAA;AAAA;AAGvC,IAAA,OAAO,MAAM;AACX,MAAA,KAAA,MAAW,EAAE,EAAA,EAAI,OAAQ,EAAA,IAAK,QAAU,EAAA;AACtC,QAAG,EAAA,CAAA,mBAAA,CAAoB,UAAU,OAAO,CAAA;AAAA;AAC1C,KACF;AAAA,GACC,EAAA,CAAC,kBAAoB,EAAA,OAAO,CAAC,CAAA;AAEhC,EAAO,OAAA,MAAA,CAAO,IAAK,CAAA,kBAAkB,CAAE,CAAA,MAAA;AAAA,IACrC,CAAC,EAAO,KAAA,kBAAA,CAAmB,EAAgB;AAAA,GAC7C;AACF;AAEO,SAAS,aAEd,GAAA;AACA,EAAA,MAAM,EAAE,kBAAA,EAAuB,GAAA,UAAA,CAAW,OAAO,CAAA;AAEjD,EAAO,OAAA;AAAA,IACL,kBAAA;AAAA,IACA,UAAA,EAAY,kBAAmB,CAAA,CAAC,CAAK,IAAA;AAAA,GACvC;AACF;;;;"}
+{"version":3,"file":"BreakpointProvider.js","sources":["../src/breakpoints/BreakpointProvider.tsx"],"sourcesContent":["import { type ReactNode, useContext, useMemo, useState } from \"react\";\nimport { createContext } from \"../utils/createContext\";\nimport { useIsomorphicLayoutEffect } from \"../utils/useIsomorphicLayoutEffect\";\nimport type { Breakpoints } from \"./Breakpoints\";\n\ntype Breakpoint = keyof Breakpoints;\n\ninterface BreakpointContext {\n  matchedBreakpoints: Breakpoint[];\n}\n\nconst Context = createContext<BreakpointContext>(\"BreakpointContext\", {\n  matchedBreakpoints: [],\n});\n\ninterface BreakpointProviderProps {\n  children?: ReactNode;\n  matchedBreakpoints: Breakpoint[];\n}\n\nexport function BreakpointProvider(props: BreakpointProviderProps) {\n  const { children, matchedBreakpoints } = props;\n\n  return (\n    <Context.Provider value={{ matchedBreakpoints }}>\n      {children}\n    </Context.Provider>\n  );\n}\n\nexport function useMatchedBreakpoints(breakpoints: Breakpoints): Breakpoint[] {\n  const entries = useMemo(\n    () => Object.entries(breakpoints).sort(([, a], [, b]) => b - a),\n    [breakpoints],\n  );\n\n  const supportsMatchMedia =\n    typeof window !== \"undefined\" && typeof window.matchMedia === \"function\";\n\n  const [matchedBreakpoints, setMatchedBreakpoints] = useState<\n    Partial<Record<Breakpoint, boolean>>\n  >(Object.fromEntries(entries.map(([bp]) => [bp as Breakpoint, false])));\n\n  useIsomorphicLayoutEffect(() => {\n    if (!supportsMatchMedia) {\n      return;\n    }\n\n    const queries = entries.map(([, value]) => `(min-width: ${value}px)`);\n\n    const matchers = queries.map((query, index) => {\n      const mq = window.matchMedia(query);\n      const bp = entries[index][0] as Breakpoint;\n\n      return {\n        mq,\n        handler: () => {\n          setMatchedBreakpoints((prev) => {\n            return {\n              ...prev,\n              [bp]: mq.matches,\n            };\n          });\n        },\n      };\n    });\n\n    for (const { mq, handler } of matchers) {\n      handler();\n      mq.addEventListener(\"change\", handler);\n    }\n\n    return () => {\n      for (const { mq, handler } of matchers) {\n        mq.removeEventListener(\"change\", handler);\n      }\n    };\n  }, [supportsMatchMedia, entries]);\n\n  return Object.keys(matchedBreakpoints).filter(\n    (bp) => matchedBreakpoints[bp as Breakpoint],\n  ) as Breakpoint[];\n}\n\nexport function useBreakpoint(): BreakpointContext & {\n  breakpoint: Breakpoint | null;\n} {\n  const { matchedBreakpoints } = useContext(Context);\n\n  return {\n    matchedBreakpoints,\n    breakpoint: matchedBreakpoints[0] ?? null,\n  };\n}\n"],"names":[],"mappings":";;;;;AAWA,MAAM,OAAA,GAAU,cAAiC,mBAAA,EAAqB;AAAA,EACpE,oBAAoB;AACtB,CAAC,CAAA;AAOM,SAAS,mBAAmB,KAAA,EAAgC;AACjE,EAAA,MAAM,EAAE,QAAA,EAAU,kBAAA,EAAmB,GAAI,KAAA;AAEzC,EAAA,uBACE,GAAA,CAAC,QAAQ,QAAA,EAAR,EAAiB,OAAO,EAAE,kBAAA,IACxB,QAAA,EACH,CAAA;AAEJ;AAEO,SAAS,sBAAsB,WAAA,EAAwC;AAC5E,EAAA,MAAM,OAAA,GAAU,OAAA;AAAA,IACd,MAAM,MAAA,CAAO,OAAA,CAAQ,WAAW,CAAA,CAAE,KAAK,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,CAAA,KAAM,IAAI,CAAC,CAAA;AAAA,IAC9D,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,MAAM,qBACJ,OAAO,MAAA,KAAW,WAAA,IAAe,OAAO,OAAO,UAAA,KAAe,UAAA;AAEhE,EAAA,MAAM,CAAC,kBAAA,EAAoB,qBAAqB,IAAI,QAAA,CAElD,MAAA,CAAO,YAAY,OAAA,CAAQ,GAAA,CAAI,CAAC,CAAC,EAAE,CAAA,KAAM,CAAC,IAAkB,KAAK,CAAC,CAAC,CAAC,CAAA;AAEtE,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,CAAC,kBAAA,EAAoB;AACvB,MAAA;AAAA,IACF;AAEA,IAAA,MAAM,OAAA,GAAU,OAAA,CAAQ,GAAA,CAAI,CAAC,GAAG,KAAK,CAAA,KAAM,CAAA,YAAA,EAAe,KAAK,CAAA,GAAA,CAAK,CAAA;AAEpE,IAAA,MAAM,QAAA,GAAW,OAAA,CAAQ,GAAA,CAAI,CAAC,OAAO,KAAA,KAAU;AAC7C,MAAA,MAAM,EAAA,GAAK,MAAA,CAAO,UAAA,CAAW,KAAK,CAAA;AAClC,MAAA,MAAM,EAAA,GAAK,OAAA,CAAQ,KAAK,CAAA,CAAE,CAAC,CAAA;AAE3B,MAAA,OAAO;AAAA,QACL,EAAA;AAAA,QACA,SAAS,MAAM;AACb,UAAA,qBAAA,CAAsB,CAAC,IAAA,KAAS;AAC9B,YAAA,OAAO;AAAA,cACL,GAAG,IAAA;AAAA,cACH,CAAC,EAAE,GAAG,EAAA,CAAG;AAAA,aACX;AAAA,UACF,CAAC,CAAA;AAAA,QACH;AAAA,OACF;AAAA,IACF,CAAC,CAAA;AAED,IAAA,KAAA,MAAW,EAAE,EAAA,EAAI,OAAA,EAAQ,IAAK,QAAA,EAAU;AACtC,MAAA,OAAA,EAAQ;AACR,MAAA,EAAA,CAAG,gBAAA,CAAiB,UAAU,OAAO,CAAA;AAAA,IACvC;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,KAAA,MAAW,EAAE,EAAA,EAAI,OAAA,EAAQ,IAAK,QAAA,EAAU;AACtC,QAAA,EAAA,CAAG,mBAAA,CAAoB,UAAU,OAAO,CAAA;AAAA,MAC1C;AAAA,IACF,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,kBAAA,EAAoB,OAAO,CAAC,CAAA;AAEhC,EAAA,OAAO,MAAA,CAAO,IAAA,CAAK,kBAAkB,CAAA,CAAE,MAAA;AAAA,IACrC,CAAC,EAAA,KAAO,kBAAA,CAAmB,EAAgB;AAAA,GAC7C;AACF;AAEO,SAAS,aAAA,GAEd;AACA,EAAA,MAAM,EAAE,kBAAA,EAAmB,GAAI,UAAA,CAAW,OAAO,CAAA;AAEjD,EAAA,OAAO;AAAA,IACL,kBAAA;AAAA,IACA,UAAA,EAAY,kBAAA,CAAmB,CAAC,CAAA,IAAK;AAAA,GACvC;AACF;;;;"}

package/dist-es/breakpoints/Breakpoints.js.map

@@ -1 +1 @@
-{"version":3,"file":"Breakpoints.js","sources":["../src/breakpoints/Breakpoints.tsx"],"sourcesContent":["export interface Breakpoints {\n  xs: number;\n  sm: number;\n  md: number;\n  lg: number;\n  xl: number;\n}\n\nexport const DEFAULT_BREAKPOINTS: Breakpoints = {\n  xs: 0,\n  sm: 600,\n  md: 960,\n  lg: 1280,\n  xl: 1920,\n};\n"],"names":[],"mappings":"AAQO,MAAM,mBAAmC,GAAA;AAAA,EAC9C,EAAI,EAAA,CAAA;AAAA,EACJ,EAAI,EAAA,GAAA;AAAA,EACJ,EAAI,EAAA,GAAA;AAAA,EACJ,EAAI,EAAA,IAAA;AAAA,EACJ,EAAI,EAAA;AACN;;;;"}
+{"version":3,"file":"Breakpoints.js","sources":["../src/breakpoints/Breakpoints.tsx"],"sourcesContent":["export interface Breakpoints {\n  xs: number;\n  sm: number;\n  md: number;\n  lg: number;\n  xl: number;\n}\n\nexport const DEFAULT_BREAKPOINTS: Breakpoints = {\n  xs: 0,\n  sm: 600,\n  md: 960,\n  lg: 1280,\n  xl: 1920,\n};\n"],"names":[],"mappings":"AAQO,MAAM,mBAAA,GAAmC;AAAA,EAC9C,EAAA,EAAI,CAAA;AAAA,EACJ,EAAA,EAAI,GAAA;AAAA,EACJ,EAAA,EAAI,GAAA;AAAA,EACJ,EAAA,EAAI,IAAA;AAAA,EACJ,EAAA,EAAI;AACN;;;;"}

package/dist-es/button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../src/button/Button.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactElement,\n} from \"react\";\nimport { Spinner } from \"../spinner\";\nimport { makePrefixer } from \"../utils\";\n\nimport buttonCss from \"./Button.css\";\nimport { useButton } from \"./useButton\";\n\nconst withBaseName = makePrefixer(\"saltButton\");\n\nexport const ButtonVariantValues = [\"primary\", \"secondary\", \"cta\"] as const;\nexport const ButtonAppearanceValues = [\n  \"solid\",\n  \"bordered\",\n  \"transparent\",\n] as const;\nexport const ButtonSentimentValues = [\n  \"accented\",\n  \"neutral\",\n  \"positive\",\n  \"negative\",\n  \"caution\",\n] as const;\nexport type ButtonVariant = (typeof ButtonVariantValues)[number];\nexport type ButtonAppearance = (typeof ButtonAppearanceValues)[number];\nexport type ButtonSentiment = (typeof ButtonSentimentValues)[number];\n\nexport interface ButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n  /**\n   * If `true`, the button will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * If `true`, the button will be focusable when disabled.\n   */\n  focusableWhenDisabled?: boolean;\n  /**\n   * The variant to use. Options are 'primary', 'secondary' and 'cta'.\n   * 'primary' is the default value.\n   *\n   * @deprecated Use `appearance` and `sentiment` instead.\n   *\n   * | variant     | appearance    | sentiment   |\n   * | ----------- | ------------- | ----------- |\n   * | `cta`       | `solid`       | `accented`  |\n   * | `primary`   | `solid`       | `neutral`   |\n   * | `secondary` | `transparent` | `neutral`   |\n   */\n  variant?: ButtonVariant;\n  /**\n   * The appearance of the button. Options are 'solid', 'bordered', and 'transparent'.\n   * 'solid' is the default value.\n   *\n   * @since 1.36.0.\n   */\n  appearance?: ButtonAppearance;\n  /**\n   * The sentiment of the button. Options are 'accented', 'neutral', 'positive', 'negative' and 'caution'.\n   * 'neutral' is the default value.\n   *\n   * @since 1.36.0.\n   */\n  sentiment?: ButtonSentiment;\n\n  /**\n   * If `true`, the button will be in a loading state. This allows a spinner to be nested inside the button.\n   *\n   * @since 1.38.0.\n   */\n  loading?: boolean;\n\n  /**\n   * Text to be announced by screen readers, intended to be used in conjunction with the `loading` prop.\n   *\n   * @since 1.38.0.\n   */\n  loadingAnnouncement?: string;\n}\n\nfunction variantToAppearanceAndColor(\n  variant: ButtonVariant,\n): Pick<ButtonProps, \"appearance\" | \"sentiment\"> {\n  switch (variant) {\n    case \"primary\":\n      return { appearance: \"solid\", sentiment: \"neutral\" };\n    case \"secondary\":\n      return { appearance: \"transparent\", sentiment: \"neutral\" };\n    case \"cta\":\n      return { appearance: \"solid\", sentiment: \"accented\" };\n  }\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  function Button(\n    {\n      children,\n      className,\n      disabled,\n      focusableWhenDisabled,\n      onKeyUp,\n      onKeyDown,\n      onBlur,\n      onClick,\n      loading,\n      loadingAnnouncement,\n      appearance: appearanceProp,\n      sentiment: sentimentProp,\n      type: typeProp = \"button\",\n      variant = \"primary\",\n      ...restProps\n    },\n    ref?,\n  ): ReactElement<ButtonProps> {\n    const { active, buttonProps } = useButton({\n      loading,\n      disabled,\n      focusableWhenDisabled,\n      onKeyUp,\n      onKeyDown,\n      onBlur,\n      onClick,\n    });\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-button\",\n      css: buttonCss,\n      window: targetWindow,\n    });\n\n    const mapped = variantToAppearanceAndColor(variant);\n    const appearance: ButtonAppearance =\n      appearanceProp ?? mapped?.appearance ?? \"solid\";\n\n    const sentiment: ButtonSentiment =\n      sentimentProp ?? mapped?.sentiment ?? \"neutral\";\n\n    // we do not want to spread tab index in this case because the button element\n    // does not require tabindex=\"0\" attribute\n    const { tabIndex, ...restButtonProps } = buttonProps;\n\n    /* When the button is in a loading state, we want to prevent form submission. */\n    const type = typeProp === \"submit\" && loading ? \"button\" : typeProp;\n\n    return (\n      <button\n        {...restButtonProps}\n        className={clsx(\n          withBaseName(),\n          withBaseName(variant),\n          {\n            [withBaseName(\"loading\")]: loading,\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(\"active\")]: active,\n            [withBaseName(appearance)]: appearance,\n            [withBaseName(sentiment)]: sentiment,\n          },\n          className,\n        )}\n        {...restProps}\n        ref={ref}\n        type={type}\n      >\n        {loading && (\n          <div className={withBaseName(\"spinner\")} aria-hidden>\n            <Spinner size=\"small\" aria-hidden disableAnnouncer />\n          </div>\n        )}\n        {typeof loadingAnnouncement === \"string\" && (\n          <span role=\"status\" className={withBaseName(\"sr-only\")}>\n            {loadingAnnouncement}\n          </span>\n        )}\n        {children}\n      </button>\n    );\n  },\n);\n"],"names":["Button","buttonCss"],"mappings":";;;;;;;;;;;;;;AAcA,MAAM,YAAA,GAAe,aAAa,YAAY,CAAA;AAEvC,MAAM,mBAAsB,GAAA,CAAC,SAAW,EAAA,WAAA,EAAa,KAAK;AAC1D,MAAM,sBAAyB,GAAA;AAAA,EACpC,OAAA;AAAA,EACA,UAAA;AAAA,EACA;AACF;AACO,MAAM,qBAAwB,GAAA;AAAA,EACnC,UAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA,UAAA;AAAA,EACA;AACF;AAyDA,SAAS,4BACP,OAC+C,EAAA;AAC/C,EAAA,QAAQ,OAAS;AAAA,IACf,KAAK,SAAA;AACH,MAAA,OAAO,EAAE,UAAA,EAAY,OAAS,EAAA,SAAA,EAAW,SAAU,EAAA;AAAA,IACrD,KAAK,WAAA;AACH,MAAA,OAAO,EAAE,UAAA,EAAY,aAAe,EAAA,SAAA,EAAW,SAAU,EAAA;AAAA,IAC3D,KAAK,KAAA;AACH,MAAA,OAAO,EAAE,UAAA,EAAY,OAAS,EAAA,SAAA,EAAW,UAAW,EAAA;AAAA;AAE1D;AAEO,MAAM,MAAS,GAAA,UAAA;AAAA,EACpB,SAASA,OACP,CAAA;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,qBAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,mBAAA;AAAA,IACA,UAAY,EAAA,cAAA;AAAA,IACZ,SAAW,EAAA,aAAA;AAAA,IACX,MAAM,QAAW,GAAA,QAAA;AAAA,IACjB,OAAU,GAAA,SAAA;AAAA,IACV,GAAG;AAAA,KAEL,GAC2B,EAAA;AAC3B,IAAA,MAAM,EAAE,MAAA,EAAQ,WAAY,EAAA,GAAI,SAAU,CAAA;AAAA,MACxC,OAAA;AAAA,MACA,QAAA;AAAA,MACA,qBAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,aAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAM,MAAA,MAAA,GAAS,4BAA4B,OAAO,CAAA;AAClD,IAAM,MAAA,UAAA,GACJ,cAAkB,KAAA,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAQ,UAAc,CAAA,IAAA,OAAA;AAE1C,IAAM,MAAA,SAAA,GACJ,aAAiB,KAAA,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAQ,SAAa,CAAA,IAAA,SAAA;AAIxC,IAAA,MAAM,EAAE,QAAA,EAAU,GAAG,eAAA,EAAoB,GAAA,WAAA;AAGzC,IAAA,MAAM,IAAO,GAAA,QAAA,KAAa,QAAY,IAAA,OAAA,GAAU,QAAW,GAAA,QAAA;AAE3D,IACE,uBAAA,IAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACE,GAAG,eAAA;AAAA,QACJ,SAAW,EAAA,IAAA;AAAA,UACT,YAAa,EAAA;AAAA,UACb,aAAa,OAAO,CAAA;AAAA,UACpB;AAAA,YACE,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG,OAAA;AAAA,YAC3B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,QAAA;AAAA,YAC5B,CAAC,YAAA,CAAa,QAAQ,CAAC,GAAG,MAAA;AAAA,YAC1B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,UAAA;AAAA,YAC5B,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG;AAAA,WAC7B;AAAA,UACA;AAAA,SACF;AAAA,QACC,GAAG,SAAA;AAAA,QACJ,GAAA;AAAA,QACA,IAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,OAAA,wBACE,KAAI,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,SAAS,GAAG,aAAW,EAAA,IAAA,EAClD,QAAC,kBAAA,GAAA,CAAA,OAAA,EAAA,EAAQ,MAAK,OAAQ,EAAA,aAAA,EAAW,IAAC,EAAA,gBAAA,EAAgB,MAAC,CACrD,EAAA,CAAA;AAAA,UAED,OAAO,mBAAwB,KAAA,QAAA,oBAC7B,GAAA,CAAA,MAAA,EAAA,EAAK,IAAK,EAAA,QAAA,EAAS,SAAW,EAAA,YAAA,CAAa,SAAS,CAAA,EAClD,QACH,EAAA,mBAAA,EAAA,CAAA;AAAA,UAED;AAAA;AAAA;AAAA,KACH;AAAA;AAGN;;;;"}
+{"version":3,"file":"Button.js","sources":["../src/button/Button.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactElement,\n} from \"react\";\nimport { Spinner } from \"../spinner\";\nimport { makePrefixer } from \"../utils\";\n\nimport buttonCss from \"./Button.css\";\nimport { useButton } from \"./useButton\";\n\nconst withBaseName = makePrefixer(\"saltButton\");\n\nexport const ButtonVariantValues = [\"primary\", \"secondary\", \"cta\"] as const;\nexport const ButtonAppearanceValues = [\n  \"solid\",\n  \"bordered\",\n  \"transparent\",\n] as const;\nexport const ButtonSentimentValues = [\n  \"accented\",\n  \"neutral\",\n  \"positive\",\n  \"negative\",\n  \"caution\",\n] as const;\nexport type ButtonVariant = (typeof ButtonVariantValues)[number];\nexport type ButtonAppearance = (typeof ButtonAppearanceValues)[number];\nexport type ButtonSentiment = (typeof ButtonSentimentValues)[number];\n\nexport interface ButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n  /**\n   * If `true`, the button will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * If `true`, the button will be focusable when disabled.\n   */\n  focusableWhenDisabled?: boolean;\n  /**\n   * The variant to use. Options are 'primary', 'secondary' and 'cta'.\n   * 'primary' is the default value.\n   *\n   * @deprecated Use `appearance` and `sentiment` instead.\n   *\n   * | variant     | appearance    | sentiment   |\n   * | ----------- | ------------- | ----------- |\n   * | `cta`       | `solid`       | `accented`  |\n   * | `primary`   | `solid`       | `neutral`   |\n   * | `secondary` | `transparent` | `neutral`   |\n   */\n  variant?: ButtonVariant;\n  /**\n   * The appearance of the button. Options are 'solid', 'bordered', and 'transparent'.\n   * 'solid' is the default value.\n   *\n   * @since 1.36.0.\n   */\n  appearance?: ButtonAppearance;\n  /**\n   * The sentiment of the button. Options are 'accented', 'neutral', 'positive', 'negative' and 'caution'.\n   * 'neutral' is the default value.\n   *\n   * @since 1.36.0.\n   */\n  sentiment?: ButtonSentiment;\n\n  /**\n   * If `true`, the button will be in a loading state. This allows a spinner to be nested inside the button.\n   *\n   * @since 1.38.0.\n   */\n  loading?: boolean;\n\n  /**\n   * Text to be announced by screen readers, intended to be used in conjunction with the `loading` prop.\n   *\n   * @since 1.38.0.\n   */\n  loadingAnnouncement?: string;\n}\n\nfunction variantToAppearanceAndColor(\n  variant: ButtonVariant,\n): Pick<ButtonProps, \"appearance\" | \"sentiment\"> {\n  switch (variant) {\n    case \"primary\":\n      return { appearance: \"solid\", sentiment: \"neutral\" };\n    case \"secondary\":\n      return { appearance: \"transparent\", sentiment: \"neutral\" };\n    case \"cta\":\n      return { appearance: \"solid\", sentiment: \"accented\" };\n  }\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  function Button(\n    {\n      children,\n      className,\n      disabled,\n      focusableWhenDisabled,\n      onKeyUp,\n      onKeyDown,\n      onBlur,\n      onClick,\n      loading,\n      loadingAnnouncement,\n      appearance: appearanceProp,\n      sentiment: sentimentProp,\n      type: typeProp = \"button\",\n      variant = \"primary\",\n      ...restProps\n    },\n    ref?,\n  ): ReactElement<ButtonProps> {\n    const { active, buttonProps } = useButton({\n      loading,\n      disabled,\n      focusableWhenDisabled,\n      onKeyUp,\n      onKeyDown,\n      onBlur,\n      onClick,\n    });\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-button\",\n      css: buttonCss,\n      window: targetWindow,\n    });\n\n    const mapped = variantToAppearanceAndColor(variant);\n    const appearance: ButtonAppearance =\n      appearanceProp ?? mapped?.appearance ?? \"solid\";\n\n    const sentiment: ButtonSentiment =\n      sentimentProp ?? mapped?.sentiment ?? \"neutral\";\n\n    // we do not want to spread tab index in this case because the button element\n    // does not require tabindex=\"0\" attribute\n    const { tabIndex, ...restButtonProps } = buttonProps;\n\n    /* When the button is in a loading state, we want to prevent form submission. */\n    const type = typeProp === \"submit\" && loading ? \"button\" : typeProp;\n\n    return (\n      <button\n        {...restButtonProps}\n        className={clsx(\n          withBaseName(),\n          withBaseName(variant),\n          {\n            [withBaseName(\"loading\")]: loading,\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(\"active\")]: active,\n            [withBaseName(appearance)]: appearance,\n            [withBaseName(sentiment)]: sentiment,\n          },\n          className,\n        )}\n        {...restProps}\n        ref={ref}\n        type={type}\n      >\n        {loading && (\n          <div className={withBaseName(\"spinner\")} aria-hidden>\n            <Spinner size=\"small\" aria-hidden disableAnnouncer />\n          </div>\n        )}\n        {typeof loadingAnnouncement === \"string\" && (\n          <span role=\"status\" className={withBaseName(\"sr-only\")}>\n            {loadingAnnouncement}\n          </span>\n        )}\n        {children}\n      </button>\n    );\n  },\n);\n"],"names":["Button","buttonCss"],"mappings":";;;;;;;;;;;;;;AAcA,MAAM,YAAA,GAAe,aAAa,YAAY,CAAA;AAEvC,MAAM,mBAAA,GAAsB,CAAC,SAAA,EAAW,WAAA,EAAa,KAAK;AAC1D,MAAM,sBAAA,GAAyB;AAAA,EACpC,OAAA;AAAA,EACA,UAAA;AAAA,EACA;AACF;AACO,MAAM,qBAAA,GAAwB;AAAA,EACnC,UAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA,UAAA;AAAA,EACA;AACF;AAyDA,SAAS,4BACP,OAAA,EAC+C;AAC/C,EAAA,QAAQ,OAAA;AAAS,IACf,KAAK,SAAA;AACH,MAAA,OAAO,EAAE,UAAA,EAAY,OAAA,EAAS,SAAA,EAAW,SAAA,EAAU;AAAA,IACrD,KAAK,WAAA;AACH,MAAA,OAAO,EAAE,UAAA,EAAY,aAAA,EAAe,SAAA,EAAW,SAAA,EAAU;AAAA,IAC3D,KAAK,KAAA;AACH,MAAA,OAAO,EAAE,UAAA,EAAY,OAAA,EAAS,SAAA,EAAW,UAAA,EAAW;AAAA;AAE1D;AAEO,MAAM,MAAA,GAAS,UAAA;AAAA,EACpB,SAASA,OAAAA,CACP;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,qBAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,mBAAA;AAAA,IACA,UAAA,EAAY,cAAA;AAAA,IACZ,SAAA,EAAW,aAAA;AAAA,IACX,MAAM,QAAA,GAAW,QAAA;AAAA,IACjB,OAAA,GAAU,SAAA;AAAA,IACV,GAAG;AAAA,KAEL,GAAA,EAC2B;AAC3B,IAAA,MAAM,EAAE,MAAA,EAAQ,WAAA,EAAY,GAAI,SAAA,CAAU;AAAA,MACxC,OAAA;AAAA,MACA,QAAA;AAAA,MACA,qBAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,aAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,MAAA,GAAS,4BAA4B,OAAO,CAAA;AAClD,IAAA,MAAM,UAAA,GACJ,cAAA,KAAkB,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAQ,UAAA,CAAA,IAAc,OAAA;AAE1C,IAAA,MAAM,SAAA,GACJ,aAAA,KAAiB,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAQ,SAAA,CAAA,IAAa,SAAA;AAIxC,IAAA,MAAM,EAAE,QAAA,EAAU,GAAG,eAAA,EAAgB,GAAI,WAAA;AAGzC,IAAA,MAAM,IAAA,GAAO,QAAA,KAAa,QAAA,IAAY,OAAA,GAAU,QAAA,GAAW,QAAA;AAE3D,IAAA,uBACE,IAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACE,GAAG,eAAA;AAAA,QACJ,SAAA,EAAW,IAAA;AAAA,UACT,YAAA,EAAa;AAAA,UACb,aAAa,OAAO,CAAA;AAAA,UACpB;AAAA,YACE,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG,OAAA;AAAA,YAC3B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,QAAA;AAAA,YAC5B,CAAC,YAAA,CAAa,QAAQ,CAAC,GAAG,MAAA;AAAA,YAC1B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,UAAA;AAAA,YAC5B,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG;AAAA,WAC7B;AAAA,UACA;AAAA,SACF;AAAA,QACC,GAAG,SAAA;AAAA,QACJ,GAAA;AAAA,QACA,IAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,OAAA,wBACE,KAAA,EAAA,EAAI,SAAA,EAAW,YAAA,CAAa,SAAS,GAAG,aAAA,EAAW,IAAA,EAClD,QAAA,kBAAA,GAAA,CAAC,OAAA,EAAA,EAAQ,MAAK,OAAA,EAAQ,aAAA,EAAW,IAAA,EAAC,gBAAA,EAAgB,MAAC,CAAA,EACrD,CAAA;AAAA,UAED,OAAO,mBAAA,KAAwB,QAAA,oBAC9B,GAAA,CAAC,MAAA,EAAA,EAAK,IAAA,EAAK,QAAA,EAAS,SAAA,EAAW,YAAA,CAAa,SAAS,CAAA,EAClD,QAAA,EAAA,mBAAA,EACH,CAAA;AAAA,UAED;AAAA;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;;;;"}

package/dist-es/button/useButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"useButton.js","sources":["../src/button/useButton.ts"],"sourcesContent":["import {\n  type FocusEvent,\n  type KeyboardEvent,\n  type MouseEvent,\n  useEffect,\n  useState,\n} from \"react\";\n\nexport interface ButtonHookProps<T extends Element> {\n  loading?: boolean;\n  disabled?: boolean;\n  focusableWhenDisabled?: boolean;\n  onKeyUp?: (event: KeyboardEvent<T>) => void;\n  onKeyDown?: (event: KeyboardEvent<T>) => void;\n  onClick?: (event: MouseEvent<T>) => void;\n  onBlur?: (event: FocusEvent<T>) => void;\n}\n\nexport interface ButtonHookResult<T extends Element> {\n  active: boolean;\n  buttonProps: {\n    \"aria-disabled\"?: boolean;\n    \"data-loading\"?: boolean;\n    disabled?: boolean;\n    tabIndex: number;\n    onBlur: (event: FocusEvent<T>) => void;\n    onClick?: (event: MouseEvent<T>) => void;\n    onKeyDown: (event: KeyboardEvent<T>) => void;\n    onKeyUp: (event: KeyboardEvent<T>) => void;\n  };\n}\n\nexport const useButton = <T extends Element>({\n  loading,\n  disabled,\n  focusableWhenDisabled,\n  onKeyUp,\n  onKeyDown,\n  onClick,\n  onBlur,\n}: ButtonHookProps<T>): ButtonHookResult<T> => {\n  const [keyIsDown, setKeyIsDown] = useState(\"\");\n  const [active, setActive] = useState(false);\n\n  const enter = \"Enter\";\n  const space = \" \";\n\n  // biome-ignore lint/correctness/useExhaustiveDependencies: active is needed to remove the active styling on mouse up\n  useEffect(() => {\n    const t = setTimeout(() => {\n      // This key state check is to stop continual visual state change when using Enter Key, which the browser treats as both key and click events on a Button\n      // This key state check also fixes Firefox Button where Space key is pressed but button fails to be in active state\n      if (keyIsDown !== enter && keyIsDown !== space) {\n        setActive(false);\n      }\n    }, 0);\n\n    return () => {\n      clearTimeout(t);\n    };\n  }, [active, keyIsDown]);\n\n  const handleKeyUp = (event: KeyboardEvent<T>) => {\n    setKeyIsDown(\"\");\n    setActive(false);\n    onKeyUp?.(event);\n  };\n\n  const handleClick = (event: MouseEvent<T>) => {\n    setActive(true);\n    onClick?.(event);\n  };\n\n  const handleBlur = (event: FocusEvent<T>) => {\n    setActive(false);\n    onBlur?.(event);\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<T>) => {\n    if (event.key === enter || event.key === space) {\n      setKeyIsDown(event.key);\n      setActive(true);\n    }\n\n    onKeyDown?.(event);\n  };\n\n  const buttonProps = {\n    \"aria-disabled\": disabled && focusableWhenDisabled ? true : undefined,\n    \"data-loading\": loading,\n    disabled: disabled && !focusableWhenDisabled,\n    tabIndex: disabled && !focusableWhenDisabled ? -1 : 0,\n    onBlur: handleBlur,\n    onClick: !loading && !disabled ? handleClick : undefined,\n    onKeyDown: handleKeyDown,\n    onKeyUp: handleKeyUp,\n  };\n\n  return {\n    active,\n    buttonProps,\n  };\n};\n"],"names":[],"mappings":";;AAgCO,MAAM,YAAY,CAAoB;AAAA,EAC3C,OAAA;AAAA,EACA,QAAA;AAAA,EACA,qBAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA;AACF,CAA+C,KAAA;AAC7C,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,SAAS,EAAE,CAAA;AAC7C,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,SAAS,KAAK,CAAA;AAE1C,EAAA,MAAM,KAAQ,GAAA,OAAA;AACd,EAAA,MAAM,KAAQ,GAAA,GAAA;AAGd,EAAA,SAAA,CAAU,MAAM;AACd,IAAM,MAAA,CAAA,GAAI,WAAW,MAAM;AAGzB,MAAI,IAAA,SAAA,KAAc,KAAS,IAAA,SAAA,KAAc,KAAO,EAAA;AAC9C,QAAA,SAAA,CAAU,KAAK,CAAA;AAAA;AACjB,OACC,CAAC,CAAA;AAEJ,IAAA,OAAO,MAAM;AACX,MAAA,YAAA,CAAa,CAAC,CAAA;AAAA,KAChB;AAAA,GACC,EAAA,CAAC,MAAQ,EAAA,SAAS,CAAC,CAAA;AAEtB,EAAM,MAAA,WAAA,GAAc,CAAC,KAA4B,KAAA;AAC/C,IAAA,YAAA,CAAa,EAAE,CAAA;AACf,IAAA,SAAA,CAAU,KAAK,CAAA;AACf,IAAU,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAA,KAAA,CAAA;AAAA,GACZ;AAEA,EAAM,MAAA,WAAA,GAAc,CAAC,KAAyB,KAAA;AAC5C,IAAA,SAAA,CAAU,IAAI,CAAA;AACd,IAAU,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAA,KAAA,CAAA;AAAA,GACZ;AAEA,EAAM,MAAA,UAAA,GAAa,CAAC,KAAyB,KAAA;AAC3C,IAAA,SAAA,CAAU,KAAK,CAAA;AACf,IAAS,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAA,KAAA,CAAA;AAAA,GACX;AAEA,EAAM,MAAA,aAAA,GAAgB,CAAC,KAA4B,KAAA;AACjD,IAAA,IAAI,KAAM,CAAA,GAAA,KAAQ,KAAS,IAAA,KAAA,CAAM,QAAQ,KAAO,EAAA;AAC9C,MAAA,YAAA,CAAa,MAAM,GAAG,CAAA;AACtB,MAAA,SAAA,CAAU,IAAI,CAAA;AAAA;AAGhB,IAAY,SAAA,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAA,KAAA,CAAA;AAAA,GACd;AAEA,EAAA,MAAM,WAAc,GAAA;AAAA,IAClB,eAAA,EAAiB,QAAY,IAAA,qBAAA,GAAwB,IAAO,GAAA,MAAA;AAAA,IAC5D,cAAgB,EAAA,OAAA;AAAA,IAChB,QAAA,EAAU,YAAY,CAAC,qBAAA;AAAA,IACvB,QAAU,EAAA,QAAA,IAAY,CAAC,qBAAA,GAAwB,EAAK,GAAA,CAAA;AAAA,IACpD,MAAQ,EAAA,UAAA;AAAA,IACR,OAAS,EAAA,CAAC,OAAW,IAAA,CAAC,WAAW,WAAc,GAAA,MAAA;AAAA,IAC/C,SAAW,EAAA,aAAA;AAAA,IACX,OAAS,EAAA;AAAA,GACX;AAEA,EAAO,OAAA;AAAA,IACL,MAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}
+{"version":3,"file":"useButton.js","sources":["../src/button/useButton.ts"],"sourcesContent":["import {\n  type FocusEvent,\n  type KeyboardEvent,\n  type MouseEvent,\n  useEffect,\n  useState,\n} from \"react\";\n\nexport interface ButtonHookProps<T extends Element> {\n  loading?: boolean;\n  disabled?: boolean;\n  focusableWhenDisabled?: boolean;\n  onKeyUp?: (event: KeyboardEvent<T>) => void;\n  onKeyDown?: (event: KeyboardEvent<T>) => void;\n  onClick?: (event: MouseEvent<T>) => void;\n  onBlur?: (event: FocusEvent<T>) => void;\n}\n\nexport interface ButtonHookResult<T extends Element> {\n  active: boolean;\n  buttonProps: {\n    \"aria-disabled\"?: boolean;\n    \"data-loading\"?: boolean;\n    disabled?: boolean;\n    tabIndex: number;\n    onBlur: (event: FocusEvent<T>) => void;\n    onClick?: (event: MouseEvent<T>) => void;\n    onKeyDown: (event: KeyboardEvent<T>) => void;\n    onKeyUp: (event: KeyboardEvent<T>) => void;\n  };\n}\n\nexport const useButton = <T extends Element>({\n  loading,\n  disabled,\n  focusableWhenDisabled,\n  onKeyUp,\n  onKeyDown,\n  onClick,\n  onBlur,\n}: ButtonHookProps<T>): ButtonHookResult<T> => {\n  const [keyIsDown, setKeyIsDown] = useState(\"\");\n  const [active, setActive] = useState(false);\n\n  const enter = \"Enter\";\n  const space = \" \";\n\n  // biome-ignore lint/correctness/useExhaustiveDependencies: active is needed to remove the active styling on mouse up\n  useEffect(() => {\n    const t = setTimeout(() => {\n      // This key state check is to stop continual visual state change when using Enter Key, which the browser treats as both key and click events on a Button\n      // This key state check also fixes Firefox Button where Space key is pressed but button fails to be in active state\n      if (keyIsDown !== enter && keyIsDown !== space) {\n        setActive(false);\n      }\n    }, 0);\n\n    return () => {\n      clearTimeout(t);\n    };\n  }, [active, keyIsDown]);\n\n  const handleKeyUp = (event: KeyboardEvent<T>) => {\n    setKeyIsDown(\"\");\n    setActive(false);\n    onKeyUp?.(event);\n  };\n\n  const handleClick = (event: MouseEvent<T>) => {\n    setActive(true);\n    onClick?.(event);\n  };\n\n  const handleBlur = (event: FocusEvent<T>) => {\n    setActive(false);\n    onBlur?.(event);\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<T>) => {\n    if (event.key === enter || event.key === space) {\n      setKeyIsDown(event.key);\n      setActive(true);\n    }\n\n    onKeyDown?.(event);\n  };\n\n  const buttonProps = {\n    \"aria-disabled\": disabled && focusableWhenDisabled ? true : undefined,\n    \"data-loading\": loading,\n    disabled: disabled && !focusableWhenDisabled,\n    tabIndex: disabled && !focusableWhenDisabled ? -1 : 0,\n    onBlur: handleBlur,\n    onClick: !loading && !disabled ? handleClick : undefined,\n    onKeyDown: handleKeyDown,\n    onKeyUp: handleKeyUp,\n  };\n\n  return {\n    active,\n    buttonProps,\n  };\n};\n"],"names":[],"mappings":";;AAgCO,MAAM,YAAY,CAAoB;AAAA,EAC3C,OAAA;AAAA,EACA,QAAA;AAAA,EACA,qBAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA;AACF,CAAA,KAA+C;AAC7C,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,SAAS,EAAE,CAAA;AAC7C,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,SAAS,KAAK,CAAA;AAE1C,EAAA,MAAM,KAAA,GAAQ,OAAA;AACd,EAAA,MAAM,KAAA,GAAQ,GAAA;AAGd,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,MAAM,CAAA,GAAI,WAAW,MAAM;AAGzB,MAAA,IAAI,SAAA,KAAc,KAAA,IAAS,SAAA,KAAc,KAAA,EAAO;AAC9C,QAAA,SAAA,CAAU,KAAK,CAAA;AAAA,MACjB;AAAA,IACF,GAAG,CAAC,CAAA;AAEJ,IAAA,OAAO,MAAM;AACX,MAAA,YAAA,CAAa,CAAC,CAAA;AAAA,IAChB,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,MAAA,EAAQ,SAAS,CAAC,CAAA;AAEtB,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAA4B;AAC/C,IAAA,YAAA,CAAa,EAAE,CAAA;AACf,IAAA,SAAA,CAAU,KAAK,CAAA;AACf,IAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AAAA,EACZ,CAAA;AAEA,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAyB;AAC5C,IAAA,SAAA,CAAU,IAAI,CAAA;AACd,IAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AAAA,EACZ,CAAA;AAEA,EAAA,MAAM,UAAA,GAAa,CAAC,KAAA,KAAyB;AAC3C,IAAA,SAAA,CAAU,KAAK,CAAA;AACf,IAAA,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAS,KAAA,CAAA;AAAA,EACX,CAAA;AAEA,EAAA,MAAM,aAAA,GAAgB,CAAC,KAAA,KAA4B;AACjD,IAAA,IAAI,KAAA,CAAM,GAAA,KAAQ,KAAA,IAAS,KAAA,CAAM,QAAQ,KAAA,EAAO;AAC9C,MAAA,YAAA,CAAa,MAAM,GAAG,CAAA;AACtB,MAAA,SAAA,CAAU,IAAI,CAAA;AAAA,IAChB;AAEA,IAAA,SAAA,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAY,KAAA,CAAA;AAAA,EACd,CAAA;AAEA,EAAA,MAAM,WAAA,GAAc;AAAA,IAClB,eAAA,EAAiB,QAAA,IAAY,qBAAA,GAAwB,IAAA,GAAO,MAAA;AAAA,IAC5D,cAAA,EAAgB,OAAA;AAAA,IAChB,QAAA,EAAU,YAAY,CAAC,qBAAA;AAAA,IACvB,QAAA,EAAU,QAAA,IAAY,CAAC,qBAAA,GAAwB,EAAA,GAAK,CAAA;AAAA,IACpD,MAAA,EAAQ,UAAA;AAAA,IACR,OAAA,EAAS,CAAC,OAAA,IAAW,CAAC,WAAW,WAAA,GAAc,MAAA;AAAA,IAC/C,SAAA,EAAW,aAAA;AAAA,IACX,OAAA,EAAS;AAAA,GACX;AAEA,EAAA,OAAO;AAAA,IACL,MAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}