@chassis-ui/react 0.3.0 → 0.4.1

package/README.md

@@ -30,7 +30,7 @@ The components render `@chassis-ui/css`'s markup and class names, so install bot
 npm install @chassis-ui/react @chassis-ui/css
 ```
 
-`@chassis-ui/css` is a peer dependency, pinned to one 0.x minor (`>=0.6.0 <0.7.0` today): before
+`@chassis-ui/css` is a peer dependency, pinned to one 0.x minor (`>=0.7.0 <0.8.0` today): before
 1.0 a minor release of it can rename the tokens the components rely on.
 
 ## Stylesheets
@@ -92,7 +92,7 @@ examples.
 ## Peer dependencies
 
 - `react` and `react-dom`: `^19.0.0`
-- `@chassis-ui/css`: `>=0.6.0 <0.7.0`
+- `@chassis-ui/css`: `>=0.7.0 <0.8.0`
 
 ## Browser support
 

package/dist/alert.d.ts

@@ -1,2 +1,2 @@
-import { a as AlertIcon, c as AlertFooterProps, d as AlertCancel, f as AlertCancelProps, g as AlertProps, h as Alert, i as AlertTextProps, l as AlertCode, m as AlertBodyProps, n as AlertTitleProps, o as AlertIconProps, p as AlertBody, r as AlertText, s as AlertFooter, t as AlertTitle, u as AlertCodeProps } from "./chunks/index-DgHvXzVh.js";
+import { a as AlertIcon, c as AlertFooterProps, d as AlertCancel, f as AlertCancelProps, g as AlertProps, h as Alert, i as AlertTextProps, l as AlertCode, m as AlertBodyProps, n as AlertTitleProps, o as AlertIconProps, p as AlertBody, r as AlertText, s as AlertFooter, t as AlertTitle, u as AlertCodeProps } from "./chunks/index-DHcztR18.js";
 export { Alert, AlertBody, type AlertBodyProps, AlertCancel, type AlertCancelProps, AlertCode, type AlertCodeProps, AlertFooter, type AlertFooterProps, AlertIcon, type AlertIconProps, type AlertProps, AlertText, type AlertTextProps, AlertTitle, type AlertTitleProps };

package/dist/alert.js

@@ -1 +1 @@
-"use client";import{a as e,c as t,i as n,n as r,o as i,r as a,s as o,t as s}from"./chunks/alert-BXI-_qlt.js";export{t as Alert,o as AlertBody,i as AlertCancel,e as AlertCode,n as AlertFooter,a as AlertIcon,r as AlertText,s as AlertTitle};
+"use client";import{a as e,c as t,i as n,n as r,o as i,r as a,s as o,t as s}from"./chunks/alert-3kTBfWFw.js";export{t as Alert,o as AlertBody,i as AlertCancel,e as AlertCode,n as AlertFooter,a as AlertIcon,r as AlertText,s as AlertTitle};

package/dist/avatar.d.ts

@@ -1,2 +1,2 @@
-import { a as AvatarImageProps, i as AvatarImage, n as AvatarStackItemDef, o as Avatar, r as AvatarStackProps, s as AvatarProps, t as AvatarStack } from "./chunks/index-D9PZHY_I.js";
+import { a as AvatarImageProps, i as AvatarImage, n as AvatarStackItemDef, o as Avatar, r as AvatarStackProps, s as AvatarProps, t as AvatarStack } from "./chunks/index-B19ZH3fm.js";
 export { Avatar, AvatarImage, type AvatarImageProps, type AvatarProps, AvatarStack, type AvatarStackItemDef, type AvatarStackProps };

package/dist/avatar.js

@@ -1 +1 @@
-"use client";import{n as e,r as t,t as n}from"./chunks/avatar-S3dGy6Qc.js";export{e as Avatar,t as AvatarImage,n as AvatarStack};
+"use client";import{n as e,r as t,t as n}from"./chunks/avatar-MklqAKcz.js";export{e as Avatar,t as AvatarImage,n as AvatarStack};

package/dist/badge.d.ts

@@ -1,2 +1,2 @@
-import { n as BadgeProps, t as Badge } from "./chunks/index-Dh5CaHTP.js";
+import { n as BadgeProps, t as Badge } from "./chunks/index-aRdgpeRb.js";
 export { Badge, type BadgeProps };

package/dist/breadcrumb.js

@@ -1 +1 @@
-"use client";import{n as e,t}from"./chunks/breadcrumb-s6J9itez.js";export{t as Breadcrumb,e as BreadcrumbItem};
+"use client";import{n as e,t}from"./chunks/breadcrumb-CHxTiZLt.js";export{t as Breadcrumb,e as BreadcrumbItem};

package/dist/button.d.ts

@@ -1,3 +1,3 @@
 import "./chunks/focus-ring-SR_LwaN7.js";
-import { n as ButtonProps, t as Button } from "./chunks/Button-Cptd4Yk7.js";
+import { n as ButtonProps, t as Button } from "./chunks/Button-BuZ_GOHS.js";
 export { Button, type ButtonProps };

package/dist/card.d.ts

@@ -1,2 +1,2 @@
-import { S as CardProps, _ as CardFooter, a as CardSubtitle, b as CardBodyProps, c as CardLinkProps, d as CardImage, f as CardImageProps, g as CardGroupProps, h as CardGroup, i as CardTextProps, l as CardImageOverlay, m as CardHeaderProps, n as CardTitleProps, o as CardSubtitleProps, p as CardHeader, r as CardText, s as CardLink, t as CardTitle, u as CardImageOverlayProps, v as CardFooterProps, x as Card, y as CardBody } from "./chunks/index-CKx1KHED.js";
+import { S as CardProps, _ as CardFooter, a as CardSubtitle, b as CardBodyProps, c as CardLinkProps, d as CardImage, f as CardImageProps, g as CardGroupProps, h as CardGroup, i as CardTextProps, l as CardImageOverlay, m as CardHeaderProps, n as CardTitleProps, o as CardSubtitleProps, p as CardHeader, r as CardText, s as CardLink, t as CardTitle, u as CardImageOverlayProps, v as CardFooterProps, x as Card, y as CardBody } from "./chunks/index-NGgDkhyn.js";
 export { Card, CardBody, type CardBodyProps, CardFooter, type CardFooterProps, CardGroup, type CardGroupProps, CardHeader, type CardHeaderProps, CardImage, CardImageOverlay, type CardImageOverlayProps, type CardImageProps, CardLink, type CardLinkProps, type CardProps, CardSubtitle, type CardSubtitleProps, CardText, type CardTextProps, CardTitle, type CardTitleProps };

package/dist/card.js

@@ -1 +1 @@
-"use client";import{a as e,c as t,d as n,i as r,l as i,n as a,o,r as s,s as c,t as l,u}from"./chunks/card-YXn3bj_d.js";export{e as Card,n as CardBody,u as CardFooter,r as CardGroup,s as CardHeader,i as CardImage,a as CardImageOverlay,l as CardLink,t as CardSubtitle,c as CardText,o as CardTitle};
+"use client";import{a as e,c as t,d as n,i as r,l as i,n as a,o,r as s,s as c,t as l,u}from"./chunks/card-CTP9K8xG.js";export{e as Card,n as CardBody,u as CardFooter,r as CardGroup,s as CardHeader,i as CardImage,a as CardImageOverlay,l as CardLink,t as CardSubtitle,c as CardText,o as CardTitle};

package/dist/checkbox.d.ts

@@ -1,3 +1,3 @@
-import { t as ButtonObject } from "./chunks/renderFormCheck-DZh_5Df8.js";
-import { i as CheckboxProps, n as CheckboxGroupProps, r as Checkbox, t as CheckboxGroup } from "./chunks/index-DXjbI7Yv.js";
+import { t as ButtonObject } from "./chunks/renderFormCheck-nKgpa_a3.js";
+import { i as CheckboxProps, n as CheckboxGroupProps, r as Checkbox, t as CheckboxGroup } from "./chunks/index-DM01FX3a.js";
 export { type ButtonObject, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps };

package/dist/checkbox.js

@@ -1 +1 @@
-"use client";import{n as e,t}from"./chunks/checkbox-ChACalAw.js";export{e as Checkbox,t as CheckboxGroup};
+"use client";import{n as e,t}from"./chunks/checkbox-ZyQn5Ku5.js";export{e as Checkbox,t as CheckboxGroup};

package/dist/chip.d.ts

@@ -1,2 +1,2 @@
-import { n as ChipProps, t as Chip } from "./chunks/index-COsIPd8L.js";
+import { n as ChipProps, t as Chip } from "./chunks/index-B1kw0jzM.js";
 export { Chip, type ChipProps };

package/dist/chunks/{Button-Cptd4Yk7.d.ts → Button-BuZ_GOHS.d.ts}

@@ -1,5 +1,5 @@
 import { r as PolymorphicRefWithFallback, t as PolymorphicComponentProps } from "./polymorphic-CVHbTHSN.js";
-import { a as Shapes, n as ContextColor, r as ContextStyle } from "./types-CS_40Txv.js";
+import { i as ContextStyle, r as ContextColor, s as Shapes } from "./types-D6FM7bYR.js";
 import { ElementType, MouseEventHandler, ReactElement } from "react";
 //#region src/components/button/Button.d.ts
 type ButtonOwnProps<C extends ElementType> = {
@@ -63,4 +63,4 @@ type ButtonComponent = (<C extends ElementType = 'button'>(props: ButtonProps<C>
 declare const Button: ButtonComponent;
 //#endregion
 export { ButtonProps as n, Button as t };
-//# sourceMappingURL=Button-Cptd4Yk7.d.ts.map
+//# sourceMappingURL=Button-BuZ_GOHS.d.ts.map

package/dist/chunks/{Link-nrd0JWlO.d.ts → Link-CKymd2ru.d.ts}

@@ -1,5 +1,5 @@
 import { n as PolymorphicRef, t as PolymorphicComponentProps } from "./polymorphic-CVHbTHSN.js";
-import { n as ContextColor } from "./types-CS_40Txv.js";
+import { r as ContextColor } from "./types-D6FM7bYR.js";
 import { ElementType, MouseEventHandler, ReactElement } from "react";
 //#region src/components/link/Link.d.ts
 type LinkOwnProps<C extends ElementType> = {
@@ -68,4 +68,4 @@ type LinkComponent = (<C extends ElementType = 'a'>(props: LinkProps<C> & {
 declare const Link: LinkComponent;
 //#endregion
 export { LinkProps as n, Link as t };
-//# sourceMappingURL=Link-nrd0JWlO.d.ts.map
+//# sourceMappingURL=Link-CKymd2ru.d.ts.map

package/dist/chunks/Link-DyZyAQFj.js

@@ -0,0 +1,2 @@
+import{d as e,f as t,g as n,p as r}from"./slot-CNhFZdHF.js";import{t as i}from"./useForkedRef-DVEfT-KI.js";import{t as a}from"./polymorphic-BhGNZQja.js";import{t as o}from"./useButtonSemantics-CILM_lhi.js";import{t as s}from"./useDisabledAnchorGuard-Cz58UCXy.js";import{i as c}from"./colorClassNames-CEh5Yzfp.js";import{n as l}from"./scrollspy-D_lPjb92.js";import u from"react";import d from"classnames";import{mergeProps as f}from"react-aria";function p({children:a,active:p,className:m,color:h,component:g,disabled:_,href:v,iconLink:y,onClick:b,reset:x,stretched:S,type:C=`button`,...w},T){let E=r(g,v,`a`),D=n(E,v,w),O=t(D),k=D===`component`,A=l(_),j=A.onClick,M=s(D===`anchor`,_,j?e=>{b?.(e),j(e)}:b),N=!O&&!k&&!!b,{buttonProps:P,forkedRef:F}=o(T,{disabled:_,onClick:b}),I=N?F:T,L=i(I,A.ref),R=p||!!A.mark,z=p?`page`:A.mark===`current`?`true`:void 0,B=d(h&&c[h],{"icon-link":y,"fg-reset":x,"stretched-link":S},{active:R,disabled:_},m);return u.createElement(E,{...f(w,N?P:{}),className:B,...e(D,v,`Link`),...z&&{"aria-current":z},...D===`anchor`&&_&&{"aria-disabled":!0,tabIndex:-1},...!N&&{onClick:M},...D===`button`&&{disabled:_,type:C},ref:A.ref?L:I},a)}const m=a(p,`Link`);export{m as t};
+//# sourceMappingURL=Link-DyZyAQFj.js.map

package/dist/chunks/Link-DyZyAQFj.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Link-DyZyAQFj.js","names":[],"sources":["../../src/components/link/Link.tsx"],"sourcesContent":["import React, {\n  ElementType,\n  ForwardRefRenderFunction,\n  MouseEventHandler,\n  ReactElement,\n  Ref\n} from 'react'\nimport classNames from 'classnames'\nimport { mergeProps } from 'react-aria'\n\nimport { ContextColor } from '../../types'\nimport { LINK_COLOR_CLASS_NAMES } from '../../utils/colorClassNames'\nimport { useButtonSemantics, useDisabledAnchorGuard, useForkedRef } from '../../hooks'\nimport { hrefProps, isInteractiveKind, linkElement, resolveLinkKind } from '../../utils/elementKind'\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\nimport { useScrollspyLink } from '../../utils/scrollspy'\n\ntype LinkOwnProps<C extends ElementType> = {\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 component.\n   */\n  className?: string\n  /**\n   * Sets the link color to one of Chassis context colors, including its interactive\n   * (`:hover`/`:focus`/`:active`/`:visited`) states.\n   */\n  color?: ContextColor\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   * Toggle the disabled state for the component.\n   */\n  disabled?: boolean\n  /**\n   * The href attribute specifies the URL of the page the link goes to. Reaches an `<a>` or a\n   * component reference (a router link); dropped, with a warning in development, when\n   * `component` is another element. Declared explicitly here — rather than left to flow through\n   * generically from whatever `C` is — so consumers that wrap `Link` (`MenuItem`, `ListItem`,\n   * `NavLink`) can read it with a concrete type regardless of `component`.\n   */\n  href?: string\n  /**\n   * Fires on click.\n   */\n  onClick?: MouseEventHandler<HTMLElement>\n  /**\n   * Aligns a leading or trailing icon with the link text using flexbox, with a gap between\n   * them and an offset underline. Icons need to be passed as `children` alongside the text.\n   * Named `iconLink` rather than `icon` to avoid colliding with components (e.g. `MenuItem`)\n   * that already have their own, differently-typed `icon` prop for the icon content itself.\n   */\n  iconLink?: boolean\n  /**\n   * Removes the foreground color override, so the link inherits its color from the nearest\n   * ancestor instead of the default link color.\n   */\n  reset?: boolean\n  /**\n   * Expands the link's click target to fill its positioned ancestor (the nearest ancestor with\n   * a `position` other than `static`).\n   */\n  stretched?: boolean\n  /**\n   * Specifies the type of button. Only applies when `component=\"button\"`. Different browsers may\n   * use different default types for the `<button>` element, so always specify it explicitly.\n   */\n  type?: 'button' | 'submit' | 'reset'\n}\n\nexport type LinkProps<C extends ElementType = 'a'> = PolymorphicComponentProps<C, LinkOwnProps<C>>\n\ntype LinkComponent = (<C extends ElementType = 'a'>(\n  props: LinkProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction LinkRender<C extends ElementType = 'a'>(\n  {\n    children,\n    active,\n    className,\n    color,\n    component,\n    disabled,\n    href,\n    iconLink,\n    onClick,\n    reset,\n    stretched,\n    type = 'button',\n    ...rest\n  }: LinkProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = linkElement(component, href, 'a')\n  // The kind rather than the tag, counting a router link with `href` or `to` as an anchor: under `asChild`, `Component` is a `Slot` standing in for the\n  // caller's element, and a slotted `<a>` needs what `component=\"a\"` gets.\n  const kind = resolveLinkKind(Component, href, rest)\n\n  const isInteractive = isInteractiveKind(kind)\n  // A component reference without a link target (a router link with `href` or `to` is an anchor,\n  // see `resolveLinkKind`) has its own visual identity and is trusted to\n  // handle its own keyboard/role semantics, same as `CloseButton`'s `isComponentReference` escape\n  // hatch — synthesizing `role=\"button\"` and Enter/Space handling on top of it would stamp the\n  // wrong ARIA role onto whatever it actually renders (e.g. an `<a>`) and can double-fire a click\n  // (native anchor Enter→click, plus the synthesized keydown→click).\n  const isComponentReference = kind === 'component'\n  // Inside a `Scrollspy`, the link registers its element, is marked when its section is the one\n  // being read, and scrolls to it smoothly when the `Scrollspy` is set to (`src/utils/scrollspy.ts`).\n  const spy = useScrollspyLink(disabled)\n  const spyClick = spy.onClick\n  const clickHandler: MouseEventHandler<HTMLElement> | undefined = spyClick\n    ? (event) => {\n        onClick?.(event)\n        spyClick(event)\n      }\n    : onClick\n  // `<a>` has no real `disabled` attribute, so a disabled anchor link still fires click (and\n  // still navigates) unless it's blocked here, same guard `Button`/`CloseButton` apply. A real\n  // `<button>` already stops clicks on its own once the `disabled` attribute below is set.\n  const handleClick = useDisabledAnchorGuard<HTMLElement>(kind === 'anchor', disabled, clickHandler)\n\n  // A `component` that isn't a native interactive element gets a raw onClick with no\n  // keyboard semantics otherwise — mouse-only, unlike `Button`/`CloseButton`, which\n  // synthesize this via `useButtonSemantics` for exactly this \"arbitrary component\" case. A\n  // component reference is excluded (see `isComponentReference` above).\n  const needsButtonSemantics = !isInteractive && !isComponentReference && !!onClick\n  const { buttonProps, forkedRef } = useButtonSemantics<HTMLElement>(ref as Ref<HTMLElement>, {\n    disabled,\n    onClick\n  })\n  const ownRef = needsButtonSemantics ? forkedRef : ref\n  const spyRef = useForkedRef(ownRef as Ref<HTMLElement>, spy.ref)\n  // A link to the section being read is `active` and `aria-current=\"true\"`: the current place in\n  // the page, not the current page. A link it belongs under, such as its menu's toggle, only\n  // looks active. An `active` given as a prop wins.\n  const isActive = active || !!spy.mark\n  const ariaCurrent = active ? 'page' : spy.mark === 'current' ? 'true' : undefined\n\n  const _className = classNames(\n    color && LINK_COLOR_CLASS_NAMES[color],\n    { 'icon-link': iconLink, 'fg-reset': reset, 'stretched-link': stretched },\n    { active: isActive, disabled },\n    className\n  )\n\n  return (\n    <Component\n      {...(mergeProps(rest, needsButtonSemantics ? buttonProps : {}) as Record<string, unknown>)}\n      className={_className}\n      {...hrefProps(kind, href, 'Link')}\n      {...(ariaCurrent && { 'aria-current': ariaCurrent })}\n      {...(kind === 'anchor' && disabled && { 'aria-disabled': true, tabIndex: -1 })}\n      {...(!needsButtonSemantics && { onClick: handleClick })}\n      {...(kind === 'button' && { disabled, type })}\n      ref={spy.ref ? spyRef : ownRef}\n    >\n      {children}\n    </Component>\n  )\n}\n\nexport const Link = createPolymorphicComponent<LinkComponent>(\n  LinkRender as ForwardRefRenderFunction<Element, LinkProps<ElementType>>,\n  'Link'\n)\n"],"mappings":"4bAqFA,SAAS,EACP,CACE,WACA,SACA,YACA,QACA,YACA,WACA,OACA,WACA,UACA,QACA,YACA,OAAO,SACP,GAAG,GAEL,EACA,CACA,IAAM,EAAY,EAAY,EAAW,EAAM,GAAG,EAG5C,EAAO,EAAgB,EAAW,EAAM,CAAI,EAE5C,EAAgB,EAAkB,CAAI,EAOtC,EAAuB,IAAS,YAGhC,EAAM,EAAiB,CAAQ,EAC/B,EAAW,EAAI,QAUf,EAAc,EAAoC,IAAS,SAAU,EATV,EAC5D,GAAU,CACT,IAAU,CAAK,EACf,EAAS,CAAK,CAChB,EACA,CAI6F,EAM3F,EAAuB,CAAC,GAAiB,CAAC,GAAwB,CAAC,CAAC,EACpE,CAAE,cAAa,aAAc,EAAgC,EAAyB,CAC1F,WACA,SACF,CAAC,EACK,EAAS,EAAuB,EAAY,EAC5C,EAAS,EAAa,EAA4B,EAAI,GAAG,EAIzD,EAAW,GAAU,CAAC,CAAC,EAAI,KAC3B,EAAc,EAAS,OAAS,EAAI,OAAS,UAAY,OAAS,IAAA,GAElE,EAAa,EACjB,GAAS,EAAuB,GAChC,CAAE,YAAa,EAAU,WAAY,EAAO,iBAAkB,CAAU,EACxE,CAAE,OAAQ,EAAU,UAAS,EAC7B,CACF,EAEA,OACE,EAAA,cAAC,EAAD,CACE,GAAK,EAAW,EAAM,EAAuB,EAAc,CAAC,CAAC,EAC7D,UAAW,EACX,GAAI,EAAU,EAAM,EAAM,MAAM,EAChC,GAAK,GAAe,CAAE,eAAgB,CAAY,EAClD,GAAK,IAAS,UAAY,GAAY,CAAE,gBAAiB,GAAM,SAAU,EAAG,EAC5E,GAAK,CAAC,GAAwB,CAAE,QAAS,CAAY,EACrD,GAAK,IAAS,UAAY,CAAE,WAAU,MAAK,EAC3C,IAAK,EAAI,IAAM,EAAS,CAGf,EADR,CACQ,CAEf,CAEA,MAAa,EAAO,EAClB,EACA,MACF"}

