@bazza-ui/react 0.1.0-canary.6 → 0.1.0-canary.7

package/dist/combobox/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["/home/runner/work/ui/ui/packages/react/dist/combobox/index.cjs","../../src/combobox/index.parts.ts","../../src/combobox/clear/clear.tsx","../../src/combobox/clear/clear.data-attrs.ts","../../src/combobox/contexts/combobox-positioner-context.ts","../../src/combobox/input/input.tsx","../../src/combobox/input-wrapper/input-wrapper-context.ts","../../src/combobox/input/input.data-attrs.ts","../../src/combobox/input/use-combobox-display-value.ts"],"names":["index_parts_exports","__export","PopupMenuArrow","PopupMenuBackdrop","ComboboxClear","PopupMenuEmpty","PopupMenuGroup","PopupMenuGroupLabel","PopupMenuIcon","ComboboxInput","ComboboxInputWrapper","ComboboxItem","ComboboxItemIndicator","ComboboxItemLabel","PopupMenuList","PopupMenuPopup","PopupMenuPortal","ComboboxPositioner","ComboboxRoot","PopupMenuScrollDownArrow","PopupMenuScrollUpArrow","PopupMenuSeparator","ComboboxSurface","useComboboxPositionerContext","ComboboxClearDataAttributes","props","forwardedRef","keepMounted","disabledProp","render","className","style","onClick","rest","comboboxContext","useComboboxContext","disabled","hasValue","handleClick","event","handlePointerDown","state","element","useRender","ComboboxPositionerContext","ComboboxInputWrapperContext","useIsInsideInputWrapper","ComboboxInputDataAttributes","resolveLabelFromItems","items","value","label","i","useComboboxDisplayValue","params","open","getValueText","serializedValue","stringifyAsValue","registryText","itemsLabel","resolvedLabel","resolveLabel","selectedLabel","texts","v","text"],"mappings":"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","file":"/home/runner/work/ui/ui/packages/react/dist/combobox/index.cjs","sourcesContent":[null,"// ============================================================================\n// Combobox Parts\n// ============================================================================\n// Re-exports shared components from internal/popup-menu with Combobox-specific\n// Root, Input, Item, ItemLabel, and ItemIndicator components.\n\n// Re-export VirtualItem type from internal/listbox\nexport type { VirtualItem } from '../internal/listbox/index.js'\n\n// Re-export shared components from internal/popup-menu\nexport {\n  PopupMenuArrow as Arrow,\n  PopupMenuBackdrop as Backdrop,\n  PopupMenuEmpty as Empty,\n  // Structure\n  PopupMenuGroup as Group,\n  PopupMenuGroupLabel as GroupLabel,\n  // Icon\n  PopupMenuIcon as Icon,\n  PopupMenuList as List,\n  PopupMenuPopup as Popup,\n  // Positioning & Container\n  PopupMenuPortal as Portal,\n  // Scroll indicators\n  PopupMenuScrollDownArrow as ScrollDownArrow,\n  PopupMenuScrollUpArrow as ScrollUpArrow,\n  PopupMenuSeparator as Separator,\n} from '../internal/popup-menu/index.js'\nexport { ComboboxClear as Clear } from './clear/clear.js'\nexport { useComboboxPositionerContext } from './contexts/combobox-positioner-context.js'\nexport { ComboboxInput as Input } from './input/input.js'\nexport { ComboboxInputWrapper as InputWrapper } from './input-wrapper/input-wrapper.js'\nexport { ComboboxItem as Item } from './item/item.js'\nexport { ComboboxItemIndicator as ItemIndicator } from './item-indicator/item-indicator.js'\nexport { ComboboxItemLabel as ItemLabel } from './item-label/item-label.js'\nexport { ComboboxPositioner as Positioner } from './positioner/positioner.js'\n// Combobox-specific components\nexport { ComboboxRoot as Root } from './root/root.js'\nexport { ComboboxSurface as Surface } from './surface/surface.js'\n","'use client'\n\nimport { useRender } from '@base-ui/react/use-render'\nimport * as React from 'react'\nimport type { ComponentProps } from '../../utils/types.js'\nimport { useComboboxContext } from '../contexts/combobox-context.js'\nimport { ComboboxClearDataAttributes } from './clear.data-attrs.js'\n\nexport { ComboboxClearDataAttributes }\n\nexport interface ComboboxClearState extends Record<string, unknown> {\n  /**\n   * Whether the combobox has a value (clear button is actionable).\n   */\n  hasValue: boolean\n  /**\n   * Whether the combobox is disabled.\n   */\n  disabled: boolean\n}\n\nexport interface ComboboxClearProps\n  extends ComponentProps<'button', ComboboxClear.State> {\n  /**\n   * Whether to render the button even when there's no value to clear.\n   * @default false\n   */\n  keepMounted?: boolean\n}\n\n/**\n * A button that clears the selected value(s) when clicked.\n * Renders a `<button>` element.\n */\nexport const ComboboxClear = React.forwardRef<\n  HTMLButtonElement,\n  ComboboxClear.Props\n>(function ComboboxClear(props, forwardedRef) {\n  const {\n    keepMounted = false,\n    disabled: disabledProp,\n    render,\n    className,\n    style,\n    onClick,\n    ...rest\n  } = props\n\n  const comboboxContext = useComboboxContext()\n\n  const disabled = disabledProp ?? comboboxContext.disabled\n\n  const hasValue = comboboxContext.multiple\n    ? comboboxContext.values.length > 0\n    : comboboxContext.value !== ''\n\n  const handleClick = React.useCallback(\n    (event: React.MouseEvent<HTMLButtonElement>) => {\n      onClick?.(event)\n      if (event.defaultPrevented) return\n\n      if (comboboxContext.multiple) {\n        comboboxContext.onValuesChange([])\n      } else {\n        comboboxContext.onValueChange('')\n      }\n\n      // Also clear the input value\n      comboboxContext.onInputValueChange('')\n    },\n    [onClick, comboboxContext],\n  )\n\n  // Prevent pointer down from stealing focus from the input\n  const handlePointerDown = React.useCallback(\n    (event: React.PointerEvent<HTMLButtonElement>) => {\n      event.preventDefault()\n    },\n    [],\n  )\n\n  const state: ComboboxClear.State = React.useMemo(\n    () => ({\n      hasValue,\n      disabled,\n    }),\n    [hasValue, disabled],\n  )\n\n  const element = useRender({\n    render,\n    ref: forwardedRef,\n    state,\n    props: {\n      ...rest,\n      [ComboboxClearDataAttributes.slot]: '',\n      type: 'button',\n      tabIndex: -1, // Not tabbable - use keyboard shortcuts instead\n      'aria-label': 'Clear selection',\n      disabled: disabled || !hasValue,\n      className,\n      style,\n      onClick: handleClick,\n      onPointerDown: handlePointerDown,\n    },\n    enabled: keepMounted || hasValue,\n    defaultTagName: 'button',\n  })\n\n  // Don't render if no value and not keepMounted\n  if (!keepMounted && !hasValue) {\n    return null\n  }\n\n  return element\n})\n\nexport namespace ComboboxClear {\n  export type State = ComboboxClearState\n  export interface Props extends ComboboxClearProps {}\n}\n","/**\n * Data attributes for ComboboxClear component.\n */\nexport const ComboboxClearDataAttributes = {\n  /**\n   * Identifies the component part.\n   * @type {'bazzaui-combobox-clear'}\n   */\n  slot: 'bazzaui-combobox-clear',\n} as const\n","'use client'\n\nimport * as React from 'react'\n\n// ============================================================================\n// Types\n// ============================================================================\n\n// Types matching Base UI's positioning types\nexport type Side = 'top' | 'bottom' | 'left' | 'right'\nexport type Align = 'start' | 'center' | 'end'\n\n/**\n * Layout mode for the combobox popup.\n * - `'floating'` - Standard dropdown positioning below/above the input\n * - `'input-embedded'` - Popup wraps around the input (macOS-style)\n */\nexport type ComboboxLayout = 'floating' | 'input-embedded'\n\n/**\n * Context value for Combobox Positioner.\n * Provides alignment state for coordinating positioning behavior.\n */\nexport interface ComboboxPositionerContextValue {\n  /**\n   * The layout mode being used.\n   * - `'floating'` - Standard dropdown positioning\n   * - `'input-embedded'` - Popup wraps around the input\n   */\n  layout: ComboboxLayout\n\n  /**\n   * The side of the popup relative to the input.\n   */\n  side: Side\n\n  /**\n   * The alignment of the popup.\n   */\n  align: Align\n\n  /**\n   * Height of the input element in pixels.\n   * Use this to add appropriate padding to the popup.\n   */\n  inputHeight: number\n}\n\n// ============================================================================\n// Context\n// ============================================================================\n\nconst ComboboxPositionerContext =\n  React.createContext<ComboboxPositionerContextValue | null>(null)\n\n/**\n * Hook to access the Combobox Positioner context.\n * Returns null if used outside a ComboboxPositioner.\n */\nexport function useComboboxPositionerContext(): ComboboxPositionerContextValue | null {\n  return React.useContext(ComboboxPositionerContext)\n}\n\nexport { ComboboxPositionerContext }\n","'use client'\n\nimport { useRender } from '@base-ui/react/use-render'\nimport * as React from 'react'\nimport { useFocusOwner } from '../../internal/popup-menu/contexts/focus-owner-context.js'\nimport { usePopupMenuContext } from '../../internal/popup-menu/contexts/popup-menu-context.js'\nimport type { ComponentProps } from '../../utils/types.js'\nimport { useComboboxContext } from '../contexts/combobox-context.js'\nimport { useIsInsideInputWrapper } from '../input-wrapper/input-wrapper-context.js'\nimport { ComboboxInputDataAttributes } from './input.data-attrs.js'\nimport { useComboboxDisplayValue } from './use-combobox-display-value.js'\nimport { useComboboxInputBehavior } from './use-combobox-input-behavior.js'\n\nexport { ComboboxInputDataAttributes }\n\nexport interface ComboboxInputState extends Record<string, unknown> {\n  /**\n   * Whether the combobox popup is open.\n   */\n  open: boolean\n  /**\n   * Whether the input is disabled.\n   */\n  disabled: boolean\n  /**\n   * Whether the input currently shows placeholder (no value selected).\n   */\n  placeholder: boolean\n}\n\n/**\n * Cursor behavior when the combobox popup opens.\n * - `'none'` - Don't move the cursor (cursor appears where clicked)\n * - `'end'` - Move cursor to the end of the input\n * - `'select-all'` - Move cursor to the end and select all text\n */\nexport type ComboboxInputCursorBehavior = 'none' | 'end' | 'select-all'\n\nexport interface ComboboxInputProps\n  extends Omit<\n    ComponentProps<'input', ComboboxInput.State>,\n    'value' | 'onChange' | 'type'\n  > {\n  /**\n   * Placeholder text shown when no value is selected and input is empty.\n   * Overrides the placeholder set on Combobox.Root.\n   */\n  placeholder?: string\n\n  /**\n   * Cursor behavior when the combobox popup opens.\n   * - `'none'` - Don't move the cursor (cursor appears where clicked)\n   * - `'end'` - Move cursor to the end of the input\n   * - `'select-all'` - Move cursor to the end and select all text\n   *\n   * @default 'none'\n   */\n  cursorBehavior?: ComboboxInputCursorBehavior\n}\n\n/**\n * An input that acts as both the trigger and search field for the combobox.\n * Renders an `<input>` element with combobox ARIA semantics.\n */\nexport const ComboboxInput = React.forwardRef<\n  HTMLInputElement,\n  ComboboxInput.Props\n>(function ComboboxInput(props, forwardedRef) {\n  const {\n    placeholder: placeholderProp,\n    disabled: disabledProp,\n    cursorBehavior = 'none',\n    render,\n    className,\n    style,\n    onFocus,\n    onBlur,\n    onClick,\n    onKeyDown,\n    ...rest\n  } = props\n\n  const comboboxContext = useComboboxContext()\n  const popupMenuContext = usePopupMenuContext()\n  const focusOwnerStore = useFocusOwner()\n  const isInsideInputWrapper = useIsInsideInputWrapper()\n\n  const disabled =\n    (disabledProp ?? comboboxContext.disabled) || popupMenuContext.disabled\n  const placeholder = placeholderProp ?? comboboxContext.placeholder\n\n  // Get open state\n  const open = popupMenuContext.store.useState('open')\n\n  // Use display value hook\n  const { hasValue, displayValue, getValueText } = useComboboxDisplayValue({\n    comboboxContext,\n    open,\n  })\n\n  // Use input behavior hook\n  const { handleChange, handleFocus, handleBlur, handleClick, handleKeyDown } =\n    useComboboxInputBehavior({\n      comboboxContext,\n      store: popupMenuContext.store,\n      focusOwnerStore,\n      open,\n      disabled,\n      cursorBehavior,\n      hasValue,\n      getValueText,\n      onFocus,\n      onBlur,\n      onClick,\n      onKeyDown,\n    })\n\n  // Build data attributes\n  const dataAttrs: Record<string, string> = {\n    [ComboboxInputDataAttributes.slot]: '',\n  }\n  if (open) {\n    dataAttrs[ComboboxInputDataAttributes.open] = ''\n  } else {\n    dataAttrs[ComboboxInputDataAttributes.closed] = ''\n  }\n  if (disabled) {\n    dataAttrs[ComboboxInputDataAttributes.disabled] = ''\n  }\n  if (!hasValue) {\n    dataAttrs[ComboboxInputDataAttributes.placeholder] = ''\n  }\n  // Add input-embedded data attribute when layout is input-embedded\n  if (comboboxContext.layout === 'input-embedded') {\n    dataAttrs['data-input-embedded'] = ''\n  }\n\n  // Register input element for positioning\n  const mergedRef = React.useCallback(\n    (node: HTMLInputElement | null) => {\n      comboboxContext.setInputElement(node)\n      if (typeof forwardedRef === 'function') {\n        forwardedRef(node)\n      } else if (forwardedRef) {\n        forwardedRef.current = node\n      }\n    },\n    [forwardedRef, comboboxContext],\n  )\n\n  const state: ComboboxInput.State = React.useMemo(\n    () => ({\n      open,\n      disabled,\n      placeholder: !hasValue,\n    }),\n    [open, disabled, hasValue],\n  )\n\n  // When input-embedded layout, apply styles to position input above the popup\n  // Skip z-index if inside an InputWrapper (the wrapper handles z-index)\n  const inputEmbeddedStyles: React.CSSProperties | undefined =\n    comboboxContext.layout === 'input-embedded' && !isInsideInputWrapper\n      ? { position: 'relative', zIndex: 1 }\n      : undefined\n\n  const element = useRender({\n    render,\n    ref: mergedRef,\n    state,\n    props: {\n      ...rest,\n      ...dataAttrs,\n      type: 'text',\n      role: 'combobox',\n      'aria-autocomplete': 'list',\n      'aria-expanded': open,\n      'aria-controls': comboboxContext.listId,\n      'aria-haspopup': 'listbox',\n      autoComplete: 'off',\n      autoCorrect: 'off',\n      spellCheck: false,\n      disabled,\n      placeholder: !hasValue ? placeholder : undefined,\n      className,\n      style: { ...inputEmbeddedStyles, ...style },\n      value: displayValue,\n      onChange: handleChange,\n      onFocus: handleFocus,\n      onBlur: handleBlur,\n      onClick: handleClick,\n      onKeyDown: handleKeyDown,\n    },\n    defaultTagName: 'input',\n  })\n\n  return element\n})\n\nexport namespace ComboboxInput {\n  export interface Props extends ComboboxInputProps {}\n  export type State = ComboboxInputState\n}\n","import * as React from 'react'\n\n/**\n * Context to indicate that children are inside an InputWrapper.\n * When true, Input should not apply its own z-index styles for input-embedded layout.\n */\nexport const ComboboxInputWrapperContext = React.createContext<boolean>(false)\n\n/**\n * Hook to check if component is inside a ComboboxInputWrapper.\n */\nexport function useIsInsideInputWrapper(): boolean {\n  return React.useContext(ComboboxInputWrapperContext)\n}\n","/**\n * Data attributes for ComboboxInput component.\n */\nexport const ComboboxInputDataAttributes = {\n  /**\n   * Identifies the component part.\n   * @type {'bazzaui-combobox-input'}\n   */\n  slot: 'bazzaui-combobox-input',\n  /** Present when the combobox popup is open. */\n  open: 'data-open',\n  /** Present when the combobox popup is closed. */\n  closed: 'data-closed',\n  /** Present when the input is disabled. */\n  disabled: 'data-disabled',\n  /** Present when no value is selected (showing placeholder). */\n  placeholder: 'data-placeholder',\n} as const\n","'use client'\n\nimport * as React from 'react'\nimport {\n  resolveLabel,\n  stringifyAsValue,\n} from '../../utils/resolve-value-label.js'\nimport type { ComboboxContextValue } from '../contexts/combobox-context.js'\n\n/**\n * Helper to resolve label from items prop\n */\nfunction resolveLabelFromItems(\n  items:\n    | Record<string, React.ReactNode>\n    | Array<{ value: string; label: React.ReactNode }>\n    | undefined,\n  value: string,\n): string | undefined {\n  if (!items) return undefined\n\n  if (Array.isArray(items)) {\n    const item = items.find((i) => i.value === value)\n    const label = item?.label\n    return typeof label === 'string' ? label : undefined\n  }\n\n  const label = items[value]\n  return typeof label === 'string' ? label : undefined\n}\n\nexport interface UseComboboxDisplayValueParams<Value = unknown> {\n  comboboxContext: ComboboxContextValue<Value>\n  open: boolean\n}\n\nexport interface UseComboboxDisplayValueReturn<Value = unknown> {\n  /** Whether a value is selected */\n  hasValue: boolean\n  /** The value to display in the input */\n  displayValue: string\n  /** The label of the selected value(s) */\n  selectedLabel: string\n  /** Get the display text for a value */\n  getValueText: (value: Value) => string | undefined\n}\n\n/**\n * Hook to compute the display value for the combobox input.\n *\n * Handles:\n * - Determining if a value is selected (single or multi-select)\n * - Computing the display label for selected values\n * - Switching between selected label (closed) and input value (open)\n */\nexport function useComboboxDisplayValue<Value = unknown>(\n  params: UseComboboxDisplayValueParams<Value>,\n): UseComboboxDisplayValueReturn<Value> {\n  const { comboboxContext, open } = params\n\n  // Determine if showing placeholder (no value selected)\n  const hasValue = comboboxContext.multiple\n    ? comboboxContext.values.length > 0\n    : comboboxContext.value != null\n\n  // Get the display text for selected value\n  const getValueText = React.useCallback(\n    (value: Value): string | undefined => {\n      // Serialize for registry lookup\n      const serializedValue = stringifyAsValue(\n        value,\n        comboboxContext.itemToStringValue,\n      )\n\n      // First try the registry (populated when items mount)\n      const registryText = comboboxContext.itemTextRegistry.get(serializedValue)\n      if (registryText !== undefined) {\n        return registryText\n      }\n\n      // Fall back to the items prop (for initial render before popup opens)\n      const itemsLabel = resolveLabelFromItems(\n        comboboxContext.items,\n        serializedValue,\n      )\n      if (itemsLabel !== undefined) {\n        return itemsLabel\n      }\n\n      // Fall back to itemToStringLabel for object values\n      const resolvedLabel = resolveLabel(\n        value,\n        comboboxContext.itemToStringLabel,\n      )\n      // Only return if it's different from the serialized value (meaning we got a real label)\n      if (resolvedLabel && resolvedLabel !== serializedValue) {\n        return resolvedLabel\n      }\n\n      return undefined\n    },\n    [\n      comboboxContext.itemTextRegistry,\n      comboboxContext.items,\n      comboboxContext.itemToStringLabel,\n      comboboxContext.itemToStringValue,\n    ],\n  )\n\n  // Get the label for the selected value (used when closed or just opened)\n  const selectedLabel = React.useMemo(() => {\n    if (!hasValue) {\n      return ''\n    }\n    if (comboboxContext.multiple) {\n      // For multi-select, show comma-separated values or count\n      const texts = comboboxContext.values\n        .map((v) => {\n          const text = getValueText(v)\n          if (text !== undefined) return text\n          // Fall back to resolved label or serialized value\n          return (\n            resolveLabel(v, comboboxContext.itemToStringLabel) ||\n            stringifyAsValue(v, comboboxContext.itemToStringValue)\n          )\n        })\n        .filter(Boolean)\n      if (texts.length <= 2) {\n        return texts.join(', ')\n      }\n      return `${texts.length} selected`\n    }\n    // Single-select: show the value's text\n    const value = comboboxContext.value\n    if (value == null) return ''\n\n    const text = getValueText(value)\n    if (text !== undefined) return text\n    // Fall back to resolved label or serialized value\n    return (\n      resolveLabel(value, comboboxContext.itemToStringLabel) ||\n      stringifyAsValue(value, comboboxContext.itemToStringValue)\n    )\n  }, [\n    hasValue,\n    comboboxContext.multiple,\n    comboboxContext.value,\n    comboboxContext.values,\n    comboboxContext.itemToStringLabel,\n    comboboxContext.itemToStringValue,\n    getValueText,\n  ])\n\n  // Determine the display value for the input\n  // When closed: show selected value's text\n  // When open: show the search/filter text (inputValue)\n  const displayValue = React.useMemo(() => {\n    if (!open) {\n      // When closed, show the selected value's label\n      return selectedLabel\n    }\n    // When open, use the input value for filtering\n    return comboboxContext.inputValue\n  }, [open, selectedLabel, comboboxContext.inputValue])\n\n  return {\n    hasValue,\n    displayValue,\n    selectedLabel,\n    getValueText,\n  }\n}\n"]}
+{"version":3,"sources":["/home/runner/work/ui/ui/packages/react/dist/combobox/index.cjs","../../src/combobox/index.parts.ts","../../src/combobox/clear/clear.tsx","../../src/combobox/clear/clear.data-attrs.ts","../../src/combobox/contexts/combobox-positioner-context.ts","../../src/combobox/input/input.tsx","../../src/combobox/input-wrapper/input-wrapper-context.ts","../../src/combobox/input/input.data-attrs.ts","../../src/combobox/input/use-combobox-display-value.ts"],"names":["index_parts_exports","__export","PopupMenuArrow","PopupMenuBackdrop","ComboboxClear","PopupMenuEmpty","PopupMenuGroup","PopupMenuGroupLabel","PopupMenuIcon","ComboboxInput","ComboboxInputWrapper","ComboboxItem","ComboboxItemIndicator","ComboboxItemLabel","PopupMenuList","PopupMenuPopup","PopupMenuPortal","ComboboxPositioner","ComboboxRoot","PopupMenuScrollDownArrow","PopupMenuScrollUpArrow","PopupMenuSeparator","ComboboxSurface","useComboboxPositionerContext","ComboboxClearDataAttributes","props","forwardedRef","keepMounted","disabledProp","render","className","style","onClick","rest","comboboxContext","useComboboxContext","disabled","hasValue","handleClick","event","handlePointerDown","state","element","useRender","ComboboxPositionerContext","ComboboxInputWrapperContext","useIsInsideInputWrapper","ComboboxInputDataAttributes","useComboboxDisplayValue","params","open","isValueEmpty","getValueText","value","serializedValue","stringifyAsValue","registryText","itemsLabel","resolveLabelFromItems","resolvedLabel","resolveLabel","selectedLabel","texts","v","text"],"mappings":"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","file":"/home/runner/work/ui/ui/packages/react/dist/combobox/index.cjs","sourcesContent":[null,"// ============================================================================\n// Combobox Parts\n// ============================================================================\n// Re-exports shared components from internal/popup-menu with Combobox-specific\n// Root, Input, Item, ItemLabel, and ItemIndicator components.\n\n// Re-export VirtualItem type from internal/listbox\nexport type { VirtualItem } from '../internal/listbox/index.js'\n\n// Re-export shared components from internal/popup-menu\nexport {\n  PopupMenuArrow as Arrow,\n  PopupMenuBackdrop as Backdrop,\n  PopupMenuEmpty as Empty,\n  // Structure\n  PopupMenuGroup as Group,\n  PopupMenuGroupLabel as GroupLabel,\n  // Icon\n  PopupMenuIcon as Icon,\n  PopupMenuList as List,\n  PopupMenuPopup as Popup,\n  // Positioning & Container\n  PopupMenuPortal as Portal,\n  // Scroll indicators\n  PopupMenuScrollDownArrow as ScrollDownArrow,\n  PopupMenuScrollUpArrow as ScrollUpArrow,\n  PopupMenuSeparator as Separator,\n} from '../internal/popup-menu/index.js'\nexport { ComboboxClear as Clear } from './clear/clear.js'\nexport { useComboboxPositionerContext } from './contexts/combobox-positioner-context.js'\nexport { ComboboxInput as Input } from './input/input.js'\nexport { ComboboxInputWrapper as InputWrapper } from './input-wrapper/input-wrapper.js'\nexport { ComboboxItem as Item } from './item/item.js'\nexport { ComboboxItemIndicator as ItemIndicator } from './item-indicator/item-indicator.js'\nexport { ComboboxItemLabel as ItemLabel } from './item-label/item-label.js'\nexport { ComboboxPositioner as Positioner } from './positioner/positioner.js'\n// Combobox-specific components\nexport { ComboboxRoot as Root } from './root/root.js'\nexport { ComboboxSurface as Surface } from './surface/surface.js'\n","'use client'\n\nimport { useRender } from '@base-ui/react/use-render'\nimport * as React from 'react'\nimport type { ComponentProps } from '../../utils/types.js'\nimport { useComboboxContext } from '../contexts/combobox-context.js'\nimport { ComboboxClearDataAttributes } from './clear.data-attrs.js'\n\nexport { ComboboxClearDataAttributes }\n\nexport interface ComboboxClearState extends Record<string, unknown> {\n  /**\n   * Whether the combobox has a value (clear button is actionable).\n   */\n  hasValue: boolean\n  /**\n   * Whether the combobox is disabled.\n   */\n  disabled: boolean\n}\n\nexport interface ComboboxClearProps\n  extends ComponentProps<'button', ComboboxClear.State> {\n  /**\n   * Whether to render the button even when there's no value to clear.\n   * @default false\n   */\n  keepMounted?: boolean\n}\n\n/**\n * A button that clears the selected value(s) when clicked.\n * Renders a `<button>` element.\n */\nexport const ComboboxClear = React.forwardRef<\n  HTMLButtonElement,\n  ComboboxClear.Props\n>(function ComboboxClear(props, forwardedRef) {\n  const {\n    keepMounted = false,\n    disabled: disabledProp,\n    render,\n    className,\n    style,\n    onClick,\n    ...rest\n  } = props\n\n  const comboboxContext = useComboboxContext()\n\n  const disabled = disabledProp ?? comboboxContext.disabled\n\n  const hasValue = comboboxContext.multiple\n    ? comboboxContext.values.length > 0\n    : comboboxContext.value !== ''\n\n  const handleClick = React.useCallback(\n    (event: React.MouseEvent<HTMLButtonElement>) => {\n      onClick?.(event)\n      if (event.defaultPrevented) return\n\n      if (comboboxContext.multiple) {\n        comboboxContext.onValuesChange([])\n      } else {\n        comboboxContext.onValueChange('')\n      }\n\n      // Also clear the input value\n      comboboxContext.onInputValueChange('')\n    },\n    [onClick, comboboxContext],\n  )\n\n  // Prevent pointer down from stealing focus from the input\n  const handlePointerDown = React.useCallback(\n    (event: React.PointerEvent<HTMLButtonElement>) => {\n      event.preventDefault()\n    },\n    [],\n  )\n\n  const state: ComboboxClear.State = React.useMemo(\n    () => ({\n      hasValue,\n      disabled,\n    }),\n    [hasValue, disabled],\n  )\n\n  const element = useRender({\n    render,\n    ref: forwardedRef,\n    state,\n    props: {\n      ...rest,\n      [ComboboxClearDataAttributes.slot]: '',\n      type: 'button',\n      tabIndex: -1, // Not tabbable - use keyboard shortcuts instead\n      'aria-label': 'Clear selection',\n      disabled: disabled || !hasValue,\n      className,\n      style,\n      onClick: handleClick,\n      onPointerDown: handlePointerDown,\n    },\n    enabled: keepMounted || hasValue,\n    defaultTagName: 'button',\n  })\n\n  // Don't render if no value and not keepMounted\n  if (!keepMounted && !hasValue) {\n    return null\n  }\n\n  return element\n})\n\nexport namespace ComboboxClear {\n  export type State = ComboboxClearState\n  export interface Props extends ComboboxClearProps {}\n}\n","/**\n * Data attributes for ComboboxClear component.\n */\nexport const ComboboxClearDataAttributes = {\n  /**\n   * Identifies the component part.\n   * @type {'bazzaui-combobox-clear'}\n   */\n  slot: 'bazzaui-combobox-clear',\n} as const\n","'use client'\n\nimport * as React from 'react'\n\n// ============================================================================\n// Types\n// ============================================================================\n\n// Types matching Base UI's positioning types\nexport type Side = 'top' | 'bottom' | 'left' | 'right'\nexport type Align = 'start' | 'center' | 'end'\n\n/**\n * Layout mode for the combobox popup.\n * - `'floating'` - Standard dropdown positioning below/above the input\n * - `'input-embedded'` - Popup wraps around the input (macOS-style)\n */\nexport type ComboboxLayout = 'floating' | 'input-embedded'\n\n/**\n * Context value for Combobox Positioner.\n * Provides alignment state for coordinating positioning behavior.\n */\nexport interface ComboboxPositionerContextValue {\n  /**\n   * The layout mode being used.\n   * - `'floating'` - Standard dropdown positioning\n   * - `'input-embedded'` - Popup wraps around the input\n   */\n  layout: ComboboxLayout\n\n  /**\n   * The side of the popup relative to the input.\n   */\n  side: Side\n\n  /**\n   * The alignment of the popup.\n   */\n  align: Align\n\n  /**\n   * Height of the input element in pixels.\n   * Use this to add appropriate padding to the popup.\n   */\n  inputHeight: number\n}\n\n// ============================================================================\n// Context\n// ============================================================================\n\nconst ComboboxPositionerContext =\n  React.createContext<ComboboxPositionerContextValue | null>(null)\n\n/**\n * Hook to access the Combobox Positioner context.\n * Returns null if used outside a ComboboxPositioner.\n */\nexport function useComboboxPositionerContext(): ComboboxPositionerContextValue | null {\n  return React.useContext(ComboboxPositionerContext)\n}\n\nexport { ComboboxPositionerContext }\n","'use client'\n\nimport { useRender } from '@base-ui/react/use-render'\nimport * as React from 'react'\nimport { useFocusOwner } from '../../internal/popup-menu/contexts/focus-owner-context.js'\nimport { usePopupMenuContext } from '../../internal/popup-menu/contexts/popup-menu-context.js'\nimport { resolveLabelFromItems } from '../../utils/items.js'\nimport type { ComponentProps } from '../../utils/types.js'\nimport { useComboboxContext } from '../contexts/combobox-context.js'\nimport { useIsInsideInputWrapper } from '../input-wrapper/input-wrapper-context.js'\nimport { ComboboxInputDataAttributes } from './input.data-attrs.js'\nimport { useComboboxDisplayValue } from './use-combobox-display-value.js'\nimport { useComboboxInputBehavior } from './use-combobox-input-behavior.js'\n\nexport { ComboboxInputDataAttributes }\n\nexport interface ComboboxInputState extends Record<string, unknown> {\n  /**\n   * Whether the combobox popup is open.\n   */\n  open: boolean\n  /**\n   * Whether the input is disabled.\n   */\n  disabled: boolean\n  /**\n   * Whether the input currently shows placeholder (no value selected).\n   */\n  placeholder: boolean\n}\n\n/**\n * Cursor behavior when the combobox popup opens.\n * - `'none'` - Don't move the cursor (cursor appears where clicked)\n * - `'end'` - Move cursor to the end of the input\n * - `'select-all'` - Move cursor to the end and select all text\n */\nexport type ComboboxInputCursorBehavior = 'none' | 'end' | 'select-all'\n\nexport interface ComboboxInputProps\n  extends Omit<\n    ComponentProps<'input', ComboboxInput.State>,\n    'value' | 'onChange' | 'type'\n  > {\n  /**\n   * Placeholder text shown when no value is selected and input is empty.\n   * Overrides the placeholder set on Combobox.Root.\n   */\n  placeholder?: string\n\n  /**\n   * Cursor behavior when the combobox popup opens.\n   * - `'none'` - Don't move the cursor (cursor appears where clicked)\n   * - `'end'` - Move cursor to the end of the input\n   * - `'select-all'` - Move cursor to the end and select all text\n   *\n   * @default 'none'\n   */\n  cursorBehavior?: ComboboxInputCursorBehavior\n}\n\n/**\n * An input that acts as both the trigger and search field for the combobox.\n * Renders an `<input>` element with combobox ARIA semantics.\n */\nexport const ComboboxInput = React.forwardRef<\n  HTMLInputElement,\n  ComboboxInput.Props\n>(function ComboboxInput(props, forwardedRef) {\n  const {\n    placeholder: placeholderProp,\n    disabled: disabledProp,\n    cursorBehavior = 'none',\n    render,\n    className,\n    style,\n    onFocus,\n    onBlur,\n    onClick,\n    onKeyDown,\n    ...rest\n  } = props\n\n  const comboboxContext = useComboboxContext()\n  const popupMenuContext = usePopupMenuContext()\n  const focusOwnerStore = useFocusOwner()\n  const isInsideInputWrapper = useIsInsideInputWrapper()\n\n  const disabled =\n    (disabledProp ?? comboboxContext.disabled) || popupMenuContext.disabled\n\n  // A `null` item's label (looked up under the empty-string key) acts as the\n  // placeholder, taking precedence over the Root placeholder but not an\n  // explicit `placeholder` prop on the input.\n  const nullItemLabel = resolveLabelFromItems(comboboxContext.items, '')\n  const placeholder =\n    placeholderProp ??\n    (typeof nullItemLabel === 'string' ? nullItemLabel : undefined) ??\n    comboboxContext.placeholder\n\n  // Get open state\n  const open = popupMenuContext.store.useState('open')\n\n  // Use display value hook\n  const { hasValue, displayValue, getValueText } = useComboboxDisplayValue({\n    comboboxContext,\n    open,\n  })\n\n  // Use input behavior hook\n  const { handleChange, handleFocus, handleBlur, handleClick, handleKeyDown } =\n    useComboboxInputBehavior({\n      comboboxContext,\n      store: popupMenuContext.store,\n      focusOwnerStore,\n      open,\n      disabled,\n      cursorBehavior,\n      hasValue,\n      getValueText,\n      onFocus,\n      onBlur,\n      onClick,\n      onKeyDown,\n    })\n\n  // Build data attributes\n  const dataAttrs: Record<string, string> = {\n    [ComboboxInputDataAttributes.slot]: '',\n  }\n  if (open) {\n    dataAttrs[ComboboxInputDataAttributes.open] = ''\n  } else {\n    dataAttrs[ComboboxInputDataAttributes.closed] = ''\n  }\n  if (disabled) {\n    dataAttrs[ComboboxInputDataAttributes.disabled] = ''\n  }\n  if (!hasValue) {\n    dataAttrs[ComboboxInputDataAttributes.placeholder] = ''\n  }\n  // Add input-embedded data attribute when layout is input-embedded\n  if (comboboxContext.layout === 'input-embedded') {\n    dataAttrs['data-input-embedded'] = ''\n  }\n\n  // Register input element for positioning\n  const mergedRef = React.useCallback(\n    (node: HTMLInputElement | null) => {\n      comboboxContext.setInputElement(node)\n      if (typeof forwardedRef === 'function') {\n        forwardedRef(node)\n      } else if (forwardedRef) {\n        forwardedRef.current = node\n      }\n    },\n    [forwardedRef, comboboxContext],\n  )\n\n  const state: ComboboxInput.State = React.useMemo(\n    () => ({\n      open,\n      disabled,\n      placeholder: !hasValue,\n    }),\n    [open, disabled, hasValue],\n  )\n\n  // When input-embedded layout, apply styles to position input above the popup\n  // Skip z-index if inside an InputWrapper (the wrapper handles z-index)\n  const inputEmbeddedStyles: React.CSSProperties | undefined =\n    comboboxContext.layout === 'input-embedded' && !isInsideInputWrapper\n      ? { position: 'relative', zIndex: 1 }\n      : undefined\n\n  const element = useRender({\n    render,\n    ref: mergedRef,\n    state,\n    props: {\n      ...rest,\n      ...dataAttrs,\n      type: 'text',\n      role: 'combobox',\n      'aria-autocomplete': 'list',\n      'aria-expanded': open,\n      'aria-controls': comboboxContext.listId,\n      'aria-haspopup': 'listbox',\n      autoComplete: 'off',\n      autoCorrect: 'off',\n      spellCheck: false,\n      disabled,\n      placeholder: !hasValue ? placeholder : undefined,\n      className,\n      style: { ...inputEmbeddedStyles, ...style },\n      value: displayValue,\n      onChange: handleChange,\n      onFocus: handleFocus,\n      onBlur: handleBlur,\n      onClick: handleClick,\n      onKeyDown: handleKeyDown,\n    },\n    defaultTagName: 'input',\n  })\n\n  return element\n})\n\nexport namespace ComboboxInput {\n  export interface Props extends ComboboxInputProps {}\n  export type State = ComboboxInputState\n}\n","import * as React from 'react'\n\n/**\n * Context to indicate that children are inside an InputWrapper.\n * When true, Input should not apply its own z-index styles for input-embedded layout.\n */\nexport const ComboboxInputWrapperContext = React.createContext<boolean>(false)\n\n/**\n * Hook to check if component is inside a ComboboxInputWrapper.\n */\nexport function useIsInsideInputWrapper(): boolean {\n  return React.useContext(ComboboxInputWrapperContext)\n}\n","/**\n * Data attributes for ComboboxInput component.\n */\nexport const ComboboxInputDataAttributes = {\n  /**\n   * Identifies the component part.\n   * @type {'bazzaui-combobox-input'}\n   */\n  slot: 'bazzaui-combobox-input',\n  /** Present when the combobox popup is open. */\n  open: 'data-open',\n  /** Present when the combobox popup is closed. */\n  closed: 'data-closed',\n  /** Present when the input is disabled. */\n  disabled: 'data-disabled',\n  /** Present when no value is selected (showing placeholder). */\n  placeholder: 'data-placeholder',\n} as const\n","'use client'\n\nimport * as React from 'react'\nimport { resolveLabelFromItems } from '../../utils/items.js'\nimport {\n  isValueEmpty,\n  resolveLabel,\n  stringifyAsValue,\n} from '../../utils/resolve-value-label.js'\nimport type { ComboboxContextValue } from '../contexts/combobox-context.js'\n\nexport interface UseComboboxDisplayValueParams<Value = unknown> {\n  comboboxContext: ComboboxContextValue<Value>\n  open: boolean\n}\n\nexport interface UseComboboxDisplayValueReturn<Value = unknown> {\n  /** Whether a value is selected */\n  hasValue: boolean\n  /** The value to display in the input */\n  displayValue: string\n  /** The label of the selected value(s) */\n  selectedLabel: string\n  /** Get the display text for a value */\n  getValueText: (value: Value) => string | undefined\n}\n\n/**\n * Hook to compute the display value for the combobox input.\n *\n * Handles:\n * - Determining if a value is selected (single or multi-select)\n * - Computing the display label for selected values\n * - Switching between selected label (closed) and input value (open)\n */\nexport function useComboboxDisplayValue<Value = unknown>(\n  params: UseComboboxDisplayValueParams<Value>,\n): UseComboboxDisplayValueReturn<Value> {\n  const { comboboxContext, open } = params\n\n  // Determine if showing placeholder (no value selected)\n  const hasValue = comboboxContext.multiple\n    ? comboboxContext.values.length > 0\n    : !isValueEmpty(comboboxContext.value)\n\n  // Get the display text for selected value\n  const getValueText = React.useCallback(\n    (value: Value): string | undefined => {\n      // Serialize for registry lookup\n      const serializedValue = stringifyAsValue(\n        value,\n        comboboxContext.itemToStringValue,\n      )\n\n      // First try the registry (populated when items mount)\n      const registryText = comboboxContext.itemTextRegistry.get(serializedValue)\n      if (registryText !== undefined) {\n        return registryText\n      }\n\n      // Fall back to the items prop (for initial render before popup opens).\n      // The input can only display strings, so ignore non-string labels here.\n      const itemsLabel = resolveLabelFromItems(\n        comboboxContext.items,\n        serializedValue,\n      )\n      if (typeof itemsLabel === 'string') {\n        return itemsLabel\n      }\n\n      // Fall back to itemToStringLabel for object values\n      const resolvedLabel = resolveLabel(\n        value,\n        comboboxContext.itemToStringLabel,\n      )\n      // Only return if it's different from the serialized value (meaning we got a real label)\n      if (resolvedLabel && resolvedLabel !== serializedValue) {\n        return resolvedLabel\n      }\n\n      return undefined\n    },\n    [\n      comboboxContext.itemTextRegistry,\n      comboboxContext.items,\n      comboboxContext.itemToStringLabel,\n      comboboxContext.itemToStringValue,\n    ],\n  )\n\n  // Get the label for the selected value (used when closed or just opened)\n  const selectedLabel = React.useMemo(() => {\n    if (!hasValue) {\n      return ''\n    }\n    if (comboboxContext.multiple) {\n      // For multi-select, show comma-separated values or count\n      const texts = comboboxContext.values\n        .map((v) => {\n          const text = getValueText(v)\n          if (text !== undefined) return text\n          // Fall back to resolved label or serialized value\n          return (\n            resolveLabel(v, comboboxContext.itemToStringLabel) ||\n            stringifyAsValue(v, comboboxContext.itemToStringValue)\n          )\n        })\n        .filter(Boolean)\n      if (texts.length <= 2) {\n        return texts.join(', ')\n      }\n      return `${texts.length} selected`\n    }\n    // Single-select: show the value's text.\n    // Empty-string values are already handled by the `!hasValue` guard above;\n    // this null check also narrows `Value | null` down to `Value`.\n    const value = comboboxContext.value\n    if (value == null) return ''\n\n    const text = getValueText(value)\n    if (text !== undefined) return text\n    // Fall back to resolved label or serialized value\n    return (\n      resolveLabel(value, comboboxContext.itemToStringLabel) ||\n      stringifyAsValue(value, comboboxContext.itemToStringValue)\n    )\n  }, [\n    hasValue,\n    comboboxContext.multiple,\n    comboboxContext.value,\n    comboboxContext.values,\n    comboboxContext.itemToStringLabel,\n    comboboxContext.itemToStringValue,\n    getValueText,\n  ])\n\n  // Determine the display value for the input\n  // When closed: show selected value's text\n  // When open: show the search/filter text (inputValue)\n  const displayValue = React.useMemo(() => {\n    if (!open) {\n      // When closed, show the selected value's label\n      return selectedLabel\n    }\n    // When open, use the input value for filtering\n    return comboboxContext.inputValue\n  }, [open, selectedLabel, comboboxContext.inputValue])\n\n  return {\n    hasValue,\n    displayValue,\n    selectedLabel,\n    getValueText,\n  }\n}\n"]}

