@mortenbrudvik/waveui 0.4.0 → 0.7.0

package/dist/components/data-display/Divider.mjs

@@ -0,0 +1,52 @@
+"use client";
+import { cn as e } from "../../lib/cn.mjs";
+import { renderSlot as t, slotRendersContent as n } from "../../lib/slot.mjs";
+import { useId as r } from "../../hooks/useId.mjs";
+import { joinIds as i } from "../../lib/aria.mjs";
+import "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/components/data-display/Divider.tsx
+var s = "shrink-0 text-caption-1 text-muted-foreground", c = (c) => {
+	let { as: l, orientation: u = "horizontal", className: d, children: f, ref: p, "aria-labelledby": m, ...h } = c, g = r("divider-label"), _ = u === "vertical";
+	if (n(f)) {
+		let n = l ?? "div", r = h["aria-label"] ? m : i(m, g), c = _ ? "w-0 min-h-2 flex-1 border-s border-border" : "h-0 min-w-2 flex-1 border-t border-border";
+		return /* @__PURE__ */ o(n, {
+			ref: p,
+			role: "separator",
+			"aria-orientation": _ ? "vertical" : void 0,
+			className: e(_ ? "inline-flex min-h-12 flex-col items-center gap-1 self-stretch" : "flex items-center gap-3", d),
+			...h,
+			"aria-labelledby": r,
+			children: [
+				/* @__PURE__ */ a("div", {
+					"aria-hidden": "true",
+					className: c
+				}),
+				t(f, "span", s, { id: g }),
+				/* @__PURE__ */ a("div", {
+					"aria-hidden": "true",
+					className: c
+				})
+			]
+		});
+	}
+	return _ ? /* @__PURE__ */ a(l ?? "div", {
+		ref: p,
+		role: "separator",
+		"aria-orientation": "vertical",
+		"aria-labelledby": m,
+		className: e("inline-block h-6 border-s border-border", d),
+		...h
+	}) : /* @__PURE__ */ a(l ?? "hr", {
+		ref: p,
+		role: "separator",
+		"aria-labelledby": m,
+		className: e("m-0 h-0 w-full border-0 border-t border-solid border-border", d),
+		...h
+	});
+};
+c.displayName = "Divider";
+//#endregion
+export { c as Divider };
+
+//# sourceMappingURL=Divider.mjs.map

