@limonify/zest-ui 0.3.2 → 0.4.0

package/src/select/trigger/SelectTrigger.tsx

@@ -1,10 +1,16 @@
 'use client';
 import * as React from 'react';
 import { Pressable, type GestureResponderEvent, type LayoutChangeEvent } from 'react-native';
-import { useSelectRootContext } from '../root/SelectRootContext';
+import { SelectRootContext } from '../root/SelectRootContext';
 import { useRenderElement } from '../../use-render/useRenderElement';
 import { useButton } from '../../internals/use-button/useButton';
+import { useFieldControlRegistration } from '../../internals/field/useFieldControlRegistration';
+import { useId } from '../../hooks/useId';
+import { useIsoLayoutEffect } from '../../hooks/useIsoLayoutEffect';
 import { useMergedRefs } from '../../hooks/useMergedRefs';
+import { usePopupHandleStore } from '../../utils/popups/usePopupHandleStore';
+import type { SelectHandle } from '../store/SelectHandle';
+import type { SelectStore } from '../store/SelectStore';
 import type { ZestUIComponentProps } from '../../types';
 import { createChangeEventDetails } from '../../utils/createChangeEventDetails';
 import { REASONS } from '../../utils/reasons';
@@ -12,18 +18,42 @@ import { REASONS } from '../../utils/reasons';
 /**
  * A button that opens the select popup, and the element it is positioned against.
  * Renders a `<Pressable>`.
+ *
+ * Pass a `handle` to render a trigger outside of its `Select.Root`: there is no
+ * context reaching across, so the handle is what connects the two.
  */