package/dist/combobox/index.d.cts

@@ -1,15 +1,15 @@
-import { V as VirtualItem } from '../ListboxStore-BtcTXpzi.cjs';
-export { F as ComboboxFilterFn, I as ComboboxItemRegistration, b as ComboboxStore, L as ComboboxStoreContext, a as ComboboxStoreState } from '../ListboxStore-BtcTXpzi.cjs';
-import { P as PopupMenuDebugOptions, a as PopupMenuRootActions, n as PopupMenuSurface, J as PopupMenuSurfaceProps, b as PopupMenuArrow, c as PopupMenuBackdrop, d as PopupMenuEmpty, e as PopupMenuGroup, f as PopupMenuGroupLabel, g as PopupMenuIcon, h as PopupMenuList, i as PopupMenuPopup, j as PopupMenuPortal, k as PopupMenuScrollDownArrow, l as PopupMenuScrollUpArrow, m as PopupMenuSeparator } from '../separator-BzYYn73e.cjs';
-export { o as ComboboxArrowProps, p as ComboboxBackdropProps, q as ComboboxEmptyProps, r as ComboboxEmptyState, s as ComboboxGroupLabelProps, t as ComboboxGroupLabelState, u as ComboboxGroupProps, v as ComboboxGroupState, w as ComboboxIconProps, x as ComboboxIconState, y as ComboboxListChildrenState, L as ComboboxListCssVars, z as ComboboxListProps, A as ComboboxListState, B as ComboboxPopupProps, C as ComboboxPortalProps, M as ComboboxPositionerCssVars, D as ComboboxScrollArrowProps, E as ComboboxScrollArrowState, F as ComboboxScrollDownArrowProps, G as ComboboxScrollUpArrowProps, H as ComboboxSeparatorProps, I as ComboboxSeparatorState, K as ComboboxSurfaceState } from '../separator-BzYYn73e.cjs';
+import { V as VirtualItem } from '../ListboxStore-DcAFvpEj.cjs';
+export { F as ComboboxFilterFn, I as ComboboxItemRegistration, b as ComboboxStore, L as ComboboxStoreContext, a as ComboboxStoreState } from '../ListboxStore-DcAFvpEj.cjs';
+import { P as PopupMenuDebugOptions, a as PopupMenuRootActions, n as PopupMenuSurface, J as PopupMenuSurfaceProps, b as PopupMenuArrow, c as PopupMenuBackdrop, d as PopupMenuEmpty, e as PopupMenuGroup, f as PopupMenuGroupLabel, g as PopupMenuIcon, h as PopupMenuList, i as PopupMenuPopup, j as PopupMenuPortal, k as PopupMenuScrollDownArrow, l as PopupMenuScrollUpArrow, m as PopupMenuSeparator } from '../separator-DACt2Z4S.cjs';
+export { o as ComboboxArrowProps, p as ComboboxBackdropProps, q as ComboboxEmptyProps, r as ComboboxEmptyState, s as ComboboxGroupLabelProps, t as ComboboxGroupLabelState, u as ComboboxGroupProps, v as ComboboxGroupState, w as ComboboxIconProps, x as ComboboxIconState, y as ComboboxListChildrenState, L as ComboboxListCssVars, z as ComboboxListProps, A as ComboboxListState, B as ComboboxPopupProps, C as ComboboxPortalProps, M as ComboboxPositionerCssVars, D as ComboboxScrollArrowProps, E as ComboboxScrollArrowState, F as ComboboxScrollDownArrowProps, G as ComboboxScrollUpArrowProps, H as ComboboxSeparatorProps, I as ComboboxSeparatorState, K as ComboboxSurfaceState } from '../separator-DACt2Z4S.cjs';
 import * as React from 'react';
 import { C as ComponentProps } from '../types-DT4FOOa2.cjs';
 import { PopoverPositionerProps, Popover, PopoverRootProps } from '@base-ui/react/popover';
