@chassis-ui/react 0.2.0 → 0.3.0

package/dist/chunks/accordion-B8UWyvQB.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion-B8UWyvQB.js","names":[],"sources":["../../src/components/accordion/AccordionBody.tsx","../../src/components/accordion/AccordionHeader.tsx","../../src/components/accordion/context.ts","../../src/components/accordion/AccordionItem.tsx","../../src/components/accordion/Accordion.tsx"],"sourcesContent":["import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype AccordionBodyOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: C\n}\n\nexport type AccordionBodyProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  AccordionBodyOwnProps<C>\n>\n\ntype AccordionBodyComponent = (<C extends ElementType = 'div'>(\n  props: AccordionBodyProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction AccordionBodyRender<C extends ElementType = 'div'>(\n  { children, className, component, ...rest }: AccordionBodyProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'div'\n\n  return (\n    <Component className={classNames('accordion-body', className)} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const AccordionBody = createPolymorphicComponent<AccordionBodyComponent>(\n  AccordionBodyRender as ForwardRefRenderFunction<Element, AccordionBodyProps<ElementType>>,\n  'AccordionBody'\n)\n","import React, { forwardRef, HTMLAttributes } from 'react'\nimport classNames from 'classnames'\n\nexport interface AccordionHeaderProps extends HTMLAttributes<HTMLElement> {\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n}\n\nexport const AccordionHeader = forwardRef<HTMLElement, AccordionHeaderProps>(\n  ({ children, className, ...rest }, ref) => {\n    return (\n      <summary className={classNames(className) || undefined} {...rest} ref={ref}>\n        <span className=\"accordion-title\">{children}</span>\n      </summary>\n    )\n  }\n)\n\nAccordionHeader.displayName = 'AccordionHeader'\n","import { createContext } from 'react'\n\nexport interface AccordionContextProps {\n  alwaysOpen?: boolean\n  name?: string\n}\n\nexport const AccordionContext = createContext<AccordionContextProps>({})\n","import React, { forwardRef, DetailsHTMLAttributes, useContext } from 'react'\nimport classNames from 'classnames'\n\nimport { AccordionContext } from './context'\nimport { devWarning } from '../../utils/devWarning'\n\nexport interface AccordionItemProps extends DetailsHTMLAttributes<HTMLDetailsElement> {\n  /**\n   * Let this item stay open when another item opens, overriding the accordion's `alwaysOpen` setting.\n   */\n  alwaysOpen?: boolean\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * The group this item shares with other items so only one can be open at a time, overriding the\n   * accordion's shared `name`.\n   */\n  name?: string\n  /**\n   * Start the item in the open state.\n   */\n  open?: boolean\n  /**\n   * @deprecated No longer used. The native details element manages its own state.\n   */\n  itemKey?: number | string\n}\n\nexport const AccordionItem = forwardRef<HTMLDetailsElement, AccordionItemProps>(\n  ({ children, alwaysOpen, className, name, open, itemKey: _itemKey, ...rest }, ref) => {\n    devWarning(\n      _itemKey !== undefined,\n      'AccordionItem: the itemKey prop is deprecated and no longer used — the native ' +\n        '<details> element manages its own state. It will be removed in a future major version.'\n    )\n\n    const context = useContext(AccordionContext)\n    const isAlwaysOpen = alwaysOpen ?? context.alwaysOpen\n    const groupName = name ?? context.name\n\n    const groupProps = isAlwaysOpen ? {} : { name: groupName }\n\n    return (\n      <details\n        className={classNames('accordion-item', className)}\n        open={open}\n        {...(groupProps as React.HTMLAttributes<HTMLDetailsElement>)}\n        {...rest}\n        ref={ref}\n      >\n        {children}\n      </details>\n    )\n  }\n)\n\nAccordionItem.displayName = 'AccordionItem'\n","import React, { forwardRef, HTMLAttributes, ReactNode, useId, useRef, useState } from 'react'\nimport classNames from 'classnames'\n\nimport { AccordionBody } from './AccordionBody'\nimport { AccordionHeader } from './AccordionHeader'\nimport { AccordionItem } from './AccordionItem'\nimport { AccordionContext } from './context'\n\nexport interface AccordionItemDef {\n  /**\n   * Let this item stay open when another item opens, overriding the accordion's `alwaysOpen` setting.\n   */\n  alwaysOpen?: boolean\n  /**\n   * Body content, rendered inside a `AccordionBody`.\n   */\n  body: ReactNode\n  /**\n   * A string of all className you want applied to this item.\n   */\n  className?: string\n  /**\n   * Header content, rendered inside a `AccordionHeader`.\n   */\n  header: ReactNode\n  /**\n   * React key for this item. Falls back to its index when omitted.\n   */\n  id?: number | string\n  /**\n   * The group this item shares with other items so only one can be open at a time, overriding the\n   * accordion's shared `name`.\n   */\n  name?: string\n  /**\n   * Callback fired when this item's open state changes. Chained after `Accordion`'s own handling\n   * of `expandedKeys`/`onExpandedChange`, so it fires regardless of whether those are used.\n   */\n  onToggle?: (event: React.SyntheticEvent<HTMLDetailsElement>) => void\n  /**\n   * Start the item in the open state (uncontrolled). Ignored for items whose key is included in\n   * `expandedKeys`/`defaultExpandedKeys` on the parent `Accordion`.\n   */\n  open?: boolean\n}\n\nexport interface AccordionProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Make accordion items stay open when another item is opened.\n   */\n  alwaysOpen?: boolean\n  /**\n   * Move the caret icon to the end of the header.\n   */\n  caretEnd?: boolean\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * The keys of the initially expanded items (uncontrolled). Only applies to items rendered via\n   * the `items` prop — a composed `AccordionItem` already supports native controlled `open`/\n   * `onToggle` directly.\n   */\n  defaultExpandedKeys?: Array<number | string>\n  /**\n   * The keys of the currently expanded items (controlled). Only applies to items rendered via the\n   * `items` prop — a composed `AccordionItem` already supports native controlled `open`/`onToggle`\n   * directly.\n   */\n  expandedKeys?: Array<number | string>\n  /**\n   * Removes the default background-context, some borders, and some rounded corners to render accordions edge-to-edge with their parent container.\n   */\n  flush?: boolean\n  /**\n   * Array of item definitions for data-driven rendering. When provided, children are ignored.\n   */\n  items?: AccordionItemDef[]\n  /**\n   * The shared group name used by items that don't set their own `name`. Defaults to an auto-generated id.\n   */\n  name?: string\n  /**\n   * Callback fired with the updated set of expanded item keys, reflecting the native `<details>`\n   * elements' actual open state (including items the browser closed itself via a shared `name`\n   * group). Only fires for items rendered via the `items` prop.\n   */\n  onExpandedChange?: (keys: Array<number | string>) => void\n  /**\n   * Size the component sm or lg.\n   */\n  size?: 'sm' | 'lg'\n}\n\nexport const Accordion = forwardRef<HTMLDivElement, AccordionProps>(\n  (\n    {\n      children,\n      alwaysOpen = false,\n      caretEnd,\n      className,\n      defaultExpandedKeys,\n      expandedKeys,\n      flush,\n      items,\n      name,\n      onExpandedChange,\n      size,\n      ...rest\n    },\n    ref\n  ) => {\n    const generatedName = useId()\n    const groupName = name ?? generatedName\n    const _className = classNames('accordion', { flush, 'caret-end': caretEnd }, size, className)\n\n    const isExpandedControlled = expandedKeys !== undefined\n    const isTrackingExpanded =\n      isExpandedControlled || defaultExpandedKeys !== undefined || onExpandedChange !== undefined\n\n    const [uncontrolledExpandedKeys, setUncontrolledExpandedKeys] = useState<\n      Array<number | string>\n    >(\n      () =>\n        defaultExpandedKeys ??\n        items?.filter((item) => item.open).map((item, index) => item.id ?? index) ??\n        []\n    )\n    const currentExpandedKeys = isExpandedControlled ? expandedKeys : uncontrolledExpandedKeys\n\n    // Keyed by each item's id (or index) so a toggle handler can read every sibling's *actual*\n    // DOM open state — the browser settles a whole shared-`name` group's open attributes\n    // synchronously before dispatching any `toggle` events, so this is always the true next set,\n    // regardless of which affected item's handler happens to run first.\n    const itemRefs = useRef(new Map<number | string, HTMLDetailsElement | null>())\n\n    const handleItemToggle =\n      (id: number | string, itemOnToggle?: AccordionItemDef['onToggle']) =>\n      (event: React.SyntheticEvent<HTMLDetailsElement>) => {\n        itemOnToggle?.(event)\n        if (!items) return\n        const next = items\n          .map((item, index) => item.id ?? index)\n          .filter((key) => itemRefs.current.get(key)?.open)\n        if (isExpandedControlled) {\n          // React doesn't intercept a native <details> click the way it does controlled form\n          // inputs, so the DOM has already toggled by the time this fires. Snap this element back\n          // to the still-current controlled value — if the consumer's onExpandedChange updates\n          // `expandedKeys` in response, the next render sets it back to the new value anyway.\n          ;(event.currentTarget as HTMLDetailsElement).open = expandedKeys.includes(id)\n        } else {\n          setUncontrolledExpandedKeys(next)\n        }\n        onExpandedChange?.(next)\n      }\n\n    const content = items\n      ? items.map((item, index) => {\n          const id = item.id ?? index\n          return (\n            <AccordionItem\n              key={id}\n              className={item.className}\n              open={isTrackingExpanded ? currentExpandedKeys.includes(id) : item.open}\n              name={item.name}\n              alwaysOpen={item.alwaysOpen}\n              onToggle={handleItemToggle(id, item.onToggle)}\n              ref={(node) => {\n                itemRefs.current.set(id, node)\n              }}\n            >\n              <AccordionHeader>{item.header}</AccordionHeader>\n              <AccordionBody>{item.body}</AccordionBody>\n            </AccordionItem>\n          )\n        })\n      : children\n\n    return (\n      <div className={_className} {...rest} ref={ref}>\n        <AccordionContext.Provider value={{ alwaysOpen, name: groupName }}>\n          {content}\n        </AccordionContext.Provider>\n      </div>\n    )\n  }\n)\n\nAccordion.displayName = 'Accordion'\n"],"mappings":"yPA6BA,SAAS,EACP,CAAE,WAAU,YAAW,YAAW,GAAG,GACrC,EACA,CACA,IAAM,EAAY,GAAa,MAE/B,OACE,EAAA,cAAC,EAAD,CAAW,UAAW,EAAW,iBAAkB,CAAS,EAAG,GAAI,EAAW,KAEnE,EADR,CACQ,CAEf,CAEA,MAAa,EAAgB,EAC3B,EACA,eACF,ECnCa,EAAkB,GAC5B,CAAE,WAAU,YAAW,GAAG,GAAQ,IAE/B,EAAA,cAAC,UAAD,CAAS,UAAW,EAAW,CAAS,GAAK,IAAA,GAAW,GAAI,EAAW,KAE9D,EADP,EAAA,cAAC,OAAD,CAAM,UAAU,iBAAkC,EAAf,CAAe,CAC3C,CAGf,EAEA,EAAgB,YAAc,kBCb9B,MAAa,EAAmB,EAAqC,CAAC,CAAC,ECuB1D,EAAgB,GAC1B,CAAE,WAAU,aAAY,YAAW,OAAM,OAAM,QAAS,EAAU,GAAG,GAAQ,IAAQ,CACpF,EACE,IAAa,IAAA,GACb,sKAEF,EAEA,IAAM,EAAU,EAAW,CAAgB,EACrC,EAAe,GAAc,EAAQ,WACrC,EAAY,GAAQ,EAAQ,KAE5B,EAAa,EAAe,CAAC,EAAI,CAAE,KAAM,CAAU,EAEzD,OACE,EAAA,cAAC,UAAD,CACE,UAAW,EAAW,iBAAkB,CAAS,EAC3C,OACN,GAAK,EACL,GAAI,EACC,KAGE,EADN,CACM,CAEb,CACF,EAEA,EAAc,YAAc,gBCqC5B,MAAa,EAAY,GAErB,CACE,WACA,aAAa,GACb,WACA,YACA,sBACA,eACA,QACA,QACA,OACA,mBACA,OACA,GAAG,GAEL,IACG,CACH,IAAM,EAAgB,EAAM,EACtB,EAAY,GAAQ,EACpB,EAAa,EAAW,YAAa,CAAE,QAAO,YAAa,CAAS,EAAG,EAAM,CAAS,EAEtF,EAAuB,IAAiB,IAAA,GACxC,EACJ,GAAwB,IAAwB,IAAA,IAAa,IAAqB,IAAA,GAE9E,CAAC,EAA0B,GAA+B,MAI5D,GACA,GAAO,OAAQ,GAAS,EAAK,IAAI,CAAC,CAAC,KAAK,EAAM,IAAU,EAAK,IAAM,CAAK,GACxE,CAAC,CACL,EACM,EAAsB,EAAuB,EAAe,EAM5D,EAAW,EAAO,IAAI,GAAiD,EAEvE,GACH,EAAqB,IACrB,GAAoD,CAEnD,GADA,IAAe,CAAK,EAChB,CAAC,EAAO,OACZ,IAAM,EAAO,EACV,KAAK,EAAM,IAAU,EAAK,IAAM,CAAK,CAAC,CACtC,OAAQ,GAAQ,EAAS,QAAQ,IAAI,CAAG,CAAC,EAAE,IAAI,EAC9C,EAKD,EAAO,cAAqC,KAAO,EAAa,SAAS,CAAE,EAE5E,EAA4B,CAAI,EAElC,IAAmB,CAAI,CACzB,EAEI,EAAU,EACZ,EAAM,KAAK,EAAM,IAAU,CACzB,IAAM,EAAK,EAAK,IAAM,EACtB,OACE,EAAA,cAAC,EAAD,CACE,IAAK,EACL,UAAW,EAAK,UAChB,KAAM,EAAqB,EAAoB,SAAS,CAAE,EAAI,EAAK,KACnE,KAAM,EAAK,KACX,WAAY,EAAK,WACjB,SAAU,EAAiB,EAAI,EAAK,QAAQ,EAC5C,IAAM,GAAS,CACb,EAAS,QAAQ,IAAI,EAAI,CAAI,CAC/B,CAIa,EAFb,EAAA,cAAC,EAAA,KAAiB,EAAK,MAAwB,EAC/C,EAAA,cAAC,EAAA,KAAe,EAAK,IAAoB,CAC5B,CAEnB,CAAC,EACD,EAEJ,OACE,EAAA,cAAC,MAAD,CAAK,UAAW,EAAY,GAAI,EAAW,KAItC,EAHH,EAAA,cAAC,EAAiB,SAAlB,CAA2B,MAAO,CAAE,aAAY,KAAM,CAAU,CAErC,EADxB,CACwB,CACxB,CAET,CACF,EAEA,EAAU,YAAc"}

package/dist/chunks/alert-BXI-_qlt.js

@@ -0,0 +1,2 @@
+import"./focus-ring-SR_LwaN7.js";import{c as e}from"./slot-CNhFZdHF.js";import{t}from"./useForkedRef-DVEfT-KI.js";import{t as n}from"./polymorphic-BhGNZQja.js";import{t as r}from"./useIsomorphicLayoutEffect-BbqRwuqn.js";import{t as i}from"./useDialogElement-CgOnJAzu.js";import{t as a}from"./Icon-DLB1f88W.js";import{t as o}from"./CloseButton-DPgQztE0.js";import{t as s}from"./Button-BoymWE-L.js";import c,{createContext as l,forwardRef as u,useCallback as d,useContext as f,useId as p,useRef as m,useState as h}from"react";import g from"classnames";const _=l({close:()=>{},registerPart:()=>()=>{}}),v=()=>f(_),y=u(({"aria-describedby":t,"aria-labelledby":n,backdrop:r=`static`,children:a,className:s,closeButton:l,closeLabel:u,defaultVisible:f,instant:p,keyboard:m=!1,onClick:v,onClose:y,onClosePrevented:b,onHidden:x,onShow:S,onShown:C,onVisibleChange:w,open:T,visible:E,...D},O)=>{let{close:k,forkedRef:A,handleBackdropClick:j,handleCancel:M,hiding:N,staticBounce:P}=i({backdrop:r,defaultVisible:f,instant:p,isModal:!0,keyboard:m,onClick:v,onClose:y,onClosePrevented:b,onHidden:x,onShow:S,onShown:C,onVisibleChange:w,open:T,ref:O,visible:E}),[F,I]=h([]),L=d((e,t,n)=>{let r={id:n,kind:e,node:t};return I(e=>[...e,r]),()=>I(e=>e.filter(e=>e!==r))},[]),R=e=>F.filter(t=>t.kind===e).sort((e,t)=>e.node.compareDocumentPosition(t.node)&Node.DOCUMENT_POSITION_FOLLOWING?-1:1).map(({id:e})=>e),z=n||e(...R(`title`)),B=t||e(...R(`description`)),V={close:k,registerPart:L};return c.createElement(_.Provider,{value:V},c.createElement(`dialog`,{"aria-describedby":B,"aria-labelledby":z,role:`alertdialog`,...D,open:T,className:g(`alert`,`dialog`,{instant:p,hiding:N,"dialog-static":P},s),onCancel:M,onClick:j,ref:A},a,l&&c.createElement(o,{label:u,onClick:k})))});y.displayName=`Alert`;function b({children:e,className:t,component:n,...r},i){let a=n??`div`;return c.createElement(a,{className:g(`alert-body`,t),...r,ref:i},e)}const x=n(b,`AlertBody`),S=u(({color:e=`default`,onClick:t,...n},r)=>{let{close:i}=v();return c.createElement(s,{color:e,"data-autofocus":``,...n,onClick:e=>{t?.(e),e.defaultPrevented||i()},ref:r})});S.displayName=`AlertCancel`;function C(e){let t=m(null),{registerPart:n}=v(),i=m({});return r(()=>{let r=t.current,a=r?.id||void 0;a!==i.current.id&&(i.current.unregister?.(),i.current=r&&a?{id:a,unregister:n(e,r,a)}:{})}),r(()=>()=>{i.current.unregister?.(),i.current={}},[n]),t}function w({children:e,className:n,component:r,id:i,...a},o){let s=r??`code`,l=p(),u=C(`description`),d=t(o,u);return c.createElement(s,{className:g(`alert-code`,n),id:i??l,...a,ref:d},e)}const T=n(w,`AlertCode`);function E({children:e,className:t,component:n,stacked:r,...i},a){let o=n??`div`;return c.createElement(o,{className:g(`alert-footer`,{stacked:r},t),...i,ref:a},e)}const D=n(E,`AlertFooter`),O=u(({className:e,color:t,...n},r)=>c.createElement(a,{className:g(`alert-icon`,t&&`icon-${t}`,e),...n,ref:r}));O.displayName=`AlertIcon`;function k({children:e,className:n,component:r,id:i,...a},o){let s=r??`p`,l=p(),u=C(`description`),d=t(o,u);return c.createElement(s,{className:n,id:i??l,...a,ref:d},e)}const A=n(k,`AlertText`);function j({children:e,className:n,component:r,id:i,...a},o){let s=r??`h2`,l=p(),u=C(`title`),d=t(o,u);return c.createElement(s,{className:g(`alert-title`,n),id:i??l,...a,ref:d},e)}const M=n(j,`AlertTitle`);export{T as a,y as c,D as i,A as n,S as o,O as r,x as s,M as t};
+//# sourceMappingURL=alert-BXI-_qlt.js.map

package/dist/chunks/alert-BXI-_qlt.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-BXI-_qlt.js","names":[],"sources":["../../src/components/alert/Alert.tsx","../../src/components/alert/AlertBody.tsx","../../src/components/alert/AlertCancel.tsx","../../src/components/alert/useAlertPart.ts","../../src/components/alert/AlertCode.tsx","../../src/components/alert/AlertFooter.tsx","../../src/components/alert/AlertIcon.tsx","../../src/components/alert/AlertText.tsx","../../src/components/alert/AlertTitle.tsx"],"sourcesContent":["import React, {\n  createContext,\n  DialogHTMLAttributes,\n  forwardRef,\n  useCallback,\n  useContext,\n  useState\n} from 'react'\nimport classNames from 'classnames'\n\nimport { useDialogElement } from '../../hooks'\nimport { joinIds } from '../../utils/idRefs'\nimport { CloseButton } from '../close-button/CloseButton'\n\nexport interface AlertProps extends Omit<\n  DialogHTMLAttributes<HTMLDialogElement>,\n  'onCancel' | 'onClose'\n> {\n  /**\n   * Whether a click on the backdrop closes the alert. By default it doesn't (`'static'`): the\n   * alert bounces, since an alert dialog waits for an explicit choice. Set `true` to let it close.\n   */\n  backdrop?: true | 'static'\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * Adds a close button in the corner, for an alert that needs a way out besides its actions.\n   */\n  closeButton?: boolean\n  /**\n   * The close button's accessible name. Defaults to `'Close'`; set it for non-English UIs.\n   */\n  closeLabel?: string\n  /**\n   * Whether the alert is open when it first renders. Such an alert is uncontrolled: it closes\n   * itself on a close request. Use `visible` to open and close it from outside.\n   */\n  defaultVisible?: boolean\n  /**\n   * Disable the open/close transition entirely.\n   */\n  instant?: boolean\n  /**\n   * Whether the Escape key closes the alert. By default it doesn't: the alert bounces instead.\n   */\n  keyboard?: boolean\n  /**\n   * Renders the alert open from its first paint, server HTML included, as a non-modal dialog: a\n   * static preview. It stays open until a close request. Use `visible` or `defaultVisible` to\n   * open it as a modal dialog.\n   */\n  open?: boolean\n  /**\n   * Callback fired when the alert asks to be closed: `AlertCancel`, the close button, and, when\n   * allowed, Escape or a backdrop click.\n   */\n  onClose?: () => void\n  /**\n   * Callback fired when a close attempt is blocked: a click on a static backdrop, or Escape\n   * while `keyboard` is off.\n   */\n  onClosePrevented?: () => void\n  /**\n   * Callback fired after the exit transition completes and the alert is fully hidden.\n   */\n  onHidden?: () => void\n  /**\n   * Callback fired when the alert starts to open.\n   */\n  onShow?: () => void\n  /**\n   * Callback fired after the entry transition completes and the alert is fully visible.\n   */\n  onShown?: () => void\n  /**\n   * Callback fired with `false` when the alert asks to be closed, at the same moments as\n   * `onClose`. It makes `visible` and `onVisibleChange` a pair that takes a state setter.\n   */\n  onVisibleChange?: (visible: boolean) => void\n  /**\n   * Whether the alert is open. The alert is then controlled: a close request only fires `onClose`\n   * and `onVisibleChange`, and the alert closes when this becomes `false`.\n   */\n  visible?: boolean\n}\n\nexport type AlertPartKind = 'title' | 'description'\n\nexport interface AlertContextProps {\n  /**\n   * Asks the alert to close: fires `onClose` and `onVisibleChange(false)`.\n   */\n  close: () => void\n  /**\n   * Adds a rendered element to the alert's `aria-labelledby` (a title) or `aria-describedby` (a\n   * code or text), under the id it has in the DOM, and returns the function that takes it out.\n   * The parts call it through `useAlertPart`.\n   */\n  registerPart: (kind: AlertPartKind, node: HTMLElement, id: string) => () => void\n}\n\nexport const AlertContext = createContext<AlertContextProps>({\n  close: () => {},\n  registerPart: () => () => {}\n})\n\nexport const useAlertContext = () => useContext(AlertContext)\n\n// chassis-css's alert dialog: a `<dialog class=\"alert dialog\" role=\"alertdialog\">`, opened with\n// `showModal()` by the same machinery as `Modal` (`useDialogElement`). What differs is the\n// defaults an alert dialog wants (a static backdrop, no Escape) and how it is named and\n// described. `aria-labelledby` and `aria-describedby` list the `AlertTitle`, `AlertCode` and\n// `AlertText` elements that are rendered, under the ids they have in the DOM (a child's own id\n// under `asChild`, a caller's `id`), in document order. The parts register from a layout effect\n// (`useAlertPart`), so the server's HTML names no id that isn't in it, and both attributes are\n// set before the first paint.\nexport const Alert = forwardRef<HTMLDialogElement, AlertProps>(\n  (\n    {\n      'aria-describedby': ariaDescribedBy,\n      'aria-labelledby': ariaLabelledBy,\n      backdrop = 'static',\n      children,\n      className,\n      closeButton,\n      closeLabel,\n      defaultVisible,\n      instant,\n      keyboard = false,\n      onClick,\n      onClose,\n      onClosePrevented,\n      onHidden,\n      onShow,\n      onShown,\n      onVisibleChange,\n      open,\n      visible,\n      ...rest\n    },\n    ref\n  ) => {\n    const { close, forkedRef, handleBackdropClick, handleCancel, hiding, staticBounce } =\n      useDialogElement({\n        backdrop,\n        defaultVisible,\n        instant,\n        isModal: true,\n        keyboard,\n        onClick,\n        onClose,\n        onClosePrevented,\n        onHidden,\n        onShow,\n        onShown,\n        onVisibleChange,\n        open,\n        ref,\n        visible\n      })\n\n    const [parts, setParts] = useState<{ id: string; kind: AlertPartKind; node: HTMLElement }[]>([])\n    const registerPart = useCallback((kind: AlertPartKind, node: HTMLElement, id: string) => {\n      const part = { id, kind, node }\n      setParts((current) => [...current, part])\n      return () => setParts((current) => current.filter((entry) => entry !== part))\n    }, [])\n\n    const idsOf = (kind: AlertPartKind) =>\n      parts\n        .filter((part) => part.kind === kind)\n        .sort((a, b) =>\n          a.node.compareDocumentPosition(b.node) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1\n        )\n        .map(({ id }) => id)\n    // An empty string counts as unset.\n    const labelledBy = ariaLabelledBy || joinIds(...idsOf('title'))\n    const describedBy = ariaDescribedBy || joinIds(...idsOf('description'))\n\n    const contextValue = { close, registerPart }\n\n    return (\n      <AlertContext.Provider value={contextValue}>\n        <dialog\n          aria-describedby={describedBy}\n          aria-labelledby={labelledBy}\n          role=\"alertdialog\"\n          {...rest}\n          open={open}\n          className={classNames(\n            'alert',\n            'dialog',\n            { instant, hiding, 'dialog-static': staticBounce },\n            className\n          )}\n          onCancel={handleCancel}\n          onClick={handleBackdropClick}\n          ref={forkedRef}\n        >\n          {children}\n          {closeButton && <CloseButton label={closeLabel} onClick={close} />}\n        </dialog>\n      </AlertContext.Provider>\n    )\n  }\n)\n\nAlert.displayName = 'Alert'\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype AlertBodyOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use an HTML element or a component.\n   *\n   * @default 'div'\n   */\n  component?: C\n}\n\nexport type AlertBodyProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  AlertBodyOwnProps<C>\n>\n\ntype AlertBodyComponent = (<C extends ElementType = 'div'>(\n  props: AlertBodyProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\n// `.alert-body`: the column that holds the title, an optional code and the message.\n\nfunction AlertBodyRender<C extends ElementType = 'div'>(\n  { children, className, component, ...rest }: AlertBodyProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'div'\n\n  return (\n    <Component className={classNames('alert-body', className)} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const AlertBody = createPolymorphicComponent<AlertBodyComponent>(\n  AlertBodyRender as ForwardRefRenderFunction<Element, AlertBodyProps<ElementType>>,\n  'AlertBody'\n)\n","import React, { forwardRef, MouseEvent } from 'react'\n\nimport { Button, ButtonProps } from '../button/Button'\nimport { useAlertContext } from './Alert'\n\nexport type AlertCancelProps = Omit<ButtonProps<'button'>, 'asChild' | 'component' | 'href'>\n\n// The least destructive action: it closes the alert, and it has focus when the alert opens, as\n// an alert dialog should (WAI-ARIA APG). An element of your own with `data-autofocus` earlier in\n// the alert takes focus instead.\nexport const AlertCancel = forwardRef<HTMLButtonElement, AlertCancelProps>(\n  ({ color = 'default', onClick, ...rest }, ref) => {\n    const { close } = useAlertContext()\n    return (\n      <Button\n        color={color}\n        data-autofocus=\"\"\n        {...rest}\n        onClick={(event: MouseEvent<HTMLButtonElement>) => {\n          onClick?.(event)\n          if (!event.defaultPrevented) close()\n        }}\n        ref={ref}\n      />\n    )\n  }\n)\n\nAlertCancel.displayName = 'AlertCancel'\n","import { useRef } from 'react'\n\nimport { useIsomorphicLayoutEffect } from '../../hooks/useIsomorphicLayoutEffect'\nimport { AlertPartKind, useAlertContext } from './Alert'\n\n// Registers the element behind the returned ref with the enclosing `Alert`, under the id it has in\n// the DOM after each commit. That is the part's own id, a caller's `id`, or, under `asChild`, the\n// child's own id, which wins over the part's. A changed id registers again; unmounting takes the\n// element out. Outside an `Alert` it does nothing.\nexport function useAlertPart(kind: AlertPartKind) {\n  const nodeRef = useRef<HTMLElement | null>(null)\n  const { registerPart } = useAlertContext()\n  const registered = useRef<{ id?: string; unregister?: () => void }>({})\n\n  useIsomorphicLayoutEffect(() => {\n    const node = nodeRef.current\n    const id = node?.id || undefined\n    if (id === registered.current.id) return\n    registered.current.unregister?.()\n    registered.current = node && id ? { id, unregister: registerPart(kind, node, id) } : {}\n  })\n\n  useIsomorphicLayoutEffect(\n    () => () => {\n      registered.current.unregister?.()\n      registered.current = {}\n    },\n    [registerPart]\n  )\n\n  return nodeRef\n}\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement, useId } from 'react'\nimport classNames from 'classnames'\n\nimport { useForkedRef } from '../../hooks/useForkedRef'\nimport { useAlertPart } from './useAlertPart'\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype AlertCodeOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use an HTML element or a component.\n   *\n   * @default 'code'\n   */\n  component?: C\n}\n\nexport type AlertCodeProps<C extends ElementType = 'code'> = PolymorphicComponentProps<\n  C,\n  AlertCodeOwnProps<C>\n>\n\ntype AlertCodeComponent = (<C extends ElementType = 'code'>(\n  props: AlertCodeProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\n// `.alert-code`: a machine-readable reference, such as an error code, shown under the title. Its\n// id joins the alert's `aria-describedby`, in document order with the text's.\n\nfunction AlertCodeRender<C extends ElementType = 'code'>(\n  { children, className, component, id, ...rest }: AlertCodeProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'code'\n  const generatedId = useId()\n  const nodeRef = useAlertPart('description')\n  const forkedRef = useForkedRef(ref, nodeRef)\n\n  return (\n    <Component\n      className={classNames('alert-code', className)}\n      id={id ?? generatedId}\n      {...rest}\n      ref={forkedRef}\n    >\n      {children}\n    </Component>\n  )\n}\n\nexport const AlertCode = createPolymorphicComponent<AlertCodeComponent>(\n  AlertCodeRender as ForwardRefRenderFunction<Element, AlertCodeProps<ElementType>>,\n  'AlertCode'\n)\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype AlertFooterOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use an HTML element or a component.\n   *\n   * @default 'div'\n   */\n  component?: C\n  /**\n   * Stacks the actions as full-width rows on small screens, instead of sharing one row.\n   */\n  stacked?: boolean\n}\n\nexport type AlertFooterProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  AlertFooterOwnProps<C>\n>\n\ntype AlertFooterComponent = (<C extends ElementType = 'div'>(\n  props: AlertFooterProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\n// `.alert-footer`: the actions. chassis-css lays them out right to left, so write the primary\n// action first. Give a separate destructive action `className=\"me-auto\"` to push it to the other\n// end.\n\nfunction AlertFooterRender<C extends ElementType = 'div'>(\n  { children, className, component, stacked, ...rest }: AlertFooterProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'div'\n\n  return (\n    <Component className={classNames('alert-footer', { stacked }, className)} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const AlertFooter = createPolymorphicComponent<AlertFooterComponent>(\n  AlertFooterRender as ForwardRefRenderFunction<Element, AlertFooterProps<ElementType>>,\n  'AlertFooter'\n)\n","import React, { forwardRef } from 'react'\nimport classNames from 'classnames'\n\nimport { ContextColor } from '../../types'\nimport { Icon, IconProps } from '../icon/Icon'\n\nexport type AlertIconProps = IconProps & {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Colors the icon with one of Chassis context colors, such as `danger` for a destructive\n   * confirmation.\n   */\n  color?: ContextColor\n}\n\n// `.alert-icon`: an icon before the body. With it, chassis-css lays the alert out in two columns\n// from the `md` breakpoint up.\nexport const AlertIcon = forwardRef<HTMLSpanElement | SVGSVGElement, AlertIconProps>(\n  ({ className, color, ...rest }, ref) => (\n    <Icon\n      className={classNames('alert-icon', color && `icon-${color}`, className)}\n      {...rest}\n      ref={ref}\n    />\n  )\n)\n\nAlertIcon.displayName = 'AlertIcon'\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement, useId } from 'react'\n\nimport { useForkedRef } from '../../hooks/useForkedRef'\nimport { useAlertPart } from './useAlertPart'\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype AlertTextOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use an HTML element or a component.\n   *\n   * @default 'p'\n   */\n  component?: C\n}\n\nexport type AlertTextProps<C extends ElementType = 'p'> = PolymorphicComponentProps<\n  C,\n  AlertTextOwnProps<C>\n>\n\ntype AlertTextComponent = (<C extends ElementType = 'p'>(\n  props: AlertTextProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\n// The alert's message. Its id joins the alert's `aria-describedby`. chassis-css styles it as a\n// `<p>` inside `.alert-body`, with no class of its own.\n\nfunction AlertTextRender<C extends ElementType = 'p'>(\n  { children, className, component, id, ...rest }: AlertTextProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'p'\n  const generatedId = useId()\n  const nodeRef = useAlertPart('description')\n  const forkedRef = useForkedRef(ref, nodeRef)\n\n  return (\n    <Component className={className} id={id ?? generatedId} {...rest} ref={forkedRef}>\n      {children}\n    </Component>\n  )\n}\n\nexport const AlertText = createPolymorphicComponent<AlertTextComponent>(\n  AlertTextRender as ForwardRefRenderFunction<Element, AlertTextProps<ElementType>>,\n  'AlertText'\n)\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement, useId } from 'react'\nimport classNames from 'classnames'\n\nimport { useForkedRef } from '../../hooks/useForkedRef'\nimport { useAlertPart } from './useAlertPart'\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype AlertTitleOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use an HTML element or a component.\n   *\n   * @default 'h2'\n   */\n  component?: C\n}\n\nexport type AlertTitleProps<C extends ElementType = 'h2'> = PolymorphicComponentProps<\n  C,\n  AlertTitleOwnProps<C>\n>\n\ntype AlertTitleComponent = (<C extends ElementType = 'h2'>(\n  props: AlertTitleProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\n// `.alert-title`: its id, whichever reaches the DOM, joins the alert's `aria-labelledby`.\n\nfunction AlertTitleRender<C extends ElementType = 'h2'>(\n  { children, className, component, id, ...rest }: AlertTitleProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'h2'\n  const generatedId = useId()\n  const nodeRef = useAlertPart('title')\n  const forkedRef = useForkedRef(ref, nodeRef)\n\n  return (\n    <Component\n      className={classNames('alert-title', className)}\n      id={id ?? generatedId}\n      {...rest}\n      ref={forkedRef}\n    >\n      {children}\n    </Component>\n  )\n}\n\nexport const AlertTitle = createPolymorphicComponent<AlertTitleComponent>(\n  AlertTitleRender as ForwardRefRenderFunction<Element, AlertTitleProps<ElementType>>,\n  'AlertTitle'\n)\n"],"mappings":"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"}

package/dist/chunks/autocomplete-Baf9VSHN.js

@@ -0,0 +1,2 @@
+import"./focus-ring-SR_LwaN7.js";import{t as e}from"./useForkedRef-DVEfT-KI.js";import{t}from"./Portal-CgeR1WXV.js";import{r as ee}from"./useFloatingOverlay-DLIvwx-8.js";import{t as te}from"./useFormField-BOqmBTC4.js";import{i as ne,r as re,t as n}from"./overlayPlacement-BtS90IVf.js";import{a as r,i,n as a,r as o,t as s}from"./ComboboxListBox-Cm3L1ULl.js";import{t as ie}from"./renderFormField-Brkw1yA6.js";import c,{forwardRef as l,useEffect as u,useMemo as d,useRef as f}from"react";import p from"classnames";import{mergeProps as m,useButton as h,useComboBox as g,useFilter as _,useOverlayPosition as v}from"react-aria";import{useComboBoxState as y}from"react-stately";const b=e=>null;b.displayName=`AutocompleteGroup`;const x=e=>null;x.displayName=`AutocompleteItem`;const S=e=>{if(e!==void 0)return e===null?[]:Array.isArray(e)?e:[e]},C=e=>e==null?[]:Array.isArray(e)?e:[e],w=l(function({children:l,className:w,defaultValue:ae,disabled:T,help:E,id:oe,invalid:D,invalidFeedback:O,items:k,label:A,multiple:j=!1,name:M,noResultsText:N=`No results found`,onChange:P,placeholder:F,searchPlaceholder:I,size:L,valid:R,validFeedback:z,value:B,...V},H){let U=d(()=>k?o(k):a(l,{Group:b,Item:x}),[k,l]),W=d(()=>r(U),[U]),{contains:G}=_({sensitivity:`base`}),K=y({children:i,defaultItems:U,disabledKeys:W,defaultFilter:G,selectionMode:j?`multiple`:`single`,defaultValue:S(ae),value:S(B),onChange:e=>{let t=C(e);P?.(j?t:t[0]??null)},allowsEmptyCollection:!0,menuTrigger:`manual`}),q=f(null),se=e(H,q),J=f(null),Y=f(null),X=f(null),{describedBy:ce,feedbackId:le,helpId:ue,inputId:de,labelId:fe,labelledBy:Z}=te({ariaDescribedBy:V[`aria-describedby`],ariaLabelledBy:V[`aria-labelledby`],help:E,id:oe,invalid:D,invalidFeedback:O,label:A,valid:R,validFeedback:z}),{buttonProps:pe,inputProps:me,listBoxProps:he}=g({"aria-label":V[`aria-label`],"aria-labelledby":Z,buttonRef:q,id:de,inputRef:J,listBoxRef:Y,popoverRef:X,isDisabled:T,placeholder:I},K),{buttonProps:ge}=h({...pe,elementType:`div`,isDisabled:T,excludeFromTabOrder:!1},q),Q=f(K.isOpen);u(()=>{K.isOpen&&!Q.current?J.current?.focus():!K.isOpen&&Q.current&&q.current?.focus(),Q.current=K.isOpen},[K.isOpen]),u(()=>{if(!K.isOpen)return;let e=q.current;for(;e&&e!==document.body;)e.removeAttribute(`aria-hidden`),e=e.parentElement},[K.isOpen]);let{overlayProps:_e,placement:ve}=v({targetRef:q,overlayRef:X,placement:ne(`bottom-start`),offset:2,isOpen:K.isOpen,onClose:null}),ye=ee({close:K.close,isOpen:K.isOpen,triggerRef:q}),{menuStyle:be,placementAttr:xe}=re(_e.style,`bottom-start`,ve),Se={...n,...be},Ce=e=>K.selectionManager.toggleSelection(e),we=m(me,{onKeyDown:e=>{if(!j||e.key!==`Backspace`||e.currentTarget.value!==``)return;let t=K.selectedItems[K.selectedItems.length-1];t&&Ce(t.key)}}),$=K.selectedItems.length>0,Te=$?K.selectedItems.length===1?K.selectedItems[0]?.textValue??``:`${K.selectedItems.length} selected`:F;return ie({children:c.createElement(c.Fragment,null,c.createElement(`div`,{className:p(`form-input`,`combobox`,{sm:L===`sm`,lg:L===`lg`,disabled:T},{"is-invalid":D,"is-valid":R},w),...V,...ge,"aria-label":V[`aria-label`],"aria-labelledby":Z,"aria-describedby":ce,"aria-invalid":D||void 0,ref:se},c.createElement(`span`,{className:p(`combobox-value`,{"combobox-placeholder":!$})},Te)),c.createElement(t,{container:ye},c.createElement(`div`,{className:p(`menu`,{show:K.isOpen}),"data-cx-placement":xe,style:Se,hidden:!K.isOpen,ref:X},c.createElement(`div`,{className:`combobox-search`},c.createElement(`input`,{autoComplete:`off`,className:`form-input combobox-search-input sm`,...we,ref:J})),c.createElement(s,{state:K,listBoxProps:he,listBoxRef:Y}),K.collection.size===0&&c.createElement(`div`,{className:`combobox-no-results`},N))),M&&(j?C(K.value).map(e=>c.createElement(`input`,{key:e,type:`hidden`,name:M,value:e,disabled:T})):c.createElement(`input`,{type:`hidden`,name:M,value:C(K.value)[0]??``,disabled:T}))),help:E,ids:{feedback:le,help:ue,label:fe},invalid:D,invalidFeedback:O,label:A,valid:R,validFeedback:z})});w.displayName=`Autocomplete`;export{x as n,b as r,w as t};
+//# sourceMappingURL=autocomplete-Baf9VSHN.js.map

package/dist/chunks/autocomplete-Baf9VSHN.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"autocomplete-Baf9VSHN.js","names":[],"sources":["../../src/components/autocomplete/AutocompleteGroup.tsx","../../src/components/autocomplete/AutocompleteItem.tsx","../../src/components/autocomplete/Autocomplete.tsx"],"sourcesContent":["import { ComboboxGroupProps } from '../combobox/ComboboxGroup'\n\n// Same shape as `ComboboxGroupProps` — see `AutocompleteItemProps` for why this is its own\n// named type instead of a re-export.\nexport type AutocompleteGroupProps = ComboboxGroupProps\n\n// `AutocompleteGroup` is never actually mounted — like `ComboboxGroup`, it's read as data by\n// `Autocomplete`, which splits its top-level children into groups (wrapping react-stately\n// `Section` nodes) and bare items. Groups and bare items can be mixed at the top level:\n//\n//   <Autocomplete aria-label=\"Language\">\n//     <AutocompleteGroup label=\"Frontend\">\n//       <AutocompleteItem id=\"html\">HTML</AutocompleteItem>\n//       <AutocompleteItem id=\"css\">CSS</AutocompleteItem>\n//     </AutocompleteGroup>\n//     <AutocompleteItem id=\"python\">Python</AutocompleteItem>\n//   </Autocomplete>\nexport const AutocompleteGroup = (_props: AutocompleteGroupProps): null => null\n\nAutocompleteGroup.displayName = 'AutocompleteGroup'\n","import { ComboboxItemProps } from '../combobox/ComboboxItem'\n\n// Same shape as `ComboboxItemProps` — kept as its own named type (rather than re-exporting\n// `ComboboxItemProps` directly) so `Autocomplete`'s public API doesn't leak an unrelated\n// component's prop type, even though the two are structurally identical under the hood.\nexport type AutocompleteItemProps = ComboboxItemProps\n\n// `AutocompleteItem` is never actually mounted — like `ComboboxItem`, it's read as data by\n// `Autocomplete`, which builds react-aria's listbox collection from each item's `id` and\n// `children`. This keeps the public authoring shape as plain composed JSX:\n//\n//   <Autocomplete aria-label=\"Fruit\">\n//     <AutocompleteItem id=\"apple\">Apple</AutocompleteItem>\n//     <AutocompleteItem id=\"banana\">Banana</AutocompleteItem>\n//   </Autocomplete>\nexport const AutocompleteItem = (_props: AutocompleteItemProps): null => null\n\nAutocompleteItem.displayName = 'AutocompleteItem'\n","import React, {\n  forwardRef,\n  HTMLAttributes,\n  InputHTMLAttributes,\n  ReactNode,\n  useEffect,\n  useMemo,\n  useRef\n} from 'react'\nimport classNames from 'classnames'\nimport { mergeProps, useButton, useComboBox, useFilter, useOverlayPosition } from 'react-aria'\nimport { Key, useComboBoxState } from 'react-stately'\n\nimport { useFloatingOverlay, useForkedRef, useFormField } from '../../hooks'\nimport {\n  buildEntriesFromChildren,\n  buildEntriesFromItemsDef,\n  ComboboxEntry,\n  comboboxCollectionChildren,\n  getDisabledKeys\n} from '../../utils/comboboxCollection'\nimport {\n  COMBOBOX_MENU_OVERLAY_STYLE,\n  resolveMenuOverlayPositioning,\n  toAriaPlacement\n} from '../../utils/overlayPlacement'\nimport { Portal } from '../portal/Portal'\nimport { ComboboxListBox } from '../combobox/ComboboxListBox'\nimport { renderFormField } from '../form-field/renderFormField'\nimport { MenuItemsDef } from '../menu/MenuItemDef'\nimport { AutocompleteGroup } from './AutocompleteGroup'\nimport { AutocompleteItem } from './AutocompleteItem'\n\n// `useComboBoxState`/`useComboBox` are generic over a `SelectionMode` ('single' | 'multiple')\n// that only affects *types* — actual runtime behavior (whether a selection closes the menu,\n// disallows an empty selection, *and* whether `state.value`/`onChange`'s callback argument come\n// through as a bare `Key` or a `Key[]`) is driven entirely by the `selectionMode` *string* passed\n// at the call site below, not by this type parameter. Fixing the parameter at `'multiple'` here\n// (the more permissive of the two shapes) lets one component serve both modes without a full\n// code fork, but it means the type system's claim that `state.value`/`onChange`'s argument are\n// always `Key[]` is untrustworthy for single-select at runtime — confirmed by testing (the\n// naive `keys[0]` on a bare string key silently returned its first *character*). `asKeyArray`\n// normalizes either shape; every read of `state.value` or `onChange`'s argument goes through it.\nconst toMultiValue = (value: Key | Key[] | null | undefined): Key[] | undefined => {\n  if (value === undefined) return undefined\n  if (value === null) return []\n  return Array.isArray(value) ? value : [value]\n}\n\nconst asKeyArray = (value: unknown): Key[] => {\n  if (value == null) return []\n  return Array.isArray(value) ? value : [value as Key]\n}\n\nexport interface AutocompleteProps extends Omit<\n  HTMLAttributes<HTMLDivElement>,\n  'onChange' | 'defaultValue'\n> {\n  /**\n   * An accessible label for the autocomplete, used when there's no visible `<label>`.\n   */\n  'aria-label'?: string\n  /**\n   * Identifies a visible `<label>` element for the autocomplete.\n   */\n  'aria-labelledby'?: string\n  /**\n   * `AutocompleteItem` elements, optionally wrapped in `AutocompleteGroup` — read as data by\n   * `Autocomplete` to build the option list. Not rendered directly. Ignored when `items` is set.\n   */\n  children?: ReactNode\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * The initial selected option's id(s) (uncontrolled). An array when `multiple` is set.\n   */\n  defaultValue?: Key | Key[] | null\n  /**\n   * Prevents the autocomplete from being focused or interacted with.\n   */\n  disabled?: boolean\n  /**\n   * A description for the field, rendered below the autocomplete.\n   */\n  help?: ReactNode\n  /**\n   * `id` forwarded to the search input inside the popover. The toggle — the field's real,\n   * always-focusable surface — has no single labelable element `<label for>` can target (it's a\n   * `role=\"button\"` `<div>`, and the search input itself is hidden until open), so `label` is\n   * associated via `aria-labelledby` on the toggle instead. See FORMS.md's \"role=group\" pattern.\n   */\n  id?: string\n  /**\n   * Set component validation state to invalid.\n   */\n  invalid?: boolean\n  /**\n   * An error message for the field, rendered below the autocomplete when `invalid` is set.\n   */\n  invalidFeedback?: ReactNode\n  /**\n   * Array of item/header/divider definitions for data-driven rendering. When provided, children\n   * are ignored. A `'header'` entry starts a group that all following items join until the next\n   * header or the end of the array. `'divider'` entries are a no-op here — use\n   * `AutocompleteGroup` composition instead if you need finer control over grouping. An entry's\n   * `href`/`onClick` are `Menu`-only and are not read here — use `onChange` to react to the\n   * selection instead.\n   */\n  items?: MenuItemsDef\n  /**\n   * The field's caption, rendered as a `FormLabel` associated with the toggle.\n   */\n  label?: ReactNode\n  /**\n   * Allows more than one option to be selected. The toggle shows the single selection's label,\n   * or an \"N selected\" count once more than one is picked. The menu stays open after each\n   * selection, and `Backspace` in the empty search field removes the last selected option.\n   */\n  multiple?: boolean\n  /**\n   * `name` of auto-created hidden input(s), kept in sync with the selection, for native form\n   * submission. Single-select renders one; `multiple` renders one per selected key. Omit to skip\n   * hidden-input creation.\n   */\n  name?: string\n  /**\n   * Text shown in the listbox when no options match the current query.\n   */\n  noResultsText?: ReactNode\n  /**\n   * Callback fired when the selection changes. Receives an array of keys when `multiple` is set.\n   */\n  onChange?: (value: Key | Key[] | null) => void\n  /**\n   * Text shown on the toggle when nothing is selected.\n   */\n  placeholder?: string\n  /**\n   * Placeholder for the search field inside the dropdown.\n   */\n  searchPlaceholder?: string\n  /**\n   * Size the component sm or lg.\n   */\n  size?: 'sm' | 'lg'\n  /**\n   * Set component validation state to valid.\n   */\n  valid?: boolean\n  /**\n   * A success message for the field, rendered below the autocomplete when `valid` is set.\n   */\n  validFeedback?: ReactNode\n  /**\n   * The selected option's id(s) (controlled). An array when `multiple` is set.\n   */\n  value?: Key | Key[] | null\n}\n\n// `Autocomplete` implements chassis-css's button-trigger combobox — a display-only toggle\n// (not a text input) that opens a `.menu` containing its own search field, matching\n// https://chassis-ui.com/css/docs/forms/combobox/#search-field. This is deliberately NOT the\n// same composition as `Combobox` (whose text input *is* the trigger): here, react-aria's\n// `useComboBox` is given a separate `buttonRef` — a first-class option the hook supports\n// specifically for this \"button opens a listbox with its own input\" shape — so the real\n// `role=\"combobox\"` input lives inside the popover (styled as `.combobox-search-input`) while a\n// toggle serves as the always-visible, always-focusable trigger. The toggle is a `<div\n// role=\"button\">` (via `useButton`'s `elementType: 'div'`, the same pattern `Button.tsx` uses\n// for a non-native trigger) rather than a real `<button>` — an earlier version rendered\n// removable chips inside it for `multiple` mode, which a real (or ARIA) button can't legally\n// contain per axe's `nested-interactive` check; that's now plain \"N selected\" text instead (see\n// `triggerText` below), but the `<div>` stays since reverting buys little and this is proven.\n// `useComboBox`'s own `buttonProps` also sets `excludeFromTabOrder: true` by default — correct\n// for its usual \"auxiliary button beside an always-visible input\" composition, wrong here since\n// the toggle is the *only* focusable surface before opening; overridden back to reachable below.\n// The ref goes to the toggle, the `.combobox` element, as `Combobox`'s goes to its own.\nexport const Autocomplete = forwardRef<HTMLDivElement, AutocompleteProps>(function Autocomplete(\n  {\n    children,\n    className,\n    defaultValue,\n    disabled,\n    help,\n    id,\n    invalid,\n    invalidFeedback,\n    items,\n    label,\n    multiple = false,\n    name,\n    noResultsText = 'No results found',\n    onChange,\n    placeholder,\n    searchPlaceholder,\n    size,\n    valid,\n    validFeedback,\n    value,\n    ...rest\n  },\n  ref\n) {\n  // `entries`/`disabledKeys` only need to change when the data driving them does — without this,\n  // both re-derive from scratch on every render, including every keystroke while typing.\n  const entries = useMemo(\n    () =>\n      items\n        ? buildEntriesFromItemsDef(items)\n        : buildEntriesFromChildren(children, { Group: AutocompleteGroup, Item: AutocompleteItem }),\n    [items, children]\n  )\n  const disabledKeys = useMemo(() => getDisabledKeys(entries), [entries])\n\n  // Case- and accent-insensitive substring matching, mirroring chassis-css's own\n  // always-case-insensitive combobox.js filtering.\n  const { contains } = useFilter({ sensitivity: 'base' })\n\n  const state = useComboBoxState<ComboboxEntry, 'multiple'>({\n    children: comboboxCollectionChildren,\n    defaultItems: entries,\n    disabledKeys,\n    defaultFilter: contains,\n    // Cast: the actual runtime string ('single' or 'multiple') is what drives behavior — see the\n    // `toMultiValue` comment above for why the *type* parameter above is fixed at 'multiple'.\n    selectionMode: (multiple ? 'multiple' : 'single') as 'multiple',\n    defaultValue: toMultiValue(defaultValue),\n    value: toMultiValue(value),\n    onChange: (keys) => {\n      const keyArray = asKeyArray(keys)\n      onChange?.(multiple ? keyArray : (keyArray[0] ?? null))\n    },\n    allowsEmptyCollection: true,\n    // Opening is driven only by the toggle (see `buttonProps` below) — there's no input to focus\n    // or type into until the panel is already open, so 'input'/'focus' triggers (the hook's\n    // defaults, meant for `Combobox`'s text-input trigger) don't apply here.\n    menuTrigger: 'manual'\n  })\n\n  const triggerRef = useRef<HTMLDivElement>(null)\n  const forkedTriggerRef = useForkedRef(ref, triggerRef)\n  const inputRef = useRef<HTMLInputElement>(null)\n  const listBoxRef = useRef<HTMLElement>(null)\n  const popoverRef = useRef<HTMLDivElement>(null)\n\n  const { describedBy, feedbackId, helpId, inputId, labelId, labelledBy } = useFormField({\n    ariaDescribedBy: rest['aria-describedby'],\n    ariaLabelledBy: rest['aria-labelledby'],\n    help,\n    id,\n    invalid,\n    invalidFeedback,\n    label,\n    valid,\n    validFeedback\n  })\n\n  const { buttonProps, inputProps, listBoxProps } = useComboBox<ComboboxEntry, 'multiple'>(\n    {\n      'aria-label': rest['aria-label'],\n      'aria-labelledby': labelledBy,\n      buttonRef: triggerRef,\n      id: inputId,\n      inputRef,\n      listBoxRef,\n      popoverRef,\n      isDisabled: disabled,\n      placeholder: searchPlaceholder\n    },\n    state\n  )\n\n  // `useComboBox`'s own `buttonProps` sets `excludeFromTabOrder: true` — correct for its\n  // intended composition (an auxiliary icon button *next to* an already-focusable, always-\n  // visible input, e.g. a date picker's calendar-icon trigger), where the input is expected to\n  // be the primary tab stop. That doesn't hold here: the input lives inside the popover, `hidden`\n  // (and so untabbable) until opened, and this toggle is the *only* focusable surface before\n  // that — leaving `excludeFromTabOrder` in place would make the whole control unreachable by\n  // keyboard. Overriding it back to `false` is what actually makes the toggle the tab stop.\n  const { buttonProps: triggerButtonProps } = useButton(\n    { ...buttonProps, elementType: 'div', isDisabled: disabled, excludeFromTabOrder: false },\n    triggerRef\n  )\n\n  // The search field autofocuses once the panel is actually open (chassis-css docs: \"When the\n  // menu opens, focus jumps to the search field\"), and focus returns to the toggle once it\n  // closes — `useComboBox` only knows about `inputRef` as its focus target, and that input is\n  // `hidden` (via the panel) while closed, so without this, closing (via Escape, selection, or\n  // outside click) would drop focus entirely instead of landing back on the toggle.\n  const wasOpen = useRef(state.isOpen)\n  useEffect(() => {\n    if (state.isOpen && !wasOpen.current) {\n      inputRef.current?.focus()\n    } else if (!state.isOpen && wasOpen.current) {\n      triggerRef.current?.focus()\n    }\n    wasOpen.current = state.isOpen\n  }, [state.isOpen])\n\n  // `useComboBox` also runs react-aria's `ariaHideOutside` while open, to keep background\n  // content out of screen readers' way — but it only knows to protect `inputRef`/`popoverRef`\n  // (the elements it was given), not this separate toggle, so the toggle (and, in `multiple`\n  // mode, its chips and their focusable remove buttons) would otherwise get `aria-hidden`\n  // applied to it too while the panel is open. Walking up to `document.body` (rather than\n  // clearing just `triggerRef.current` itself) matters now that the popover portals there too\n  // (see `useFloatingOverlay` below): `ariaHideOutside` hides the *first* ancestor level whose\n  // subtree contains no protected element, which — once the toggle and the popover no longer\n  // share a common non-`body` container — can land on one of the toggle's own ancestors instead\n  // of the toggle element itself. `ariaHideOutside`'s own doc comment says it watches for *new*\n  // elements to hide, not attribute changes on existing ones, so removing it here (in an effect\n  // that necessarily runs after react-aria's own — declared later in this same component)\n  // doesn't get silently re-applied.\n  useEffect(() => {\n    if (!state.isOpen) return\n    let node: HTMLElement | null = triggerRef.current\n    while (node && node !== document.body) {\n      node.removeAttribute('aria-hidden')\n      node = node.parentElement\n    }\n  }, [state.isOpen])\n\n  const { overlayProps, placement: resolvedPlacement } = useOverlayPosition({\n    targetRef: triggerRef,\n    overlayRef: popoverRef,\n    placement: toAriaPlacement('bottom-start'),\n    offset: 2,\n    isOpen: state.isOpen,\n    // Leaving `onClose` unset (`undefined`) doesn't actually disable react-aria's close-on-scroll\n    // listener — only an explicit `null` does (`useCloseOnScroll` only early-returns on\n    // `onClose === null`, not falsy). It happens to be a no-op today only because this toggle is\n    // never registered in react-aria's `useOverlayTrigger`/`onCloseMap` backward-compat map (this\n    // component calls `useComboBox`, not `useOverlayTrigger`) — an incidental, not guaranteed,\n    // safety net. Passing `null` here makes the opt-out explicit, matching `Menu`/`Popover`.\n    onClose: null\n  })\n\n  // Portals the panel to `document.body` (or an enclosing open `<dialog>`) instead of rendering\n  // it inline, matching `Popover`/`Tooltip`/`Combobox` — an inline-rendered panel gets clipped by\n  // any ancestor with `overflow: hidden`/`auto` (a `ModalBody`, a scrollable card, a table cell),\n  // and `Autocomplete` is commonly composed inside exactly those. See\n  // `COMBOBOX_MENU_OVERLAY_STYLE` for the styling this trades away by leaving the DOM position\n  // `.combobox + .menu` relies on.\n  const portalContainer = useFloatingOverlay({\n    close: state.close,\n    isOpen: state.isOpen,\n    triggerRef\n  })\n\n  const { menuStyle, placementAttr } = resolveMenuOverlayPositioning(\n    overlayProps.style,\n    'bottom-start',\n    resolvedPlacement\n  )\n  const overlayStyle: React.CSSProperties = { ...COMBOBOX_MENU_OVERLAY_STYLE, ...menuStyle }\n\n  const removeSelected = (key: Key) => state.selectionManager.toggleSelection(key)\n\n  // Backspace-removes-last-chip only touches the search field's own keydown handling — no\n  // nested interactive element needed for it, unlike a rendered \"remove\" button would be (see\n  // the trigger's `combobox-value` text below for why that path was dropped).\n  const handleSearchKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (!multiple || event.key !== 'Backspace' || event.currentTarget.value !== '') return\n    const last = state.selectedItems[state.selectedItems.length - 1]\n    if (last) removeSelected(last.key)\n  }\n\n  const inputHtmlProps = mergeProps(inputProps, {\n    onKeyDown: handleSearchKeyDown\n  }) as InputHTMLAttributes<HTMLInputElement>\n\n  const hasSelection = state.selectedItems.length > 0\n  // Matches chassis-css's own vanilla multi-select combobox: the toggle shows the single\n  // selected item's label, or \"N selected\" once more than one is picked — deliberately plain\n  // text, not per-item chips with their own remove buttons. An earlier version rendered chips\n  // here; that failed a real axe check (\"Interactive controls must not be nested\") because the\n  // toggle is itself `role=\"button\"`, and a button can't correctly contain other focusable\n  // controls. Deselecting an option is still possible by clicking it again in the open list\n  // (native to `useComboBoxState`'s multiple-selection toggle behavior) or via Backspace in the\n  // search field, just not from the toggle itself.\n  const triggerText = !hasSelection\n    ? placeholder\n    : state.selectedItems.length === 1\n      ? (state.selectedItems[0]?.textValue ?? '')\n      : `${state.selectedItems.length} selected`\n\n  return renderFormField({\n    children: (\n      <>\n        <div\n          className={classNames(\n            'form-input',\n            'combobox',\n            { sm: size === 'sm', lg: size === 'lg', disabled },\n            { 'is-invalid': invalid, 'is-valid': valid },\n            className\n          )}\n          {...rest}\n          {...triggerButtonProps}\n          // `useComboBox`'s own `buttonProps` defaults to a generic \"Show suggestions\" label,\n          // since its primary a11y attention goes to the search input — override with the same\n          // label the input gets, so the toggle (the element actually reachable via Tab, since\n          // the input is hidden until open) announces the field's real name, matching the\n          // vanilla docs' own `aria-label=\"Select a country\"` on the toggle button.\n          aria-label={rest['aria-label']}\n          aria-labelledby={labelledBy}\n          aria-describedby={describedBy}\n          aria-invalid={invalid || undefined}\n          ref={forkedTriggerRef}\n        >\n          <span className={classNames('combobox-value', { 'combobox-placeholder': !hasSelection })}>\n            {triggerText}\n          </span>\n        </div>\n        <Portal container={portalContainer}>\n          <div\n            className={classNames('menu', { show: state.isOpen })}\n            data-cx-placement={placementAttr}\n            style={overlayStyle}\n            hidden={!state.isOpen}\n            ref={popoverRef}\n          >\n            <div className=\"combobox-search\">\n              <input\n                autoComplete=\"off\"\n                className=\"form-input combobox-search-input sm\"\n                {...inputHtmlProps}\n                ref={inputRef}\n              />\n            </div>\n            <ComboboxListBox state={state} listBoxProps={listBoxProps} listBoxRef={listBoxRef} />\n            {state.collection.size === 0 && (\n              <div className=\"combobox-no-results\">{noResultsText}</div>\n            )}\n          </div>\n        </Portal>\n        {name &&\n          (multiple ? (\n            asKeyArray(state.value).map((key) => (\n              <input key={key} type=\"hidden\" name={name} value={key} disabled={disabled} />\n            ))\n          ) : (\n            <input\n              type=\"hidden\"\n              name={name}\n              value={asKeyArray(state.value)[0] ?? ''}\n              disabled={disabled}\n            />\n          ))}\n      </>\n    ),\n    help,\n    // No `input` id: the toggle is a `role=\"button\"` `<div>`, not a labelable element, so\n    // `htmlFor` can't target it — `aria-labelledby={labelledBy}` on the toggle above (fed by\n    // `labelId`) is what actually associates the label, matching DatePicker/OtpInput's\n    // `role=\"group\"` pattern in FORMS.md. Passing `inputId` here would point `<label for>` at\n    // the hidden search input instead, which sits inert until the popover opens.\n    ids: { feedback: feedbackId, help: helpId, label: labelId },\n    invalid,\n    invalidFeedback,\n    label,\n    valid,\n    validFeedback\n  })\n})\n\nAutocomplete.displayName = 'Autocomplete'\n"],"mappings":"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"}

package/dist/chunks/avatar-S3dGy6Qc.js

@@ -0,0 +1,2 @@
+import"./focus-ring-SR_LwaN7.js";import{d as e,f as t,g as n,p as r}from"./slot-CNhFZdHF.js";import{t as i}from"./polymorphic-BhGNZQja.js";import{t as a}from"./Link-CZsWCnQb.js";import{t as o}from"./badge-D2oztCvs.js";import{t as s}from"./VisuallyHidden-C2dM7HhC.js";import c,{forwardRef as l}from"react";import u from"classnames";const d=l(({className:e,...t},n)=>{let r=u(`avatar-image`,e);return c.createElement(`img`,{className:r,...t,ref:n})});d.displayName=`AvatarImage`;function f({children:i,className:l,color:f,disabled:p,smooth:m,size:h,component:g,src:_,alt:v=`Profile picture`,href:y,status:b,statusLabel:x,...S},C){let w=r(g,y,`span`),T=n(w,y,S),E=t(T),D=u(`avatar`,f,h,{smooth:m},!E&&{disabled:p},l),O=E?a:w;return c.createElement(O,{className:D,...E&&{component:w},...(E||T===`component`)&&{disabled:p},...e(T,y,`Avatar`),...T===`button`&&{type:`button`},...S,ref:C},_?c.createElement(d,{src:_,alt:v}):i,b&&c.createElement(o,{color:b,circle:!0},c.createElement(s,null,x??b)))}const p=i(f,`Avatar`);function m({children:e,className:t,component:n,items:r,size:i,...a},o){let s=n??`div`,l=u(`avatar-stack`,i,t);return c.createElement(s,{className:l,...a,ref:o},r?.map(({key:e,content:t,...n},r)=>c.createElement(p,{key:e??r,...n},t)),e)}const h=i(m,`AvatarStack`);export{p as n,d as r,h as t};
+//# sourceMappingURL=avatar-S3dGy6Qc.js.map

package/dist/chunks/avatar-S3dGy6Qc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"avatar-S3dGy6Qc.js","names":[],"sources":["../../src/components/avatar/AvatarImage.tsx","../../src/components/avatar/Avatar.tsx","../../src/components/avatar/AvatarStack.tsx"],"sourcesContent":["import React, { forwardRef, ImgHTMLAttributes } from 'react'\nimport classNames from 'classnames'\n\nexport interface AvatarImageProps extends ImgHTMLAttributes<HTMLImageElement> {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n}\n\nexport const AvatarImage = forwardRef<HTMLImageElement, AvatarImageProps>(\n  ({ className, ...rest }, ref) => {\n    const _className = classNames('avatar-image', className)\n\n    return <img className={_className} {...rest} ref={ref} />\n  }\n)\n\nAvatarImage.displayName = 'AvatarImage'\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport { ContextColor, ExtendedSizing } from '../../types'\nimport { hrefProps, isInteractiveKind, linkElement, resolveLinkKind } from '../../utils/elementKind'\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef,\n  PolymorphicRefWithFallback\n} from '../../utils/polymorphic'\nimport { Link } from '../link/Link'\nimport { Badge } from '../badge'\nimport { AvatarImage } from './AvatarImage'\nimport { VisuallyHidden } from '../visually-hidden/VisuallyHidden'\n\ntype AvatarOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Sets the color of the component to one of Chassis context colors.\n   */\n  color?: ContextColor\n  /**\n   * Toggle the disabled state for the component. Only applies when `component` is `a` or `button`.\n   */\n  disabled?: boolean\n  /**\n   * Renders the smooth (tinted background) context variant instead of the solid default.\n   */\n  smooth?: boolean\n  /**\n   * Sets the size of the component to one of Chassis component sizes.\n   */\n  size?: ExtendedSizing\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   * Defaults to `span`, or `a` when `href` is set. Set explicitly to `button` (or another\n   * interactive element/component) to make a non-link avatar focusable and clickable.\n   */\n  component?: C\n  /**\n   * Image source. When set, renders an `AvatarImage` in place of `children`.\n   */\n  src?: string\n  /**\n   * Alt text for the image rendered when `src` is set.\n   */\n  alt?: string\n  /**\n   * Renders the avatar as a link to this URL. Defaults `component` to `a`. Passed through to a\n   * custom `component` too, regardless of whether it resolves to a native `a`/`button`.\n   */\n  href?: string\n  /**\n   * Renders a status badge in the bottom-end corner, in one of the Chassis themed colors.\n   */\n  status?: ContextColor\n  /**\n   * Accessible label for the status badge, exposed to assistive tech as visually hidden text.\n   * Falls back to the `status` value itself.\n   */\n  statusLabel?: string\n}\n\nexport type AvatarProps<C extends ElementType = 'span'> = PolymorphicComponentProps<\n  C,\n  AvatarOwnProps<C>\n>\n\ntype AvatarComponent = (<C extends ElementType = 'span'>(\n  props: AvatarProps<C> & {\n    ref?: PolymorphicRefWithFallback<C, HTMLSpanElement | HTMLAnchorElement>\n  }\n) => ReactElement | null) & { displayName?: string }\n\nfunction AvatarRender<C extends ElementType = 'span'>(\n  {\n    children,\n    className,\n    color,\n    disabled,\n    smooth,\n    size,\n    component,\n    src,\n    alt = 'Profile picture',\n    href,\n    status,\n    statusLabel,\n    ...rest\n  }: AvatarProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  // `href` makes it an `<a>`, unless `component` or `asChild` chose the element (see\n  // `linkElement`).\n  const tag = linkElement(component, href, 'span')\n  // The kind rather than the tag, counting a router link with `href` or `to` as an anchor: under `asChild`, `tag` is a `Slot` standing in for the caller's\n  // element, and a slotted `<a>` is as interactive as `component=\"a\"`.\n  const kind = resolveLinkKind(tag, href, rest)\n  const isInteractive = isInteractiveKind(kind)\n\n  const _className = classNames(\n    'avatar',\n    color,\n    size,\n    { smooth },\n    !isInteractive && { disabled },\n    className\n  )\n\n  const Component = (isInteractive ? Link : tag) as ElementType\n\n  return (\n    <Component\n      className={_className}\n      {...(isInteractive && { component: tag })}\n      // `Link` handles `disabled` on an `<a>` or `<button>`, a router link included; any other\n      // component reference is trusted to. A plain tag has no `disabled` attribute and gets the\n      // class alone.\n      {...((isInteractive || kind === 'component') && { disabled })}\n      {...hrefProps(kind, href, 'Avatar')}\n      {...(kind === 'button' && { type: 'button' })}\n      {...rest}\n      ref={ref}\n    >\n      {src ? <AvatarImage src={src} alt={alt} /> : children}\n      {status && (\n        <Badge color={status} circle>\n          <VisuallyHidden>{statusLabel ?? status}</VisuallyHidden>\n        </Badge>\n      )}\n    </Component>\n  )\n}\n\nexport const Avatar = createPolymorphicComponent<AvatarComponent>(\n  AvatarRender as ForwardRefRenderFunction<Element, AvatarProps<ElementType>>,\n  'Avatar'\n)\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement, ReactNode } from 'react'\nimport classNames from 'classnames'\n\nimport { ContextColor, ExtendedSizing } from '../../types'\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\nimport { Avatar } from './Avatar'\n\nexport interface AvatarStackItemDef {\n  /**\n   * React key for the rendered `Avatar`. Falls back to the item's index in `data`.\n   */\n  key?: string | number\n  /**\n   * Image source, rendered via `AvatarImage`.\n   */\n  src?: string\n  /**\n   * Alt text for the image rendered when `src` is set.\n   */\n  alt?: string\n  /**\n   * Renders the avatar as a link to this URL.\n   */\n  href?: string\n  /**\n   * Renders a status badge in one of the Chassis themed colors.\n   */\n  status?: ContextColor\n  /**\n   * Accessible label for the status badge.\n   */\n  statusLabel?: string\n  /**\n   * Content to render when `src` isn't set, e.g. initials or a \"+5\" overflow count.\n   */\n  content?: ReactNode\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: ElementType\n}\n\ntype AvatarStackOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: C\n  /**\n   * Sets the size of every `Avatar` in the stack to one of Chassis component sizes.\n   */\n  size?: ExtendedSizing\n  /**\n   * Renders a `Avatar` for each item, ahead of any JSX `children` (handy for a trailing \"+N\"\n   * overflow avatar).\n   */\n  items?: AvatarStackItemDef[]\n}\n\nexport type AvatarStackProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  AvatarStackOwnProps<C>\n>\n\ntype AvatarStackComponent = (<C extends ElementType = 'div'>(\n  props: AvatarStackProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction AvatarStackRender<C extends ElementType = 'div'>(\n  { children, className, component, items, size, ...rest }: AvatarStackProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = (component ?? 'div') as ElementType\n  const _className = classNames('avatar-stack', size, className)\n\n  return (\n    <Component className={_className} {...rest} ref={ref}>\n      {items?.map(({ key, content, ...item }, index) => (\n        <Avatar key={key ?? index} {...item}>\n          {content}\n        </Avatar>\n      ))}\n      {children}\n    </Component>\n  )\n}\n\nexport const AvatarStack = createPolymorphicComponent<AvatarStackComponent>(\n  AvatarStackRender as ForwardRefRenderFunction<Element, AvatarStackProps<ElementType>>,\n  'AvatarStack'\n)\n"],"mappings":"2UAUA,MAAa,EAAc,GACxB,CAAE,YAAW,GAAG,GAAQ,IAAQ,CAC/B,IAAM,EAAa,EAAW,eAAgB,CAAS,EAEvD,OAAO,EAAA,cAAC,MAAD,CAAK,UAAW,EAAY,GAAI,EAAW,KAAM,CAAA,CAC1D,CACF,EAEA,EAAY,YAAc,cC4D1B,SAAS,EACP,CACE,WACA,YACA,QACA,WACA,SACA,OACA,YACA,MACA,MAAM,kBACN,OACA,SACA,cACA,GAAG,GAEL,EACA,CAGA,IAAM,EAAM,EAAY,EAAW,EAAM,MAAM,EAGzC,EAAO,EAAgB,EAAK,EAAM,CAAI,EACtC,EAAgB,EAAkB,CAAI,EAEtC,EAAa,EACjB,SACA,EACA,EACA,CAAE,QAAO,EACT,CAAC,GAAiB,CAAE,UAAS,EAC7B,CACF,EAEM,EAAa,EAAgB,EAAO,EAE1C,OACE,EAAA,cAAC,EAAD,CACE,UAAW,EACX,GAAK,GAAiB,CAAE,UAAW,CAAI,EAIvC,IAAM,GAAiB,IAAS,cAAgB,CAAE,UAAS,EAC3D,GAAI,EAAU,EAAM,EAAM,QAAQ,EAClC,GAAK,IAAS,UAAY,CAAE,KAAM,QAAS,EAC3C,GAAI,EACC,KAQI,EANR,EAAM,EAAA,cAAC,EAAD,CAAkB,MAAU,KAAM,CAAA,EAAI,EAC5C,GACC,EAAA,cAAC,EAAD,CAAO,MAAO,EAAQ,OAAA,EAEf,EADL,EAAA,cAAC,EAAA,KAAgB,GAAe,CAAuB,CAClD,CAEA,CAEf,CAEA,MAAa,EAAS,EACpB,EACA,QACF,EClEA,SAAS,EACP,CAAE,WAAU,YAAW,YAAW,QAAO,OAAM,GAAG,GAClD,EACA,CACA,IAAM,EAAa,GAAa,MAC1B,EAAa,EAAW,eAAgB,EAAM,CAAS,EAE7D,OACE,EAAA,cAAC,EAAD,CAAW,UAAW,EAAY,GAAI,EAAW,KAOtC,EANR,GAAO,KAAK,CAAE,MAAK,UAAS,GAAG,GAAQ,IACtC,EAAA,cAAC,EAAD,CAAQ,IAAK,GAAO,EAAO,GAAI,CAEvB,EADL,CACK,CACT,EACA,CACQ,CAEf,CAEA,MAAa,EAAc,EACzB,EACA,aACF"}

package/dist/chunks/{badge-Bj8mf8lu.js → badge-D2oztCvs.js}

@@ -1 +1,2 @@
-import"./focus-ring-SR_LwaN7.js";import{t as e}from"./polymorphic-CACPOv1_.js";import t from"react";import n from"classnames";function r({children:e,className:r,color:i,variant:a,component:o,position:s,circle:c,size:l,...u},d){let f=o??`span`,p=n(`badge`,i,l,{outline:a===`outline`,smooth:a===`smooth`,"position-absolute translate-middle":s,"top-0":s?.includes(`top`),"top-100":s?.includes(`bottom`),"start-100":s?.includes(`end`),"start-0":s?.includes(`start`)},{circle:c},r);return t.createElement(f,{className:p,...u,ref:d},e)}const i=e(r,`Badge`);export{i as t};
+import"./focus-ring-SR_LwaN7.js";import{t as e}from"./polymorphic-BhGNZQja.js";import t from"react";import n from"classnames";function r({children:e,className:r,color:i,variant:a,component:o,position:s,circle:c,size:l,...u},d){let f=o??`span`,p=n(`badge`,i,l,{outline:a===`outline`,smooth:a===`smooth`,"position-absolute translate-middle":s,"top-0":s?.includes(`top`),"top-100":s?.includes(`bottom`),"start-100":s?.includes(`end`),"start-0":s?.includes(`start`)},{circle:c},r);return t.createElement(f,{className:p,...u,ref:d},e)}const i=e(r,`Badge`);export{i as t};
+//# sourceMappingURL=badge-D2oztCvs.js.map

package/dist/chunks/badge-D2oztCvs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge-D2oztCvs.js","names":[],"sources":["../../src/components/badge/Badge.tsx"],"sourcesContent":["import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport { ContextColor, ContextStyle, Sizing } from '../../types'\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype BadgeOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Sets the color of the component to one of Chassis context colors.\n   */\n  color?: ContextColor\n  /**\n   * Sets the context style of the component. `solid`/`basic` render the default look with no extra class.\n   */\n  variant?: ContextStyle\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: C\n  /**\n   * Position badge in one of the corners of a link or button.\n   */\n  position?: 'top-start' | 'top-end' | 'bottom-end' | 'bottom-start'\n  /**\n   * Select the shape of the component.\n   */\n  circle?: boolean\n  /**\n   * Sets the size of the component to one of Chassis component sizes.\n   */\n  size?: Sizing\n}\n\nexport type BadgeProps<C extends ElementType = 'span'> = PolymorphicComponentProps<\n  C,\n  BadgeOwnProps<C>\n>\n\ntype BadgeComponent = (<C extends ElementType = 'span'>(\n  props: BadgeProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction BadgeRender<C extends ElementType = 'span'>(\n  {\n    children,\n    className,\n    color,\n    variant,\n    component,\n    position,\n    circle,\n    size,\n    ...rest\n  }: BadgeProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'span'\n\n  const _className = classNames(\n    'badge',\n    color,\n    size,\n    {\n      outline: variant === 'outline',\n      smooth: variant === 'smooth',\n      'position-absolute translate-middle': position,\n      'top-0': position?.includes('top'),\n      'top-100': position?.includes('bottom'),\n      'start-100': position?.includes('end'),\n      'start-0': position?.includes('start')\n    },\n    { circle },\n    className\n  )\n\n  return (\n    <Component className={_className} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const Badge = createPolymorphicComponent<BadgeComponent>(\n  BadgeRender as ForwardRefRenderFunction<Element, BadgeProps<ElementType>>,\n  'Badge'\n)\n"],"mappings":"8HAkDA,SAAS,EACP,CACE,WACA,YACA,QACA,UACA,YACA,WACA,SACA,OACA,GAAG,GAEL,EACA,CACA,IAAM,EAAY,GAAa,OAEzB,EAAa,EACjB,QACA,EACA,EACA,CACE,QAAS,IAAY,UACrB,OAAQ,IAAY,SACpB,qCAAsC,EACtC,QAAS,GAAU,SAAS,KAAK,EACjC,UAAW,GAAU,SAAS,QAAQ,EACtC,YAAa,GAAU,SAAS,KAAK,EACrC,UAAW,GAAU,SAAS,OAAO,CACvC,EACA,CAAE,QAAO,EACT,CACF,EAEA,OACE,EAAA,cAAC,EAAD,CAAW,UAAW,EAAY,GAAI,EAAW,KAEtC,EADR,CACQ,CAEf,CAEA,MAAa,EAAQ,EACnB,EACA,OACF"}

package/dist/chunks/{breadcrumb-DDxnx_iS.js → breadcrumb-s6J9itez.js}

@@ -1 +1,2 @@
-import"./focus-ring-SR_LwaN7.js";import{t as e}from"./Link-Cq7FNWpm.js";import t,{forwardRef as n}from"react";import r from"classnames";const i=n(({children:n,active:i,className:a,href:o,...s},c)=>{let l=r(`breadcrumb-item`,{active:i},a);return t.createElement(`li`,{className:l,...i&&{"aria-current":`page`},...s,ref:c},o?t.createElement(e,{href:o},n):n)});i.displayName=`BreadcrumbItem`;const a=n(({"aria-label":e=`breadcrumb`,children:n,className:a,items:o,...s},c)=>{let l=r(`breadcrumb`,a),u=o?o.map((e,n)=>{let r=n===o.length-1;return t.createElement(i,{key:n,active:r,href:r?void 0:e.href},e.label)}):null;return t.createElement(`nav`,{"aria-label":e},t.createElement(`ol`,{className:l,...s,ref:c},u??n))});a.displayName=`Breadcrumb`;export{i as n,a as t};
+import"./focus-ring-SR_LwaN7.js";import{t as e}from"./Link-CZsWCnQb.js";import t,{forwardRef as n}from"react";import r from"classnames";const i=n(({children:n,active:i,className:a,href:o,...s},c)=>{let l=r(`breadcrumb-item`,{active:i},a);return t.createElement(`li`,{className:l,...i&&{"aria-current":`page`},...s,ref:c},o?t.createElement(e,{href:o},n):n)});i.displayName=`BreadcrumbItem`;const a=n(({"aria-label":e=`breadcrumb`,children:n,className:a,items:o,...s},c)=>{let l=r(`breadcrumb`,a),u=o?o.map((e,n)=>{let r=n===o.length-1;return t.createElement(i,{key:n,active:r,href:r?void 0:e.href},e.label)}):null;return t.createElement(`nav`,{"aria-label":e},t.createElement(`ol`,{className:l,...s,ref:c},u??n))});a.displayName=`Breadcrumb`;export{i as n,a as t};
+//# sourceMappingURL=breadcrumb-s6J9itez.js.map

package/dist/chunks/breadcrumb-s6J9itez.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumb-s6J9itez.js","names":[],"sources":["../../src/components/breadcrumb/BreadcrumbItem.tsx","../../src/components/breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import React, { forwardRef, HTMLAttributes } from 'react'\nimport classNames from 'classnames'\n\nimport { Link } from '../link/Link'\n\nexport interface BreadcrumbItemProps extends HTMLAttributes<HTMLLIElement> {\n  /**\n   * Toggle the active state for the component.\n   */\n  active?: boolean\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * The `href` attribute for the inner `<Link>` component.\n   */\n  href?: string\n}\n\nexport const BreadcrumbItem = forwardRef<HTMLLIElement, BreadcrumbItemProps>(\n  ({ children, active, className, href, ...rest }, ref) => {\n    const _className = classNames(\n      'breadcrumb-item',\n      {\n        active: active\n      },\n      className\n    )\n    return (\n      <li className={_className} {...(active && { 'aria-current': 'page' })} {...rest} ref={ref}>\n        {href ? <Link href={href}>{children}</Link> : children}\n      </li>\n    )\n  }\n)\n\nBreadcrumbItem.displayName = 'BreadcrumbItem'\n","import React, { forwardRef, HTMLAttributes } from 'react'\nimport classNames from 'classnames'\n\nimport { BreadcrumbItem } from './BreadcrumbItem'\n\nexport interface BreadcrumbItemDef {\n  /**\n   * Label for the breadcrumb item.\n   */\n  label: React.ReactNode\n  /**\n   * URL for the breadcrumb link. The last item in the array is always rendered as active (no link needed).\n   */\n  href?: string\n}\n\nexport interface BreadcrumbProps extends HTMLAttributes<HTMLOListElement> {\n  /**\n   * Accessible name of the wrapping `<nav>` landmark. Defaults to the English `'breadcrumb'`;\n   * override it to translate the landmark, or to tell two breadcrumb trails on the same page\n   * apart (landmarks of the same role need distinct names to be distinguishable in a screen\n   * reader's landmark list).\n   *\n   * @default 'breadcrumb'\n   */\n  'aria-label'?: string\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Array of breadcrumb items for data-driven rendering. The last item is automatically marked active.\n   * When provided, children are ignored.\n   */\n  items?: BreadcrumbItemDef[]\n}\n\nexport const Breadcrumb = forwardRef<HTMLOListElement, BreadcrumbProps>(\n  ({ 'aria-label': ariaLabel = 'breadcrumb', children, className, items, ...rest }, ref) => {\n    const _className = classNames('breadcrumb', className)\n\n    const autoContent = items\n      ? items.map((item, idx) => {\n          const isLast = idx === items.length - 1\n          return (\n            <BreadcrumbItem\n              // eslint-disable-next-line react/no-array-index-key\n              key={idx}\n              active={isLast}\n              href={isLast ? undefined : item.href}\n            >\n              {item.label}\n            </BreadcrumbItem>\n          )\n        })\n      : null\n\n    return (\n      <nav aria-label={ariaLabel}>\n        <ol className={_className} {...rest} ref={ref}>\n          {autoContent ?? children}\n        </ol>\n      </nav>\n    )\n  }\n)\n\nBreadcrumb.displayName = 'Breadcrumb'\n"],"mappings":"wIAoBA,MAAa,EAAiB,GAC3B,CAAE,WAAU,SAAQ,YAAW,OAAM,GAAG,GAAQ,IAAQ,CACvD,IAAM,EAAa,EACjB,kBACA,CACU,QACV,EACA,CACF,EACA,OACE,EAAA,cAAC,KAAD,CAAI,UAAW,EAAY,GAAK,GAAU,CAAE,eAAgB,MAAO,EAAI,GAAI,EAAW,KAElF,EADD,EAAO,EAAA,cAAC,EAAD,CAAY,MAAsB,EAAf,CAAe,EAAI,CAC5C,CAER,CACF,EAEA,EAAe,YAAc,iBCA7B,MAAa,EAAa,GACvB,CAAE,aAAc,EAAY,aAAc,WAAU,YAAW,QAAO,GAAG,GAAQ,IAAQ,CACxF,IAAM,EAAa,EAAW,aAAc,CAAS,EAE/C,EAAc,EAChB,EAAM,KAAK,EAAM,IAAQ,CACvB,IAAM,EAAS,IAAQ,EAAM,OAAS,EACtC,OACE,EAAA,cAAC,EAAD,CAEE,IAAK,EACL,OAAQ,EACR,KAAM,EAAS,IAAA,GAAY,EAAK,IAGlB,EADb,EAAK,KACQ,CAEpB,CAAC,EACD,KAEJ,OACE,EAAA,cAAC,MAAD,CAAK,aAAY,CAIZ,EAHH,EAAA,cAAC,KAAD,CAAI,UAAW,EAAY,GAAI,EAAW,KAEtC,EADD,GAAe,CACd,CACD,CAET,CACF,EAEA,EAAW,YAAc"}

package/dist/chunks/breakpoints-CJ-498B7.d.ts

@@ -0,0 +1,7 @@
+//#region src/utils/breakpoints.d.ts
+type Span = 'auto' | number | string | boolean;
+type WidthSpan = 'auto' | number | string | boolean;
+type FlexDirection = 'row' | 'column';
+//#endregion
+export { Span as n, WidthSpan as r, FlexDirection as t };
+//# sourceMappingURL=breakpoints-CJ-498B7.d.ts.map

package/dist/chunks/breakpoints-o_2Ev7ir.js

@@ -1 +1,2 @@
-const e=[`sm`,`md`,`lg`,`xl`,`2xl`];function t(t,n,r){let i=r?e.filter(e=>r[e]).flatMap(e=>t(r[e],`${e}:`)):[];return[...t(n,``),...i]}const n=(e,t)=>[e&&`${t}flex-${e}`];export{n,t};
+const e=[`sm`,`md`,`lg`,`xl`,`2xl`];function t(t,n,r){let i=r?e.filter(e=>r[e]).flatMap(e=>t(r[e],`${e}:`)):[];return[...t(n,``),...i]}const n=(e,t)=>[e&&`${t}flex-${e}`];export{n,t};
+//# sourceMappingURL=breakpoints-o_2Ev7ir.js.map

package/dist/chunks/breakpoints-o_2Ev7ir.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breakpoints-o_2Ev7ir.js","names":[],"sources":["../../src/utils/breakpoints.ts"],"sourcesContent":["import { Breakpoint } from '../types'\n\n// Mobile-first ascending order. Every responsive layout prop (`Flex`/`Stack`/`Row`/`Col`/\n// `Skeleton`'s `responsive`) keys its overrides by these literal chassis-css breakpoint names.\nexport const BREAKPOINTS: Breakpoint[] = ['sm', 'md', 'lg', 'xl', '2xl']\n\n// A column span: a track count, `'auto'` for a natural-width track, or `true` for the bare (no\n// explicit width) case. `Col` maps it to the `col-{n}` / `col` classes of chassis-css's flexbox\n// grid, and the type goes when `Col` does.\nexport type Span = 'auto' | number | string | boolean\n\n// A width in twelfths of the parent: a count, `'auto'` for the natural width, or `true` to fill\n// the rest of a flex row. `Skeleton` maps it to chassis-css's width utilities. The same values as\n// `Span`, kept apart so the skeleton doesn't depend on a type of the flexbox grid.\nexport type WidthSpan = 'auto' | number | string | boolean\n\n/**\n * Builds the class list for a component's base layout plus per-breakpoint overrides supplied via\n * a `responsive` prop — the pattern shared by `Flex`, `Stack`, and (from Phase 2) `Row`/`Col`.\n *\n * `toClassNames` maps one breakpoint's layout value to class name fragments for a given prefix\n * (`''` for the base/unprefixed case, `` `${breakpoint}:` `` otherwise). Falsy entries in its\n * return value are fine — `classnames` drops them at the call site — so fields the layout object\n * doesn't set can just map to `undefined`/`false`.\n */\nexport function buildResponsiveClassNames<TLayout>(\n  toClassNames: (layout: TLayout, prefix: string) => Array<string | false | null | undefined>,\n  base: TLayout,\n  responsive?: Partial<Record<Breakpoint, TLayout>>\n): Array<string | false | null | undefined> {\n  const responsiveClassNames = responsive\n    ? BREAKPOINTS.filter((bp) => responsive[bp]).flatMap((bp) =>\n        toClassNames(responsive[bp] as TLayout, `${bp}:`)\n      )\n    : []\n\n  return [...toClassNames(base, ''), ...responsiveClassNames]\n}\n\nexport type FlexDirection = 'row' | 'column'\n\n// A `buildResponsiveClassNames` `toClassNames` fn for the `flex-row`/`flex-column` direction\n// toggle shared by `Card` and `CardBody`, both of which map a `direction` prop to the same\n// chassis-css class.\nexport const flexDirectionClassNames = (\n  direction: FlexDirection | undefined,\n  prefix: string\n): Array<string | false | undefined> => [direction && `${prefix}flex-${direction}`]\n"],"mappings":"AAIA,MAAa,EAA4B,CAAC,KAAM,KAAM,KAAM,KAAM,KAAK,EAqBvE,SAAgB,EACd,EACA,EACA,EAC0C,CAC1C,IAAM,EAAuB,EACzB,EAAY,OAAQ,GAAO,EAAW,EAAG,CAAC,CAAC,QAAS,GAClD,EAAa,EAAW,GAAgB,GAAG,EAAG,EAAE,CAClD,EACA,CAAC,EAEL,MAAO,CAAC,GAAG,EAAa,EAAM,EAAE,EAAG,GAAG,CAAoB,CAC5D,CAOA,MAAa,GACX,EACA,IACsC,CAAC,GAAa,GAAG,EAAO,OAAO,GAAW"}

package/dist/chunks/button-group-BGppPrIv.js

@@ -0,0 +1,2 @@
+import"./focus-ring-SR_LwaN7.js";import{t as e}from"./polymorphic-BhGNZQja.js";import t from"react";import n from"classnames";function r({children:e,className:r,component:i,size:a,vertical:o,...s},c){let l=i??`div`,u=n(o?`button-group-vertical`:`button-group`,a,r);return t.createElement(l,{className:u,...s,ref:c},e)}const i=e(r,`ButtonGroup`);function a({children:e,className:r,component:i,...a},o){let s=i??`div`,c=n(`button-toolbar`,r);return t.createElement(s,{className:c,...a,ref:o},e)}const o=e(a,`ButtonToolbar`);export{i as n,o as t};
+//# sourceMappingURL=button-group-BGppPrIv.js.map

package/dist/chunks/button-group-BGppPrIv.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-group-BGppPrIv.js","names":[],"sources":["../../src/components/button-group/ButtonGroup.tsx","../../src/components/button-group/ButtonToolbar.tsx"],"sourcesContent":["import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype ButtonGroupOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: C\n  /**\n   * Size the component sm or lg.\n   */\n  size?: 'sm' | 'lg'\n  /**\n   * Create a set of buttons that appear vertically stacked rather than horizontally, with the\n   * `.button-group-vertical` class in place of `.button-group`. Split button dropdowns are not\n   * supported here, and `size` has no effect: chassis-css sizes the buttons of a horizontal group\n   * only, so size the buttons of a vertical one themselves.\n   */\n  vertical?: boolean\n}\n\nexport type ButtonGroupProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  ButtonGroupOwnProps<C>\n>\n\ntype ButtonGroupComponent = (<C extends ElementType = 'div'>(\n  props: ButtonGroupProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction ButtonGroupRender<C extends ElementType = 'div'>(\n  { children, className, component, size, vertical, ...rest }: ButtonGroupProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'div'\n  // chassis-css stacks a group with `.button-group-vertical` in place of `.button-group`: the two\n  // share the base rules, and the horizontal ones (the overlap of the borders, the corners) hang\n  // on `.button-group` alone.\n  const _className = classNames(\n    vertical ? 'button-group-vertical' : 'button-group',\n    size,\n    className\n  )\n\n  return (\n    <Component className={_className} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const ButtonGroup = createPolymorphicComponent<ButtonGroupComponent>(\n  ButtonGroupRender as ForwardRefRenderFunction<Element, ButtonGroupProps<ElementType>>,\n  'ButtonGroup'\n)\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype ButtonToolbarOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: C\n}\n\nexport type ButtonToolbarProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  ButtonToolbarOwnProps<C>\n>\n\ntype ButtonToolbarComponent = (<C extends ElementType = 'div'>(\n  props: ButtonToolbarProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction ButtonToolbarRender<C extends ElementType = 'div'>(\n  { children, className, component, ...rest }: ButtonToolbarProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'div'\n  const _className = classNames('button-toolbar', className)\n\n  return (\n    <Component className={_className} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const ButtonToolbar = createPolymorphicComponent<ButtonToolbarComponent>(\n  ButtonToolbarRender as ForwardRefRenderFunction<Element, ButtonToolbarProps<ElementType>>,\n  'ButtonToolbar'\n)\n"],"mappings":"8HAwCA,SAAS,EACP,CAAE,WAAU,YAAW,YAAW,OAAM,WAAU,GAAG,GACrD,EACA,CACA,IAAM,EAAY,GAAa,MAIzB,EAAa,EACjB,EAAW,wBAA0B,eACrC,EACA,CACF,EAEA,OACE,EAAA,cAAC,EAAD,CAAW,UAAW,EAAY,GAAI,EAAW,KAEtC,EADR,CACQ,CAEf,CAEA,MAAa,EAAc,EACzB,EACA,aACF,ECnCA,SAAS,EACP,CAAE,WAAU,YAAW,YAAW,GAAG,GACrC,EACA,CACA,IAAM,EAAY,GAAa,MACzB,EAAa,EAAW,iBAAkB,CAAS,EAEzD,OACE,EAAA,cAAC,EAAD,CAAW,UAAW,EAAY,GAAI,EAAW,KAEtC,EADR,CACQ,CAEf,CAEA,MAAa,EAAgB,EAC3B,EACA,eACF"}

package/dist/chunks/{card-DfF2K_5p.js → card-YXn3bj_d.js}

@@ -1 +1,2 @@
-import"./focus-ring-SR_LwaN7.js";import{t as e}from"./polymorphic-CACPOv1_.js";import{t}from"./Link-Cq7FNWpm.js";import{n,t as r}from"./breakpoints-o_2Ev7ir.js";import{t as i}from"./spacingClassName-DVhk8m3P.js";import a from"react";import o from"classnames";function s({children:e,className:t,component:s,direction:c,gap:l,responsive:u,...d},f){let p=s??`div`,m=o(`card-body`,r(n,c,u),i(`gap`,l),t);return a.createElement(p,{className:m,...d,ref:f},e)}const c=e(s,`CardBody`);function l({children:e,className:t,component:n,...r},i){let s=n??`div`,c=o(`card-footer`,t);return a.createElement(s,{className:c,...r,ref:i},e)}const u=e(l,`CardFooter`),d=(e,t)=>[e?`${t}card-image-${e}`:t===``?`card-image`:null];function f({children:e,className:t,component:n,orientation:i,responsive:s,...c},l){let u=n??`img`,f=o(r(d,i,s),t);return a.createElement(u,{className:f,...c,ref:l},e)}const p=e(f,`CardImage`);function m({children:e,component:t,className:n,...r},i){let s=t??`h6`,c=o(`card-subtitle`,n);return a.createElement(s,{className:c,...r,ref:i},e)}const h=e(m,`CardSubtitle`);function g({children:e,component:t,className:n,...r},i){let s=t??`p`,c=o(`card-text`,n);return a.createElement(s,{className:c,...r,ref:i},e)}const _=e(g,`CardText`);function v({children:e,component:t,className:n,...r},i){let s=t??`h5`,c=o(`card-title`,n);return a.createElement(s,{className:c,...r,ref:i},e)}const y=e(v,`CardTitle`);function b({children:e,className:t,color:i,component:s,direction:l,footer:d,image:f,imageAlt:m,imageOrientation:g=`top`,responsive:v,size:b,subtitle:x,text:S,title:C,variant:w,...T},E){let D=s??`div`,O=o(`card`,i,{context:!!i,solid:w===`solid`,smooth:w===`smooth`,outline:w===`outline`,sm:b===`sm`,lg:b===`lg`},r(n,l,v),t),k=f!=null||C!=null||x!=null||d!=null||S!=null,A=C!=null||x!=null||S!=null||e!=null,j=typeof f==`string`?a.createElement(p,{orientation:g,src:f,alt:m??``}):f;return a.createElement(D,{className:O,...T,ref:E},k?a.createElement(a.Fragment,null,f!=null&&g===`top`&&j,A&&a.createElement(c,null,C!=null&&a.createElement(y,null,C),x!=null&&a.createElement(h,null,x),S!=null&&a.createElement(_,null,S),e),f!=null&&g===`bottom`&&j,d!=null&&a.createElement(u,null,d)):e)}const x=e(b,`Card`);function S({children:e,className:t,component:n,...r},i){let s=n??`div`,c=o(`card-group`,t);return a.createElement(s,{className:c,...r,ref:i},e)}const C=e(S,`CardGroup`);function w({children:e,className:t,component:n,...r},i){let s=n??`div`,c=o(`card-header`,t);return a.createElement(s,{className:c,...r,ref:i},e)}const T=e(w,`CardHeader`);function E({children:e,className:t,component:n,...r},i){let s=n??`div`,c=o(`card-overlay`,t);return a.createElement(s,{className:c,...r,ref:i},e)}const D=e(E,`CardImageOverlay`);function O({children:e,className:n,...r},i){let s=o(`card-link`,n);return a.createElement(t,{className:s,...r,ref:i},e)}const k=e(O,`CardLink`);export{x as a,h as c,c as d,C as i,p as l,D as n,y as o,T as r,_ as s,k as t,u};
+import"./focus-ring-SR_LwaN7.js";import{t as e}from"./polymorphic-BhGNZQja.js";import{t}from"./Link-CZsWCnQb.js";import{n,t as r}from"./breakpoints-o_2Ev7ir.js";import{t as i}from"./spacingClassName-DVhk8m3P.js";import a from"react";import o from"classnames";function s({children:e,className:t,component:s,direction:c,gap:l,responsive:u,...d},f){let p=s??`div`,m=o(`card-body`,r(n,c,u),i(`gap`,l),t);return a.createElement(p,{className:m,...d,ref:f},e)}const c=e(s,`CardBody`);function l({children:e,className:t,component:n,...r},i){let s=n??`div`,c=o(`card-footer`,t);return a.createElement(s,{className:c,...r,ref:i},e)}const u=e(l,`CardFooter`),d=(e,t)=>[e?`${t}card-image-${e}`:t===``?`card-image`:null];function f({children:e,className:t,component:n,orientation:i,responsive:s,...c},l){let u=n??`img`,f=o(r(d,i,s),t);return a.createElement(u,{className:f,...c,ref:l},e)}const p=e(f,`CardImage`);function m({children:e,component:t,className:n,...r},i){let s=t??`h6`,c=o(`card-subtitle`,n);return a.createElement(s,{className:c,...r,ref:i},e)}const h=e(m,`CardSubtitle`);function g({children:e,component:t,className:n,...r},i){let s=t??`p`,c=o(`card-text`,n);return a.createElement(s,{className:c,...r,ref:i},e)}const _=e(g,`CardText`);function v({children:e,component:t,className:n,...r},i){let s=t??`h5`,c=o(`card-title`,n);return a.createElement(s,{className:c,...r,ref:i},e)}const y=e(v,`CardTitle`);function b({children:e,className:t,color:i,component:s,direction:l,footer:d,image:f,imageAlt:m,imageOrientation:g=`top`,responsive:v,size:b,subtitle:x,text:S,title:C,variant:w,...T},E){let D=s??`div`,O=o(`card`,i,{context:!!i,solid:w===`solid`,smooth:w===`smooth`,outline:w===`outline`,sm:b===`sm`,lg:b===`lg`},r(n,l,v),t),k=f!=null||C!=null||x!=null||d!=null||S!=null,A=C!=null||x!=null||S!=null||e!=null,j=typeof f==`string`?a.createElement(p,{orientation:g,src:f,alt:m??``}):f;return a.createElement(D,{className:O,...T,ref:E},k?a.createElement(a.Fragment,null,f!=null&&g===`top`&&j,A&&a.createElement(c,null,C!=null&&a.createElement(y,null,C),x!=null&&a.createElement(h,null,x),S!=null&&a.createElement(_,null,S),e),f!=null&&g===`bottom`&&j,d!=null&&a.createElement(u,null,d)):e)}const x=e(b,`Card`);function S({children:e,className:t,component:n,...r},i){let s=n??`div`,c=o(`card-group`,t);return a.createElement(s,{className:c,...r,ref:i},e)}const C=e(S,`CardGroup`);function w({children:e,className:t,component:n,...r},i){let s=n??`div`,c=o(`card-header`,t);return a.createElement(s,{className:c,...r,ref:i},e)}const T=e(w,`CardHeader`);function E({children:e,className:t,component:n,...r},i){let s=n??`div`,c=o(`card-overlay`,t);return a.createElement(s,{className:c,...r,ref:i},e)}const D=e(E,`CardImageOverlay`);function O({children:e,className:n,...r},i){let s=o(`card-link`,n);return a.createElement(t,{className:s,...r,ref:i},e)}const k=e(O,`CardLink`);export{x as a,h as c,c as d,C as i,p as l,D as n,y as o,T as r,_ as s,k as t,u};
+//# sourceMappingURL=card-YXn3bj_d.js.map

package/dist/chunks/card-YXn3bj_d.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card-YXn3bj_d.js","names":[],"sources":["../../src/components/card/CardBody.tsx","../../src/components/card/CardFooter.tsx","../../src/components/card/CardImage.tsx","../../src/components/card/CardSubtitle.tsx","../../src/components/card/CardText.tsx","../../src/components/card/CardTitle.tsx","../../src/components/card/Card.tsx","../../src/components/card/CardGroup.tsx","../../src/components/card/CardHeader.tsx","../../src/components/card/CardImageOverlay.tsx","../../src/components/card/CardLink.tsx"],"sourcesContent":["import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport { Breakpoint, Spacing } from '../../types'\nimport {\n  buildResponsiveClassNames,\n  flexDirectionClassNames,\n  FlexDirection\n} from '../../utils/breakpoints'\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\nimport { spacingClassName } from '../../utils/spacingClassName'\n\ntype CardBodyOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: C\n  /**\n   * Switches the body from its default stacked (column) layout to a side-by-side (row) layout —\n   * for placing an image beside text within a single padded region. Wrap the image and text in\n   * `Col` to control each side's width, and nest another `CardBody` (with `.p-0`) for the text\n   * side so it doesn't receive double padding.\n   */\n  direction?: FlexDirection\n  /**\n   * Spacing between children, mapped to the `gap-*` utility classes. Overrides the card's default\n   * gap between body children.\n   */\n  gap?: Spacing | 0\n  /**\n   * Overrides `direction` at one or more breakpoints.\n   */\n  responsive?: Partial<Record<Breakpoint, FlexDirection>>\n}\n\nexport type CardBodyProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  CardBodyOwnProps<C>\n>\n\ntype CardBodyComponent = (<C extends ElementType = 'div'>(\n  props: CardBodyProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction CardBodyRender<C extends ElementType = 'div'>(\n  { children, className, component, direction, gap, responsive, ...rest }: CardBodyProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'div'\n  const _className = classNames(\n    'card-body',\n    buildResponsiveClassNames(flexDirectionClassNames, direction, responsive),\n    spacingClassName('gap', gap),\n    className\n  )\n\n  return (\n    <Component className={_className} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const CardBody = createPolymorphicComponent<CardBodyComponent>(\n  CardBodyRender as ForwardRefRenderFunction<Element, CardBodyProps<ElementType>>,\n  'CardBody'\n)\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype CardFooterOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: C\n}\n\nexport type CardFooterProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  CardFooterOwnProps<C>\n>\n\ntype CardFooterComponent = (<C extends ElementType = 'div'>(\n  props: CardFooterProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction CardFooterRender<C extends ElementType = 'div'>(\n  { children, className, component, ...rest }: CardFooterProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'div'\n  const _className = classNames('card-footer', className)\n\n  return (\n    <Component className={_className} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const CardFooter = createPolymorphicComponent<CardFooterComponent>(\n  CardFooterRender as ForwardRefRenderFunction<Element, CardFooterProps<ElementType>>,\n  'CardFooter'\n)\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport { Breakpoint } from '../../types'\nimport { buildResponsiveClassNames } from '../../utils/breakpoints'\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype CardImageOrientation = 'top' | 'bottom' | 'start' | 'end'\n\ntype CardImageOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component —\n   * e.g. a framework's own `Image` component. Its own props (`src`, `fill`, `priority`, etc.)\n   * are type-checked at the call site once passed here.\n   */\n  component?: C\n  /**\n   * Orientates the image to the top or bottom of the card as an \"image cap\", or to the start/end\n   * for a horizontal layout. Omit to round all four corners for use inside `CardBody`.\n   */\n  orientation?: CardImageOrientation\n  /**\n   * Overrides `orientation` at one or more breakpoints — e.g. `{ lg: 'start' }` to switch an\n   * image cap from `top` to `start` once the card lays out horizontally.\n   */\n  responsive?: Partial<Record<Breakpoint, CardImageOrientation>>\n}\n\nexport type CardImageProps<C extends ElementType = 'img'> = PolymorphicComponentProps<\n  C,\n  CardImageOwnProps<C>\n>\n\ntype CardImageComponent = (<C extends ElementType = 'img'>(\n  props: CardImageProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nconst layoutClassNames = (orientation: CardImageOrientation | undefined, prefix: string) => [\n  orientation ? `${prefix}card-image-${orientation}` : prefix === '' ? 'card-image' : null\n]\n\nfunction CardImageRender<C extends ElementType = 'img'>(\n  { children, className, component, orientation, responsive, ...rest }: CardImageProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'img'\n  const _className = classNames(\n    buildResponsiveClassNames(layoutClassNames, orientation, responsive),\n    className\n  )\n\n  return (\n    <Component className={_className} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const CardImage = createPolymorphicComponent<CardImageComponent>(\n  CardImageRender as ForwardRefRenderFunction<Element, CardImageProps<ElementType>>,\n  'CardImage'\n)\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype CardSubtitleOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: C\n}\n\nexport type CardSubtitleProps<C extends ElementType = 'h6'> = PolymorphicComponentProps<\n  C,\n  CardSubtitleOwnProps<C>\n>\n\ntype CardSubtitleComponent = (<C extends ElementType = 'h6'>(\n  props: CardSubtitleProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction CardSubtitleRender<C extends ElementType = 'h6'>(\n  { children, component, className, ...rest }: CardSubtitleProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'h6'\n  const _className = classNames('card-subtitle', className)\n\n  return (\n    <Component className={_className} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const CardSubtitle = createPolymorphicComponent<CardSubtitleComponent>(\n  CardSubtitleRender as ForwardRefRenderFunction<Element, CardSubtitleProps<ElementType>>,\n  'CardSubtitle'\n)\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype CardTextOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: C\n}\n\nexport type CardTextProps<C extends ElementType = 'p'> = PolymorphicComponentProps<\n  C,\n  CardTextOwnProps<C>\n>\n\ntype CardTextComponent = (<C extends ElementType = 'p'>(\n  props: CardTextProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction CardTextRender<C extends ElementType = 'p'>(\n  { children, component, className, ...rest }: CardTextProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'p'\n  const _className = classNames('card-text', className)\n\n  return (\n    <Component className={_className} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const CardText = createPolymorphicComponent<CardTextComponent>(\n  CardTextRender as ForwardRefRenderFunction<Element, CardTextProps<ElementType>>,\n  'CardText'\n)\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype CardTitleOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: C\n}\n\nexport type CardTitleProps<C extends ElementType = 'h5'> = PolymorphicComponentProps<\n  C,\n  CardTitleOwnProps<C>\n>\n\ntype CardTitleComponent = (<C extends ElementType = 'h5'>(\n  props: CardTitleProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction CardTitleRender<C extends ElementType = 'h5'>(\n  { children, component, className, ...rest }: CardTitleProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'h5'\n  const _className = classNames('card-title', className)\n\n  return (\n    <Component className={_className} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const CardTitle = createPolymorphicComponent<CardTitleComponent>(\n  CardTitleRender as ForwardRefRenderFunction<Element, CardTitleProps<ElementType>>,\n  'CardTitle'\n)\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement, ReactNode } from 'react'\nimport classNames from 'classnames'\n\nimport { Breakpoint, ContextColor, ContextStyle, Sizing } from '../../types'\nimport {\n  buildResponsiveClassNames,\n  flexDirectionClassNames,\n  FlexDirection\n} from '../../utils/breakpoints'\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\nimport { CardBody } from './CardBody'\nimport { CardFooter } from './CardFooter'\nimport { CardImage } from './CardImage'\nimport { CardSubtitle } from './CardSubtitle'\nimport { CardText } from './CardText'\nimport { CardTitle } from './CardTitle'\n\ntype CardOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: C\n  /**\n   * Sets the color of the component to one of Chassis context colors.\n   */\n  color?: ContextColor\n  /**\n   * Switches the card from its default stacked (column) layout to a side-by-side (row) layout.\n   * Wrap the image and body in `Col` to control each side's width.\n   */\n  direction?: FlexDirection\n  /**\n   * Shorthand for a `CardFooter`, rendered after the image/title/subtitle/text/`children` block.\n   */\n  footer?: ReactNode\n  /**\n   * Shorthand for a `CardImage` — pass either a `src` URL (combine with `imageAlt`/\n   * `imageOrientation`) or a fully-formed element — a `<CardImage>`, `<Skeleton>`,\n   * `<Placeholder>`, or anything else — rendered as-is in its place. `imageAlt`/`imageOrientation`\n   * only apply to the `src` form; set them directly on your own element otherwise. For a\n   * horizontal layout or an overlay, omit this and compose `CardImage` directly as a child\n   * instead.\n   */\n  image?: ReactNode\n  /**\n   * Accessible alt text for `image`. Ignored unless `image` is set.\n   */\n  imageAlt?: string\n  /**\n   * Orientates `image` to the top (default) or bottom of the card.\n   */\n  imageOrientation?: 'top' | 'bottom'\n  /**\n   * Overrides `direction` at one or more breakpoints — e.g. `{ lg: 'row' }` to lay the card\n   * out horizontally from `lg` up while stacking below it.\n   */\n  responsive?: Partial<Record<Breakpoint, FlexDirection>>\n  /**\n   * Sets the size of the component to one of Chassis component sizes.\n   */\n  size?: Sizing\n  /**\n   * Shorthand for a `CardSubtitle`, rendered directly after `title`.\n   */\n  subtitle?: ReactNode\n  /**\n   * Shorthand for a `CardText`, rendered after `title`/`subtitle`.\n   */\n  text?: ReactNode\n  /**\n   * Shorthand for a `CardTitle`. Set alongside `subtitle`/`text` (or plain `children`, e.g. a\n   * `Button`) to build a standard card without composing `CardBody`/`CardTitle` yourself — all\n   * render together inside a single `CardBody`, in that order. Only takes effect when at least\n   * one of `image`/`title`/`subtitle`/`text`/`footer` is set; otherwise `children` render as-is,\n   * so full manual composition (`CardHeader`, lists, overlays, nav headers, …) keeps working\n   * unchanged. Mixing shorthand props with a manually-composed `children` tree isn't supported —\n   * pick one approach per card.\n   */\n  title?: ReactNode\n  /**\n   * Sets the context style of the component. `basic` (the default) renders with no extra class.\n   */\n  variant?: ContextStyle\n}\n\nexport type CardProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, CardOwnProps<C>>\n\ntype CardComponent = (<C extends ElementType = 'div'>(\n  props: CardProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction CardRender<C extends ElementType = 'div'>(\n  {\n    children,\n    className,\n    color,\n    component,\n    direction,\n    footer,\n    image,\n    imageAlt,\n    imageOrientation = 'top',\n    responsive,\n    size,\n    subtitle,\n    text,\n    title,\n    variant,\n    ...rest\n  }: CardProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'div'\n  const _className = classNames(\n    'card',\n    color,\n    {\n      context: !!color,\n      solid: variant === 'solid',\n      smooth: variant === 'smooth',\n      outline: variant === 'outline',\n      sm: size === 'sm',\n      lg: size === 'lg'\n    },\n    buildResponsiveClassNames(flexDirectionClassNames, direction, responsive),\n    className\n  )\n\n  const hasShorthand =\n    image != null || title != null || subtitle != null || footer != null || text != null\n  const hasBodyContent = title != null || subtitle != null || text != null || children != null\n  const renderedImage =\n    typeof image === 'string' ? (\n      <CardImage orientation={imageOrientation} src={image} alt={imageAlt ?? ''} />\n    ) : (\n      image\n    )\n\n  return (\n    <Component className={_className} {...rest} ref={ref}>\n      {hasShorthand ? (\n        <>\n          {image != null && imageOrientation === 'top' && renderedImage}\n          {hasBodyContent && (\n            <CardBody>\n              {title != null && <CardTitle>{title}</CardTitle>}\n              {subtitle != null && <CardSubtitle>{subtitle}</CardSubtitle>}\n              {text != null && <CardText>{text}</CardText>}\n              {children}\n            </CardBody>\n          )}\n          {image != null && imageOrientation === 'bottom' && renderedImage}\n          {footer != null && <CardFooter>{footer}</CardFooter>}\n        </>\n      ) : (\n        children\n      )}\n    </Component>\n  )\n}\n\nexport const Card = createPolymorphicComponent<CardComponent>(\n  CardRender as ForwardRefRenderFunction<Element, CardProps<ElementType>>,\n  'Card'\n)\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype CardGroupOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: C\n}\n\nexport type CardGroupProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  CardGroupOwnProps<C>\n>\n\ntype CardGroupComponent = (<C extends ElementType = 'div'>(\n  props: CardGroupProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\n// Arranges direct-child Cards as an equal-width row, joined edge-to-edge, once its container\n// reaches the sm container breakpoint — below that, cards stack vertically. Requires a\n// `.contains-inline` ancestor (not applied by CardGroup itself, e.g. a wrapping\n// `<div className=\"contains-inline\">`) to establish the container query context.\nfunction CardGroupRender<C extends ElementType = 'div'>(\n  { children, className, component, ...rest }: CardGroupProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'div'\n  const _className = classNames('card-group', className)\n\n  return (\n    <Component className={_className} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const CardGroup = createPolymorphicComponent<CardGroupComponent>(\n  CardGroupRender as ForwardRefRenderFunction<Element, CardGroupProps<ElementType>>,\n  'CardGroup'\n)\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype CardHeaderOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: C\n}\n\nexport type CardHeaderProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  CardHeaderOwnProps<C>\n>\n\ntype CardHeaderComponent = (<C extends ElementType = 'div'>(\n  props: CardHeaderProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction CardHeaderRender<C extends ElementType = 'div'>(\n  { children, className, component, ...rest }: CardHeaderProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'div'\n  const _className = classNames('card-header', className)\n\n  return (\n    <Component className={_className} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const CardHeader = createPolymorphicComponent<CardHeaderComponent>(\n  CardHeaderRender as ForwardRefRenderFunction<Element, CardHeaderProps<ElementType>>,\n  'CardHeader'\n)\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\n\ntype CardImageOverlayOwnProps<C extends ElementType> = {\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * Component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: C\n}\n\nexport type CardImageOverlayProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  CardImageOverlayOwnProps<C>\n>\n\ntype CardImageOverlayComponent = (<C extends ElementType = 'div'>(\n  props: CardImageOverlayProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction CardImageOverlayRender<C extends ElementType = 'div'>(\n  { children, className, component, ...rest }: CardImageOverlayProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'div'\n  const _className = classNames('card-overlay', className)\n\n  return (\n    <Component className={_className} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const CardImageOverlay = createPolymorphicComponent<CardImageOverlayComponent>(\n  CardImageOverlayRender as ForwardRefRenderFunction<Element, CardImageOverlayProps<ElementType>>,\n  'CardImageOverlay'\n)\n","import React, { ElementType, ForwardRefRenderFunction, ReactElement } from 'react'\nimport classNames from 'classnames'\n\nimport { createPolymorphicComponent, PolymorphicRef } from '../../utils/polymorphic'\nimport { Link, LinkProps } from '../link/Link'\n\ntype CardLinkOwnProps = {\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n}\n\nexport type CardLinkProps<C extends ElementType = 'a'> = LinkProps<C> & CardLinkOwnProps\n\ntype CardLinkComponent = (<C extends ElementType = 'a'>(\n  props: CardLinkProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction CardLinkRender<C extends ElementType = 'a'>(\n  { children, className, ...rest }: CardLinkProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const _className = classNames('card-link', className)\n\n  return (\n    <Link\n      className={_className}\n      {...(rest as Record<string, unknown>)}\n      ref={ref as PolymorphicRef<ElementType>}\n    >\n      {children}\n    </Link>\n  )\n}\n\nexport const CardLink = createPolymorphicComponent<CardLinkComponent>(\n  CardLinkRender as ForwardRefRenderFunction<Element, CardLinkProps<ElementType>>,\n  'CardLink'\n)\n"],"mappings":"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"}

package/dist/chunks/carousel-fTVPqnSV.js

@@ -0,0 +1,2 @@
+import"./focus-ring-SR_LwaN7.js";import{v as e}from"./slot-CNhFZdHF.js";import{t}from"./useForkedRef-DVEfT-KI.js";import{t as n}from"./lazyElement-tfMG21pZ.js";import{t as r}from"./polymorphic-BhGNZQja.js";import{t as i}from"./useControllableState-CPUJxfKW.js";import{t as a}from"./useIsomorphicLayoutEffect-BbqRwuqn.js";import{t as o}from"./focusRedirect-BrvK3U_o.js";import{t as s}from"./iconSlot-BNu2MrFI.js";import{t as c}from"./VisuallyHidden-C2dM7HhC.js";import{t as l}from"./direction-LN6uwsK5.js";import u,{Children as d,Fragment as f,createContext as p,forwardRef as m,isValidElement as h,useCallback as g,useContext as _,useEffect as v,useRef as y,useState as b}from"react";import x from"classnames";const S=new WeakSet;function ee(e){S.add(e)}function te(e){if(!e)return!1;let t=S.has(e);return S.delete(e),t}const C=p(null),w=()=>{let e=_(C);if(!e)throw Error(`Carousel sub-components must be rendered inside a Carousel`);return e};function T(e){return Array.from(e.querySelectorAll(`:scope > .carousel-item:not(.carousel-item-clone)`))}function E(){return typeof window<`u`&&typeof window.matchMedia==`function`&&window.matchMedia(`(prefers-reduced-motion: reduce)`).matches}function ne(e){if(!e)return!1;let t=e.getBoundingClientRect();return t.top<(window.innerHeight||document.documentElement.clientHeight)&&t.bottom>0&&t.left<(window.innerWidth||document.documentElement.clientWidth)&&t.right>0}function D(e,t,n){let r=e.getBoundingClientRect(),i=t.getBoundingClientRect();if(n)return i.left+i.width/2-(r.left+r.width/2);let a=Number.parseFloat(getComputedStyle(e).scrollPaddingInlineStart)||0;return l(e)?i.right-(r.right-a):i.left-(r.left+a)}function O(e){return e.scrollWidth-e.clientWidth>0}const re=e=>e<.5?4*e*e*e:1-(-2*e+2)**3/2;function ie(e,t,n){if(E()||typeof requestAnimationFrame>`u`)return e.scrollTo({left:t,behavior:`instant`}),n(),()=>{};let r=e.scrollLeft,i=t-r,a=null,o=null,s=!1,c=()=>{s||(s=!0,o!==null&&cancelAnimationFrame(o),clearTimeout(u),e.scrollTo({left:t,behavior:`instant`}),n())},l=t=>{if(s)return;a===null&&(a=t);let n=Math.min((t-a)/300,1);if(e.scrollTo({left:r+i*re(n),behavior:`instant`}),n<1){o=requestAnimationFrame(l);return}c()},u=setTimeout(c,500);return o=requestAnimationFrame(l),()=>{s||(s=!0,o!==null&&cancelAnimationFrame(o),clearTimeout(u))}}function ae(e,t,n){return Number.isNaN(e)||t===0?null:e<0?n?t-1:null:e>t-1?n?0:null:e}function oe(e,t,n){let r=t>e;return n?r?`right`:`left`:r?`left`:`right`}function se(e,t){return t?e?`right`:`left`:e?`left`:`right`}function ce(e,t,n,r,i){if(n||t<2||r||i)return!1;let a=getComputedStyle(e),o=e=>Number.parseFloat(a.getPropertyValue(e))||0;return(o(`--cx-carousel-items`)||1)===1&&o(`--cx-carousel-items-peek`)===0}function le({children:e,className:t,component:n,interval:r,...i},a){let o=n??`div`,s=_(C),c=_(ue),l=s&&c?{"aria-label":`${c.index+1} of ${c.count}`,"aria-roledescription":`slide`,role:`group`}:{},d=x(`carousel-item`,{active:!!s&&!!c&&c.index===s.activeIndex},t);return u.createElement(o,{className:d,"data-interval":r,...l,...i,ref:a},e)}const k=r(le,`CarouselItem`),ue=p(void 0);function A(e){let t=j(e);return{nodes:t,positioned:t.every(e=>n(e,k))}}function j(e){return d.toArray(e).flatMap(e=>n(e,f)?j(e.props.children).map(t=>h(t)?u.cloneElement(t,{key:`${e.key}/${t.key}`}):t):[e])}function de({children:e,className:n,component:r,...i},a){let{registerViewport:o}=w(),s=r??`div`,c=t(a,o),l=x(`carousel-inner`,n),{nodes:d,positioned:f}=A(e);return u.createElement(s,{className:l,...i,ref:c},d.map((e,t)=>u.createElement(ue.Provider,{key:h(e)?e.key:t,value:f?{count:d.length,index:t}:void 0},e)))}const fe=r(de,`CarouselInner`),pe=m(({children:n,activeIndex:r,auto:s,autoplay:d=!1,center:f,className:p,defaultActiveIndex:m=0,ends:h=`loop`,interval:_=5e3,items:S,itemsGap:ee,itemsPeek:w,keyboard:re=!0,onKeyDown:le,onMouseEnter:k,onMouseLeave:ue,onSlid:A,onSlide:j,pause:de=`hover`,style:fe,transition:pe=`scroll`,...M},he)=>{e(r!==void 0&&!j&&!A,"Carousel: `activeIndex` is set (controlled) but neither `onSlide` nor `onSlid` is — nothing feeds the new index back to your state, so the carousel will visually freeze on click/swipe/autoplay. Pass `onSlide` or `onSlid` and update `activeIndex` from it.");let N=y(null),P=t(he,N),[F,ge]=b(null),I=g(e=>ge(e),[]),[L,_e]=i(r,m),R=y(L);a(()=>{R.current=L},[L]);let[z,ve]=b(()=>me(n)),B=y(z);a(()=>{B.current=z},[z]);let[V,ye]=b(d),[be,xe]=b(!1),[H,Se]=b(L<=0),[U,Ce]=b(z>0&&L>=z-Math.max(1,S??1)),W=y(!1),G=y(!1),we=y(!1),K=y(null),q=y(null),Te=y(new Map),J=y(null),Ee=y(!1),De=y(!1),Oe=y(!1),[ke,Ae]=b(``),je=y(!1),Y=y({from:L,to:L,direction:`left`}),Me=y(new Set),Ne=y(new Set),X=pe===`fade`,Z=Math.max(1,S??1),Pe=h!==`stop`,Fe=e=>{R.current=e,_e(e)};a(()=>{let e=Math.max(0,z-Z);Se(L<=0),Ce(L>=e)},[L,z,Z]),v(()=>{if(!F)return;let e=()=>{if(W.current||!O(F))return;let e=F.scrollWidth-F.clientWidth,t=F.scrollLeft,n=l(F)?Math.max(-e,Math.min(0,t)):Math.max(0,Math.min(e,t)),r=Math.abs(n);Se(r<=1),Ce(r>=e-1)};return F.addEventListener(`scroll`,e,{passive:!0}),()=>F.removeEventListener(`scroll`,e)},[F]),a(()=>{if(!F)return;let e=()=>{let e=T(F);if(ve(e.length),q.current?.disconnect(),q.current=null,Te.current=new Map,!(X||typeof IntersectionObserver>`u`)){q.current=new IntersectionObserver(e=>{for(let t of e)Te.current.set(t.target,t.isIntersecting?t.intersectionRatio:0);if(W.current||G.current)return;let t=T(F).map(e=>Te.current.get(e)??0),n=Math.max(0,...t),r=R.current;if(n>0){let e=t.findIndex(e=>e>=n-.05);e!==-1&&(r=e)}if(r!==R.current){let e=R.current,t={from:e,to:r,direction:oe(e,r,l(F))};Y.current=t,j?.(t),we.current=!0,Fe(r)}},{root:F,threshold:[0,.25,.5,.75,1]});for(let t of e)q.current.observe(t)}};e();let t=new MutationObserver(e);return t.observe(F,{childList:!0}),()=>{t.disconnect(),q.current?.disconnect()}},[F,X]),a(()=>{if(!F)return;let e=T(F);for(let[t,n]of e.entries())n.classList.toggle(`active`,t===L),n.hasAttribute(`role`)||n.setAttribute(`role`,`group`),n.setAttribute(`aria-roledescription`,`slide`),n.setAttribute(`aria-label`,`${t+1} of ${e.length}`)},[F,L,z]),a(()=>{if(we.current){we.current=!1;return}if(!F||W.current||X)return;let e=T(F)[L];if(!e||!O(F))return;let t=!Ee.current;Ee.current=!0;let n=D(F,e,!!f);Math.abs(n)<1||(K.current?.(),G.current=!0,F.style.scrollSnapType=`none`,t?(F.scrollTo({left:F.scrollLeft+n,behavior:`instant`}),F.style.scrollSnapType=``,G.current=!1,K.current=null):(je.current=!0,K.current=ie(F,F.scrollLeft+n,()=>{F.style.scrollSnapType=``,G.current=!1,K.current=null,je.current=!1,A?.(Y.current)})))},[F,L,z,f,X]),v(()=>{if(!De.current){De.current=!0;return}je.current||A?.(Y.current)},[L]),v(()=>{if(!Oe.current){Oe.current=!0;return}Ae(`Slide ${L+1} of ${z}`)},[L]),v(()=>()=>{J.current&&clearTimeout(J.current),q.current?.disconnect(),K.current?.()},[]);let Ie=e=>{let t=F;if(!t)return;K.current?.(),G.current=!1;let n=T(t),r=n.length-1,i=R.current,a=e?0:r,o=se(e,l(t));j?.({from:i,to:a,direction:o}),W.current=!0;let s=()=>{Y.current={from:i,to:a,direction:o},Fe(a),W.current=!1},c=e?n[0]:n[r],u=n[i],d=n[a];if(!O(t)||!c||!u||!d){s();return}let p=c.cloneNode(!0);p.classList.add(`carousel-item-clone`),p.classList.remove(`active`),p.removeAttribute(`id`);for(let e of Array.from(p.querySelectorAll(`[id]`)))e.removeAttribute(`id`);p.setAttribute(`aria-hidden`,`true`),p.setAttribute(`inert`,``),t.style.scrollSnapType=`none`,e?t.append(p):(t.prepend(p),t.scrollTo({left:t.scrollLeft+D(t,u,!!f),behavior:`instant`}));let m=D(t,p,!!f);ie(t,t.scrollLeft+m,()=>{p.remove();let e=D(t,d,!!f);t.scrollTo({left:t.scrollLeft+e,behavior:`instant`}),t.style.scrollSnapType=``,s()})},Le=e=>{if(W.current)return;let t=B.current;if(t===0)return;let n=Math.max(0,t-Z);if(h===`loop`&&!X&&!E()&&N.current&&ce(N.current,t,X,!!f,!!s)){if(e>n){Ie(!0);return}if(e<0){Ie(!1);return}}let r=ae(e,n+1,Pe),i=R.current;if(r===null||r===i)return;let a=oe(i,e,F?l(F):!1);j?.({from:i,to:r,direction:a}),Y.current={from:i,to:r,direction:a},Fe(r)},Re=()=>Le(R.current+1),ze=()=>Le(R.current-1),Be=e=>Le(e),Q=()=>{J.current&&clearTimeout(J.current),J.current=null,xe(!1)},Ve=(e=R.current)=>{J.current&&clearTimeout(J.current);let t=(F?T(F):[])[e]?.dataset.interval,n=t&&!Number.isNaN(Number(t))?Number(t):_;N.current?.style.setProperty(`--cx-carousel-interval`,`${n}ms`),J.current=setTimeout(()=>{let t=B.current,n=Math.max(0,t-Z),r=ae(R.current+1,n+1,Pe);if(!(typeof document>`u`||document.visibilityState===`visible`&&ne(N.current))){Ve(e);return}if(Re(),r===null){Q();return}Ve(r)},n)},He=()=>{Ve(),xe(!0)},$=()=>{ye(!1),Q()},Ue=()=>{if(V){$();return}ye(!0),He()};v(()=>{if(F)return V&&He(),()=>Q()},[F]),v(()=>{if(!F)return;let e=()=>$();return F.addEventListener(`pointerdown`,e),()=>F.removeEventListener(`pointerdown`,e)},[F]),v(()=>{if(h!==`stop`)return;let e=document.activeElement,t=H&&!!e&&Me.current.has(e),n=U&&!!e&&Ne.current.has(e);if(!t&&!n)return;let r=t?Ne.current:Me.current,i=(t?!U:!H)?Array.from(r)[0]:null,a=te(e);if(i){o(i,a,{preventScroll:!0});return}F&&(F.hasAttribute(`tabindex`)||F.setAttribute(`tabindex`,`-1`),o(F,a,{preventScroll:!0}))},[H,U,h,F]);let We=g((e,t)=>{let n=e===`prev`?Me.current:Ne.current;return n.add(t),()=>{n.delete(t)}},[]),Ge=e=>{le?.(e),re&&(e.target.closest(`input, textarea, select, [contenteditable="true"]`)||(e.key===`ArrowLeft`||e.key===`ArrowRight`)&&(e.preventDefault(),$(),e.key===`ArrowLeft`?ze():Re()))},Ke=e=>{k?.(e),de===`hover`&&Q()},qe=e=>{ue?.(e),de===`hover`&&V&&He()},Je={activeIndex:L,atEnd:U,atStart:H,ends:h,itemCount:z,itemsVisible:Z,next:()=>{$(),Re()},playing:V,prev:()=>{$(),ze()},registerControl:We,registerViewport:I,to:e=>{$(),Be(e)},togglePlayPause:Ue},Ye=x(`carousel`,{"carousel-fade":X,"carousel-center":f,"carousel-auto":s,"carousel-playing":be},p),Xe={...fe,...S!=null&&{"--cx-carousel-items":S},...ee!=null&&{"--cx-carousel-items-gap":ee},...w!=null&&{"--cx-carousel-items-peek":w}};return u.createElement(`div`,{role:`region`,"aria-roledescription":`carousel`,className:Ye,style:Xe,onKeyDown:Ge,onMouseEnter:Ke,onMouseLeave:qe,...M,ref:P},u.createElement(C.Provider,{value:Je},n),u.createElement(c,{role:`status`},ke))});pe.displayName=`Carousel`;function me(e){for(let t of d.toArray(e)){if(n(t,fe)){let{nodes:e,positioned:n}=A(t.props.children);return n?e.length:0}if(!h(t))continue;let e=me(t.props.children);if(e>0)return e}return 0}const M=m(({children:e,className:n,direction:r,disabled:i,icon:a,label:o,onClick:l,...d},f)=>{let{atEnd:p,atStart:m,ends:h,next:g,prev:_,registerControl:b}=w(),S=y(null),te=t(f,S);v(()=>{let e=S.current;if(e)return b(r,e)},[b,r]);let C=r===`next`?p:m,T=r===`next`?g:_,E=i||h===`stop`&&C;return u.createElement(`button`,{type:`button`,className:x(`button sm icon-only`,n),disabled:E,onClick:e=>{l?.(e),e.detail!==0&&ee(e.currentTarget),T()},...d,ref:te},e??u.createElement(u.Fragment,null,u.createElement(s,{icon:r===`next`?`next`:`previous`,override:a,className:`directional-icon`}),u.createElement(c,null,o)))});M.displayName=`CarouselControlButton`;const he=m(({label:e=`Next slide`,...t},n)=>u.createElement(M,{...t,direction:`next`,label:e,ref:n}));he.displayName=`CarouselControlNext`;const N=m(({label:e=`Previous slide`,...t},n)=>u.createElement(M,{...t,direction:`prev`,label:e,ref:n}));N.displayName=`CarouselControlPrev`;const P=m(({className:e,label:t=e=>`Slide ${e}`,...n},r)=>{let{activeIndex:i,itemCount:a,itemsVisible:o,to:s}=w(),c=x(`carousel-indicators`,e),l=a===0?0:Math.max(1,a-o+1);return u.createElement(`ol`,{className:c,...n,ref:r},Array.from({length:l},(e,t)=>t).map(e=>u.createElement(`li`,{key:e},u.createElement(`button`,{type:`button`,className:e===i?`active`:void 0,"aria-current":e===i?`true`:void 0,"aria-label":t(e+1),onClick:()=>s(e)}))))});P.displayName=`CarouselIndicators`;function F({children:e,className:t,component:n,...r},i){let a=n??`div`,o=x(`carousel-overlay`,t);return u.createElement(a,{className:o,...r,ref:i},e)}const ge=r(F,`CarouselOverlay`),I=m(({children:e,className:t,onClick:n,pauseIcon:r,pauseLabel:i=`Pause`,playIcon:a,playLabel:o=`Play`,...c},l)=>{let{playing:d,togglePlayPause:f}=w(),p=x(`carousel-control-play-pause button sm icon-only`,{paused:!d},t);return u.createElement(`button`,{type:`button`,className:p,"aria-label":d?i:o,onClick:e=>{n?.(e),f()},...c,ref:l},e??u.createElement(u.Fragment,null,u.createElement(s,{icon:`pause`,override:r,className:`carousel-icon-pause`}),u.createElement(s,{icon:`play`,override:a,className:`carousel-icon-play`})))});I.displayName=`CarouselPlayPause`;export{he as a,k as c,N as i,ge as n,pe as o,P as r,fe as s,I as t};
+//# sourceMappingURL=carousel-fTVPqnSV.js.map