@mastra/playground-ui 68.0.0 → 69.0.0-alpha.0

package/dist/{combobox-DIT_6xiG.cjs → combobox-i723LxeC.cjs}

@@ -1,10 +1,10 @@
 const require_rolldown_runtime = require("./rolldown-runtime-CmQyd0Gu.cjs");
-const require_utils = require("./utils-uDc1ofX1.cjs");
-const require_primitives_form_element = require("./primitives/form-element.cjs.js");
-const require_Button = require("./Button-DLcMcuUL.cjs");
+const require_combobox_parts = require("./combobox-parts-BeNqgCbj.cjs");
+const require_Button = require("./Button-BfICfyxD.cjs");
 const require_field_control_aria = require("./field-control-aria-Dw0_ObOU.cjs");
-const require_combobox_parts = require("./combobox-parts-C4phOq4t.cjs");
-const require_field_error_id = require("./field-error-id-nGAF0330.cjs");
+const require_field_error_id = require("./field-error-id-VimPQI_b.cjs");
+const require_primitives_form_element = require("./primitives/form-element.cjs.js");
+const require_utils = require("./utils-uDc1ofX1.cjs");
 let react = require("react");
 react = require_rolldown_runtime.__toESM(react, 1);
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -73,17 +73,25 @@ function getControlProps({ id, ariaLabel, ariaDescribedBy, hasLabel, multiple, e
 function triggerClassName({ iconOnlyValue, className }) {
 	return require_utils.cn(iconOnlyValue && "w-auto px-2.5", className);
 }
-function ComboboxOptionText({ option }) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
-		className: require_combobox_parts.comboboxStyles.optionText,
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-			className: require_combobox_parts.comboboxStyles.optionLabel,
-			children: option.label
-		}), option.description && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-			className: require_combobox_parts.comboboxStyles.optionDescription,
-			children: option.description
-		})]
-	});
+/** An option row's content: start slot, label over description, end slot. */
+function ComboboxOptionContent({ option }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+		option.start,
+		/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+			className: require_combobox_parts.comboboxStyles.optionText,
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: require_combobox_parts.comboboxStyles.optionLabel,
+				children: option.label
+			}), option.description && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: require_combobox_parts.comboboxStyles.optionDescription,
+				children: option.description
+			})]
+		}),
+		option.end ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: require_combobox_parts.comboboxStyles.optionEnd,
+			children: option.end
+		}) : null
+	] });
 }
 function ComboboxClearFooter({ label, onClear }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
@@ -100,23 +108,17 @@ function ComboboxClearFooter({ label, onClear }) {
 	});
 }
 /** The popup: the search row for a compact trigger (a field searches in itself), then the options. */
-function ComboboxOptionsContent({ showSearch, searchPlaceholder, emptyText, align, container, footer }) {
+function ComboboxOptionsContent({ popupWidth, showSearch, searchPlaceholder, emptyText, align, container, footer }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_combobox_parts.ComboboxContent, {
 		align,
 		container,
+		className: popupWidth && require_combobox_parts.comboboxPopupWidthClass[popupWidth],
 		children: [
 			showSearch ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_combobox_parts.ComboboxSearch, { placeholder: searchPlaceholder }) : null,
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_combobox_parts.ComboboxEmpty, { children: emptyText }),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_combobox_parts.ComboboxList, { children: (option) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_combobox_parts.ComboboxItem, {
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_combobox_parts.ComboboxList, { children: (option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_combobox_parts.ComboboxItem, {
 				value: option,
-				children: [
-					option.start,
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ComboboxOptionText, { option }),
-					option.end ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-						className: require_combobox_parts.comboboxStyles.optionEnd,
-						children: option.end
-					}) : null
-				]
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ComboboxOptionContent, { option })
 			}, option.value) }),
 			footer
 		]
@@ -161,7 +163,7 @@ function MultipleComboboxControl({ shape, controlProps, placeholder, selectedCou
 		})
 	});
 }
-function SingleCombobox({ shape, controlProps, options, value, onValueChange, placeholder = "Select option", searchPlaceholder = "Search", emptyText = "No option found.", className, disabled = false, variant = "default", size = "md", open, onOpenChange, container, align = "start", showChevron = true, iconOnlyValue = false, allowCustomValue = false, onInputValueChange }) {
+function SingleCombobox({ shape, controlProps, options, value, onValueChange, placeholder = "Select option", searchPlaceholder = "Search", emptyText = "No option found.", className, disabled = false, variant = "default", size = "md", open, onOpenChange, container, align = "start", popupWidth, showChevron = true, iconOnlyValue = false, allowCustomValue = false, onInputValueChange }) {
 	const [inputValue, setInputValue] = react.useState("");
 	const filter = useOptionFilter();
 	const inField = shape === "field";
@@ -202,6 +204,7 @@ function SingleCombobox({ shape, controlProps, options, value, onValueChange, pl
 				className
 			}
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ComboboxOptionsContent, {
+			popupWidth,
 			showSearch: !inField,
 			searchPlaceholder,
 			emptyText,
@@ -210,7 +213,7 @@ function SingleCombobox({ shape, controlProps, options, value, onValueChange, pl
 		})]
 	});
 }