-import { I as ItemEqualityComparer } from '../item-equality-B6TbXlBT.cjs';
+import { I as ItemEqualityComparer, a as Items } from '../items-B6HeFO_8.cjs';
 import { C as ChangeEventDetails, t as triggerPress, e as escapeKey, o as outsidePress, f as focusOut, i as itemPress, h as inputChange, j as inputClear, l as listNavigation, g as imperativeAction, n as none, G as GenericEventDetails, p as pointer, k as keyboard } from '../events-BPr8sRGH.cjs';
-export { S as SurfaceContextValue, c as commandScore, d as defaultFilter, u as useMaybeSurfaceContext, a as useSurfaceContext } from '../command-score-YjNr3ZWi.cjs';
+export { S as SurfaceContextValue, c as commandScore, d as defaultFilter, u as useMaybeSurfaceContext, a as useSurfaceContext } from '../command-score-CEqnuMqW.cjs';
 import '@base-ui/utils/store';
-import '../types-Cggz7pEl.cjs';
+import '../types-w3v6Vp8X.cjs';
 
 interface ComboboxClearState extends Record<string, unknown> {
     /**
@@ -229,8 +229,11 @@ interface ComboboxItemProps<Value = unknown> extends ComponentProps<'div', Combo
     /**
      * The value of this item. Required and must be unique within the Combobox.
      * Can be a primitive or an object.
+     *
+     * Pass `null` to render a clearable item: selecting it clears the selection
+     * and its label is used as the input placeholder (Base UI parity).
      */
-    value: Value;
+    value: Value | null;
     /**
      * Text value to use for display in the input when this item is selected.
      * If not provided, the text content of the item will be used.
@@ -390,7 +393,7 @@ interface ComboboxPositionerProps extends PopoverPositionerProps {
  *
  * Renders a `<div>` element.
  */
-declare const ComboboxPositioner: React.ForwardRefExoticComponent<ComboboxPositionerProps & React.RefAttributes<HTMLDivElement>>;
+declare const ComboboxPositioner: React.ForwardRefExoticComponent<Omit<ComboboxPositionerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare namespace ComboboxPositioner {
     type Props = ComboboxPositionerProps;
     type State = Popover.Positioner.State;
@@ -456,6 +459,9 @@ interface ComboboxRootProps<Value = unknown, Multiple extends boolean | undefine
     defaultValue?: ComboboxValueType<Value, Multiple>;
     /**
      * Callback when the selected value changes (single-select mode).
+     *
+     * Note: when a clearable (`null`) item is selected, this is called with
+     * `null` at runtime. If you use `null` items, handle that case.
      */
     onValueChange?: (value: Value) => void;
     /**
@@ -542,23 +548,23 @@ interface ComboboxRootProps<Value = unknown, Multiple extends boolean | undefine
      * When specified, the input shows the label of the selected item
      * instead of the raw value.
      *
-     * Can be a record mapping values to labels, or an array of { value, label } objects.
+     * Can be a record mapping values to labels, or an array of
+     * `{ value, label, keywords? }` objects. Only the array form can express
+     * `keywords` (extra filter terms) or a `null` (clearable) value.
      * @example
      * ```tsx
      * // Record format
      * <Combobox.Root items={{ us: 'United States', uk: 'United Kingdom' }}>
      *
-     * // Array format
+     * // Array format (supports keywords and a null clearable item)
      * <Combobox.Root items={[
-     *   { value: 'us', label: 'United States' },
+     *   { value: null, label: 'Select a country' },
+     *   { value: 'us', label: 'United States', keywords: ['america', 'usa'] },
      *   { value: 'uk', label: 'United Kingdom' },
      * ]}>
      * ```
      */
-    items?: Record<string, React.ReactNode> | Array<{
-        value: string;
-        label: React.ReactNode;
-    }>;
+    items?: Items;
     /**
      * Determines if the combobox enters a modal state when open.
      *
@@ -902,7 +908,7 @@ interface ComboboxContextValue<Value = unknown> {
     /** Current selected values (multi-select mode) */
     values: Value[];
     /** Callback when value changes (single-select mode) */
-    onValueChange: (value: Value) => void;
+    onValueChange: (value: Value | null) => void;
     /** Callback when values change (multi-select mode) */
     onValuesChange: (values: Value[]) => void;
     /**
@@ -947,12 +953,10 @@ interface ComboboxContextValue<Value = unknown> {
     /**
      * Data structure of the items for label resolution.
      * Used to display labels before items mount (e.g., on initial render with defaultValue).
-     * Can be a record mapping values to labels, or an array of { value, label } objects.
+     * Can be a record mapping values to labels, or an array of
+     * `{ value, label, keywords? }` objects.
      */
-    items?: Record<string, React.ReactNode> | Array<{
-        value: string;
-        label: React.ReactNode;
-    }>;
+    items?: Items;
     /** ID for the listbox element */
     listId: string;
     /** Ref to the input element (also serves as anchor) */
@@ -1016,7 +1020,7 @@ interface ComboboxItemContextValue<Value = unknown> {
     /** Unique ID for the item element */
     id: string;
     /** The item's value */
-    value: Value;
+    value: Value | null;
     /** The text value/label for this item */
     textValue: string | undefined;
     /** Whether the item is highlighted (via keyboard or pointer) */

package/dist/combobox/index.d.ts

@@ -1,15 +1,15 @@
-import { V as VirtualItem } from '../ListboxStore-DPqpLlAL.js';
-export { F as ComboboxFilterFn, I as ComboboxItemRegistration, b as ComboboxStore, L as ComboboxStoreContext, a as ComboboxStoreState } from '../ListboxStore-DPqpLlAL.js';
-import { P as PopupMenuDebugOptions, a as PopupMenuRootActions, n as PopupMenuSurface, J as PopupMenuSurfaceProps, b as PopupMenuArrow, c as PopupMenuBackdrop, d as PopupMenuEmpty, e as PopupMenuGroup, f as PopupMenuGroupLabel, g as PopupMenuIcon, h as PopupMenuList, i as PopupMenuPopup, j as PopupMenuPortal, k as PopupMenuScrollDownArrow, l as PopupMenuScrollUpArrow, m as PopupMenuSeparator } from '../separator-C9c1Jo6A.js';
-export { o as ComboboxArrowProps, p as ComboboxBackdropProps, q as ComboboxEmptyProps, r as ComboboxEmptyState, s as ComboboxGroupLabelProps, t as ComboboxGroupLabelState, u as ComboboxGroupProps, v as ComboboxGroupState, w as ComboboxIconProps, x as ComboboxIconState, y as ComboboxListChildrenState, L as ComboboxListCssVars, z as ComboboxListProps, A as ComboboxListState, B as ComboboxPopupProps, C as ComboboxPortalProps, M as ComboboxPositionerCssVars, D as ComboboxScrollArrowProps, E as ComboboxScrollArrowState, F as ComboboxScrollDownArrowProps, G as ComboboxScrollUpArrowProps, H as ComboboxSeparatorProps, I as ComboboxSeparatorState, K as ComboboxSurfaceState } from '../separator-C9c1Jo6A.js';
+import { V as VirtualItem } from '../ListboxStore-Be-isU6l.js';
+export { F as ComboboxFilterFn, I as ComboboxItemRegistration, b as ComboboxStore, L as ComboboxStoreContext, a as ComboboxStoreState } from '../ListboxStore-Be-isU6l.js';
+import { P as PopupMenuDebugOptions, a as PopupMenuRootActions, n as PopupMenuSurface, J as PopupMenuSurfaceProps, b as PopupMenuArrow, c as PopupMenuBackdrop, d as PopupMenuEmpty, e as PopupMenuGroup, f as PopupMenuGroupLabel, g as PopupMenuIcon, h as PopupMenuList, i as PopupMenuPopup, j as PopupMenuPortal, k as PopupMenuScrollDownArrow, l as PopupMenuScrollUpArrow, m as PopupMenuSeparator } from '../separator-BncOmTUq.js';
+export { o as ComboboxArrowProps, p as ComboboxBackdropProps, q as ComboboxEmptyProps, r as ComboboxEmptyState, s as ComboboxGroupLabelProps, t as ComboboxGroupLabelState, u as ComboboxGroupProps, v as ComboboxGroupState, w as ComboboxIconProps, x as ComboboxIconState, y as ComboboxListChildrenState, L as ComboboxListCssVars, z as ComboboxListProps, A as ComboboxListState, B as ComboboxPopupProps, C as ComboboxPortalProps, M as ComboboxPositionerCssVars, D as ComboboxScrollArrowProps, E as ComboboxScrollArrowState, F as ComboboxScrollDownArrowProps, G as ComboboxScrollUpArrowProps, H as ComboboxSeparatorProps, I as ComboboxSeparatorState, K as ComboboxSurfaceState } from '../separator-BncOmTUq.js';
 import * as React from 'react';
 import { C as ComponentProps } from '../types-DT4FOOa2.js';
 import { PopoverPositionerProps, Popover, PopoverRootProps } from '@base-ui/react/popover';
-import { I as ItemEqualityComparer } from '../item-equality-B6TbXlBT.js';
+import { I as ItemEqualityComparer, a as Items } from '../items-B6HeFO_8.js';
 import { C as ChangeEventDetails, t as triggerPress, e as escapeKey, o as outsidePress, f as focusOut, i as itemPress, h as inputChange, j as inputClear, l as listNavigation, g as imperativeAction, n as none, G as GenericEventDetails, p as pointer, k as keyboard } from '../events-BPr8sRGH.js';
-export { S as SurfaceContextValue, c as commandScore, d as defaultFilter, u as useMaybeSurfaceContext, a as useSurfaceContext } from '../command-score-Dgo3ZS3Z.js';
+export { S as SurfaceContextValue, c as commandScore, d as defaultFilter, u as useMaybeSurfaceContext, a as useSurfaceContext } from '../command-score-JZy7Snbk.js';
 import '@base-ui/utils/store';
-import '../types-M2vBIhdB.js';
+import '../types-BtG9pIR2.js';
 
 interface ComboboxClearState extends Record<string, unknown> {
     /**
@@ -229,8 +229,11 @@ interface ComboboxItemProps<Value = unknown> extends ComponentProps<'div', Combo
     /**
      * The value of this item. Required and must be unique within the Combobox.
      * Can be a primitive or an object.
+     *
+     * Pass `null` to render a clearable item: selecting it clears the selection
+     * and its label is used as the input placeholder (Base UI parity).
      */
-    value: Value;
+    value: Value | null;
     /**
      * Text value to use for display in the input when this item is selected.
      * If not provided, the text content of the item will be used.
@@ -390,7 +393,7 @@ interface ComboboxPositionerProps extends PopoverPositionerProps {
  *
  * Renders a `<div>` element.
  */
-declare const ComboboxPositioner: React.ForwardRefExoticComponent<ComboboxPositionerProps & React.RefAttributes<HTMLDivElement>>;
+declare const ComboboxPositioner: React.ForwardRefExoticComponent<Omit<ComboboxPositionerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare namespace ComboboxPositioner {
     type Props = ComboboxPositionerProps;
     type State = Popover.Positioner.State;
@@ -456,6 +459,9 @@ interface ComboboxRootProps<Value = unknown, Multiple extends boolean | undefine
     defaultValue?: ComboboxValueType<Value, Multiple>;
     /**
      * Callback when the selected value changes (single-select mode).
+     *
+     * Note: when a clearable (`null`) item is selected, this is called with
+     * `null` at runtime. If you use `null` items, handle that case.
      */
     onValueChange?: (value: Value) => void;
     /**
@@ -542,23 +548,23 @@ interface ComboboxRootProps<Value = unknown, Multiple extends boolean | undefine
      * When specified, the input shows the label of the selected item
      * instead of the raw value.
      *
-     * Can be a record mapping values to labels, or an array of { value, label } objects.
+     * Can be a record mapping values to labels, or an array of
+     * `{ value, label, keywords? }` objects. Only the array form can express
+     * `keywords` (extra filter terms) or a `null` (clearable) value.
      * @example
      * ```tsx
      * // Record format
      * <Combobox.Root items={{ us: 'United States', uk: 'United Kingdom' }}>
      *
-     * // Array format
+     * // Array format (supports keywords and a null clearable item)
      * <Combobox.Root items={[
-     *   { value: 'us', label: 'United States' },
+     *   { value: null, label: 'Select a country' },
+     *   { value: 'us', label: 'United States', keywords: ['america', 'usa'] },
      *   { value: 'uk', label: 'United Kingdom' },
      * ]}>
      * ```
      */
-    items?: Record<string, React.ReactNode> | Array<{
-        value: string;
-        label: React.ReactNode;
-    }>;
+    items?: Items;
     /**
      * Determines if the combobox enters a modal state when open.
      *
@@ -902,7 +908,7 @@ interface ComboboxContextValue<Value = unknown> {
     /** Current selected values (multi-select mode) */
     values: Value[];
     /** Callback when value changes (single-select mode) */
-    onValueChange: (value: Value) => void;
+    onValueChange: (value: Value | null) => void;
     /** Callback when values change (multi-select mode) */
     onValuesChange: (values: Value[]) => void;
     /**
@@ -947,12 +953,10 @@ interface ComboboxContextValue<Value = unknown> {
     /**
      * Data structure of the items for label resolution.
      * Used to display labels before items mount (e.g., on initial render with defaultValue).
-     * Can be a record mapping values to labels, or an array of { value, label } objects.
+     * Can be a record mapping values to labels, or an array of
+     * `{ value, label, keywords? }` objects.
      */
-    items?: Record<string, React.ReactNode> | Array<{
-        value: string;
-        label: React.ReactNode;
-    }>;
+    items?: Items;
     /** ID for the listbox element */
     listId: string;
     /** Ref to the input element (also serves as anchor) */
@@ -1016,7 +1020,7 @@ interface ComboboxItemContextValue<Value = unknown> {
     /** Unique ID for the item element */
     id: string;
     /** The item's value */
-    value: Value;
+    value: Value | null;
     /** The text value/label for this item */
     textValue: string | undefined;
     /** Whether the item is highlighted (via keyboard or pointer) */

package/dist/combobox/index.js

@@ -1,2 +1,2 @@
-import{a as Io,b as yo,c as So,d as vo}from"../chunk-AVZ64JQ3.js";import{$ as uo,L as no,N as ro,P as ao,Qa as ho,R as so,Ra as Ro,S as O,Sa as Po,T as pt,_ as lo,aa as ct,da as io,ea as po,f as to,fa as co,ha as j,ia as F,ja as mo,l as pe,oa as bo,qa as mt,sa as xo,wa as fo,xa as Co,ya as go}from"../chunk-WKAPAKUL.js";import{a as _,o as at,p as st,v as lt,w as ut,x as it}from"../chunk-KWGD24VS.js";import{a as rt}from"../chunk-4C666HHU.js";var Ho={};rt(Ho,{Arrow:()=>ro,Backdrop:()=>ao,Clear:()=>ye,Empty:()=>bo,Group:()=>ho,GroupLabel:()=>Ro,Icon:()=>mo,Input:()=>Ve,InputWrapper:()=>Me,Item:()=>Ee,ItemIndicator:()=>Le,ItemLabel:()=>we,List:()=>xo,Popup:()=>lo,Portal:()=>uo,Positioner:()=>Te,Root:()=>ke,ScrollDownArrow:()=>Co,ScrollUpArrow:()=>fo,Separator:()=>Po,Surface:()=>He,useComboboxPositionerContext:()=>Se});import{useRender as bt}from"@base-ui/react/use-render";import*as X from"react";var Vo={slot:"bazzaui-combobox-clear"};var ye=X.forwardRef(function(e,t){let{keepMounted:a=!1,disabled:n,render:r,className:c,style:d,onClick:o,...i}=e,p=O(),f=n??p.disabled,m=p.multiple?p.values.length>0:p.value!=="",y=X.useCallback(R=>{o?.(R),!R.defaultPrevented&&(p.multiple?p.onValuesChange([]):p.onValueChange(""),p.onInputValueChange(""))},[o,p]),u=X.useCallback(R=>{R.preventDefault()},[]),C=X.useMemo(()=>({hasValue:m,disabled:f}),[m,f]),b=bt({render:r,ref:t,state:C,props:{...i,[Vo.slot]:"",type:"button",tabIndex:-1,"aria-label":"Clear selection",disabled:f||!m,className:c,style:d,onClick:y,onPointerDown:u},enabled:a||m,defaultTagName:"button"});return!a&&!m?null:b});import*as ce from"react";var me=ce.createContext(null);function Se(){return ce.useContext(me)}import{useRender as xt}from"@base-ui/react/use-render";import*as ee from"react";import*as be from"react";var ve=be.createContext(!1);function Mo(){return be.useContext(ve)}var Q={slot:"bazzaui-combobox-input",open:"data-open",closed:"data-closed",disabled:"data-disabled",placeholder:"data-placeholder"};import*as re from"react";function dt(l,e){if(!l)return;if(Array.isArray(l)){let n=l.find(r=>r.value===e)?.label;return typeof n=="string"?n:void 0}let t=l[e];return typeof t=="string"?t:void 0}function Eo(l){let{comboboxContext:e,open:t}=l,a=e.multiple?e.values.length>0:e.value!=null,n=re.useCallback(d=>{let o=F(d,e.itemToStringValue),i=e.itemTextRegistry.get(o);if(i!==void 0)return i;let p=dt(e.items,o);if(p!==void 0)return p;let f=j(d,e.itemToStringLabel);if(f&&f!==o)return f},[e.itemTextRegistry,e.items,e.itemToStringLabel,e.itemToStringValue]),r=re.useMemo(()=>{if(!a)return"";if(e.multiple){let i=e.values.map(p=>{let f=n(p);return f!==void 0?f:j(p,e.itemToStringLabel)||F(p,e.itemToStringValue)}).filter(Boolean);return i.length<=2?i.join(", "):`${i.length} selected`}let d=e.value;if(d==null)return"";let o=n(d);return o!==void 0?o:j(d,e.itemToStringLabel)||F(d,e.itemToStringValue)},[a,e.multiple,e.value,e.values,e.itemToStringLabel,e.itemToStringValue,n]),c=re.useMemo(()=>t?e.inputValue:r,[t,r,e.inputValue]);return{hasValue:a,displayValue:c,selectedLabel:r,getValueText:n}}import*as T from"react";function Lo(l){let{comboboxContext:e,store:t,focusOwnerStore:a,open:n,disabled:r,cursorBehavior:c,hasValue:d,getValueText:o,onFocus:i,onBlur:p,onClick:f,onKeyDown:m}=l,y=T.useRef(!1),u=T.useRef(!1),C=T.useRef(!1),b=T.useRef(null),R=T.useRef(null),I=T.useRef(null);T.useEffect(()=>{if(!n)return;let s=x=>{let E=e.inputRef.current,v=e.inputWrapperRef.current,L=document.getElementById(e.listId),A=x.target,P=E?.contains(A),B=v?.contains(A),G=L?.contains(A);!P&&!B&&!G&&(I.current=x)};return document.addEventListener("pointerdown",s,!0),()=>{document.removeEventListener("pointerdown",s,!0),I.current=null}},[n,e.inputRef,e.inputWrapperRef,e.listId]),T.useLayoutEffect(()=>{let s=e.inputRef.current;if(s&&n&&R.current){let{start:x,end:E}=R.current,v=s.selectionStart,L=s.value.length;v===L&&x!==L&&s.setSelectionRange(x,E),R.current=null}});let S=T.useRef(n);T.useLayoutEffect(()=>{if(n&&!S.current){if(y.current){y.current=!1,S.current=n;return}if(C.current){C.current=!1,u.current=!1,b.current=null,S.current=n;return}if(u.current&&c==="none"){let x=e.inputRef.current,E=b.current;x&&E!==null&&requestAnimationFrame(()=>{let v=x.value.length,L=Math.min(E,v);x.setSelectionRange(L,L)}),u.current=!1,b.current=null,S.current=n;return}d&&e.multiple&&e.onInputValueChange("");let s=e.inputRef.current;if(s){let x=s.value.length;c==="select-all"&&x>0?requestAnimationFrame(()=>{s.setSelectionRange(0,s.value.length)}):c==="end"&&x>0&&requestAnimationFrame(()=>{s.setSelectionRange(s.value.length,s.value.length)})}}S.current=n},[n,e,d,c]);let V=T.useCallback(s=>{let x=s.target,E=x.value,v=x.selectionStart,L=x.selectionEnd;v!==null&&L!==null&&(R.current={start:v,end:L}),e.onInputValueChange(E),e.setFilterActive(),t.setSearch(E),t.state.open||(y.current=!0,e.openCombobox())},[e,t]),D=T.useCallback(s=>{if(i?.(s),s.defaultPrevented)return;let x=t.state.open;if(x&&(C.current=!0),e.openOnFocus&&!r&&!x){if(d&&!e.multiple){let E=o(e.value)??j(e.value,e.itemToStringLabel);e.onInputValueChange(E)}e.openCombobox()}},[i,e,r,t,d,o]),z=T.useCallback(s=>{p?.(s),!s.defaultPrevented&&requestAnimationFrame(()=>{let x=document.activeElement,v=document.getElementById(e.listId)?.contains(x),L=x===e.inputRef.current;if(!v&&!L){C.current=!1;let A=I.current,P=A?_.outsidePress:_.focusOut;I.current=null,e.closeCombobox(P,A??void 0)}})},[p,e]),H=T.useCallback(s=>{if(f?.(s),s.defaultPrevented)return;let x=t.state.open;if(!r&&!x){let E=s.target;if(c==="none"){let v=E.selectionStart;b.current=v,u.current=!0}if(d&&!e.multiple){let v=o(e.value)??j(e.value,e.itemToStringLabel);e.onInputValueChange(v)}e.openCombobox()}else x&&(C.current=!0)},[f,e,r,t,c,d,o]),N=T.useCallback(s=>{if(m?.(s),!s.defaultPrevented){if(n&&s.key==="Escape"){s.preventDefault(),e.closeCombobox(_.escapeKey);return}if(!n&&(s.key==="ArrowDown"||s.key==="ArrowUp"||s.key==="Enter")){if(s.preventDefault(),d&&!e.multiple){let x=o(e.value)??j(e.value,e.itemToStringLabel);e.onInputValueChange(x)}e.openCombobox();return}}},[n,e,m,d,o]),{handleKeyDown:M}=co({store:t,surfaceId:"combobox-input",focusOwnerStore:a,depth:0,submenuContext:null,subpageContext:null,enabled:n,enableTypeToSearch:!1,onKeyDown:N,closeAll:e.closeCombobox,skipFocusOwnerCheck:!0});return{handleChange:V,handleFocus:D,handleBlur:z,handleClick:H,handleKeyDown:M,selectionRef:R}}var Ve=ee.forwardRef(function(e,t){let{placeholder:a,disabled:n,cursorBehavior:r="none",render:c,className:d,style:o,onFocus:i,onBlur:p,onClick:f,onKeyDown:m,...y}=e,u=O(),C=pe(),b=to(),R=Mo(),I=(n??u.disabled)||C.disabled,S=a??u.placeholder,V=C.store.useState("open"),{hasValue:D,displayValue:z,getValueText:H}=Eo({comboboxContext:u,open:V}),{handleChange:N,handleFocus:M,handleBlur:s,handleClick:x,handleKeyDown:E}=Lo({comboboxContext:u,store:C.store,focusOwnerStore:b,open:V,disabled:I,cursorBehavior:r,hasValue:D,getValueText:H,onFocus:i,onBlur:p,onClick:f,onKeyDown:m}),v={[Q.slot]:""};V?v[Q.open]="":v[Q.closed]="",I&&(v[Q.disabled]=""),D||(v[Q.placeholder]=""),u.layout==="input-embedded"&&(v["data-input-embedded"]="");let L=ee.useCallback(G=>{u.setInputElement(G),typeof t=="function"?t(G):t&&(t.current=G)},[t,u]),A=ee.useMemo(()=>({open:V,disabled:I,placeholder:!D}),[V,I,D]),P=u.layout==="input-embedded"&&!R?{position:"relative",zIndex:1}:void 0;return xt({render:c,ref:L,state:A,props:{...y,...v,type:"text",role:"combobox","aria-autocomplete":"list","aria-expanded":V,"aria-controls":u.listId,"aria-haspopup":"listbox",autoComplete:"off",autoCorrect:"off",spellCheck:!1,disabled:I,placeholder:D?void 0:S,className:d,style:{...P,...o},value:z,onChange:N,onFocus:M,onBlur:s,onClick:x,onKeyDown:E},defaultTagName:"input"})});import{useRender as ft}from"@base-ui/react/use-render";import*as oe from"react";var de={slot:"bazzaui-combobox-input-wrapper",open:"data-open"};import{jsx as gt}from"react/jsx-runtime";var Ct={open:l=>l?{[de.open]:""}:null},Me=oe.forwardRef(function(e,t){let{render:a,className:n,style:r,children:c,...d}=e,{store:o}=pe(),i=O(),p=o.useState("open"),f=oe.useMemo(()=>({open:p}),[p]),m=i.layout==="input-embedded"?{position:"relative",zIndex:1}:{position:"relative"},y=oe.useCallback(C=>{i.setInputWrapperElement(C),typeof t=="function"?t(C):t&&(t.current=C)},[t,i]),u=ft({render:a,ref:y,state:f,stateAttributesMapping:Ct,props:{...d,[de.slot]:"",className:n,style:{...m,...r},children:c},defaultTagName:"div"});return gt(ve.Provider,{value:!0,children:u})});import{useRender as Rt}from"@base-ui/react/use-render";import*as w from"react";var te={slot:"bazzaui-combobox-item",highlighted:"data-highlighted",disabled:"data-disabled",selected:"data-selected"};import*as ae from"react";var xe=ae.createContext(null);function se(){let l=ae.useContext(xe);if(!l)throw new Error("ComboboxItem child components must be used within a Combobox.Item");return l}function ht(){return ae.useContext(xe)}import{jsx as St}from"react/jsx-runtime";var Pt={highlighted:l=>l?{[te.highlighted]:""}:null,disabled:l=>l?{[te.disabled]:""}:null,selected:l=>l?{[te.selected]:""}:null};function It(l,e){if(l)return Array.isArray(l)?l.find(a=>a.value===e)?.label:l[e]}function yt(l,e){let{value:t,textValue:a,keywords:n,disabled:r=!1,onSelect:c,forceMount:d=!1,render:o,className:i,style:p,onClick:f,onPointerDown:m,onPointerMove:y,children:u,...C}=l,b=O(),R=w.useMemo(()=>F(t,b.itemToStringValue),[t,b.itemToStringValue]),I=w.useMemo(()=>It(b.items,R),[b.items,R]),S=w.useMemo(()=>j(t,b.itemToStringLabel),[t,b.itemToStringLabel]),V=w.useMemo(()=>{if(a!==void 0)return a;if(typeof I=="string")return I;if(S&&S!==R)return S},[a,I,S,R]),D=w.useMemo(()=>{let P=typeof I=="string"?I:S&&S!==R?S:void 0;return P?n?n.includes(P)?n:[...n,P]:[P]:n},[n,I,S,R]),z=w.useRef(V),H=b.multiple?So(b.values,t,b.isItemEqualToValue):b.value!=null&&yo(b.value,t,b.isItemEqualToValue),N=b.closeOnSelect,M=po({value:R,keywords:D,disabled:r,forceMount:d,closeOnClick:N,children:u});w.useEffect(()=>{let P=()=>{if(!r){if(b.multiple){let B=H?vo(b.values,t,b.isItemEqualToValue):[...b.values,t];b.onValuesChange(B)}else b.onValueChange(t);c?.()}};return M.registerSelect(P)},[r,b,t,H,c,M]),w.useEffect(()=>{let P=z.current;if(P)return b.registerItemText(R,P)},[R,b]),w.useEffect(()=>{!V&&typeof u=="string"&&(z.current=u,b.registerItemText(R,u))},[u,V,R,b]);let s=w.useMemo(()=>({highlighted:M.isHighlighted,disabled:r,selected:H}),[M.isHighlighted,r,H]),x=w.useMemo(()=>({id:M.id,value:t,textValue:V,highlighted:M.isHighlighted,disabled:r,selected:H}),[M.id,t,V,M.isHighlighted,r,H]),E=w.useCallback(P=>{f?.(P),P.defaultPrevented||M.handlers.onClick(P)},[f,M.handlers]),v=w.useCallback(P=>{M.handlers.onPointerDown(P),m?.(P)},[M.handlers,m]),L=w.useCallback(P=>{y?.(P),P.defaultPrevented||M.handlers.onPointerMove(P)},[y,M.handlers]),A=Rt({render:o,ref:[M.ref,e],state:s,stateAttributesMapping:Pt,props:{...C,[te.slot]:"",id:M.id,role:"option",tabIndex:-1,"aria-selected":H,"aria-disabled":r||void 0,className:i,style:p,onClick:E,onPointerMove:L,onPointerDown:v,children:u},enabled:M.isVisible,defaultTagName:"div"});return M.isVisible?St(xe.Provider,{value:x,children:A}):null}var Ee=w.forwardRef(yt);import{useRender as vt}from"@base-ui/react/use-render";import*as Ce from"react";var fe={slot:"bazzaui-combobox-item-indicator",selected:"data-selected"};var Vt={selected:l=>l?{[fe.selected]:""}:null},Le=Ce.forwardRef(function(e,t){let{keepMounted:a=!1,render:n,className:r,style:c,...d}=e,o=se(),i=Ce.useMemo(()=>({selected:o.selected}),[o.selected]),p=vt({render:n,ref:t,state:i,stateAttributesMapping:Vt,props:{...d,[fe.slot]:"","aria-hidden":!0,className:r,style:c},enabled:a||o.selected,defaultTagName:"span"});return!a&&!o.selected?null:p});import{useRender as Mt}from"@base-ui/react/use-render";import*as Y from"react";var wo={slot:"bazzaui-combobox-item-label"};function Et(l,e){if(l)return Array.isArray(l)?l.find(a=>a.value===e)?.label:l[e]}var we=Y.forwardRef(function(e,t){let{render:a,className:n,style:r,children:c,...d}=e,o=O(),i=se(),p=F(i.value,o.itemToStringValue),f=Y.useMemo(()=>{if(c!==void 0)return c;let y=Et(o.items,p);return y!==void 0?y:i.textValue!==void 0?i.textValue:p},[c,o.items,p,i.textValue]),m=Y.useMemo(()=>({value:p,selected:i.selected,highlighted:i.highlighted,disabled:i.disabled}),[p,i.selected,i.highlighted,i.disabled]);return Y.useEffect(()=>{if(typeof f=="string")return o.registerItemText(p,f)},[f,o,p]),Mt({render:a,ref:t,state:m,props:{...d,[wo.slot]:"",className:n,style:r,children:f},defaultTagName:"span"})});import{Popover as To}from"@base-ui/react/popover";import*as U from"react";var ge={slot:"bazzaui-combobox-positioner"};import{jsx as le}from"react/jsx-runtime";function Lt(l,e,t,a){let n=t+a*2;if(l==="top"){let d=-(e+a),o=e+a;return{width:n,marginBottom:d,paddingTop:a,paddingLeft:a,paddingRight:a,paddingBottom:o}}let r=-(e+a),c=e+a;return{width:n,marginTop:r,paddingTop:c,paddingLeft:a,paddingRight:a,paddingBottom:a}}var Te=U.forwardRef(function(e,t){let{layout:a,popupPadding:n=8,side:r="bottom",align:c,sideOffset:d=4,anchor:o,className:i,style:p,children:f,...m}=e,y=O(),u=a??y.layout,C=u==="input-embedded",b=o??y.inputWrapperRef.current?y.inputWrapperRef:y.inputRef,R=C?0:d,I=C?"center":c??"start",{inputHeight:S,inputWidth:V}=y,D=V+n*2,z={...p,...C?{zIndex:0}:{}};if(C)return le(To.Positioner,{ref:t,side:r,align:I,sideOffset:R,anchor:b,className:i,style:z,"data-input-embedded":"",[ge.slot]:"",...m,render:(s,x)=>{let E=x.side,v={layout:u,side:E,align:x.align,inputHeight:y.inputHeight},L={"--combobox-input-height":`${S}px`,"--combobox-input-width":`${V}px`,"--combobox-popup-padding":`${n}px`,"--combobox-popup-width":`${D}px`},A=Lt(E,S,V,n),P=U.Children.map(f,B=>U.isValidElement(B)?U.cloneElement(B,{style:{...A,...B.props.style},"data-side":E}):B);return le(me.Provider,{value:v,children:le("div",{...s,style:{...s.style,...L},"data-side":E,children:P})})}});let H={layout:u,side:r,align:I,inputHeight:y.inputHeight},N={"--combobox-input-height":`${S}px`,"--combobox-input-width":`${V}px`},M={...z,...N};return le(me.Provider,{value:H,children:le(To.Positioner,{ref:t,side:r,align:I,sideOffset:R,anchor:b,className:i,style:M,[ge.slot]:"",...m,children:f})})});import{Popover as wt}from"@base-ui/react/popover";import*as g from"react";import{jsx as ue,jsxs as Tt}from"react/jsx-runtime";function ke(l){let{open:e,onOpenChange:t,actionsRef:a,defaultOpen:n=!1,value:r,defaultValue:c,onValueChange:d,multiple:o=!1,values:i,defaultValues:p,onValuesChange:f,isItemEqualToValue:m=Io,itemToStringLabel:y,itemToStringValue:u,inputValue:C,defaultInputValue:b="",onInputValueChange:R,name:I,form:S,required:V,disabled:D=!1,placeholder:z="Search...",items:H,modal:N=!1,closeOnSelect:M,openOnFocus:s=!0,virtualized:x=!1,virtualItems:E,onHighlightChange:v,layout:L="floating",onOpenChangeComplete:A,debug:P,children:B,...G}=l,Ae=g.useId(),ie=g.useRef(null),he=g.useRef(null),[Oe,De]=g.useState(0),[Fe,ze]=g.useState(0),Be=g.useCallback(h=>{if(ie.current=h,h&&!he.current){let k=h.getBoundingClientRect();De(k.height),ze(k.width)}},[]),We=g.useCallback(h=>{if(he.current=h,h){let k=h.getBoundingClientRect();De(k.height),ze(k.width)}},[]),{store:W,focusOwnerStore:No,openChainStore:qo,registerSurface:Uo,closeAll:Go,virtualization:Ko,handleOpenChange:je,disabled:K,setDisabled:Ne}=no({onOpenChange:t,defaultOpen:n,virtualized:x,items:E,onHighlightChange:v,disabled:D}),Re=g.useRef(null);g.useImperativeHandle(a,()=>({close:()=>{Re.current?.close()},unmount:()=>{Re.current?.unmount()},setDisabled:Ne}),[Ne]),W.useControlledProp("open",e,n);let $o=W.useState("open"),qe=g.useCallback((h,k,q)=>{K&&k!==_.imperativeAction||!h&&ie.current&&document.activeElement===ie.current||je(h,k,q)},[je,K]),Jo=g.useCallback(h=>{!h&&W.context.clearSearchOnClose==="after-exit"&&(W.clearSearch(),W.setInputActive(!1)),A?.(h)},[W,A]),Xo=g.useCallback((h,k)=>{qe(h,k.reason,k.event)},[qe]),[Qo,Yo]=g.useState(c!==void 0?c:null),$=r!==void 0?r:Qo,Ue=g.useCallback(h=>{r===void 0&&Yo(h),d?.(h)},[r,d]),[Zo,_o]=g.useState(p??[]),ne=i!==void 0?i:Zo,Ge=g.useCallback(h=>{i===void 0&&_o(h),f?.(h)},[i,f]),[Pe,et]=g.useState(b),Ke=C!==void 0?C:Pe,$e=g.useCallback(h=>{C===void 0&&et(h),R?.(h)},[C,R]),Je=g.useRef(new Map),Xe=g.useCallback((h,k)=>(Je.current.set(h,k),()=>{}),[]),Qe=M??!o,Ie=g.useRef({type:"active"}),[,ot]=g.useState({type:"active"}),J=g.useCallback(h=>{Ie.current=h,ot(h)},[]),Ye=Ie.current,Ze=g.useCallback(()=>{J({type:"active"})},[J]),_e=g.useCallback(()=>{K||(!o&&$!=null?J({type:"showAll"}):J({type:"active"}),W.setOpen(!0))},[K,W,o,$,J]),eo=g.useCallback((h,k)=>{let q=Ie.current,oo=q.type==="active"?Pe:q.type==="showAll"?"":q.search;J({type:"frozen",search:oo}),W.setOpen(!1,h,k)},[W,J,Pe]),tt=g.useMemo(()=>({multiple:o,value:$,values:ne,onValueChange:Ue,onValuesChange:Ge,isItemEqualToValue:m,itemToStringLabel:y,itemToStringValue:u,inputValue:Ke,onInputValueChange:$e,name:I,form:S,required:V,disabled:K,placeholder:z,items:H,itemTextRegistry:Je.current,registerItemText:Xe,listId:Ae,inputRef:ie,setInputElement:Be,inputWrapperRef:he,setInputWrapperElement:We,closeOnSelect:Qe,openOnFocus:s,openCombobox:_e,closeCombobox:eo,filterMode:Ye,setFilterActive:Ze,inputHeight:Oe,inputWidth:Fe,layout:L}),[o,$,ne,Ue,Ge,m,y,u,Ke,$e,I,S,V,K,z,H,Xe,Ae,Be,We,Qe,s,_e,eo,Ye,Ze,Oe,Fe,L]),nt=g.useMemo(()=>I?o?ne.length>0?ne.map((h,k)=>{let q=F(h,u);return ue("input",{type:"hidden",name:I,value:q,form:S,required:V&&k===0},q)}):ue("input",{type:"hidden",name:I,value:"",form:S,required:V}):ue("input",{type:"hidden",name:I,value:$!=null?F($,u):"",form:S,required:V}):null,[I,S,V,o,$,ne,u]);return ue(so.Provider,{value:tt,children:Tt(io,{store:W,focusOwnerStore:No,openChainStore:qo,disabled:K,depth:0,closeAll:Go,registerSurface:Uo,virtualization:Ko,menuType:"dropdown",componentName:"combobox",debug:P,children:[nt,ue(wt.Root,{...G,open:$o,onOpenChange:Xo,onOpenChangeComplete:Jo,modal:N,actionsRef:a?Re:void 0,children:B})]})})}import*as Z from"react";var ko={slot:"bazzaui-combobox-surface"};import{jsx as kt}from"react/jsx-runtime";var He=Z.forwardRef(function(e,t){let{autoHighlightFirst:a,search:n,onSearchChange:r,onPointerMove:c,...d}=e,o=O(),i=Z.useCallback(u=>{c?.(u);let C=o.inputRef.current;C&&document.activeElement!==C&&C.focus()},[c,o.inputRef]),p=Z.useMemo(()=>{let u=a??!0;if(u==="selected"){let C=o.multiple?o.values[0]:o.value;return C!=null?F(C,o.itemToStringValue):!0}return u},[a,o.multiple,o.value,o.values,o.itemToStringValue]),{filterMode:f}=o,m=n??(f.type==="active"?o.inputValue:f.type==="showAll"?"":f.search),y=Z.useCallback(u=>{o.onInputValueChange(u),r?.(u)},[o,r]);return kt(go,{ref:t,autoHighlightFirst:p,search:m,onSearchChange:y,onPointerMove:i,skipAutoFocus:!0,[ko.slot]:"",...d})});var Ao=(c=>(c.slot="bazzaui-combobox-arrow",c.open="data-open",c.closed="data-closed",c.side="data-side",c.align="data-align",c.uncentered="data-uncentered",c))(Ao||{});var Oo=(r=>(r.slot="bazzaui-combobox-backdrop",r.open="data-open",r.closed="data-closed",r.startingStyle="data-starting-style",r.endingStyle="data-ending-style",r))(Oo||{});var Do=(e=>(e.slot="bazzaui-combobox-empty",e))(Do||{});var Fo=(e=>(e.slot="bazzaui-combobox-group",e))(Fo||{});var zo=(e=>(e.slot="bazzaui-combobox-group-label",e))(zo||{});var Ht={slot:"bazzaui-combobox-icon",open:"data-popup-open"};var Bo=(t=>(t.slot="bazzaui-combobox-list",t.list="data-popup-menu-list",t))(Bo||{});var Wo=(m=>(m.slot="bazzaui-combobox-popup",m.open="data-open",m.closed="data-closed",m.side="data-side",m.align="data-align",m.startingStyle="data-starting-style",m.endingStyle="data-ending-style",m.instant="data-instant",m.focused="data-focused",m.hasOpenSubmenu="data-has-open-submenu",m.submenu="data-submenu",m.navigating="data-navigating",m))(Wo||{});var At={slotUp:"bazzaui-combobox-scroll-up-arrow",slotDown:"bazzaui-combobox-scroll-down-arrow",direction:"data-direction",side:"data-side"};var jo=(e=>(e.slot="bazzaui-combobox-separator",e))(jo||{});export{Ho as Combobox,Ao as ComboboxArrowDataAttributes,Oo as ComboboxBackdropDataAttributes,ye as ComboboxClear,Do as ComboboxEmptyDataAttributes,Fo as ComboboxGroupDataAttributes,zo as ComboboxGroupLabelDataAttributes,Ht as ComboboxIconDataAttributes,Ve as ComboboxInput,Q as ComboboxInputDataAttributes,Me as ComboboxInputWrapper,de as ComboboxInputWrapperDataAttributes,Ee as ComboboxItem,te as ComboboxItemDataAttributes,Le as ComboboxItemIndicator,fe as ComboboxItemIndicatorDataAttributes,we as ComboboxItemLabel,mt as ComboboxListCssVars,Bo as ComboboxListDataAttributes,Wo as ComboboxPopupDataAttributes,Te as ComboboxPositioner,ct as ComboboxPositionerCssVars,ge as ComboboxPositionerDataAttributes,ke as ComboboxRoot,At as ComboboxScrollArrowDataAttributes,jo as ComboboxSeparatorDataAttributes,it as ComboboxStore,He as ComboboxSurface,lt as commandScore,ut as defaultFilter,O as useComboboxContext,se as useComboboxItemContext,Se as useComboboxPositionerContext,pt as useMaybeComboboxContext,ht as useMaybeComboboxItemContext,st as useMaybeSurfaceContext,at as useSurfaceContext};
+import{a as yo,b as vo,c as Vo,d as Mo,e as Eo,f as te,g as Lo}from"../chunk-KO3DXT3Y.js";import{Ab as So,L as ro,La as uo,Ma as io,N as ao,Na as xt,P as so,Qa as po,R as lo,Ra as mo,S as D,Sa as co,T as dt,Ua as bo,Va as N,Wa as F,Xa as xo,Ya as Co,_a as Ct,ab as fo,eb as go,f as no,fb as ho,gb as Po,l as ce,yb as Io,zb as Ro}from"../chunk-2D2HREBK.js";import{a as oe,p as it,q as pt,w as mt,x as ct,y as bt}from"../chunk-ZPRKUVIC.js";import{a as ut}from"../chunk-4C666HHU.js";var Fo={};ut(Fo,{Arrow:()=>ao,Backdrop:()=>so,Clear:()=>ve,Empty:()=>Co,Group:()=>Io,GroupLabel:()=>Ro,Icon:()=>xo,Input:()=>Ee,InputWrapper:()=>Le,Item:()=>we,ItemIndicator:()=>Te,ItemLabel:()=>ke,List:()=>fo,Popup:()=>uo,Portal:()=>io,Positioner:()=>He,Root:()=>Oe,ScrollDownArrow:()=>ho,ScrollUpArrow:()=>go,Separator:()=>So,Surface:()=>De,useComboboxPositionerContext:()=>Ve});import{useRender as ft}from"@base-ui/react/use-render";import*as X from"react";var wo={slot:"bazzaui-combobox-clear"};var ve=X.forwardRef(function(e,t){let{keepMounted:p=!1,disabled:s,render:r,className:m,style:d,onClick:o,...l}=e,u=D(),C=s??u.disabled,b=u.multiple?u.values.length>0:u.value!=="",R=X.useCallback(P=>{o?.(P),!P.defaultPrevented&&(u.multiple?u.onValuesChange([]):u.onValueChange(""),u.onInputValueChange(""))},[o,u]),a=X.useCallback(P=>{P.preventDefault()},[]),f=X.useMemo(()=>({hasValue:b,disabled:C}),[b,C]),c=ft({render:r,ref:t,state:f,props:{...l,[wo.slot]:"",type:"button",tabIndex:-1,"aria-label":"Clear selection",disabled:C||!b,className:m,style:d,onClick:R,onPointerDown:a},enabled:p||b,defaultTagName:"button"});return!p&&!b?null:c});import*as be from"react";var de=be.createContext(null);function Ve(){return be.useContext(de)}import{useRender as gt}from"@base-ui/react/use-render";import*as ne from"react";import*as xe from"react";var Me=xe.createContext(!1);function To(){return xe.useContext(Me)}var Q={slot:"bazzaui-combobox-input",open:"data-open",closed:"data-closed",disabled:"data-disabled",placeholder:"data-placeholder"};import*as le from"react";function ko(I){let{comboboxContext:e,open:t}=I,p=e.multiple?e.values.length>0:!bo(e.value),s=le.useCallback(d=>{let o=F(d,e.itemToStringValue),l=e.itemTextRegistry.get(o);if(l!==void 0)return l;let u=te(e.items,o);if(typeof u=="string")return u;let C=N(d,e.itemToStringLabel);if(C&&C!==o)return C},[e.itemTextRegistry,e.items,e.itemToStringLabel,e.itemToStringValue]),r=le.useMemo(()=>{if(!p)return"";if(e.multiple){let l=e.values.map(u=>{let C=s(u);return C!==void 0?C:N(u,e.itemToStringLabel)||F(u,e.itemToStringValue)}).filter(Boolean);return l.length<=2?l.join(", "):`${l.length} selected`}let d=e.value;if(d==null)return"";let o=s(d);return o!==void 0?o:N(d,e.itemToStringLabel)||F(d,e.itemToStringValue)},[p,e.multiple,e.value,e.values,e.itemToStringLabel,e.itemToStringValue,s]),m=le.useMemo(()=>t?e.inputValue:r,[t,r,e.inputValue]);return{hasValue:p,displayValue:m,selectedLabel:r,getValueText:s}}import*as k from"react";function Ho(I){let{comboboxContext:e,store:t,focusOwnerStore:p,open:s,disabled:r,cursorBehavior:m,hasValue:d,getValueText:o,onFocus:l,onBlur:u,onClick:C,onKeyDown:b}=I,R=k.useRef(!1),a=k.useRef(!1),f=k.useRef(!1),c=k.useRef(null),P=k.useRef(null),y=k.useRef(null);k.useEffect(()=>{if(!s)return;let n=x=>{let i=e.inputRef.current,M=e.inputWrapperRef.current,S=document.getElementById(e.listId),O=x.target,W=i?.contains(O),z=M?.contains(O),_=S?.contains(O);!W&&!z&&!_&&(y.current=x)};return document.addEventListener("pointerdown",n,!0),()=>{document.removeEventListener("pointerdown",n,!0),y.current=null}},[s,e.inputRef,e.inputWrapperRef,e.listId]),k.useLayoutEffect(()=>{let n=e.inputRef.current;if(n&&s&&P.current){let{start:x,end:i}=P.current,M=n.selectionStart,S=n.value.length;M===S&&x!==S&&n.setSelectionRange(x,i),P.current=null}});let L=k.useRef(s);k.useLayoutEffect(()=>{if(s&&!L.current){if(R.current){R.current=!1,L.current=s;return}if(f.current){f.current=!1,a.current=!1,c.current=null,L.current=s;return}if(a.current&&m==="none"){let x=e.inputRef.current,i=c.current;x&&i!==null&&requestAnimationFrame(()=>{let M=x.value.length,S=Math.min(i,M);x.setSelectionRange(S,S)}),a.current=!1,c.current=null,L.current=s;return}d&&e.multiple&&e.onInputValueChange("");let n=e.inputRef.current;if(n){let x=n.value.length;m==="select-all"&&x>0?requestAnimationFrame(()=>{n.setSelectionRange(0,n.value.length)}):m==="end"&&x>0&&requestAnimationFrame(()=>{n.setSelectionRange(n.value.length,n.value.length)})}}L.current=s},[s,e,d,m]);let w=k.useCallback(n=>{let x=n.target,i=x.value,M=x.selectionStart,S=x.selectionEnd;M!==null&&S!==null&&(P.current={start:M,end:S}),e.onInputValueChange(i),e.setFilterActive(),t.setSearch(i),t.state.open||(R.current=!0,e.openCombobox())},[e,t]),T=k.useCallback(n=>{if(l?.(n),n.defaultPrevented)return;let x=t.state.open;if(x&&(f.current=!0),e.openOnFocus&&!r&&!x){if(d&&!e.multiple){let i=o(e.value)??N(e.value,e.itemToStringLabel);e.onInputValueChange(i)}e.openCombobox()}},[l,e,r,t,d,o]),V=k.useCallback(n=>{u?.(n),!n.defaultPrevented&&requestAnimationFrame(()=>{let x=document.activeElement,M=document.getElementById(e.listId)?.contains(x),S=x===e.inputRef.current;if(!M&&!S){f.current=!1;let O=y.current,W=O?oe.outsidePress:oe.focusOut;y.current=null,e.closeCombobox(W,O??void 0)}})},[u,e]),A=k.useCallback(n=>{if(C?.(n),n.defaultPrevented)return;let x=t.state.open;if(!r&&!x){let i=n.target;if(m==="none"){let M=i.selectionStart;c.current=M,a.current=!0}if(d&&!e.multiple){let M=o(e.value)??N(e.value,e.itemToStringLabel);e.onInputValueChange(M)}e.openCombobox()}else x&&(f.current=!0)},[C,e,r,t,m,d,o]),q=k.useCallback(n=>{if(b?.(n),!n.defaultPrevented){if(s&&n.key==="Escape"){n.preventDefault(),e.closeCombobox(oe.escapeKey);return}if(!s&&(n.key==="ArrowDown"||n.key==="ArrowUp"||n.key==="Enter")){if(n.preventDefault(),d&&!e.multiple){let x=o(e.value)??N(e.value,e.itemToStringLabel);e.onInputValueChange(x)}e.openCombobox();return}}},[s,e,b,d,o]),{handleKeyDown:j}=co({store:t,surfaceId:"combobox-input",focusOwnerStore:p,depth:0,submenuContext:null,subpageContext:null,enabled:s,enableTypeToSearch:!1,onKeyDown:q,closeAll:e.closeCombobox,skipFocusOwnerCheck:!0});return{handleChange:w,handleFocus:T,handleBlur:V,handleClick:A,handleKeyDown:j,selectionRef:P}}var Ee=ne.forwardRef(function(e,t){let{placeholder:p,disabled:s,cursorBehavior:r="none",render:m,className:d,style:o,onFocus:l,onBlur:u,onClick:C,onKeyDown:b,...R}=e,a=D(),f=ce(),c=no(),P=To(),y=(s??a.disabled)||f.disabled,L=te(a.items,""),w=p??(typeof L=="string"?L:void 0)??a.placeholder,T=f.store.useState("open"),{hasValue:V,displayValue:A,getValueText:q}=ko({comboboxContext:a,open:T}),{handleChange:j,handleFocus:n,handleBlur:x,handleClick:i,handleKeyDown:M}=Ho({comboboxContext:a,store:f.store,focusOwnerStore:c,open:T,disabled:y,cursorBehavior:r,hasValue:V,getValueText:q,onFocus:l,onBlur:u,onClick:C,onKeyDown:b}),S={[Q.slot]:""};T?S[Q.open]="":S[Q.closed]="",y&&(S[Q.disabled]=""),V||(S[Q.placeholder]=""),a.layout==="input-embedded"&&(S["data-input-embedded"]="");let O=ne.useCallback(v=>{a.setInputElement(v),typeof t=="function"?t(v):t&&(t.current=v)},[t,a]),W=ne.useMemo(()=>({open:T,disabled:y,placeholder:!V}),[T,y,V]),z=a.layout==="input-embedded"&&!P?{position:"relative",zIndex:1}:void 0;return gt({render:m,ref:O,state:W,props:{...R,...S,type:"text",role:"combobox","aria-autocomplete":"list","aria-expanded":T,"aria-controls":a.listId,"aria-haspopup":"listbox",autoComplete:"off",autoCorrect:"off",spellCheck:!1,disabled:y,placeholder:V?void 0:w,className:d,style:{...z,...o},value:A,onChange:j,onFocus:n,onBlur:x,onClick:i,onKeyDown:M},defaultTagName:"input"})});import{useRender as ht}from"@base-ui/react/use-render";import*as re from"react";var Ce={slot:"bazzaui-combobox-input-wrapper",open:"data-open"};import{jsx as It}from"react/jsx-runtime";var Pt={open:I=>I?{[Ce.open]:""}:null},Le=re.forwardRef(function(e,t){let{render:p,className:s,style:r,children:m,...d}=e,{store:o}=ce(),l=D(),u=o.useState("open"),C=re.useMemo(()=>({open:u}),[u]),b=l.layout==="input-embedded"?{position:"relative",zIndex:1}:{position:"relative"},R=re.useCallback(f=>{l.setInputWrapperElement(f),typeof t=="function"?t(f):t&&(t.current=f)},[t,l]),a=ht({render:p,ref:R,state:C,stateAttributesMapping:Pt,props:{...d,[Ce.slot]:"",className:s,style:{...b,...r},children:m},defaultTagName:"div"});return It(Me.Provider,{value:!0,children:a})});import{useRender as St}from"@base-ui/react/use-render";import*as E from"react";var ae={slot:"bazzaui-combobox-item",highlighted:"data-highlighted",disabled:"data-disabled",selected:"data-selected"};import*as ue from"react";var fe=ue.createContext(null);function ie(){let I=ue.useContext(fe);if(!I)throw new Error("ComboboxItem child components must be used within a Combobox.Item");return I}function Rt(){return ue.useContext(fe)}import{jsx as Vt}from"react/jsx-runtime";var yt={highlighted:I=>I?{[ae.highlighted]:""}:null,disabled:I=>I?{[ae.disabled]:""}:null,selected:I=>I?{[ae.selected]:""}:null};function vt(I,e){let{value:t,textValue:p,keywords:s,disabled:r=!1,onSelect:m,forceMount:d=!1,render:o,className:l,style:u,onClick:C,onPointerDown:b,onPointerMove:R,children:a,...f}=I,c=D(),P=E.useMemo(()=>F(t,c.itemToStringValue),[t,c.itemToStringValue]),y=E.useId(),L=t===null?`combobox-clear-${y}`:void 0,w=E.useMemo(()=>Eo(c.items,P),[c.items,P]),T=w?.label,V=E.useMemo(()=>N(t,c.itemToStringLabel),[t,c.itemToStringLabel]),A=E.useMemo(()=>{if(p!==void 0)return p;if(typeof T=="string")return T;if(V&&V!==P)return V},[p,T,V,P]),q=E.useMemo(()=>Lo(s,[typeof T=="string"?T:V&&V!==P?V:void 0,...w?.keywords??[]]),[s,T,V,P,w]),j=E.useRef(A),n=c.multiple?Vo(c.values,t,c.isItemEqualToValue):c.value!==""&&vo(c.value,t,c.isItemEqualToValue),x=c.closeOnSelect,i=mo({id:L,value:P,keywords:q,disabled:r,forceMount:d,closeOnClick:x,children:a});E.useEffect(()=>{let v=()=>{if(!r){if(c.multiple)if(t==null)c.onValuesChange([]);else{let ee=n?Mo(c.values,t,c.isItemEqualToValue):[...c.values,t];c.onValuesChange(ee)}else c.onValueChange(t);m?.()}};return i.registerSelect(v)},[r,c,t,n,m,i]),E.useEffect(()=>{let v=j.current;if(v)return c.registerItemText(P,v)},[P,c]),E.useEffect(()=>{!A&&typeof a=="string"&&(j.current=a,c.registerItemText(P,a))},[a,A,P,c]);let M=E.useMemo(()=>({highlighted:i.isHighlighted,disabled:r,selected:n}),[i.isHighlighted,r,n]),S=E.useMemo(()=>({id:i.id,value:t,textValue:A,highlighted:i.isHighlighted,disabled:r,selected:n}),[i.id,t,A,i.isHighlighted,r,n]),O=E.useCallback(v=>{C?.(v),v.defaultPrevented||i.handlers.onClick(v)},[C,i.handlers]),W=E.useCallback(v=>{i.handlers.onPointerDown(v),b?.(v)},[i.handlers,b]),z=E.useCallback(v=>{R?.(v),v.defaultPrevented||i.handlers.onPointerMove(v)},[R,i.handlers]),_=St({render:o,ref:[i.ref,e],state:M,stateAttributesMapping:yt,props:{...f,[ae.slot]:"",id:i.id,role:"option",tabIndex:-1,"aria-selected":n,"aria-disabled":r||void 0,className:l,style:u,onClick:O,onPointerMove:z,onPointerDown:W,children:a},enabled:i.isVisible,defaultTagName:"div"});return i.isVisible?Vt(fe.Provider,{value:S,children:_}):null}var we=E.forwardRef(vt);import{useRender as Mt}from"@base-ui/react/use-render";import*as he from"react";var ge={slot:"bazzaui-combobox-item-indicator",selected:"data-selected"};var Et={selected:I=>I?{[ge.selected]:""}:null},Te=he.forwardRef(function(e,t){let{keepMounted:p=!1,render:s,className:r,style:m,...d}=e,o=ie(),l=he.useMemo(()=>({selected:o.selected}),[o.selected]),u=Mt({render:s,ref:t,state:l,stateAttributesMapping:Et,props:{...d,[ge.slot]:"","aria-hidden":!0,className:r,style:m},enabled:p||o.selected,defaultTagName:"span"});return!p&&!o.selected?null:u});import{useRender as Lt}from"@base-ui/react/use-render";import*as Y from"react";var Oo={slot:"bazzaui-combobox-item-label"};var ke=Y.forwardRef(function(e,t){let{render:p,className:s,style:r,children:m,...d}=e,o=D(),l=ie(),u=F(l.value,o.itemToStringValue),C=Y.useMemo(()=>{if(m!==void 0)return m;let R=te(o.items,u);return R!==void 0?R:l.textValue!==void 0?l.textValue:u},[m,o.items,u,l.textValue]),b=Y.useMemo(()=>({value:u,selected:l.selected,highlighted:l.highlighted,disabled:l.disabled}),[u,l.selected,l.highlighted,l.disabled]);return Y.useEffect(()=>{if(typeof C=="string")return o.registerItemText(u,C)},[C,o,u]),Lt({render:p,ref:t,state:b,props:{...d,[Oo.slot]:"",className:s,style:r,children:C},defaultTagName:"span"})});import{Popover as Do}from"@base-ui/react/popover";import*as U from"react";var Pe={slot:"bazzaui-combobox-positioner"};import{jsx as pe}from"react/jsx-runtime";function wt(I,e,t,p){let s=t+p*2;if(I==="top"){let d=-(e+p),o=e+p;return{width:s,marginBottom:d,paddingTop:p,paddingLeft:p,paddingRight:p,paddingBottom:o}}let r=-(e+p),m=e+p;return{width:s,marginTop:r,paddingTop:m,paddingLeft:p,paddingRight:p,paddingBottom:p}}var He=U.forwardRef(function(e,t){let{layout:p,popupPadding:s=8,side:r="bottom",align:m,sideOffset:d=4,anchor:o,className:l,style:u,children:C,...b}=e,R=D(),a=p??R.layout,f=a==="input-embedded",c=o??R.inputWrapperRef.current?R.inputWrapperRef:R.inputRef,P=f?0:d,y=f?"center":m??"start",{inputHeight:L,inputWidth:w}=R,T=w+s*2,V={...u,...f?{zIndex:0}:{}};if(f)return pe(Do.Positioner,{ref:t,side:r,align:y,sideOffset:P,anchor:c,className:l,style:V,"data-input-embedded":"",[Pe.slot]:"",...b,render:(n,x)=>{let i=x.side,M={layout:a,side:i,align:x.align,inputHeight:R.inputHeight},S={"--combobox-input-height":`${L}px`,"--combobox-input-width":`${w}px`,"--combobox-popup-padding":`${s}px`,"--combobox-popup-width":`${T}px`},O=wt(i,L,w,s),W=U.Children.map(C,z=>U.isValidElement(z)?U.cloneElement(z,{style:{...O,...z.props.style},"data-side":i}):z);return pe(de.Provider,{value:M,children:pe("div",{...n,style:{...n.style,...S},"data-side":i,children:W})})}});let A={layout:a,side:r,align:y,inputHeight:R.inputHeight},q={"--combobox-input-height":`${L}px`,"--combobox-input-width":`${w}px`},j={...V,...q};return pe(de.Provider,{value:A,children:pe(Do.Positioner,{ref:t,side:r,align:y,sideOffset:P,anchor:c,className:l,style:j,[Pe.slot]:"",...b,children:C})})});import{Popover as Tt}from"@base-ui/react/popover";import*as h from"react";import{jsx as me,jsxs as kt}from"react/jsx-runtime";function Oe(I){let{open:e,onOpenChange:t,actionsRef:p,defaultOpen:s=!1,value:r,defaultValue:m,onValueChange:d,multiple:o=!1,values:l,defaultValues:u,onValuesChange:C,isItemEqualToValue:b=yo,itemToStringLabel:R,itemToStringValue:a,inputValue:f,defaultInputValue:c="",onInputValueChange:P,name:y,form:L,required:w,disabled:T=!1,placeholder:V="Search...",items:A,modal:q=!1,closeOnSelect:j,openOnFocus:n=!0,virtualized:x=!1,virtualItems:i,onHighlightChange:M,layout:S="floating",onOpenChangeComplete:O,debug:W,children:z,..._}=I,v=h.useId(),ee=h.useRef(null),Ie=h.useRef(null),[Ae,Fe]=h.useState(0),[ze,Be]=h.useState(0),We=h.useCallback(g=>{if(ee.current=g,g&&!Ie.current){let H=g.getBoundingClientRect();Fe(H.height),Be(H.width)}},[]),je=h.useCallback(g=>{if(Ie.current=g,g){let H=g.getBoundingClientRect();Fe(H.height),Be(H.width)}},[]),{store:B,focusOwnerStore:Go,openChainStore:$o,registerSurface:Jo,closeAll:Xo,virtualization:Qo,handleOpenChange:Ne,disabled:G,setDisabled:qe}=ro({onOpenChange:t,defaultOpen:s,virtualized:x,items:i,onHighlightChange:M,disabled:T}),Re=h.useRef(null);h.useImperativeHandle(p,()=>({close:()=>{Re.current?.close()},unmount:()=>{Re.current?.unmount()},setDisabled:qe}),[qe]),B.useControlledProp("openProp",e);let Yo=B.useState("open"),Ke=h.useCallback((g,H,K)=>{G&&H!==oe.imperativeAction||!g&&ee.current&&document.activeElement===ee.current||Ne(g,H,K)},[Ne,G]),Zo=h.useCallback(g=>{!g&&B.context.clearSearchOnClose==="after-exit"&&(B.clearSearch(),B.setInputActive(!1)),g||B.clearHighlight(),O?.(g)},[B,O]),_o=h.useCallback((g,H)=>{Ke(g,H.reason,H.event)},[Ke]),[et,ot]=h.useState(m!==void 0?m:null),$=r!==void 0?r:et,Ue=h.useCallback(g=>{r===void 0&&ot(g),d?.(g)},[r,d]),[tt,nt]=h.useState(u??[]),se=l!==void 0?l:tt,Ge=h.useCallback(g=>{l===void 0&&nt(g),C?.(g)},[l,C]),[Se,rt]=h.useState(c),$e=f!==void 0?f:Se,Je=h.useCallback(g=>{f===void 0&&rt(g),P?.(g)},[f,P]),Xe=h.useRef(new Map),Qe=h.useCallback((g,H)=>(Xe.current.set(g,H),()=>{}),[]),Ye=j??!o,ye=h.useRef({type:"active"}),[,at]=h.useState({type:"active"}),J=h.useCallback(g=>{ye.current=g,at(g)},[]),Ze=ye.current,_e=h.useCallback(()=>{J({type:"active"})},[J]),eo=h.useCallback(()=>{G||(!o&&$!=null?J({type:"showAll"}):J({type:"active"}),B.setOpen(!0))},[G,B,o,$,J]),oo=h.useCallback((g,H)=>{let K=ye.current,to=K.type==="active"?Se:K.type==="showAll"?"":K.search;J({type:"frozen",search:to}),B.setOpen(!1,g,H)},[B,J,Se]),st=h.useMemo(()=>({multiple:o,value:$,values:se,onValueChange:Ue,onValuesChange:Ge,isItemEqualToValue:b,itemToStringLabel:R,itemToStringValue:a,inputValue:$e,onInputValueChange:Je,name:y,form:L,required:w,disabled:G,placeholder:V,items:A,itemTextRegistry:Xe.current,registerItemText:Qe,listId:v,inputRef:ee,setInputElement:We,inputWrapperRef:Ie,setInputWrapperElement:je,closeOnSelect:Ye,openOnFocus:n,openCombobox:eo,closeCombobox:oo,filterMode:Ze,setFilterActive:_e,inputHeight:Ae,inputWidth:ze,layout:S}),[o,$,se,Ue,Ge,b,R,a,$e,Je,y,L,w,G,V,A,Qe,v,We,je,Ye,n,eo,oo,Ze,_e,Ae,ze,S]),lt=h.useMemo(()=>y?o?se.length>0?se.map((g,H)=>{let K=F(g,a);return me("input",{type:"hidden",name:y,value:K,form:L,required:w&&H===0},K)}):me("input",{type:"hidden",name:y,value:"",form:L,required:w}):me("input",{type:"hidden",name:y,value:$!=null?F($,a):"",form:L,required:w}):null,[y,L,w,o,$,se,a]);return me(lo.Provider,{value:st,children:kt(po,{store:B,focusOwnerStore:Go,openChainStore:$o,disabled:G,depth:0,closeAll:Xo,registerSurface:Jo,virtualization:Qo,menuType:"dropdown",componentName:"combobox",debug:W,children:[lt,me(Tt.Root,{..._,open:Yo,onOpenChange:_o,onOpenChangeComplete:Zo,modal:q,actionsRef:p?Re:void 0,children:z})]})})}import*as Z from"react";var Ao={slot:"bazzaui-combobox-surface"};import{jsx as Ht}from"react/jsx-runtime";var De=Z.forwardRef(function(e,t){let{autoHighlightFirst:p,search:s,onSearchChange:r,onPointerMove:m,...d}=e,o=D(),l=Z.useCallback(a=>{m?.(a);let f=o.inputRef.current;f&&document.activeElement!==f&&f.focus()},[m,o.inputRef]),u=Z.useMemo(()=>{let a=p??!0;if(a==="selected"){let f=o.multiple?o.values[0]:o.value;return f!=null?F(f,o.itemToStringValue):!0}return a},[p,o.multiple,o.value,o.values,o.itemToStringValue]),{filterMode:C}=o,b=s??(C.type==="active"?o.inputValue:C.type==="showAll"?"":C.search),R=Z.useCallback(a=>{o.onInputValueChange(a),r?.(a)},[o,r]);return Ht(Po,{ref:t,autoHighlightFirst:u,search:b,onSearchChange:R,onPointerMove:l,skipAutoFocus:!0,[Ao.slot]:"",...d})});var zo=(m=>(m.slot="bazzaui-combobox-arrow",m.open="data-open",m.closed="data-closed",m.side="data-side",m.align="data-align",m.uncentered="data-uncentered",m))(zo||{});var Bo=(r=>(r.slot="bazzaui-combobox-backdrop",r.open="data-open",r.closed="data-closed",r.startingStyle="data-starting-style",r.endingStyle="data-ending-style",r))(Bo||{});var Wo=(e=>(e.slot="bazzaui-combobox-empty",e))(Wo||{});var jo=(e=>(e.slot="bazzaui-combobox-group",e))(jo||{});var No=(e=>(e.slot="bazzaui-combobox-group-label",e))(No||{});var Ot={slot:"bazzaui-combobox-icon",open:"data-popup-open"};var qo=(t=>(t.slot="bazzaui-combobox-list",t.list="data-popup-menu-list",t))(qo||{});var Ko=(b=>(b.slot="bazzaui-combobox-popup",b.open="data-open",b.closed="data-closed",b.side="data-side",b.align="data-align",b.startingStyle="data-starting-style",b.endingStyle="data-ending-style",b.instant="data-instant",b.focused="data-focused",b.hasOpenSubmenu="data-has-open-submenu",b.submenu="data-submenu",b.navigating="data-navigating",b))(Ko||{});var Dt={slotUp:"bazzaui-combobox-scroll-up-arrow",slotDown:"bazzaui-combobox-scroll-down-arrow",direction:"data-direction",side:"data-side"};var Uo=(e=>(e.slot="bazzaui-combobox-separator",e))(Uo||{});export{Fo as Combobox,zo as ComboboxArrowDataAttributes,Bo as ComboboxBackdropDataAttributes,ve as ComboboxClear,Wo as ComboboxEmptyDataAttributes,jo as ComboboxGroupDataAttributes,No as ComboboxGroupLabelDataAttributes,Ot as ComboboxIconDataAttributes,Ee as ComboboxInput,Q as ComboboxInputDataAttributes,Le as ComboboxInputWrapper,Ce as ComboboxInputWrapperDataAttributes,we as ComboboxItem,ae as ComboboxItemDataAttributes,Te as ComboboxItemIndicator,ge as ComboboxItemIndicatorDataAttributes,ke as ComboboxItemLabel,Ct as ComboboxListCssVars,qo as ComboboxListDataAttributes,Ko as ComboboxPopupDataAttributes,He as ComboboxPositioner,xt as ComboboxPositionerCssVars,Pe as ComboboxPositionerDataAttributes,Oe as ComboboxRoot,Dt as ComboboxScrollArrowDataAttributes,Uo as ComboboxSeparatorDataAttributes,bt as ComboboxStore,De as ComboboxSurface,mt as commandScore,ct as defaultFilter,D as useComboboxContext,ie as useComboboxItemContext,Ve as useComboboxPositionerContext,dt as useMaybeComboboxContext,Rt as useMaybeComboboxItemContext,pt as useMaybeSurfaceContext,it as useSurfaceContext};
 //# sourceMappingURL=index.js.map