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

package/dist/select/index.d.cts

@@ -1,17 +1,17 @@
-import { V as VirtualItem } from '../ListboxStore-BtcTXpzi.cjs';
-export { F as SelectFilterFn, I as SelectItemRegistration, b as SelectStore, L as SelectStoreContext, a as SelectStoreState } from '../ListboxStore-BtcTXpzi.cjs';
-import { i as PopupMenuPopup, R as PopupMenuPopupState, 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, j as PopupMenuPortal, k as PopupMenuScrollDownArrow, l as PopupMenuScrollUpArrow, m as PopupMenuSeparator } from '../separator-BzYYn73e.cjs';
-export { o as SelectArrowProps, p as SelectBackdropProps, q as SelectEmptyProps, r as SelectEmptyState, s as SelectGroupLabelProps, t as SelectGroupLabelState, u as SelectGroupProps, v as SelectGroupState, w as SelectIconProps, x as SelectIconState, y as SelectListChildrenState, L as SelectListCssVars, z as SelectListProps, A as SelectListState, C as SelectPortalProps, M as SelectPositionerCssVars, D as SelectScrollArrowProps, E as SelectScrollArrowState, F as SelectScrollDownArrowProps, G as SelectScrollUpArrowProps, H as SelectSeparatorProps, I as SelectSeparatorState, K as SelectSurfaceState } from '../separator-BzYYn73e.cjs';
+import { V as VirtualItem } from '../ListboxStore-DcAFvpEj.cjs';
+export { F as SelectFilterFn, I as SelectItemRegistration, b as SelectStore, L as SelectStoreContext, a as SelectStoreState } from '../ListboxStore-DcAFvpEj.cjs';
+import { i as PopupMenuPopup, R as PopupMenuPopupState, 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, j as PopupMenuPortal, k as PopupMenuScrollDownArrow, l as PopupMenuScrollUpArrow, m as PopupMenuSeparator } from '../separator-DACt2Z4S.cjs';
+export { o as SelectArrowProps, p as SelectBackdropProps, q as SelectEmptyProps, r as SelectEmptyState, s as SelectGroupLabelProps, t as SelectGroupLabelState, u as SelectGroupProps, v as SelectGroupState, w as SelectIconProps, x as SelectIconState, y as SelectListChildrenState, L as SelectListCssVars, z as SelectListProps, A as SelectListState, C as SelectPortalProps, M as SelectPositionerCssVars, D as SelectScrollArrowProps, E as SelectScrollArrowState, F as SelectScrollDownArrowProps, G as SelectScrollUpArrowProps, H as SelectSeparatorProps, I as SelectSeparatorState, K as SelectSurfaceState } from '../separator-DACt2Z4S.cjs';
 import { P as PopupMenuInput } from '../input-K7sWcc-E.cjs';
 export { a as SelectInputProps, b as SelectInputState } from '../input-K7sWcc-E.cjs';
 import * as React from 'react';