package/dist/chunks/{MenuToggle-BdQtF7FV.js → MenuToggle-7RQ0dmtZ.js}

@@ -1,2 +1,2 @@
-import{d as e,g as t,p as n,u as r}from"./slot-CNhFZdHF.js";import{t as i}from"./useForkedRef-DVEfT-KI.js";import{t as a}from"./polymorphic-BhGNZQja.js";import{n as o,t as s}from"./Portal-CgeR1WXV.js";import{t as c}from"./renderMenuItemContent-DUezZrpj.js";import{t as l}from"./Link-CZsWCnQb.js";import{t as u}from"./Button-BoymWE-L.js";import{n as d}from"./Menu-CSBg2Zmc.js";import f,{createContext as p,forwardRef as m,useContext as h,useEffect as g,useRef as _}from"react";import v from"classnames";import{mergeProps as y,useButton as b}from"react-aria";const x=m(({className:e,...t},n)=>{let r=v(`menu-divider`,e);return f.createElement(`hr`,{className:r,...t,ref:n})});x.displayName=`MenuDivider`;function S({children:e,className:t,component:n,role:r=`presentation`,...i},a){let o=n??`h4`,s=v(`menu-header`,t);return f.createElement(o,{className:s,role:r,...i,ref:a},e)}const C=a(S,`MenuHeader`);function w({children:e,className:t,component:r,description:i,href:a,icon:o,onClick:s,selected:u,...d},p){let m=v(`menu-item`,{selected:u},t);return f.createElement(l,{role:`menuitem`,component:n(r,a,`button`),href:a,onClick:e=>{a===`#`&&e.preventDefault(),s?.(e)},...d,className:m,ref:p},c({icon:o,label:e,description:i}))}const T=a(w,`MenuItem`),E=`:is(.menu-item, .submenu-back):not(.disabled):not(:disabled)`,D=e=>!!(e.offsetWidth||e.offsetHeight||e.getClientRects().length),O=e=>{if(!e)return[];let t=[];for(let n of Array.from(e.children))if(n.matches(E))t.push(n);else if(n.classList.contains(`submenu`)){let e=Array.from(n.children).find(e=>e.matches(E));e&&t.push(e)}return t.filter(D)},k=(e,t)=>{e.length&&(t===`first`?e[0]:e[e.length-1]).focus()},A=(e,{onArrowLeft:t,onArrowRight:n,onEscape:r})=>{let i=e.currentTarget,a=e.target;switch(e.key){case`ArrowDown`:case`ArrowUp`:{e.preventDefault(),e.stopPropagation();let t=O(i);if(!t.length)return;let n=t.indexOf(a);t[n===-1?e.key===`ArrowDown`?0:t.length-1:(n+(e.key===`ArrowDown`?1:-1)+t.length)%t.length].focus();return}case`Home`:case`End`:e.preventDefault(),e.stopPropagation(),k(O(i),e.key===`Home`?`first`:`last`);return;case`Escape`:if(!r)return;e.preventDefault(),e.stopPropagation(),r();return;case`ArrowLeft`:if(!t)return;e.preventDefault(),e.stopPropagation(),t();return;case`ArrowRight`:if(!n)return;e.preventDefault(),e.stopPropagation(),n();return}},j=p(null),M=()=>{let e=_(null);if(!e.current){let t=new Map;e.current={register:(e,n)=>(t.set(e,n),()=>{t.delete(e)}),notifyOpen:e=>{t.forEach((t,n)=>{n!==e&&t()})}}}return e.current},N=p(null),P=e=>e.type===`header`?f.createElement(C,{key:e.id},e.label):e.type===`divider`?f.createElement(x,{key:e.id}):f.createElement(T,{key:e.id,href:e.href,disabled:e.disabled,selected:e.selected,onClick:e.onClick},c({icon:e.icon,label:e.label,description:e.description,selected:e.selected}));function F({children:e,className:t,component:n,items:r,onKeyDown:a,...c},l){let u=n??`div`,{close:p,container:m,focusStrategy:_,menuId:y,menuStyle:b,overlayRef:x,placementAttr:S,triggerId:C,visible:w}=h(d),T=i(l,x),E=M(),D=o(),N=w&&D;g(()=>{w&&_&&k(O(x.current),_===`last`?`last`:`first`)},[w,_]);let F=e=>{A(e,{onEscape:p}),a?.(e)},I=c[`aria-label`]?void 0:C||void 0,L=f.createElement(u,{role:`menu`,id:y,"aria-labelledby":I,className:v(`menu`,{show:N},t),style:b,"data-cx-placement":S,...c,onKeyDown:F,ref:T},f.createElement(j.Provider,{value:E},r?r.map(P):e));return m?f.createElement(s,{container:m===!0?void 0:m},L):L}const I=a(F,`MenuList`);function L({children:n,caret:a=!0,className:o,component:s,href:c,onClick:l,onKeyDown:p,tabIndex:m,...g},x){let{hide:S,menuTriggerProps:C,reference:w,targetRef:T,toggleNodeRef:E,visible:D}=h(d),O=s??u,k=_(null),A=O===u?r(c)?`anchor`:`button`:t(O,c,g),j=A===`button`,M=O===u?{href:c}:e(A,c,`MenuToggle`),{buttonProps:N}=b({...C,elementType:j?`button`:`a`},k),P=_(!1),F=i(x,e=>{k.current=e,E.current=e,w!==`parent`&&(T.current=e)}),I=e=>{P.current=e.pointerType!==`touch`&&D},L=e=>{e.preventDefault(),e.stopPropagation(),P.current&&(P.current=!1,S()),l?.(e)};return f.createElement(O,{...j?{type:`button`}:{},className:v({caret:a,show:D},o),...y({onPointerDown:I},g,N,{onClick:L,onKeyDown:p,...m!==void 0&&{tabIndex:m}}),...M,ref:F},n)}const R=a(L,`MenuToggle`);export{M as a,A as c,x as d,j as i,T as l,I as n,k as o,N as r,O as s,R as t,C as u};
-//# sourceMappingURL=MenuToggle-BdQtF7FV.js.map
+import{d as e,g as t,p as n,u as r}from"./slot-CNhFZdHF.js";import{t as i}from"./useForkedRef-DVEfT-KI.js";import{t as a}from"./polymorphic-BhGNZQja.js";import{n as o,t as s}from"./Portal-CgeR1WXV.js";import{t as c}from"./renderMenuItemContent-DUezZrpj.js";import{t as l}from"./Link-DyZyAQFj.js";import{t as u}from"./Button-BoymWE-L.js";import{n as d}from"./Menu-CSBg2Zmc.js";import f,{createContext as p,forwardRef as m,useContext as h,useEffect as g,useRef as _}from"react";import v from"classnames";import{mergeProps as y,useButton as b}from"react-aria";const x=m(({className:e,...t},n)=>{let r=v(`menu-divider`,e);return f.createElement(`hr`,{className:r,...t,ref:n})});x.displayName=`MenuDivider`;function S({children:e,className:t,component:n,role:r=`presentation`,...i},a){let o=n??`h4`,s=v(`menu-header`,t);return f.createElement(o,{className:s,role:r,...i,ref:a},e)}const C=a(S,`MenuHeader`);function w({children:e,className:t,component:r,description:i,href:a,icon:o,onClick:s,selected:u,...d},p){let m=v(`menu-item`,{selected:u},t);return f.createElement(l,{role:`menuitem`,component:n(r,a,`button`),href:a,onClick:e=>{a===`#`&&e.preventDefault(),s?.(e)},...d,className:m,ref:p},c({icon:o,label:e,description:i}))}const T=a(w,`MenuItem`),E=`:is(.menu-item, .submenu-back):not(.disabled):not(:disabled)`,D=e=>!!(e.offsetWidth||e.offsetHeight||e.getClientRects().length),O=e=>{if(!e)return[];let t=[];for(let n of Array.from(e.children))if(n.matches(E))t.push(n);else if(n.classList.contains(`submenu`)){let e=Array.from(n.children).find(e=>e.matches(E));e&&t.push(e)}return t.filter(D)},k=(e,t)=>{e.length&&(t===`first`?e[0]:e[e.length-1]).focus()},A=(e,{onArrowLeft:t,onArrowRight:n,onEscape:r})=>{let i=e.currentTarget,a=e.target;switch(e.key){case`ArrowDown`:case`ArrowUp`:{e.preventDefault(),e.stopPropagation();let t=O(i);if(!t.length)return;let n=t.indexOf(a);t[n===-1?e.key===`ArrowDown`?0:t.length-1:(n+(e.key===`ArrowDown`?1:-1)+t.length)%t.length].focus();return}case`Home`:case`End`:e.preventDefault(),e.stopPropagation(),k(O(i),e.key===`Home`?`first`:`last`);return;case`Escape`:if(!r)return;e.preventDefault(),e.stopPropagation(),r();return;case`ArrowLeft`:if(!t)return;e.preventDefault(),e.stopPropagation(),t();return;case`ArrowRight`:if(!n)return;e.preventDefault(),e.stopPropagation(),n();return}},j=p(null),M=()=>{let e=_(null);if(!e.current){let t=new Map;e.current={register:(e,n)=>(t.set(e,n),()=>{t.delete(e)}),notifyOpen:e=>{t.forEach((t,n)=>{n!==e&&t()})}}}return e.current},N=p(null),P=e=>e.type===`header`?f.createElement(C,{key:e.id},e.label):e.type===`divider`?f.createElement(x,{key:e.id}):f.createElement(T,{key:e.id,href:e.href,disabled:e.disabled,selected:e.selected,onClick:e.onClick},c({icon:e.icon,label:e.label,description:e.description,selected:e.selected}));function F({children:e,className:t,component:n,items:r,onKeyDown:a,...c},l){let u=n??`div`,{close:p,container:m,focusStrategy:_,menuId:y,menuStyle:b,overlayRef:x,placementAttr:S,triggerId:C,visible:w}=h(d),T=i(l,x),E=M(),D=o(),N=w&&D;g(()=>{w&&_&&k(O(x.current),_===`last`?`last`:`first`)},[w,_]);let F=e=>{A(e,{onEscape:p}),a?.(e)},I=c[`aria-label`]?void 0:C||void 0,L=f.createElement(u,{role:`menu`,id:y,"aria-labelledby":I,className:v(`menu`,{show:N},t),style:b,"data-cx-placement":S,...c,onKeyDown:F,ref:T},f.createElement(j.Provider,{value:E},r?r.map(P):e));return m?f.createElement(s,{container:m===!0?void 0:m},L):L}const I=a(F,`MenuList`);function L({children:n,caret:a=!0,className:o,component:s,href:c,onClick:l,onKeyDown:p,tabIndex:m,...g},x){let{hide:S,menuTriggerProps:C,reference:w,targetRef:T,toggleNodeRef:E,visible:D}=h(d),O=s??u,k=_(null),A=O===u?r(c)?`anchor`:`button`:t(O,c,g),j=A===`button`,M=O===u?{href:c}:e(A,c,`MenuToggle`),{buttonProps:N}=b({...C,elementType:j?`button`:`a`},k),P=_(!1),F=i(x,e=>{k.current=e,E.current=e,w!==`parent`&&(T.current=e)}),I=e=>{P.current=e.pointerType!==`touch`&&D},L=e=>{e.preventDefault(),e.stopPropagation(),P.current&&(P.current=!1,S()),l?.(e)};return f.createElement(O,{...j?{type:`button`}:{},className:v({caret:a,show:D},o),...y({onPointerDown:I},g,N,{onClick:L,onKeyDown:p,...m!==void 0&&{tabIndex:m}}),...M,ref:F},n)}const R=a(L,`MenuToggle`);export{M as a,A as c,x as d,j as i,T as l,I as n,k as o,N as r,O as s,R as t,C as u};
+//# sourceMappingURL=MenuToggle-7RQ0dmtZ.js.map