-export function SelectTrigger(componentProps: SelectTrigger.Props) {
+export function SelectTrigger<Payload = unknown>(componentProps: SelectTrigger.Props<Payload>) {
   const {
     render,
     className,
     style,
     disabled: disabledProp = false,
+    handle,
+    nativeID: idProp,
+    payload,
     ref,
     ...elementProps
   } = componentProps;
 
-  const store = useSelectRootContext();
+  const rootStore = React.useContext(SelectRootContext);
+  const handleStore = usePopupHandleStore(handle);
+
+  // A trigger inside a root uses that root; a detached one follows its handle,
+  // which resolves to the attached root's store or to an inert fallback.
+  const store = (handleStore ?? rootStore) as SelectStore | undefined;
+
+  if (store === undefined) {
+    throw new Error(
+      'Zest: Select.Trigger must be placed within <Select.Root>, or given a `handle` it shares with one.',
+    );
+  }
+
+  const id = useId(idProp ?? undefined);
+
+  // The trigger is the element assistive tech announces, so the field's label
+  // and messages attach here rather than to the root.
+  const { fieldProps } = useFieldControlRegistration();
+
   const open = store.useState('open');
   const rootDisabled = store.useState('disabled');
   const readOnly = store.useState('readOnly');
@@ -36,14 +66,31 @@ export function SelectTrigger(componentProps: SelectTrigger.Props) {
 
   const { getButtonProps } = useButton({ disabled });
 
+  const triggerRef = React.useRef<unknown>(null);
   const anchorRef = React.useCallback(
     (node: unknown) => {
+      triggerRef.current = node;
       store.set('triggerNode', node);
     },
     [store],
   );
   const mergedRef = useMergedRefs(ref, anchorRef);
 
+  // Registering into whichever store is current is what lets a handle resolve
+  // `open(id)`. The effect re-runs when the handle swaps stores, migrating the
+  // registration to the root that just attached.
+  useIsoLayoutEffect(() => {
+    if (id === undefined) {
+      return undefined;
+    }
+
+    store.context.triggerNodes.add(id, triggerRef.current);
+
+    return () => {
+      store.context.triggerNodes.delete(id);
+    };
+  }, [store, id]);
+
   const state: SelectTriggerState = { disabled, open, pressed, readOnly, required };
 
   return useRenderElement(Pressable, componentProps, {
@@ -51,11 +98,19 @@ export function SelectTrigger(componentProps: SelectTrigger.Props) {
     ref: mergedRef,
     props: [
       {
+        nativeID: id,
         onPress(event: GestureResponderEvent) {
           if (readOnly) {
             return;
           }
 
+          if (payload !== undefined) {
+            store.set('payload', payload);
+          }
+          if (id !== undefined) {
+            store.set('triggerId', id);
+          }
+
           store.setOpen(!open, createChangeEventDetails(REASONS.triggerPress, event));
         },
         onPressIn() {
@@ -65,16 +120,21 @@ export function SelectTrigger(componentProps: SelectTrigger.Props) {
           setPressed(false);
         },
         onLayout(event: LayoutChangeEvent) {
-          const { width } = event.nativeEvent.layout;
+          const { width, height } = event.nativeEvent.layout;
           store.set('triggerWidth', width);
+          store.set('triggerHeight', height);
           store.state.update?.();
         },
         accessibilityRole: 'combobox' as const,
-        accessibilityLabelledBy: labelId,
         accessibilityState: { expanded: open, disabled: disabled || undefined },
         'aria-haspopup': 'listbox' as const,
         'aria-readonly': readOnly || undefined,
         'aria-required': required || undefined,
+        ...fieldProps,
+        // A surrounding `Field.Label` names the control; `Select.Label` is the
+        // fallback for a select that stands on its own.
+        accessibilityLabelledBy: fieldProps.accessibilityLabelledBy ?? labelId,
+        'aria-labelledby': fieldProps['aria-labelledby'] ?? labelId,
       },
       elementProps,
       getButtonProps,
@@ -90,16 +150,27 @@ export interface SelectTriggerState {
   required: boolean;
 }
 
-export interface SelectTriggerProps
+export interface SelectTriggerProps<Payload = unknown>
   extends ZestUIComponentProps<typeof Pressable, SelectTriggerState> {
   /**
    * Whether the component should ignore user interaction.
    * @default false
    */
   disabled?: boolean | undefined;
+  /**
+   * A handle shared with a `Select.Root`, which is what lets this trigger live
+   * outside of it. Create one with `Select.createHandle()`.
+   *
+   * The trigger's `nativeID` is the id a handle's `open(triggerId)` resolves.
+   */
+  handle?: SelectHandle<Payload> | undefined;
+  /**
+   * A payload handed to the root's children when they are a function.
+   */
+  payload?: Payload | undefined;
 }
 
 export namespace SelectTrigger {
   export type State = SelectTriggerState;
-  export type Props = SelectTriggerProps;
+  export type Props<TPayload = unknown> = SelectTriggerProps<TPayload>;
 }

package/src/slider/root/SliderRoot.tsx

@@ -5,6 +5,7 @@ import { useControlled } from '../../hooks/useControlled';
 import { useIsoLayoutEffect } from '../../hooks/useIsoLayoutEffect';
 import { useStableCallback } from '../../hooks/useStableCallback';
 import { useRenderElement } from '../../use-render/useRenderElement';
+import { useFieldControlRegistration } from '../../internals/field/useFieldControlRegistration';
 import { clamp } from '../../utils/clamp';
 import type { ZestUIComponentProps, Orientation } from '../../types';
 import type { ZestChangeEventDetails } from '../../utils/createChangeEventDetails';
@@ -24,7 +25,7 @@ export function SliderRoot<Value extends number | readonly number[] = number>(
   const {
     className,
     defaultValue,
-    disabled = false,
+    disabled: disabledProp = false,
     format,
     locale,
     max = 100,
@@ -41,6 +42,12 @@ export function SliderRoot<Value extends number | readonly number[] = number>(
     ...elementProps
   } = componentProps;
 
+  const { fieldDisabled, markChanged, markTouched } = useFieldControlRegistration({
+    initialValue: defaultValue ?? value,
+  });
+
+  const disabled = disabledProp || fieldDisabled;
+
   // A range slider is just a slider whose value is an array; remember which
   // shape the consumer used so callbacks hand back the same one.
   const isRange = Array.isArray(value ?? defaultValue);
@@ -123,6 +130,7 @@ export function SliderRoot<Value extends number | readonly number[] = number>(
 
       valuesRef.current = nextValues;
       setValuesState(nextValues);
+      markChanged(fromArray(nextValues, isRange));
     },
   );
 
@@ -154,6 +162,8 @@ export function SliderRoot<Value extends number | readonly number[] = number>(
 
   const commitValue = useStableCallback((eventDetails: SliderRoot.ChangeEventDetails) => {
     onValueCommitted?.(fromArray(valuesRef.current, isRange) as Value, eventDetails);
+    // Releasing the thumb is the end of the interaction — a slider's blur.
+    markTouched(fromArray(valuesRef.current, isRange));
   });
 
   const state: SliderRootState = React.useMemo(

package/src/slider/thumb/SliderThumb.tsx

@@ -2,6 +2,7 @@
 import { View } from 'react-native';
 import { useSliderRootContext } from '../root/SliderRootContext';
 import { useRenderElement } from '../../use-render/useRenderElement';
+import { useFieldControlRegistration } from '../../internals/field/useFieldControlRegistration';
 import { formatNumber } from '../../utils/formatNumber';
 import type { SliderRootState } from '../root/SliderRoot';
 import type { ZestUIComponentProps } from '../../types';
@@ -20,6 +21,10 @@ export function SliderThumb(componentProps: SliderThumb.Props) {
   const { disabled, format, labelId, locale, max, min, orientation, state, values } =
     useSliderRootContext();
 
+  // The thumb is what assistive tech announces and adjusts, so a surrounding
+  // field's label and messages attach here rather than to the root.
+  const { fieldProps } = useFieldControlRegistration();
+
   const value = values[index] ?? min;
   const percent = max === min ? 0 : ((value - min) / (max - min)) * 100;
 
@@ -37,7 +42,6 @@ export function SliderThumb(componentProps: SliderThumb.Props) {
       {
         style: positionStyle,
         accessibilityRole: 'adjustable' as const,
-        accessibilityLabelledBy: labelId,
         accessibilityState: { disabled: disabled || undefined },
         accessibilityValue: {
           min,
@@ -46,6 +50,11 @@ export function SliderThumb(componentProps: SliderThumb.Props) {
           text: formatValue(value, format, locale),
         },
         'aria-orientation': orientation,
+        ...fieldProps,
+        // A surrounding `Field.Label` names the control; `Slider.Label` is the
+        // fallback for a slider that stands on its own.
+        accessibilityLabelledBy: fieldProps.accessibilityLabelledBy ?? labelId,
+        'aria-labelledby': fieldProps['aria-labelledby'] ?? labelId,
       },
       elementProps,
     ],

package/src/switch/root/SwitchRoot.tsx

@@ -35,7 +35,9 @@ export function SwitchRoot(componentProps: SwitchRoot.Props) {
     ...elementProps
   } = componentProps;
 
-  const { fieldDisabled, fieldProps, validateField } = useFieldControlRegistration();
+  const { fieldDisabled, fieldProps, markChanged, markTouched } = useFieldControlRegistration({
+    initialValue: defaultChecked ?? checkedProp ?? false,
+  });
 
   const disabled = disabledProp || fieldDisabled;
 
@@ -78,7 +80,8 @@ export function SwitchRoot(componentProps: SwitchRoot.Props) {
           }
 
           setCheckedState(nextChecked);
-          validateField(nextChecked);
+          markChanged(nextChecked);
+          markTouched(nextChecked);
         },
         accessibilityRole: 'switch' as const,
         accessibilityState: {

package/src/tabs/tab/TabsTab.tsx

@@ -7,7 +7,7 @@ import { useButton } from '../../internals/use-button/useButton';
 import { useCompositeListItem } from '../../internals/composite/list/useCompositeListItem';
 import type { CompositeItemLayout } from '../../internals/composite/list/CompositeListContext';
 import { useTabsRootContext } from '../root/TabsRootContext';
-import type { TabsRoot } from '../root/TabsRoot';
+import type { TabsRoot, TabsRootState } from '../root/TabsRoot';
 import type { ZestUIComponentProps } from '../../types';
 import { createChangeEventDetails } from '../../utils/createChangeEventDetails';
 import { REASONS } from '../../utils/reasons';
@@ -106,7 +106,7 @@ export interface TabsTabMetadata {
   layout?: CompositeItemLayout | undefined;
 }
 
-export interface TabsTabState {
+export interface TabsTabState extends TabsRootState {
   /**
    * Whether the component should ignore user interaction.
    */
@@ -115,14 +115,6 @@ export interface TabsTabState {
    * Whether the component is active.
    */
   active: boolean;
-  /**
-   * The component orientation.
-   */
-  orientation: TabsRoot.Orientation;
-  /**
-   * The direction used for tab activation.
-   */
-  tabActivationDirection: TabsTab.ActivationDirection;
   /**
    * Whether the tab is currently pressed.
    */

package/src/tooltip/popup/TooltipPopup.tsx

@@ -20,8 +20,17 @@ export function TooltipPopup(componentProps: TooltipPopup.Props) {
   const { transitionStatus } = useTooltipTransitionContext() ?? { transitionStatus: undefined };
 
   const open = store.useState('open');
+  const triggerWidth = store.useState('triggerWidth');
+  const triggerHeight = store.useState('triggerHeight');
 
-  const state: TooltipPopupState = { open, transitionStatus, side, align };
+  const state: TooltipPopupState = {
+    open,
+    transitionStatus,
+    side,
+    align,
+    triggerWidth,
+    triggerHeight,
+  };
 
   return useRenderElement(View, componentProps, {
     state,
@@ -57,6 +66,16 @@ export interface TooltipPopupState {
    * The alignment the popup was actually placed with.
    */
   align: Align;
+  /**
+   * The trigger's measured width, available for consumers to size the popup
+   * against its anchor. This is the React Native equivalent of the web's
+   * `--anchor-width` CSS variable.
+   */
+  triggerWidth: number | undefined;
+  /**
+   * The trigger's measured height.
+   */
+  triggerHeight: number | undefined;
 }
 
 export interface TooltipPopupProps extends ZestUIComponentProps<typeof View, TooltipPopupState> {}

package/src/tooltip/positioner/TooltipPositioner.tsx

@@ -38,6 +38,8 @@ export function TooltipPositioner(componentProps: TooltipPositioner.Props) {
   useTooltipPortalContext();
   const store = useTooltipRootContext();
   const open = store.useState('open');
+  const triggerWidth = store.useState('triggerWidth');
+  const triggerHeight = store.useState('triggerHeight');
   const triggerNode = store.useState('triggerNode');
 
   const positioning = useAnchorPositioning({
@@ -69,6 +71,8 @@ export function TooltipPositioner(componentProps: TooltipPositioner.Props) {
     open,
     side: positioning.side,
     align: positioning.align,
+    triggerWidth,
+    triggerHeight,
   };
 
   const contextValue: TooltipPositionerContext = React.useMemo(
@@ -101,6 +105,16 @@ export interface TooltipPositionerState {
   open: boolean;
   side: Side;
   align: Align;
+  /**
+   * The trigger's measured width, available for consumers to size the popup
+   * against its anchor. This is the React Native equivalent of the web's
+   * `--anchor-width` CSS variable.
+   */
+  triggerWidth: number | undefined;
+  /**
+   * The trigger's measured height.
+   */
+  triggerHeight: number | undefined;
 }
 
 export interface TooltipPositionerProps

package/src/tooltip/store/TooltipStore.ts

@@ -9,6 +9,15 @@ export type State = {
    * The anchor's native node, carried across the portal boundary.
    */
   triggerNode: unknown;
+  /**
+   * The trigger's measured width, the React Native counterpart of the web's
+   * `--anchor-width` CSS variable.
+   */
+  triggerWidth: number | undefined;
+  /**
+   * The trigger's measured height.
+   */
+  triggerHeight: number | undefined;
   update: (() => void) | undefined;
 };
 
@@ -19,13 +28,23 @@ type Context = {
 const selectors = {
   open: createSelector((state: State) => state.openProp ?? state.open),
   triggerNode: createSelector((state: State) => state.triggerNode),
+  triggerWidth: createSelector((state: State) => state.triggerWidth),
+  triggerHeight: createSelector((state: State) => state.triggerHeight),
   update: createSelector((state: State) => state.update),
 };
 
 export class TooltipStore extends ReactStore<Readonly<State>, Context, typeof selectors> {
   constructor(initialState?: Partial<State>) {
     super(
-      { open: false, openProp: undefined, triggerNode: null, update: undefined, ...initialState },
+      {
+        open: false,
+        openProp: undefined,
+        triggerNode: null,
+        triggerWidth: undefined,
+        triggerHeight: undefined,
+        update: undefined,
+        ...initialState,
+      },
       { onOpenChange: undefined },
       selectors,
     );

package/src/tooltip/trigger/TooltipTrigger.tsx

@@ -1,6 +1,6 @@
 'use client';
 import * as React from 'react';
-import { Pressable, type GestureResponderEvent } from 'react-native';
+import { Pressable, type GestureResponderEvent, type LayoutChangeEvent } from 'react-native';
 import { useTooltipRootContext } from '../root/TooltipRootContext';
 import { useRenderElement } from '../../use-render/useRenderElement';
 import { useMergedRefs } from '../../hooks/useMergedRefs';
@@ -61,7 +61,10 @@ export function TooltipTrigger(componentProps: TooltipTrigger.Props) {
         onPressOut() {
           setPressed(false);
         },
-        onLayout() {
+        onLayout(event: LayoutChangeEvent) {
+          const { width, height } = event.nativeEvent.layout;
+          store.set('triggerWidth', width);
+          store.set('triggerHeight', height);
           store.state.update?.();
         },
         accessibilityState: { expanded: open, disabled: disabled || undefined },

package/lib/combobox/root/useComboboxRoot.d.ts

@@ -1,29 +0,0 @@
-import type { ZestNativeEvent } from '../../utils/createChangeEventDetails';
-import { ComboboxRootContext, type ComboboxItem } from './ComboboxRootContext';
-export type ComboboxItems = ReadonlyArray<string | {
-    value: unknown;
-    label: string;
-}>;
-export interface UseComboboxRootParameters {
-    mode: 'combobox' | 'autocomplete';
-    items: ComboboxItems | undefined;
-    value?: unknown;
-    defaultValue?: unknown;
-    onValueChange?: ((value: unknown) => void) | undefined;
-    inputValue?: string | undefined;
-    defaultInputValue?: string | undefined;
-    onInputValueChange?: ((value: string) => void) | undefined;
-    open?: boolean | undefined;
-    defaultOpen?: boolean | undefined;
-    onOpenChange?: ((open: boolean, event?: ZestNativeEvent) => void) | undefined;
-    openOnFocus?: boolean | undefined;
-    filter?: ((item: ComboboxItem, query: string) => boolean) | undefined;
-    disabled: boolean;
-}
-/**
- * The state behind `Combobox.Root` and `Autocomplete.Root`: the resolved item
- * list, the filtered view of it, the input text, the selection, and the open
- * state — plus the anchor plumbing the popup needs.
- */
-export declare function useComboboxRoot(parameters: UseComboboxRootParameters): ComboboxRootContext;
-//# sourceMappingURL=useComboboxRoot.d.ts.map

package/lib/combobox/root/useComboboxRoot.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useComboboxRoot.d.ts","sourceRoot":"","sources":["../../../src/combobox/root/useComboboxRoot.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AAC5E,OAAO,EAAE,mBAAmB,EAAE,KAAK,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE/E,MAAM,MAAM,aAAa,GAAG,aAAa,CAAC,MAAM,GAAG;IAAE,KAAK,EAAE,OAAO,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAYtF,MAAM,WAAW,yBAAyB;IACxC,IAAI,EAAE,UAAU,GAAG,cAAc,CAAC;IAClC,KAAK,EAAE,aAAa,GAAG,SAAS,CAAC;IACjC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACvD,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,iBAAiB,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACvC,kBAAkB,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IAC3D,IAAI,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAClC,YAAY,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,CAAC,EAAE,eAAe,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IAC9E,WAAW,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAClC,MAAM,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,GAAG,SAAS,CAAC;IACtE,QAAQ,EAAE,OAAO,CAAC;CACnB;AAKD;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,UAAU,EAAE,yBAAyB,GAAG,mBAAmB,CAwJ1F"}

package/lib/combobox/root/useComboboxRoot.js

@@ -1,176 +0,0 @@
-"use strict";
-'use client';
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useComboboxRoot = useComboboxRoot;
-const React = __importStar(require("react"));
-const useControlled_1 = require("../../hooks/useControlled");
-const useIsoLayoutEffect_1 = require("../../hooks/useIsoLayoutEffect");
-const useStableCallback_1 = require("../../hooks/useStableCallback");
-/** Normalizes the `items` prop into `{ value, label }` records. */
-function normalizeItems(items) {
-    if (!items) {
-        return [];
-    }
-    return items.map((item) => typeof item === 'string' ? { value: item, label: item } : { value: item.value, label: item.label });
-}
-const defaultFilter = (item, query) => item.label.toLowerCase().includes(query.toLowerCase());
-/**
- * The state behind `Combobox.Root` and `Autocomplete.Root`: the resolved item
- * list, the filtered view of it, the input text, the selection, and the open
- * state — plus the anchor plumbing the popup needs.
- */
-function useComboboxRoot(parameters) {
-    var _a, _b, _c, _d;
-    const { mode, items, value: valueProp, defaultValue, onValueChange, inputValue: inputValueProp, defaultInputValue, onInputValueChange, open: openProp, defaultOpen = false, onOpenChange, openOnFocus = true, filter = defaultFilter, disabled, } = parameters;
-    const normalized = React.useMemo(() => normalizeItems(items), [items]);
-    const [open, setOpenState] = (0, useControlled_1.useControlled)({
-        controlled: openProp,
-        default: defaultOpen,
-        name: 'Combobox',
-        state: 'open',
-    });
-    const [selectedValue, setSelectedValue] = (0, useControlled_1.useControlled)({
-        controlled: valueProp,
-        default: defaultValue !== null && defaultValue !== void 0 ? defaultValue : null,
-        name: 'Combobox',
-        state: 'value',
-    });
-    // The initial input text is only read on the first render; compute it once so
-    // it stays stable, or `useControlled` warns when a later selection changes the
-    // controlled `value` (and with it the derived label).
-    const initialInputRef = React.useRef(undefined);
-    if (initialInputRef.current === undefined) {
-        initialInputRef.current =
-            defaultInputValue !== null && defaultInputValue !== void 0 ? defaultInputValue : (mode === 'combobox'
-                ? ((_b = (_a = normalized.find((item) => item.value === (valueProp !== null && valueProp !== void 0 ? valueProp : defaultValue))) === null || _a === void 0 ? void 0 : _a.label) !== null && _b !== void 0 ? _b : '')
-                : '');
-    }
-    const [inputValue, setInputValueState] = (0, useControlled_1.useControlled)({
-        controlled: inputValueProp,
-        default: initialInputRef.current,
-        name: 'Combobox',
-        state: 'inputValue',
-    });
-    const [triggerNode, setTriggerNode] = React.useState(null);
-    const [update, setUpdate] = React.useState(undefined);
-    const [inputRef, setInputRef] = React.useState(undefined);
-    const [triggerWidth, setTriggerWidth] = React.useState(undefined);
-    const setOpen = (0, useStableCallback_1.useStableCallback)((nextOpen, event) => {
-        if (nextOpen === open) {
-            return;
-        }
-        onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(nextOpen, event);
-        setOpenState(nextOpen);
-    });
-    const setInputValue = (0, useStableCallback_1.useStableCallback)((next) => {
-        onInputValueChange === null || onInputValueChange === void 0 ? void 0 : onInputValueChange(next);
-        setInputValueState(next);
-        // Typing reopens the list so suggestions follow the query.
-        if (!open && next.length > 0) {
-            setOpen(true);
-        }
-    });
-    const selectItem = (0, useStableCallback_1.useStableCallback)((item, event) => {
-        if (mode === 'combobox') {
-            onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(item.value);
-            setSelectedValue(item.value);
-        }
-        onInputValueChange === null || onInputValueChange === void 0 ? void 0 : onInputValueChange(item.label);
-        setInputValueState(item.label);
-        setOpen(false, event);
-    });
-    // The label of the currently selected value (combobox mode only).
-    const selectedLabel = mode === 'combobox'
-        ? ((_d = (_c = normalized.find((item) => item.value === selectedValue)) === null || _c === void 0 ? void 0 : _c.label) !== null && _d !== void 0 ? _d : '')
-        : '';
-    // Reflect a controlled `value` that changed from outside into the input text.
-    // `selectItem` already sets both, so the ref guard makes that a no-op and stops
-    // this from fighting the user's typing (typing never changes `selectedValue`).
-    const lastReflectedValueRef = React.useRef(selectedValue);
-    (0, useIsoLayoutEffect_1.useIsoLayoutEffect)(() => {
-        if (mode !== 'combobox' || selectedValue === lastReflectedValueRef.current) {
-            return;
-        }
-        lastReflectedValueRef.current = selectedValue;
-        setInputValueState(selectedLabel);
-    }, [mode, selectedValue, selectedLabel, setInputValueState]);
-    const filteredItems = React.useMemo(() => {
-        // When the input still shows the current selection, the user has not started
-        // filtering — show every item so a fresh focus reveals the whole list rather
-        // than the single selected row.
-        const query = mode === 'combobox' && inputValue === selectedLabel ? '' : inputValue.trim();
-        if (query.length === 0) {
-            return normalized;
-        }
-        return normalized.filter((item) => filter(item, query));
-    }, [normalized, inputValue, selectedLabel, mode, filter]);
-    return React.useMemo(() => ({
-        mode,
-        open,
-        setOpen,
-        inputValue,
-        setInputValue,
-        selectedValue,
-        selectItem,
-        filteredItems,
-        disabled,
-        openOnFocus,
-        triggerNode,
-        setTriggerNode,
-        update,
-        setUpdate,
-        inputRef,
-        setInputRef,
-        triggerWidth,
-        setTriggerWidth,
-    }), [
-        mode,
-        open,
-        setOpen,
-        inputValue,
-        setInputValue,
-        selectedValue,
-        selectItem,
-        filteredItems,
-        disabled,
-        openOnFocus,
-        triggerNode,
-        update,
-        inputRef,
-        triggerWidth,
-    ]);
-}
-//# sourceMappingURL=useComboboxRoot.js.map

package/lib/combobox/root/useComboboxRoot.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useComboboxRoot.js","sourceRoot":"","sources":["../../../src/combobox/root/useComboboxRoot.ts"],"names":[],"mappings":"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"}

package/lib/utils/fastObjectShallowCompare.d.ts

@@ -1,2 +0,0 @@
-export declare function fastObjectShallowCompare<T extends Record<string, any> | null>(a: T, b: T): boolean;
-//# sourceMappingURL=fastObjectShallowCompare.d.ts.map

package/lib/utils/fastObjectShallowCompare.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"fastObjectShallowCompare.d.ts","sourceRoot":"","sources":["../../src/utils/fastObjectShallowCompare.ts"],"names":[],"mappings":"AAEA,wBAAgB,wBAAwB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,WA2BxF"}