-function MultipleCombobox({ shape, controlProps, options, value = EMPTY_VALUES, onValueChange, clearLabel, placeholder = "Select options", searchPlaceholder = "Search", emptyText = "No option found.", className, disabled = false, variant = "default", size = "md", open, onOpenChange, container, align = "start", showChevron = true, iconOnlyValue = false }) {
+function MultipleCombobox({ shape, controlProps, options, value = EMPTY_VALUES, onValueChange, clearLabel, placeholder = "Select options", searchPlaceholder = "Search", emptyText = "No option found.", className, disabled = false, variant = "default", size = "md", open, onOpenChange, container, align = "start", popupWidth, showChevron = true, iconOnlyValue = false }) {
 	const filter = useOptionFilter();
 	const selectedValues = new Set(value);
 	const selectedOptions = options.filter((option) => selectedValues.has(option.value));
@@ -241,6 +244,7 @@ function MultipleCombobox({ shape, controlProps, options, value = EMPTY_VALUES,
 				className
 			}
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ComboboxOptionsContent, {
+			popupWidth,
 			showSearch: shape !== "chips",
 			searchPlaceholder,
 			emptyText,
@@ -306,4 +310,4 @@ Object.defineProperty(exports, "Combobox", {
 	}
 });
 
-//# sourceMappingURL=combobox-DIT_6xiG.cjs.map
+//# sourceMappingURL=combobox-i723LxeC.cjs.map

package/dist/combobox-i723LxeC.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox-i723LxeC.cjs","names":["isIconButtonSize","BaseCombobox","fieldErrorId","keepOwnAccessibleName","deprecatedErrorAria","cn","_Fragment","comboboxStyles","Button","X","ComboboxContent","comboboxPopupWidthClass","ComboboxSearch","ComboboxEmpty","ComboboxList","ComboboxItem","ComboboxInput","ComboboxTrigger","ComboboxValue","ComboboxChips","ComboboxChip","ComboboxChipsInput","React","ComboboxRoot","useFieldAriaIds","FieldBlock"],"sources":["../src/ds/components/Combobox/combobox.tsx"],"sourcesContent":["import { Combobox as BaseCombobox } from '@base-ui/react/combobox';\nimport { X } from 'lucide-react';\nimport * as React from 'react';\nimport {\n  ComboboxChip,\n  ComboboxChips,\n  ComboboxChipsInput,\n  ComboboxContent,\n  ComboboxEmpty,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxList,\n  ComboboxRoot,\n  ComboboxSearch,\n  ComboboxTrigger,\n  ComboboxValue,\n} from './combobox-parts';\nimport { comboboxPopupWidthClass, comboboxStyles } from './combobox-styles';\nimport type { ComboboxPopupWidth, ComboboxVariant } from './combobox-styles';\nimport { Button, isIconButtonSize } from '@/ds/components/Button/Button';\nimport type { ButtonSize } from '@/ds/components/Button/Button';\nimport { keepOwnAccessibleName, useFieldAriaIds } from '@/ds/components/Field/field-control-aria';\nimport { FieldBlock } from '@/ds/components/FormFieldBlocks/block/field-block';\nimport { fieldErrorId } from '@/ds/components/FormFieldBlocks/block/field-error-id';\nimport { deprecatedErrorAria } from '@/ds/primitives/form-element';\nimport type { PortalContainer } from '@/ds/primitives/portal-container';\nimport { cn } from '@/lib/utils';\n\nexport type { ComboboxPopupWidth, ComboboxVariant } from './combobox-styles';\n\nexport type ComboboxOption = {\n  label: string;\n  value: string;\n  description?: string;\n  displayLabel?: React.ReactNode;\n  start?: React.ReactNode;\n  end?: React.ReactNode;\n  /** Extra terms the search matches besides `label` (aliases, ids, a provider name). Never displayed. */\n  keywords?: readonly string[];\n};\n\ntype ComboboxSharedProps = {\n  options: ComboboxOption[];\n  placeholder?: React.ReactNode;\n  /** The search row's placeholder for compact triggers. A field (inside a `Field`) searches in itself and shows `placeholder`. */\n  searchPlaceholder?: string;\n  emptyText?: string;\n  className?: string;\n  disabled?: boolean;\n  /**\n   * `default` inside a `Field` is a form field you type in to search. `ghost` (and the legacy `outline`/`link`),\n   * or any variant outside a `Field`, is a compact trigger with the search inside the popup.\n   */\n  variant?: ComboboxVariant;\n  /** Icon sizes (`icon-*`) render a chevron-only trigger with the search in the popup; pass `aria-label` to name it. */\n  size?: ButtonSize;\n  open?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  container?: PortalContainer;\n  id?: string;\n  'aria-label'?: string;\n  'aria-describedby'?: string;\n  /** Which edge of the trigger the popup lines up with. `end` opens it leftwards (e.g. an icon trigger at the end of a row). */\n  align?: 'start' | 'center' | 'end';\n  /** A fixed popup width for long options (e.g. model ids). Without it the popup takes the trigger's width, at least 11rem. */\n  popupWidth?: ComboboxPopupWidth;\n  showChevron?: boolean;\n  iconOnlyValue?: boolean;\n  allowCustomValue?: boolean;\n  /** Called with the search text as it changes (and with `''` after a compact trigger's selection resets it). */\n  onInputValueChange?: (value: string) => void;\n  /** @deprecated Wrap the combobox in `<Field invalid>` with a `FieldError`. */\n  error?: string;\n  /** @deprecated Only keyed the `error` message id; a `Field` links its error without one. */\n  name?: string;\n};\n\nexport type ComboboxSingleProps = ComboboxSharedProps & {\n  multiple?: false;\n  value?: string;\n  onValueChange?: (value: string) => void;\n};\n\nexport type ComboboxMultipleProps = ComboboxSharedProps & {\n  multiple: true;\n  value?: readonly string[];\n  onValueChange?: (value: string[]) => void;\n  clearLabel?: string;\n};\n\nexport type ComboboxProps = ComboboxSingleProps | ComboboxMultipleProps;\n\nconst EMPTY_VALUES: readonly string[] = [];\n\nfunction isMultipleCombobox(props: ComboboxProps): props is ComboboxMultipleProps {\n  return props.multiple === true;\n}\n\n/** The text a field shows for its value: a plain-text `displayLabel` wins over `label`. */\nfunction optionText(option: ComboboxOption) {\n  return typeof option.displayLabel === 'string' ? option.displayLabel : option.label;\n}\n\n/** Inputs take a text placeholder only; a ReactNode placeholder keeps the compact trigger. */\nfunction textPlaceholder(placeholder: React.ReactNode) {\n  return typeof placeholder === 'string' ? placeholder : undefined;\n}\n\n/**\n * How the combobox renders:\n * - `field`: a single select inside a `Field` searches in the field, like a text input.\n * - `chips`: a multiple select inside a `Field` shows its picks as chips and searches in the field.\n * - `trigger`: everything else (toolbars, breadcrumbs, inline pickers that callers lay out as a button)\n *   keeps a compact trigger with the search inside the popup.\n */\ntype ComboboxShape = 'field' | 'chips' | 'trigger';\n\nfunction getComboboxShape({\n  inFieldContext,\n  multiple,\n  variant,\n  size,\n  iconOnlyValue,\n  showChevron,\n  placeholder,\n}: {\n  inFieldContext: boolean;\n  multiple: boolean;\n  variant: ComboboxVariant;\n  size: ButtonSize;\n  iconOnlyValue: boolean;\n  showChevron: boolean;\n  placeholder: React.ReactNode;\n}): ComboboxShape {\n  if (!inFieldContext) return 'trigger';\n  if (variant !== 'default') return 'trigger';\n  if (isIconButtonSize(size)) return 'trigger';\n  if (iconOnlyValue || !showChevron) return 'trigger';\n  if (placeholder !== undefined && textPlaceholder(placeholder) === undefined) return 'trigger';\n  if (!multiple) return 'field';\n  // The chips field is tuned to the medium control height.\n  if (size !== 'md') return 'trigger';\n  return 'chips';\n}\n\n/** A \"Use “text”\" option for typed text that isn't one of the options yet. */\nfunction getCustomOption(options: ComboboxOption[], inputValue: string): ComboboxOption | undefined {\n  const value = inputValue.trim();\n  if (!value) return undefined;\n  // A field shows the selected option's text while it's closed; that isn't a new value.\n  if (options.some(option => option.value === value || optionText(option) === value)) return undefined;\n  return { label: `Use “${value}”`, value };\n}\n\n/** Matches the label like Base UI's default filter, the text a field shows, and any keywords. */\nfunction useOptionFilter() {\n  const { contains } = BaseCombobox.useFilter();\n  return (option: ComboboxOption, query: string) =>\n    [option.label, optionText(option), ...(option.keywords ?? [])].some(text => contains(text, query));\n}\n\n/** Names the control when nothing else does: an `id` or a `Field` links a label to it instead. */\nfunction getFallbackAriaLabel({ hasLabel, multiple }: { hasLabel: boolean; multiple: boolean }) {\n  if (hasLabel) return undefined;\n  return multiple ? 'Select options' : 'Select option';\n}\n\nfunction getControlProps({\n  id,\n  ariaLabel,\n  ariaDescribedBy,\n  hasLabel,\n  multiple,\n  error,\n  errorName,\n}: {\n  id?: string;\n  ariaLabel?: string;\n  ariaDescribedBy?: string;\n  hasLabel: boolean;\n  multiple: boolean;\n  error?: string;\n  errorName: string;\n}) {\n  const describedBy = [ariaDescribedBy, error ? fieldErrorId(errorName) : undefined].filter(Boolean).join(' ');\n  return {\n    id,\n    'aria-label': ariaLabel ?? getFallbackAriaLabel({ hasLabel, multiple }),\n    ...keepOwnAccessibleName({ 'aria-label': ariaLabel }),\n    ...deprecatedErrorAria(Boolean(error)),\n    'aria-describedby': describedBy || undefined,\n  };\n}\n\ntype ControlProps = ReturnType<typeof getControlProps>;\n\nfunction triggerClassName({ iconOnlyValue, className }: { iconOnlyValue: boolean; className?: string }) {\n  return cn(iconOnlyValue && 'w-auto px-2.5', className);\n}\n\n/** An option row's content: start slot, label over description, end slot. */\nfunction ComboboxOptionContent({ option }: { option: ComboboxOption }) {\n  return (\n    <>\n      {option.start}\n      <span className={comboboxStyles.optionText}>\n        <span className={comboboxStyles.optionLabel}>{option.label}</span>\n        {option.description && <span className={comboboxStyles.optionDescription}>{option.description}</span>}\n      </span>\n      {option.end ? <span className={comboboxStyles.optionEnd}>{option.end}</span> : null}\n    </>\n  );\n}\n\nfunction ComboboxClearFooter({ label, onClear }: { label: string; onClear: () => void }) {\n  return (\n    <div className=\"border-t border-border p-1\">\n      <Button\n        type=\"button\"\n        variant=\"destructive-ghost\"\n        size=\"sm\"\n        className=\"w-full justify-start\"\n        onClick={onClear}\n        icon={<X />}\n      >\n        {label}\n      </Button>\n    </div>\n  );\n}\n\n/** The popup: the search row for a compact trigger (a field searches in itself), then the options. */\nfunction ComboboxOptionsContent({\n  popupWidth,\n  showSearch,\n  searchPlaceholder,\n  emptyText,\n  align,\n  container,\n  footer,\n}: {\n  popupWidth?: ComboboxPopupWidth;\n  showSearch: boolean;\n  searchPlaceholder: string;\n  emptyText: string;\n  align: 'start' | 'center' | 'end';\n  container?: PortalContainer;\n  footer?: React.ReactNode;\n}) {\n  return (\n    <ComboboxContent align={align} container={container} className={popupWidth && comboboxPopupWidthClass[popupWidth]}>\n      {showSearch ? <ComboboxSearch placeholder={searchPlaceholder} /> : null}\n      <ComboboxEmpty>{emptyText}</ComboboxEmpty>\n      <ComboboxList>\n        {(option: ComboboxOption) => (\n          <ComboboxItem key={option.value} value={option}>\n            <ComboboxOptionContent option={option} />\n          </ComboboxItem>\n        )}\n      </ComboboxList>\n      {footer}\n    </ComboboxContent>\n  );\n}\n\ntype TriggerLookProps = {\n  variant: ComboboxVariant;\n  size: ButtonSize;\n  showChevron: boolean;\n  iconOnlyValue: boolean;\n  className?: string;\n};\n\nfunction SingleComboboxControl({\n  shape,\n  controlProps,\n  placeholder,\n  selectedOption,\n  look,\n}: {\n  shape: ComboboxShape;\n  controlProps: ControlProps;\n  placeholder: React.ReactNode;\n  selectedOption?: ComboboxOption;\n  look: TriggerLookProps;\n}) {\n  if (shape === 'field') {\n    return (\n      <ComboboxInput\n        {...controlProps}\n        size={isIconButtonSize(look.size) ? undefined : look.size}\n        placeholder={textPlaceholder(placeholder)}\n        start={selectedOption?.start}\n        className={look.className}\n      />\n    );\n  }\n\n  return (\n    <ComboboxTrigger\n      {...controlProps}\n      variant={look.variant}\n      size={look.size}\n      showChevron={look.showChevron}\n      icon={isIconButtonSize(look.size) ? undefined : selectedOption?.start}\n      className={triggerClassName(look)}\n    >\n      {selectedOption?.displayLabel ?? <ComboboxValue placeholder={placeholder} />}\n    </ComboboxTrigger>\n  );\n}\n\nfunction MultipleComboboxControl({\n  shape,\n  controlProps,\n  placeholder,\n  selectedCount,\n  look,\n}: {\n  shape: ComboboxShape;\n  controlProps: ControlProps;\n  placeholder: React.ReactNode;\n  selectedCount: number;\n  look: TriggerLookProps;\n}) {\n  if (shape === 'chips') {\n    return (\n      <ComboboxChips className={look.className}>\n        <ComboboxValue>\n          {(items: ComboboxOption[]) => (\n            <>\n              {items.map(item => (\n                <ComboboxChip key={item.value}>{item.label}</ComboboxChip>\n              ))}\n              <ComboboxChipsInput\n                {...controlProps}\n                placeholder={items.length === 0 ? textPlaceholder(placeholder) : undefined}\n              />\n            </>\n          )}\n        </ComboboxValue>\n      </ComboboxChips>\n    );\n  }\n\n  const text = selectedCount === 0 ? placeholder : `${selectedCount} selected`;\n  return (\n    <ComboboxTrigger\n      {...controlProps}\n      variant={look.variant}\n      size={look.size}\n      showChevron={look.showChevron}\n      className={triggerClassName(look)}\n    >\n      <span className={cn(selectedCount === 0 && comboboxStyles.placeholder)}>{text}</span>\n    </ComboboxTrigger>\n  );\n}\n\ntype ShapeProps = { shape: ComboboxShape; controlProps: ControlProps };\n\nfunction SingleCombobox({\n  shape,\n  controlProps,\n  options,\n  value,\n  onValueChange,\n  placeholder = 'Select option',\n  searchPlaceholder = 'Search',\n  emptyText = 'No option found.',\n  className,\n  disabled = false,\n  variant = 'default',\n  size = 'md',\n  open,\n  onOpenChange,\n  container,\n  align = 'start',\n  popupWidth,\n  showChevron = true,\n  iconOnlyValue = false,\n  allowCustomValue = false,\n  onInputValueChange,\n}: ComboboxSingleProps & ShapeProps) {\n  // The search text: a field's own text, or the compact trigger's popup search.\n  const [inputValue, setInputValue] = React.useState('');\n  const filter = useOptionFilter();\n  const inField = shape === 'field';\n  const selectedOption = options.find(option => option.value === value);\n  const customOption = allowCustomValue ? getCustomOption(options, inputValue) : undefined;\n  const items = customOption ? [customOption, ...options] : options;\n\n  function handleInputValueChange(next: string) {\n    setInputValue(next);\n    onInputValueChange?.(next);\n  }\n\n  function handleValueChange(item: ComboboxOption | null) {\n    if (!item) return;\n    onValueChange?.(item.value);\n    // A field shows the picked option; a compact trigger's popup search starts empty next time.\n    if (!inField) handleInputValueChange('');\n  }\n\n  return (\n    <ComboboxRoot\n      autoHighlight\n      items={items}\n      filter={filter}\n      itemToStringLabel={optionText}\n      // Base UI's \"nothing selected\" is null.\n      value={selectedOption ?? null}\n      // A field owns its text (the selected option's, or the search); a compact trigger's search is reset here.\n      inputValue={inField ? undefined : inputValue}\n      onInputValueChange={handleInputValueChange}\n      onValueChange={handleValueChange}\n      disabled={disabled}\n      open={open}\n      onOpenChange={onOpenChange}\n    >\n      <SingleComboboxControl\n        shape={shape}\n        controlProps={controlProps}\n        placeholder={placeholder}\n        selectedOption={selectedOption}\n        look={{ variant, size, showChevron, iconOnlyValue, className }}\n      />\n      <ComboboxOptionsContent\n        popupWidth={popupWidth}\n        showSearch={!inField}\n        searchPlaceholder={searchPlaceholder}\n        emptyText={emptyText}\n        align={align}\n        container={container}\n      />\n    </ComboboxRoot>\n  );\n}\n\nfunction MultipleCombobox({\n  shape,\n  controlProps,\n  options,\n  value = EMPTY_VALUES,\n  onValueChange,\n  clearLabel,\n  placeholder = 'Select options',\n  searchPlaceholder = 'Search',\n  emptyText = 'No option found.',\n  className,\n  disabled = false,\n  variant = 'default',\n  size = 'md',\n  open,\n  onOpenChange,\n  container,\n  align = 'start',\n  popupWidth,\n  showChevron = true,\n  iconOnlyValue = false,\n}: ComboboxMultipleProps & ShapeProps) {\n  const filter = useOptionFilter();\n  const selectedValues = new Set(value);\n  const selectedOptions = options.filter(option => selectedValues.has(option.value));\n  const footer =\n    clearLabel && selectedOptions.length > 0 ? (\n      <ComboboxClearFooter label={clearLabel} onClear={() => onValueChange?.([])} />\n    ) : undefined;\n\n  return (\n    <ComboboxRoot\n      multiple\n      autoHighlight\n      items={options}\n      filter={filter}\n      value={selectedOptions}\n      onValueChange={items => onValueChange?.(items.map(item => item.value))}\n      disabled={disabled}\n      open={open}\n      onOpenChange={onOpenChange}\n    >\n      <MultipleComboboxControl\n        shape={shape}\n        controlProps={controlProps}\n        placeholder={placeholder}\n        selectedCount={selectedOptions.length}\n        look={{ variant, size, showChevron, iconOnlyValue, className }}\n      />\n      <ComboboxOptionsContent\n        popupWidth={popupWidth}\n        showSearch={shape !== 'chips'}\n        searchPlaceholder={searchPlaceholder}\n        emptyText={emptyText}\n        align={align}\n        container={container}\n        footer={footer}\n      />\n    </ComboboxRoot>\n  );\n}\n\n/**\n * A searchable select driven by `options`, built on the Combobox parts.\n *\n * Inside a `Field`, a `default` combobox searches right in the field: a text field for a single value,\n * removable chips for `multiple`. Everywhere else (outside a `Field`, `ghost` and icon-size triggers,\n * custom non-text placeholders) it keeps a compact trigger with the search inside the popup. For anything\n * these props don't cover (groups, rich items), compose the parts directly (`ComboboxRoot`, ...).\n */\nexport function Combobox(props: ComboboxProps) {\n  const field = useFieldAriaIds();\n  const generatedName = React.useId();\n  const multiple = isMultipleCombobox(props);\n  const shape = getComboboxShape({\n    inFieldContext: Boolean(field),\n    multiple,\n    variant: props.variant ?? 'default',\n    size: props.size ?? 'md',\n    iconOnlyValue: props.iconOnlyValue ?? false,\n    showChevron: props.showChevron ?? true,\n    placeholder: props.placeholder,\n  });\n  const errorName = props.name ?? generatedName;\n  const controlProps = getControlProps({\n    id: props.id,\n    ariaLabel: props['aria-label'],\n    ariaDescribedBy: props['aria-describedby'],\n    hasLabel: Boolean(props.id || field),\n    multiple,\n    error: props.error,\n    errorName,\n  });\n\n  const root = isMultipleCombobox(props) ? (\n    <MultipleCombobox {...props} shape={shape} controlProps={controlProps} />\n  ) : (\n    <SingleCombobox {...props} shape={shape} controlProps={controlProps} />\n  );\n\n  if (!props.error) return root;\n\n  return (\n    <div className={comboboxStyles.root}>\n      {root}\n      <FieldBlock.ErrorMsg name={errorName}>{props.error}</FieldBlock.ErrorMsg>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/{combobox-D21no8t5.js → combobox-lbSxWRMl.js}

@@ -1,9 +1,9 @@
-import { t as cn } from "./utils-DQx8TpNT.js";
-import { deprecatedErrorAria } from "./primitives/form-element.es.js";
-import { s as isIconButtonSize, t as Button } from "./Button-CLXTbAY8.js";
+import { C as comboboxStyles, S as comboboxPopupWidthClass, _ as ComboboxRoot, b as ComboboxTrigger, g as ComboboxList, l as ComboboxInput, n as ComboboxChips, o as ComboboxContent, r as ComboboxChipsInput, s as ComboboxEmpty, t as ComboboxChip, u as ComboboxItem, v as ComboboxSearch, x as ComboboxValue } from "./combobox-parts-C9o4UfH_.js";
+import { s as isIconButtonSize, t as Button } from "./Button-Bi7aXd_G.js";
 import { n as keepOwnAccessibleName, r as useFieldAriaIds } from "./field-control-aria-BaRSUUMR.js";
-import { S as comboboxStyles, _ as ComboboxRoot, b as ComboboxTrigger, g as ComboboxList, l as ComboboxInput, n as ComboboxChips, o as ComboboxContent, r as ComboboxChipsInput, s as ComboboxEmpty, t as ComboboxChip, u as ComboboxItem, v as ComboboxSearch, x as ComboboxValue } from "./combobox-parts-D90ir0Py.js";
-import { n as FieldBlock, t as fieldErrorId } from "./field-error-id-DBSuJ3HM.js";
+import { n as FieldBlock, t as fieldErrorId } from "./field-error-id-6ZynvsRO.js";
+import { deprecatedErrorAria } from "./primitives/form-element.es.js";
+import { t as cn } from "./utils-DQx8TpNT.js";
 import * as React$1 from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { X } from "lucide-react";
@@ -71,17 +71,25 @@ function getControlProps({ id, ariaLabel, ariaDescribedBy, hasLabel, multiple, e
 function triggerClassName({ iconOnlyValue, className }) {
 	return cn(iconOnlyValue && "w-auto px-2.5", className);
 }
-function ComboboxOptionText({ option }) {
-	return /* @__PURE__ */ jsxs("span", {
-		className: comboboxStyles.optionText,
-		children: [/* @__PURE__ */ jsx("span", {
-			className: comboboxStyles.optionLabel,
-			children: option.label
-		}), option.description && /* @__PURE__ */ jsx("span", {
-			className: comboboxStyles.optionDescription,
-			children: option.description
-		})]
-	});
+/** An option row's content: start slot, label over description, end slot. */
+function ComboboxOptionContent({ option }) {
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		option.start,
+		/* @__PURE__ */ jsxs("span", {
+			className: comboboxStyles.optionText,
+			children: [/* @__PURE__ */ jsx("span", {
+				className: comboboxStyles.optionLabel,
+				children: option.label
+			}), option.description && /* @__PURE__ */ jsx("span", {
+				className: comboboxStyles.optionDescription,
+				children: option.description
+			})]
+		}),
+		option.end ? /* @__PURE__ */ jsx("span", {
+			className: comboboxStyles.optionEnd,
+			children: option.end
+		}) : null
+	] });
 }
 function ComboboxClearFooter({ label, onClear }) {
 	return /* @__PURE__ */ jsx("div", {
@@ -98,23 +106,17 @@ function ComboboxClearFooter({ label, onClear }) {
 	});
 }
 /** The popup: the search row for a compact trigger (a field searches in itself), then the options. */
-function ComboboxOptionsContent({ showSearch, searchPlaceholder, emptyText, align, container, footer }) {
+function ComboboxOptionsContent({ popupWidth, showSearch, searchPlaceholder, emptyText, align, container, footer }) {
 	return /* @__PURE__ */ jsxs(ComboboxContent, {
 		align,
 		container,
+		className: popupWidth && comboboxPopupWidthClass[popupWidth],
 		children: [
 			showSearch ? /* @__PURE__ */ jsx(ComboboxSearch, { placeholder: searchPlaceholder }) : null,
 			/* @__PURE__ */ jsx(ComboboxEmpty, { children: emptyText }),
-			/* @__PURE__ */ jsx(ComboboxList, { children: (option) => /* @__PURE__ */ jsxs(ComboboxItem, {
+			/* @__PURE__ */ jsx(ComboboxList, { children: (option) => /* @__PURE__ */ jsx(ComboboxItem, {
 				value: option,
-				children: [
-					option.start,
-					/* @__PURE__ */ jsx(ComboboxOptionText, { option }),
-					option.end ? /* @__PURE__ */ jsx("span", {
-						className: comboboxStyles.optionEnd,
-						children: option.end
-					}) : null
-				]
+				children: /* @__PURE__ */ jsx(ComboboxOptionContent, { option })
 			}, option.value) }),
 			footer
 		]
@@ -159,7 +161,7 @@ function MultipleComboboxControl({ shape, controlProps, placeholder, selectedCou
 		})
 	});
 }
-function SingleCombobox({ shape, controlProps, options, value, onValueChange, placeholder = "Select option", searchPlaceholder = "Search", emptyText = "No option found.", className, disabled = false, variant = "default", size = "md", open, onOpenChange, container, align = "start", showChevron = true, iconOnlyValue = false, allowCustomValue = false, onInputValueChange }) {
+function SingleCombobox({ shape, controlProps, options, value, onValueChange, placeholder = "Select option", searchPlaceholder = "Search", emptyText = "No option found.", className, disabled = false, variant = "default", size = "md", open, onOpenChange, container, align = "start", popupWidth, showChevron = true, iconOnlyValue = false, allowCustomValue = false, onInputValueChange }) {
 	const [inputValue, setInputValue] = React$1.useState("");
 	const filter = useOptionFilter();
 	const inField = shape === "field";
@@ -200,6 +202,7 @@ function SingleCombobox({ shape, controlProps, options, value, onValueChange, pl
 				className
 			}
 		}), /* @__PURE__ */ jsx(ComboboxOptionsContent, {
+			popupWidth,
 			showSearch: !inField,
 			searchPlaceholder,
 			emptyText,
@@ -208,7 +211,7 @@ function SingleCombobox({ shape, controlProps, options, value, onValueChange, pl
 		})]
 	});
 }
-function MultipleCombobox({ shape, controlProps, options, value = EMPTY_VALUES, onValueChange, clearLabel, placeholder = "Select options", searchPlaceholder = "Search", emptyText = "No option found.", className, disabled = false, variant = "default", size = "md", open, onOpenChange, container, align = "start", showChevron = true, iconOnlyValue = false }) {
+function MultipleCombobox({ shape, controlProps, options, value = EMPTY_VALUES, onValueChange, clearLabel, placeholder = "Select options", searchPlaceholder = "Search", emptyText = "No option found.", className, disabled = false, variant = "default", size = "md", open, onOpenChange, container, align = "start", popupWidth, showChevron = true, iconOnlyValue = false }) {
 	const filter = useOptionFilter();
 	const selectedValues = new Set(value);
 	const selectedOptions = options.filter((option) => selectedValues.has(option.value));
@@ -239,6 +242,7 @@ function MultipleCombobox({ shape, controlProps, options, value = EMPTY_VALUES,
 				className
 			}
 		}), /* @__PURE__ */ jsx(ComboboxOptionsContent, {
+			popupWidth,
 			showSearch: shape !== "chips",
 			searchPlaceholder,
 			emptyText,
@@ -299,4 +303,4 @@ function Combobox$1(props) {
 }
 export { Combobox$1 as t };
 
-//# sourceMappingURL=combobox-D21no8t5.js.map
+//# sourceMappingURL=combobox-lbSxWRMl.js.map

package/dist/combobox-lbSxWRMl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox-lbSxWRMl.js","names":["BaseCombobox","_Fragment","React","Combobox"],"sources":["../src/ds/components/Combobox/combobox.tsx"],"sourcesContent":["import { Combobox as BaseCombobox } from '@base-ui/react/combobox';\nimport { X } from 'lucide-react';\nimport * as React from 'react';\nimport {\n  ComboboxChip,\n  ComboboxChips,\n  ComboboxChipsInput,\n  ComboboxContent,\n  ComboboxEmpty,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxList,\n  ComboboxRoot,\n  ComboboxSearch,\n  ComboboxTrigger,\n  ComboboxValue,\n} from './combobox-parts';\nimport { comboboxPopupWidthClass, comboboxStyles } from './combobox-styles';\nimport type { ComboboxPopupWidth, ComboboxVariant } from './combobox-styles';\nimport { Button, isIconButtonSize } from '@/ds/components/Button/Button';\nimport type { ButtonSize } from '@/ds/components/Button/Button';\nimport { keepOwnAccessibleName, useFieldAriaIds } from '@/ds/components/Field/field-control-aria';\nimport { FieldBlock } from '@/ds/components/FormFieldBlocks/block/field-block';\nimport { fieldErrorId } from '@/ds/components/FormFieldBlocks/block/field-error-id';\nimport { deprecatedErrorAria } from '@/ds/primitives/form-element';\nimport type { PortalContainer } from '@/ds/primitives/portal-container';\nimport { cn } from '@/lib/utils';\n\nexport type { ComboboxPopupWidth, ComboboxVariant } from './combobox-styles';\n\nexport type ComboboxOption = {\n  label: string;\n  value: string;\n  description?: string;\n  displayLabel?: React.ReactNode;\n  start?: React.ReactNode;\n  end?: React.ReactNode;\n  /** Extra terms the search matches besides `label` (aliases, ids, a provider name). Never displayed. */\n  keywords?: readonly string[];\n};\n\ntype ComboboxSharedProps = {\n  options: ComboboxOption[];\n  placeholder?: React.ReactNode;\n  /** The search row's placeholder for compact triggers. A field (inside a `Field`) searches in itself and shows `placeholder`. */\n  searchPlaceholder?: string;\n  emptyText?: string;\n  className?: string;\n  disabled?: boolean;\n  /**\n   * `default` inside a `Field` is a form field you type in to search. `ghost` (and the legacy `outline`/`link`),\n   * or any variant outside a `Field`, is a compact trigger with the search inside the popup.\n   */\n  variant?: ComboboxVariant;\n  /** Icon sizes (`icon-*`) render a chevron-only trigger with the search in the popup; pass `aria-label` to name it. */\n  size?: ButtonSize;\n  open?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  container?: PortalContainer;\n  id?: string;\n  'aria-label'?: string;\n  'aria-describedby'?: string;\n  /** Which edge of the trigger the popup lines up with. `end` opens it leftwards (e.g. an icon trigger at the end of a row). */\n  align?: 'start' | 'center' | 'end';\n  /** A fixed popup width for long options (e.g. model ids). Without it the popup takes the trigger's width, at least 11rem. */\n  popupWidth?: ComboboxPopupWidth;\n  showChevron?: boolean;\n  iconOnlyValue?: boolean;\n  allowCustomValue?: boolean;\n  /** Called with the search text as it changes (and with `''` after a compact trigger's selection resets it). */\n  onInputValueChange?: (value: string) => void;\n  /** @deprecated Wrap the combobox in `<Field invalid>` with a `FieldError`. */\n  error?: string;\n  /** @deprecated Only keyed the `error` message id; a `Field` links its error without one. */\n  name?: string;\n};\n\nexport type ComboboxSingleProps = ComboboxSharedProps & {\n  multiple?: false;\n  value?: string;\n  onValueChange?: (value: string) => void;\n};\n\nexport type ComboboxMultipleProps = ComboboxSharedProps & {\n  multiple: true;\n  value?: readonly string[];\n  onValueChange?: (value: string[]) => void;\n  clearLabel?: string;\n};\n\nexport type ComboboxProps = ComboboxSingleProps | ComboboxMultipleProps;\n\nconst EMPTY_VALUES: readonly string[] = [];\n\nfunction isMultipleCombobox(props: ComboboxProps): props is ComboboxMultipleProps {\n  return props.multiple === true;\n}\n\n/** The text a field shows for its value: a plain-text `displayLabel` wins over `label`. */\nfunction optionText(option: ComboboxOption) {\n  return typeof option.displayLabel === 'string' ? option.displayLabel : option.label;\n}\n\n/** Inputs take a text placeholder only; a ReactNode placeholder keeps the compact trigger. */\nfunction textPlaceholder(placeholder: React.ReactNode) {\n  return typeof placeholder === 'string' ? placeholder : undefined;\n}\n\n/**\n * How the combobox renders:\n * - `field`: a single select inside a `Field` searches in the field, like a text input.\n * - `chips`: a multiple select inside a `Field` shows its picks as chips and searches in the field.\n * - `trigger`: everything else (toolbars, breadcrumbs, inline pickers that callers lay out as a button)\n *   keeps a compact trigger with the search inside the popup.\n */\ntype ComboboxShape = 'field' | 'chips' | 'trigger';\n\nfunction getComboboxShape({\n  inFieldContext,\n  multiple,\n  variant,\n  size,\n  iconOnlyValue,\n  showChevron,\n  placeholder,\n}: {\n  inFieldContext: boolean;\n  multiple: boolean;\n  variant: ComboboxVariant;\n  size: ButtonSize;\n  iconOnlyValue: boolean;\n  showChevron: boolean;\n  placeholder: React.ReactNode;\n}): ComboboxShape {\n  if (!inFieldContext) return 'trigger';\n  if (variant !== 'default') return 'trigger';\n  if (isIconButtonSize(size)) return 'trigger';\n  if (iconOnlyValue || !showChevron) return 'trigger';\n  if (placeholder !== undefined && textPlaceholder(placeholder) === undefined) return 'trigger';\n  if (!multiple) return 'field';\n  // The chips field is tuned to the medium control height.\n  if (size !== 'md') return 'trigger';\n  return 'chips';\n}\n\n/** A \"Use “text”\" option for typed text that isn't one of the options yet. */\nfunction getCustomOption(options: ComboboxOption[], inputValue: string): ComboboxOption | undefined {\n  const value = inputValue.trim();\n  if (!value) return undefined;\n  // A field shows the selected option's text while it's closed; that isn't a new value.\n  if (options.some(option => option.value === value || optionText(option) === value)) return undefined;\n  return { label: `Use “${value}”`, value };\n}\n\n/** Matches the label like Base UI's default filter, the text a field shows, and any keywords. */\nfunction useOptionFilter() {\n  const { contains } = BaseCombobox.useFilter();\n  return (option: ComboboxOption, query: string) =>\n    [option.label, optionText(option), ...(option.keywords ?? [])].some(text => contains(text, query));\n}\n\n/** Names the control when nothing else does: an `id` or a `Field` links a label to it instead. */\nfunction getFallbackAriaLabel({ hasLabel, multiple }: { hasLabel: boolean; multiple: boolean }) {\n  if (hasLabel) return undefined;\n  return multiple ? 'Select options' : 'Select option';\n}\n\nfunction getControlProps({\n  id,\n  ariaLabel,\n  ariaDescribedBy,\n  hasLabel,\n  multiple,\n  error,\n  errorName,\n}: {\n  id?: string;\n  ariaLabel?: string;\n  ariaDescribedBy?: string;\n  hasLabel: boolean;\n  multiple: boolean;\n  error?: string;\n  errorName: string;\n}) {\n  const describedBy = [ariaDescribedBy, error ? fieldErrorId(errorName) : undefined].filter(Boolean).join(' ');\n  return {\n    id,\n    'aria-label': ariaLabel ?? getFallbackAriaLabel({ hasLabel, multiple }),\n    ...keepOwnAccessibleName({ 'aria-label': ariaLabel }),\n    ...deprecatedErrorAria(Boolean(error)),\n    'aria-describedby': describedBy || undefined,\n  };\n}\n\ntype ControlProps = ReturnType<typeof getControlProps>;\n\nfunction triggerClassName({ iconOnlyValue, className }: { iconOnlyValue: boolean; className?: string }) {\n  return cn(iconOnlyValue && 'w-auto px-2.5', className);\n}\n\n/** An option row's content: start slot, label over description, end slot. */\nfunction ComboboxOptionContent({ option }: { option: ComboboxOption }) {\n  return (\n    <>\n      {option.start}\n      <span className={comboboxStyles.optionText}>\n        <span className={comboboxStyles.optionLabel}>{option.label}</span>\n        {option.description && <span className={comboboxStyles.optionDescription}>{option.description}</span>}\n      </span>\n      {option.end ? <span className={comboboxStyles.optionEnd}>{option.end}</span> : null}\n    </>\n  );\n}\n\nfunction ComboboxClearFooter({ label, onClear }: { label: string; onClear: () => void }) {\n  return (\n    <div className=\"border-t border-border p-1\">\n      <Button\n        type=\"button\"\n        variant=\"destructive-ghost\"\n        size=\"sm\"\n        className=\"w-full justify-start\"\n        onClick={onClear}\n        icon={<X />}\n      >\n        {label}\n      </Button>\n    </div>\n  );\n}\n\n/** The popup: the search row for a compact trigger (a field searches in itself), then the options. */\nfunction ComboboxOptionsContent({\n  popupWidth,\n  showSearch,\n  searchPlaceholder,\n  emptyText,\n  align,\n  container,\n  footer,\n}: {\n  popupWidth?: ComboboxPopupWidth;\n  showSearch: boolean;\n  searchPlaceholder: string;\n  emptyText: string;\n  align: 'start' | 'center' | 'end';\n  container?: PortalContainer;\n  footer?: React.ReactNode;\n}) {\n  return (\n    <ComboboxContent align={align} container={container} className={popupWidth && comboboxPopupWidthClass[popupWidth]}>\n      {showSearch ? <ComboboxSearch placeholder={searchPlaceholder} /> : null}\n      <ComboboxEmpty>{emptyText}</ComboboxEmpty>\n      <ComboboxList>\n        {(option: ComboboxOption) => (\n          <ComboboxItem key={option.value} value={option}>\n            <ComboboxOptionContent option={option} />\n          </ComboboxItem>\n        )}\n      </ComboboxList>\n      {footer}\n    </ComboboxContent>\n  );\n}\n\ntype TriggerLookProps = {\n  variant: ComboboxVariant;\n  size: ButtonSize;\n  showChevron: boolean;\n  iconOnlyValue: boolean;\n  className?: string;\n};\n\nfunction SingleComboboxControl({\n  shape,\n  controlProps,\n  placeholder,\n  selectedOption,\n  look,\n}: {\n  shape: ComboboxShape;\n  controlProps: ControlProps;\n  placeholder: React.ReactNode;\n  selectedOption?: ComboboxOption;\n  look: TriggerLookProps;\n}) {\n  if (shape === 'field') {\n    return (\n      <ComboboxInput\n        {...controlProps}\n        size={isIconButtonSize(look.size) ? undefined : look.size}\n        placeholder={textPlaceholder(placeholder)}\n        start={selectedOption?.start}\n        className={look.className}\n      />\n    );\n  }\n\n  return (\n    <ComboboxTrigger\n      {...controlProps}\n      variant={look.variant}\n      size={look.size}\n      showChevron={look.showChevron}\n      icon={isIconButtonSize(look.size) ? undefined : selectedOption?.start}\n      className={triggerClassName(look)}\n    >\n      {selectedOption?.displayLabel ?? <ComboboxValue placeholder={placeholder} />}\n    </ComboboxTrigger>\n  );\n}\n\nfunction MultipleComboboxControl({\n  shape,\n  controlProps,\n  placeholder,\n  selectedCount,\n  look,\n}: {\n  shape: ComboboxShape;\n  controlProps: ControlProps;\n  placeholder: React.ReactNode;\n  selectedCount: number;\n  look: TriggerLookProps;\n}) {\n  if (shape === 'chips') {\n    return (\n      <ComboboxChips className={look.className}>\n        <ComboboxValue>\n          {(items: ComboboxOption[]) => (\n            <>\n              {items.map(item => (\n                <ComboboxChip key={item.value}>{item.label}</ComboboxChip>\n              ))}\n              <ComboboxChipsInput\n                {...controlProps}\n                placeholder={items.length === 0 ? textPlaceholder(placeholder) : undefined}\n              />\n            </>\n          )}\n        </ComboboxValue>\n      </ComboboxChips>\n    );\n  }\n\n  const text = selectedCount === 0 ? placeholder : `${selectedCount} selected`;\n  return (\n    <ComboboxTrigger\n      {...controlProps}\n      variant={look.variant}\n      size={look.size}\n      showChevron={look.showChevron}\n      className={triggerClassName(look)}\n    >\n      <span className={cn(selectedCount === 0 && comboboxStyles.placeholder)}>{text}</span>\n    </ComboboxTrigger>\n  );\n}\n\ntype ShapeProps = { shape: ComboboxShape; controlProps: ControlProps };\n\nfunction SingleCombobox({\n  shape,\n  controlProps,\n  options,\n  value,\n  onValueChange,\n  placeholder = 'Select option',\n  searchPlaceholder = 'Search',\n  emptyText = 'No option found.',\n  className,\n  disabled = false,\n  variant = 'default',\n  size = 'md',\n  open,\n  onOpenChange,\n  container,\n  align = 'start',\n  popupWidth,\n  showChevron = true,\n  iconOnlyValue = false,\n  allowCustomValue = false,\n  onInputValueChange,\n}: ComboboxSingleProps & ShapeProps) {\n  // The search text: a field's own text, or the compact trigger's popup search.\n  const [inputValue, setInputValue] = React.useState('');\n  const filter = useOptionFilter();\n  const inField = shape === 'field';\n  const selectedOption = options.find(option => option.value === value);\n  const customOption = allowCustomValue ? getCustomOption(options, inputValue) : undefined;\n  const items = customOption ? [customOption, ...options] : options;\n\n  function handleInputValueChange(next: string) {\n    setInputValue(next);\n    onInputValueChange?.(next);\n  }\n\n  function handleValueChange(item: ComboboxOption | null) {\n    if (!item) return;\n    onValueChange?.(item.value);\n    // A field shows the picked option; a compact trigger's popup search starts empty next time.\n    if (!inField) handleInputValueChange('');\n  }\n\n  return (\n    <ComboboxRoot\n      autoHighlight\n      items={items}\n      filter={filter}\n      itemToStringLabel={optionText}\n      // Base UI's \"nothing selected\" is null.\n      value={selectedOption ?? null}\n      // A field owns its text (the selected option's, or the search); a compact trigger's search is reset here.\n      inputValue={inField ? undefined : inputValue}\n      onInputValueChange={handleInputValueChange}\n      onValueChange={handleValueChange}\n      disabled={disabled}\n      open={open}\n      onOpenChange={onOpenChange}\n    >\n      <SingleComboboxControl\n        shape={shape}\n        controlProps={controlProps}\n        placeholder={placeholder}\n        selectedOption={selectedOption}\n        look={{ variant, size, showChevron, iconOnlyValue, className }}\n      />\n      <ComboboxOptionsContent\n        popupWidth={popupWidth}\n        showSearch={!inField}\n        searchPlaceholder={searchPlaceholder}\n        emptyText={emptyText}\n        align={align}\n        container={container}\n      />\n    </ComboboxRoot>\n  );\n}\n\nfunction MultipleCombobox({\n  shape,\n  controlProps,\n  options,\n  value = EMPTY_VALUES,\n  onValueChange,\n  clearLabel,\n  placeholder = 'Select options',\n  searchPlaceholder = 'Search',\n  emptyText = 'No option found.',\n  className,\n  disabled = false,\n  variant = 'default',\n  size = 'md',\n  open,\n  onOpenChange,\n  container,\n  align = 'start',\n  popupWidth,\n  showChevron = true,\n  iconOnlyValue = false,\n}: ComboboxMultipleProps & ShapeProps) {\n  const filter = useOptionFilter();\n  const selectedValues = new Set(value);\n  const selectedOptions = options.filter(option => selectedValues.has(option.value));\n  const footer =\n    clearLabel && selectedOptions.length > 0 ? (\n      <ComboboxClearFooter label={clearLabel} onClear={() => onValueChange?.([])} />\n    ) : undefined;\n\n  return (\n    <ComboboxRoot\n      multiple\n      autoHighlight\n      items={options}\n      filter={filter}\n      value={selectedOptions}\n      onValueChange={items => onValueChange?.(items.map(item => item.value))}\n      disabled={disabled}\n      open={open}\n      onOpenChange={onOpenChange}\n    >\n      <MultipleComboboxControl\n        shape={shape}\n        controlProps={controlProps}\n        placeholder={placeholder}\n        selectedCount={selectedOptions.length}\n        look={{ variant, size, showChevron, iconOnlyValue, className }}\n      />\n      <ComboboxOptionsContent\n        popupWidth={popupWidth}\n        showSearch={shape !== 'chips'}\n        searchPlaceholder={searchPlaceholder}\n        emptyText={emptyText}\n        align={align}\n        container={container}\n        footer={footer}\n      />\n    </ComboboxRoot>\n  );\n}\n\n/**\n * A searchable select driven by `options`, built on the Combobox parts.\n *\n * Inside a `Field`, a `default` combobox searches right in the field: a text field for a single value,\n * removable chips for `multiple`. Everywhere else (outside a `Field`, `ghost` and icon-size triggers,\n * custom non-text placeholders) it keeps a compact trigger with the search inside the popup. For anything\n * these props don't cover (groups, rich items), compose the parts directly (`ComboboxRoot`, ...).\n */\nexport function Combobox(props: ComboboxProps) {\n  const field = useFieldAriaIds();\n  const generatedName = React.useId();\n  const multiple = isMultipleCombobox(props);\n  const shape = getComboboxShape({\n    inFieldContext: Boolean(field),\n    multiple,\n    variant: props.variant ?? 'default',\n    size: props.size ?? 'md',\n    iconOnlyValue: props.iconOnlyValue ?? false,\n    showChevron: props.showChevron ?? true,\n    placeholder: props.placeholder,\n  });\n  const errorName = props.name ?? generatedName;\n  const controlProps = getControlProps({\n    id: props.id,\n    ariaLabel: props['aria-label'],\n    ariaDescribedBy: props['aria-describedby'],\n    hasLabel: Boolean(props.id || field),\n    multiple,\n    error: props.error,\n    errorName,\n  });\n\n  const root = isMultipleCombobox(props) ? (\n    <MultipleCombobox {...props} shape={shape} controlProps={controlProps} />\n  ) : (\n    <SingleCombobox {...props} shape={shape} controlProps={controlProps} />\n  );\n\n  if (!props.error) return root;\n\n  return (\n    <div className={comboboxStyles.root}>\n      {root}\n      <FieldBlock.ErrorMsg name={errorName}>{props.error}</FieldBlock.ErrorMsg>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/{combobox-parts-C4phOq4t.cjs → combobox-parts-BeNqgCbj.cjs}

@@ -1,15 +1,15 @@
 const require_rolldown_runtime = require("./rolldown-runtime-CmQyd0Gu.cjs");
-const require_utils = require("./utils-uDc1ofX1.cjs");
 const require_dist = require("./dist-ClDKPtVq.cjs");
-const require_primitives_floating = require("./primitives/floating.cjs.js");
+const require_Button = require("./Button-BfICfyxD.cjs");
 const require_primitives_control_size = require("./primitives/control-size.cjs.js");
 const require_primitives_form_element = require("./primitives/form-element.cjs.js");
-const require_Button = require("./Button-DLcMcuUL.cjs");
 const require_primitives_menu_item = require("./primitives/menu-item.cjs.js");
-const require_scroll_area = require("./scroll-area-BP4gPZ4G.cjs");
-const require_primitives_portal_container = require("./primitives/portal-container.cjs.js");
+const require_utils = require("./utils-uDc1ofX1.cjs");
+const require_scroll_area = require("./scroll-area-BU_TorPW.cjs");
+const require_primitives_floating = require("./primitives/floating.cjs.js");
 const require_primitives_password_manager_autofill = require("./primitives/password-manager-autofill.cjs.js");
 const require_primitives_popup_anchor = require("./primitives/popup-anchor.cjs.js");
+const require_primitives_portal_container = require("./primitives/portal-container.cjs.js");
 let react = require("react");
 react = require_rolldown_runtime.__toESM(react, 1);
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -41,6 +41,12 @@ var comboboxItemClass = require_dist.cva(require_primitives_menu_item.menuItemCl
 	} },
 	defaultVariants: { multiple: false }
 });
+var comboboxPopupWidthClass = {
+	sm: "w-48",
+	md: "w-64",
+	lg: "w-80",
+	xl: "w-96"
+};
 var comboboxStyles = {
 	/** @deprecated A `Field` lays out the combobox and its error. */
 	root: "flex flex-col gap-1.5",
@@ -68,6 +74,8 @@ var comboboxStyles = {
 	listScroller: "max-h-dropdown overflow-y-auto overflow-x-hidden",
 	/** Option item base — rounded-lg sits concentrically inside rounded-xl + p-1. */
 	item: comboboxItemClass({ multiple: false }),
+	/** An item's content beside its check: start slot, text, end slot. */
+	itemContent: "flex min-w-0 flex-1 items-center gap-2",
 	/** Multi-select item — same item rhythm with a right-aligned selected check. */
 	itemMulti: comboboxItemClass({ multiple: true }),
 	/** Right-aligned slot grouping end content + selection check. */
@@ -78,10 +86,10 @@ var comboboxStyles = {
 	checkIcon: "size-full",
 	/** Option label/description wrapper */
 	optionText: "flex flex-col gap-0.5 min-w-0",
-	/** Option label */
-	optionLabel: "truncate",
-	/** Option description */
-	optionDescription: "text-caption text-muted-foreground truncate",
+	/** Option label: wraps (ids break anywhere) and clamps at two lines, so a long label stays readable without growing the row. */
+	optionLabel: "line-clamp-2 whitespace-normal wrap-anywhere",
+	/** Option description: same two-line clamp as the label. */
+	optionDescription: "text-caption text-muted-foreground line-clamp-2 whitespace-normal wrap-anywhere",
 	/** Option end slot — `ml-auto` makes it push right inside flex containers (used by multi-select). */
 	optionEnd: "ml-auto flex items-center shrink-0",
 	/** @deprecated A `FieldError` colors the error. */
@@ -241,7 +249,8 @@ function ComboboxSearch({ className, ...props }) {
 /**
 * The popup. Under a field (ComboboxInput or ComboboxChips) it opens at the field's width; under a
 * compact ComboboxTrigger it takes the trigger's width, at least 11rem. Either way the width never
-* follows the filtered items, so it holds still while you type; long labels truncate.
+* follows the filtered items, so it holds still while you type. (`Combobox`'s `popupWidth` picks a
+* fixed, wider width for long options instead.)
 */
 function ComboboxContent({ className, side = "bottom", sideOffset = 4, align = "start", alignOffset = 0, anchor, container, ...props }) {
 	const popupAnchor = require_primitives_popup_anchor.usePopupAnchor();
@@ -286,7 +295,7 @@ function ComboboxItem({ className, children, ref, ...props }) {
 		className: require_utils.cn(comboboxItemClass({}), className),
 		...props,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-			className: "flex min-w-0 flex-1 items-center gap-2",
+			className: comboboxStyles.itemContent,
 			children
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 			className: comboboxStyles.checkContainer,
@@ -551,6 +560,12 @@ Object.defineProperty(exports, "ComboboxValue", {
 		return ComboboxValue;
 	}
 });
+Object.defineProperty(exports, "comboboxPopupWidthClass", {
+	enumerable: true,
+	get: function() {
+		return comboboxPopupWidthClass;
+	}
+});
 Object.defineProperty(exports, "comboboxStyles", {
 	enumerable: true,
 	get: function() {
@@ -564,4 +579,4 @@ Object.defineProperty(exports, "comboboxTriggerClass", {
 	}
 });
 
-//# sourceMappingURL=combobox-parts-C4phOq4t.cjs.map
+//# sourceMappingURL=combobox-parts-BeNqgCbj.cjs.map

package/dist/combobox-parts-BeNqgCbj.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox-parts-BeNqgCbj.cjs","names":["cn","buttonVariants","isIconButtonSize","controlTriggerOpenState","fieldTriggerErrorBorder","cva","menuItemClass","menuPopupClass","menuPositionerClass","menuSearchClasses","menuEmptyClass","menuItemCheckClass","BaseCombobox","cn","ChevronDown","isIconButtonSize","_Fragment","ButtonIcon","ButtonChevron","X","passwordManagerOptOutProps","Search","usePopupAnchor","usePortalContainer","FLOATING_POSITION_METHOD","ScrollArea","ScrollAreaViewport","Check","menuLabelClass","menuSeparatorClass","React"],"sources":["../src/ds/components/Combobox/combobox-styles.ts","../src/ds/components/Combobox/combobox-parts.tsx"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { buttonVariants, isIconButtonSize } from '../Button/Button';\nimport type { ButtonSize } from '../Button/Button';\nimport { controlTriggerOpenState } from '@/ds/primitives/control-size';\nimport type { ControlTriggerVisualVariant } from '@/ds/primitives/control-size';\nimport { fieldTriggerErrorBorder, fieldTriggerStyle, fieldTriggerWidthStyle } from '@/ds/primitives/form-element';\nimport {\n  menuItemCheckClass,\n  menuItemClass,\n  menuPopupClass,\n  menuPositionerClass,\n  menuSearchClasses,\n  menuEmptyClass,\n} from '@/ds/primitives/menu-item';\nimport { cn } from '@/lib/utils';\n\n/**\n * A combobox is a form field, so it reuses the Button's size/shape recipe,\n * mirroring `SelectTrigger`: `default` (the Input's overlay surface — the\n * default here too) and `ghost` (borderless, for breadcrumbs/inline pickers). Only the high-emphasis `primary`\n * look is intentionally NOT offered (a field is not a call-to-action).\n */\nexport type ComboboxVisualVariant = ControlTriggerVisualVariant;\nexport type ComboboxLegacyVariant = 'link';\nexport type ComboboxVariant = ComboboxVisualVariant | ComboboxLegacyVariant;\n\nfunction normalizeComboboxVariant(variant: ComboboxVariant): ComboboxVisualVariant {\n  return variant === 'link' ? 'ghost' : variant;\n}\n\n/**\n * Single source of truth for both the single- and multi-select combobox\n * triggers. A combobox = a button + a trailing chevron, so it reuses the Button\n * recipe (variant colors, size = height/text/padding/radius, unified border\n * focus, disabled) and layers only the combobox-specific extras — exactly like\n * `SelectTrigger`.\n */\nexport function comboboxTriggerClass({\n  variant,\n  size,\n  className,\n}: {\n  variant: ComboboxVariant;\n  size: ButtonSize;\n  className?: string;\n}): string {\n  const visualVariant = normalizeComboboxVariant(variant);\n\n  return cn(\n    buttonVariants({ variant: visualVariant, size }),\n    visualVariant === 'default' && fieldTriggerStyle,\n    // Fill the field and push the value left / chevron right (Button's base\n    // centers its content with `justify-center`). Icon sizes are a fixed square\n    // showing only the chevron, so they keep Button's centering.\n    !isIconButtonSize(size) && cn(fieldTriggerWidthStyle, 'justify-between'),\n    // Read as \"active\" while the popup is open, per variant (see map above).\n    controlTriggerOpenState[visualVariant],\n    'data-[placeholder]:text-muted-foreground',\n    fieldTriggerErrorBorder,\n    className,\n  );\n}\n\n/** Options are shared menu items, which already grow to fit a second line. */\nexport const comboboxItemClass = cva(menuItemClass, {\n  variants: {\n    multiple: {\n      false: '',\n      true: '',\n    },\n  },\n  defaultVariants: {\n    multiple: false,\n  },\n});\n\n/** Fixed popup widths a call site can pick; without one the popup takes the trigger's width. Never narrower than the trigger or wider than the screen. */\nexport type ComboboxPopupWidth = 'sm' | 'md' | 'lg' | 'xl';\n\nexport const comboboxPopupWidthClass: Record<ComboboxPopupWidth, string> = {\n  sm: 'w-48',\n  md: 'w-64',\n  lg: 'w-80',\n  xl: 'w-96',\n};\n\nexport const comboboxStyles = {\n  /** @deprecated A `Field` lays out the combobox and its error. */\n  root: 'flex flex-col gap-1.5',\n\n  /** Chevron icon in trigger — decorative icon token shared by every field. */\n\n  /** Placeholder text color */\n  placeholder: 'text-muted-foreground',\n\n  /**\n   * Popup container — shared menu popup, but the search row sits edge-to-edge\n   * above the list, so padding/scrolling move to the list itself.\n   */\n  popup: cn(menuPopupClass, 'max-h-none overflow-hidden p-0'),\n\n  /** Positioner */\n  positioner: cn(menuPositionerClass, 'pointer-events-auto'),\n\n  /** Search input container — borderless top section, hairline divider below. */\n  searchContainer: menuSearchClasses.container,\n\n  /** Search icon */\n  searchIcon: menuSearchClasses.icon,\n\n  /** Search input */\n  searchInput: cn(menuSearchClasses.input, 'disabled:cursor-not-allowed disabled:opacity-50'),\n\n  /** Empty state */\n  empty: cn(menuEmptyClass, 'empty:hidden'),\n\n  /** Options list */\n  // `empty:p-0` — Empty renders outside the List, so an empty List must not leave its padding behind.\n  list: 'p-1 empty:p-0',\n\n  /** Scroll container around the List. */\n  listScroller: 'max-h-dropdown overflow-y-auto overflow-x-hidden',\n\n  /** Option item base — rounded-lg sits concentrically inside rounded-xl + p-1. */\n  item: comboboxItemClass({ multiple: false }),\n\n  /** An item's content beside its check: start slot, text, end slot. */\n  itemContent: 'flex min-w-0 flex-1 items-center gap-2',\n\n  /** Multi-select item — same item rhythm with a right-aligned selected check. */\n  itemMulti: comboboxItemClass({ multiple: true }),\n\n  /** Right-aligned slot grouping end content + selection check. */\n  itemRightSlot: 'ml-auto flex items-center gap-2 shrink-0',\n\n  /** Check indicator container — inline, shown only when item is selected. */\n  checkContainer: cn(menuItemCheckClass, 'ml-0'),\n\n  /** Check icon (single select) */\n  checkIcon: 'size-full',\n\n  /** Option label/description wrapper */\n  optionText: 'flex flex-col gap-0.5 min-w-0',\n\n  /** Option label: wraps (ids break anywhere) and clamps at two lines, so a long label stays readable without growing the row. */\n  optionLabel: 'line-clamp-2 whitespace-normal wrap-anywhere',\n\n  /** Option description: same two-line clamp as the label. */\n  optionDescription: 'text-caption text-muted-foreground line-clamp-2 whitespace-normal wrap-anywhere',\n\n  /** Option end slot — `ml-auto` makes it push right inside flex containers (used by multi-select). */\n  optionEnd: 'ml-auto flex items-center shrink-0',\n\n  /** @deprecated A `FieldError` colors the error. */\n  error: 'text-body-sm text-destructive-foreground',\n} as const;\n","// Composable Combobox parts: shadcn's structure and names (https://ui.shadcn.com/docs/components/combobox),\n// built on Base UI like theirs, styled with our design system. The root is `ComboboxRoot` because\n// `Combobox` is the options-driven component in combobox.tsx.\nimport { Combobox as BaseCombobox } from '@base-ui/react/combobox';\nimport { Check, ChevronDown, Search, X } from 'lucide-react';\nimport * as React from 'react';\nimport { comboboxItemClass, comboboxStyles, comboboxTriggerClass } from './combobox-styles';\nimport type { ComboboxVariant } from './combobox-styles';\nimport { ButtonChevron, ButtonIcon, isIconButtonSize } from '@/ds/components/Button/Button';\nimport type { ButtonSize, TextButtonSize } from '@/ds/components/Button/Button';\nimport { ScrollArea, ScrollAreaViewport } from '@/ds/components/ScrollArea';\nimport { FLOATING_POSITION_METHOD } from '@/ds/primitives/floating';\nimport { menuLabelClass, menuSeparatorClass } from '@/ds/primitives/menu-item';\nimport { passwordManagerOptOutProps } from '@/ds/primitives/password-manager-autofill';\nimport { usePopupAnchor } from '@/ds/primitives/popup-anchor';\nimport { usePortalContainer } from '@/ds/primitives/portal-container';\nimport type { PortalContainer } from '@/ds/primitives/portal-container';\nimport { cn } from '@/lib/utils';\n\n/**\n * Root. Same props as Base UI's `Combobox.Root` (`items`, `value`, `onValueChange`, `multiple`,\n * `autoHighlight`, `filter`, ...). Pick one of three shapes:\n * - Search in the field: `ComboboxInput` + `ComboboxContent`.\n * - Multiple, chips in the field: `ComboboxChips` (chips + `ComboboxChipsInput`) + `ComboboxContent`.\n * - Compact trigger, search in the popup: `ComboboxTrigger` + `ComboboxContent` starting with\n *   `ComboboxSearch`. For small triggers (an icon, a ghost button in a toolbar).\n */\nfunction ComboboxRoot<Value, Multiple extends boolean | undefined = false>(\n  props: BaseCombobox.Root.Props<Value, Multiple>,\n) {\n  return <BaseCombobox.Root {...props} />;\n}\n\n/**\n * The field surface: today's trigger look, focus shown while the input inside has focus. The\n * chevron ends every field, at the same padding as today's Combobox trigger.\n */\nconst fieldClass = (size: TextButtonSize = 'md') =>\n  cn(\n    comboboxTriggerClass({ variant: 'default', size }),\n    'cursor-text gap-2 focus-within:[--surface-rim:var(--field-rim-focus)]',\n    // Disabled like other form elements (muted text, not-allowed cursor), keyed off the input.\n    'has-[input:disabled]:cursor-not-allowed has-[input:disabled]:bg-field-disabled has-[input:disabled]:[&_*]:cursor-not-allowed has-[input:disabled]:[&_*]:text-muted-foreground',\n    // The input inside carries `aria-invalid`; the field shows it like other invalid fields.\n    'has-[[aria-invalid=true]]:[--field-rim-focus:var(--destructive-indicator)] has-[[aria-invalid=true]]:[--field-rim:var(--destructive-indicator)]',\n  );\n\n/**\n * Text starts 0.9em in (the Button recipe's padding, shared with Select and today's Combobox).\n * The chevron is a 22px circle; its arrow's ink sits 6.33px inside the circle's edge (3px circle\n * inset + 3.33px icon inset), so the end padding puts that ink 0.9em from the end, like the text.\n */\nconst fieldPx = '0.9em';\n\n/** Inline so it wins over the Button recipe's `px` (same layer, later in the sheet). */\nconst fieldStyle: React.CSSProperties = {\n  paddingInlineStart: fieldPx,\n  paddingInlineEnd: `calc(${fieldPx} - 6.33px)`,\n};\n\n/**\n * Chips sit 4px from the field's edge on top, bottom and left: 3px visible inside the 1px rim,\n * the same 3px as the gap between chips. A chip is the field height minus that padding (22px).\n */\nconst chipsFieldStyle: React.CSSProperties = {\n  // Longhands only: a `padding` shorthand here would also reset the chevron's end padding.\n  paddingBlock: '4px',\n  paddingInlineStart: '4px',\n  paddingInlineEnd: fieldStyle.paddingInlineEnd,\n};\n\n// `w-0` + `flex-1`: an input's default width (about 20 characters) would otherwise set the field's\n// minimum width, so it couldn't shrink into a narrow column.\nconst inputClass =\n  'h-full w-0 min-w-0 flex-1 bg-transparent text-foreground outline-none placeholder:text-muted-foreground';\n\n/** Caret at the end of the value instead of selecting it, the way a text field behaves. */\nfunction moveCaretToEnd(event: React.FocusEvent<HTMLInputElement>) {\n  const input = event.currentTarget;\n  // Deferred one frame so it runs after the click places the caret; clicking the label lands here too.\n  requestAnimationFrame(() => input.setSelectionRange(input.value.length, input.value.length));\n}\n\n/**\n * The selected value, for a compact `ComboboxTrigger` or a custom display. `children` can be a\n * function of the value; `placeholder` shows while nothing is selected.\n */\nfunction ComboboxValue(props: BaseCombobox.Value.Props) {\n  return <BaseCombobox.Value data-slot=\"combobox-value\" {...props} />;\n}\n\n/** The round chevron button that ends ComboboxInput and ComboboxChips. */\nfunction ComboboxFieldTrigger() {\n  return (\n    <BaseCombobox.Trigger\n      data-slot=\"combobox-field-trigger\"\n      aria-label=\"Show options\"\n      // A round button target: the circle fills on hover, the chevron keeps its color.\n      className=\"flex size-5.5 shrink-0 cursor-pointer items-center justify-center rounded-full text-muted-foreground not-data-disabled:hover:bg-fill\"\n    >\n      {/* Sized like Select's chevron: outside the icon rung, so it keeps Lucide's default stroke\n          (1.33px at 16px) instead of the rung's 1px. */}\n      <ChevronDown className=\"size-4\" />\n    </BaseCombobox.Trigger>\n  );\n}\n\ntype ComboboxTriggerProps = Omit<BaseCombobox.Trigger.Props, 'className'> & {\n  className?: string;\n  /** The Button-recipe look, like Select: `default` (field surface), `outline` or `ghost`. */\n  variant?: ComboboxVariant;\n  /** Icon sizes (`icon-*`) show only `icon` (or the chevron); `children` stay as accessible text. */\n  size?: ButtonSize;\n  /** Shown before the value, or alone at icon sizes (e.g. a filter icon), replacing the chevron there. */\n  icon?: React.ReactNode;\n  showChevron?: boolean;\n};\n\n/**\n * A compact trigger that opens the list, with the search inside the popup (`ComboboxSearch`). For\n * small triggers such as an icon or a ghost button; a form field uses ComboboxInput instead.\n * `children` is what the trigger shows, usually `<ComboboxValue placeholder=\"…\" />`.\n */\nfunction ComboboxTrigger({\n  className,\n  children,\n  variant = 'default',\n  size = 'md',\n  icon,\n  showChevron = !(icon && isIconButtonSize(size)),\n  ...props\n}: ComboboxTriggerProps) {\n  const iconOnly = isIconButtonSize(size);\n  return (\n    <BaseCombobox.Trigger\n      data-slot=\"combobox-trigger\"\n      data-shape={iconOnly ? 'icon' : undefined}\n      className={comboboxTriggerClass({ variant, size, className })}\n      {...props}\n    >\n      {isIconButtonSize(size) ? (\n        <>\n          {icon}\n          <span className=\"sr-only\">{children}</span>\n        </>\n      ) : (\n        <>\n          {icon && <ButtonIcon size={size}>{icon}</ButtonIcon>}\n          <span className=\"min-w-0 flex-1 truncate text-left\">{children}</span>\n        </>\n      )}\n      {showChevron && <ButtonChevron size={size} />}\n    </BaseCombobox.Trigger>\n  );\n}\n\n/** An × that clears the value. ComboboxInput renders it with `showClear`. */\nfunction ComboboxClear({ className, ...props }: BaseCombobox.Clear.Props) {\n  return (\n    <BaseCombobox.Clear\n      data-slot=\"combobox-clear\"\n      aria-label=\"Clear\"\n      className={cn(\n        'flex size-4 shrink-0 items-center justify-center rounded-full text-muted-foreground hover:text-foreground',\n        className,\n      )}\n      {...props}\n    >\n      <X className=\"size-3.5\" />\n    </BaseCombobox.Clear>\n  );\n}\n\ntype ComboboxInputProps = Omit<BaseCombobox.Input.Props, 'size'> & {\n  /** The field height, from the control sizes. `md` by default. */\n  size?: TextButtonSize;\n  /** Shown before the text, e.g. the selected item's icon. */\n  start?: React.ReactNode;\n  /** The chevron button at the end. On by default. */\n  showTrigger?: boolean;\n  /** An × before the chevron that clears the value. */\n  showClear?: boolean;\n};\n\n/**\n * The field you type in to filter, showing the selected value while it's closed. `children` render\n * inside the field before the chevron (e.g. a muted \"4 items\" detail). The list opens at the\n * field's width. Inside a `Field`, the label and errors link to it.\n */\nfunction ComboboxInput({\n  className,\n  children,\n  showTrigger = true,\n  showClear = false,\n  size,\n  start,\n  onFocus,\n  ...props\n}: ComboboxInputProps) {\n  return (\n    <BaseCombobox.InputGroup data-slot=\"combobox-input\" className={cn(fieldClass(size), className)} style={fieldStyle}>\n      {start ? <span className=\"flex shrink-0 items-center\">{start}</span> : null}\n      <BaseCombobox.Input\n        onFocus={event => {\n          moveCaretToEnd(event);\n          onFocus?.(event);\n        }}\n        className={inputClass}\n        {...passwordManagerOptOutProps}\n        {...props}\n      />\n      {children ? <span className=\"flex shrink-0 items-center gap-2 text-muted-foreground\">{children}</span> : null}\n      {showClear ? <ComboboxClear /> : null}\n      {showTrigger ? <ComboboxFieldTrigger /> : null}\n    </BaseCombobox.InputGroup>\n  );\n}\n\n/**\n * The search row at the top of the popup, for a compact `ComboboxTrigger`. The same row as today's\n * Combobox: a search icon, a borderless input and a hairline under it.\n */\nfunction ComboboxSearch({ className, ...props }: BaseCombobox.Input.Props) {\n  return (\n    <div data-slot=\"combobox-search\" className={comboboxStyles.searchContainer}>\n      <Search className={comboboxStyles.searchIcon} />\n      <BaseCombobox.Input\n        className={cn(comboboxStyles.searchInput, className)}\n        {...passwordManagerOptOutProps}\n        {...props}\n      />\n    </div>\n  );\n}\n\ntype ComboboxContentProps = BaseCombobox.Popup.Props &\n  Pick<BaseCombobox.Positioner.Props, 'side' | 'align' | 'sideOffset' | 'alignOffset' | 'anchor'> & {\n    /** Where the popup portals to. Defaults to the nearest dialog or drawer, so it stays interactive there. */\n    container?: PortalContainer;\n  };\n\n/**\n * The popup. Under a field (ComboboxInput or ComboboxChips) it opens at the field's width; under a\n * compact ComboboxTrigger it takes the trigger's width, at least 11rem. Either way the width never\n * follows the filtered items, so it holds still while you type. (`Combobox`'s `popupWidth` picks a\n * fixed, wider width for long options instead.)\n */\nfunction ComboboxContent({\n  className,\n  side = 'bottom',\n  sideOffset = 4,\n  align = 'start',\n  alignOffset = 0,\n  anchor,\n  container,\n  ...props\n}: ComboboxContentProps) {\n  const popupAnchor = usePopupAnchor();\n  const resolvedContainer = usePortalContainer(container);\n  return (\n    <BaseCombobox.Portal container={resolvedContainer}>\n      <BaseCombobox.Positioner\n        side={side}\n        sideOffset={sideOffset}\n        align={align}\n        alignOffset={alignOffset}\n        // Base UI anchors to the field (the InputGroup of ComboboxInput or ComboboxChips), or to the\n        // trigger when the input is in the popup; a crumb switcher anchors to the whole crumb.\n        anchor={anchor ?? popupAnchor}\n        positionMethod={FLOATING_POSITION_METHOD}\n        className={comboboxStyles.positioner}\n      >\n        <BaseCombobox.Popup\n          data-slot=\"combobox-content\"\n          // With the popup's `min-w-[max(11rem,var(--anchor-width))]`: the anchor's width, at least 11rem.\n          className={cn(comboboxStyles.popup, 'w-(--anchor-width)', className)}\n          {...props}\n        />\n      </BaseCombobox.Positioner>\n    </BaseCombobox.Portal>\n  );\n}\n\n/** The scrolling list. Children: a render function per item (or per group), like Base UI's List. */\nfunction ComboboxList({ className, ...props }: BaseCombobox.List.Props) {\n  return (\n    <ScrollArea maxHeight=\"var(--spacing-dropdown)\">\n      <ScrollAreaViewport className=\"scroll-py-8\">\n        <BaseCombobox.List data-slot=\"combobox-list\" className={cn(comboboxStyles.list, className)} {...props} />\n      </ScrollAreaViewport>\n    </ScrollArea>\n  );\n}\n\n/** One option. A check shows on the right while it's selected. */\nfunction ComboboxItem({ className, children, ref, ...props }: BaseCombobox.Item.Props) {\n  return (\n    <BaseCombobox.Item ref={ref} data-slot=\"combobox-item\" className={cn(comboboxItemClass({}), className)} {...props}>\n      <span className={comboboxStyles.itemContent}>{children}</span>\n      <span className={comboboxStyles.checkContainer}>\n        <BaseCombobox.ItemIndicator>\n          <Check className={comboboxStyles.checkIcon} />\n        </BaseCombobox.ItemIndicator>\n      </span>\n    </BaseCombobox.Item>\n  );\n}\n\n/** Title over a description inside an item (shadcn's Item / ItemTitle / ItemDescription). */\nfunction ComboboxItemContent({ className, ...props }: React.ComponentProps<'span'>) {\n  return (\n    <span data-slot=\"combobox-item-content\" className={cn('flex min-w-0 flex-col gap-0.5', className)} {...props} />\n  );\n}\n\nfunction ComboboxItemTitle({ className, ...props }: React.ComponentProps<'span'>) {\n  return <span data-slot=\"combobox-item-title\" className={cn('truncate', className)} {...props} />;\n}\n\n/** Muted, up to two lines. */\nfunction ComboboxItemDescription({ className, ...props }: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"combobox-item-description\"\n      // `whitespace-normal`: the item recipe's `[&>span]:truncate` makes its content `nowrap`, which\n      // would cut the description off mid-word on one line instead of clamping it at two.\n      className={cn('line-clamp-2 text-caption whitespace-normal text-muted-foreground', className)}\n      {...props}\n    />\n  );\n}\n\n/** Muted text at the end of an item, e.g. its kind (\"Agent\"). */\nfunction ComboboxItemEnd({ className, ...props }: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"combobox-item-end\"\n      className={cn('ml-auto shrink-0 text-caption text-muted-foreground', className)}\n      {...props}\n    />\n  );\n}\n\n/** A section of items. Pass the section's `items`; render them with ComboboxCollection. */\nfunction ComboboxGroup(props: BaseCombobox.Group.Props) {\n  return <BaseCombobox.Group data-slot=\"combobox-group\" {...props} />;\n}\n\n/** A group's heading, styled like menu section labels. */\nfunction ComboboxLabel({ className, ...props }: BaseCombobox.GroupLabel.Props) {\n  return <BaseCombobox.GroupLabel data-slot=\"combobox-label\" className={cn(menuLabelClass, className)} {...props} />;\n}\n\n/** Renders a group's filtered items, one render function call per item. */\nfunction ComboboxCollection(props: BaseCombobox.Collection.Props) {\n  return <BaseCombobox.Collection data-slot=\"combobox-collection\" {...props} />;\n}\n\n/** Shows its children only when the filter matches nothing. */\nfunction ComboboxEmpty({ className, ...props }: BaseCombobox.Empty.Props) {\n  return <BaseCombobox.Empty data-slot=\"combobox-empty\" className={cn(comboboxStyles.empty, className)} {...props} />;\n}\n\nfunction ComboboxSeparator({ className, ...props }: BaseCombobox.Separator.Props) {\n  return (\n    <BaseCombobox.Separator data-slot=\"combobox-separator\" className={cn(menuSeparatorClass, className)} {...props} />\n  );\n}\n\n/**\n * Multi-select field: chips for the picked items, then ComboboxChipsInput. The chips and input wrap\n * inside their own area so the chevron keeps its place on the first row. While the field is one\n * line it keeps the pill shape of every other field; once chips wrap it takes the Textarea corner.\n */\nfunction ComboboxChips({ className, children, 'aria-label': ariaLabel, ...props }: BaseCombobox.InputGroup.Props) {\n  // On the inner chips area, so a caller's `ref` reaches the field without merging refs.\n  const chipsRef = React.useRef<HTMLDivElement>(null);\n  const [multiline, setMultiline] = React.useState(false);\n\n  React.useLayoutEffect(() => {\n    const field = chipsRef.current?.parentElement;\n    // No observer (e.g. jsdom in tests): the field keeps its one-row shape.\n    if (!field || typeof ResizeObserver === 'undefined') return;\n    // One row is the control height (the field's `min-height`); anything taller means the chips wrapped.\n    // The 1px slack absorbs subpixel rounding.\n    const rowHeight = parseFloat(getComputedStyle(field).minHeight) || 0;\n    const observer = new ResizeObserver(() => setMultiline(field.offsetHeight > rowHeight + 1));\n    observer.observe(field);\n    return () => observer.disconnect();\n  }, []);\n\n  // Chips inside an InputGroup, like Base UI's multi-select example: the popup anchors to the group.\n  return (\n    <BaseCombobox.InputGroup\n      data-slot=\"combobox-chips\"\n      data-multiline={multiline ? '' : undefined}\n      style={chipsFieldStyle}\n      className={cn(\n        fieldClass(),\n        'h-auto min-h-control-md items-start data-multiline:rounded-xl',\n        // The chips field keeps its resting look: no open tint, no placeholder color. InputGroup sets those\n        // attributes, which the trigger recipe styles.\n        'data-[placeholder]:text-foreground data-[popup-open]:[--surface-tint:transparent]',\n        className,\n      )}\n      {...props}\n    >\n      {/* The label names the chips toolbar, as it did when Chips was the outer element. */}\n      <BaseCombobox.Chips ref={chipsRef} aria-label={ariaLabel} className=\"flex min-w-0 flex-1 flex-wrap gap-[3px]\">\n        {children}\n      </BaseCombobox.Chips>\n      {/* Same height as a chip, so the chevron centers on the first row. */}\n      <span className=\"flex h-5.5 shrink-0 items-center\">\n        <ComboboxFieldTrigger />\n      </span>\n    </BaseCombobox.InputGroup>\n  );\n}\n\n/** One picked item inside ComboboxChips. The × (or Backspace in the input) removes it. */\nfunction ComboboxChip({\n  className,\n  children,\n  showRemove = true,\n  ...props\n}: BaseCombobox.Chip.Props & { showRemove?: boolean }) {\n  return (\n    <BaseCombobox.Chip\n      data-slot=\"combobox-chip\"\n      className={cn(\n        // 8px from the left edge to the text, 6px from the text to the ×'s ink, 8px from the ink to\n        // the right edge. Text in the controls' role (`text-label`), like the field value.\n        'flex h-5.5 items-center rounded-full bg-fill pl-2 text-label text-foreground',\n        !showRemove && 'pr-2',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {showRemove ? (\n        <BaseCombobox.ChipRemove\n          data-slot=\"combobox-chip-remove\"\n          aria-label={typeof children === 'string' ? `Remove ${children}` : 'Remove'}\n          // The whole right end is the hit area: full height, from the gap to the chip's edge. The ×'s\n          // ink sits 2.5px inside its 12px icon, so 3.5px / 5.5px padding put it 6px / 8px out.\n          className=\"flex h-full cursor-pointer items-center rounded-r-full pr-[5.5px] pl-[3.5px] text-muted-foreground not-data-disabled:hover:text-foreground\"\n        >\n          {/* Inline so the button's color wins over the field's `[&_svg]` icon colors. */}\n          <X className=\"size-3\" style={{ color: 'inherit' }} />\n        </BaseCombobox.ChipRemove>\n      ) : null}\n    </BaseCombobox.Chip>\n  );\n}\n\n/** The text input after the chips in ComboboxChips. */\nfunction ComboboxChipsInput({ className, onFocus, ...props }: BaseCombobox.Input.Props) {\n  return (\n    <BaseCombobox.Input\n      data-slot=\"combobox-chip-input\"\n      onFocus={event => {\n        moveCaretToEnd(event);\n        onFocus?.(event);\n      }}\n      className={cn(\n        inputClass,\n        // Text lines up with other fields' text when there are no chips; 4px after a chip otherwise.\n        // Not `first:`: Base UI inserts a hidden Dismiss element before the input while open.\n        'h-5.5 w-0 min-w-12 flex-1 pl-[calc(0.9em_-_4px)] [[data-slot=combobox-chip]~&]:pl-1',\n        className,\n      )}\n      {...passwordManagerOptOutProps}\n      {...props}\n    />\n  );\n}\n\nexport type { ComboboxTriggerProps, ComboboxInputProps, ComboboxContentProps };\n\nexport {\n  ComboboxRoot,\n  ComboboxInput,\n  ComboboxTrigger,\n  ComboboxSearch,\n  ComboboxValue,\n  ComboboxClear,\n  ComboboxContent,\n  ComboboxList,\n  ComboboxItem,\n  ComboboxItemContent,\n  ComboboxItemTitle,\n  ComboboxItemDescription,\n  ComboboxItemEnd,\n  ComboboxGroup,\n  ComboboxLabel,\n  ComboboxCollection,\n  ComboboxEmpty,\n  ComboboxSeparator,\n  ComboboxChips,\n  ComboboxChip,\n  ComboboxChipsInput,\n};\n"],"mappings":"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"}