package/dist/components/data-display/Divider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Divider.mjs","names":["useId","useId$1","labelClassName","Divider","ariaLabelledBy","rest","props","labelId","vertical","orientation","slotRendersContent","children","Wrapper","as","labelledBy","joinIds","lineClassName","cn","className","renderSlot"],"sources":["../../../src/components/data-display/Divider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport { joinIds } from '../../lib/aria';\nimport { renderSlot, slotRendersContent } from '../../lib/slot';\nimport { useId } from '../../hooks/useId';\nimport type { Orientation } from '../../lib/types';\nimport type { PolymorphicComponent, PolymorphicProps } from '../../lib/polymorphic';\n\n/**\n * The Divider's own props (the XOwnProps rule of `PolymorphicProps`: component-specific props\n * only). Every other prop comes from the rendered element (`as`).\n */\nexport interface DividerOwnProps {\n  /** Orientation of the divider line.\n   * @default 'horizontal'\n   */\n  orientation?: Orientation;\n  /**\n   * Ref to the rendered element. Typed `HTMLElement` for every `as`, because the default element\n   * depends on the props: an `<hr>` for a plain horizontal divider, a `<div>` otherwise.\n   */\n  ref?: React.Ref<HTMLElement>;\n}\n\n/**\n * Props of {@link Divider} rendered as `C` (default `'hr'`). `DividerProps` without a type argument\n * is the 0.4 name.\n */\nexport type DividerProps<C extends React.ElementType = 'hr'> = PolymorphicProps<C, DividerOwnProps>;\n\n/** The props the implementation reads, for any `as` (the public typing is `PolymorphicComponent`). */\ntype DividerImplProps = DividerOwnProps &\n  React.HTMLAttributes<HTMLElement> & {\n    as?: React.ElementType;\n  };\n\nconst labelClassName = 'shrink-0 text-caption-1 text-muted-foreground';\n\n/**\n * A line that separates content, horizontally or vertically, optionally with a label in the middle.\n *\n * - A plain horizontal divider renders an `<hr>`; a vertical or labelled divider renders a\n *   `<div role=\"separator\">` (`as` replaces the element in every case). `children` that render\n *   nothing (`''`, or an array, `Set` or generator of only empty items, such as an empty `.map()`\n *   result) are no label; `0` is one.\n * - A labelled divider is **one** separator named by its label (`aria-labelledby`); the two line\n *   segments around the label are presentational (`aria-hidden`). A consumer `aria-label` names it\n *   instead, and a consumer `aria-labelledby` is joined with the label.\n * - Vertical dividers set `aria-orientation=\"vertical\"` and use logical borders (RTL-safe).\n *\n * @example\n * <Divider />\n * <Divider>OR</Divider>\n * <Divider orientation=\"vertical\" />\n */\nexport const Divider: PolymorphicComponent<'hr', DividerOwnProps> = (props) => {\n  const {\n    as,\n    orientation = 'horizontal',\n    className,\n    children,\n    ref,\n    'aria-labelledby': ariaLabelledBy,\n    ...rest\n  } = props as DividerImplProps;\n  const labelId = useId('divider-label');\n  const vertical = orientation === 'vertical';\n\n  // The library's \"renders nothing\" rule: `0` is a label, while `''` or an array, Set or generator\n  // of only empty items (an empty `.map()` result) is none.\n  if (slotRendersContent(children)) {\n    const Wrapper: React.ElementType = as ?? 'div';\n    // A consumer aria-label names the separator; aria-labelledby would take precedence over it.\n    const labelledBy = rest['aria-label'] ? ariaLabelledBy : joinIds(ariaLabelledBy, labelId);\n    const lineClassName = vertical\n      ? 'w-0 min-h-2 flex-1 border-s border-border'\n      : 'h-0 min-w-2 flex-1 border-t border-border';\n    return (\n      <Wrapper\n        ref={ref}\n        role=\"separator\"\n        aria-orientation={vertical ? 'vertical' : undefined}\n        className={cn(\n          vertical\n            ? 'inline-flex min-h-12 flex-col items-center gap-1 self-stretch'\n            : 'flex items-center gap-3',\n          className,\n        )}\n        {...rest}\n        aria-labelledby={labelledBy}\n      >\n        <div aria-hidden=\"true\" className={lineClassName} />\n        {/* Rendered as a slot: a generator checked above was read once, and renderSlot renders\n            the items read then. */}\n        {renderSlot(children, 'span', labelClassName, { id: labelId })}\n        <div aria-hidden=\"true\" className={lineClassName} />\n      </Wrapper>\n    );\n  }\n\n  if (vertical) {\n    const Line: React.ElementType = as ?? 'div';\n    return (\n      <Line\n        ref={ref}\n        role=\"separator\"\n        aria-orientation=\"vertical\"\n        aria-labelledby={ariaLabelledBy}\n        className={cn('inline-block h-6 border-s border-border', className)}\n        {...rest}\n      />\n    );\n  }\n\n  const Rule: React.ElementType = as ?? 'hr';\n  return (\n    <Rule\n      ref={ref}\n      role=\"separator\"\n      aria-labelledby={ariaLabelledBy}\n      className={cn('m-0 h-0 w-full border-0 border-t border-solid border-border', className)}\n      {...rest}\n    />\n  );\n};\n\nDivider.displayName = 'Divider';\n"],"mappings":";;;;;;;;AAoCA,IAAME,IAAiB,iDAmBVC,KAAwD,MAAU;CAC7E,IAAM,EACJ,OACA,iBAAc,cACd,cACA,aACA,QACA,mBAAmBC,GACnB,GAAGC,MACDC,GACEC,IAAUP,EAAM,eAAe,GAC/BQ,IAAWC,MAAgB;CAIjC,IAAIC,EAAmBC,CAAQ,GAAG;EAChC,IAAMC,IAA6BC,KAAM,OAEnCC,IAAaT,EAAK,gBAAgBD,IAAiBW,EAAQX,GAAgBG,CAAO,GAClFS,IAAgBR,IAClB,8CACA;EACJ,OACE,kBAACI,GAAD;GACO;GACL,MAAK;GACL,oBAAkBJ,IAAW,aAAa,KAAA;GAC1C,WAAWS,EACTT,IACI,kEACA,2BACJU,CACF;GACA,GAAIb;GACJ,mBAAiBS;GAXnB,UAAA;IAaE,kBAAC,OAAD;KAAK,eAAY;KAAO,WAAWE;IAAgB,CAAA;IAGlDG,EAAWR,GAAU,QAAQT,GAAgB,EAAE,IAAIK,EAAQ,CAAC;IAC7D,kBAAC,OAAD;KAAK,eAAY;KAAO,WAAWS;IAAgB,CAAA;GAC5C;;CAEb;CAiBA,OAfIR,IAGA,kBAF8BK,KAAM,OAEpC;EACO;EACL,MAAK;EACL,oBAAiB;EACjB,mBAAiBT;EACjB,WAAWa,EAAG,2CAA2CC,CAAS;EAClE,GAAIb;CACL,CAAA,IAMH,kBAF8BQ,KAAM,MAEpC;EACO;EACL,MAAK;EACL,mBAAiBT;EACjB,WAAWa,EAAG,+DAA+DC,CAAS;EACtF,GAAIb;CACL,CAAA;AAEL;AAEA,EAAQ,cAAc"}

package/dist/components/data-display/Image.cjs

@@ -0,0 +1,2 @@
+"use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/cn.cjs"),n=require("../../lib/dev.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("react/jsx-runtime");var a={none:`object-none object-left-top`,center:`object-none object-center`,contain:`object-contain`,cover:`object-cover`,default:``},o={circular:`rounded-full`,rounded:`rounded`,square:`rounded-none`},s=({fit:e=`default`,shape:s=`square`,shadow:c=!1,block:l=!1,bordered:u=!1,className:d,alt:f,ref:p,...m})=>{let h=f===void 0;return r.useEffect(()=>{h&&n.warnOnce(`Image:alt`,'Image: `alt` is missing. Describe the image, or pass alt="" when it is decorative.')},[h]),(0,i.jsx)(`img`,{ref:p,alt:f,className:t.cn(a[e],o[s],l?`block w-full`:`inline-block max-w-full`,e==="default"&&`h-auto`,c&&`shadow-4`,u&&`border border-border`,d),...m})};s.displayName=`Image`,exports.Image=s;
+//# sourceMappingURL=Image.cjs.map

package/dist/components/data-display/Image.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Image.cjs","names":["cn","require_runtime","require_cn","require_dev","react","react_jsx_runtime","fitMap","shapeMap","Image","rest","missingAlt","alt","fit","shape","block","shadow","bordered","className"],"sources":["../../../src/components/data-display/Image.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport { warnOnce } from '../../lib/dev';\nimport type { Shape } from '../../lib/types';\n\n/**\n * How an image fits its box (the `width`/`height` attributes, or a size set with `className`):\n *\n * - `'default'`: the image fills the box. Its height follows its width, so the aspect ratio is\n *   kept (the attributes only give the ratio before the image loads); a height set with\n *   `className` fixes the box, and the image then stretches to it.\n * - `'none'`: not scaled; the image's top-left corner stays in view and the rest is cropped.\n * - `'center'`: not scaled; the middle of the image stays in view and the edges are cropped.\n * - `'contain'`: scaled to fit inside the box, keeping its aspect ratio (the box may show empty\n *   bands).\n * - `'cover'`: scaled to fill the box, keeping its aspect ratio (the edges are cropped).\n */\nexport type ImageFit = 'none' | 'center' | 'contain' | 'cover' | 'default';\n/** Shape of the image corners (the shared {@link Shape} vocabulary). */\nexport type ImageShape = Shape;\n\n/** Properties for the Image component. */\nexport interface ImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {\n  /**\n   * Text alternative of the image. Describe what the image shows, or pass `alt=\"\"` when it is\n   * decorative (it then is hidden from assistive technology). Leaving it out logs a development\n   * warning; use {@link StrictImageProps} to require it at compile time (required in 1.0).\n   */\n  alt?: string;\n  /**\n   * How the image fits its box: `'default'` (fills it, keeping the aspect ratio through an\n   * automatic height), `'none'` (not scaled, top-left corner in view), `'center'` (not scaled,\n   * middle in view), `'contain'` or `'cover'`. See {@link ImageFit}.\n   * @default 'default'\n   */\n  fit?: ImageFit;\n  /** Shape of the image border radius.\n   * @default 'square'\n   */\n  shape?: ImageShape;\n  /** Whether to apply a shadow to the image.\n   * @default false\n   */\n  shadow?: boolean;\n  /**\n   * Whether the image is displayed as a block element filling the width of its parent. Otherwise\n   * it is inline and never wider than its parent. With the default `fit` the height follows the\n   * width (the aspect ratio is kept); with another `fit` the box keeps its `height`.\n   * @default false\n   */\n  block?: boolean;\n  /** Whether to show a border around the image.\n   * @default false\n   */\n  bordered?: boolean;\n  /** Ref to the `<img>` element. */\n  ref?: React.Ref<HTMLImageElement>;\n}\n\n/**\n * {@link ImageProps} with a required `alt`: the compile-time check that every image has a text\n * alternative (`alt=\"\"` for decorative images). `ImageProps.alt` becomes required in 1.0.\n *\n * @example\n * const Photo = (props: StrictImageProps) => <Image {...props} />;\n */\nexport interface StrictImageProps extends Omit<ImageProps, 'alt'> {\n  /** Text alternative of the image; `''` for a decorative image. */\n  alt: string;\n}\n\nconst fitMap: Record<ImageFit, string> = {\n  // wave-allow-physical: the anchor is the image's own corner; image pixels never mirror in RTL.\n  none: 'object-none object-left-top',\n  center: 'object-none object-center',\n  contain: 'object-contain',\n  cover: 'object-cover',\n  default: '',\n};\n\nconst shapeMap: Record<ImageShape, string> = {\n  circular: 'rounded-full',\n  rounded: 'rounded',\n  square: 'rounded-none',\n};\n\n/**\n * An `<img>` with Wave fit, shape, shadow and border options.\n *\n * Always pass `alt`: a description of the image, or `alt=\"\"` for a decorative image. Without it\n * screen readers may announce the file name; a development warning points this out.\n *\n * @example\n * <Image src=\"/team.jpg\" alt=\"The team at the 2026 offsite\" shape=\"rounded\" />\n */\nexport const Image = ({\n  fit = 'default',\n  shape = 'square',\n  shadow = false,\n  block = false,\n  bordered = false,\n  className,\n  alt,\n  ref,\n  ...rest\n}: ImageProps) => {\n  const missingAlt = alt === undefined;\n  React.useEffect(() => {\n    if (missingAlt) {\n      warnOnce(\n        'Image:alt',\n        'Image: `alt` is missing. Describe the image, or pass alt=\"\" when it is decorative.',\n      );\n    }\n  }, [missingAlt]);\n\n  return (\n    <img\n      ref={ref}\n      alt={alt}\n      className={cn(\n        fitMap[fit],\n        shapeMap[shape],\n        // Set here, not left to Preflight (C-NATIVE). The default fit fills the box, so an\n        // automatic height keeps the aspect ratio; the other fits fit the image into the box.\n        block ? 'block w-full' : 'inline-block max-w-full',\n        fit === 'default' && 'h-auto',\n        shadow && 'shadow-4',\n        bordered && 'border border-border',\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nImage.displayName = 'Image';\n"],"mappings":"6MAuEA,IAAMM,EAAmC,CAEvC,KAAM,8BACN,OAAQ,4BACR,QAAS,iBACT,MAAO,eACP,QAAS,EACX,EAEMC,EAAuC,CAC3C,SAAU,eACV,QAAS,UACT,OAAQ,cACV,EAWaC,GAAS,CACpB,MAAM,UACN,QAAQ,SACR,SAAS,GACT,QAAQ,GACR,WAAW,GACX,YACA,MACA,MACA,GAAGC,KACa,CAChB,IAAMC,EAAaC,IAAQ,IAAA,GAU3B,OATAP,EAAM,cAAgB,CAChBM,GACFP,EAAA,SACE,YACA,oFACF,CAEJ,EAAG,CAACO,CAAU,CAAC,GAGb,EAAAL,EAAA,IAAA,CAAC,MAAD,CACO,MACA,MACL,UAAWL,EAAAA,GACTM,EAAOM,GACPL,EAASM,GAGTC,EAAQ,eAAiB,0BACzBF,IAAQ,WAAa,SACrBG,GAAU,WACVC,GAAY,uBACZC,CACF,EACA,GAAIR,CACL,CAAA,CAEL,EAEA,EAAM,YAAc"}

package/dist/components/data-display/Image.mjs

@@ -0,0 +1,32 @@
+"use client";
+import { cn as e } from "../../lib/cn.mjs";
+import { warnOnce as t } from "../../lib/dev.mjs";
+import * as n from "react";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/components/data-display/Image.tsx
+var i = {
+	none: "object-none object-left-top",
+	center: "object-none object-center",
+	contain: "object-contain",
+	cover: "object-cover",
+	default: ""
+}, a = {
+	circular: "rounded-full",
+	rounded: "rounded",
+	square: "rounded-none"
+}, o = ({ fit: o = "default", shape: s = "square", shadow: c = !1, block: l = !1, bordered: u = !1, className: d, alt: f, ref: p, ...m }) => {
+	let h = f === void 0;
+	return n.useEffect(() => {
+		h && t("Image:alt", "Image: `alt` is missing. Describe the image, or pass alt=\"\" when it is decorative.");
+	}, [h]), /* @__PURE__ */ r("img", {
+		ref: p,
+		alt: f,
+		className: e(i[o], a[s], l ? "block w-full" : "inline-block max-w-full", o === "default" && "h-auto", c && "shadow-4", u && "border border-border", d),
+		...m
+	});
+};
+o.displayName = "Image";
+//#endregion
+export { o as Image };
+
+//# sourceMappingURL=Image.mjs.map

package/dist/components/data-display/Image.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Image.mjs","names":["React","fitMap","shapeMap","Image","rest","missingAlt","alt","warnOnce","cn","fit","shape","block","shadow","bordered","className"],"sources":["../../../src/components/data-display/Image.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport { warnOnce } from '../../lib/dev';\nimport type { Shape } from '../../lib/types';\n\n/**\n * How an image fits its box (the `width`/`height` attributes, or a size set with `className`):\n *\n * - `'default'`: the image fills the box. Its height follows its width, so the aspect ratio is\n *   kept (the attributes only give the ratio before the image loads); a height set with\n *   `className` fixes the box, and the image then stretches to it.\n * - `'none'`: not scaled; the image's top-left corner stays in view and the rest is cropped.\n * - `'center'`: not scaled; the middle of the image stays in view and the edges are cropped.\n * - `'contain'`: scaled to fit inside the box, keeping its aspect ratio (the box may show empty\n *   bands).\n * - `'cover'`: scaled to fill the box, keeping its aspect ratio (the edges are cropped).\n */\nexport type ImageFit = 'none' | 'center' | 'contain' | 'cover' | 'default';\n/** Shape of the image corners (the shared {@link Shape} vocabulary). */\nexport type ImageShape = Shape;\n\n/** Properties for the Image component. */\nexport interface ImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {\n  /**\n   * Text alternative of the image. Describe what the image shows, or pass `alt=\"\"` when it is\n   * decorative (it then is hidden from assistive technology). Leaving it out logs a development\n   * warning; use {@link StrictImageProps} to require it at compile time (required in 1.0).\n   */\n  alt?: string;\n  /**\n   * How the image fits its box: `'default'` (fills it, keeping the aspect ratio through an\n   * automatic height), `'none'` (not scaled, top-left corner in view), `'center'` (not scaled,\n   * middle in view), `'contain'` or `'cover'`. See {@link ImageFit}.\n   * @default 'default'\n   */\n  fit?: ImageFit;\n  /** Shape of the image border radius.\n   * @default 'square'\n   */\n  shape?: ImageShape;\n  /** Whether to apply a shadow to the image.\n   * @default false\n   */\n  shadow?: boolean;\n  /**\n   * Whether the image is displayed as a block element filling the width of its parent. Otherwise\n   * it is inline and never wider than its parent. With the default `fit` the height follows the\n   * width (the aspect ratio is kept); with another `fit` the box keeps its `height`.\n   * @default false\n   */\n  block?: boolean;\n  /** Whether to show a border around the image.\n   * @default false\n   */\n  bordered?: boolean;\n  /** Ref to the `<img>` element. */\n  ref?: React.Ref<HTMLImageElement>;\n}\n\n/**\n * {@link ImageProps} with a required `alt`: the compile-time check that every image has a text\n * alternative (`alt=\"\"` for decorative images). `ImageProps.alt` becomes required in 1.0.\n *\n * @example\n * const Photo = (props: StrictImageProps) => <Image {...props} />;\n */\nexport interface StrictImageProps extends Omit<ImageProps, 'alt'> {\n  /** Text alternative of the image; `''` for a decorative image. */\n  alt: string;\n}\n\nconst fitMap: Record<ImageFit, string> = {\n  // wave-allow-physical: the anchor is the image's own corner; image pixels never mirror in RTL.\n  none: 'object-none object-left-top',\n  center: 'object-none object-center',\n  contain: 'object-contain',\n  cover: 'object-cover',\n  default: '',\n};\n\nconst shapeMap: Record<ImageShape, string> = {\n  circular: 'rounded-full',\n  rounded: 'rounded',\n  square: 'rounded-none',\n};\n\n/**\n * An `<img>` with Wave fit, shape, shadow and border options.\n *\n * Always pass `alt`: a description of the image, or `alt=\"\"` for a decorative image. Without it\n * screen readers may announce the file name; a development warning points this out.\n *\n * @example\n * <Image src=\"/team.jpg\" alt=\"The team at the 2026 offsite\" shape=\"rounded\" />\n */\nexport const Image = ({\n  fit = 'default',\n  shape = 'square',\n  shadow = false,\n  block = false,\n  bordered = false,\n  className,\n  alt,\n  ref,\n  ...rest\n}: ImageProps) => {\n  const missingAlt = alt === undefined;\n  React.useEffect(() => {\n    if (missingAlt) {\n      warnOnce(\n        'Image:alt',\n        'Image: `alt` is missing. Describe the image, or pass alt=\"\" when it is decorative.',\n      );\n    }\n  }, [missingAlt]);\n\n  return (\n    <img\n      ref={ref}\n      alt={alt}\n      className={cn(\n        fitMap[fit],\n        shapeMap[shape],\n        // Set here, not left to Preflight (C-NATIVE). The default fit fills the box, so an\n        // automatic height keeps the aspect ratio; the other fits fit the image into the box.\n        block ? 'block w-full' : 'inline-block max-w-full',\n        fit === 'default' && 'h-auto',\n        shadow && 'shadow-4',\n        bordered && 'border border-border',\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nImage.displayName = 'Image';\n"],"mappings":";;;;;;AAuEA,IAAMC,IAAmC;CAEvC,MAAM;CACN,QAAQ;CACR,SAAS;CACT,OAAO;CACP,SAAS;AACX,GAEMC,IAAuC;CAC3C,UAAU;CACV,SAAS;CACT,QAAQ;AACV,GAWaC,KAAS,EACpB,SAAM,WACN,WAAQ,UACR,YAAS,IACT,WAAQ,IACR,cAAW,IACX,cACA,QACA,QACA,GAAGC,QACa;CAChB,IAAMC,IAAaC,MAAQ,KAAA;CAU3B,OATAN,EAAM,gBAAgB;EACpB,AAAIK,KACFE,EACE,aACA,sFACF;CAEJ,GAAG,CAACF,CAAU,CAAC,GAGb,kBAAC,OAAD;EACO;EACA;EACL,WAAWG,EACTP,EAAOQ,IACPP,EAASQ,IAGTC,IAAQ,iBAAiB,2BACzBF,MAAQ,aAAa,UACrBG,KAAU,YACVC,KAAY,wBACZC,CACF;EACA,GAAIV;CACL,CAAA;AAEL;AAEA,EAAM,cAAc"}

package/dist/components/data-display/InfoLabel.cjs

@@ -0,0 +1,2 @@
+"use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/cn.cjs"),n=require("../../hooks/useId.cjs"),r=require("../../hooks/useMergedRefs.cjs"),i=require("../../hooks/useDismiss.cjs"),a=require("../portal/Portal.cjs"),o=require("../../lib/styles.cjs"),s=require("../../lib/icons.cjs"),c=require("../../hooks/usePopupPosition.cjs");let l=require("react");l=e.__toESM(l,1);let u=require("react/jsx-runtime");var d=250,f=250,p=({label:e,info:p,infoButtonLabel:m=`Information`,className:h,ref:g,..._})=>{let v=n.useId(`info-label-description`),[y,b]=l.useState(null),x=y!==null,S=l.useRef(null),C=l.useRef(null),w=l.useRef(!1),T=l.useRef(null),E=l.useRef(null),D=l.useRef(null),O=()=>{E.current!==null&&clearTimeout(E.current),E.current=null},k=()=>{D.current!==null&&clearTimeout(D.current),D.current=null};l.useEffect(()=>()=>{T.current!==null&&clearTimeout(T.current),E.current!==null&&clearTimeout(E.current),D.current!==null&&clearTimeout(D.current)},[]);let A=()=>{O(),k(),b(null)},{setReference:j,setFloating:M,floatingProps:N}=c.usePopupPosition({open:x,side:`top`,align:`center`,offset:8}),{layerId:P}=i.useDismiss({open:x,onDismiss:A,refs:[S,C],anchorRef:S,focusOutside:!0}),F=r.useMergedRefs(S,j),I=r.useMergedRefs(C,M),L=()=>{O(),k(),D.current=setTimeout(()=>{D.current=null,b(e=>e===`hover`?null:e)},f)},R=e=>{e.pointerType!==`touch`&&(k(),!(x||E.current!==null)&&(E.current=setTimeout(()=>{E.current=null,b(e=>e??`hover`)},d)))},z=e=>{e.pointerType!==`touch`&&L()},B=()=>{w.current=!0,T.current!==null&&clearTimeout(T.current),T.current=setTimeout(()=>{T.current=null,w.current=!1},0)},V=()=>{w.current||b(e=>e===`click`?e:`focus`)},H=()=>{b(e=>e===`focus`?null:e)},U=()=>{O(),k(),b(e=>e===`click`?null:`click`)};return(0,u.jsxs)(`span`,{ref:g,className:t.cn(`inline-flex items-center gap-1 text-body-1`,h),..._,children:[e,(0,u.jsx)(`button`,{ref:F,type:`button`,"aria-label":m,"aria-expanded":x,"aria-describedby":v,className:t.cn(`inline-flex size-4 shrink-0 items-center justify-center rounded-full border-0 bg-transparent p-0 text-muted-foreground`,`not-disabled:not-aria-disabled:hover:text-foreground`,o.focusRing),onPointerDown:B,onMouseDown:B,onPointerEnter:R,onPointerLeave:z,onFocus:V,onBlur:H,onClick:U,children:(0,u.jsx)(s.InfoIcon,{size:16})}),(0,u.jsx)(`span`,{id:v,hidden:!0,children:p}),x&&(0,u.jsx)(a.Portal,{layerId:P,children:(0,u.jsx)(`div`,{ref:I,"aria-hidden":`true`,"data-wave-infolabel-surface":``,"data-state":`open`,...N,className:`w-max max-w-xs rounded-md border border-border bg-background px-3 py-2 text-caption-1 text-foreground shadow-16`,onPointerEnter:R,onPointerLeave:z,children:p})})]})};p.displayName=`InfoLabel`,exports.InfoLabel=p;
+//# sourceMappingURL=InfoLabel.cjs.map

package/dist/components/data-display/InfoLabel.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfoLabel.cjs","names":["useId","React","usePopupPosition","useDismiss","useMergedRefs","cn","focusRing","InfoIcon","Portal","require_runtime","require_cn","require_useId","require_useMergedRefs","require_useDismiss","require_Portal","require_styles","require_icons","require_usePopupPosition","react","react_jsx_runtime","SHOW_DELAY","HIDE_DELAY","InfoLabel","props","descriptionId","openReason","setOpenReason","open","triggerRef","surfaceRef","pointerPressRef","pressTimerRef","showTimerRef","hideTimerRef","clearShowTimer","clearHideTimer","close","triggerRefs","setReference","surfaceRefs","setFloating","scheduleHide","reason","handlePointerEnter","event","handlePointerLeave","handlePointerDown","handleFocus","handleBlur","handleClick","className","label","infoButtonLabel","info","floatingProps"],"sources":["../../../src/components/data-display/InfoLabel.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport { focusRing } from '../../lib/styles';\nimport { InfoIcon } from '../../lib/icons';\nimport { useId } from '../../hooks/useId';\nimport { useDismiss } from '../../hooks/useDismiss';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { usePopupPosition } from '../../hooks/usePopupPosition';\nimport { Portal } from '../portal/Portal';\n\n/** Properties for the InfoLabel component. */\nexport interface InfoLabelProps extends React.HTMLAttributes<HTMLSpanElement> {\n  /** Primary label text to display. */\n  label: string;\n  /**\n   * Additional information about the label. It describes the info button\n   * (`aria-describedby`, available from the first render) and is shown in a popup on hover,\n   * keyboard focus or click.\n   */\n  info: string;\n  /**\n   * Accessible name of the info button. Localise it here.\n   * @default 'Information'\n   */\n  infoButtonLabel?: string;\n  /** Ref to the root `<span>`. */\n  ref?: React.Ref<HTMLSpanElement>;\n}\n\n/** Why the popup is open: a click pins it; hover and keyboard focus open it transiently. */\ntype OpenReason = 'hover' | 'focus' | 'click';\n\n/** Hover delay before the popup opens, and before it closes after the pointer leaves (ms). */\nconst SHOW_DELAY = 250;\nconst HIDE_DELAY = 250;\n\ntype Timer = ReturnType<typeof setTimeout>;\n\n/**\n * A label with an info button that reveals additional information (a \"toggletip\").\n *\n * - The info button is a `<button type=\"button\">` named `infoButtonLabel` (\"Information\"). The\n *   info text is rendered inline in a `hidden` element and linked with `aria-describedby`, so it is\n *   announced from the first render (also after server rendering), whether the popup is open or not.\n * - The visual popup is portaled only while open. It is `aria-hidden` because it duplicates the\n *   description, and it holds no focusable content, so focus stays on the button.\n * - Opens on keyboard focus (not on focus that comes from a pointer press), on hover after a\n *   short delay (the popup itself can be hovered) and on click. A click pins it: a click while it is\n *   open because of hover or focus keeps it open, a click on a pinned popup closes it.\n * - Closes on Escape, on a press outside, when focus moves elsewhere and — unless pinned — when\n *   the pointer leaves or the button loses focus (WCAG 1.4.13). A popup opened by hover that then\n *   receives keyboard focus stays open while the button keeps focus, even after the pointer leaves.\n *\n * @example\n * <InfoLabel label=\"Password\" info=\"Use at least 8 characters.\" />\n */\nexport const InfoLabel = ({\n  label,\n  info,\n  infoButtonLabel = 'Information',\n  className,\n  ref,\n  ...props\n}: InfoLabelProps) => {\n  const descriptionId = useId('info-label-description');\n  const [openReason, setOpenReason] = React.useState<OpenReason | null>(null);\n  const open = openReason !== null;\n\n  const triggerRef = React.useRef<HTMLButtonElement | null>(null);\n  const surfaceRef = React.useRef<HTMLDivElement | null>(null);\n  /**\n   * Set by a pointer press on the button, so the focus that follows does not open the popup. It\n   * lasts only for the event turn of the press (see `handlePointerDown`).\n   */\n  const pointerPressRef = React.useRef(false);\n  const pressTimerRef = React.useRef<Timer | null>(null);\n  const showTimerRef = React.useRef<Timer | null>(null);\n  const hideTimerRef = React.useRef<Timer | null>(null);\n\n  const clearShowTimer = () => {\n    if (showTimerRef.current !== null) clearTimeout(showTimerRef.current);\n    showTimerRef.current = null;\n  };\n  const clearHideTimer = () => {\n    if (hideTimerRef.current !== null) clearTimeout(hideTimerRef.current);\n    hideTimerRef.current = null;\n  };\n\n  React.useEffect(\n    () => () => {\n      if (pressTimerRef.current !== null) clearTimeout(pressTimerRef.current);\n      if (showTimerRef.current !== null) clearTimeout(showTimerRef.current);\n      if (hideTimerRef.current !== null) clearTimeout(hideTimerRef.current);\n    },\n    [],\n  );\n\n  const close = () => {\n    clearShowTimer();\n    clearHideTimer();\n    setOpenReason(null);\n  };\n\n  const { setReference, setFloating, floatingProps } = usePopupPosition({\n    open,\n    side: 'top',\n    align: 'center',\n    offset: 8,\n  });\n  const { layerId } = useDismiss({\n    open,\n    onDismiss: close,\n    refs: [triggerRef, surfaceRef],\n    anchorRef: triggerRef,\n    focusOutside: true,\n  });\n  const triggerRefs = useMergedRefs<HTMLButtonElement>(triggerRef, setReference);\n  const surfaceRefs = useMergedRefs<HTMLDivElement>(surfaceRef, setFloating);\n\n  /** Pointer left the button or the popup: a hover-opened popup closes after a delay. */\n  const scheduleHide = () => {\n    clearShowTimer();\n    clearHideTimer();\n    hideTimerRef.current = setTimeout(() => {\n      hideTimerRef.current = null;\n      setOpenReason((reason) => (reason === 'hover' ? null : reason));\n    }, HIDE_DELAY);\n  };\n\n  const handlePointerEnter = (event: React.PointerEvent) => {\n    if (event.pointerType === 'touch') return;\n    clearHideTimer();\n    if (open || showTimerRef.current !== null) return;\n    showTimerRef.current = setTimeout(() => {\n      showTimerRef.current = null;\n      setOpenReason((reason) => reason ?? 'hover');\n    }, SHOW_DELAY);\n  };\n\n  const handlePointerLeave = (event: React.PointerEvent) => {\n    if (event.pointerType === 'touch') return;\n    scheduleHide();\n  };\n\n  const handlePointerDown = () => {\n    pointerPressRef.current = true;\n    // A press focuses the button (where it does) as the default action of `mousedown`, in the same\n    // event turn. Forget the press after that turn: a press that does not focus the button (Safari\n    // and Firefox on macOS, iOS) and ends without a click (dragged off, or a touch that becomes a\n    // scroll) must not turn a later keyboard focus into pointer focus. A touch tap dispatches its\n    // compatibility `mousedown` (and the focus) after the touch ends; that `mousedown` sets the\n    // flag again.\n    if (pressTimerRef.current !== null) clearTimeout(pressTimerRef.current);\n    pressTimerRef.current = setTimeout(() => {\n      pressTimerRef.current = null;\n      pointerPressRef.current = false;\n    }, 0);\n  };\n\n  const handleFocus = () => {\n    // Keyboard focus opens; focus that comes from a pointer press waits for the click.\n    if (pointerPressRef.current) return;\n    // A popup opened by hover becomes focus-owned, so it stays while the button has focus even\n    // after the pointer leaves (WCAG 1.4.13 persistent). A pinned popup stays pinned.\n    setOpenReason((reason) => (reason === 'click' ? reason : 'focus'));\n  };\n\n  const handleBlur = () => {\n    setOpenReason((reason) => (reason === 'focus' ? null : reason));\n  };\n\n  const handleClick = () => {\n    clearShowTimer();\n    clearHideTimer();\n    // Closed → pinned; open because of hover or focus → pinned; pinned → closed.\n    setOpenReason((reason) => (reason === 'click' ? null : 'click'));\n  };\n\n  return (\n    <span\n      ref={ref}\n      className={cn('inline-flex items-center gap-1 text-body-1', className)}\n      {...props}\n    >\n      {label}\n      <button\n        ref={triggerRefs}\n        type=\"button\"\n        aria-label={infoButtonLabel}\n        aria-expanded={open}\n        aria-describedby={descriptionId}\n        className={cn(\n          'inline-flex size-4 shrink-0 items-center justify-center rounded-full border-0 bg-transparent p-0 text-muted-foreground',\n          'not-disabled:not-aria-disabled:hover:text-foreground',\n          focusRing,\n        )}\n        onPointerDown={handlePointerDown}\n        onMouseDown={handlePointerDown}\n        onPointerEnter={handlePointerEnter}\n        onPointerLeave={handlePointerLeave}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        onClick={handleClick}\n      >\n        <InfoIcon size={16} />\n      </button>\n      <span id={descriptionId} hidden>\n        {info}\n      </span>\n      {open && (\n        <Portal layerId={layerId}>\n          <div\n            ref={surfaceRefs}\n            aria-hidden=\"true\"\n            data-wave-infolabel-surface=\"\"\n            data-state=\"open\"\n            {...floatingProps}\n            className=\"w-max max-w-xs rounded-md border border-border bg-background px-3 py-2 text-caption-1 text-foreground shadow-16\"\n            onPointerEnter={handlePointerEnter}\n            onPointerLeave={handlePointerLeave}\n          >\n            {info}\n          </div>\n        </Portal>\n      )}\n    </span>\n  );\n};\n\nInfoLabel.displayName = 'InfoLabel';\n"],"mappings":"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"}

package/dist/components/data-display/InfoLabel.mjs

@@ -0,0 +1,104 @@
+"use client";
+import { cn as e } from "../../lib/cn.mjs";
+import { useId as t } from "../../hooks/useId.mjs";
+import { useMergedRefs as n } from "../../hooks/useMergedRefs.mjs";
+import { useDismiss as r } from "../../hooks/useDismiss.mjs";
+import { Portal as i } from "../portal/Portal.mjs";
+import { focusRing as a } from "../../lib/styles.mjs";
+import { InfoIcon as o } from "../../lib/icons.mjs";
+import { usePopupPosition as s } from "../../hooks/usePopupPosition.mjs";
+import * as c from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/data-display/InfoLabel.tsx
+var d = 250, f = 250, p = ({ label: p, info: m, infoButtonLabel: h = "Information", className: g, ref: _, ...v }) => {
+	let y = t("info-label-description"), [b, x] = c.useState(null), S = b !== null, C = c.useRef(null), w = c.useRef(null), T = c.useRef(!1), E = c.useRef(null), D = c.useRef(null), O = c.useRef(null), k = () => {
+		D.current !== null && clearTimeout(D.current), D.current = null;
+	}, A = () => {
+		O.current !== null && clearTimeout(O.current), O.current = null;
+	};
+	c.useEffect(() => () => {
+		E.current !== null && clearTimeout(E.current), D.current !== null && clearTimeout(D.current), O.current !== null && clearTimeout(O.current);
+	}, []);
+	let j = () => {
+		k(), A(), x(null);
+	}, { setReference: M, setFloating: N, floatingProps: P } = s({
+		open: S,
+		side: "top",
+		align: "center",
+		offset: 8
+	}), { layerId: F } = r({
+		open: S,
+		onDismiss: j,
+		refs: [C, w],
+		anchorRef: C,
+		focusOutside: !0
+	}), I = n(C, M), L = n(w, N), R = () => {
+		k(), A(), O.current = setTimeout(() => {
+			O.current = null, x((e) => e === "hover" ? null : e);
+		}, f);
+	}, z = (e) => {
+		e.pointerType !== "touch" && (A(), !(S || D.current !== null) && (D.current = setTimeout(() => {
+			D.current = null, x((e) => e ?? "hover");
+		}, d)));
+	}, B = (e) => {
+		e.pointerType !== "touch" && R();
+	}, V = () => {
+		T.current = !0, E.current !== null && clearTimeout(E.current), E.current = setTimeout(() => {
+			E.current = null, T.current = !1;
+		}, 0);
+	}, H = () => {
+		T.current || x((e) => e === "click" ? e : "focus");
+	}, U = () => {
+		x((e) => e === "focus" ? null : e);
+	}, W = () => {
+		k(), A(), x((e) => e === "click" ? null : "click");
+	};
+	return /* @__PURE__ */ u("span", {
+		ref: _,
+		className: e("inline-flex items-center gap-1 text-body-1", g),
+		...v,
+		children: [
+			p,
+			/* @__PURE__ */ l("button", {
+				ref: I,
+				type: "button",
+				"aria-label": h,
+				"aria-expanded": S,
+				"aria-describedby": y,
+				className: e("inline-flex size-4 shrink-0 items-center justify-center rounded-full border-0 bg-transparent p-0 text-muted-foreground", "not-disabled:not-aria-disabled:hover:text-foreground", a),
+				onPointerDown: V,
+				onMouseDown: V,
+				onPointerEnter: z,
+				onPointerLeave: B,
+				onFocus: H,
+				onBlur: U,
+				onClick: W,
+				children: /* @__PURE__ */ l(o, { size: 16 })
+			}),
+			/* @__PURE__ */ l("span", {
+				id: y,
+				hidden: !0,
+				children: m
+			}),
+			S && /* @__PURE__ */ l(i, {
+				layerId: F,
+				children: /* @__PURE__ */ l("div", {
+					ref: L,
+					"aria-hidden": "true",
+					"data-wave-infolabel-surface": "",
+					"data-state": "open",
+					...P,
+					className: "w-max max-w-xs rounded-md border border-border bg-background px-3 py-2 text-caption-1 text-foreground shadow-16",
+					onPointerEnter: z,
+					onPointerLeave: B,
+					children: m
+				})
+			})
+		]
+	});
+};
+p.displayName = "InfoLabel";
+//#endregion
+export { p as InfoLabel };
+
+//# sourceMappingURL=InfoLabel.mjs.map

package/dist/components/data-display/InfoLabel.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfoLabel.mjs","names":["useId","useId$1","React","SHOW_DELAY","HIDE_DELAY","InfoLabel","props","descriptionId","openReason","setOpenReason","open","triggerRef","surfaceRef","pointerPressRef","pressTimerRef","showTimerRef","hideTimerRef","clearShowTimer","clearHideTimer","close","usePopupPosition","useDismiss","triggerRefs","useMergedRefs","setReference","surfaceRefs","setFloating","scheduleHide","reason","handlePointerEnter","event","handlePointerLeave","handlePointerDown","handleFocus","handleBlur","handleClick","cn","className","label","infoButtonLabel","focusRing","InfoIcon","info","Portal","floatingProps"],"sources":["../../../src/components/data-display/InfoLabel.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport { focusRing } from '../../lib/styles';\nimport { InfoIcon } from '../../lib/icons';\nimport { useId } from '../../hooks/useId';\nimport { useDismiss } from '../../hooks/useDismiss';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { usePopupPosition } from '../../hooks/usePopupPosition';\nimport { Portal } from '../portal/Portal';\n\n/** Properties for the InfoLabel component. */\nexport interface InfoLabelProps extends React.HTMLAttributes<HTMLSpanElement> {\n  /** Primary label text to display. */\n  label: string;\n  /**\n   * Additional information about the label. It describes the info button\n   * (`aria-describedby`, available from the first render) and is shown in a popup on hover,\n   * keyboard focus or click.\n   */\n  info: string;\n  /**\n   * Accessible name of the info button. Localise it here.\n   * @default 'Information'\n   */\n  infoButtonLabel?: string;\n  /** Ref to the root `<span>`. */\n  ref?: React.Ref<HTMLSpanElement>;\n}\n\n/** Why the popup is open: a click pins it; hover and keyboard focus open it transiently. */\ntype OpenReason = 'hover' | 'focus' | 'click';\n\n/** Hover delay before the popup opens, and before it closes after the pointer leaves (ms). */\nconst SHOW_DELAY = 250;\nconst HIDE_DELAY = 250;\n\ntype Timer = ReturnType<typeof setTimeout>;\n\n/**\n * A label with an info button that reveals additional information (a \"toggletip\").\n *\n * - The info button is a `<button type=\"button\">` named `infoButtonLabel` (\"Information\"). The\n *   info text is rendered inline in a `hidden` element and linked with `aria-describedby`, so it is\n *   announced from the first render (also after server rendering), whether the popup is open or not.\n * - The visual popup is portaled only while open. It is `aria-hidden` because it duplicates the\n *   description, and it holds no focusable content, so focus stays on the button.\n * - Opens on keyboard focus (not on focus that comes from a pointer press), on hover after a\n *   short delay (the popup itself can be hovered) and on click. A click pins it: a click while it is\n *   open because of hover or focus keeps it open, a click on a pinned popup closes it.\n * - Closes on Escape, on a press outside, when focus moves elsewhere and — unless pinned — when\n *   the pointer leaves or the button loses focus (WCAG 1.4.13). A popup opened by hover that then\n *   receives keyboard focus stays open while the button keeps focus, even after the pointer leaves.\n *\n * @example\n * <InfoLabel label=\"Password\" info=\"Use at least 8 characters.\" />\n */\nexport const InfoLabel = ({\n  label,\n  info,\n  infoButtonLabel = 'Information',\n  className,\n  ref,\n  ...props\n}: InfoLabelProps) => {\n  const descriptionId = useId('info-label-description');\n  const [openReason, setOpenReason] = React.useState<OpenReason | null>(null);\n  const open = openReason !== null;\n\n  const triggerRef = React.useRef<HTMLButtonElement | null>(null);\n  const surfaceRef = React.useRef<HTMLDivElement | null>(null);\n  /**\n   * Set by a pointer press on the button, so the focus that follows does not open the popup. It\n   * lasts only for the event turn of the press (see `handlePointerDown`).\n   */\n  const pointerPressRef = React.useRef(false);\n  const pressTimerRef = React.useRef<Timer | null>(null);\n  const showTimerRef = React.useRef<Timer | null>(null);\n  const hideTimerRef = React.useRef<Timer | null>(null);\n\n  const clearShowTimer = () => {\n    if (showTimerRef.current !== null) clearTimeout(showTimerRef.current);\n    showTimerRef.current = null;\n  };\n  const clearHideTimer = () => {\n    if (hideTimerRef.current !== null) clearTimeout(hideTimerRef.current);\n    hideTimerRef.current = null;\n  };\n\n  React.useEffect(\n    () => () => {\n      if (pressTimerRef.current !== null) clearTimeout(pressTimerRef.current);\n      if (showTimerRef.current !== null) clearTimeout(showTimerRef.current);\n      if (hideTimerRef.current !== null) clearTimeout(hideTimerRef.current);\n    },\n    [],\n  );\n\n  const close = () => {\n    clearShowTimer();\n    clearHideTimer();\n    setOpenReason(null);\n  };\n\n  const { setReference, setFloating, floatingProps } = usePopupPosition({\n    open,\n    side: 'top',\n    align: 'center',\n    offset: 8,\n  });\n  const { layerId } = useDismiss({\n    open,\n    onDismiss: close,\n    refs: [triggerRef, surfaceRef],\n    anchorRef: triggerRef,\n    focusOutside: true,\n  });\n  const triggerRefs = useMergedRefs<HTMLButtonElement>(triggerRef, setReference);\n  const surfaceRefs = useMergedRefs<HTMLDivElement>(surfaceRef, setFloating);\n\n  /** Pointer left the button or the popup: a hover-opened popup closes after a delay. */\n  const scheduleHide = () => {\n    clearShowTimer();\n    clearHideTimer();\n    hideTimerRef.current = setTimeout(() => {\n      hideTimerRef.current = null;\n      setOpenReason((reason) => (reason === 'hover' ? null : reason));\n    }, HIDE_DELAY);\n  };\n\n  const handlePointerEnter = (event: React.PointerEvent) => {\n    if (event.pointerType === 'touch') return;\n    clearHideTimer();\n    if (open || showTimerRef.current !== null) return;\n    showTimerRef.current = setTimeout(() => {\n      showTimerRef.current = null;\n      setOpenReason((reason) => reason ?? 'hover');\n    }, SHOW_DELAY);\n  };\n\n  const handlePointerLeave = (event: React.PointerEvent) => {\n    if (event.pointerType === 'touch') return;\n    scheduleHide();\n  };\n\n  const handlePointerDown = () => {\n    pointerPressRef.current = true;\n    // A press focuses the button (where it does) as the default action of `mousedown`, in the same\n    // event turn. Forget the press after that turn: a press that does not focus the button (Safari\n    // and Firefox on macOS, iOS) and ends without a click (dragged off, or a touch that becomes a\n    // scroll) must not turn a later keyboard focus into pointer focus. A touch tap dispatches its\n    // compatibility `mousedown` (and the focus) after the touch ends; that `mousedown` sets the\n    // flag again.\n    if (pressTimerRef.current !== null) clearTimeout(pressTimerRef.current);\n    pressTimerRef.current = setTimeout(() => {\n      pressTimerRef.current = null;\n      pointerPressRef.current = false;\n    }, 0);\n  };\n\n  const handleFocus = () => {\n    // Keyboard focus opens; focus that comes from a pointer press waits for the click.\n    if (pointerPressRef.current) return;\n    // A popup opened by hover becomes focus-owned, so it stays while the button has focus even\n    // after the pointer leaves (WCAG 1.4.13 persistent). A pinned popup stays pinned.\n    setOpenReason((reason) => (reason === 'click' ? reason : 'focus'));\n  };\n\n  const handleBlur = () => {\n    setOpenReason((reason) => (reason === 'focus' ? null : reason));\n  };\n\n  const handleClick = () => {\n    clearShowTimer();\n    clearHideTimer();\n    // Closed → pinned; open because of hover or focus → pinned; pinned → closed.\n    setOpenReason((reason) => (reason === 'click' ? null : 'click'));\n  };\n\n  return (\n    <span\n      ref={ref}\n      className={cn('inline-flex items-center gap-1 text-body-1', className)}\n      {...props}\n    >\n      {label}\n      <button\n        ref={triggerRefs}\n        type=\"button\"\n        aria-label={infoButtonLabel}\n        aria-expanded={open}\n        aria-describedby={descriptionId}\n        className={cn(\n          'inline-flex size-4 shrink-0 items-center justify-center rounded-full border-0 bg-transparent p-0 text-muted-foreground',\n          'not-disabled:not-aria-disabled:hover:text-foreground',\n          focusRing,\n        )}\n        onPointerDown={handlePointerDown}\n        onMouseDown={handlePointerDown}\n        onPointerEnter={handlePointerEnter}\n        onPointerLeave={handlePointerLeave}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        onClick={handleClick}\n      >\n        <InfoIcon size={16} />\n      </button>\n      <span id={descriptionId} hidden>\n        {info}\n      </span>\n      {open && (\n        <Portal layerId={layerId}>\n          <div\n            ref={surfaceRefs}\n            aria-hidden=\"true\"\n            data-wave-infolabel-surface=\"\"\n            data-state=\"open\"\n            {...floatingProps}\n            className=\"w-max max-w-xs rounded-md border border-border bg-background px-3 py-2 text-caption-1 text-foreground shadow-16\"\n            onPointerEnter={handlePointerEnter}\n            onPointerLeave={handlePointerLeave}\n          >\n            {info}\n          </div>\n        </Portal>\n      )}\n    </span>\n  );\n};\n\nInfoLabel.displayName = 'InfoLabel';\n"],"mappings":"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"}

package/dist/components/data-display/List.cjs

@@ -0,0 +1,2 @@
+"use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/cn.cjs"),n=require("../../lib/children.cjs"),r=require("../../lib/dev.cjs"),i=require("../../lib/slot.cjs"),a=require("../../lib/composeEventHandlers.cjs"),o=require("../../hooks/useEventCallback.cjs"),s=require("../../hooks/useControllable.cjs"),c=require("../../hooks/useId.cjs"),l=require("../../lib/direction.cjs"),u=require("../../lib/focus.cjs"),d=require("../../hooks/useRovingTabIndex.cjs"),f=require("../../hooks/useMergedRefs.cjs"),p=require("../../lib/styles.cjs"),m=require("./List.registry.cjs");let h=require("react");h=e.__toESM(h,1);let g=require("react/jsx-runtime");var _=h.createContext(null);_.displayName=`ListContext`;var v=null;function y(){return v??={mode:`list`,selectedValues:new Set,toggleItem:()=>{},getTabIndex:()=>-1,registry:new m.ListRegistry},v}function b(e){return h.useContext(_)||(r.reportMissingContext(e,`a List`),y())}var x=[];function S(e){r.warnOnce(`List:duplicate:${e}`,`List: several items share the value "${e}". Item values must be unique within a List; items with the same value are selected (and tab stops) together.`)}function C(e){return n.flattenChildren(e).some(({node:e})=>n.isElementOfType(e,I)&&i.slotRendersContent(e.props.action))}var w=[u.FOCUSABLE_SELECTOR,`[data-list-action]`,`label`,`[role="button"]`,`[role="link"]`,`[role="checkbox"]`,`[role="switch"]`,`[role="radio"]`,`[role="menuitem"]`,`[role="textbox"]`,`[role="combobox"]`,`[role="slider"]`,`[role="spinbutton"]`].join(`, `);function T(e){let t=e.currentTarget,n=e.target;if(!n||typeof n.nodeType!=`number`||!t.contains(n))return!0;let r=n.nodeType===Node.ELEMENT_NODE?n:n.parentElement??null;for(;r&&r!==t;r=r.parentElement)if(r.matches(w))return!0;return!1}function E(e){return e.ctrlKey||e.altKey||e.metaKey?!1:e.key===`Enter`||e.key===` `}var D=new Set([`textbox`,`searchbox`,`combobox`,`spinbutton`,`slider`]),O=new Set([`button`,`checkbox`,`color`,`file`,`hidden`,`image`,`radio`,`reset`,`submit`]);function k(e){let t=e.getAttribute(`role`);if(t!==null&&D.has(t))return!0;let n=e.localName;return n===`textarea`||n===`select`?!0:n===`input`?!O.has(e.type):e.matches(`[contenteditable]:not([contenteditable="false"])`)}function A(e){return Array.from(e.querySelectorAll(u.FOCUSABLE_SELECTOR)).filter(e=>u.isFocusable(e))}function j(e){if(!e.parentElement)return-1;let t=0;for(let n=e.previousElementSibling;n;n=n.previousElementSibling)t++;return t}function M(e,t){let n=null,r=null,i=null,a=0;for(let o=e.firstElementChild;o;o=o.nextElementSibling,a++){if(t.value!==void 0&&o.getAttribute(`data-roving-value`)===t.value){n=o;break}a===t.index&&(r=o),i=o}let o=n??r??(t.index>=0?i:null);return o?o.hasAttribute(`tabindex`)?o:A(o)[0]??null:null}function N(e){for(let t=e.firstElementChild;t;t=t.nextElementSibling)if(t.hasAttribute(`data-list-action`))return t;return null}function P(e){let t=[];for(let n of A(e)){let r=k(n)?e:n;t.includes(r)||t.push(r)}return t}var F=e=>{let{selectable:n=!1,selectionMode:i,selectedItems:o,defaultSelectedItems:c,onSelectionChange:l,selectedItem:u,defaultSelectedItem:p,onSelectedItemChange:v,className:y,children:b,ref:w,onKeyDown:T,onKeyDownCapture:E,onFocus:D,...O}=e;i===`multi`&&r.warnDeprecated(`List`,`selectionMode="multi"`,`selectionMode="multiple"`);let k=i===`multiple`||i===`multi`,A=h.useMemo(()=>!k&&u!==void 0?u===null?x:[u]:o,[k,u,o]),j=h.useMemo(()=>!k&&p!=null?[p]:c??x,[k,p,c]),[N,P]=s.useControllable(A,j,e=>{let t=[...e];l?.(t),k||v?.(t[0]??null)}),[F]=h.useState(()=>new m.ListRegistry);h.useLayoutEffect(()=>{F.setActive(n)},[F,n]);let I=h.useSyncExternalStore(F.subscribe,F.getSnapshot,F.getServerSnapshot),L=h.useMemo(()=>I?N.filter(e=>I.valueSet.has(e)):N,[I,N]),R=h.useMemo(()=>new Set(L),[L]),z=n&&(I?I.hasActions:C(b)),B=n?z?`grid`:`listbox`:`list`,V=I?I.values.find(e=>R.has(e))??null:L[0]??null,{containerProps:H,getTabIndex:U}=d.useRovingTabIndex({activeValue:V,orientation:`vertical`,typeahead:(I?.count??0)>7,tabStop:`active`,itemSelector:`:scope > [data-roving-value]`}),{ref:W,onKeyDown:G,onKeyDownCapture:K,onFocus:q}=H,J=h.useRef(null),Y=f.useMergedRefs(w,n?W:null,J);h.useLayoutEffect(()=>{let e=F.takeFocusLoss(),t=J.current;if(!e||!t)return;let n=t.ownerDocument,r=n.activeElement;r&&r!==n.body&&r.isConnected||M(t,e)?.focus()},[B,F]),h.useLayoutEffect(()=>{F.syncOrder(J.current)});let X=h.useCallback(e=>{P(t=>{let n=F.prune(t),r=n.includes(e);return k?r?n.filter(t=>t!==e):[...n,e]:r?[]:[e]})},[k,F,P]),Z=I?.duplicates??x;h.useEffect(()=>{for(let e of Z)S(e)},[Z]);let Q=L.length;h.useEffect(()=>{n&&!k&&Q>1&&r.warnOnce(`List:single-several-selected`,`List: a single-selection list (selectionMode "single") received ${Q} selected items. Pass one value with \`selectedItem\`, or use selectionMode="multiple".`)},[n,k,Q]);let $=h.useMemo(()=>({mode:B,selectedValues:R,toggleItem:X,getTabIndex:U,registry:F}),[B,R,X,U,F]),ee=B===`grid`?`div`:`ul`,te=B===`grid`?`grid`:B===`listbox`?`listbox`:`list`;return(0,g.jsx)(_.Provider,{value:$,children:(0,g.jsx)(ee,{role:te,"aria-multiselectable":n&&k?!0:void 0,className:t.cn(`m-0 list-none p-0`,y),...O,ref:Y,"data-roving-container":n?``:void 0,onKeyDown:n?a.composeEventHandlers(T,G):T,onKeyDownCapture:n?a.composeEventHandlers(E,K):E,onFocus:n?a.composeEventHandlers(D,q,{checkDefaultPrevented:!1}):D,children:b})})};F.displayName=`List`;var I=({value:e,action:n,className:r,children:s,onClick:u,onKeyDown:d,ref:m,..._})=>{let{mode:v,selectedValues:y,toggleItem:x,getTabIndex:S,registry:C}=b(`ListItem`),w=c.useId(`list-item`),D=e||void 0,O=D??w,M=i.slotRendersContent(n),[F]=h.useState(()=>({})),I=h.useRef(null),L=f.useMergedRefs(m,I);h.useLayoutEffect(()=>{C.set(F,{value:D,hasAction:M,element:I})},[C,F,D,M]),h.useLayoutEffect(()=>()=>C.delete(F),[C,F]);let R=o.useEventCallback(e=>{let t=e.parentElement;C.recordFocusLoss({value:D,index:t?j(t):-1})});h.useLayoutEffect(()=>{let e=I.current;return()=>{if(!e)return;let t=e.ownerDocument.activeElement;t&&e.contains(t)&&C.recordFocusLoss({value:D,index:j(e)})}},[C,D]);let z=D!==void 0&&y.has(D),V=v!==`list`,H=()=>{D!==void 0&&x(D)},U=e=>{T(e)||H()},W=e=>{T(e)||E(e)&&(e.preventDefault(),H())},G=e=>{let t=e.currentTarget,n=e.target,r=N(t);if(!r||!r.contains(n)){if(n!==t)return;if(E(e)){e.preventDefault(),H();return}let i=l.getArrowIntent(e.key,{orientation:`horizontal`,dir:l.getDirection(t)})===`next`&&r?P(r)[0]:void 0;i&&(e.preventDefault(),i.focus());return}if(n!==r&&k(n)){e.key===`Escape`&&(e.preventDefault(),r.focus());return}if(n===r&&(e.key===`Enter`||e.key===`F2`)){let t=A(r).find(e=>k(e));t&&(e.preventDefault(),t.focus());return}let i=l.getArrowIntent(e.key,{orientation:`horizontal`,dir:l.getDirection(t)});if(!i)return;e.preventDefault();let a=P(r),o=a.indexOf(n);i===`next`?a[o+1]?.focus():o>0?a[o-1].focus():t.focus()},K=v===`grid`?`div`:`li`,q=v===`grid`?`div`:`span`,J=v===`grid`?`row`:v===`listbox`?`option`:`listitem`,Y=V?{"aria-selected":z,tabIndex:S(O),"data-roving-value":O,"data-selected":z?``:void 0,onClick:a.composeEventHandlers(u,U),onKeyDown:a.composeEventHandlers(d,v===`grid`?G:W)}:{onClick:u,onKeyDown:d};return(0,g.jsxs)(K,{role:J,className:t.cn(`flex items-center border-b border-border px-4 py-2 text-body-1`,V&&[`relative cursor-pointer`,`focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-ring`],V&&(z?[`bg-subtle-selected before:absolute before:inset-y-2 before:start-0 before:w-0.5 before:rounded-full before:bg-primary`,p.forcedColors.selectedContainer]:`hover:bg-subtle-hover`),r),..._,ref:L,...Y,children:[(0,g.jsx)(q,{role:v===`grid`?`gridcell`:void 0,className:`min-w-0 flex-1`,children:s}),M&&(0,g.jsx)(B,{grid:v===`grid`,onRemovedWithFocus:R,children:i.materialiseSlotContent(n)})]})};I.displayName=`ListItem`;var L=[`[data-roving-container]`,...[`toolbar`,`radiogroup`,`listbox`,`grid`,`treegrid`,`tablist`,`menu`,`menubar`,`tree`].map(e=>`[role="${e}"]`)].join(`, `),R=[`tabindex`,`href`,`contenteditable`,`controls`];function z(e){let t=new Map,n=new WeakSet,r=()=>{for(let n of t.keys())e.contains(n)||t.delete(n);for(let r of e.querySelectorAll(u.FOCUSABLE_SELECTOR)){let i=r.getAttribute(`tabindex`);if(i===`-1`||n.has(r))continue;let a=r.closest(L);a&&e.contains(a)||(t.set(r,i),r.setAttribute(`tabindex`,`-1`))}};if(r(),typeof MutationObserver>`u`)return()=>{};let i=new MutationObserver(e=>{let a=new Set;for(let n of e){let e=n.target;n.attributeName===`tabindex`&&t.has(e)&&a.add(e)}for(let e of a){let r=e.getAttribute(`tabindex`);r!==`-1`&&r===t.get(e)?(t.delete(e),n.add(e)):t.set(e,r)}r(),i.takeRecords()});return i.observe(e,{subtree:!0,childList:!0,attributes:!0,attributeFilter:R}),()=>{i.disconnect();for(let[e,n]of t)n===null?e.removeAttribute(`tabindex`):e.setAttribute(`tabindex`,n);t.clear()}}function B({grid:e,onRemovedWithFocus:n,children:r}){let i=h.useRef(null);return h.useLayoutEffect(()=>{let e=i.current;return()=>{if(!e)return;let t=e.ownerDocument.activeElement;t&&e.contains(t)&&n(e)}},[n,e]),h.useLayoutEffect(()=>{let t=i.current;return e&&t?z(t):void 0},[e]),(0,g.jsx)(e?`div`:`span`,{ref:i,role:e?`gridcell`:void 0,tabIndex:e?-1:void 0,"data-list-action":``,className:t.cn(`ms-2 shrink-0`,e&&`focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-ring`),children:r})}B.displayName=`ListActionCell`;var V=Object.assign(F,{Item:I});exports.List=V,exports.ListItem=I;
+//# sourceMappingURL=List.cjs.map

package/dist/components/data-display/List.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.cjs","names":["React","ListRegistry","flattenChildren","isElementOfType","slotRendersContent","FOCUSABLE_SELECTOR","isFocusable","useControllable","useRovingTabIndex","useMergedRefs","cn","composeEventHandlers","useId","useEventCallback","getArrowIntent","getDirection","forcedColors","materialiseSlotContent","require_runtime","require_cn","require_children","require_dev","require_slot","require_composeEventHandlers","require_useEventCallback","require_useControllable","require_useId","require_direction","require_focus","require_useRovingTabIndex","require_useMergedRefs","require_styles","require_List_registry","react","react_jsx_runtime","ListContext","inertContext","getInertContext","useListContext","componentName","EMPTY","warnDuplicateValue","value","childrenHaveAction","children","node","ListItem","INTERACTIVE_SELECTOR","isForeignEvent","item","event","target","isActivationKey","TEXT_ENTRY_ROLES","NON_TEXT_INPUT_TYPES","isTextEntry","role","el","tag","getFocusables","cell","getItemIndex","index","getFocusRestoreTarget","byValue","atIndex","last","root","loss","getActionCell","child","getActionStops","stops","stop","ListRoot","rest","props","selectionMode","multiple","controlledSelection","selectedItem","selectedItems","defaultSelection","defaultSelectedItem","defaultSelectedItems","selected","setSelected","selection","next","onSelectionChange","onSelectedItemChange","registry","selectable","registered","effective","selectedValues","hasActions","mode","tabStopValue","rovingRef","rovingKeyDown","rovingKeyDownCapture","rovingFocus","containerProps","rootElementRef","rootRef","ref","doc","active","toggleItem","current","previous","isSelected","duplicates","selectedCount","contextValue","getTabIndex","Root","className","onKeyDown","onKeyDownCapture","onFocus","autoValue","selectableValue","rovingValue","hasAction","action","token","itemRef","itemRefs","recordActionFocusLoss","activate","handleClick","handleOptionKeyDown","handleRowKeyDown","rowElement","first","entry","intent","Element","ContentCell","interactiveProps","onClick","ListActionCell","COMPOSITE_SELECTOR","STAMP_OBSERVED_ATTRIBUTES","stampActionCell","stamped","yielded","stamp","tabIndex","composite","observer","changed","record","records","original","cellRef","onRemovedWithFocus","grid","List"],"sources":["../../../src/components/data-display/List.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport { flattenChildren, isElementOfType } from '../../lib/children';\nimport { composeEventHandlers } from '../../lib/composeEventHandlers';\nimport { reportMissingContext, warnDeprecated, warnOnce } from '../../lib/dev';\nimport { getArrowIntent, getDirection } from '../../lib/direction';\nimport { FOCUSABLE_SELECTOR, isFocusable } from '../../lib/focus';\nimport { materialiseSlotContent, slotRendersContent } from '../../lib/slot';\nimport { focusRingInset, forcedColors } from '../../lib/styles';\nimport type { SelectionMode } from '../../lib/types';\nimport { useControllable } from '../../hooks/useControllable';\nimport { useEventCallback } from '../../hooks/useEventCallback';\nimport { useId } from '../../hooks/useId';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { useRovingTabIndex } from '../../hooks/useRovingTabIndex';\nimport { ListRegistry, type ListFocusLoss } from './List.registry';\n\n/** Selection modes of {@link List}: the shared `SelectionMode` plus the deprecated `'multi'`. */\nexport type ListSelectionMode = SelectionMode | 'multi';\n\n/**\n * Properties for the List component.\n *\n * The type parameter `M` is the `selectionMode` literal. It makes the single-selection props\n * (`selectedItem`, `defaultSelectedItem`, `onSelectedItemChange`) type errors when\n * `selectionMode=\"multiple\"` is passed; `ListProps` without a type argument accepts every mode\n * (the 0.4 shape, extendable by interfaces).\n */\nexport interface ListProps<\n  M extends ListSelectionMode = ListSelectionMode,\n> extends React.HTMLAttributes<HTMLUListElement> {\n  /** Whether list items can be selected.\n   * @default false\n   */\n  selectable?: boolean;\n  /**\n   * Selection behavior when `selectable` is true. `'multi'` is a deprecated alias of `'multiple'`.\n   * @default 'single'\n   */\n  selectionMode?: M;\n  /**\n   * Controlled array of selected item values (both modes). In single mode prefer `selectedItem`;\n   * a single-selection list that receives several values warns in development.\n   */\n  selectedItems?: readonly string[];\n  /** Default selected items for uncontrolled usage.\n   * @default []\n   */\n  defaultSelectedItems?: readonly string[];\n  /** Called with the next array of selected values when the selection changes (both modes). */\n  onSelectionChange?: (selected: string[]) => void;\n  /** Single mode: the controlled selected value (`null`: nothing selected). */\n  selectedItem?: M extends 'single' ? string | null : never;\n  /** Single mode: the initially selected value for uncontrolled usage. */\n  defaultSelectedItem?: M extends 'single' ? string | null : never;\n  /** Single mode: called with the newly selected value, or `null` when it was deselected. */\n  onSelectedItemChange?: M extends 'single' ? (item: string | null) => void : never;\n  /**\n   * Ref to the root element: a `<ul>`, or a `<div role=\"grid\">` for a selectable list whose items\n   * have actions.\n   */\n  ref?: React.Ref<HTMLUListElement | HTMLDivElement>;\n}\n\n/** Properties for the ListItem component. */\nexport interface ListItemProps extends React.HTMLAttributes<HTMLLIElement> {\n  /**\n   * Unique value identifying this item for selection tracking. An item without a value cannot be\n   * selected (its `onClick` still runs). Items of a selectable list that share a value are\n   * selected together (a development warning names the value).\n   */\n  value?: string;\n  /**\n   * Action element rendered at the end of the list item (e.g. a Delete button). Clicks and keys\n   * that start inside it, or inside a popup it opens, never toggle the item's selection. An\n   * action that renders nothing (`[]`, `null`, `false`, `''`, `<></>`) is no action. In a\n   * selectable list, items with actions switch the list to grid semantics: the actions are reached\n   * with the arrow keys, and their focusable elements (also ones added later) get\n   * `tabindex=\"-1\"`, except inside a nested composite widget such as a Toolbar, which keeps its own\n   * Tab stop. When the first action appears or the last one disappears, the items remount (see\n   * {@link List}).\n   */\n  action?: React.ReactNode;\n  /** Ref to the item element: an `<li>`, or a `<div role=\"row\">` in grid mode. */\n  ref?: React.Ref<HTMLLIElement | HTMLDivElement>;\n}\n\n/* ------------------------------------------------------------------ */\n/*  Context                                                            */\n/* ------------------------------------------------------------------ */\n\n/** `list`: plain list; `listbox`: selectable; `grid`: selectable with item actions. */\ntype ListMode = 'list' | 'listbox' | 'grid';\n\ninterface ListContextValue {\n  mode: ListMode;\n  selectedValues: ReadonlySet<string>;\n  toggleItem: (value: string) => void;\n  getTabIndex: (value: string) => 0 | -1;\n  registry: ListRegistry;\n}\n\nconst ListContext = React.createContext<ListContextValue | null>(null);\nListContext.displayName = 'ListContext';\n\nlet inertContext: ListContextValue | null = null;\n\nfunction getInertContext(): ListContextValue {\n  inertContext ??= {\n    mode: 'list',\n    selectedValues: new Set<string>(),\n    toggleItem: () => {},\n    getTabIndex: () => -1,\n    registry: new ListRegistry(),\n  };\n  return inertContext;\n}\n\nfunction useListContext(componentName: string): ListContextValue {\n  const context = React.useContext(ListContext);\n  if (context) return context;\n  reportMissingContext(componentName, 'a List');\n  return getInertContext();\n}\n\n/* ------------------------------------------------------------------ */\n/*  Helpers                                                            */\n/* ------------------------------------------------------------------ */\n\nconst EMPTY: readonly string[] = [];\n\n/** Items that share a value are selected together and share their roving value. */\nfunction warnDuplicateValue(value: string): void {\n  warnOnce(\n    `List:duplicate:${value}`,\n    `List: several items share the value \"${value}\". Item values must be unique within a ` +\n      'List; items with the same value are selected (and tab stops) together.',\n  );\n}\n\n/**\n * Static look-ahead for the server and the first render: a direct `List.Item` (Fragments\n * flattened, also an item written in a Server Component) whose action renders content.\n */\nfunction childrenHaveAction(children: React.ReactNode): boolean {\n  return flattenChildren(children).some(\n    ({ node }) =>\n      isElementOfType<ListItemProps>(node, ListItem) && slotRendersContent(node.props.action),\n  );\n}\n\n/** Elements whose events belong to themselves, not to the item that contains them. */\nconst INTERACTIVE_SELECTOR = [\n  FOCUSABLE_SELECTOR,\n  '[data-list-action]',\n  'label',\n  '[role=\"button\"]',\n  '[role=\"link\"]',\n  '[role=\"checkbox\"]',\n  '[role=\"switch\"]',\n  '[role=\"radio\"]',\n  '[role=\"menuitem\"]',\n  '[role=\"textbox\"]',\n  '[role=\"combobox\"]',\n  '[role=\"slider\"]',\n  '[role=\"spinbutton\"]',\n].join(', ');\n\n/**\n * Whether an item must leave `event` alone (no selection toggle): it started inside the action\n * container or a nested interactive element, or outside the item's DOM. React bubbles the events\n * of a popup portaled from an action (a Popover, Menu or Dialog) through the item's handlers\n * although their target lives elsewhere in the document; those never toggle the item (as in\n * Card).\n */\nfunction isForeignEvent(event: React.SyntheticEvent<HTMLElement>): boolean {\n  const item = event.currentTarget;\n  const target = event.target as Partial<Node> | null;\n  if (!target || typeof target.nodeType !== 'number' || !item.contains(target as Node)) {\n    return true;\n  }\n  let node: Element | null =\n    target.nodeType === Node.ELEMENT_NODE ? (target as Element) : (target.parentElement ?? null);\n  for (; node && node !== item; node = node.parentElement) {\n    if (node.matches(INTERACTIVE_SELECTOR)) return true;\n  }\n  return false;\n}\n\n/**\n * Enter or Space without Ctrl, Alt or Meta: the keys that toggle an item. With a modifier (Ctrl+Alt\n * with Space included) the key is a shortcut, left to the page.\n */\nfunction isActivationKey(event: React.KeyboardEvent): boolean {\n  if (event.ctrlKey || event.altKey || event.metaKey) return false;\n  return event.key === 'Enter' || event.key === ' ';\n}\n\nconst TEXT_ENTRY_ROLES: ReadonlySet<string> = new Set([\n  'textbox',\n  'searchbox',\n  'combobox',\n  'spinbutton',\n  'slider',\n]);\n\nconst NON_TEXT_INPUT_TYPES: ReadonlySet<string> = new Set([\n  'button',\n  'checkbox',\n  'color',\n  'file',\n  'hidden',\n  'image',\n  'radio',\n  'reset',\n  'submit',\n]);\n\n/** Text-entry widgets keep the arrow keys (caret movement) and are entered with Enter/F2. */\nfunction isTextEntry(el: Element): boolean {\n  const role = el.getAttribute('role');\n  if (role !== null && TEXT_ENTRY_ROLES.has(role)) return true;\n  const tag = el.localName;\n  if (tag === 'textarea' || tag === 'select') return true;\n  if (tag === 'input') return !NON_TEXT_INPUT_TYPES.has((el as HTMLInputElement).type);\n  return el.matches('[contenteditable]:not([contenteditable=\"false\"])');\n}\n\nfunction getFocusables(cell: HTMLElement): HTMLElement[] {\n  return Array.from(cell.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTOR)).filter((el) =>\n    isFocusable(el),\n  );\n}\n\n/*\n * The helpers below walk element children with `firstElementChild`/`nextElementSibling`, never\n * through a `children` collection: jsdom before 30.1 does not cache indexed `HTMLCollection`\n * access, so `Array.from(root.children)` or an indexed loop over a large list is O(n²) in the test\n * suites of consumers on those versions (table-core#22).\n */\n\n/** Position of an item element among its list's items (the root's element children). */\nfunction getItemIndex(item: HTMLElement): number {\n  if (!item.parentElement) return -1;\n  let index = 0;\n  for (let el = item.previousElementSibling; el; el = el.previousElementSibling) index++;\n  return index;\n}\n\n/**\n * Where focus goes after the items remounted: the item with the same explicit value, else the item\n * now at the same position (the next one when the focused item itself was removed), else the last.\n * An item that cannot take focus itself (a plain list item) passes it to its first focusable\n * descendant.\n */\nfunction getFocusRestoreTarget(root: HTMLElement, loss: ListFocusLoss): HTMLElement | null {\n  let byValue: Element | null = null;\n  let atIndex: Element | null = null;\n  let last: Element | null = null;\n  let index = 0;\n  for (let el = root.firstElementChild; el; el = el.nextElementSibling, index++) {\n    if (loss.value !== undefined && el.getAttribute('data-roving-value') === loss.value) {\n      byValue = el;\n      break;\n    }\n    if (index === loss.index) atIndex = el;\n    last = el;\n  }\n  const item = (byValue ?? atIndex ?? (loss.index >= 0 ? last : null)) as HTMLElement | null;\n  if (!item) return null;\n  return item.hasAttribute('tabindex') ? item : (getFocusables(item)[0] ?? null);\n}\n\n/** The action cell of an item element (its direct `[data-list-action]` child), read at event time. */\nfunction getActionCell(item: HTMLElement): HTMLElement | null {\n  for (let child = item.firstElementChild; child; child = child.nextElementSibling) {\n    if (child.hasAttribute('data-list-action')) return child as HTMLElement;\n  }\n  return null;\n}\n\n/**\n * The arrow-key stops inside an action cell, in DOM order. A text-entry widget is represented by\n * the cell itself (the cell takes focus; Enter/F2 enter the widget, Escape returns to the cell).\n */\nfunction getActionStops(cell: HTMLElement): HTMLElement[] {\n  const stops: HTMLElement[] = [];\n  for (const el of getFocusables(cell)) {\n    const stop = isTextEntry(el) ? cell : el;\n    if (!stops.includes(stop)) stops.push(stop);\n  }\n  return stops;\n}\n\n/* ------------------------------------------------------------------ */\n/*  List                                                               */\n/* ------------------------------------------------------------------ */\n\n// The List root, documented on the exported `List` const.\nconst ListRoot = <M extends ListSelectionMode = 'single'>(props: ListProps<M>): React.ReactNode => {\n  const {\n    selectable = false,\n    selectionMode,\n    selectedItems,\n    defaultSelectedItems,\n    onSelectionChange,\n    selectedItem,\n    defaultSelectedItem,\n    onSelectedItemChange,\n    className,\n    children,\n    ref,\n    onKeyDown,\n    onKeyDownCapture,\n    onFocus,\n    ...rest\n  } = props as ListProps;\n\n  if (selectionMode === 'multi') {\n    warnDeprecated('List', 'selectionMode=\"multi\"', 'selectionMode=\"multiple\"');\n  }\n  const multiple = selectionMode === 'multiple' || selectionMode === 'multi';\n\n  const controlledSelection = React.useMemo<readonly string[] | undefined>(() => {\n    if (!multiple && selectedItem !== undefined) {\n      return selectedItem === null ? EMPTY : [selectedItem];\n    }\n    return selectedItems;\n  }, [multiple, selectedItem, selectedItems]);\n  const defaultSelection = React.useMemo<readonly string[]>(() => {\n    if (!multiple && defaultSelectedItem !== undefined && defaultSelectedItem !== null) {\n      return [defaultSelectedItem];\n    }\n    return defaultSelectedItems ?? EMPTY;\n  }, [multiple, defaultSelectedItem, defaultSelectedItems]);\n\n  const [selected, setSelected] = useControllable<readonly string[]>(\n    controlledSelection,\n    defaultSelection,\n    (next) => {\n      // The callbacks receive their own mutable copy (the props accept readonly arrays).\n      const selection = [...next];\n      onSelectionChange?.(selection);\n      if (!multiple) onSelectedItemChange?.(selection[0] ?? null);\n    },\n  );\n\n  const [registry] = React.useState(() => new ListRegistry());\n  React.useLayoutEffect(() => {\n    registry.setActive(selectable);\n  }, [registry, selectable]);\n  const registered = React.useSyncExternalStore(\n    registry.subscribe,\n    registry.getSnapshot,\n    registry.getServerSnapshot,\n  );\n\n  // Effective selection: selected ∩ registered item values, derived during render (table-core#22).\n  const effective = React.useMemo(\n    () => (registered ? selected.filter((value) => registered.valueSet.has(value)) : selected),\n    [registered, selected],\n  );\n  const selectedValues = React.useMemo<ReadonlySet<string>>(() => new Set(effective), [effective]);\n\n  const hasActions =\n    selectable && (registered ? registered.hasActions : childrenHaveAction(children));\n  const mode: ListMode = !selectable ? 'list' : hasActions ? 'grid' : 'listbox';\n\n  // The first selected item in DOM order (the registry keeps its values in DOM order).\n  const tabStopValue = registered\n    ? (registered.values.find((value) => selectedValues.has(value)) ?? null)\n    : (effective[0] ?? null);\n\n  const { containerProps, getTabIndex } = useRovingTabIndex({\n    activeValue: tabStopValue,\n    orientation: 'vertical',\n    typeahead: (registered?.count ?? 0) > 7,\n    tabStop: 'active',\n    // The items are the root's children. A composite in an item action (a Toolbar, a radio group)\n    // is part of its row, not an item: arrows and typeahead never move into it.\n    itemSelector: ':scope > [data-roving-value]',\n  });\n  const {\n    ref: rovingRef,\n    onKeyDown: rovingKeyDown,\n    onKeyDownCapture: rovingKeyDownCapture,\n    onFocus: rovingFocus,\n  } = containerProps;\n  const rootElementRef = React.useRef<HTMLUListElement | HTMLDivElement | null>(null);\n  const rootRef = useMergedRefs<HTMLUListElement | HTMLDivElement>(\n    ref,\n    selectable ? rovingRef : null,\n    rootElementRef,\n  );\n\n  // Switching between list and grid semantics changes the root and item elements (`ul`/`li` ↔\n  // `div`), so React remounts the items and the focused one is removed. Items record, while they\n  // are still in the document, that they held focus (see ListItem); after the new items mounted,\n  // focus moves to the same item (C-DISABLED: focus is never dropped to <body>).\n  React.useLayoutEffect(() => {\n    const loss = registry.takeFocusLoss();\n    const root = rootElementRef.current;\n    if (!loss || !root) return;\n    const doc = root.ownerDocument;\n    const active = doc.activeElement;\n    // Focus placed elsewhere in this commit (an autoFocus, a restore-focus hook) wins.\n    if (active && active !== doc.body && active.isConnected) return;\n    getFocusRestoreTarget(root, loss)?.focus();\n  }, [mode, registry]);\n\n  // After every commit (the items' layout effects ran first): keep the registered values in DOM\n  // order, so `tabStopValue` is the first selected item in the DOM even after items were inserted\n  // between others or reordered by key (table-core#22). O(n); re-renders only when the order changed.\n  React.useLayoutEffect(() => {\n    registry.syncOrder(rootElementRef.current);\n  });\n\n  const toggleItem = React.useCallback(\n    (value: string) => {\n      setSelected((previous) => {\n        // From the effective selection, so values of removed items are never reported again.\n        const current = registry.prune(previous);\n        const isSelected = current.includes(value);\n        if (multiple) {\n          return isSelected ? current.filter((item) => item !== value) : [...current, value];\n        }\n        return isSelected ? [] : [value];\n      });\n    },\n    [multiple, registry, setSelected],\n  );\n\n  // Registered values of a selectable list that more than one item holds (development warning).\n  const duplicates = registered?.duplicates ?? EMPTY;\n  React.useEffect(() => {\n    for (const value of duplicates) warnDuplicateValue(value);\n  }, [duplicates]);\n\n  const selectedCount = effective.length;\n  React.useEffect(() => {\n    if (selectable && !multiple && selectedCount > 1) {\n      warnOnce(\n        'List:single-several-selected',\n        `List: a single-selection list (selectionMode \"single\") received ${selectedCount} selected items. Pass one value with \\`selectedItem\\`, or use selectionMode=\"multiple\".`,\n      );\n    }\n  }, [selectable, multiple, selectedCount]);\n\n  const contextValue = React.useMemo<ListContextValue>(\n    () => ({ mode, selectedValues, toggleItem, getTabIndex, registry }),\n    [mode, selectedValues, toggleItem, getTabIndex, registry],\n  );\n\n  const Root = (mode === 'grid' ? 'div' : 'ul') as React.ElementType;\n  const role = mode === 'grid' ? 'grid' : mode === 'listbox' ? 'listbox' : 'list';\n\n  return (\n    <ListContext.Provider value={contextValue}>\n      <Root\n        role={role}\n        aria-multiselectable={selectable && multiple ? true : undefined}\n        className={cn('m-0 list-none p-0', className)}\n        {...rest}\n        ref={rootRef}\n        data-roving-container={selectable ? '' : undefined}\n        onKeyDown={selectable ? composeEventHandlers(onKeyDown, rovingKeyDown) : onKeyDown}\n        onKeyDownCapture={\n          selectable\n            ? composeEventHandlers(onKeyDownCapture, rovingKeyDownCapture)\n            : onKeyDownCapture\n        }\n        onFocus={\n          selectable\n            ? composeEventHandlers(onFocus, rovingFocus, { checkDefaultPrevented: false })\n            : onFocus\n        }\n      >\n        {children}\n      </Root>\n    </ListContext.Provider>\n  );\n};\nListRoot.displayName = 'List';\n\n/* ------------------------------------------------------------------ */\n/*  ListItem                                                           */\n/* ------------------------------------------------------------------ */\n\n/**\n * An item of a {@link List} (also available as `List.Item`). Renders an `<li>` (`listitem`, or\n * `option` in a selectable list), or a `<div role=\"row\">` in a selectable list with actions. In a\n * selectable list, Enter and Space toggle the selection without calling `onClick`, which receives\n * pointer clicks.\n *\n * Exported under the flat name `ListItem` so React Server Components can import it; `List.Item`\n * (dotted access) needs a client module.\n */\nexport const ListItem = ({\n  value,\n  action,\n  className,\n  children,\n  onClick,\n  onKeyDown,\n  ref,\n  ...rest\n}: ListItemProps) => {\n  const { mode, selectedValues, toggleItem, getTabIndex, registry } = useListContext('ListItem');\n  const autoValue = useId('list-item');\n  const selectableValue = value ? value : undefined;\n  const rovingValue = selectableValue ?? autoValue;\n  // An action that renders nothing (`[]`, `null`, booleans, `''`) is no action.\n  const hasAction = slotRendersContent(action);\n  const [token] = React.useState(() => ({}));\n  const itemRef = React.useRef<HTMLLIElement | HTMLDivElement | null>(null);\n  const itemRefs = useMergedRefs<HTMLLIElement | HTMLDivElement>(ref, itemRef);\n\n  // The record is updated in place when the value or the action changes and removed only on\n  // unmount, so the item keeps its place in the registry (table-core#22).\n  React.useLayoutEffect(() => {\n    registry.set(token, { value: selectableValue, hasAction, element: itemRef });\n  }, [registry, token, selectableValue, hasAction]);\n  React.useLayoutEffect(() => () => registry.delete(token), [registry, token]);\n\n  // Focus inside the action when it disappears: if that switches the list from grid to listbox, the\n  // List moves focus to this item in the next commit (see ListActionCell and ListRoot).\n  const recordActionFocusLoss = useEventCallback((cell: HTMLElement) => {\n    const item = cell.parentElement;\n    registry.recordFocusLoss({ value: selectableValue, index: item ? getItemIndex(item) : -1 });\n  });\n\n  // Unmount: a layout-effect cleanup runs while the element is still in the document, so it can\n  // tell whether it held focus. The List moves focus to the same item when its items remount\n  // (list ↔ grid semantics); see ListRoot.\n  React.useLayoutEffect(() => {\n    const node = itemRef.current;\n    return () => {\n      if (!node) return;\n      const active = node.ownerDocument.activeElement;\n      if (active && node.contains(active)) {\n        registry.recordFocusLoss({ value: selectableValue, index: getItemIndex(node) });\n      }\n    };\n  }, [registry, selectableValue]);\n\n  const isSelected = selectableValue !== undefined && selectedValues.has(selectableValue);\n  const selectable = mode !== 'list';\n\n  const activate = () => {\n    if (selectableValue !== undefined) toggleItem(selectableValue);\n  };\n\n  const handleClick = (event: React.MouseEvent<HTMLElement>) => {\n    if (isForeignEvent(event)) return;\n    activate();\n  };\n\n  const handleOptionKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n    if (isForeignEvent(event)) return;\n    if (isActivationKey(event)) {\n      event.preventDefault();\n      activate();\n    }\n  };\n\n  const handleRowKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n    const rowElement = event.currentTarget;\n    const target = event.target as HTMLElement;\n    const cell = getActionCell(rowElement);\n\n    if (!cell || !cell.contains(target)) {\n      if (target !== rowElement) return;\n      if (isActivationKey(event)) {\n        event.preventDefault();\n        activate();\n        return;\n      }\n      const intent = getArrowIntent(event.key, {\n        orientation: 'horizontal',\n        dir: getDirection(rowElement),\n      });\n      const first = intent === 'next' && cell ? getActionStops(cell)[0] : undefined;\n      if (first) {\n        event.preventDefault();\n        first.focus();\n      }\n      return;\n    }\n\n    // Inside the action cell.\n    if (target !== cell && isTextEntry(target)) {\n      // The widget keeps its keys (caret movement, typing); Escape returns to the cell.\n      if (event.key === 'Escape') {\n        event.preventDefault();\n        cell.focus();\n      }\n      return;\n    }\n    if (target === cell && (event.key === 'Enter' || event.key === 'F2')) {\n      const entry = getFocusables(cell).find((el) => isTextEntry(el));\n      if (entry) {\n        event.preventDefault();\n        entry.focus();\n      }\n      return;\n    }\n    const intent = getArrowIntent(event.key, {\n      orientation: 'horizontal',\n      dir: getDirection(rowElement),\n    });\n    if (!intent) return;\n    event.preventDefault();\n    const stops = getActionStops(cell);\n    const index = stops.indexOf(target);\n    if (intent === 'next') {\n      stops[index + 1]?.focus();\n    } else if (index > 0) {\n      stops[index - 1].focus();\n    } else {\n      rowElement.focus();\n    }\n  };\n\n  const Element = (mode === 'grid' ? 'div' : 'li') as React.ElementType;\n  const ContentCell = (mode === 'grid' ? 'div' : 'span') as React.ElementType;\n  const role = mode === 'grid' ? 'row' : mode === 'listbox' ? 'option' : 'listitem';\n\n  const interactiveProps: Record<string, unknown> = selectable\n    ? {\n        'aria-selected': isSelected,\n        tabIndex: getTabIndex(rovingValue),\n        'data-roving-value': rovingValue,\n        'data-selected': isSelected ? '' : undefined,\n        onClick: composeEventHandlers(onClick, handleClick),\n        onKeyDown: composeEventHandlers(\n          onKeyDown,\n          mode === 'grid' ? handleRowKeyDown : handleOptionKeyDown,\n        ),\n      }\n    : { onClick, onKeyDown };\n\n  return (\n    <Element\n      role={role}\n      className={cn(\n        'flex items-center border-b border-border px-4 py-2 text-body-1',\n        selectable && ['relative cursor-pointer', focusRingInset],\n        selectable &&\n          (isSelected\n            ? [\n                'bg-subtle-selected before:absolute before:inset-y-2 before:start-0 before:w-0.5 before:rounded-full before:bg-primary',\n                forcedColors.selectedContainer,\n              ]\n            : 'hover:bg-subtle-hover'),\n        className,\n      )}\n      {...rest}\n      ref={itemRefs}\n      {...interactiveProps}\n    >\n      <ContentCell role={mode === 'grid' ? 'gridcell' : undefined} className=\"min-w-0 flex-1\">\n        {children}\n      </ContentCell>\n      {hasAction && (\n        <ListActionCell grid={mode === 'grid'} onRemovedWithFocus={recordActionFocusLoss}>\n          {/* A generator was read once by the check above: render its items. */}\n          {materialiseSlotContent(action)}\n        </ListActionCell>\n      )}\n    </Element>\n  );\n};\nListItem.displayName = 'ListItem';\n\n/**\n * Nested composite widgets (a Toolbar, a RadioGroup, …) manage their own tab indexes, so the action\n * cell never writes `tabindex` on or inside one (the same rule as the DataGrid's cell widgets).\n */\nconst COMPOSITE_SELECTOR = [\n  '[data-roving-container]',\n  ...[\n    'toolbar',\n    'radiogroup',\n    'listbox',\n    'grid',\n    'treegrid',\n    'tablist',\n    'menu',\n    'menubar',\n    'tree',\n  ].map((role) => `[role=\"${role}\"]`),\n].join(', ');\n\n/** Attributes that can put an element of an action cell (back) into the Tab order. */\nconst STAMP_OBSERVED_ATTRIBUTES = ['tabindex', 'href', 'contenteditable', 'controls'];\n\n/**\n * Grid mode: takes the focusable elements of an action cell out of the Tab order (the row is the\n * only Tab stop; the actions are reached with the arrow keys) and keeps them out while the cell is\n * mounted. Returns the cleanup that disconnects the observer and restores the original values.\n *\n * It runs once per cell, not on every render of every item (an inline `action` has a new identity\n * on every parent render): a `MutationObserver` re-stamps when elements are added to the cell or an\n * element's `tabindex` is changed by someone else, including by an action component's own state.\n * Every candidate of `FOCUSABLE_SELECTOR` is stamped, disabled or hidden ones too, so an element\n * that is enabled or shown later is already out of the Tab order and no computed style is read.\n * Removed elements are dropped from the record on each pass. Nested composites are skipped (see\n * `COMPOSITE_SELECTOR`), and an element whose replaced `tabindex` something else re-applies (a\n * script that manages it) is left alone from then on, so the two never overwrite each other in an\n * endless loop of observer callbacks.\n */\nfunction stampActionCell(cell: HTMLElement): () => void {\n  /** Stamped elements with the `tabindex` they had before (`null`: none). */\n  const stamped = new Map<HTMLElement, string | null>();\n  /** Elements whose `tabindex` something else keeps re-applying: they are left to it. */\n  const yielded = new WeakSet<HTMLElement>();\n  const stamp = () => {\n    for (const el of stamped.keys()) {\n      if (!cell.contains(el)) stamped.delete(el);\n    }\n    for (const el of cell.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTOR)) {\n      const tabIndex = el.getAttribute('tabindex');\n      if (tabIndex === '-1' || yielded.has(el)) continue;\n      const composite = el.closest(COMPOSITE_SELECTOR);\n      if (composite && cell.contains(composite)) continue;\n      stamped.set(el, tabIndex);\n      el.setAttribute('tabindex', '-1');\n    }\n  };\n  stamp();\n  if (typeof MutationObserver === 'undefined') return () => {};\n\n  const observer = new MutationObserver((records) => {\n    // The records of this cell's own writes are taken below, so these values were set by someone\n    // else: a changed prop (the new value to restore), or a script that manages the element's\n    // tabindex and re-applied the value this cell replaced. Yielding to the latter keeps the two\n    // from overwriting each other forever.\n    const changed = new Set<HTMLElement>();\n    for (const record of records) {\n      const target = record.target as HTMLElement;\n      if (record.attributeName === 'tabindex' && stamped.has(target)) changed.add(target);\n    }\n    for (const el of changed) {\n      const value = el.getAttribute('tabindex');\n      if (value !== '-1' && value === stamped.get(el)) {\n        stamped.delete(el);\n        yielded.add(el);\n      } else {\n        stamped.set(el, value);\n      }\n    }\n    stamp();\n    observer.takeRecords();\n  });\n  observer.observe(cell, {\n    subtree: true,\n    childList: true,\n    attributes: true,\n    attributeFilter: STAMP_OBSERVED_ATTRIBUTES,\n  });\n  return () => {\n    observer.disconnect();\n    for (const [el, original] of stamped) {\n      if (original === null) el.removeAttribute('tabindex');\n      else el.setAttribute('tabindex', original);\n    }\n    stamped.clear();\n  };\n}\n\ninterface ListActionCellProps {\n  /** Grid mode: a focusable `gridcell` div whose widgets leave the Tab order; otherwise a `span`. */\n  grid: boolean;\n  /** Called when the cell is removed while focus is inside it (the cell is still in the document). */\n  onRemovedWithFocus: (cell: HTMLElement) => void;\n  children: React.ReactNode;\n}\n\n/**\n * The action cell of a {@link ListItem} (internal). React runs the layout-effect cleanups of a\n * removed subtree before it removes the subtree's DOM, but a component's own cleanups only after\n * its removed children are gone. So this cleanup, unlike one in ListItem, still sees focus inside\n * the cell when the action disappears (data-display#2).\n *\n * `grid` never changes for a mounted cell: switching between list and grid semantics changes the\n * List's root element, which remounts the items and their cells.\n */\nfunction ListActionCell({ grid, onRemovedWithFocus, children }: ListActionCellProps) {\n  const cellRef = React.useRef<HTMLElement | null>(null);\n\n  React.useLayoutEffect(() => {\n    const cell = cellRef.current;\n    return () => {\n      if (!cell) return;\n      const active = cell.ownerDocument.activeElement;\n      if (active && cell.contains(active)) onRemovedWithFocus(cell);\n    };\n  }, [onRemovedWithFocus, grid]);\n\n  React.useLayoutEffect(() => {\n    const cell = cellRef.current;\n    return grid && cell ? stampActionCell(cell) : undefined;\n  }, [grid]);\n\n  const Cell = (grid ? 'div' : 'span') as React.ElementType;\n  return (\n    <Cell\n      ref={cellRef}\n      role={grid ? 'gridcell' : undefined}\n      tabIndex={grid ? -1 : undefined}\n      data-list-action=\"\"\n      className={cn('ms-2 shrink-0', grid && focusRingInset)}\n    >\n      {children}\n    </Cell>\n  );\n}\nListActionCell.displayName = 'ListActionCell';\n\n/**\n * A vertical list of items, optionally selectable.\n *\n * - **Plain** (`selectable` false): `role=\"list\"` with `listitem`s; item actions stay in the\n *   normal Tab order.\n * - **Selectable** (APG Listbox): `role=\"listbox\"` with `option`s and one Tab stop (the first\n *   selected option, else the first option). ArrowUp/Down move focus (wrapping), Home/End jump to\n *   the ends, typeahead is on for more than 7 items, Enter/Space and clicks toggle selection (a\n *   Space typed within 500 ms of a typeahead character continues the search instead; with Ctrl,\n *   Alt or Meta, Enter and Space are left to the page).\n * - **Selectable with item actions** (APG Grid): `role=\"grid\"` with `row`s (carrying\n *   `aria-selected`) and `gridcell`s for the content and the action. One Tab stop; Up/Down move\n *   between rows, Right/Left (mirrored in RTL) move into and out of the actions. A cell that holds\n *   a text-entry widget takes focus itself: Enter/F2 enter the widget, Escape returns to the cell.\n *   Clicks and keys that start inside an action, or inside a popup it opens (a Popover, a Menu),\n *   never toggle selection.\n * - **Switching semantics remounts the items.** Listbox/list and grid use different elements\n *   (`ul`/`li` and `div`), so when a selectable list gains its first item action, loses its last\n *   one, or `selectable` changes while items have actions, React remounts the items and their\n *   content: state inside them (an inline rename input's draft, an uncontrolled checkbox) is reset.\n *   Focus that is on an item or inside it when the list switches moves to the same item (by\n *   `value`, else by position; the next item when the focused one was removed), so the switch\n *   never drops it to `<body>`. This includes focus inside the last action when that action\n *   removes itself (an inline rename input that unmounts on Enter). An action that removes itself\n *   while focused without causing a switch drops focus, like any removed element. When the list\n *   may switch, keep such state in the parent (or keep an action on at least one item).\n * - Selection: `selectionMode` `'single'` (default) or `'multiple'`; controlled with\n *   `selectedItems` (or `selectedItem` in single mode) or uncontrolled with the `default*` props.\n *   Values of items that are no longer rendered are dropped from the reported selection.\n * - Sub-component: `List.Item` (also exported as `ListItem` for React Server Components).\n *\n * @example\n * <List selectable selectionMode=\"multiple\" aria-label=\"Fruits\" onSelectionChange={setFruits}>\n *   <List.Item value=\"apple\">Apple</List.Item>\n *   <List.Item value=\"banana\">Banana</List.Item>\n * </List>\n */\nexport const List = /* @__PURE__ */ Object.assign(ListRoot, {\n  Item: ListItem,\n});\n"],"mappings":"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"}