package/dist/chunks/{MenuToggle-BdQtF7FV.js.map → MenuToggle-7RQ0dmtZ.js.map}

@@ -1 +1 @@
-{"version":3,"file":"MenuToggle-BdQtF7FV.js","names":[],"sources":["../../src/components/menu/MenuDivider.tsx","../../src/components/menu/MenuHeader.tsx","../../src/components/menu/MenuItem.tsx","../../src/components/menu/menuNavigation.ts","../../src/components/menu/submenuGroup.ts","../../src/components/menu/MenuList.tsx","../../src/components/menu/MenuToggle.tsx"],"sourcesContent":["import React, { forwardRef, HTMLAttributes } from 'react'\nimport classNames from 'classnames'\n\nexport interface MenuDividerProps extends HTMLAttributes<HTMLHRElement> {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n}\n\nexport const MenuDivider = forwardRef<HTMLHRElement, MenuDividerProps>(\n  ({ className, ...rest }, ref) => {\n    const _className = classNames('menu-divider', className)\n\n    return <hr className={_className} {...rest} ref={ref} />\n  }\n)\n\nMenuDivider.displayName = 'MenuDivider'\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 MenuHeaderOwnProps<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   * ARIA role applied to the root node. Defaults to `'presentation'` — see the render function\n   * for why.\n   */\n  role?: React.AriaRole\n}\n\nexport type MenuHeaderProps<C extends ElementType = 'h4'> = PolymorphicComponentProps<\n  C,\n  MenuHeaderOwnProps<C>\n>\n\ntype MenuHeaderComponent = (<C extends ElementType = 'h4'>(\n  props: MenuHeaderProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction MenuHeaderRender<C extends ElementType = 'h4'>(\n  { children, className, component, role = 'presentation', ...rest }: MenuHeaderProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'h4'\n  const _className = classNames('menu-header', className)\n\n  // Always rendered as a direct child of `role=\"menu\"` (see MenuList) — ARIA's menu role only\n  // permits menuitem/group/separator children, so a bare heading fails aria-required-children.\n  // `role=\"presentation\"` opts the element itself out without hiding its text content.\n  return (\n    <Component className={_className} role={role} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const MenuHeader = createPolymorphicComponent<MenuHeaderComponent>(\n  MenuHeaderRender as ForwardRefRenderFunction<Element, MenuHeaderProps<ElementType>>,\n  'MenuHeader'\n)\n","import React, {\n  ElementType,\n  ForwardRefRenderFunction,\n  MouseEvent,\n  ReactElement,\n  ReactNode\n} from 'react'\nimport classNames from 'classnames'\n\nimport { linkElement } from '../../utils/elementKind'\nimport {\n  createPolymorphicComponent,\n  PolymorphicRef,\n  PolymorphicRefWithFallback\n} from '../../utils/polymorphic'\nimport { renderMenuItemContent } from '../../utils/renderMenuItemContent'\nimport { LinkProps, Link } from '../link/Link'\n\ntype MenuItemOwnProps = {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Secondary line of text rendered below `children` (`.menu-item-description`).\n   */\n  description?: ReactNode\n  /**\n   * Icon rendered at the item's leading edge (`.menu-item-icon`).\n   */\n  icon?: ReactNode\n  /**\n   * Marks the item as the current selection in a choice list. Renders in a heavier font weight.\n   * Combine with a manually-composed `.menu-item-check` icon (in `children`, or via `icon` on a\n   * plain, non-selection item) to also show a checkmark — this prop alone doesn't add one, so\n   * existing font-weight-only usage keeps rendering unchanged.\n   */\n  selected?: boolean\n}\n\nexport type MenuItemProps<C extends ElementType = 'a'> = LinkProps<C> & MenuItemOwnProps\n\ntype MenuItemComponent = (<C extends ElementType = 'a'>(\n  props: MenuItemProps<C> & {\n    ref?: PolymorphicRefWithFallback<C, HTMLAnchorElement | HTMLButtonElement>\n  }\n) => ReactElement | null) & { displayName?: string }\n\nfunction MenuItemRender<C extends ElementType = 'a'>(\n  {\n    children,\n    className,\n    component,\n    description,\n    href,\n    icon,\n    onClick,\n    selected,\n    ...rest\n  }: MenuItemProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const _className = classNames('menu-item', { selected }, className)\n\n  // `href=\"#\"` is a common placeholder for menu items that act via `onClick` rather than\n  // real navigation. Left alone, a plain anchor click still navigates to the empty fragment,\n  // which scrolls the page to the top — so we suppress that default for the placeholder case\n  // only, leaving real same-page anchors (`href=\"#some-id\"`) free to navigate as expected.\n  const handleClick = (event: MouseEvent<HTMLAnchorElement | HTMLButtonElement>) => {\n    if (href === '#') event.preventDefault()\n    onClick?.(event)\n  }\n\n  // An item with `href` is an `<a>`, one without is a `<button type=\"button\">`, unless `component`\n  // or `asChild` chose the element (see `linkElement`). chassis-css styles both as `.menu-item`.\n  // An item without `href` used to be an `<a>` with no `href`, which isn't focusable, so keyboard\n  // users couldn't reach it outside the menu's own arrow-key handling.\n  return (\n    <Link\n      role=\"menuitem\"\n      component={linkElement(component as ElementType | undefined, href, 'button')}\n      href={href}\n      onClick={handleClick}\n      {...(rest as Record<string, unknown>)}\n      className={_className}\n      ref={ref as PolymorphicRef<ElementType>}\n    >\n      {renderMenuItemContent({ icon, label: children, description })}\n    </Link>\n  )\n}\n\nexport const MenuItem = createPolymorphicComponent<MenuItemComponent>(\n  MenuItemRender as ForwardRefRenderFunction<Element, MenuItemProps<ElementType>>,\n  'MenuItem'\n)\n","import React from 'react'\n\n// Mirrors Chassis CSS's menu.js SELECTOR_VISIBLE_ITEMS / SELECTOR_KB_NAV_ITEMS: direct-child\n// menu items and submenu-back buttons, plus submenu trigger items nested one level inside a\n// `.submenu` wrapper (which aren't direct children of the `.menu`).\n//\n// Walks `children` directly rather than a `:scope`-based `querySelectorAll` — jsdom's selector\n// engine (nwsapi) mis-parses `:scope` queries against an element whose `id` contains a colon,\n// which is exactly the shape of React 18's default `useId()` output now that `MenuList`/\n// `MenuSubmenu` set a real `id` for `aria-controls`/`aria-labelledby` linking. Real browsers don't\n// have this bug, but walking children is just as correct and sidesteps it either way.\nconst VISIBLE_ITEMS_SELECTOR = ':is(.menu-item, .submenu-back):not(.disabled):not(:disabled)'\n\nconst isVisible = (element: HTMLElement) =>\n  Boolean(element.offsetWidth || element.offsetHeight || element.getClientRects().length)\n\nexport const getMenuItems = (menu: HTMLElement | null): HTMLElement[] => {\n  if (!menu) return []\n  const items: HTMLElement[] = []\n  for (const child of Array.from(menu.children)) {\n    if (child.matches(VISIBLE_ITEMS_SELECTOR)) {\n      items.push(child as HTMLElement)\n    } else if (child.classList.contains('submenu')) {\n      const trigger = Array.from(child.children).find((grandchild) =>\n        grandchild.matches(VISIBLE_ITEMS_SELECTOR)\n      )\n      if (trigger) items.push(trigger as HTMLElement)\n    }\n  }\n  return items.filter(isVisible)\n}\n\nexport const focusMenuItem = (items: HTMLElement[], target: 'first' | 'last') => {\n  if (!items.length) return\n  ;(target === 'first' ? items[0]! : items[items.length - 1]!).focus()\n}\n\nexport interface MenuKeyDownOptions {\n  onArrowLeft?: () => void\n  onArrowRight?: () => void\n  onEscape?: () => void\n}\n\n// Scoped to `event.currentTarget` (the `.menu` element the handler is bound to), so the same\n// function drives keyboard navigation for both the top-level menu and any nested submenu list.\n// `onArrowLeft`/`onArrowRight` are both optional and independent (rather than a single\n// direction-agnostic \"close\" callback) so a caller under an RTL locale can wire the one that\n// actually points back toward the trigger — see `MenuSubmenu`, the only current consumer of\n// either.\nexport const handleMenuKeyDown = (\n  event: React.KeyboardEvent<HTMLElement>,\n  { onArrowLeft, onArrowRight, onEscape }: MenuKeyDownOptions\n): void => {\n  const menu = event.currentTarget\n  const target = event.target as HTMLElement\n\n  switch (event.key) {\n    case 'ArrowDown':\n    case 'ArrowUp': {\n      event.preventDefault()\n      event.stopPropagation()\n      const items = getMenuItems(menu)\n      if (!items.length) return\n      const currentIndex = items.indexOf(target)\n      const nextIndex =\n        currentIndex === -1\n          ? event.key === 'ArrowDown'\n            ? 0\n            : items.length - 1\n          : (currentIndex + (event.key === 'ArrowDown' ? 1 : -1) + items.length) % items.length\n      // `nextIndex` is always a valid index into `items` here (0, items.length - 1, or a modulo\n      // result — the `if (!items.length) return` above already ruled out the empty-array case).\n      items[nextIndex]!.focus()\n      return\n    }\n    case 'Home':\n    case 'End': {\n      event.preventDefault()\n      event.stopPropagation()\n      focusMenuItem(getMenuItems(menu), event.key === 'Home' ? 'first' : 'last')\n      return\n    }\n    case 'Escape': {\n      if (!onEscape) return\n      event.preventDefault()\n      event.stopPropagation()\n      onEscape()\n      return\n    }\n    case 'ArrowLeft': {\n      if (!onArrowLeft) return\n      event.preventDefault()\n      event.stopPropagation()\n      onArrowLeft()\n      return\n    }\n    case 'ArrowRight': {\n      if (!onArrowRight) return\n      event.preventDefault()\n      event.stopPropagation()\n      onArrowRight()\n      return\n    }\n    default:\n  }\n}\n","import { createContext, useRef } from 'react'\n\n// Lets sibling `.submenu` flyouts at the same menu level close one another when a new one\n// opens, mirroring menu.js's `_closeSiblingSubmenus`. One provider instance is created per\n// menu level (the top-level `.menu` and each `.submenu`'s own nested list) and lives for the\n// lifetime of that level, so registration doesn't churn on every render.\nexport interface SubmenuGroupContextValue {\n  register: (id: string, close: () => void) => () => void\n  notifyOpen: (id: string) => void\n}\n\nexport const SubmenuGroupContext = createContext<SubmenuGroupContextValue | null>(null)\n\nexport const useSubmenuGroupProvider = (): SubmenuGroupContextValue => {\n  const ref = useRef<SubmenuGroupContextValue | null>(null)\n\n  if (!ref.current) {\n    const closers = new Map<string, () => void>()\n    ref.current = {\n      register: (id, close) => {\n        closers.set(id, close)\n        return () => {\n          closers.delete(id)\n        }\n      },\n      notifyOpen: (id) => {\n        closers.forEach((close, key) => {\n          if (key !== id) close()\n        })\n      }\n    }\n  }\n\n  return ref.current\n}\n\n// Exposes the current `.submenu`'s own close-and-refocus action to a nested `MenuSubmenuBack`\n// button, without threading it through the sibling-group registry above.\nexport interface SubmenuActionsContextValue {\n  close: () => void\n}\n\nexport const SubmenuActionsContext = createContext<SubmenuActionsContextValue | null>(null)\n","import React, {\n  ElementType,\n  ForwardRefRenderFunction,\n  ReactElement,\n  ReactNode,\n  useContext,\n  useEffect\n} from 'react'\nimport classNames from 'classnames'\n\nimport { useForkedRef } from '../../hooks'\nimport { renderMenuItemContent } from '../../utils/renderMenuItemContent'\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\nimport { Portal, useHydrated } from '../portal/Portal'\nimport { MenuContext } from './Menu'\nimport { MenuDivider } from './MenuDivider'\nimport { MenuHeader } from './MenuHeader'\nimport { MenuItem } from './MenuItem'\nimport { MenuItemsDef } from './MenuItemDef'\nimport { focusMenuItem, getMenuItems, handleMenuKeyDown } from './menuNavigation'\nimport { SubmenuGroupContext, useSubmenuGroupProvider } from './submenuGroup'\n\ntype MenuListOwnProps<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   * Array of item/header/divider definitions for data-driven rendering. When provided, children\n   * are ignored. Covers flat items, headers, and dividers only — for nested submenus, compose\n   * with `children` and `MenuSubmenu` instead.\n   */\n  items?: MenuItemsDef\n}\n\nexport type MenuListProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  MenuListOwnProps<C>\n>\n\ntype MenuListComponent = (<C extends ElementType = 'div'>(\n  props: MenuListProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nconst renderMenuItemDef = (def: MenuItemsDef[number]): ReactNode => {\n  if (def.type === 'header') {\n    return <MenuHeader key={def.id}>{def.label}</MenuHeader>\n  }\n  if (def.type === 'divider') {\n    return <MenuDivider key={def.id} />\n  }\n  return (\n    <MenuItem\n      key={def.id}\n      href={def.href}\n      disabled={def.disabled}\n      selected={def.selected}\n      onClick={def.onClick}\n    >\n      {renderMenuItemContent({\n        icon: def.icon,\n        label: def.label,\n        description: def.description,\n        selected: def.selected\n      })}\n    </MenuItem>\n  )\n}\n\nfunction MenuListRender<C extends ElementType = 'div'>(\n  { children, className, component, items, onKeyDown, ...rest }: MenuListProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'div'\n  const {\n    close,\n    container,\n    focusStrategy,\n    menuId,\n    menuStyle,\n    overlayRef,\n    placementAttr,\n    triggerId,\n    visible\n  } = useContext(MenuContext)\n  const forkedRef = useForkedRef(ref, overlayRef)\n  const submenuGroup = useSubmenuGroupProvider()\n  // The list is positioned in a layout effect, which the server never runs: a menu open on its\n  // first render was painted at the top left of the page until the JavaScript had loaded. It is\n  // shown once hydration has finished, where that effect has placed it.\n  const hydrated = useHydrated()\n  const shown = visible && hydrated\n\n  // ArrowDown/ArrowUp on the trigger opens the menu with a focus strategy (see `Menu`'s\n  // `useMenuTrigger` wiring) — this is where that intent actually lands, since we're not\n  // adopting `useMenu`'s own collection-aware auto-focus.\n  useEffect(() => {\n    if (!visible || !focusStrategy) return\n    focusMenuItem(getMenuItems(overlayRef.current), focusStrategy === 'last' ? 'last' : 'first')\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [visible, focusStrategy])\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n    handleMenuKeyDown(event, { onEscape: close })\n    onKeyDown?.(event as React.KeyboardEvent<HTMLDivElement>)\n  }\n\n  // Labelled by the trigger, unless the caller names the list itself: `aria-labelledby` would\n  // outrank that `aria-label`. Left out when there is no trigger to point at (a `ContextMenu`'s\n  // region with no id of its own has one; a list rendered with no `Menu` around it has none).\n  const ariaLabel = (rest as { 'aria-label'?: string })['aria-label']\n  const labelledBy = ariaLabel ? undefined : triggerId || undefined\n\n  const content = (\n    <Component\n      role=\"menu\"\n      id={menuId}\n      aria-labelledby={labelledBy}\n      className={classNames('menu', { show: shown }, className)}\n      style={menuStyle}\n      data-cx-placement={placementAttr}\n      {...rest}\n      onKeyDown={handleKeyDown}\n      ref={forkedRef}\n    >\n      <SubmenuGroupContext.Provider value={submenuGroup}>\n        {items ? items.map(renderMenuItemDef) : children}\n      </SubmenuGroupContext.Provider>\n    </Component>\n  )\n\n  if (container) {\n    return <Portal container={container === true ? undefined : container}>{content}</Portal>\n  }\n\n  return content\n}\n\nexport const MenuList = createPolymorphicComponent<MenuListComponent>(\n  MenuListRender as ForwardRefRenderFunction<Element, MenuListProps<ElementType>>,\n  'MenuList'\n)\n","import React, {\n  ElementType,\n  ForwardRefRenderFunction,\n  ReactElement,\n  useContext,\n  useRef\n} from 'react'\nimport classNames from 'classnames'\nimport { mergeProps, useButton } from 'react-aria'\n\nimport { Button, ButtonProps } from '../button/Button'\nimport { MenuContext } from './Menu'\nimport { ContextColor, Shapes } from '../../types'\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\nimport { useForkedRef } from '../../hooks'\nimport { hasHref, hrefProps, resolveLinkKind } from '../../utils/elementKind'\n\ntype MenuToggleOwnProps<C extends ElementType> = {\n  /**\n   * Toggle the active state for the component.\n   */\n  active?: boolean\n  /**\n   * Draws the caret after the toggle's content. Set it to `false` for a toggle that shows what it\n   * is another way, such as an icon-only \"more\" button.\n   *\n   * @default true\n   */\n  caret?: boolean\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * Sets the color of the component to one of Chassis context colors. Only applies to the\n   * default `Button` root.\n   */\n  color?: ContextColor\n  /**\n   * Component used for the root node — the trigger element the menu opens from. Defaults to\n   * `Button`; swap for e.g. `NavLink` to render a nav-item-style trigger (`.nav-link.caret`)\n   * instead of a `.button.caret`. Its own props are type-checked at the call site once passed\n   * here.\n   */\n  component?: C\n  /**\n   * Toggle the disabled state for the component.\n   */\n  disabled?: boolean\n  /**\n   * The href attribute specifies the URL of the page the link goes to.\n   */\n  href?: string\n  /**\n   * Select the shape of the component. Only applies to the default `Button` root.\n   */\n  shape?: Shapes\n  /**\n   * Size the component sm or lg. Only applies to the default `Button` root.\n   */\n  size?: 'sm' | 'lg'\n  /**\n   * Sets the style variant of the component, as `Button`'s own `variant` does. Only applies to\n   * the default `Button` root.\n   */\n  variant?: ButtonProps['variant']\n}\n\nexport type MenuToggleProps<C extends ElementType = typeof Button> = PolymorphicComponentProps<\n  C,\n  MenuToggleOwnProps<C>\n>\n\ntype MenuToggleComponent = (<C extends ElementType = typeof Button>(\n  props: MenuToggleProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction MenuToggleRender<C extends ElementType = typeof Button>(\n  {\n    children,\n    caret = true,\n    className,\n    component,\n    href,\n    onClick,\n    onKeyDown,\n    tabIndex,\n    ...rest\n  }: MenuToggleProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const { hide, menuTriggerProps, reference, targetRef, toggleNodeRef, visible } =\n    useContext(MenuContext)\n  const Component = component ?? Button\n  const buttonRef = useRef<HTMLButtonElement | null>(null)\n  // What the root renders. The default `Button` renders a `<button>`, or an `<a>` given `href`.\n  // Anything else is asked, like every polymorphic component asks: `NavLink` is a component\n  // reference, and `component=\"button\"` a real `<button>`.\n  const kind =\n    Component === Button\n      ? hasHref(href)\n        ? 'anchor'\n        : 'button'\n      : resolveLinkKind(Component, href, rest)\n  const rendersButton = kind === 'button'\n  // `Button` applies the `href` rule itself; anything else gets `href` only if it can take one.\n  const linkProps = Component === Button ? { href } : hrefProps(kind, href, 'MenuToggle')\n  // `elementType` tells react-aria whether the rendered root already has native button\n  // semantics or needs them emulated (`role=\"button\"`, keyboard activation).\n  const { buttonProps } = useButton(\n    { ...menuTriggerProps, elementType: rendersButton ? 'button' : 'a' },\n    buttonRef\n  )\n  const wasOpenRef = useRef(false)\n\n  const setRefs = (node: HTMLButtonElement | null) => {\n    buttonRef.current = node\n    toggleNodeRef.current = node\n    if (reference !== 'parent') {\n      targetRef.current = node\n    }\n  }\n\n  const forkedRef = useForkedRef(ref, setRefs)\n\n  // react-aria's `useMenuTrigger` opens (rather than toggles) on mouse/pen press start, so\n  // re-clicking an already-open trigger would otherwise re-open it right back instead of\n  // closing it. Capture whether it was open before that happens — ours has to run ahead of\n  // `buttonProps`' own `onPointerDown` in the `mergeProps` chain below — then close it back\n  // down on click. Touch is exempt: react-aria's `onPress` already toggles it correctly there.\n  const handlePointerDown = (event: React.PointerEvent<HTMLButtonElement>) => {\n    wasOpenRef.current = event.pointerType !== 'touch' && visible\n  }\n\n  const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    event.preventDefault()\n    event.stopPropagation()\n    if (wasOpenRef.current) {\n      wasOpenRef.current = false\n      hide()\n    }\n    onClick?.(event)\n  }\n\n  return (\n    <Component\n      // A `<button>` root needs an explicit `type` to avoid an implicit form submit; other roots\n      // (e.g. `NavLink`) don't render a `<button>` at all.\n      {...(rendersButton ? { type: 'button' } : {})}\n      // The `.caret` utility (rather than styling off `[data-cx-toggle=\"menu\"]`, as the vanilla\n      // CSS docs show) keeps this element from also matching Chassis CSS's own vanilla menu.js\n      // selectors on a page that happens to load both — this component reimplements all of that\n      // behavior itself, so there's nothing for the vanilla plugin to usefully do with it anyway.\n      // `show` mirrors `MenuList`'s own `{ show: visible }` and vanilla menu.js's\n      // `this._element.classList.add('show')` — it's what puts the trigger itself into a\n      // pressed look while its menu is open (`.button.show`/`.nav-item.show .nav-link`).\n      className={classNames({ caret, show: visible }, className)}\n      {...(mergeProps({ onPointerDown: handlePointerDown }, rest, buttonProps, {\n        onClick: handleClick,\n        onKeyDown,\n        // The caller's, when it gives one: react-aria's own `tabIndex` would replace it.\n        ...(tabIndex !== undefined && { tabIndex })\n      }) as Record<string, unknown>)}\n      // After `buttonProps`: for an `<a>`, react-aria returns an `href` of its own, the one it was\n      // given, which is none.\n      {...linkProps}\n      ref={forkedRef}\n    >\n      {children}\n    </Component>\n  )\n}\n\nexport const MenuToggle = createPolymorphicComponent<MenuToggleComponent>(\n  MenuToggleRender as ForwardRefRenderFunction<Element, MenuToggleProps<ElementType>>,\n  'MenuToggle'\n)\n"],"mappings":"6iBAUA,MAAa,EAAc,GACxB,CAAE,YAAW,GAAG,GAAQ,IAAQ,CAC/B,IAAM,EAAa,EAAW,eAAgB,CAAS,EAEvD,OAAO,EAAA,cAAC,KAAD,CAAI,UAAW,EAAY,GAAI,EAAW,KAAM,CAAA,CACzD,CACF,EAEA,EAAY,YAAc,cCgB1B,SAAS,EACP,CAAE,WAAU,YAAW,YAAW,OAAO,eAAgB,GAAG,GAC5D,EACA,CACA,IAAM,EAAY,GAAa,KACzB,EAAa,EAAW,cAAe,CAAS,EAKtD,OACE,EAAA,cAAC,EAAD,CAAW,UAAW,EAAkB,OAAM,GAAI,EAAW,KAElD,EADR,CACQ,CAEf,CAEA,MAAa,EAAa,EACxB,EACA,YACF,ECNA,SAAS,EACP,CACE,WACA,YACA,YACA,cACA,OACA,OACA,UACA,WACA,GAAG,GAEL,EACA,CACA,IAAM,EAAa,EAAW,YAAa,CAAE,UAAS,EAAG,CAAS,EAelE,OACE,EAAA,cAAC,EAAD,CACE,KAAK,WACL,UAAW,EAAY,EAAsC,EAAM,QAAQ,EACrE,OACN,QAdiB,GAA6D,CAC5E,IAAS,KAAK,EAAM,eAAe,EACvC,IAAU,CAAK,CACjB,EAYI,GAAK,EACL,UAAW,EACN,KAGD,EADH,EAAsB,CAAE,OAAM,MAAO,EAAU,aAAY,CAAC,CACzD,CAEV,CAEA,MAAa,EAAW,EACtB,EACA,UACF,ECpFM,EAAyB,+DAEzB,EAAa,GACjB,GAAQ,EAAQ,aAAe,EAAQ,cAAgB,EAAQ,eAAe,CAAC,CAAC,QAErE,EAAgB,GAA4C,CACvE,GAAI,CAAC,EAAM,MAAO,CAAC,EACnB,IAAM,EAAuB,CAAC,EAC9B,IAAK,IAAM,KAAS,MAAM,KAAK,EAAK,QAAQ,EAC1C,GAAI,EAAM,QAAQ,CAAsB,EACtC,EAAM,KAAK,CAAoB,OAC1B,GAAI,EAAM,UAAU,SAAS,SAAS,EAAG,CAC9C,IAAM,EAAU,MAAM,KAAK,EAAM,QAAQ,CAAC,CAAC,KAAM,GAC/C,EAAW,QAAQ,CAAsB,CAC3C,EACI,GAAS,EAAM,KAAK,CAAsB,CAChD,CAEF,OAAO,EAAM,OAAO,CAAS,CAC/B,EAEa,GAAiB,EAAsB,IAA6B,CAC1E,EAAM,SACT,IAAW,QAAU,EAAM,GAAM,EAAM,EAAM,OAAS,GAAA,CAAK,MAAM,CACrE,EAca,GACX,EACA,CAAE,cAAa,eAAc,cACpB,CACT,IAAM,EAAO,EAAM,cACb,EAAS,EAAM,OAErB,OAAQ,EAAM,IAAd,CACE,IAAK,YACL,IAAK,UAAW,CACd,EAAM,eAAe,EACrB,EAAM,gBAAgB,EACtB,IAAM,EAAQ,EAAa,CAAI,EAC/B,GAAI,CAAC,EAAM,OAAQ,OACnB,IAAM,EAAe,EAAM,QAAQ,CAAM,EASzC,EAPE,IAAiB,GACb,EAAM,MAAQ,YACZ,EACA,EAAM,OAAS,GAChB,GAAgB,EAAM,MAAQ,YAAc,EAAI,IAAM,EAAM,QAAU,EAAM,OAGnE,CAAE,MAAM,EACxB,MACF,CACA,IAAK,OACL,IAAK,MACH,EAAM,eAAe,EACrB,EAAM,gBAAgB,EACtB,EAAc,EAAa,CAAI,EAAG,EAAM,MAAQ,OAAS,QAAU,MAAM,EACzE,OAEF,IAAK,SACH,GAAI,CAAC,EAAU,OACf,EAAM,eAAe,EACrB,EAAM,gBAAgB,EACtB,EAAS,EACT,OAEF,IAAK,YACH,GAAI,CAAC,EAAa,OAClB,EAAM,eAAe,EACrB,EAAM,gBAAgB,EACtB,EAAY,EACZ,OAEF,IAAK,aACH,GAAI,CAAC,EAAc,OACnB,EAAM,eAAe,EACrB,EAAM,gBAAgB,EACtB,EAAa,EACb,MAGJ,CACF,EC9Fa,EAAsB,EAA+C,IAAI,EAEzE,MAA0D,CACrE,IAAM,EAAM,EAAwC,IAAI,EAExD,GAAI,CAAC,EAAI,QAAS,CAChB,IAAM,EAAU,IAAI,IACpB,EAAI,QAAU,CACZ,UAAW,EAAI,KACb,EAAQ,IAAI,EAAI,CAAK,MACR,CACX,EAAQ,OAAO,CAAE,CACnB,GAEF,WAAa,GAAO,CAClB,EAAQ,SAAS,EAAO,IAAQ,CAC1B,IAAQ,GAAI,EAAM,CACxB,CAAC,CACH,CACF,CACF,CAEA,OAAO,EAAI,OACb,EAQa,EAAwB,EAAiD,IAAI,ECUpF,EAAqB,GACrB,EAAI,OAAS,SACR,EAAA,cAAC,EAAD,CAAY,IAAK,EAAI,EAA2B,EAAtB,EAAI,KAAkB,EAErD,EAAI,OAAS,UACR,EAAA,cAAC,EAAD,CAAa,IAAK,EAAI,EAAK,CAAA,EAGlC,EAAA,cAAC,EAAD,CACE,IAAK,EAAI,GACT,KAAM,EAAI,KACV,SAAU,EAAI,SACd,SAAU,EAAI,SACd,QAAS,EAAI,OAQL,EANP,EAAsB,CACrB,KAAM,EAAI,KACV,MAAO,EAAI,MACX,YAAa,EAAI,YACjB,SAAU,EAAI,QAChB,CAAC,CACO,EAId,SAAS,EACP,CAAE,WAAU,YAAW,YAAW,QAAO,YAAW,GAAG,GACvD,EACA,CACA,IAAM,EAAY,GAAa,MACzB,CACJ,QACA,YACA,gBACA,SACA,YACA,aACA,gBACA,YACA,WACE,EAAW,CAAW,EACpB,EAAY,EAAa,EAAK,CAAU,EACxC,EAAe,EAAwB,EAIvC,EAAW,EAAY,EACvB,EAAQ,GAAW,EAKzB,MAAgB,CACT,GAAY,GACjB,EAAc,EAAa,EAAW,OAAO,EAAG,IAAkB,OAAS,OAAS,OAAO,CAE7F,EAAG,CAAC,EAAS,CAAa,CAAC,EAE3B,IAAM,EAAiB,GAA4C,CACjE,EAAkB,EAAO,CAAE,SAAU,CAAM,CAAC,EAC5C,IAAY,CAA4C,CAC1D,EAMM,EADa,EAAmC,cACvB,IAAA,GAAY,GAAa,IAAA,GAElD,EACJ,EAAA,cAAC,EAAD,CACE,KAAK,OACL,GAAI,EACJ,kBAAiB,EACjB,UAAW,EAAW,OAAQ,CAAE,KAAM,CAAM,EAAG,CAAS,EACxD,MAAO,EACP,oBAAmB,EACnB,GAAI,EACJ,UAAW,EACX,IAAK,CAKI,EAHT,EAAA,cAAC,EAAoB,SAArB,CAA8B,MAAO,CAEP,EAD3B,EAAQ,EAAM,IAAI,CAAiB,EAAI,CACZ,CACrB,EAOb,OAJI,EACK,EAAA,cAAC,EAAD,CAAQ,UAAW,IAAc,GAAO,IAAA,GAAY,CAA4B,EAAhB,CAAgB,EAGlF,CACT,CAEA,MAAa,EAAW,EACtB,EACA,UACF,ECpEA,SAAS,EACP,CACE,WACA,QAAQ,GACR,YACA,YACA,OACA,UACA,YACA,WACA,GAAG,GAEL,EACA,CACA,GAAM,CAAE,OAAM,mBAAkB,YAAW,YAAW,gBAAe,WACnE,EAAW,CAAW,EAClB,EAAY,GAAa,EACzB,EAAY,EAAiC,IAAI,EAIjD,EACJ,IAAc,EACV,EAAQ,CAAI,EACV,SACA,SACF,EAAgB,EAAW,EAAM,CAAI,EACrC,EAAgB,IAAS,SAEzB,EAAY,IAAc,EAAS,CAAE,MAAK,EAAI,EAAU,EAAM,EAAM,YAAY,EAGhF,CAAE,eAAgB,EACtB,CAAE,GAAG,EAAkB,YAAa,EAAgB,SAAW,GAAI,EACnE,CACF,EACM,EAAa,EAAO,EAAK,EAUzB,EAAY,EAAa,EARd,GAAmC,CAClD,EAAU,QAAU,EACpB,EAAc,QAAU,EACpB,IAAc,WAChB,EAAU,QAAU,EAExB,CAE2C,EAOrC,EAAqB,GAAiD,CAC1E,EAAW,QAAU,EAAM,cAAgB,SAAW,CACxD,EAEM,EAAe,GAA+C,CAClE,EAAM,eAAe,EACrB,EAAM,gBAAgB,EAClB,EAAW,UACb,EAAW,QAAU,GACrB,EAAK,GAEP,IAAU,CAAK,CACjB,EAEA,OACE,EAAA,cAAC,EAAD,CAGE,GAAK,EAAgB,CAAE,KAAM,QAAS,EAAI,CAAC,EAQ3C,UAAW,EAAW,CAAE,QAAO,KAAM,CAAQ,EAAG,CAAS,EACzD,GAAK,EAAW,CAAE,cAAe,CAAkB,EAAG,EAAM,EAAa,CACvE,QAAS,EACT,YAEA,GAAI,IAAa,IAAA,IAAa,CAAE,UAAS,CAC3C,CAAC,EAGD,GAAI,EACJ,IAAK,CAGI,EADR,CACQ,CAEf,CAEA,MAAa,EAAa,EACxB,EACA,YACF"}
+{"version":3,"file":"MenuToggle-7RQ0dmtZ.js","names":[],"sources":["../../src/components/menu/MenuDivider.tsx","../../src/components/menu/MenuHeader.tsx","../../src/components/menu/MenuItem.tsx","../../src/components/menu/menuNavigation.ts","../../src/components/menu/submenuGroup.ts","../../src/components/menu/MenuList.tsx","../../src/components/menu/MenuToggle.tsx"],"sourcesContent":["import React, { forwardRef, HTMLAttributes } from 'react'\nimport classNames from 'classnames'\n\nexport interface MenuDividerProps extends HTMLAttributes<HTMLHRElement> {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n}\n\nexport const MenuDivider = forwardRef<HTMLHRElement, MenuDividerProps>(\n  ({ className, ...rest }, ref) => {\n    const _className = classNames('menu-divider', className)\n\n    return <hr className={_className} {...rest} ref={ref} />\n  }\n)\n\nMenuDivider.displayName = 'MenuDivider'\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 MenuHeaderOwnProps<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   * ARIA role applied to the root node. Defaults to `'presentation'` — see the render function\n   * for why.\n   */\n  role?: React.AriaRole\n}\n\nexport type MenuHeaderProps<C extends ElementType = 'h4'> = PolymorphicComponentProps<\n  C,\n  MenuHeaderOwnProps<C>\n>\n\ntype MenuHeaderComponent = (<C extends ElementType = 'h4'>(\n  props: MenuHeaderProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction MenuHeaderRender<C extends ElementType = 'h4'>(\n  { children, className, component, role = 'presentation', ...rest }: MenuHeaderProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'h4'\n  const _className = classNames('menu-header', className)\n\n  // Always rendered as a direct child of `role=\"menu\"` (see MenuList) — ARIA's menu role only\n  // permits menuitem/group/separator children, so a bare heading fails aria-required-children.\n  // `role=\"presentation\"` opts the element itself out without hiding its text content.\n  return (\n    <Component className={_className} role={role} {...rest} ref={ref}>\n      {children}\n    </Component>\n  )\n}\n\nexport const MenuHeader = createPolymorphicComponent<MenuHeaderComponent>(\n  MenuHeaderRender as ForwardRefRenderFunction<Element, MenuHeaderProps<ElementType>>,\n  'MenuHeader'\n)\n","import React, {\n  ElementType,\n  ForwardRefRenderFunction,\n  MouseEvent,\n  ReactElement,\n  ReactNode\n} from 'react'\nimport classNames from 'classnames'\n\nimport { linkElement } from '../../utils/elementKind'\nimport {\n  createPolymorphicComponent,\n  PolymorphicRef,\n  PolymorphicRefWithFallback\n} from '../../utils/polymorphic'\nimport { renderMenuItemContent } from '../../utils/renderMenuItemContent'\nimport { LinkProps, Link } from '../link/Link'\n\ntype MenuItemOwnProps = {\n  /**\n   * A string of all className you want applied to the component.\n   */\n  className?: string\n  /**\n   * Secondary line of text rendered below `children` (`.menu-item-description`).\n   */\n  description?: ReactNode\n  /**\n   * Icon rendered at the item's leading edge (`.menu-item-icon`).\n   */\n  icon?: ReactNode\n  /**\n   * Marks the item as the current selection in a choice list. Renders in a heavier font weight.\n   * Combine with a manually-composed `.menu-item-check` icon (in `children`, or via `icon` on a\n   * plain, non-selection item) to also show a checkmark — this prop alone doesn't add one, so\n   * existing font-weight-only usage keeps rendering unchanged.\n   */\n  selected?: boolean\n}\n\nexport type MenuItemProps<C extends ElementType = 'a'> = LinkProps<C> & MenuItemOwnProps\n\ntype MenuItemComponent = (<C extends ElementType = 'a'>(\n  props: MenuItemProps<C> & {\n    ref?: PolymorphicRefWithFallback<C, HTMLAnchorElement | HTMLButtonElement>\n  }\n) => ReactElement | null) & { displayName?: string }\n\nfunction MenuItemRender<C extends ElementType = 'a'>(\n  {\n    children,\n    className,\n    component,\n    description,\n    href,\n    icon,\n    onClick,\n    selected,\n    ...rest\n  }: MenuItemProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const _className = classNames('menu-item', { selected }, className)\n\n  // `href=\"#\"` is a common placeholder for menu items that act via `onClick` rather than\n  // real navigation. Left alone, a plain anchor click still navigates to the empty fragment,\n  // which scrolls the page to the top — so we suppress that default for the placeholder case\n  // only, leaving real same-page anchors (`href=\"#some-id\"`) free to navigate as expected.\n  const handleClick = (event: MouseEvent<HTMLAnchorElement | HTMLButtonElement>) => {\n    if (href === '#') event.preventDefault()\n    onClick?.(event)\n  }\n\n  // An item with `href` is an `<a>`, one without is a `<button type=\"button\">`, unless `component`\n  // or `asChild` chose the element (see `linkElement`). chassis-css styles both as `.menu-item`.\n  // An item without `href` used to be an `<a>` with no `href`, which isn't focusable, so keyboard\n  // users couldn't reach it outside the menu's own arrow-key handling.\n  return (\n    <Link\n      role=\"menuitem\"\n      component={linkElement(component as ElementType | undefined, href, 'button')}\n      href={href}\n      onClick={handleClick}\n      {...(rest as Record<string, unknown>)}\n      className={_className}\n      ref={ref as PolymorphicRef<ElementType>}\n    >\n      {renderMenuItemContent({ icon, label: children, description })}\n    </Link>\n  )\n}\n\nexport const MenuItem = createPolymorphicComponent<MenuItemComponent>(\n  MenuItemRender as ForwardRefRenderFunction<Element, MenuItemProps<ElementType>>,\n  'MenuItem'\n)\n","import React from 'react'\n\n// Mirrors Chassis CSS's menu.js SELECTOR_VISIBLE_ITEMS / SELECTOR_KB_NAV_ITEMS: direct-child\n// menu items and submenu-back buttons, plus submenu trigger items nested one level inside a\n// `.submenu` wrapper (which aren't direct children of the `.menu`).\n//\n// Walks `children` directly rather than a `:scope`-based `querySelectorAll` — jsdom's selector\n// engine (nwsapi) mis-parses `:scope` queries against an element whose `id` contains a colon,\n// which is exactly the shape of React 18's default `useId()` output now that `MenuList`/\n// `MenuSubmenu` set a real `id` for `aria-controls`/`aria-labelledby` linking. Real browsers don't\n// have this bug, but walking children is just as correct and sidesteps it either way.\nconst VISIBLE_ITEMS_SELECTOR = ':is(.menu-item, .submenu-back):not(.disabled):not(:disabled)'\n\nconst isVisible = (element: HTMLElement) =>\n  Boolean(element.offsetWidth || element.offsetHeight || element.getClientRects().length)\n\nexport const getMenuItems = (menu: HTMLElement | null): HTMLElement[] => {\n  if (!menu) return []\n  const items: HTMLElement[] = []\n  for (const child of Array.from(menu.children)) {\n    if (child.matches(VISIBLE_ITEMS_SELECTOR)) {\n      items.push(child as HTMLElement)\n    } else if (child.classList.contains('submenu')) {\n      const trigger = Array.from(child.children).find((grandchild) =>\n        grandchild.matches(VISIBLE_ITEMS_SELECTOR)\n      )\n      if (trigger) items.push(trigger as HTMLElement)\n    }\n  }\n  return items.filter(isVisible)\n}\n\nexport const focusMenuItem = (items: HTMLElement[], target: 'first' | 'last') => {\n  if (!items.length) return\n  ;(target === 'first' ? items[0]! : items[items.length - 1]!).focus()\n}\n\nexport interface MenuKeyDownOptions {\n  onArrowLeft?: () => void\n  onArrowRight?: () => void\n  onEscape?: () => void\n}\n\n// Scoped to `event.currentTarget` (the `.menu` element the handler is bound to), so the same\n// function drives keyboard navigation for both the top-level menu and any nested submenu list.\n// `onArrowLeft`/`onArrowRight` are both optional and independent (rather than a single\n// direction-agnostic \"close\" callback) so a caller under an RTL locale can wire the one that\n// actually points back toward the trigger — see `MenuSubmenu`, the only current consumer of\n// either.\nexport const handleMenuKeyDown = (\n  event: React.KeyboardEvent<HTMLElement>,\n  { onArrowLeft, onArrowRight, onEscape }: MenuKeyDownOptions\n): void => {\n  const menu = event.currentTarget\n  const target = event.target as HTMLElement\n\n  switch (event.key) {\n    case 'ArrowDown':\n    case 'ArrowUp': {\n      event.preventDefault()\n      event.stopPropagation()\n      const items = getMenuItems(menu)\n      if (!items.length) return\n      const currentIndex = items.indexOf(target)\n      const nextIndex =\n        currentIndex === -1\n          ? event.key === 'ArrowDown'\n            ? 0\n            : items.length - 1\n          : (currentIndex + (event.key === 'ArrowDown' ? 1 : -1) + items.length) % items.length\n      // `nextIndex` is always a valid index into `items` here (0, items.length - 1, or a modulo\n      // result — the `if (!items.length) return` above already ruled out the empty-array case).\n      items[nextIndex]!.focus()\n      return\n    }\n    case 'Home':\n    case 'End': {\n      event.preventDefault()\n      event.stopPropagation()\n      focusMenuItem(getMenuItems(menu), event.key === 'Home' ? 'first' : 'last')\n      return\n    }\n    case 'Escape': {\n      if (!onEscape) return\n      event.preventDefault()\n      event.stopPropagation()\n      onEscape()\n      return\n    }\n    case 'ArrowLeft': {\n      if (!onArrowLeft) return\n      event.preventDefault()\n      event.stopPropagation()\n      onArrowLeft()\n      return\n    }\n    case 'ArrowRight': {\n      if (!onArrowRight) return\n      event.preventDefault()\n      event.stopPropagation()\n      onArrowRight()\n      return\n    }\n    default:\n  }\n}\n","import { createContext, useRef } from 'react'\n\n// Lets sibling `.submenu` flyouts at the same menu level close one another when a new one\n// opens, mirroring menu.js's `_closeSiblingSubmenus`. One provider instance is created per\n// menu level (the top-level `.menu` and each `.submenu`'s own nested list) and lives for the\n// lifetime of that level, so registration doesn't churn on every render.\nexport interface SubmenuGroupContextValue {\n  register: (id: string, close: () => void) => () => void\n  notifyOpen: (id: string) => void\n}\n\nexport const SubmenuGroupContext = createContext<SubmenuGroupContextValue | null>(null)\n\nexport const useSubmenuGroupProvider = (): SubmenuGroupContextValue => {\n  const ref = useRef<SubmenuGroupContextValue | null>(null)\n\n  if (!ref.current) {\n    const closers = new Map<string, () => void>()\n    ref.current = {\n      register: (id, close) => {\n        closers.set(id, close)\n        return () => {\n          closers.delete(id)\n        }\n      },\n      notifyOpen: (id) => {\n        closers.forEach((close, key) => {\n          if (key !== id) close()\n        })\n      }\n    }\n  }\n\n  return ref.current\n}\n\n// Exposes the current `.submenu`'s own close-and-refocus action to a nested `MenuSubmenuBack`\n// button, without threading it through the sibling-group registry above.\nexport interface SubmenuActionsContextValue {\n  close: () => void\n}\n\nexport const SubmenuActionsContext = createContext<SubmenuActionsContextValue | null>(null)\n","import React, {\n  ElementType,\n  ForwardRefRenderFunction,\n  ReactElement,\n  ReactNode,\n  useContext,\n  useEffect\n} from 'react'\nimport classNames from 'classnames'\n\nimport { useForkedRef } from '../../hooks'\nimport { renderMenuItemContent } from '../../utils/renderMenuItemContent'\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\nimport { Portal, useHydrated } from '../portal/Portal'\nimport { MenuContext } from './Menu'\nimport { MenuDivider } from './MenuDivider'\nimport { MenuHeader } from './MenuHeader'\nimport { MenuItem } from './MenuItem'\nimport { MenuItemsDef } from './MenuItemDef'\nimport { focusMenuItem, getMenuItems, handleMenuKeyDown } from './menuNavigation'\nimport { SubmenuGroupContext, useSubmenuGroupProvider } from './submenuGroup'\n\ntype MenuListOwnProps<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   * Array of item/header/divider definitions for data-driven rendering. When provided, children\n   * are ignored. Covers flat items, headers, and dividers only — for nested submenus, compose\n   * with `children` and `MenuSubmenu` instead.\n   */\n  items?: MenuItemsDef\n}\n\nexport type MenuListProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  MenuListOwnProps<C>\n>\n\ntype MenuListComponent = (<C extends ElementType = 'div'>(\n  props: MenuListProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nconst renderMenuItemDef = (def: MenuItemsDef[number]): ReactNode => {\n  if (def.type === 'header') {\n    return <MenuHeader key={def.id}>{def.label}</MenuHeader>\n  }\n  if (def.type === 'divider') {\n    return <MenuDivider key={def.id} />\n  }\n  return (\n    <MenuItem\n      key={def.id}\n      href={def.href}\n      disabled={def.disabled}\n      selected={def.selected}\n      onClick={def.onClick}\n    >\n      {renderMenuItemContent({\n        icon: def.icon,\n        label: def.label,\n        description: def.description,\n        selected: def.selected\n      })}\n    </MenuItem>\n  )\n}\n\nfunction MenuListRender<C extends ElementType = 'div'>(\n  { children, className, component, items, onKeyDown, ...rest }: MenuListProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const Component = component ?? 'div'\n  const {\n    close,\n    container,\n    focusStrategy,\n    menuId,\n    menuStyle,\n    overlayRef,\n    placementAttr,\n    triggerId,\n    visible\n  } = useContext(MenuContext)\n  const forkedRef = useForkedRef(ref, overlayRef)\n  const submenuGroup = useSubmenuGroupProvider()\n  // The list is positioned in a layout effect, which the server never runs: a menu open on its\n  // first render was painted at the top left of the page until the JavaScript had loaded. It is\n  // shown once hydration has finished, where that effect has placed it.\n  const hydrated = useHydrated()\n  const shown = visible && hydrated\n\n  // ArrowDown/ArrowUp on the trigger opens the menu with a focus strategy (see `Menu`'s\n  // `useMenuTrigger` wiring) — this is where that intent actually lands, since we're not\n  // adopting `useMenu`'s own collection-aware auto-focus.\n  useEffect(() => {\n    if (!visible || !focusStrategy) return\n    focusMenuItem(getMenuItems(overlayRef.current), focusStrategy === 'last' ? 'last' : 'first')\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [visible, focusStrategy])\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n    handleMenuKeyDown(event, { onEscape: close })\n    onKeyDown?.(event as React.KeyboardEvent<HTMLDivElement>)\n  }\n\n  // Labelled by the trigger, unless the caller names the list itself: `aria-labelledby` would\n  // outrank that `aria-label`. Left out when there is no trigger to point at (a `ContextMenu`'s\n  // region with no id of its own has one; a list rendered with no `Menu` around it has none).\n  const ariaLabel = (rest as { 'aria-label'?: string })['aria-label']\n  const labelledBy = ariaLabel ? undefined : triggerId || undefined\n\n  const content = (\n    <Component\n      role=\"menu\"\n      id={menuId}\n      aria-labelledby={labelledBy}\n      className={classNames('menu', { show: shown }, className)}\n      style={menuStyle}\n      data-cx-placement={placementAttr}\n      {...rest}\n      onKeyDown={handleKeyDown}\n      ref={forkedRef}\n    >\n      <SubmenuGroupContext.Provider value={submenuGroup}>\n        {items ? items.map(renderMenuItemDef) : children}\n      </SubmenuGroupContext.Provider>\n    </Component>\n  )\n\n  if (container) {\n    return <Portal container={container === true ? undefined : container}>{content}</Portal>\n  }\n\n  return content\n}\n\nexport const MenuList = createPolymorphicComponent<MenuListComponent>(\n  MenuListRender as ForwardRefRenderFunction<Element, MenuListProps<ElementType>>,\n  'MenuList'\n)\n","import React, {\n  ElementType,\n  ForwardRefRenderFunction,\n  ReactElement,\n  useContext,\n  useRef\n} from 'react'\nimport classNames from 'classnames'\nimport { mergeProps, useButton } from 'react-aria'\n\nimport { Button, ButtonProps } from '../button/Button'\nimport { MenuContext } from './Menu'\nimport { ContextColor, Shapes } from '../../types'\nimport {\n  createPolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef\n} from '../../utils/polymorphic'\nimport { useForkedRef } from '../../hooks'\nimport { hasHref, hrefProps, resolveLinkKind } from '../../utils/elementKind'\n\ntype MenuToggleOwnProps<C extends ElementType> = {\n  /**\n   * Toggle the active state for the component.\n   */\n  active?: boolean\n  /**\n   * Draws the caret after the toggle's content. Set it to `false` for a toggle that shows what it\n   * is another way, such as an icon-only \"more\" button.\n   *\n   * @default true\n   */\n  caret?: boolean\n  /**\n   * A string of all className you want applied to the base component.\n   */\n  className?: string\n  /**\n   * Sets the color of the component to one of Chassis context colors. Only applies to the\n   * default `Button` root.\n   */\n  color?: ContextColor\n  /**\n   * Component used for the root node — the trigger element the menu opens from. Defaults to\n   * `Button`; swap for e.g. `NavLink` to render a nav-item-style trigger (`.nav-link.caret`)\n   * instead of a `.button.caret`. Its own props are type-checked at the call site once passed\n   * here.\n   */\n  component?: C\n  /**\n   * Toggle the disabled state for the component.\n   */\n  disabled?: boolean\n  /**\n   * The href attribute specifies the URL of the page the link goes to.\n   */\n  href?: string\n  /**\n   * Select the shape of the component. Only applies to the default `Button` root.\n   */\n  shape?: Shapes\n  /**\n   * Size the component sm or lg. Only applies to the default `Button` root.\n   */\n  size?: 'sm' | 'lg'\n  /**\n   * Sets the style variant of the component, as `Button`'s own `variant` does. Only applies to\n   * the default `Button` root.\n   */\n  variant?: ButtonProps['variant']\n}\n\nexport type MenuToggleProps<C extends ElementType = typeof Button> = PolymorphicComponentProps<\n  C,\n  MenuToggleOwnProps<C>\n>\n\ntype MenuToggleComponent = (<C extends ElementType = typeof Button>(\n  props: MenuToggleProps<C> & { ref?: PolymorphicRef<C> }\n) => ReactElement | null) & { displayName?: string }\n\nfunction MenuToggleRender<C extends ElementType = typeof Button>(\n  {\n    children,\n    caret = true,\n    className,\n    component,\n    href,\n    onClick,\n    onKeyDown,\n    tabIndex,\n    ...rest\n  }: MenuToggleProps<C>,\n  ref: PolymorphicRef<C>\n) {\n  const { hide, menuTriggerProps, reference, targetRef, toggleNodeRef, visible } =\n    useContext(MenuContext)\n  const Component = component ?? Button\n  const buttonRef = useRef<HTMLButtonElement | null>(null)\n  // What the root renders. The default `Button` renders a `<button>`, or an `<a>` given `href`.\n  // Anything else is asked, like every polymorphic component asks: `NavLink` is a component\n  // reference, and `component=\"button\"` a real `<button>`.\n  const kind =\n    Component === Button\n      ? hasHref(href)\n        ? 'anchor'\n        : 'button'\n      : resolveLinkKind(Component, href, rest)\n  const rendersButton = kind === 'button'\n  // `Button` applies the `href` rule itself; anything else gets `href` only if it can take one.\n  const linkProps = Component === Button ? { href } : hrefProps(kind, href, 'MenuToggle')\n  // `elementType` tells react-aria whether the rendered root already has native button\n  // semantics or needs them emulated (`role=\"button\"`, keyboard activation).\n  const { buttonProps } = useButton(\n    { ...menuTriggerProps, elementType: rendersButton ? 'button' : 'a' },\n    buttonRef\n  )\n  const wasOpenRef = useRef(false)\n\n  const setRefs = (node: HTMLButtonElement | null) => {\n    buttonRef.current = node\n    toggleNodeRef.current = node\n    if (reference !== 'parent') {\n      targetRef.current = node\n    }\n  }\n\n  const forkedRef = useForkedRef(ref, setRefs)\n\n  // react-aria's `useMenuTrigger` opens (rather than toggles) on mouse/pen press start, so\n  // re-clicking an already-open trigger would otherwise re-open it right back instead of\n  // closing it. Capture whether it was open before that happens — ours has to run ahead of\n  // `buttonProps`' own `onPointerDown` in the `mergeProps` chain below — then close it back\n  // down on click. Touch is exempt: react-aria's `onPress` already toggles it correctly there.\n  const handlePointerDown = (event: React.PointerEvent<HTMLButtonElement>) => {\n    wasOpenRef.current = event.pointerType !== 'touch' && visible\n  }\n\n  const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    event.preventDefault()\n    event.stopPropagation()\n    if (wasOpenRef.current) {\n      wasOpenRef.current = false\n      hide()\n    }\n    onClick?.(event)\n  }\n\n  return (\n    <Component\n      // A `<button>` root needs an explicit `type` to avoid an implicit form submit; other roots\n      // (e.g. `NavLink`) don't render a `<button>` at all.\n      {...(rendersButton ? { type: 'button' } : {})}\n      // The `.caret` utility (rather than styling off `[data-cx-toggle=\"menu\"]`, as the vanilla\n      // CSS docs show) keeps this element from also matching Chassis CSS's own vanilla menu.js\n      // selectors on a page that happens to load both — this component reimplements all of that\n      // behavior itself, so there's nothing for the vanilla plugin to usefully do with it anyway.\n      // `show` mirrors `MenuList`'s own `{ show: visible }` and vanilla menu.js's\n      // `this._element.classList.add('show')` — it's what puts the trigger itself into a\n      // pressed look while its menu is open (`.button.show`/`.nav-item.show .nav-link`).\n      className={classNames({ caret, show: visible }, className)}\n      {...(mergeProps({ onPointerDown: handlePointerDown }, rest, buttonProps, {\n        onClick: handleClick,\n        onKeyDown,\n        // The caller's, when it gives one: react-aria's own `tabIndex` would replace it.\n        ...(tabIndex !== undefined && { tabIndex })\n      }) as Record<string, unknown>)}\n      // After `buttonProps`: for an `<a>`, react-aria returns an `href` of its own, the one it was\n      // given, which is none.\n      {...linkProps}\n      ref={forkedRef}\n    >\n      {children}\n    </Component>\n  )\n}\n\nexport const MenuToggle = createPolymorphicComponent<MenuToggleComponent>(\n  MenuToggleRender as ForwardRefRenderFunction<Element, MenuToggleProps<ElementType>>,\n  'MenuToggle'\n)\n"],"mappings":"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"}

