@mortenbrudvik/waveui 0.8.0 → 0.9.0

package/dist/components/input/Combobox.expand.mjs

@@ -5,34 +5,34 @@ import { renderSlot as n, slotRendersContent as r } from "../../lib/slot.mjs";
 import { disabledStyles as i, focusRing as a } from "../../lib/styles.mjs";
 import { unwrapButtonGlyph as o } from "../button/Button.slots.mjs";
 import { ChevronDownIcon as s } from "../../lib/icons.mjs";
-import { PICKER_ICON_BUTTON_CLASSES as c } from "./pickerStyles.mjs";
-import * as l from "react";
-import { jsx as u } from "react/jsx-runtime";
+import { pickerButtonOffset as c, pickerGlyphSize as l, pickerIconButtonClasses as u } from "./pickerStyles.mjs";
+import * as d from "react";
+import { jsx as f } from "react/jsx-runtime";
 //#region src/components/input/Combobox.expand.tsx
-function d(e) {
+function p(e) {
 	return e == null || r(e);
 }
-var f = ({ component: d, expandIcon: f, label: p, expanded: m, listboxId: h, disabled: g, onToggle: _, className: v, iconClassName: y }) => {
-	let { glyph: b, button: x } = o(f);
-	l.useEffect(() => {
-		x && t(`${d}:expandIcon-button`, `${d}: \`expandIcon\` received ${x}; its children render as the glyph of the built-in expand button and its props were dropped (buttons cannot be nested). Pass icon content instead, e.g. \`expandIcon={<MyIcon />}\`.`);
-	}, [x, d]);
-	let S = b != null && r(b) ? b : /* @__PURE__ */ u(s, {});
-	return /* @__PURE__ */ u("button", {
+var m = ({ component: p, expandIcon: m, label: h, expanded: g, listboxId: _, disabled: v, onToggle: y, size: b = "medium", appearance: x = "outline", className: S, iconClassName: C }) => {
+	let { glyph: w, button: T } = o(m);
+	d.useEffect(() => {
+		T && t(`${p}:expandIcon-button`, `${p}: \`expandIcon\` received ${T}; its children render as the glyph of the built-in expand button and its props were dropped (buttons cannot be nested). Pass icon content instead, e.g. \`expandIcon={<MyIcon />}\`.`);
+	}, [T, p]);
+	let E = w != null && r(w) ? w : /* @__PURE__ */ f(s, { size: l(b, "chevron") });
+	return /* @__PURE__ */ f("button", {
 		type: "button",
 		tabIndex: -1,
-		"aria-label": p,
-		"aria-expanded": m,
-		"aria-controls": m ? h : void 0,
-		disabled: g,
+		"aria-label": h,
+		"aria-expanded": g,
+		"aria-controls": g ? _ : void 0,
+		disabled: v,
 		onMouseDown: (e) => e.preventDefault(),
-		onClick: _,
-		className: e(v, c, "end-1", a, i),
-		children: n(S, "span", e(y, "inline-flex transition-transform motion-reduce:transition-none", m && "rotate-180"), { "aria-hidden": !0 })
+		onClick: y,
+		className: e(S, u(b, x), c(b, 1), a, i),
+		children: n(E, "span", e(C, "inline-flex transition-transform motion-reduce:transition-none", g && "rotate-180"), { "aria-hidden": !0 })
 	});
 };
-f.displayName = "PickerExpandButton";
+m.displayName = "PickerExpandButton";
 //#endregion
-export { f as PickerExpandButton, d as showsExpandButton };
+export { m as PickerExpandButton, p as showsExpandButton };
 
 //# sourceMappingURL=Combobox.expand.mjs.map

package/dist/components/input/Combobox.expand.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.expand.mjs","names":["React","showsExpandButton","expandIcon","slotRendersContent","PickerExpandButton","content","unwrapButtonGlyph","button","warnOnce","component","glyph","ChevronDownIcon","label","expanded","listboxId","event","onToggle","cn","className","PICKER_ICON_BUTTON_CLASSES","focusRing","disabledStyles","renderSlot","iconClassName"],"sources":["../../../src/components/input/Combobox.expand.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport { warnOnce } from '../../lib/dev';\nimport { ChevronDownIcon } from '../../lib/icons';\nimport { renderSlot, slotRendersContent } from '../../lib/slot';\nimport type { Slot } from '../../lib/slot';\nimport { disabledStyles, focusRing } from '../../lib/styles';\nimport { unwrapButtonGlyph } from '../button/Button.slots';\nimport { PICKER_ICON_BUTTON_CLASSES } from './pickerStyles';\n\n/**\n * Whether an `expandIcon` value shows the expand button (the rule of optional indicator glyphs):\n * `null` and `undefined` keep the chevron; `false` and any other value that renders nothing\n * (`true`, `''`, an empty array or Fragment) hide the button.\n */\nexport function showsExpandButton(expandIcon: Slot<'span'> | undefined): boolean {\n  return expandIcon == null || slotRendersContent(expandIcon);\n}\n\n/** Properties of {@link PickerExpandButton}. */\nexport interface PickerExpandButtonProps {\n  /** The picker's public name, used in the development warning. */\n  component: string;\n  /** The picker's `expandIcon`; render the button only when {@link showsExpandButton} allows. */\n  expandIcon: Slot<'span'> | undefined;\n  /** The accessible name of the button. */\n  label: string;\n  /** Whether the list is shown with options (`aria-expanded`). */\n  expanded: boolean;\n  /** Id of the listbox, referenced by `aria-controls` while the list is expanded. */\n  listboxId: string;\n  /** Natively disables the button (a disabled or read-only picker). */\n  disabled: boolean;\n  /** Opens or closes the list and returns focus to the input. */\n  onToggle: () => void;\n  /** The host's stable class for the button (its `expandButton` part). */\n  className?: string;\n  /** The host's stable class for the glyph `<span>` (its `expandIcon` part). */\n  iconClassName?: string;\n}\n\n/**\n * The expand button of an editable combobox (Combobox, TimePicker): the APG \"open\" button at the\n * end of the input. It is not a tab stop (Alt+ArrowDown opens the list from the keyboard) and a\n * press keeps focus in the input. Its glyph is decorative (`aria-hidden`) and turns while the list\n * is expanded. A `<button>` or `Button` element passed as `expandIcon`, or a slot object whose\n * `as` is one, is not nested: its children become the glyph (the chevron when they render\n * nothing), its props are dropped and a one-time development warning names the slot.\n */\nexport const PickerExpandButton = ({\n  component,\n  expandIcon,\n  label,\n  expanded,\n  listboxId,\n  disabled,\n  onToggle,\n  className,\n  iconClassName,\n}: PickerExpandButtonProps) => {\n  // The glyph slot rule shared with SplitButton and MenuButton `menuIcon` (C-SLOTS).\n  const { glyph: content, button } = unwrapButtonGlyph(expandIcon);\n  React.useEffect(() => {\n    if (button) {\n      warnOnce(\n        `${component}:expandIcon-button`,\n        `${component}: \\`expandIcon\\` received ${button}; its children render as the glyph of ` +\n          'the built-in expand button and its props were dropped (buttons cannot be nested). ' +\n          'Pass icon content instead, e.g. `expandIcon={<MyIcon />}`.',\n      );\n    }\n  }, [button, component]);\n\n  const glyph = content != null && slotRendersContent(content) ? content : <ChevronDownIcon />;\n\n  return (\n    <button\n      type=\"button\"\n      tabIndex={-1}\n      aria-label={label}\n      aria-expanded={expanded}\n      aria-controls={expanded ? listboxId : undefined}\n      disabled={disabled}\n      // Keeps focus in the input: a press must not blur it (a blur commits typed text).\n      onMouseDown={(event) => event.preventDefault()}\n      onClick={onToggle}\n      className={cn(className, PICKER_ICON_BUTTON_CLASSES, 'end-1', focusRing, disabledStyles)}\n    >\n      {renderSlot(\n        glyph,\n        'span',\n        cn(\n          iconClassName,\n          'inline-flex transition-transform motion-reduce:transition-none',\n          expanded && 'rotate-180',\n        ),\n        { 'aria-hidden': true },\n      )}\n    </button>\n  );\n};\nPickerExpandButton.displayName = 'PickerExpandButton';\n"],"mappings":";;;;;;;;;;;AAeA,SAAgBC,EAAkB,GAA+C;CAC/E,OAAOC,KAAc,QAAQC,EAAmBD,CAAU;AAC5D;AAgCA,IAAaE,KAAsB,EACjC,cACA,eACA,UACA,aACA,cACA,aACA,aACA,cACA,uBAC6B;CAE7B,IAAM,EAAE,OAAOC,GAAS,cAAWC,EAAkBJ,CAAU;CAC/D,EAAM,gBAAgB;EACpB,AAAIK,KACFC,EACE,GAAGC,EAAU,qBACb,GAAGA,EAAU,4BAA4BF,EAAO,qLAGlD;CAEJ,GAAG,CAACA,GAAQE,CAAS,CAAC;CAEtB,IAAMC,IAAQL,KAAW,QAAQF,EAAmBE,CAAO,IAAIA,IAAU,kBAACM,GAAD,CAAkB,CAAA;CAE3F,OACE,kBAAC,UAAD;EACE,MAAK;EACL,UAAU;EACV,cAAYC;EACZ,iBAAeC;EACf,iBAAeA,IAAWC,IAAY,KAAA;EAC5B;EAEV,cAAc,MAAUC,EAAM,eAAe;EAC7C,SAASC;EACT,WAAWC,EAAGC,GAAWC,GAA4B,SAASC,GAAWC,CAAc;EAEtF,UAAAC,EACCZ,GACA,QACAO,EACEM,GACA,kEACAV,KAAY,YACd,GACA,EAAE,eAAe,GAAK,CACxB;CACM,CAAA;AAEZ;AACA,EAAmB,cAAc"}
+{"version":3,"file":"Combobox.expand.mjs","names":["React","showsExpandButton","expandIcon","slotRendersContent","PickerExpandButton","content","unwrapButtonGlyph","button","warnOnce","component","glyph","ChevronDownIcon","pickerGlyphSize","size","label","expanded","listboxId","event","onToggle","cn","className","pickerIconButtonClasses","appearance","pickerButtonOffset","focusRing","disabledStyles","renderSlot","iconClassName"],"sources":["../../../src/components/input/Combobox.expand.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport { warnOnce } from '../../lib/dev';\nimport { ChevronDownIcon } from '../../lib/icons';\nimport { renderSlot, slotRendersContent } from '../../lib/slot';\nimport type { Slot } from '../../lib/slot';\nimport { disabledStyles, focusRing } from '../../lib/styles';\nimport type { CoreSize, InputAppearance } from '../../lib/types';\nimport { unwrapButtonGlyph } from '../button/Button.slots';\nimport { pickerButtonOffset, pickerGlyphSize, pickerIconButtonClasses } from './pickerStyles';\n\n/**\n * Whether an `expandIcon` value shows the expand button (the rule of optional indicator glyphs):\n * `null` and `undefined` keep the chevron; `false` and any other value that renders nothing\n * (`true`, `''`, an empty array or Fragment) hide the button.\n */\nexport function showsExpandButton(expandIcon: Slot<'span'> | undefined): boolean {\n  return expandIcon == null || slotRendersContent(expandIcon);\n}\n\n/** Properties of {@link PickerExpandButton}. */\nexport interface PickerExpandButtonProps {\n  /** The picker's public name, used in the development warning. */\n  component: string;\n  /** The picker's `expandIcon`; render the button only when {@link showsExpandButton} allows. */\n  expandIcon: Slot<'span'> | undefined;\n  /** The accessible name of the button. */\n  label: string;\n  /** Whether the list is shown with options (`aria-expanded`). */\n  expanded: boolean;\n  /** Id of the listbox, referenced by `aria-controls` while the list is expanded. */\n  listboxId: string;\n  /** Natively disables the button (a disabled or read-only picker). */\n  disabled: boolean;\n  /** Opens or closes the list and returns focus to the input. */\n  onToggle: () => void;\n  /**\n   * Size of the button box and its glyph (Phase 4 D11): the picker's resolved `size`.\n   * @default 'medium'\n   */\n  size?: CoreSize;\n  /**\n   * Appearance of the field the button sits in (Phase 4 D11): `filled-darker` gets a hover fill\n   * one step darker than the field.\n   * @default 'outline'\n   */\n  appearance?: InputAppearance;\n  /** The host's stable class for the button (its `expandButton` part). */\n  className?: string;\n  /** The host's stable class for the glyph `<span>` (its `expandIcon` part). */\n  iconClassName?: string;\n}\n\n/**\n * The expand button of an editable combobox (Combobox, TimePicker): the APG \"open\" button at the\n * end of the input. It is not a tab stop (Alt+ArrowDown opens the list from the keyboard) and a\n * press keeps focus in the input. Its glyph is decorative (`aria-hidden`) and turns while the list\n * is expanded. A `<button>` or `Button` element passed as `expandIcon`, or a slot object whose\n * `as` is one, is not nested: its children become the glyph (the chevron when they render\n * nothing), its props are dropped and a one-time development warning names the slot. `size` and\n * `appearance` (Phase 4 D11) default to `'medium'`/`'outline'` for a caller that has not resolved\n * them yet.\n */\nexport const PickerExpandButton = ({\n  component,\n  expandIcon,\n  label,\n  expanded,\n  listboxId,\n  disabled,\n  onToggle,\n  size = 'medium',\n  appearance = 'outline',\n  className,\n  iconClassName,\n}: PickerExpandButtonProps) => {\n  // The glyph slot rule shared with SplitButton and MenuButton `menuIcon` (C-SLOTS).\n  const { glyph: content, button } = unwrapButtonGlyph(expandIcon);\n  React.useEffect(() => {\n    if (button) {\n      warnOnce(\n        `${component}:expandIcon-button`,\n        `${component}: \\`expandIcon\\` received ${button}; its children render as the glyph of ` +\n          'the built-in expand button and its props were dropped (buttons cannot be nested). ' +\n          'Pass icon content instead, e.g. `expandIcon={<MyIcon />}`.',\n      );\n    }\n  }, [button, component]);\n\n  const glyph =\n    content != null && slotRendersContent(content) ? (\n      content\n    ) : (\n      <ChevronDownIcon size={pickerGlyphSize(size, 'chevron')} />\n    );\n\n  return (\n    <button\n      type=\"button\"\n      tabIndex={-1}\n      aria-label={label}\n      aria-expanded={expanded}\n      aria-controls={expanded ? listboxId : undefined}\n      disabled={disabled}\n      // Keeps focus in the input: a press must not blur it (a blur commits typed text).\n      onMouseDown={(event) => event.preventDefault()}\n      onClick={onToggle}\n      className={cn(\n        className,\n        pickerIconButtonClasses(size, appearance),\n        pickerButtonOffset(size, 1),\n        focusRing,\n        disabledStyles,\n      )}\n    >\n      {renderSlot(\n        glyph,\n        'span',\n        cn(\n          iconClassName,\n          'inline-flex transition-transform motion-reduce:transition-none',\n          expanded && 'rotate-180',\n        ),\n        { 'aria-hidden': true },\n      )}\n    </button>\n  );\n};\nPickerExpandButton.displayName = 'PickerExpandButton';\n"],"mappings":";;;;;;;;;;;AAgBA,SAAgBC,EAAkB,GAA+C;CAC/E,OAAOC,KAAc,QAAQC,EAAmBD,CAAU;AAC5D;AA6CA,IAAaE,KAAsB,EACjC,cACA,eACA,UACA,aACA,cACA,aACA,aACA,UAAO,UACP,gBAAa,WACb,cACA,uBAC6B;CAE7B,IAAM,EAAE,OAAOC,GAAS,cAAWC,EAAkBJ,CAAU;CAC/D,EAAM,gBAAgB;EACpB,AAAIK,KACFC,EACE,GAAGC,EAAU,qBACb,GAAGA,EAAU,4BAA4BF,EAAO,qLAGlD;CAEJ,GAAG,CAACA,GAAQE,CAAS,CAAC;CAEtB,IAAMC,IACJL,KAAW,QAAQF,EAAmBE,CAAO,IAC3CA,IAEA,kBAACM,GAAD,EAAiB,MAAMC,EAAgBC,GAAM,SAAS,EAAI,CAAA;CAG9D,OACE,kBAAC,UAAD;EACE,MAAK;EACL,UAAU;EACV,cAAYC;EACZ,iBAAeC;EACf,iBAAeA,IAAWC,IAAY,KAAA;EAC5B;EAEV,cAAc,MAAUC,EAAM,eAAe;EAC7C,SAASC;EACT,WAAWC,EACTC,GACAC,EAAwBR,GAAMS,CAAU,GACxCC,EAAmBV,GAAM,CAAC,GAC1BW,GACAC,CACF;EAEC,UAAAC,EACChB,GACA,QACAS,EACEQ,GACA,kEACAZ,KAAY,YACd,GACA,EAAE,eAAe,GAAK,CACxB;CACM,CAAA;AAEZ;AACA,EAAmB,cAAc"}

package/dist/components/input/Combobox.mjs

@@ -6,187 +6,192 @@ import { comboboxClassNames as r } from "../../lib/classNames.mjs";
 import { useControllable as i } from "../../hooks/useControllable.mjs";
 import { useMergedRefs as a } from "../../hooks/useMergedRefs.mjs";
 import { useFieldContext as ee, useFieldControl as te } from "../../hooks/useFieldControl.mjs";
-import { disabledStyles as ne, inputBase as re, inputFocus as ie } from "../../lib/styles.mjs";
-import { DismissIcon as ae } from "../../lib/icons.mjs";
-import { isInvalidLook as oe } from "./Input.mjs";
-import { useFormReset as se } from "../../hooks/useFormReset.mjs";
-import { HiddenInput as ce } from "../internal/HiddenInput.mjs";
-import { collectOptionLabels as le, useListbox as ue } from "../../hooks/useListbox.mjs";
-import { pickerEndPadding as de } from "./pickerStyles.mjs";
-import { PickerExpandButton as fe, showsExpandButton as pe } from "./Combobox.expand.mjs";
-import { ListboxSurface as me, Option as o, OptionGroup as s, useListboxPopup as he } from "./Option.mjs";
-import * as c from "react";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { disabledStyles as ne, inputAppearanceClasses as re, inputFocus as ie, inputHeightClasses as ae, inputPaddingClasses as oe, inputTextClasses as o } from "../../lib/styles.mjs";
+import { DismissIcon as se } from "../../lib/icons.mjs";
+import { useInputLook as ce } from "./inputLook.mjs";
+import { isInvalidLook as le } from "./Input.mjs";
+import { useFormReset as ue } from "../../hooks/useFormReset.mjs";
+import { HiddenInput as de } from "../internal/HiddenInput.mjs";
+import { collectOptionLabels as fe, useListbox as s } from "../../hooks/useListbox.mjs";
+import { pickerButtonOffset as pe, pickerEndPadding as me, pickerGlyphSize as he, pickerIconButtonClasses as ge } from "./pickerStyles.mjs";
+import { PickerExpandButton as _e, showsExpandButton as ve } from "./Combobox.expand.mjs";
+import { ListboxSurface as ye, Option as c, OptionGroup as l, useListboxPopup as be } from "./Option.mjs";
+import * as u from "react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
 //#region src/components/input/Combobox.tsx
-function ge(e, t) {
+function xe(e, t) {
 	return (e.textValue ?? e.label).toLowerCase().includes(t.toLowerCase());
 }
-var d = (o) => {
-	let { value: s, defaultValue: d, onValueChange: f, onOptionSelect: p, open: m, defaultOpen: _e, onOpenChange: ve, placeholder: ye, disabled: h = !1, freeform: g = !1, name: be, form: _, required: v, autoComplete: xe = "off", autoCapitalize: Se, autoCorrect: Ce, maxLength: we, readOnly: y, clearable: Te = !1, expandIcon: b, labels: x, inputMode: Ee, spellCheck: De, enterKeyHint: S, autoFocus: C, tabIndex: w, id: T, "aria-label": E, "aria-labelledby": Oe, "aria-describedby": ke, "aria-invalid": Ae, "aria-required": je, "aria-errormessage": Me, "aria-details": Ne, onFocus: Pe, onBlur: Fe, onKeyDown: Ie, onKeyUp: Le, controlRef: Re, className: ze, children: D, ref: Be, ...Ve } = o;
-	p !== void 0 && t("Combobox", "onOptionSelect", "onValueChange");
-	let O = ee(), He = (v ?? O?.required ?? !1) && !y, k = te({
-		id: T,
-		"aria-label": E,
-		"aria-labelledby": Oe,
-		"aria-describedby": ke,
-		"aria-invalid": Ae,
-		"aria-required": je ?? v
-	}), Ue = oe(!1, k["aria-invalid"]), [A, j] = i(s, d ?? "", f), M = !h && !y, [N, P] = i(m, (_e ?? !1) && M, ve), F = N && M, [I, L] = c.useState(null), [We, Ge] = c.useState(M);
-	We !== M && (Ge(M), M || L(null));
-	let R = !M && N;
-	c.useEffect(() => {
-		R && P(!1);
-	}, [R, P]);
-	let [Ke, z] = c.useState(null), B = c.useRef(null), V = c.useRef(null), qe = c.useMemo(() => le(D), [D]), Je = c.useMemo(() => I ? (e) => ge(e, I) : void 0, [I]), H = (e) => {
-		z(e), j(e), p?.(e);
-	}, U = () => {
-		P(!1), L(null);
-	}, W;
-	g ? W = () => {
-		L(null), H("");
-	} : I && (W = () => L(null));
-	let G = ue({
-		open: F,
+var p = (c) => {
+	let { value: l, defaultValue: p, onValueChange: m, onOptionSelect: h, open: g, defaultOpen: Se, onOpenChange: Ce, placeholder: we, disabled: _ = !1, size: Te, appearance: Ee, freeform: v = !1, name: De, form: y, required: b, autoComplete: Oe = "off", autoCapitalize: ke, autoCorrect: Ae, maxLength: x, readOnly: S, clearable: C = !1, expandIcon: w, labels: T, inputMode: je, spellCheck: Me, enterKeyHint: Ne, autoFocus: Pe, tabIndex: Fe, id: Ie, "aria-label": Le, "aria-labelledby": Re, "aria-describedby": ze, "aria-invalid": Be, "aria-required": Ve, "aria-errormessage": He, "aria-details": Ue, onFocus: We, onBlur: Ge, onKeyDown: Ke, onKeyUp: qe, controlRef: Je, className: Ye, children: E, ref: Xe, ...Ze } = c;
+	h !== void 0 && t("Combobox", "onOptionSelect", "onValueChange");
+	let D = ee(), Qe = (b ?? D?.required ?? !1) && !S, O = te({
+		id: Ie,
+		"aria-label": Le,
+		"aria-labelledby": Re,
+		"aria-describedby": ze,
+		"aria-invalid": Be,
+		"aria-required": Ve ?? b
+	}), $e = le(!1, O["aria-invalid"]), { size: k, appearance: A } = ce(Te, Ee), [j, M] = i(l, p ?? "", m), N = !_ && !S, [P, F] = i(g, (Se ?? !1) && N, Ce), I = P && N, [L, R] = u.useState(null), [et, tt] = u.useState(N);
+	et !== N && (tt(N), N || R(null));
+	let z = !N && P;
+	u.useEffect(() => {
+		z && F(!1);
+	}, [z, F]);
+	let [nt, B] = u.useState(null), V = u.useRef(null), H = u.useRef(null), rt = u.useMemo(() => fe(E), [E]), it = u.useMemo(() => L ? (e) => xe(e, L) : void 0, [L]), U = (e) => {
+		B(e), M(e), h?.(e);
+	}, W = () => {
+		F(!1), R(null);
+	}, G;
+	v ? G = () => {
+		R(null), U("");
+	} : L && (G = () => R(null));
+	let K = s({
+		open: I,
 		onOpenChange: (e) => {
-			e ? P(!0) : U();
+			e ? F(!0) : W();
 		},
 		mode: "editable",
-		selectedValues: A ? [A] : [],
+		selectedValues: j ? [j] : [],
 		onSelect: (e) => {
-			j(e), p?.(e), L(null), z(null);
+			M(e), h?.(e), R(null), B(null);
 		},
-		filter: Je,
-		autoHighlight: !g && I ? "first" : !1,
+		filter: it,
+		autoHighlight: !v && L ? "first" : !1,
 		idPrefix: "combobox-listbox",
-		onClearDraft: W
-	}), K = A ? G.getItem(A)?.label ?? qe.get(A) : void 0, q;
-	q = g ? A === Ke ? A : K ?? A : I ?? K ?? "", g && I !== null && I !== q && L(q);
-	let J = F && G.items.length > 0, Y = x?.noMatches ?? "No matches", X = F && (J || !!I), Ye = X && !J, { layerId: Xe, setReference: Ze, surfaceRef: Qe, floatingProps: $e } = he({
-		open: F,
-		surfaceOpen: X,
-		onDismiss: U,
-		rootRef: B,
-		anchorRef: V
-	}), Z = a(B, Be), et = a(V, Re, Ze);
-	se(V, () => {
-		j(d ?? ""), L(null), z(null);
-	}, _);
-	let tt = (e) => {
-		if (e.key === "Escape" && F && !X && !e.nativeEvent.isComposing) {
-			U(), W && e.currentTarget.value !== "" && (e.preventDefault(), W());
+		onClearDraft: G
+	}), q = j ? K.getItem(j)?.label ?? rt.get(j) : void 0, J;
+	J = v ? j === nt ? j : q ?? j : L ?? q ?? "", v && L !== null && L !== J && R(J);
+	let Y = I && K.items.length > 0, X = T?.noMatches ?? "No matches", Z = I && (Y || !!L), at = Z && !Y, { layerId: ot, setReference: st, surfaceRef: ct, floatingProps: lt } = be({
+		open: I,
+		surfaceOpen: Z,
+		onDismiss: W,
+		rootRef: V,
+		anchorRef: H
+	}), ut = a(V, Xe), dt = a(H, Je, st);
+	ue(H, () => {
+		M(p ?? ""), R(null), B(null);
+	}, y);
+	let ft = (e) => {
+		if (e.key === "Escape" && I && !Z && !e.nativeEvent.isComposing) {
+			W(), G && e.currentTarget.value !== "" && (e.preventDefault(), G());
 			return;
 		}
-		G.onKeyDown(e);
-	}, nt = (e) => {
+		K.onKeyDown(e);
+	}, pt = (e) => {
 		let t = e.target.value;
-		L(t), F || P(!0), g && H(t);
-	}, rt = () => {
-		M && (F ? U() : P(!0), V.current?.focus());
-	}, it = () => {
-		j(""), z(null), L(null), P(!1), V.current?.focus();
-	}, Q = pe(b), $ = Te && A !== "" && !y, at = k["aria-label"] === void 0 ? k["aria-labelledby"] ?? O?.labelId : k["aria-labelledby"];
-	return /* @__PURE__ */ u("div", {
-		...Ve,
-		ref: Z,
-		className: e(r.root, "relative inline-flex flex-col", ze),
+		R(t), I || F(!0), v && U(t);
+	}, mt = () => {
+		N && (I ? W() : F(!0), H.current?.focus());
+	}, ht = () => {
+		M(""), B(null), R(null), F(!1), H.current?.focus();
+	}, Q = ve(w), $ = C && j !== "" && !S, gt = O["aria-label"] === void 0 ? O["aria-labelledby"] ?? D?.labelId : O["aria-labelledby"];
+	return /* @__PURE__ */ f("div", {
+		"data-size": k,
+		"data-appearance": A,
+		...Ze,
+		ref: ut,
+		className: e(r.root, "relative inline-flex flex-col", Ye),
 		children: [
-			/* @__PURE__ */ u("div", {
+			/* @__PURE__ */ f("div", {
 				className: "relative flex items-center",
 				children: [
-					/* @__PURE__ */ l("input", {
+					/* @__PURE__ */ d("input", {
 						type: "text",
-						autoComplete: xe,
-						...k,
-						...G.getComboboxProps(),
-						"aria-expanded": J,
-						"aria-errormessage": Me,
-						"aria-details": Ne,
-						ref: et,
-						disabled: h,
-						readOnly: y,
-						placeholder: ye,
-						autoCapitalize: Se,
-						autoCorrect: Ce,
-						maxLength: we,
-						inputMode: Ee,
-						spellCheck: De,
-						enterKeyHint: S,
-						autoFocus: C,
-						tabIndex: w,
-						value: q,
-						onChange: nt,
+						autoComplete: Oe,
+						...O,
+						...K.getComboboxProps(),
+						"aria-expanded": Y,
+						"aria-errormessage": He,
+						"aria-details": Ue,
+						ref: dt,
+						disabled: _,
+						readOnly: S,
+						placeholder: we,
+						autoCapitalize: ke,
+						autoCorrect: Ae,
+						maxLength: x,
+						inputMode: je,
+						spellCheck: Me,
+						enterKeyHint: Ne,
+						autoFocus: Pe,
+						tabIndex: Fe,
+						value: J,
+						onChange: pt,
 						onClick: () => {
-							!F && M && P(!0);
+							!I && N && F(!0);
 						},
-						onKeyDown: n(Ie, y ? void 0 : tt),
-						onKeyUp: n(Le, G.onKeyUp),
-						onFocus: Pe,
-						onBlur: n(Fe, () => L(null), { checkDefaultPrevented: !1 }),
-						className: e(r.input, re, "border-b-stroke-accessible", ie, ne, Ue && "border-destructive focus:border-b-destructive", de(Number($) + Number(Q)))
+						onKeyDown: n(Ke, S ? void 0 : ft),
+						onKeyUp: n(qe, K.onKeyUp),
+						onFocus: We,
+						onBlur: n(Ge, () => R(null), { checkDefaultPrevented: !1 }),
+						className: e(r.input, ae[k], "w-full", oe[k], o[k], re[A], "text-foreground placeholder:text-muted-foreground", ie, ne, $e && "border-destructive", me(Number($) + Number(Q), k))
 					}),
-					$ && /* @__PURE__ */ l("button", {
+					$ && /* @__PURE__ */ d("button", {
 						type: "button",
-						"aria-label": x?.clear ?? "Clear selection",
-						disabled: h,
+						"aria-label": T?.clear ?? "Clear selection",
+						disabled: _,
 						onMouseDown: (e) => e.preventDefault(),
-						onClick: it,
-						className: e(r.clearButton, "absolute flex h-6 w-6 items-center justify-center rounded bg-transparent p-0 text-muted-foreground not-disabled:not-aria-disabled:hover:bg-subtle-hover not-disabled:not-aria-disabled:hover:text-foreground", Q ? "end-7" : "end-1", "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring", "disabled:cursor-not-allowed disabled:opacity-50 aria-disabled:cursor-not-allowed aria-disabled:opacity-50 aria-disabled:focus-visible:opacity-100"),
-						children: /* @__PURE__ */ l(ae, {})
+						onClick: ht,
+						className: e(r.clearButton, ge(k, A), pe(k, Q ? 2 : 1), "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring", "disabled:cursor-not-allowed disabled:opacity-50 aria-disabled:cursor-not-allowed aria-disabled:opacity-50 aria-disabled:focus-visible:opacity-100"),
+						children: /* @__PURE__ */ d(se, { size: he(k, "icon") })
 					}),
-					Q && /* @__PURE__ */ l(fe, {
+					Q && /* @__PURE__ */ d(_e, {
 						component: "Combobox",
-						expandIcon: b,
-						label: x?.expand ?? "Show options",
-						expanded: J,
-						listboxId: G.listboxId,
-						disabled: h || !!y,
-						onToggle: rt,
+						expandIcon: w,
+						label: T?.expand ?? "Show options",
+						expanded: Y,
+						listboxId: K.listboxId,
+						disabled: _ || !!S,
+						onToggle: mt,
+						size: k,
+						appearance: A,
 						className: r.expandButton,
 						iconClassName: r.expandIcon
 					})
 				]
 			}),
-			/* @__PURE__ */ l("span", {
+			/* @__PURE__ */ d("span", {
 				role: "status",
 				className: "sr-only",
-				children: Ye && Y
+				children: at && X
 			}),
-			/* @__PURE__ */ l(me, {
-				listbox: G,
-				layerId: Xe,
-				surfaceRef: Qe,
-				floatingProps: $e,
-				open: F,
-				expanded: J,
+			/* @__PURE__ */ d(ye, {
+				listbox: K,
+				layerId: ot,
+				surfaceRef: ct,
+				floatingProps: lt,
+				open: I,
+				expanded: Y,
 				listboxClassName: r.listbox,
 				surfaceClassName: r.surface,
-				emptyContent: I ? /* @__PURE__ */ l("div", {
+				emptyContent: L ? /* @__PURE__ */ d("div", {
 					"aria-hidden": "true",
 					className: e(r.emptyMessage, "px-3 py-1.5 text-body-1 text-muted-foreground"),
-					children: Y
+					children: X
 				}) : void 0,
-				"aria-label": k["aria-label"],
-				"aria-labelledby": at,
-				children: D
+				"aria-label": O["aria-label"],
+				"aria-labelledby": gt,
+				children: E
 			}),
-			/* @__PURE__ */ l(ce, {
-				name: be,
-				form: _,
-				disabled: h,
-				value: A,
+			/* @__PURE__ */ d(de, {
+				name: De,
+				form: y,
+				disabled: _,
+				value: j,
 				type: "text",
-				required: He,
-				onInvalid: () => V.current?.focus()
+				required: Qe,
+				onInvalid: () => H.current?.focus()
 			})
 		]
 	});
 };
-d.displayName = "Combobox";
-var f = o, p = s, m = /* @__PURE__ */ Object.assign(d, {
-	Option: o,
-	OptionGroup: s
+p.displayName = "Combobox";
+var m = c, h = l, g = /* @__PURE__ */ Object.assign(p, {
+	Option: c,
+	OptionGroup: l
 });
 //#endregion
-export { m as Combobox, f as ComboboxOption, p as ComboboxOptionGroup, o as Option, s as OptionGroup };
+export { g as Combobox, m as ComboboxOption, h as ComboboxOptionGroup, c as Option, l as OptionGroup };
 
 //# sourceMappingURL=Combobox.mjs.map

package/dist/components/input/Combobox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.mjs","names":["React","matchesText","item","text","ComboboxRoot","valueProp","openProp","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaInvalid","ariaRequired","ariaErrorMessage","ariaDetails","rest","props","onOptionSelect","warnDeprecated","field","useFieldContext","validates","required","readOnly","fieldProps","useFieldControl","invalidLook","isInvalidLook","value","setValue","useControllable","defaultValue","onValueChange","interactive","disabled","openState","setOpen","defaultOpen","onOpenChange","open","draft","setDraft","wasInteractive","setWasInteractive","lockedOpen","typedValue","setTypedValue","rootRef","inputRef","optionLabels","collectOptionLabels","children","filter","commitText","close","clearDraft","freeform","listbox","useListbox","next","optionLabel","inputText","expanded","noMatchesText","labels","surfaceOpen","noMatches","useListboxPopup","rootMergedRef","useMergedRefs","ref","inputMergedRef","controlRef","setReference","form","handleKeyDown","event","handleChange","handleExpandClick","handleClear","showExpand","showsExpandButton","expandIcon","showClear","clearable","listLabelledBy","cn","comboboxClassNames","className","composeEventHandlers","onKeyDown","onKeyUp","onBlur","inputBase","inputFocus","disabledStyles","pickerEndPadding","DismissIcon","PickerExpandButton","ListboxSurface","HiddenInput","ComboboxOption","Option","ComboboxOptionGroup","OptionGroup","Combobox"],"sources":["../../../src/components/input/Combobox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { comboboxClassNames } from '../../lib/classNames';\nimport { cn } from '../../lib/cn';\nimport { composeEventHandlers } from '../../lib/composeEventHandlers';\nimport { warnDeprecated } from '../../lib/dev';\nimport { DismissIcon } from '../../lib/icons';\nimport type { Slot } from '../../lib/slot';\nimport { disabledStyles, focusRing, inputBase, inputFocus, inputInvalid } from '../../lib/styles';\nimport { useControllable } from '../../hooks/useControllable';\nimport { useFieldContext, useFieldControl } from '../../hooks/useFieldControl';\nimport { useFormReset } from '../../hooks/useFormReset';\nimport { collectOptionLabels, useListbox, type ListboxItem } from '../../hooks/useListbox';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { HiddenInput } from '../internal/HiddenInput';\nimport { PickerExpandButton, showsExpandButton } from './Combobox.expand';\nimport { isInvalidLook } from './Input';\nimport { ListboxSurface, Option, OptionGroup, useListboxPopup } from './Option';\nimport { PICKER_ICON_BUTTON_CLASSES, pickerEndPadding } from './pickerStyles';\nimport type { RoutedHandlers } from './routedHandlers';\n\nexport { Option, OptionGroup } from './Option';\nexport type { OptionProps, OptionGroupProps } from './Option';\n\n/* ------------------------------------------------------------------ */\n/*  Combobox                                                          */\n/* ------------------------------------------------------------------ */\n\n/**\n * The Combobox's built-in texts, for localization. Each member is optional and falls back to its\n * English default.\n */\nexport interface ComboboxLabels {\n  /** Status text (announced, and shown in the popup) when the typed text matches no option.\n   * @default 'No matches'\n   */\n  noMatches?: string;\n  /** Name of the clear button (`clearable`).\n   * @default 'Clear selection'\n   */\n  clear?: string;\n  /** Name of the expand button at the end of the input.\n   * @default 'Show options'\n   */\n  expand?: string;\n}\n\n/** Properties for the Combobox component. */\nexport interface ComboboxProps extends Omit<\n  React.HTMLAttributes<HTMLDivElement>,\n  'onChange' | 'defaultValue' | RoutedHandlers\n> {\n  /** Controlled selected value (`''` for none). */\n  value?: string;\n  /**\n   * Initial selected value for uncontrolled usage.\n   * @default ''\n   */\n  defaultValue?: string;\n  /**\n   * Called with the new value when it changes: an option is selected, or (with `freeform`) the\n   * text changes. Not called when the current option is selected again.\n   */\n  onValueChange?: (value: string) => void;\n  /**\n   * Called on every option activation, also when the current option is selected again (and, with\n   * `freeform`, on every text change).\n   * @deprecated Use `onValueChange`.\n   */\n  onOptionSelect?: (value: string) => void;\n  /**\n   * Controlled open state of the listbox. The list renders only in the browser: an open combobox\n   * is closed in the server HTML and opens once it has hydrated.\n   */\n  open?: boolean;\n  /**\n   * Initial open state for uncontrolled usage. A combobox that starts disabled or read-only\n   * starts closed. The list renders only in the browser: it is closed in the server HTML and opens\n   * once the combobox has hydrated.\n   * @default false\n   */\n  defaultOpen?: boolean;\n  /** Called when the listbox opens or closes. */\n  onOpenChange?: (open: boolean) => void;\n  /** Placeholder text shown when no value is selected. */\n  placeholder?: string;\n  /**\n   * Whether the combobox is disabled and non-interactive.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Whether the typed text is itself the value. Without it, typing only filters the options (the\n   * first match becomes active, so Enter selects it) and the input shows the selected option's\n   * label again when the listbox closes or loses focus. With it, the input shows typed text as\n   * typed (also when it equals an option's value), a selected option's label, and a controlled\n   * `value` as soon as the parent sets it (a parent that normalizes or rejects the text).\n   * @default false\n   */\n  freeform?: boolean;\n  /** Name of the value in form submissions (renders a hidden input). */\n  name?: string;\n  /** Id of the form the value belongs to, when the Combobox is outside it. */\n  form?: string;\n  /**\n   * A value is required to submit the form (native constraint validation). Like a native readonly\n   * input, a `readOnly` Combobox does not block submission.\n   */\n  required?: boolean;\n  /**\n   * The `autocomplete` attribute of the `<input role=\"combobox\">`. Browser autofill is off unless\n   * you set it (for example `'on'`).\n   * @default 'off'\n   */\n  autoComplete?: string;\n  /** The maximum length of the typed text (`maxlength` of the `<input role=\"combobox\">`). */\n  maxLength?: number;\n  /**\n   * The value cannot be changed: the input is read-only and the listbox neither opens (click,\n   * keyboard, a controlled `open`) nor commits; Escape is left to the page. Turning it (or\n   * `disabled`) on while the listbox is open closes it (`onOpenChange(false)`).\n   */\n  readOnly?: boolean;\n  /**\n   * Shows a clear button while a value is selected (not while `readOnly`; while `disabled` it is\n   * shown disabled, as in DatePicker and TimePicker). It clears the value\n   * (`onValueChange('')`), drops typed text, closes the list and moves focus to the input. It is\n   * a tab stop after the input.\n   * @default false\n   */\n  clearable?: boolean;\n  /**\n   * The glyph of the expand button at the end of the input (default: a chevron). The button\n   * opens and closes the list without moving focus out of the input and is not a tab stop\n   * (Alt+ArrowDown opens the list from the keyboard). `null` or `undefined` keep the chevron;\n   * `false`, or a value that renders nothing, hides the button. Decorative content rendered\n   * inside the built-in button: a `<button>` or `Button` passed here is not nested (its children\n   * become the glyph, with a development warning).\n   */\n  expandIcon?: Slot<'span'>;\n  /**\n   * The built-in texts (the \"No matches\" status and the names of the clear and expand buttons),\n   * for localization. Unset members keep their English defaults.\n   */\n  labels?: ComboboxLabels;\n  /** Called when the `<input role=\"combobox\">` receives focus (the root keeps other handlers). */\n  onFocus?: React.FocusEventHandler<HTMLInputElement>;\n  /** Called when the `<input role=\"combobox\">` loses focus. */\n  onBlur?: React.FocusEventHandler<HTMLInputElement>;\n  /**\n   * Called on a key press in the `<input role=\"combobox\">`, before the built-in listbox keys;\n   * `event.preventDefault()` skips them.\n   */\n  onKeyDown?: React.KeyboardEventHandler<HTMLInputElement>;\n  /** Called when a key is released in the `<input role=\"combobox\">`. */\n  onKeyUp?: React.KeyboardEventHandler<HTMLInputElement>;\n  /** Ref to the `<input role=\"combobox\">` (the focusable element). */\n  controlRef?: React.Ref<HTMLInputElement>;\n  /** Ref to the root `<div>`. */\n  ref?: React.Ref<HTMLDivElement>;\n}\n\nfunction matchesText(item: ListboxItem, text: string): boolean {\n  return (item.textValue ?? item.label).toLowerCase().includes(text.toLowerCase());\n}\n\nconst ComboboxRoot = (props: ComboboxProps) => {\n  const {\n    value: valueProp,\n    defaultValue,\n    onValueChange,\n    onOptionSelect,\n    open: openProp,\n    defaultOpen,\n    onOpenChange,\n    placeholder,\n    disabled = false,\n    freeform = false,\n    name,\n    form,\n    required,\n    autoComplete = 'off',\n    autoCapitalize,\n    autoCorrect,\n    maxLength,\n    readOnly,\n    clearable = false,\n    expandIcon,\n    labels,\n    inputMode,\n    spellCheck,\n    enterKeyHint,\n    autoFocus,\n    tabIndex,\n    id,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n    'aria-invalid': ariaInvalid,\n    'aria-required': ariaRequired,\n    'aria-errormessage': ariaErrorMessage,\n    'aria-details': ariaDetails,\n    onFocus,\n    onBlur,\n    onKeyDown,\n    onKeyUp,\n    controlRef,\n    className,\n    children,\n    ref,\n    ...rest\n  } = props;\n\n  if (onOptionSelect !== undefined) warnDeprecated('Combobox', 'onOptionSelect', 'onValueChange');\n\n  const field = useFieldContext();\n  const isRequired = required ?? field?.required ?? false;\n  const validates = isRequired && !readOnly;\n  const fieldProps = useFieldControl({\n    id,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n    'aria-invalid': ariaInvalid,\n    // An explicit `required={false}` wins over a required Field, so aria-required matches\n    // `isRequired`.\n    'aria-required': ariaRequired ?? required,\n  });\n  // The error look follows the resolved state: the consumer's `aria-invalid` or the Field's.\n  const invalidLook = isInvalidLook(false, fieldProps['aria-invalid']);\n\n  const [value, setValue] = useControllable(valueProp, defaultValue ?? '', onValueChange);\n  const interactive = !disabled && !readOnly;\n  // A combobox that starts disabled or read-only never shows its list, so it starts closed (no\n  // close to report later).\n  const [openState, setOpen] = useControllable(\n    openProp,\n    (defaultOpen ?? false) && interactive,\n    onOpenChange,\n  );\n  const open = openState && interactive;\n  // Text typed since the last commit, the filter; `null` shows the committed value's label\n  // (input-pickers#7). Freeform: the input shows the value, and the draft follows that text.\n  const [draft, setDraft] = React.useState<string | null>(null);\n  // Locking the control (readOnly/disabled) while typing drops the draft, so the input shows the\n  // committed value again (adjust-during-render pattern, C-HOOKS).\n  const [wasInteractive, setWasInteractive] = React.useState(interactive);\n  if (wasInteractive !== interactive) {\n    setWasInteractive(interactive);\n    if (!interactive) setDraft(null);\n  }\n  // Locking also closes the list itself, not only the derived `open`, so unlocking does not reopen\n  // it without a user action. The close is reported through onOpenChange (a consumer callback from\n  // an effect, C-HOOKS); a controlled `open` that stays true is still not shown while locked.\n  const lockedOpen = !interactive && openState;\n  React.useEffect(() => {\n    if (lockedOpen) setOpen(false);\n  }, [lockedOpen, setOpen]);\n\n  // Freeform: the value the user typed last. While the value still equals it, the input shows it\n  // as typed, even when it equals an option's value (not that option's label).\n  const [typedValue, setTypedValue] = React.useState<string | null>(null);\n\n  const rootRef = React.useRef<HTMLDivElement | null>(null);\n  const inputRef = React.useRef<HTMLInputElement | null>(null);\n\n  const optionLabels = React.useMemo(() => collectOptionLabels(children), [children]);\n  const filter = React.useMemo(\n    () => (draft ? (item: ListboxItem) => matchesText(item, draft) : undefined),\n    [draft],\n  );\n\n  const commitText = (text: string) => {\n    setTypedValue(text);\n    setValue(text);\n    onOptionSelect?.(text);\n  };\n\n  const close = () => {\n    setOpen(false);\n    setDraft(null);\n  };\n\n  // APG: Escape on a closed listbox clears the textbox. Freeform: the text is the value, so it is\n  // cleared. Otherwise only a typed filter is dropped (the input shows the selected label again);\n  // without one there is nothing to clear and Escape is left to the page.\n  let clearDraft: (() => void) | undefined;\n  if (freeform) {\n    clearDraft = () => {\n      setDraft(null);\n      commitText('');\n    };\n  } else if (draft) {\n    clearDraft = () => setDraft(null);\n  }\n\n  const listbox = useListbox({\n    open,\n    onOpenChange: (next) => {\n      if (next) setOpen(true);\n      else close();\n    },\n    mode: 'editable',\n    selectedValues: value ? [value] : [],\n    onSelect: (next) => {\n      setValue(next);\n      onOptionSelect?.(next);\n      setDraft(null);\n      setTypedValue(null);\n    },\n    filter,\n    // Typing a filter makes its first match active (like Fluent's Combobox), so Enter selects what\n    // the list shows instead of submitting the form. Nothing is active on open or with the text\n    // cleared. Freeform: the text is the value, so Enter keeps it unless the user moved to an\n    // option.\n    autoHighlight: !freeform && draft ? 'first' : false,\n    idPrefix: 'combobox-listbox',\n    onClearDraft: clearDraft,\n  });\n\n  // The input text. Freeform: the value as typed while it is the value the user typed last, else\n  // the label of the option with that value, else the value itself — so the text follows a\n  // controlled parent that normalizes or rejects what was typed while the input still has focus.\n  // Otherwise: the typed filter, else the selected option's label.\n  const optionLabel = value\n    ? (listbox.getItem(value)?.label ?? optionLabels.get(value))\n    : undefined;\n  let inputText: string;\n  if (freeform) inputText = value === typedValue ? value : (optionLabel ?? value);\n  else inputText = draft ?? optionLabel ?? '';\n  // Freeform: the filter follows the text (adjust-during-render pattern, C-HOOKS; the text does not\n  // depend on the filter, so this settles in one pass).\n  if (freeform && draft !== null && draft !== inputText) setDraft(inputText);\n\n  const expanded = open && listbox.items.length > 0;\n  const noMatchesText = labels?.noMatches ?? 'No matches';\n  // The popup shows the list, or \"No matches\" for a draft.\n  const surfaceOpen = open && (expanded || !!draft);\n  const noMatches = surfaceOpen && !expanded;\n  const { layerId, setReference, surfaceRef, floatingProps } = useListboxPopup({\n    open,\n    surfaceOpen,\n    onDismiss: close,\n    rootRef,\n    anchorRef: inputRef,\n  });\n\n  const rootMergedRef = useMergedRefs<HTMLDivElement>(rootRef, ref);\n  const inputMergedRef = useMergedRefs<HTMLInputElement>(inputRef, controlRef, setReference);\n\n  useFormReset(\n    inputRef,\n    () => {\n      setValue(defaultValue ?? '');\n      setDraft(null);\n      setTypedValue(null);\n    },\n    form,\n  );\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (event.key === 'Escape' && open && !surfaceOpen && !event.nativeEvent.isComposing) {\n      // Open with nothing shown (no options): close as a closed list would handle Escape — clear\n      // the text if there is any, otherwise leave the key to an enclosing layer (overlays#1).\n      close();\n      if (clearDraft && event.currentTarget.value !== '') {\n        event.preventDefault();\n        clearDraft();\n      }\n      return;\n    }\n    listbox.onKeyDown(event);\n  };\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const text = event.target.value;\n    setDraft(text);\n    if (!open) setOpen(true);\n    if (freeform) commitText(text);\n  };\n\n  // The expand button opens and closes the list like the input's own keys; focus stays in (or\n  // returns to) the input.\n  const handleExpandClick = () => {\n    if (!interactive) return;\n    if (open) close();\n    else setOpen(true);\n    inputRef.current?.focus();\n  };\n\n  // Clearing is not an option activation: the state is set directly, not through `commitText`\n  // (which calls the deprecated `onOptionSelect` in freeform mode). The button disappears with the\n  // value, so focus moves to the input explicitly (C-DISABLED).\n  const handleClear = () => {\n    setValue('');\n    setTypedValue(null);\n    setDraft(null);\n    setOpen(false);\n    inputRef.current?.focus();\n  };\n\n  const showExpand = showsExpandButton(expandIcon);\n  // Read-only comboboxes offer no clear action (the value cannot change).\n  const showClear = clearable && value !== '' && !readOnly;\n\n  const listLabelledBy =\n    fieldProps['aria-label'] === undefined\n      ? (fieldProps['aria-labelledby'] ?? field?.labelId)\n      : fieldProps['aria-labelledby'];\n\n  return (\n    <div\n      {...rest}\n      ref={rootMergedRef}\n      className={cn(comboboxClassNames.root, 'relative inline-flex flex-col', className)}\n    >\n      <div className=\"relative flex items-center\">\n        <input\n          type=\"text\"\n          autoComplete={autoComplete}\n          {...fieldProps}\n          {...listbox.getComboboxProps()}\n          aria-expanded={expanded}\n          aria-errormessage={ariaErrorMessage}\n          aria-details={ariaDetails}\n          ref={inputMergedRef}\n          disabled={disabled}\n          readOnly={readOnly}\n          placeholder={placeholder}\n          autoCapitalize={autoCapitalize}\n          autoCorrect={autoCorrect}\n          maxLength={maxLength}\n          inputMode={inputMode}\n          spellCheck={spellCheck}\n          enterKeyHint={enterKeyHint}\n          autoFocus={autoFocus}\n          tabIndex={tabIndex}\n          value={inputText}\n          onChange={handleChange}\n          onClick={() => {\n            if (!open && interactive) setOpen(true);\n          }}\n          // Read-only: no listbox keys at all (they would open, commit or clear the value).\n          onKeyDown={composeEventHandlers(onKeyDown, readOnly ? undefined : handleKeyDown)}\n          onKeyUp={composeEventHandlers(onKeyUp, listbox.onKeyUp)}\n          onFocus={onFocus}\n          onBlur={composeEventHandlers(onBlur, () => setDraft(null), {\n            checkDefaultPrevented: false,\n          })}\n          className={cn(\n            comboboxClassNames.input,\n            inputBase,\n            'border-b-stroke-accessible',\n            inputFocus,\n            disabledStyles,\n            invalidLook && inputInvalid,\n            pickerEndPadding(Number(showClear) + Number(showExpand)),\n          )}\n        />\n        {showClear && (\n          <button\n            type=\"button\"\n            aria-label={labels?.clear ?? 'Clear selection'}\n            disabled={disabled}\n            // Keeps focus in the input, so its blur does not act on a draft before the clear.\n            onMouseDown={(event) => event.preventDefault()}\n            onClick={handleClear}\n            className={cn(\n              comboboxClassNames.clearButton,\n              PICKER_ICON_BUTTON_CLASSES,\n              showExpand ? 'end-7' : 'end-1',\n              focusRing,\n              disabledStyles,\n            )}\n          >\n            <DismissIcon />\n          </button>\n        )}\n        {showExpand && (\n          <PickerExpandButton\n            component=\"Combobox\"\n            expandIcon={expandIcon}\n            label={labels?.expand ?? 'Show options'}\n            expanded={expanded}\n            listboxId={listbox.listboxId}\n            disabled={disabled || !!readOnly}\n            onToggle={handleExpandClick}\n            className={comboboxClassNames.expandButton}\n            iconClassName={comboboxClassNames.expandIcon}\n          />\n        )}\n      </div>\n      {/* Mounted before its text: a live region added together with its text is not announced by\n          every screen reader. The row in the popup is the visible copy. */}\n      <span role=\"status\" className=\"sr-only\">\n        {noMatches && noMatchesText}\n      </span>\n      <ListboxSurface\n        listbox={listbox}\n        layerId={layerId}\n        surfaceRef={surfaceRef}\n        floatingProps={floatingProps}\n        open={open}\n        expanded={expanded}\n        listboxClassName={comboboxClassNames.listbox}\n        surfaceClassName={comboboxClassNames.surface}\n        emptyContent={\n          draft ? (\n            <div\n              aria-hidden=\"true\"\n              className={cn(\n                comboboxClassNames.emptyMessage,\n                'px-3 py-1.5 text-body-1 text-muted-foreground',\n              )}\n            >\n              {noMatchesText}\n            </div>\n          ) : undefined\n        }\n        aria-label={fieldProps['aria-label']}\n        aria-labelledby={listLabelledBy}\n      >\n        {children}\n      </ListboxSurface>\n      <HiddenInput\n        name={name}\n        form={form}\n        disabled={disabled}\n        value={value}\n        type=\"text\"\n        // Like a native readonly input, a read-only Combobox is barred from constraint validation\n        // (the user could not fix it); its value is still submitted.\n        required={validates}\n        onInvalid={() => inputRef.current?.focus()}\n      />\n    </div>\n  );\n};\nComboboxRoot.displayName = 'Combobox';\n\n/** Flat name of `Combobox.Option` for React Server Components. */\nexport const ComboboxOption = Option;\n/** Flat name of `Combobox.OptionGroup` for React Server Components. */\nexport const ComboboxOptionGroup = OptionGroup;\n\n/**\n * An editable combobox: a text input with a filterable listbox of `Option`s (APG combobox with\n * list autocomplete). Typing filters the options; ArrowDown/ArrowUp move the highlight\n * (`aria-activedescendant`), Enter selects, Escape closes. Without `freeform` the text is only a\n * filter: its first match becomes active while typing, and the input shows the selected option's\n * label again when the listbox closes. With `freeform` the text itself is the value. Text that\n * matches no option shows \"No matches\" (`labels.noMatches`), announced through a status region.\n * The expand button at the end of the input (a chevron, see `expandIcon`) opens and closes the\n * list without taking focus from the input and is not a tab stop; `clearable` adds a clear button,\n * a tab stop after the input. Both sit with the input in a wrapper `<div>` inside the root.\n *\n * The `<input>` receives `id`, `aria-label`, `aria-labelledby`, `aria-describedby`,\n * `aria-invalid`, `aria-required`, `aria-errormessage`, `aria-details`, `tabIndex`, `autoFocus`,\n * `onFocus`/`onBlur`/`onKeyDown`/`onKeyUp` and the text input attributes `autoComplete`,\n * `autoCapitalize`, `autoCorrect`, `maxLength`, `inputMode`, `spellCheck` and `enterKeyHint`.\n * `ref`, `className`, `style`, other `aria-*` attributes and the remaining props stay on the root\n * `<div>`. Inside a `Field` the input is labelled and described by it. It shows the error look\n * whenever it ends up `aria-invalid` (its own `aria-invalid` or a `Field` error). With\n * `name`/`required` the value takes part in form submission, validation and reset. The open\n * listbox renders in a portal; while closed it stays in the DOM, hidden.\n *\n * Sub-components: `Combobox.Option`, `Combobox.OptionGroup`. React Server Components import the\n * flat names `ComboboxOption` / `ComboboxOptionGroup` (dotted access needs a client file).\n */\nexport const Combobox = /* @__PURE__ */ Object.assign(ComboboxRoot, {\n  Option,\n  OptionGroup,\n});\n"],"mappings":"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"}
+{"version":3,"file":"Combobox.mjs","names":["React","matchesText","item","text","ComboboxRoot","valueProp","openProp","sizeProp","appearanceProp","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaInvalid","ariaRequired","ariaErrorMessage","ariaDetails","rest","props","onOptionSelect","warnDeprecated","field","useFieldContext","validates","required","readOnly","fieldProps","useFieldControl","invalidLook","isInvalidLook","useInputLook","value","setValue","useControllable","defaultValue","onValueChange","interactive","disabled","openState","setOpen","defaultOpen","onOpenChange","open","draft","setDraft","wasInteractive","setWasInteractive","lockedOpen","typedValue","setTypedValue","rootRef","inputRef","optionLabels","collectOptionLabels","children","filter","commitText","close","clearDraft","freeform","listbox","useListbox","next","optionLabel","inputText","expanded","noMatchesText","labels","surfaceOpen","noMatches","useListboxPopup","rootMergedRef","useMergedRefs","ref","inputMergedRef","controlRef","setReference","form","handleKeyDown","event","handleChange","handleExpandClick","handleClear","showExpand","showsExpandButton","expandIcon","showClear","clearable","listLabelledBy","size","appearance","cn","comboboxClassNames","className","composeEventHandlers","onKeyDown","onKeyUp","onBlur","inputHeightClasses","inputPaddingClasses","inputTextClasses","inputAppearanceClasses","inputFocus","disabledStyles","pickerEndPadding","pickerIconButtonClasses","pickerButtonOffset","DismissIcon","pickerGlyphSize","PickerExpandButton","ListboxSurface","HiddenInput","ComboboxOption","Option","ComboboxOptionGroup","OptionGroup","Combobox"],"sources":["../../../src/components/input/Combobox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { comboboxClassNames } from '../../lib/classNames';\nimport { cn } from '../../lib/cn';\nimport { composeEventHandlers } from '../../lib/composeEventHandlers';\nimport { warnDeprecated } from '../../lib/dev';\nimport { DismissIcon } from '../../lib/icons';\nimport type { Slot } from '../../lib/slot';\nimport {\n  disabledStyles,\n  focusRing,\n  inputAppearanceClasses,\n  inputFocus,\n  inputHeightClasses,\n  inputInvalid,\n  inputPaddingClasses,\n  inputTextClasses,\n} from '../../lib/styles';\nimport type { CoreSize, InputAppearance } from '../../lib/types';\nimport { useControllable } from '../../hooks/useControllable';\nimport { useFieldContext, useFieldControl } from '../../hooks/useFieldControl';\nimport { useFormReset } from '../../hooks/useFormReset';\nimport { collectOptionLabels, useListbox, type ListboxItem } from '../../hooks/useListbox';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { HiddenInput } from '../internal/HiddenInput';\nimport { PickerExpandButton, showsExpandButton } from './Combobox.expand';\nimport { useInputLook } from './inputLook';\nimport { isInvalidLook } from './Input';\nimport { ListboxSurface, Option, OptionGroup, useListboxPopup } from './Option';\nimport {\n  pickerButtonOffset,\n  pickerEndPadding,\n  pickerGlyphSize,\n  pickerIconButtonClasses,\n} from './pickerStyles';\nimport type { RoutedHandlers } from './routedHandlers';\n\nexport { Option, OptionGroup } from './Option';\nexport type { OptionProps, OptionGroupProps } from './Option';\n\n/* ------------------------------------------------------------------ */\n/*  Combobox                                                          */\n/* ------------------------------------------------------------------ */\n\n/**\n * The Combobox's built-in texts, for localization. Each member is optional and falls back to its\n * English default.\n */\nexport interface ComboboxLabels {\n  /** Status text (announced, and shown in the popup) when the typed text matches no option.\n   * @default 'No matches'\n   */\n  noMatches?: string;\n  /** Name of the clear button (`clearable`).\n   * @default 'Clear selection'\n   */\n  clear?: string;\n  /** Name of the expand button at the end of the input.\n   * @default 'Show options'\n   */\n  expand?: string;\n}\n\n/** Properties for the Combobox component. */\nexport interface ComboboxProps extends Omit<\n  React.HTMLAttributes<HTMLDivElement>,\n  'onChange' | 'defaultValue' | RoutedHandlers\n> {\n  /** Controlled selected value (`''` for none). */\n  value?: string;\n  /**\n   * Initial selected value for uncontrolled usage.\n   * @default ''\n   */\n  defaultValue?: string;\n  /**\n   * Called with the new value when it changes: an option is selected, or (with `freeform`) the\n   * text changes. Not called when the current option is selected again.\n   */\n  onValueChange?: (value: string) => void;\n  /**\n   * Called on every option activation, also when the current option is selected again (and, with\n   * `freeform`, on every text change).\n   * @deprecated Use `onValueChange`.\n   */\n  onOptionSelect?: (value: string) => void;\n  /**\n   * Controlled open state of the listbox. The list renders only in the browser: an open combobox\n   * is closed in the server HTML and opens once it has hydrated.\n   */\n  open?: boolean;\n  /**\n   * Initial open state for uncontrolled usage. A combobox that starts disabled or read-only\n   * starts closed. The list renders only in the browser: it is closed in the server HTML and opens\n   * once the combobox has hydrated.\n   * @default false\n   */\n  defaultOpen?: boolean;\n  /** Called when the listbox opens or closes. */\n  onOpenChange?: (open: boolean) => void;\n  /** Placeholder text shown when no value is selected. */\n  placeholder?: string;\n  /**\n   * Whether the combobox is disabled and non-interactive.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Size of the field: `small` (24px tall), `medium` (32px) or `large` (40px). Default: the\n   * surrounding Field's `size`, else `WaveProvider inputDefaults.size`, else `'medium'`. The\n   * listbox keeps its size.\n   */\n  size?: CoreSize;\n  /**\n   * Look of the field: `outline` (a full border), `underline` (a bottom stroke only),\n   * `filled-darker` or `filled-lighter` (a fill without a visible stroke: give the field a visible\n   * label). Default: `WaveProvider inputDefaults.appearance`, else `'outline'`.\n   */\n  appearance?: InputAppearance;\n  /**\n   * Whether the typed text is itself the value. Without it, typing only filters the options (the\n   * first match becomes active, so Enter selects it) and the input shows the selected option's\n   * label again when the listbox closes or loses focus. With it, the input shows typed text as\n   * typed (also when it equals an option's value), a selected option's label, and a controlled\n   * `value` as soon as the parent sets it (a parent that normalizes or rejects the text).\n   * @default false\n   */\n  freeform?: boolean;\n  /** Name of the value in form submissions (renders a hidden input). */\n  name?: string;\n  /** Id of the form the value belongs to, when the Combobox is outside it. */\n  form?: string;\n  /**\n   * A value is required to submit the form (native constraint validation). Like a native readonly\n   * input, a `readOnly` Combobox does not block submission.\n   */\n  required?: boolean;\n  /**\n   * The `autocomplete` attribute of the `<input role=\"combobox\">`. Browser autofill is off unless\n   * you set it (for example `'on'`).\n   * @default 'off'\n   */\n  autoComplete?: string;\n  /** The maximum length of the typed text (`maxlength` of the `<input role=\"combobox\">`). */\n  maxLength?: number;\n  /**\n   * The value cannot be changed: the input is read-only and the listbox neither opens (click,\n   * keyboard, a controlled `open`) nor commits; Escape is left to the page. Turning it (or\n   * `disabled`) on while the listbox is open closes it (`onOpenChange(false)`).\n   */\n  readOnly?: boolean;\n  /**\n   * Shows a clear button while a value is selected (not while `readOnly`; while `disabled` it is\n   * shown disabled, as in DatePicker and TimePicker). It clears the value\n   * (`onValueChange('')`), drops typed text, closes the list and moves focus to the input. It is\n   * a tab stop after the input.\n   * @default false\n   */\n  clearable?: boolean;\n  /**\n   * The glyph of the expand button at the end of the input (default: a chevron). The button\n   * opens and closes the list without moving focus out of the input and is not a tab stop\n   * (Alt+ArrowDown opens the list from the keyboard). `null` or `undefined` keep the chevron;\n   * `false`, or a value that renders nothing, hides the button. Decorative content rendered\n   * inside the built-in button: a `<button>` or `Button` passed here is not nested (its children\n   * become the glyph, with a development warning).\n   */\n  expandIcon?: Slot<'span'>;\n  /**\n   * The built-in texts (the \"No matches\" status and the names of the clear and expand buttons),\n   * for localization. Unset members keep their English defaults.\n   */\n  labels?: ComboboxLabels;\n  /** Called when the `<input role=\"combobox\">` receives focus (the root keeps other handlers). */\n  onFocus?: React.FocusEventHandler<HTMLInputElement>;\n  /** Called when the `<input role=\"combobox\">` loses focus. */\n  onBlur?: React.FocusEventHandler<HTMLInputElement>;\n  /**\n   * Called on a key press in the `<input role=\"combobox\">`, before the built-in listbox keys;\n   * `event.preventDefault()` skips them.\n   */\n  onKeyDown?: React.KeyboardEventHandler<HTMLInputElement>;\n  /** Called when a key is released in the `<input role=\"combobox\">`. */\n  onKeyUp?: React.KeyboardEventHandler<HTMLInputElement>;\n  /** Ref to the `<input role=\"combobox\">` (the focusable element). */\n  controlRef?: React.Ref<HTMLInputElement>;\n  /** Ref to the root `<div>`. */\n  ref?: React.Ref<HTMLDivElement>;\n}\n\nfunction matchesText(item: ListboxItem, text: string): boolean {\n  return (item.textValue ?? item.label).toLowerCase().includes(text.toLowerCase());\n}\n\nconst ComboboxRoot = (props: ComboboxProps) => {\n  const {\n    value: valueProp,\n    defaultValue,\n    onValueChange,\n    onOptionSelect,\n    open: openProp,\n    defaultOpen,\n    onOpenChange,\n    placeholder,\n    disabled = false,\n    size: sizeProp,\n    appearance: appearanceProp,\n    freeform = false,\n    name,\n    form,\n    required,\n    autoComplete = 'off',\n    autoCapitalize,\n    autoCorrect,\n    maxLength,\n    readOnly,\n    clearable = false,\n    expandIcon,\n    labels,\n    inputMode,\n    spellCheck,\n    enterKeyHint,\n    autoFocus,\n    tabIndex,\n    id,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n    'aria-invalid': ariaInvalid,\n    'aria-required': ariaRequired,\n    'aria-errormessage': ariaErrorMessage,\n    'aria-details': ariaDetails,\n    onFocus,\n    onBlur,\n    onKeyDown,\n    onKeyUp,\n    controlRef,\n    className,\n    children,\n    ref,\n    ...rest\n  } = props;\n\n  if (onOptionSelect !== undefined) warnDeprecated('Combobox', 'onOptionSelect', 'onValueChange');\n\n  const field = useFieldContext();\n  const isRequired = required ?? field?.required ?? false;\n  const validates = isRequired && !readOnly;\n  const fieldProps = useFieldControl({\n    id,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n    'aria-invalid': ariaInvalid,\n    // An explicit `required={false}` wins over a required Field, so aria-required matches\n    // `isRequired`.\n    'aria-required': ariaRequired ?? required,\n  });\n  // The error look follows the resolved state: the consumer's `aria-invalid` or the Field's.\n  const invalidLook = isInvalidLook(false, fieldProps['aria-invalid']);\n  const { size, appearance } = useInputLook(sizeProp, appearanceProp);\n\n  const [value, setValue] = useControllable(valueProp, defaultValue ?? '', onValueChange);\n  const interactive = !disabled && !readOnly;\n  // A combobox that starts disabled or read-only never shows its list, so it starts closed (no\n  // close to report later).\n  const [openState, setOpen] = useControllable(\n    openProp,\n    (defaultOpen ?? false) && interactive,\n    onOpenChange,\n  );\n  const open = openState && interactive;\n  // Text typed since the last commit, the filter; `null` shows the committed value's label\n  // (input-pickers#7). Freeform: the input shows the value, and the draft follows that text.\n  const [draft, setDraft] = React.useState<string | null>(null);\n  // Locking the control (readOnly/disabled) while typing drops the draft, so the input shows the\n  // committed value again (adjust-during-render pattern, C-HOOKS).\n  const [wasInteractive, setWasInteractive] = React.useState(interactive);\n  if (wasInteractive !== interactive) {\n    setWasInteractive(interactive);\n    if (!interactive) setDraft(null);\n  }\n  // Locking also closes the list itself, not only the derived `open`, so unlocking does not reopen\n  // it without a user action. The close is reported through onOpenChange (a consumer callback from\n  // an effect, C-HOOKS); a controlled `open` that stays true is still not shown while locked.\n  const lockedOpen = !interactive && openState;\n  React.useEffect(() => {\n    if (lockedOpen) setOpen(false);\n  }, [lockedOpen, setOpen]);\n\n  // Freeform: the value the user typed last. While the value still equals it, the input shows it\n  // as typed, even when it equals an option's value (not that option's label).\n  const [typedValue, setTypedValue] = React.useState<string | null>(null);\n\n  const rootRef = React.useRef<HTMLDivElement | null>(null);\n  const inputRef = React.useRef<HTMLInputElement | null>(null);\n\n  const optionLabels = React.useMemo(() => collectOptionLabels(children), [children]);\n  const filter = React.useMemo(\n    () => (draft ? (item: ListboxItem) => matchesText(item, draft) : undefined),\n    [draft],\n  );\n\n  const commitText = (text: string) => {\n    setTypedValue(text);\n    setValue(text);\n    onOptionSelect?.(text);\n  };\n\n  const close = () => {\n    setOpen(false);\n    setDraft(null);\n  };\n\n  // APG: Escape on a closed listbox clears the textbox. Freeform: the text is the value, so it is\n  // cleared. Otherwise only a typed filter is dropped (the input shows the selected label again);\n  // without one there is nothing to clear and Escape is left to the page.\n  let clearDraft: (() => void) | undefined;\n  if (freeform) {\n    clearDraft = () => {\n      setDraft(null);\n      commitText('');\n    };\n  } else if (draft) {\n    clearDraft = () => setDraft(null);\n  }\n\n  const listbox = useListbox({\n    open,\n    onOpenChange: (next) => {\n      if (next) setOpen(true);\n      else close();\n    },\n    mode: 'editable',\n    selectedValues: value ? [value] : [],\n    onSelect: (next) => {\n      setValue(next);\n      onOptionSelect?.(next);\n      setDraft(null);\n      setTypedValue(null);\n    },\n    filter,\n    // Typing a filter makes its first match active (like Fluent's Combobox), so Enter selects what\n    // the list shows instead of submitting the form. Nothing is active on open or with the text\n    // cleared. Freeform: the text is the value, so Enter keeps it unless the user moved to an\n    // option.\n    autoHighlight: !freeform && draft ? 'first' : false,\n    idPrefix: 'combobox-listbox',\n    onClearDraft: clearDraft,\n  });\n\n  // The input text. Freeform: the value as typed while it is the value the user typed last, else\n  // the label of the option with that value, else the value itself — so the text follows a\n  // controlled parent that normalizes or rejects what was typed while the input still has focus.\n  // Otherwise: the typed filter, else the selected option's label.\n  const optionLabel = value\n    ? (listbox.getItem(value)?.label ?? optionLabels.get(value))\n    : undefined;\n  let inputText: string;\n  if (freeform) inputText = value === typedValue ? value : (optionLabel ?? value);\n  else inputText = draft ?? optionLabel ?? '';\n  // Freeform: the filter follows the text (adjust-during-render pattern, C-HOOKS; the text does not\n  // depend on the filter, so this settles in one pass).\n  if (freeform && draft !== null && draft !== inputText) setDraft(inputText);\n\n  const expanded = open && listbox.items.length > 0;\n  const noMatchesText = labels?.noMatches ?? 'No matches';\n  // The popup shows the list, or \"No matches\" for a draft.\n  const surfaceOpen = open && (expanded || !!draft);\n  const noMatches = surfaceOpen && !expanded;\n  const { layerId, setReference, surfaceRef, floatingProps } = useListboxPopup({\n    open,\n    surfaceOpen,\n    onDismiss: close,\n    rootRef,\n    anchorRef: inputRef,\n  });\n\n  const rootMergedRef = useMergedRefs<HTMLDivElement>(rootRef, ref);\n  const inputMergedRef = useMergedRefs<HTMLInputElement>(inputRef, controlRef, setReference);\n\n  useFormReset(\n    inputRef,\n    () => {\n      setValue(defaultValue ?? '');\n      setDraft(null);\n      setTypedValue(null);\n    },\n    form,\n  );\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (event.key === 'Escape' && open && !surfaceOpen && !event.nativeEvent.isComposing) {\n      // Open with nothing shown (no options): close as a closed list would handle Escape — clear\n      // the text if there is any, otherwise leave the key to an enclosing layer (overlays#1).\n      close();\n      if (clearDraft && event.currentTarget.value !== '') {\n        event.preventDefault();\n        clearDraft();\n      }\n      return;\n    }\n    listbox.onKeyDown(event);\n  };\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const text = event.target.value;\n    setDraft(text);\n    if (!open) setOpen(true);\n    if (freeform) commitText(text);\n  };\n\n  // The expand button opens and closes the list like the input's own keys; focus stays in (or\n  // returns to) the input.\n  const handleExpandClick = () => {\n    if (!interactive) return;\n    if (open) close();\n    else setOpen(true);\n    inputRef.current?.focus();\n  };\n\n  // Clearing is not an option activation: the state is set directly, not through `commitText`\n  // (which calls the deprecated `onOptionSelect` in freeform mode). The button disappears with the\n  // value, so focus moves to the input explicitly (C-DISABLED).\n  const handleClear = () => {\n    setValue('');\n    setTypedValue(null);\n    setDraft(null);\n    setOpen(false);\n    inputRef.current?.focus();\n  };\n\n  const showExpand = showsExpandButton(expandIcon);\n  // Read-only comboboxes offer no clear action (the value cannot change).\n  const showClear = clearable && value !== '' && !readOnly;\n\n  const listLabelledBy =\n    fieldProps['aria-label'] === undefined\n      ? (fieldProps['aria-labelledby'] ?? field?.labelId)\n      : fieldProps['aria-labelledby'];\n\n  return (\n    <div\n      data-size={size}\n      data-appearance={appearance}\n      {...rest}\n      ref={rootMergedRef}\n      className={cn(comboboxClassNames.root, 'relative inline-flex flex-col', className)}\n    >\n      <div className=\"relative flex items-center\">\n        <input\n          type=\"text\"\n          autoComplete={autoComplete}\n          {...fieldProps}\n          {...listbox.getComboboxProps()}\n          aria-expanded={expanded}\n          aria-errormessage={ariaErrorMessage}\n          aria-details={ariaDetails}\n          ref={inputMergedRef}\n          disabled={disabled}\n          readOnly={readOnly}\n          placeholder={placeholder}\n          autoCapitalize={autoCapitalize}\n          autoCorrect={autoCorrect}\n          maxLength={maxLength}\n          inputMode={inputMode}\n          spellCheck={spellCheck}\n          enterKeyHint={enterKeyHint}\n          autoFocus={autoFocus}\n          tabIndex={tabIndex}\n          value={inputText}\n          onChange={handleChange}\n          onClick={() => {\n            if (!open && interactive) setOpen(true);\n          }}\n          // Read-only: no listbox keys at all (they would open, commit or clear the value).\n          onKeyDown={composeEventHandlers(onKeyDown, readOnly ? undefined : handleKeyDown)}\n          onKeyUp={composeEventHandlers(onKeyUp, listbox.onKeyUp)}\n          onFocus={onFocus}\n          onBlur={composeEventHandlers(onBlur, () => setDraft(null), {\n            checkDefaultPrevented: false,\n          })}\n          className={cn(\n            comboboxClassNames.input,\n            inputHeightClasses[size],\n            'w-full',\n            inputPaddingClasses[size],\n            inputTextClasses[size],\n            inputAppearanceClasses[appearance],\n            'text-foreground placeholder:text-muted-foreground',\n            inputFocus,\n            disabledStyles,\n            invalidLook && inputInvalid,\n            pickerEndPadding(Number(showClear) + Number(showExpand), size),\n          )}\n        />\n        {showClear && (\n          <button\n            type=\"button\"\n            aria-label={labels?.clear ?? 'Clear selection'}\n            disabled={disabled}\n            // Keeps focus in the input, so its blur does not act on a draft before the clear.\n            onMouseDown={(event) => event.preventDefault()}\n            onClick={handleClear}\n            className={cn(\n              comboboxClassNames.clearButton,\n              pickerIconButtonClasses(size, appearance),\n              pickerButtonOffset(size, showExpand ? 2 : 1),\n              focusRing,\n              disabledStyles,\n            )}\n          >\n            <DismissIcon size={pickerGlyphSize(size, 'icon')} />\n          </button>\n        )}\n        {showExpand && (\n          <PickerExpandButton\n            component=\"Combobox\"\n            expandIcon={expandIcon}\n            label={labels?.expand ?? 'Show options'}\n            expanded={expanded}\n            listboxId={listbox.listboxId}\n            disabled={disabled || !!readOnly}\n            onToggle={handleExpandClick}\n            size={size}\n            appearance={appearance}\n            className={comboboxClassNames.expandButton}\n            iconClassName={comboboxClassNames.expandIcon}\n          />\n        )}\n      </div>\n      {/* Mounted before its text: a live region added together with its text is not announced by\n          every screen reader. The row in the popup is the visible copy. */}\n      <span role=\"status\" className=\"sr-only\">\n        {noMatches && noMatchesText}\n      </span>\n      <ListboxSurface\n        listbox={listbox}\n        layerId={layerId}\n        surfaceRef={surfaceRef}\n        floatingProps={floatingProps}\n        open={open}\n        expanded={expanded}\n        listboxClassName={comboboxClassNames.listbox}\n        surfaceClassName={comboboxClassNames.surface}\n        emptyContent={\n          draft ? (\n            <div\n              aria-hidden=\"true\"\n              className={cn(\n                comboboxClassNames.emptyMessage,\n                'px-3 py-1.5 text-body-1 text-muted-foreground',\n              )}\n            >\n              {noMatchesText}\n            </div>\n          ) : undefined\n        }\n        aria-label={fieldProps['aria-label']}\n        aria-labelledby={listLabelledBy}\n      >\n        {children}\n      </ListboxSurface>\n      <HiddenInput\n        name={name}\n        form={form}\n        disabled={disabled}\n        value={value}\n        type=\"text\"\n        // Like a native readonly input, a read-only Combobox is barred from constraint validation\n        // (the user could not fix it); its value is still submitted.\n        required={validates}\n        onInvalid={() => inputRef.current?.focus()}\n      />\n    </div>\n  );\n};\nComboboxRoot.displayName = 'Combobox';\n\n/** Flat name of `Combobox.Option` for React Server Components. */\nexport const ComboboxOption = Option;\n/** Flat name of `Combobox.OptionGroup` for React Server Components. */\nexport const ComboboxOptionGroup = OptionGroup;\n\n/**\n * An editable combobox: a text input with a filterable listbox of `Option`s (APG combobox with\n * list autocomplete). Typing filters the options; ArrowDown/ArrowUp move the highlight\n * (`aria-activedescendant`), Enter selects, Escape closes. Without `freeform` the text is only a\n * filter: its first match becomes active while typing, and the input shows the selected option's\n * label again when the listbox closes. With `freeform` the text itself is the value. Text that\n * matches no option shows \"No matches\" (`labels.noMatches`), announced through a status region.\n * The expand button at the end of the input (a chevron, see `expandIcon`) opens and closes the\n * list without taking focus from the input and is not a tab stop; `clearable` adds a clear button,\n * a tab stop after the input. Both sit with the input in a wrapper `<div>` inside the root.\n *\n * The `<input>` receives `id`, `aria-label`, `aria-labelledby`, `aria-describedby`,\n * `aria-invalid`, `aria-required`, `aria-errormessage`, `aria-details`, `tabIndex`, `autoFocus`,\n * `onFocus`/`onBlur`/`onKeyDown`/`onKeyUp` and the text input attributes `autoComplete`,\n * `autoCapitalize`, `autoCorrect`, `maxLength`, `inputMode`, `spellCheck` and `enterKeyHint`.\n * `ref`, `className`, `style`, other `aria-*` attributes and the remaining props stay on the root\n * `<div>`. Inside a `Field` the input is labelled and described by it. It shows the error look\n * whenever it ends up `aria-invalid` (its own `aria-invalid` or a `Field` error). With\n * `name`/`required` the value takes part in form submission, validation and reset. The open\n * listbox renders in a portal; while closed it stays in the DOM, hidden.\n *\n * **Size and appearance**: `size` resolves from its own prop, then the surrounding `Field`'s\n * `size`, then `WaveProvider inputDefaults.size`, else `'medium'`; `appearance` from its own prop,\n * then `WaveProvider inputDefaults.appearance`, else `'outline'`; both render as `data-size` and\n * `data-appearance` on the root `<div>`. The listbox keeps its size.\n *\n * Sub-components: `Combobox.Option`, `Combobox.OptionGroup`. React Server Components import the\n * flat names `ComboboxOption` / `ComboboxOptionGroup` (dotted access needs a client file).\n */\nexport const Combobox = /* @__PURE__ */ Object.assign(ComboboxRoot, {\n  Option,\n  OptionGroup,\n});\n"],"mappings":"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"}