-import { C as ComponentProps } from '../types-DT4FOOa2.cjs';
+import { C as ComponentProps, a as ComponentRenderFn } 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, 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';
 
 declare const SelectItemDataAttributes: {
     /**
@@ -51,8 +51,11 @@ interface SelectItemProps<Value = unknown> extends ComponentProps<'div', SelectI
     /**
      * The value of this item. Required and must be unique within the Select.
      * 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 trigger placeholder (Base UI parity).
      */
-    value: Value;
+    value: Value | null;
     /**
      * Text value to use for display in Select.Value when this item is selected.
      * If not provided, the text content of the item will be used.
@@ -96,6 +99,10 @@ declare const SelectItemIndicatorDataAttributes: {
      * Present when the parent item is selected.
      */
     readonly selected: "data-selected";
+    /**
+     * Present when the parent item is highlighted via keyboard or pointer.
+     */
+    readonly highlighted: "data-highlighted";
 };
 
 interface SelectItemIndicatorState extends Record<string, unknown> {
@@ -103,6 +110,10 @@ interface SelectItemIndicatorState extends Record<string, unknown> {
      * Whether the item is selected.
      */
     selected: boolean;
+    /**
+     * Whether the item is highlighted (via keyboard or pointer).
+     */
+    highlighted: boolean;
 }
 interface SelectItemIndicatorProps extends Omit<ComponentProps<'span', SelectItemIndicator.State>, 'children'> {
     /**
@@ -175,7 +186,16 @@ declare namespace SelectItemLabel {
     type State = SelectItemLabelState;
 }
 
-interface SelectPopupState extends PopupMenuPopupState {
+interface SelectPopupState extends Omit<PopupMenuPopupState, 'side'> {
+    /**
+     * Side the popup is placed on relative to the trigger.
+     *
+     * Reports `'none'` while `alignItemWithTrigger` positioning is active, because
+     * the popup overlaps the trigger and therefore has no physical side. This
+     * mirrors Base UI's behavior instead of leaking the `'bottom'` fallback that
+     * the underlying Popover computes when no side is provided.
+     */
+    side: PopupMenuPopupState['side'] | 'none';
     /**
      * Whether the popup is currently using align-item-with-trigger positioning.
      * This reflects the actual state, not just the prop value - it will be false
@@ -183,12 +203,17 @@ interface SelectPopupState extends PopupMenuPopupState {
      */
     alignItemWithTriggerActive: boolean;
 }
-interface SelectPopupProps extends Omit<PopupMenuPopup.Props, 'className'> {
+interface SelectPopupProps extends Omit<PopupMenuPopup.Props, 'className' | 'render'> {
     /**
      * CSS class applied to the element, or a function that
      * returns a class based on the component's state.
      */
     className?: string | ((state: SelectPopupState) => string);
+    /**
+     * Allows replacing the popup element with a custom element.
+     * The render state includes Select-specific alignment state.
+     */
+    render?: React.ReactElement | ComponentRenderFn<React.HTMLAttributes<HTMLElement>, SelectPopupState>;
 }
 /**
  * A container for the select popup contents.
@@ -196,7 +221,7 @@ interface SelectPopupProps extends Omit<PopupMenuPopup.Props, 'className'> {
  *
  * Renders a `<div>` element.
  */
-declare const SelectPopup: React.ForwardRefExoticComponent<SelectPopupProps & React.RefAttributes<HTMLDivElement>>;
+declare const SelectPopup: React.ForwardRefExoticComponent<Omit<SelectPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare namespace SelectPopup {
     type Props = SelectPopupProps;
     type State = SelectPopupState;
@@ -212,13 +237,18 @@ declare const SelectPositionerDataAttributes: {
 
 interface SelectPositionerProps extends PopoverPositionerProps {
     /**
-     * Whether the positioner overlaps the trigger so the selected item's text
-     * is aligned with the trigger's value text.
+     * Whether the positioner overlaps the trigger so the selected item's text is
+     * aligned with the trigger's value text (a native-select feel).
      *
-     * This is automatically disabled if:
-     * - There is not enough space in the viewport
-     * - The trigger is too close to the viewport edges
-     * - Touch input is detected (better UX to show full list)
+     * Only applies to mouse/pen/keyboard input. When disabled, the popup falls
+     * back to standard anchored positioning on the configured `side`. It is
+     * automatically disabled when:
+     * - the select is searchable — a `Select.Input` is present (a `hideUntilActive`
+     *   input counts once it activates), so the filtered list anchors to the
+     *   trigger like a combobox;
+     * - the select was opened by touch (the full list is shown instead);
+     * - the trigger is too close to a viewport edge; or
+     * - there isn't enough room for a reasonably sized popup.
      *
      * @default true
      */
@@ -226,11 +256,16 @@ interface SelectPositionerProps extends PopoverPositionerProps {
 }
 /**
  * Positions the select popup against its trigger.
- * Supports aligning the selected item with the trigger for a native select feel.
+ *
+ * When `alignItemWithTrigger` is active, the popup overlaps the trigger so the
+ * selected item's text lines up with the trigger's value, the list is
+ * pre-scrolled to that item, and the popup is sized/anchored to fit the
+ * viewport (Base UI parity). Otherwise it delegates to the standard anchored
+ * positioning of `Popover.Positioner`.
  *
  * Renders a `<div>` element.
  */
-declare const SelectPositioner: React.ForwardRefExoticComponent<SelectPositionerProps & React.RefAttributes<HTMLDivElement>>;
+declare const SelectPositioner: React.ForwardRefExoticComponent<Omit<SelectPositionerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare namespace SelectPositioner {
     type Props = SelectPositionerProps;
     type State = Popover.Positioner.State;
@@ -301,6 +336,9 @@ interface SelectRootProps<Value = unknown, Multiple extends boolean | undefined
     defaultValue?: SelectValue$1<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;
     /**
@@ -373,23 +411,23 @@ interface SelectRootProps<Value = unknown, Multiple extends boolean | undefined
      * When specified, `<Select.Value>` renders 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
      * <Select.Root items={{ us: 'United States', uk: 'United Kingdom' }}>
      *
-     * // Array format
+     * // Array format (supports keywords and a null clearable item)
      * <Select.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 select enters a modal state when open.
      *
@@ -788,8 +826,8 @@ interface SelectContextValue<Value = unknown> {
     value: Value | null;
     /** Current selected values (multi-select mode) */
     values: Value[];
-    /** Callback when value changes (single-select mode) */
-    onValueChange: (value: Value) => void;
+    /** Callback when value changes (single-select mode; `null` clears it) */
+    onValueChange: (value: Value | null) => void;
     /** Callback when values change (multi-select mode) */
     onValuesChange: (values: Value[]) => void;
     /**
@@ -830,12 +868,10 @@ interface SelectContextValue<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 trigger element */
@@ -911,8 +947,8 @@ declare function useSelectPositionerContext(): SelectPositionerContextValue | nu
 interface SelectItemContextValue<Value = unknown> {
     /** Unique ID for this item (for DOM id attribute) */
     id: string;
-    /** The value of this item */
-    value: Value;
+    /** The value of this item (`null` for a clearable item) */
+    value: Value | null;
     /** The text value/label for this item */
     textValue: string | undefined;
     /** Whether the item is highlighted */

package/dist/select/index.d.ts

@@ -1,17 +1,17 @@
-import { V as VirtualItem } from '../ListboxStore-DPqpLlAL.js';
-export { F as SelectFilterFn, I as SelectItemRegistration, b as SelectStore, L as SelectStoreContext, a as SelectStoreState } from '../ListboxStore-DPqpLlAL.js';
-import { i as PopupMenuPopup, R as PopupMenuPopupState, 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, j as PopupMenuPortal, k as PopupMenuScrollDownArrow, l as PopupMenuScrollUpArrow, m as PopupMenuSeparator } from '../separator-C9c1Jo6A.js';
-export { o as SelectArrowProps, p as SelectBackdropProps, q as SelectEmptyProps, r as SelectEmptyState, s as SelectGroupLabelProps, t as SelectGroupLabelState, u as SelectGroupProps, v as SelectGroupState, w as SelectIconProps, x as SelectIconState, y as SelectListChildrenState, L as SelectListCssVars, z as SelectListProps, A as SelectListState, C as SelectPortalProps, M as SelectPositionerCssVars, D as SelectScrollArrowProps, E as SelectScrollArrowState, F as SelectScrollDownArrowProps, G as SelectScrollUpArrowProps, H as SelectSeparatorProps, I as SelectSeparatorState, K as SelectSurfaceState } from '../separator-C9c1Jo6A.js';
+import { V as VirtualItem } from '../ListboxStore-Be-isU6l.js';
+export { F as SelectFilterFn, I as SelectItemRegistration, b as SelectStore, L as SelectStoreContext, a as SelectStoreState } from '../ListboxStore-Be-isU6l.js';
+import { i as PopupMenuPopup, R as PopupMenuPopupState, 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, j as PopupMenuPortal, k as PopupMenuScrollDownArrow, l as PopupMenuScrollUpArrow, m as PopupMenuSeparator } from '../separator-BncOmTUq.js';
+export { o as SelectArrowProps, p as SelectBackdropProps, q as SelectEmptyProps, r as SelectEmptyState, s as SelectGroupLabelProps, t as SelectGroupLabelState, u as SelectGroupProps, v as SelectGroupState, w as SelectIconProps, x as SelectIconState, y as SelectListChildrenState, L as SelectListCssVars, z as SelectListProps, A as SelectListState, C as SelectPortalProps, M as SelectPositionerCssVars, D as SelectScrollArrowProps, E as SelectScrollArrowState, F as SelectScrollDownArrowProps, G as SelectScrollUpArrowProps, H as SelectSeparatorProps, I as SelectSeparatorState, K as SelectSurfaceState } from '../separator-BncOmTUq.js';
 import { P as PopupMenuInput } from '../input-CVeZtOCC.js';
 export { a as SelectInputProps, b as SelectInputState } from '../input-CVeZtOCC.js';
 import * as React from 'react';
-import { C as ComponentProps } from '../types-DT4FOOa2.js';
+import { C as ComponentProps, a as ComponentRenderFn } 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, 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';
 
 declare const SelectItemDataAttributes: {
     /**
@@ -51,8 +51,11 @@ interface SelectItemProps<Value = unknown> extends ComponentProps<'div', SelectI
     /**
      * The value of this item. Required and must be unique within the Select.
      * 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 trigger placeholder (Base UI parity).
      */
-    value: Value;
+    value: Value | null;
     /**
      * Text value to use for display in Select.Value when this item is selected.
      * If not provided, the text content of the item will be used.
@@ -96,6 +99,10 @@ declare const SelectItemIndicatorDataAttributes: {
      * Present when the parent item is selected.
      */
     readonly selected: "data-selected";
+    /**
+     * Present when the parent item is highlighted via keyboard or pointer.
+     */
+    readonly highlighted: "data-highlighted";
 };
 
 interface SelectItemIndicatorState extends Record<string, unknown> {
@@ -103,6 +110,10 @@ interface SelectItemIndicatorState extends Record<string, unknown> {
      * Whether the item is selected.
      */
     selected: boolean;
+    /**
+     * Whether the item is highlighted (via keyboard or pointer).
+     */
+    highlighted: boolean;
 }
 interface SelectItemIndicatorProps extends Omit<ComponentProps<'span', SelectItemIndicator.State>, 'children'> {
     /**
@@ -175,7 +186,16 @@ declare namespace SelectItemLabel {
     type State = SelectItemLabelState;
 }
 
-interface SelectPopupState extends PopupMenuPopupState {
+interface SelectPopupState extends Omit<PopupMenuPopupState, 'side'> {
+    /**
+     * Side the popup is placed on relative to the trigger.
+     *
+     * Reports `'none'` while `alignItemWithTrigger` positioning is active, because
+     * the popup overlaps the trigger and therefore has no physical side. This
+     * mirrors Base UI's behavior instead of leaking the `'bottom'` fallback that
+     * the underlying Popover computes when no side is provided.
+     */
+    side: PopupMenuPopupState['side'] | 'none';
     /**
      * Whether the popup is currently using align-item-with-trigger positioning.
      * This reflects the actual state, not just the prop value - it will be false
@@ -183,12 +203,17 @@ interface SelectPopupState extends PopupMenuPopupState {
      */
     alignItemWithTriggerActive: boolean;
 }
-interface SelectPopupProps extends Omit<PopupMenuPopup.Props, 'className'> {
+interface SelectPopupProps extends Omit<PopupMenuPopup.Props, 'className' | 'render'> {
     /**
      * CSS class applied to the element, or a function that
      * returns a class based on the component's state.
      */
     className?: string | ((state: SelectPopupState) => string);
+    /**
+     * Allows replacing the popup element with a custom element.
+     * The render state includes Select-specific alignment state.
+     */
+    render?: React.ReactElement | ComponentRenderFn<React.HTMLAttributes<HTMLElement>, SelectPopupState>;
 }
 /**
  * A container for the select popup contents.
@@ -196,7 +221,7 @@ interface SelectPopupProps extends Omit<PopupMenuPopup.Props, 'className'> {
  *
  * Renders a `<div>` element.
  */
-declare const SelectPopup: React.ForwardRefExoticComponent<SelectPopupProps & React.RefAttributes<HTMLDivElement>>;
+declare const SelectPopup: React.ForwardRefExoticComponent<Omit<SelectPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare namespace SelectPopup {
     type Props = SelectPopupProps;
     type State = SelectPopupState;
@@ -212,13 +237,18 @@ declare const SelectPositionerDataAttributes: {
 
 interface SelectPositionerProps extends PopoverPositionerProps {
     /**
-     * Whether the positioner overlaps the trigger so the selected item's text
-     * is aligned with the trigger's value text.
+     * Whether the positioner overlaps the trigger so the selected item's text is
+     * aligned with the trigger's value text (a native-select feel).
      *
-     * This is automatically disabled if:
-     * - There is not enough space in the viewport
-     * - The trigger is too close to the viewport edges
-     * - Touch input is detected (better UX to show full list)
+     * Only applies to mouse/pen/keyboard input. When disabled, the popup falls
+     * back to standard anchored positioning on the configured `side`. It is
+     * automatically disabled when:
+     * - the select is searchable — a `Select.Input` is present (a `hideUntilActive`
+     *   input counts once it activates), so the filtered list anchors to the
+     *   trigger like a combobox;
+     * - the select was opened by touch (the full list is shown instead);
+     * - the trigger is too close to a viewport edge; or
+     * - there isn't enough room for a reasonably sized popup.
      *
      * @default true
      */
@@ -226,11 +256,16 @@ interface SelectPositionerProps extends PopoverPositionerProps {
 }
 /**
  * Positions the select popup against its trigger.
- * Supports aligning the selected item with the trigger for a native select feel.
+ *
+ * When `alignItemWithTrigger` is active, the popup overlaps the trigger so the
+ * selected item's text lines up with the trigger's value, the list is
+ * pre-scrolled to that item, and the popup is sized/anchored to fit the
+ * viewport (Base UI parity). Otherwise it delegates to the standard anchored
+ * positioning of `Popover.Positioner`.
  *
  * Renders a `<div>` element.
  */
-declare const SelectPositioner: React.ForwardRefExoticComponent<SelectPositionerProps & React.RefAttributes<HTMLDivElement>>;
+declare const SelectPositioner: React.ForwardRefExoticComponent<Omit<SelectPositionerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare namespace SelectPositioner {
     type Props = SelectPositionerProps;
     type State = Popover.Positioner.State;
@@ -301,6 +336,9 @@ interface SelectRootProps<Value = unknown, Multiple extends boolean | undefined
     defaultValue?: SelectValue$1<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;
     /**
@@ -373,23 +411,23 @@ interface SelectRootProps<Value = unknown, Multiple extends boolean | undefined
      * When specified, `<Select.Value>` renders 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
      * <Select.Root items={{ us: 'United States', uk: 'United Kingdom' }}>
      *
-     * // Array format
+     * // Array format (supports keywords and a null clearable item)
      * <Select.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 select enters a modal state when open.
      *
@@ -788,8 +826,8 @@ interface SelectContextValue<Value = unknown> {
     value: Value | null;
     /** Current selected values (multi-select mode) */
     values: Value[];
-    /** Callback when value changes (single-select mode) */
-    onValueChange: (value: Value) => void;
+    /** Callback when value changes (single-select mode; `null` clears it) */
+    onValueChange: (value: Value | null) => void;
     /** Callback when values change (multi-select mode) */
     onValuesChange: (values: Value[]) => void;
     /**
@@ -830,12 +868,10 @@ interface SelectContextValue<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 trigger element */
@@ -911,8 +947,8 @@ declare function useSelectPositionerContext(): SelectPositionerContextValue | nu
 interface SelectItemContextValue<Value = unknown> {
     /** Unique ID for this item (for DOM id attribute) */
     id: string;
-    /** The value of this item */
-    value: Value;
+    /** The value of this item (`null` for a clearable item) */
+    value: Value | null;
     /** The text value/label for this item */
     textValue: string | undefined;
     /** Whether the item is highlighted */

package/dist/select/index.js

@@ -1,2 +1,2 @@
-import{a as Qe,b as Ze,c as et,d as tt}from"../chunk-AVZ64JQ3.js";import{$ as je,L as De,N as ze,P as Oe,Qa as Je,Ra as $e,Sa as Ke,_ as Ne,aa as Ot,da as Fe,ea as qe,ha as W,ia as L,ja as Ge,l as te,oa as We,pa as Be,qa as Nt,sa as Ue,wa as _e,xa as Xe,ya as Ye}from"../chunk-WKAPAKUL.js";import{o as kt,p as At,v as Ht,w as Dt,x as zt}from"../chunk-KWGD24VS.js";import{a as wt}from"../chunk-4C666HHU.js";var st={};wt(st,{Arrow:()=>ze,Backdrop:()=>Oe,Empty:()=>We,Group:()=>Je,GroupLabel:()=>$e,Icon:()=>Ge,Input:()=>Be,Item:()=>fe,ItemIndicator:()=>Se,ItemLabel:()=>ge,List:()=>Ue,Popup:()=>Pe,Portal:()=>je,Positioner:()=>be,Root:()=>he,ScrollDownArrow:()=>Xe,ScrollUpArrow:()=>_e,Separator:()=>Ke,Surface:()=>Ve,Trigger:()=>Ce,Value:()=>Ie});import{useRender as qt}from"@base-ui/react/use-render";import*as I from"react";import*as $ from"react";var oe=$.createContext(null);function T(){let n=$.useContext(oe);if(!n)throw new Error("Select components must be used within a Select.Root");return n}function jt(){return $.useContext(oe)}var B={slot:"bazzaui-select-item",highlighted:"data-highlighted",disabled:"data-disabled",selected:"data-selected"};import*as K from"react";var ne=K.createContext(null);function Q(){let n=K.useContext(ne);if(!n)throw new Error("Select.Item child components must be used within a Select.Item");return n}function Ft(){return K.useContext(ne)}import{jsx as Ut}from"react/jsx-runtime";var Gt={highlighted:n=>n?{[B.highlighted]:""}:null,disabled:n=>n?{[B.disabled]:""}:null,selected:n=>n?{[B.selected]:""}:null};function Wt(n,u){if(n)return Array.isArray(n)?n.find(i=>i.value===u)?.label:n[u]}function Bt(n,u){let{value:s,textValue:i,keywords:m,disabled:o=!1,onSelect:l,forceMount:x=!1,render:e,className:r,style:v,onClick:c,onPointerDown:d,onPointerMove:S,children:p,...a}=n,t=T(),f=I.useMemo(()=>L(s,t.itemToStringValue),[s,t.itemToStringValue]),P=I.useMemo(()=>Wt(t.items,f),[t.items,f]),h=I.useMemo(()=>W(s,t.itemToStringLabel),[s,t.itemToStringLabel]),V=I.useMemo(()=>{if(i!==void 0)return i;if(typeof P=="string")return P;if(h&&h!==f)return h},[i,P,h,f]),y=I.useMemo(()=>{let R=typeof P=="string"?P:h&&h!==f?h:void 0;return R?m?m.includes(R)?m:[...m,R]:[R]:m},[m,P,h,f]),A=I.useRef(V),E=t.multiple?et(t.values,s,t.isItemEqualToValue):t.value!=null&&t.value!==""&&Ze(t.value,s,t.isItemEqualToValue),D=!t.multiple,b=qe({value:f,keywords:y,disabled:o,forceMount:x,closeOnClick:D,children:p});I.useEffect(()=>{let R=()=>{if(!o){if(t.multiple){let H=E?tt(t.values,s,t.isItemEqualToValue):[...t.values,s];t.onValuesChange(H)}else t.onValueChange(s);l?.()}};return b.registerSelect(R)},[o,t,s,E,l,b]),I.useEffect(()=>{let R=A.current;if(R)return t.registerItemText(f,R)},[f,t]),I.useEffect(()=>{!V&&typeof p=="string"&&(A.current=p,t.registerItemText(f,p))},[p,V,f,t]);let X=I.useMemo(()=>({highlighted:b.isHighlighted,disabled:o,selected:E}),[b.isHighlighted,o,E]),w=I.useMemo(()=>({id:b.id,value:s,textValue:V,highlighted:b.isHighlighted,disabled:o,selected:E}),[b.id,s,V,b.isHighlighted,o,E]),N=I.useCallback(R=>{c?.(R),R.defaultPrevented||b.handlers.onClick(R)},[c,b.handlers]),j=I.useCallback(R=>{b.handlers.onPointerDown(R),d?.(R)},[b.handlers,d]),F=I.useCallback(R=>{S?.(R),R.defaultPrevented||b.handlers.onPointerMove(R)},[S,b.handlers]),q=qt({render:e,ref:[b.ref,u],state:X,stateAttributesMapping:Gt,props:{...a,[B.slot]:"",id:b.id,role:"option",tabIndex:-1,"aria-selected":E,"aria-disabled":o||void 0,className:r,style:v,onClick:N,onPointerMove:F,onPointerDown:j,children:p},enabled:b.isVisible,defaultTagName:"div"});return b.isVisible?Ut(ne.Provider,{value:w,children:q}):null}var fe=I.forwardRef(Bt);import{useRender as _t}from"@base-ui/react/use-render";import*as re from"react";var le={slot:"bazzaui-select-item-indicator",selected:"data-selected"};var Xt={selected:n=>n?{[le.selected]:""}:null},Se=re.forwardRef(function(u,s){let{render:i,className:m,style:o,forceMount:l=!1,keepMounted:x=!1,children:e,...r}=u,c=Q().selected,d=re.useMemo(()=>({selected:c}),[c]),S=l||x||c,p=typeof e=="function"?e(d):x&&!c?null:e,a=_t({render:i,ref:s,state:d,stateAttributesMapping:Xt,props:{...r,[le.slot]:"","aria-hidden":!0,className:m,style:o,children:p},defaultTagName:"span"});return S?a:null});import{useRender as Yt}from"@base-ui/react/use-render";import*as k from"react";var ot={slot:"bazzaui-select-item-label"};function Jt(n,u){if(n)return Array.isArray(n)?n.find(i=>i.value===u)?.label:n[u]}var ge=k.forwardRef(function(u,s){let{render:i,className:m,style:o,children:l,...x}=u,e=T(),r=Q(),v=k.useRef(null),c=L(r.value,e.itemToStringValue),d=k.useMemo(()=>{if(l!==void 0)return l;let a=Jt(e.items,c);return a!==void 0?a:r.textValue!==void 0?r.textValue:c},[l,e.items,c,r.textValue]),S=k.useMemo(()=>({value:c,selected:r.selected,highlighted:r.highlighted,disabled:r.disabled}),[c,r.selected,r.highlighted,r.disabled]);k.useEffect(()=>{if(typeof d=="string")return e.registerItemText(c,d)},[d,e,c]);let p=k.useCallback(a=>{v.current=a,r.selected&&a&&(e.selectedItemTextRef.current=a),a&&!r.disabled&&(e.firstItemTextRef.current||(e.firstItemTextRef.current=a))},[r.selected,r.disabled,e]);return Yt({render:i,ref:s,state:S,props:{...x,[ot.slot]:"",ref:p,className:m,style:o,children:d},defaultTagName:"span"})});import"@base-ui/react/popover";import*as se from"react";import*as ae from"react";var xe=ae.createContext(null);function Z(){return ae.useContext(xe)}import{jsx as $t}from"react/jsx-runtime";var Pe=se.forwardRef(function(u,s){let{className:i,...m}=u,l=Z()?.alignItemWithTriggerActive??!1,x=se.useMemo(()=>typeof i=="function"?e=>{let r={...e,alignItemWithTriggerActive:l};return i(r)}:i,[i,l]);return $t(Ne,{ref:s,className:x,"data-align-item-with-trigger":l?"":void 0,...m})});import{Popover as Kt}from"@base-ui/react/popover";import*as M from"react";var Re={slot:"bazzaui-select-positioner"};import{jsx as lt}from"react/jsx-runtime";var U=10,Qt=100,nt=20;function Zt(n){let{triggerElement:u,positioner:s,valueElement:i,itemText:m}=n,o=u.getBoundingClientRect(),l=s.getBoundingClientRect(),x=document.documentElement.clientHeight,e=document.documentElement.clientWidth,r=o.top<nt,v=o.bottom>x-nt,c=l.height<Qt;if(r||v||c)return{shouldFallback:!0,left:0,top:0};if(!m)return{shouldFallback:!0,left:0,top:0};let d=0,S=0;if(m&&i){let h=i.getBoundingClientRect(),V=m.getBoundingClientRect(),y=h.left-o.left,A=V.left-l.left;d=y-A;let E=h.top+h.height/2,D=V.top-l.top+V.height/2;S=E-l.top-D}let p=o.left+d,a=l.top+S,t=e-l.width-U,f=x-l.height-U;p=Math.max(U,Math.min(p,t)),a=Math.max(U,Math.min(a,f));let P=x-2*U;return l.height>P?{shouldFallback:!1,left:p,top:U,maxHeight:P}:{shouldFallback:!1,left:p,top:a}}var be=M.forwardRef(function(u,s){let{alignItemWithTrigger:i=!0,side:m="bottom",align:o="start",sideOffset:l=0,className:x,style:e,children:r,...v}=u,c=te(),d=T(),S=c.store.useState("open"),[p,a]=M.useState(i),[t,f]=M.useState({positioned:!1}),P=M.useRef(null),h=M.useRef(null),V=M.useRef(null),y=M.useCallback(()=>{a(i),f({positioned:!1})},[i]);M.useEffect(()=>d.registerResetPositioningCallback(y),[d,y]),M.useLayoutEffect(()=>{if(!S||!p||t.positioned)return;let w=P.current,N=d.triggerRef.current,j=d.valueRef.current,F=d.selectedItemTextRef.current,q=d.firstItemTextRef.current;if(!w||!N)return;let H=Zt({triggerElement:N,positioner:w,valueElement:j,itemText:F??q});if(H.shouldFallback){a(!1),f({positioned:!0});return}f({positioned:!0,left:H.left,top:H.top,maxHeight:H.maxHeight})},[S,p,t.positioned,d]);let A=p?"none":m,E=M.useMemo(()=>({alignItemWithTriggerActive:p,side:A,align:o,scrollUpArrowRef:h,scrollDownArrowRef:V,setAlignItemWithTriggerActive:a,resetPositioningState:y}),[p,A,o,y]),D=M.useCallback(w=>{P.current=w,typeof s=="function"?s(w):s&&(s.current=w)},[s]),b=S&&p&&!t.positioned,X=p&&t.positioned?{position:"fixed",left:t.left,top:t.top,...t.maxHeight?{maxHeight:t.maxHeight}:{}}:{};return lt(xe.Provider,{value:E,children:lt(Kt.Positioner,{ref:D,side:p?void 0:m,align:p?void 0:o,sideOffset:p?0:l,className:x,style:{...e,...X,...b?{visibility:"hidden"}:{}},[Re.slot]:"",...v,children:r})})});import{Popover as eo}from"@base-ui/react/popover";import*as g from"react";import{jsx as ee,jsxs as to}from"react/jsx-runtime";function he(n){let{open:u,onOpenChange:s,onOpenChangeComplete:i,actionsRef:m,defaultOpen:o=!1,value:l,defaultValue:x,onValueChange:e,multiple:r=!1,values:v,defaultValues:c,onValuesChange:d,isItemEqualToValue:S=Qe,itemToStringLabel:p,itemToStringValue:a,name:t,form:f,required:P,disabled:h=!1,placeholder:V="Select...",items:y,modal:A=!0,virtualized:E=!1,virtualItems:D,onHighlightChange:b,debug:X,children:w,...N}=n,j=g.useId(),F=g.useRef(null),q=g.useRef(null),R=g.useRef(null),H=g.useRef(null),ve=g.useCallback(C=>{F.current=C},[]),Me=g.useCallback(C=>{q.current=C},[]),ce=g.useRef(null),Te=g.useCallback(C=>(ce.current=C,()=>{ce.current=null}),[]),{store:pe,focusOwnerStore:xt,openChainStore:Pt,registerSurface:Rt,closeAll:bt,virtualization:ht,handleOpenChange:ye,disabled:me,setDisabled:Ee}=De({onOpenChange:s,defaultOpen:o,virtualized:E,items:D,onHighlightChange:b,disabled:h}),de=g.useRef(null);g.useImperativeHandle(m,()=>({close:()=>{de.current?.close()},unmount:()=>{de.current?.unmount()},setDisabled:Ee}),[Ee]),pe.useControlledProp("open",u,o);let Vt=pe.useState("open"),[Ct,It]=g.useState(x!==void 0?x:null),Y=l!==void 0?l:Ct,Le=g.useCallback(C=>{l===void 0&&It(C),e?.(C)},[l,e]),[vt,Mt]=g.useState(c??[]),J=v!==void 0?v:vt,we=g.useCallback(C=>{v===void 0&&Mt(C),d?.(C)},[v,d]),ke=g.useRef(new Map),Ae=g.useCallback((C,G)=>(ke.current.set(C,G),()=>{}),[]),Tt=g.useMemo(()=>({multiple:r,value:Y,values:J,onValueChange:Le,onValuesChange:we,isItemEqualToValue:S,itemToStringLabel:p,itemToStringValue:a,name:t,form:f,required:P,disabled:me,placeholder:V,items:y,itemTextRegistry:ke.current,registerItemText:Ae,listId:j,triggerRef:F,valueRef:q,selectedItemTextRef:R,firstItemTextRef:H,setTriggerElement:ve,setValueElement:Me,registerResetPositioningCallback:Te}),[r,Y,J,Le,we,S,p,a,t,f,P,me,V,y,Ae,j,ve,Me,Te]),yt=g.useMemo(()=>t?r?J.length>0?J.map((C,G)=>{let He=L(C,a);return ee("input",{type:"hidden",name:t,value:He,form:f,required:P&&G===0},He)}):ee("input",{type:"hidden",name:t,value:"",form:f,required:P}):ee("input",{type:"hidden",name:t,value:Y!=null?L(Y,a):"",form:f,required:P}):null,[t,f,P,r,Y,J,a]),Et=g.useCallback((C,G)=>{ye(C,G.reason,G.event)},[ye]),Lt=g.useCallback(C=>{C||(ce.current?.(),H.current=null),i?.(C)},[i]);return ee(oe.Provider,{value:Tt,children:to(Fe,{store:pe,focusOwnerStore:xt,openChainStore:Pt,disabled:me,depth:0,closeAll:bt,registerSurface:Rt,virtualization:ht,menuType:"dropdown",componentName:"select",debug:X,children:[yt,ee(eo.Root,{...N,open:Vt,onOpenChange:Et,onOpenChangeComplete:Lt,modal:A,actionsRef:m?de:void 0,children:w})]})})}import*as ie from"react";var rt={slot:"bazzaui-select-surface"};import{jsx as oo}from"react/jsx-runtime";var Ve=ie.forwardRef(function(u,s){let{autoHighlightFirst:i,...m}=u,o=T(),l=Z(),x=ie.useMemo(()=>{let e=r=>r==null||r===""?!0:L(r,o.itemToStringValue);if(i==="selected"){let r=o.multiple?o.values[0]:o.value;return e(r)}if(i!==void 0)return i;if(l?.alignItemWithTriggerActive){let r=o.multiple?o.values[0]:o.value;return e(r)}return!0},[i,l?.alignItemWithTriggerActive,o.multiple,o.value,o.values,o.itemToStringValue]);return oo(Ye,{ref:s,autoHighlightFirst:x,[rt.slot]:"",...m})});import{Popover as no}from"@base-ui/react/popover";import{useRender as lo}from"@base-ui/react/use-render";import*as z from"react";var _={slot:"bazzaui-select-trigger",open:"data-open",closed:"data-closed",disabled:"data-disabled",placeholder:"data-placeholder"};import{jsx as at}from"react/jsx-runtime";var ro={open:n=>n?{[_.open]:""}:null,disabled:n=>n?{[_.disabled]:""}:null,placeholder:n=>n?{[_.placeholder]:""}:null},ao=z.forwardRef(function(u,s){let{render:i,children:m,disabled:o,className:l,style:x,triggerProps:e,triggerState:r,...v}=u,c=T(),d=o??c.disabled,S=c.multiple?c.values.length>0:c.value!=null&&c.value!=="",p=z.useMemo(()=>({open:r.open,disabled:d,placeholder:!S}),[r.open,d,S]),a=z.useCallback(t=>{c.setTriggerElement(t)},[c]);return lo({render:i,ref:s,state:p,stateAttributesMapping:ro,props:{...e,...v,[_.slot]:"",ref:a,role:"combobox","aria-haspopup":"listbox","aria-controls":c.listId,className:l,style:x,children:m},defaultTagName:"button"})}),Ce=z.forwardRef(function(u,s){let{disabled:i,...m}=u,o=T(),l=te(),x=(i??o.disabled)||l.disabled;return at(no.Trigger,{ref:s,disabled:x,render:(e,r)=>at(ao,{...m,disabled:x,triggerProps:e,triggerState:r,ref:e.ref})})});import{useRender as so}from"@base-ui/react/use-render";import*as O from"react";var ue={slot:"bazzaui-select-value",placeholder:"data-placeholder",multiple:"data-multiple"};var io={hasValue:n=>n?null:{[ue.placeholder]:""},multiple:n=>n?{[ue.multiple]:""}:null,getValueText:()=>null};function uo(n,u){let{render:s,className:i,style:m,placeholder:o,children:l,...x}=n,e=T(),r=o??e.placeholder,v=e.multiple?e.values.length>0:!!e.value,c=O.useCallback(a=>{let t=L(a,e.itemToStringValue),f=e.itemTextRegistry.get(t);if(f!==void 0)return f;let P=e.items;if(P)if(Array.isArray(P)){let V=P.find(y=>y.value===t);if(V?.label!==void 0)return V.label}else{let V=P[t];if(V!==void 0)return V}let h=W(a,e.itemToStringLabel);if(h&&h!==t)return h},[e.itemTextRegistry,e.items,e.itemToStringLabel,e.itemToStringValue]),d=O.useMemo(()=>({value:e.value,values:e.values,multiple:e.multiple,hasValue:v,placeholder:r,getValueText:c}),[e.value,e.values,e.multiple,v,r,c]),S;if(typeof l=="function")S=l(d);else if(l!==void 0)S=l;else if(!v)S=r;else if(e.multiple){let a=e.values.map(t=>{let f=c(t);return f!==void 0?f:W(t,e.itemToStringLabel)||L(t,e.itemToStringValue)}).filter(Boolean);S=a.length>2?`${a.length} selected`:a.join(", ")}else{let a=e.value;if(a!=null){let t=c(a);t!==void 0?S=t:S=W(a,e.itemToStringLabel)||L(a,e.itemToStringValue)}}let p=O.useCallback(a=>{e.setValueElement(a)},[e]);return so({render:s,ref:u,state:d,stateAttributesMapping:io,props:{...x,[ue.slot]:"",ref:p,className:i,style:m,children:S},defaultTagName:"span"})}var Ie=O.forwardRef(uo);var it=(l=>(l.slot="bazzaui-select-arrow",l.open="data-open",l.closed="data-closed",l.side="data-side",l.align="data-align",l.uncentered="data-uncentered",l))(it||{});var ut=(o=>(o.slot="bazzaui-select-backdrop",o.open="data-open",o.closed="data-closed",o.startingStyle="data-starting-style",o.endingStyle="data-ending-style",o))(ut||{});var ct=(u=>(u.slot="bazzaui-select-empty",u))(ct||{});var pt=(u=>(u.slot="bazzaui-select-group",u))(pt||{});var mt=(u=>(u.slot="bazzaui-select-group-label",u))(mt||{});var co={slot:"bazzaui-select-icon",open:"data-popup-open"};var dt=(i=>(i.slot="bazzaui-select-input",i.open="data-open",i.closed="data-closed",i))(dt||{});var ft=(s=>(s.slot="bazzaui-select-list",s.list="data-popup-menu-list",s))(ft||{});var St=(u=>(u.alignItemWithTrigger="data-align-item-with-trigger",u))(St||{});var po={slotUp:"bazzaui-select-scroll-up-arrow",slotDown:"bazzaui-select-scroll-down-arrow",direction:"data-direction",side:"data-side"};var gt=(u=>(u.slot="bazzaui-select-separator",u))(gt||{});export{st as Select,it as SelectArrowDataAttributes,ut as SelectBackdropDataAttributes,ct as SelectEmptyDataAttributes,pt as SelectGroupDataAttributes,mt as SelectGroupLabelDataAttributes,co as SelectIconDataAttributes,dt as SelectInputDataAttributes,fe as SelectItem,B as SelectItemDataAttributes,Se as SelectItemIndicator,le as SelectItemIndicatorDataAttributes,ge as SelectItemLabel,Nt as SelectListCssVars,ft as SelectListDataAttributes,Pe as SelectPopup,St as SelectPopupDataAttributes,be as SelectPositioner,Ot as SelectPositionerCssVars,Re as SelectPositionerDataAttributes,he as SelectRoot,po as SelectScrollArrowDataAttributes,gt as SelectSeparatorDataAttributes,zt as SelectStore,Ve as SelectSurface,Ce as SelectTrigger,_ as SelectTriggerDataAttributes,Ie as SelectValue,Ht as commandScore,Dt as defaultFilter,jt as useMaybeSelectContext,Ft as useMaybeSelectItemContext,At as useMaybeSurfaceContext,T as useSelectContext,Q as useSelectItemContext,Z as useSelectPositionerContext,kt as useSurfaceContext};
+import{a as ht,b as xt,c as bt,d as Pt,e as Rt,f as Pe,g as It}from"../chunk-KO3DXT3Y.js";import{Ab as St,L as et,La as nt,Ma as rt,N as tt,Na as to,P as ot,Qa as lt,Ra as at,Ua as ge,Va as Se,Wa as F,Xa as it,Ya as st,Za as ut,_a as oo,ab as ct,eb as pt,fb as mt,gb as dt,l as ye,yb as ft,zb as gt}from"../chunk-2D2HREBK.js";import{a as Qe,p as Kt,q as Jt,w as Zt,x as Qt,y as eo}from"../chunk-ZPRKUVIC.js";import{a as $t}from"../chunk-4C666HHU.js";var Dt={};$t(Dt,{Arrow:()=>tt,Backdrop:()=>ot,Empty:()=>st,Group:()=>ft,GroupLabel:()=>gt,Icon:()=>it,Input:()=>ut,Item:()=>De,ItemIndicator:()=>Oe,ItemLabel:()=>Ne,List:()=>ct,Popup:()=>Fe,Portal:()=>rt,Positioner:()=>_e,Root:()=>qe,ScrollDownArrow:()=>mt,ScrollUpArrow:()=>pt,Separator:()=>St,Surface:()=>Ue,Trigger:()=>Ye,Value:()=>Xe});import{useRender as lo}from"@base-ui/react/use-render";import*as y from"react";import*as Re from"react";var Ee=Re.createContext(null);function D(){let n=Re.useContext(Ee);if(!n)throw new Error("Select components must be used within a Select.Root");return n}function no(){return Re.useContext(Ee)}var he={slot:"bazzaui-select-item",highlighted:"data-highlighted",disabled:"data-disabled",selected:"data-selected"};import*as Ie from"react";var we=Ie.createContext(null);function Ce(){let n=Ie.useContext(we);if(!n)throw new Error("Select.Item child components must be used within a Select.Item");return n}function ro(){return Ie.useContext(we)}import{jsx as so}from"react/jsx-runtime";var ao={highlighted:n=>n?{[he.highlighted]:""}:null,disabled:n=>n?{[he.disabled]:""}:null,selected:n=>n?{[he.selected]:""}:null};function io(n,t){let{value:o,textValue:l,keywords:i,disabled:r=!1,onSelect:u,forceMount:h=!1,render:e,className:a,style:I,onClick:d,onPointerDown:p,onPointerMove:P,children:f,...s}=n,c=D(),g=y.useMemo(()=>F(o,c.itemToStringValue),[o,c.itemToStringValue]),T=y.useId(),L=o===null?`select-clear-${T}`:void 0,S=y.useMemo(()=>Rt(c.items,g),[c.items,g]),M=S?.label,w=y.useMemo(()=>Se(o,c.itemToStringLabel),[o,c.itemToStringLabel]),v=y.useMemo(()=>{if(l!==void 0)return l;if(typeof M=="string")return M;if(w&&w!==g)return w},[l,M,w,g]),Z=y.useMemo(()=>It(i,[typeof M=="string"?M:w&&w!==g?w:void 0,...S?.keywords??[]]),[i,M,w,g,S]),k=y.useRef(v),O=c.multiple?bt(c.values,o,c.isItemEqualToValue):c.value!==""&&xt(c.value,o,c.isItemEqualToValue),le=!c.multiple,x=at({id:L,value:g,keywords:Z,disabled:r,forceMount:h,closeOnClick:le,children:f});y.useEffect(()=>{let V=()=>{if(!r){if(c.multiple)if(o==null)c.onValuesChange([]);else{let J=O?Pt(c.values,o,c.isItemEqualToValue):[...c.values,o];c.onValuesChange(J)}else c.onValueChange(o);u?.()}};return x.registerSelect(V)},[r,c,o,O,u,x]),y.useEffect(()=>{let V=k.current;if(V)return c.registerItemText(g,V)},[g,c]),y.useEffect(()=>{!v&&typeof f=="string"&&(k.current=f,c.registerItemText(g,f))},[f,v,g,c]);let G=y.useMemo(()=>({highlighted:x.isHighlighted,disabled:r,selected:O}),[x.isHighlighted,r,O]),_=y.useMemo(()=>({id:x.id,value:o,textValue:v,highlighted:x.isHighlighted,disabled:r,selected:O}),[x.id,o,v,x.isHighlighted,r,O]),j=y.useCallback(V=>{d?.(V),V.defaultPrevented||x.handlers.onClick(V)},[d,x.handlers]),K=y.useCallback(V=>{x.handlers.onPointerDown(V),p?.(V)},[x.handlers,p]),q=y.useCallback(V=>{P?.(V),V.defaultPrevented||x.handlers.onPointerMove(V)},[P,x.handlers]),B=lo({render:e,ref:[x.ref,t],state:G,stateAttributesMapping:ao,props:{...s,[he.slot]:"",id:x.id,role:"option",tabIndex:-1,"aria-selected":O,"aria-disabled":r||void 0,className:a,style:I,onClick:j,onPointerMove:q,onPointerDown:K,children:f},enabled:x.isVisible,defaultTagName:"div"});return x.isVisible?so(we.Provider,{value:_,children:B}):null}var De=y.forwardRef(io);import{useRender as uo}from"@base-ui/react/use-render";import*as He from"react";var Ve={slot:"bazzaui-select-item-indicator",selected:"data-selected",highlighted:"data-highlighted"};var co={selected:n=>n?{[Ve.selected]:""}:null,highlighted:n=>n?{[Ve.highlighted]:""}:null},Oe=He.forwardRef(function(t,o){let{render:l,className:i,style:r,forceMount:u=!1,keepMounted:h=!1,children:e,...a}=t,I=Ce(),d=I.selected,p=I.highlighted,P=He.useMemo(()=>({selected:d,highlighted:p}),[d,p]),f=u||h||d,s=typeof e=="function"?e(P):h&&!d?null:e,c=uo({render:l,ref:o,state:P,stateAttributesMapping:co,props:{...a,[Ve.slot]:"","aria-hidden":!0,className:i,style:r,children:s},defaultTagName:"span"});return f?c:null});import{useRender as po}from"@base-ui/react/use-render";import*as W from"react";var Ct={slot:"bazzaui-select-item-label"};var Ne=W.forwardRef(function(t,o){let{render:l,className:i,style:r,children:u,...h}=t,e=D(),a=Ce(),I=W.useRef(null),d=F(a.value,e.itemToStringValue),p=W.useMemo(()=>{if(u!==void 0)return u;let s=Pe(e.items,d);return s!==void 0?s:a.textValue!==void 0?a.textValue:d},[u,e.items,d,a.textValue]),P=W.useMemo(()=>({value:d,selected:a.selected,highlighted:a.highlighted,disabled:a.disabled}),[d,a.selected,a.highlighted,a.disabled]);W.useEffect(()=>{if(typeof p=="string")return e.registerItemText(d,p)},[p,e,d]);let f=W.useCallback(s=>{I.current=s,a.selected&&s&&(e.selectedItemTextRef.current=s),s&&!a.disabled&&(e.firstItemTextRef.current||(e.firstItemTextRef.current=s))},[a.selected,a.disabled,e]);return po({render:l,ref:o,state:P,props:{...h,[Ct.slot]:"",ref:f,className:i,style:r,children:p},defaultTagName:"span"})});import"@base-ui/react/popover";import*as ue from"react";import*as Le from"react";var ze=Le.createContext(null);function Te(){return Le.useContext(ze)}import{jsx as mo}from"react/jsx-runtime";var Fe=ue.forwardRef(function(t,o){let{className:l,render:i,...r}=t,u=Te(),h=u?.alignItemWithTriggerActive??!1,e=u?.align,a=ue.useCallback(p=>({...p,side:h?"none":p.side,alignItemWithTriggerActive:h}),[h]),I=ue.useMemo(()=>typeof l=="function"?p=>l(a(p)):l,[l,a]),d=ue.useMemo(()=>typeof i=="function"?(p,P)=>i(p,a(P)):i,[i,a]);return mo(nt,{ref:o,className:I,render:d,"data-align-item-with-trigger":h?"":void 0,...h?{"data-side":"none","data-align":e}:{},...r})});import{useDirection as fo}from"@base-ui/react/internals/direction-context";import{Popover as go}from"@base-ui/react/popover";import*as R from"react";function ce(n,t,o){return n<t?t:n>o?o:n}function Ge(n){let t=n.getBoundingClientRect(),{offsetWidth:o,offsetHeight:l}=n,i=o>0?Math.round(t.width)/o:1,r=l>0?Math.round(t.height)/l:1;return(!Number.isFinite(i)||i===0)&&(i=1),(!Number.isFinite(r)||r===0)&&(r=1),{x:i,y:r}}function Vt(n,t,o){return n/o[t]}function Me(n,t){let o=n.x/t.x,l=n.y/t.y,i=n.width/t.x,r=n.height/t.y;return{x:o,y:l,width:i,height:r,top:l,left:o,right:o+i,bottom:l+r}}var $=1;function xe(n,t){return Math.max(0,n-t)}var Tt=5,Mt=20,je=10,vt=100;function yt(n){let{triggerRect:t,positionerRect:o,valueRect:l,textRect:i,scrollHeight:r,documentClientHeight:u,documentClientWidth:h,marginTop:e,marginBottom:a,minHeight:I,maxPopupHeight:d,borderBottom:p,direction:P}=n,f=()=>({fallback:!0,left:0,isTopPositioned:!1,top:0,height:0,scrollTop:0,marginTop:e,marginBottom:a,reachedMaxHeight:!1,transformOrigin:null}),s=u-e-a,c=h,g=t.height,T=s-t.bottom+g,L=P==="rtl"?t.right-o.width:t.left,S=0,M=null;if(i&&l){L=o.left+(P==="rtl"?l.right-i.right:l.left-i.left);let U=l.top-t.top+l.height/2;S=i.top-o.top+i.height/2-U,M=i.top+i.height/2}let w=T+S+a+p,v=Math.min(s,w),Z=s-e-a,k=w-v,O=c-Tt,le=ce(L,Tt,O-o.width),x=xe(r,v),G=k>=x-$;if(G&&(v=Math.min(s,o.height)-(k-x)),t.top<Mt||t.bottom>s-Mt||Math.ceil(v)+$<Math.min(r,I))return f();let j=Math.max(I,v),K=a+p-e,q=0,B=k;if(G){let U=Math.max(0,s-w);q=o.height>=Z?0:Math.max(0,U+K),B=x}else B=Math.max(0,k-K);let V=null;if(M!=null){let U=o.top,A=o.height,m=A>0?(M-U)/A*100:50;V=`50% ${ce(m,0,100)}%`}let J=j===s||v>=d;return{fallback:!1,left:le,isTopPositioned:G,top:q,height:v,scrollTop:B,marginTop:e,marginBottom:a,reachedMaxHeight:J,transformOrigin:V}}function Et(n){let{isTopPositioned:t,currentHeight:o,scrollTop:l,maxScrollTop:i,maxAvailableHeight:r}=n,u=t?i-l:l;if(u<=$){let d=ce(u,0,r-o),p=o+d;return{height:d>0?p:null,scroll:{kind:"set",value:t?i:0},reachedMaxHeight:r-p<=$}}let h=Math.min(o+u,r),e={kind:"none"},a=!1;if(r-h>$)e=t?{kind:"max"}:{kind:"clamp",value:0};else if(a=!0,!t&&l<i){let d=o+u-r;e={kind:"clamp",value:l-(u-d)}}let I=Math.ceil(h);return{height:I,scroll:e,reachedMaxHeight:a||I>=r-$}}var Be={slot:"bazzaui-select-positioner"};import{jsx as Lt}from"react/jsx-runtime";var _e=R.forwardRef(function(t,o){let{alignItemWithTrigger:l=!0,side:i="bottom",align:r="start",sideOffset:u=0,className:h,style:e,children:a,...I}=t,d=ye(),p=D(),P=fo()==="rtl"?"rtl":"ltr",f=d.store,s=f.useState("open"),c=f.useState("openMethod"),g=f.useState("hasInput"),[T,L]=R.useState(l),S=T&&c!=="touch"&&!g,[M,w]=R.useState(!1),[v,Z]=R.useState(null),k=R.useRef(null),O=R.useRef(null),le=R.useRef(null),x=R.useRef(!1),G=R.useRef(!1),_=R.useCallback(()=>{let m=k.current,C=f.context.refs.popupRef.current;m&&(m.style.height=""),C&&(C.style.height="",C.style.removeProperty("--transform-origin")),x.current=!1,G.current=!1},[f]),j=R.useCallback(()=>{_(),L(l),w(!1),Z(null)},[l,_]);R.useEffect(()=>p.registerResetPositioningCallback(j),[p,j]);let K=R.useCallback(()=>{if(f.state.hasInput)return;let m=k.current,C=p.triggerRef.current,N=f.context.refs.popupRef.current,Y=f.context.refs.listRef.current;if(!m||!C||!N||!Y)return;let Q=p.selectedItemTextRef.current;if(!Q?.isConnected){let z=p.firstItemTextRef.current;Q=z?.isConnected?z:null}let ee=p.valueRef.current,ae=ho(N),H;try{let z=We(m),ie=m.ownerDocument,te=Ge(C),se=z.getComputedStyle(m),X=z.getComputedStyle(N);H=yt({triggerRect:Me(C.getBoundingClientRect(),te),positionerRect:Me(m.getBoundingClientRect(),te),valueRect:ee?Me(ee.getBoundingClientRect(),te):null,textRect:Q?Me(Q.getBoundingClientRect(),te):null,scrollHeight:Y.scrollHeight,documentClientHeight:ie.documentElement.clientHeight,documentClientWidth:ie.documentElement.clientWidth,marginTop:Number.parseFloat(se.marginTop)||je,marginBottom:Number.parseFloat(se.marginBottom)||je,minHeight:Number.parseFloat(se.minHeight)||vt,maxPopupHeight:wt(X),borderBottom:Number.parseFloat(X.borderBottomWidth)||0,direction:P});let me=(z.visualViewport?.scale??1)!==1&&So(z);if(H.fallback||me){L(!1),w(!0);return}m.style.height=`${H.height}px`,N.style.height="100%",H.transformOrigin&&N.style.setProperty("--transform-origin",H.transformOrigin),Y.scrollTop=H.scrollTop,x.current=H.reachedMaxHeight,G.current=!0}finally{ae()}Z({left:H.left,top:H.isTopPositioned?H.top:null,bottom:H.isTopPositioned?null:0,marginTop:H.marginTop,marginBottom:H.marginBottom}),w(!0)},[f,p,P]);R.useEffect(()=>{!s||!S||M||K()},[s,S,M,K]),R.useEffect(()=>{s&&!S&&_()},[s,S,_]),R.useEffect(()=>{if(!s||!S)return;let m=k.current,C=m?We(m):window,N=Y=>{f.setOpen(!1,Qe.none,Y)};return C.addEventListener("resize",N),()=>{C.removeEventListener("resize",N)}},[s,S,f]);let q=R.useCallback(m=>{let C=k.current,N=f.context.refs.popupRef.current;if(!C||!N||!G.current||x.current||!S)return;let Y=C.style.top==="0px",Q=C.style.bottom==="0px";if(!Y&&!Q)return;let ee=We(C),ae=C.ownerDocument,H=Ge(C),z=Vt(C.getBoundingClientRect().height,"y",H),ie=ee.getComputedStyle(C),te=Number.parseFloat(ie.marginTop)||0,se=Number.parseFloat(ie.marginBottom)||0,X=wt(ee.getComputedStyle(N)),me=Math.min(ae.documentElement.clientHeight-te-se,X),oe=Et({isTopPositioned:Y,currentHeight:z,scrollTop:m.scrollTop,maxScrollTop:xe(m.scrollHeight,m.clientHeight),maxAvailableHeight:me});switch(oe.height!=null&&(C.style.height=`${oe.height}px`),oe.scroll.kind){case"set":m.scrollTop=oe.scroll.value;break;case"max":{let de=xe(m.scrollHeight,m.clientHeight);Math.abs(m.scrollTop-de)>$&&(m.scrollTop=de);break}case"clamp":{let de=xe(m.scrollHeight,m.clientHeight),ne=ce(oe.scroll.value,0,de);Math.abs(m.scrollTop-ne)>$&&(m.scrollTop=ne);break}default:break}oe.reachedMaxHeight&&(x.current=!0)},[f,S]);R.useEffect(()=>{if(!s||!S||!M)return;let m=f.context.refs.listRef.current;if(!m)return;let C=()=>q(m);return m.addEventListener("scroll",C,{passive:!0}),()=>{m.removeEventListener("scroll",C)}},[s,S,M,q,f]);let B=S?"none":i,V=R.useMemo(()=>({alignItemWithTriggerActive:S,side:B,align:r,scrollUpArrowRef:O,scrollDownArrowRef:le,setAlignItemWithTriggerActive:L,resetPositioningState:j}),[S,B,r,j]),J=R.useCallback(m=>{k.current=m,typeof o=="function"?o(m):o&&(o.current=m)},[o]),U=s&&S&&!M,A=S&&v?{position:"fixed",transform:"none",left:v.left,top:v.top??"auto",bottom:v.bottom??"auto",marginTop:v.marginTop,marginBottom:v.marginBottom,maxHeight:"none"}:{};return Lt(ze.Provider,{value:V,children:Lt(go.Positioner,{ref:J,side:S?void 0:i,align:S?void 0:r,sideOffset:S?0:u,disableAnchorTracking:S||void 0,className:h,style:{...e,...A,...U?{visibility:"hidden"}:{}},...S?{"data-side":"none","data-align":r}:{},[Be.slot]:"",...I,children:a})})});function We(n){return n.ownerDocument?.defaultView??window}function wt(n){let t=n.maxHeight||"";return t.endsWith("px")&&Number.parseFloat(t)||Number.POSITIVE_INFINITY}function So(n){let t=n.navigator;return t?/AppleWebKit/.test(t.userAgent)&&!/Chrome|Chromium|Edg|OPR/.test(t.userAgent):!1}var Ht=[["transform","none"],["scale","1"],["translate","0 0"]];function ho(n){let{style:t}=n,o={};for(let[l,i]of Ht)o[l]=t.getPropertyValue(l),t.setProperty(l,i,"important");return()=>{for(let[l]of Ht){let i=o[l];i?t.setProperty(l,i):t.removeProperty(l)}}}import{Popover as xo}from"@base-ui/react/popover";import*as b from"react";import{jsx as ve,jsxs as bo}from"react/jsx-runtime";function qe(n){let{open:t,onOpenChange:o,onOpenChangeComplete:l,actionsRef:i,defaultOpen:r=!1,value:u,defaultValue:h,onValueChange:e,multiple:a=!1,values:I,defaultValues:d,onValuesChange:p,isItemEqualToValue:P=ht,itemToStringLabel:f,itemToStringValue:s,name:c,form:g,required:T,disabled:L=!1,placeholder:S="Select...",items:M,modal:w=!0,virtualized:v=!1,virtualItems:Z,onHighlightChange:k,debug:O,children:le,...x}=n,G=b.useId(),_=b.useRef(null),j=b.useRef(null),K=b.useRef(null),q=b.useRef(null),B=b.useCallback(E=>{_.current=E},[]),V=b.useCallback(E=>{j.current=E},[]),J=b.useRef(null),U=b.useCallback(E=>(J.current=E,()=>{J.current=null}),[]),{store:A,focusOwnerStore:m,openChainStore:C,registerSurface:N,closeAll:Y,virtualization:Q,handleOpenChange:ee,disabled:ae,setDisabled:H}=et({onOpenChange:o,defaultOpen:r,virtualized:v,items:Z,onHighlightChange:k,disabled:L}),z=b.useRef(null);b.useImperativeHandle(i,()=>({close:()=>{z.current?.close()},unmount:()=>{z.current?.unmount()},setDisabled:H}),[H]),A.useControlledProp("openProp",t);let ie=A.useState("open"),[te,se]=b.useState(h!==void 0?h:null),X=u!==void 0?u:te,me=b.useCallback(E=>{u===void 0&&se(E),e?.(E)},[u,e]),[oe,de]=b.useState(d??[]),ne=I!==void 0?I:oe,$e=b.useCallback(E=>{I===void 0&&de(E),p?.(E)},[I,p]),Ke=b.useRef(new Map),Je=b.useCallback((E,fe)=>(Ke.current.set(E,fe),()=>{}),[]),qt=b.useMemo(()=>({multiple:a,value:X,values:ne,onValueChange:me,onValuesChange:$e,isItemEqualToValue:P,itemToStringLabel:f,itemToStringValue:s,name:c,form:g,required:T,disabled:ae,placeholder:S,items:M,itemTextRegistry:Ke.current,registerItemText:Je,listId:G,triggerRef:_,valueRef:j,selectedItemTextRef:K,firstItemTextRef:q,setTriggerElement:B,setValueElement:V,registerResetPositioningCallback:U}),[a,X,ne,me,$e,P,f,s,c,g,T,ae,S,M,Je,G,B,V,U]),Ut=b.useMemo(()=>c?a?ne.length>0?ne.map((E,fe)=>{let Ze=F(E,s);return ve("input",{type:"hidden",name:c,value:Ze,form:g,required:T&&fe===0},Ze)}):ve("input",{type:"hidden",name:c,value:"",form:g,required:T}):ve("input",{type:"hidden",name:c,value:X!=null?F(X,s):"",form:g,required:T}):null,[c,g,T,a,X,ne,s]),Yt=b.useCallback((E,fe)=>{ee(E,fe.reason,fe.event)},[ee]),Xt=b.useCallback(E=>{!E&&A.context.clearSearchOnClose==="after-exit"&&(A.clearSearch(),A.setInputActive(!1)),E||(A.clearHighlight(),J.current?.(),q.current=null),l?.(E)},[A,l]);return ve(Ee.Provider,{value:qt,children:bo(lt,{store:A,focusOwnerStore:m,openChainStore:C,disabled:ae,depth:0,closeAll:Y,registerSurface:N,virtualization:Q,menuType:"dropdown",componentName:"select",debug:O,children:[Ut,ve(xo.Root,{...x,open:ie,onOpenChange:Yt,onOpenChangeComplete:Xt,modal:w,actionsRef:i?z:void 0,children:le})]})})}import*as ke from"react";var kt={slot:"bazzaui-select-surface"};import{jsx as Po}from"react/jsx-runtime";var Ue=ke.forwardRef(function(t,o){let{autoHighlightFirst:l,...i}=t,r=D(),u=Te(),h=ke.useMemo(()=>{let e=a=>ge(a)?!0:F(a,r.itemToStringValue);if(l==="selected"){let a=r.multiple?r.values[0]:r.value;return e(a)}if(l!==void 0)return l;if(u?.alignItemWithTriggerActive){let a=r.multiple?r.values[0]:r.value;return e(a)}return!0},[l,u?.alignItemWithTriggerActive,r.multiple,r.value,r.values,r.itemToStringValue]);return Po(dt,{ref:o,autoHighlightFirst:h,[kt.slot]:"",...i})});import{Popover as Ro}from"@base-ui/react/popover";import{useRender as Io}from"@base-ui/react/use-render";import*as pe from"react";var be={slot:"bazzaui-select-trigger",open:"data-open",closed:"data-closed",disabled:"data-disabled",placeholder:"data-placeholder"};import{jsx as At}from"react/jsx-runtime";var Co={open:n=>n?{[be.open]:""}:null,disabled:n=>n?{[be.disabled]:""}:null,placeholder:n=>n?{[be.placeholder]:""}:null},Vo=pe.forwardRef(function(t,o){let{render:l,children:i,disabled:r,className:u,style:h,triggerProps:e,triggerState:a,...I}=t,d=D(),p=r??d.disabled,P=d.multiple?d.values.length>0:!ge(d.value),f=pe.useMemo(()=>({open:a.open,disabled:p,placeholder:!P}),[a.open,p,P]),s=pe.useCallback(c=>{d.setTriggerElement(c)},[d]);return Io({render:l,ref:o,state:f,stateAttributesMapping:Co,props:{...e,...I,[be.slot]:"",ref:s,role:"combobox","aria-haspopup":"listbox","aria-controls":d.listId,className:u,style:h,children:i},defaultTagName:"button"})}),Ye=pe.forwardRef(function(t,o){let{disabled:l,...i}=t,r=D(),u=ye(),h=(l??r.disabled)||u.disabled;return At(Ro.Trigger,{ref:o,disabled:h,render:(e,a)=>At(Vo,{...i,disabled:h,triggerProps:e,triggerState:a,ref:e.ref})})});import{useRender as To}from"@base-ui/react/use-render";import*as re from"react";var Ae={slot:"bazzaui-select-value",placeholder:"data-placeholder",multiple:"data-multiple"};var Mo={hasValue:n=>n?null:{[Ae.placeholder]:""},multiple:n=>n?{[Ae.multiple]:""}:null,getValueText:()=>null};function vo(n,t){let{render:o,className:l,style:i,placeholder:r,children:u,...h}=n,e=D(),a=r??e.placeholder,I=re.useMemo(()=>Pe(e.items,""),[e.items]),d=r??I??a,p=e.multiple?e.values.length>0:!ge(e.value),P=re.useCallback(g=>{let T=F(g,e.itemToStringValue),L=e.itemTextRegistry.get(T);if(L!==void 0)return L;let S=Pe(e.items,T);if(S!==void 0)return S;let M=Se(g,e.itemToStringLabel);if(M&&M!==T)return M},[e.itemTextRegistry,e.items,e.itemToStringLabel,e.itemToStringValue]),f=re.useMemo(()=>({value:e.value,values:e.values,multiple:e.multiple,hasValue:p,placeholder:a,getValueText:P}),[e.value,e.values,e.multiple,p,a,P]),s;if(typeof u=="function")s=u(f);else if(u!==void 0)s=u;else if(!p)s=d;else if(e.multiple){let g=e.values.map(T=>{let L=P(T);return L!==void 0?L:Se(T,e.itemToStringLabel)||F(T,e.itemToStringValue)}).filter(Boolean);s=g.length>2?`${g.length} selected`:g.join(", ")}else{let g=e.value;if(g!=null){let T=P(g);T!==void 0?s=T:s=Se(g,e.itemToStringLabel)||F(g,e.itemToStringValue)}}let c=re.useCallback(g=>{e.setValueElement(g)},[e]);return To({render:o,ref:t,state:f,stateAttributesMapping:Mo,props:{...h,[Ae.slot]:"",ref:c,className:l,style:i,children:s},defaultTagName:"span"})}var Xe=re.forwardRef(vo);var Ot=(u=>(u.slot="bazzaui-select-arrow",u.open="data-open",u.closed="data-closed",u.side="data-side",u.align="data-align",u.uncentered="data-uncentered",u))(Ot||{});var Nt=(r=>(r.slot="bazzaui-select-backdrop",r.open="data-open",r.closed="data-closed",r.startingStyle="data-starting-style",r.endingStyle="data-ending-style",r))(Nt||{});var zt=(t=>(t.slot="bazzaui-select-empty",t))(zt||{});var Ft=(t=>(t.slot="bazzaui-select-group",t))(Ft||{});var Gt=(t=>(t.slot="bazzaui-select-group-label",t))(Gt||{});var yo={slot:"bazzaui-select-icon",open:"data-popup-open"};var jt=(l=>(l.slot="bazzaui-select-input",l.open="data-open",l.closed="data-closed",l))(jt||{});var Bt=(o=>(o.slot="bazzaui-select-list",o.list="data-popup-menu-list",o))(Bt||{});var Wt=(t=>(t.alignItemWithTrigger="data-align-item-with-trigger",t))(Wt||{});var Eo={slotUp:"bazzaui-select-scroll-up-arrow",slotDown:"bazzaui-select-scroll-down-arrow",direction:"data-direction",side:"data-side"};var _t=(t=>(t.slot="bazzaui-select-separator",t))(_t||{});export{Dt as Select,Ot as SelectArrowDataAttributes,Nt as SelectBackdropDataAttributes,zt as SelectEmptyDataAttributes,Ft as SelectGroupDataAttributes,Gt as SelectGroupLabelDataAttributes,yo as SelectIconDataAttributes,jt as SelectInputDataAttributes,De as SelectItem,he as SelectItemDataAttributes,Oe as SelectItemIndicator,Ve as SelectItemIndicatorDataAttributes,Ne as SelectItemLabel,oo as SelectListCssVars,Bt as SelectListDataAttributes,Fe as SelectPopup,Wt as SelectPopupDataAttributes,_e as SelectPositioner,to as SelectPositionerCssVars,Be as SelectPositionerDataAttributes,qe as SelectRoot,Eo as SelectScrollArrowDataAttributes,_t as SelectSeparatorDataAttributes,eo as SelectStore,Ue as SelectSurface,Ye as SelectTrigger,be as SelectTriggerDataAttributes,Xe as SelectValue,Zt as commandScore,Qt as defaultFilter,no as useMaybeSelectContext,ro as useMaybeSelectItemContext,Jt as useMaybeSurfaceContext,D as useSelectContext,Ce as useSelectItemContext,Te as useSelectPositionerContext,Kt as useSurfaceContext};
 //# sourceMappingURL=index.js.map