package/dist/chunks/alert-3kTBfWFw.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{r as o}from"./colorClassNames-CEh5Yzfp.js";import{t as s}from"./CloseButton-DPgQztE0.js";import{t as c}from"./Button-BoymWE-L.js";import l,{createContext as u,forwardRef as d,useCallback as f,useContext as p,useId as m,useRef as h,useState as g}from"react";import _ from"classnames";const v=u({close:()=>{},registerPart:()=>()=>{}}),y=()=>p(v),b=d(({"aria-describedby":t,"aria-labelledby":n,backdrop:r=`static`,children:a,className:o,closeButton:c,closeLabel:u,defaultVisible:d,instant:p,keyboard:m=!1,onClick:h,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:d,instant:p,isModal:!0,keyboard:m,onClick:h,onClose:y,onClosePrevented:b,onHidden:x,onShow:S,onShown:C,onVisibleChange:w,open:T,ref:O,visible:E}),[F,I]=g([]),L=f((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 l.createElement(v.Provider,{value:V},l.createElement(`dialog`,{"aria-describedby":B,"aria-labelledby":z,role:`alertdialog`,...D,open:T,className:_(`alert`,`dialog`,{instant:p,hiding:N,"dialog-static":P},o),onCancel:M,onClick:j,ref:A},a,c&&l.createElement(s,{label:u,onClick:k})))});b.displayName=`Alert`;function x({children:e,className:t,component:n,...r},i){let a=n??`div`;return l.createElement(a,{className:_(`alert-body`,t),...r,ref:i},e)}const S=n(x,`AlertBody`),C=d(({color:e=`default`,onClick:t,...n},r)=>{let{close:i}=y();return l.createElement(c,{color:e,"data-autofocus":``,...n,onClick:e=>{t?.(e),e.defaultPrevented||i()},ref:r})});C.displayName=`AlertCancel`;function w(e){let t=h(null),{registerPart:n}=y(),i=h({});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 T({children:e,className:n,component:r,id:i,...a},o){let s=r??`code`,c=m(),u=w(`description`),d=t(o,u);return l.createElement(s,{className:_(`alert-code`,n),id:i??c,...a,ref:d},e)}const E=n(T,`AlertCode`);function D({children:e,className:t,component:n,stacked:r,...i},a){let o=n??`div`;return l.createElement(o,{className:_(`alert-footer`,{stacked:r},t),...i,ref:a},e)}const O=n(D,`AlertFooter`),k=d(({className:e,color:t,...n},r)=>l.createElement(a,{className:_(`alert-icon`,t&&o[t],e),...n,ref:r}));k.displayName=`AlertIcon`;function A({children:e,className:n,component:r,id:i,...a},o){let s=r??`p`,c=m(),u=w(`description`),d=t(o,u);return l.createElement(s,{className:n,id:i??c,...a,ref:d},e)}const j=n(A,`AlertText`);function M({children:e,className:n,component:r,id:i,...a},o){let s=r??`h2`,c=m(),u=w(`title`),d=t(o,u);return l.createElement(s,{className:_(`alert-title`,n),id:i??c,...a,ref:d},e)}const N=n(M,`AlertTitle`);export{E as a,b as c,O as i,j as n,C as o,k as r,S as s,N as t};
+//# sourceMappingURL=alert-3kTBfWFw.js.map

package/dist/chunks/{alert-BXI-_qlt.js.map → alert-3kTBfWFw.js.map}

@@ -1 +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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"}
+{"version":3,"file":"alert-3kTBfWFw.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_COLOR_CLASS_NAMES } from '../../utils/colorClassNames'\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_CLASS_NAMES[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/{avatar-S3dGy6Qc.js → avatar-MklqAKcz.js}

@@ -1,2 +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
+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-DyZyAQFj.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-MklqAKcz.js.map

package/dist/chunks/{avatar-S3dGy6Qc.js.map → avatar-MklqAKcz.js.map}

@@ -1 +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"}
+{"version":3,"file":"avatar-MklqAKcz.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/{breadcrumb-s6J9itez.js → breadcrumb-CHxTiZLt.js}

@@ -1,2 +1,2 @@
-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
+import"./focus-ring-SR_LwaN7.js";import{t as e}from"./Link-DyZyAQFj.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-CHxTiZLt.js.map

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

@@ -1 +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"}
+{"version":3,"file":"breadcrumb-CHxTiZLt.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-CGk8szzR.js

@@ -0,0 +1,2 @@
+const e=[`sm`,`md`,`lg`,`xl`,`2xl`],t=[`@sm`,`@md`,`@lg`,`@xl`,`@2xl`],n=[...e,...t],r=e=>typeof e==`object`&&!!e,i=e=>r(e)?e.base:e,a=(e,t)=>n=>{let i=r(e)?e[n]:n===`base`?e:void 0;return i==null?null:t(i,n===`base`?``:`${n}:`)},o=(t,n=e)=>[`base`,...n].flatMap(e=>t.map(t=>t(e))),s=(e,t)=>`${t}flex-${e}`;export{a,o as i,i as n,s as r,n as t};
+//# sourceMappingURL=breakpoints-CGk8szzR.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"breakpoints-CGk8szzR.js","names":[],"sources":["../../src/utils/breakpoints.ts"],"sourcesContent":["import { Breakpoint, ContainerBreakpoint, Responsive } from '../types'\n\n// Mobile-first ascending order. Every responsive layout prop (of `Flex`, `Stack`, `Grid`,\n// `GridItem`, `Card`, `CardBody`, `CardImage` and `Skeleton`) keys its values by these literal\n// chassis-css breakpoint names, after `base`.\nexport const BREAKPOINTS: Breakpoint[] = ['sm', 'md', 'lg', 'xl', '2xl']\n\n// The keys of chassis-css's container-query classes (`@md:col-span-4`), which follow the width of\n// the nearest query container where a breakpoint class follows the viewport. Only `Grid` and\n// `GridItem` take them.\nexport const CONTAINER_BREAKPOINTS: ContainerBreakpoint[] = ['@sm', '@md', '@lg', '@xl', '@2xl']\n\n// Viewport keys first: chassis-css writes its container rules after every breakpoint rule, so\n// the container class wins on an element both apply to, and the class list reads in that order.\nexport const GRID_BREAKPOINTS: Array<Breakpoint | ContainerBreakpoint> = [\n  ...BREAKPOINTS,\n  ...CONTAINER_BREAKPOINTS\n]\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.\nexport type WidthSpan = 'auto' | number | string | boolean\n\ntype ResponsiveKey = Breakpoint | ContainerBreakpoint\ntype ResponsiveObject<T> = { base?: T } & Partial<Record<ResponsiveKey, T>>\ntype ClassName = string | false | null | undefined\n\n// No responsive prop takes an object as its plain value, so an object is the per-width form.\nconst isResponsiveObject = <T>(\n  value: Responsive<T, ResponsiveKey> | undefined\n): value is ResponsiveObject<T> => typeof value === 'object' && value !== null\n\n/**\n * The value a responsive prop has below the first breakpoint: the plain value, or `base` of the\n * per-width object. A component reads it for what only the base can do, such as a default class\n * or an inline style, which holds no media query.\n */\nexport const baseValue = <T>(value: Responsive<T, ResponsiveKey> | undefined): T | undefined =>\n  isResponsiveObject<T>(value) ? value.base : (value as T | undefined)\n\n/**\n * One responsive prop, ready for `responsiveClassNames` to read at each width.\n */\nexport type ResponsiveProp = (key: 'base' | ResponsiveKey) => ClassName\n\n/**\n * Pairs a responsive prop with the class it maps to. `toClassName` gets one width's value and\n * its prefix: `''` for the base, `` `${breakpoint}:` `` otherwise. A falsy return is no class.\n */\nexport const responsiveProp =\n  <T>(\n    value: Responsive<T, ResponsiveKey> | undefined,\n    toClassName: (value: T, prefix: string) => ClassName\n  ): ResponsiveProp =>\n  (key) => {\n    const at = isResponsiveObject<T>(value)\n      ? value[key]\n      : key === 'base'\n        ? (value as T | undefined)\n        : undefined\n\n    return at === undefined || at === null ? null : toClassName(at, key === 'base' ? '' : `${key}:`)\n  }\n\n/**\n * Builds the class list of a component's responsive props: the base class of every prop first,\n * then the classes of each breakpoint in turn, as in `flex-column gap-sm md:flex-row md:gap-md`.\n *\n * `keys` is the list of keys read from each prop after `base`, in class order: the viewport\n * breakpoints unless the component also takes the container ones (`GRID_BREAKPOINTS`).\n */\nexport const responsiveClassNames = (\n  props: ResponsiveProp[],\n  keys: ReadonlyArray<ResponsiveKey> = BREAKPOINTS\n): ClassName[] => (['base', ...keys] as const).flatMap((key) => props.map((prop) => prop(key)))\n\nexport type FlexDirection = 'row' | 'column'\n\n// The `responsiveProp` class of the `flex-row`/`flex-column` direction toggle shared by `Card`\n// and `CardBody`, both of which map a `direction` prop to the same chassis-css class.\nexport const flexDirectionClassName = (direction: FlexDirection, prefix: string): string =>\n  `${prefix}flex-${direction}`\n"],"mappings":"AAKA,MAAa,EAA4B,CAAC,KAAM,KAAM,KAAM,KAAM,KAAK,EAK1D,EAA+C,CAAC,MAAO,MAAO,MAAO,MAAO,MAAM,EAIlF,EAA4D,CACvE,GAAG,EACH,GAAG,CACL,EAWM,EACJ,GACiC,OAAO,GAAU,YAAY,EAOnD,EAAgB,GAC3B,EAAsB,CAAK,EAAI,EAAM,KAAQ,EAWlC,GAET,EACA,IAED,GAAQ,CACP,IAAM,EAAK,EAAsB,CAAK,EAClC,EAAM,GACN,IAAQ,OACL,EACD,IAAA,GAEN,OAAO,GAA2B,KAAO,KAAO,EAAY,EAAI,IAAQ,OAAS,GAAK,GAAG,EAAI,EAAE,CACjG,EASW,GACX,EACA,EAAqC,IACpB,CAAC,OAAQ,GAAG,CAAI,CAAC,CAAW,QAAS,GAAQ,EAAM,IAAK,GAAS,EAAK,CAAG,CAAC,CAAC,EAMjF,GAA0B,EAA0B,IAC/D,GAAG,EAAO,OAAO"}

package/dist/chunks/breakpoints-ECy4lKQT.d.ts

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