@astryxdesign/core 0.5.0 → 0.5.1-canary.70169cd

package/dist/Resizable/useResizable.js

@@ -4,7 +4,8 @@
 
 /**
  * @file useResizable.ts
- * @input Resize configuration (defaultSize, minSizePx, maxSizePx, collapsible, snaps)
+ * @input Resize configuration (defaultSize, minSizePx, maxSizePx, snaps) and
+ *   collapse configuration (collapsible, defaultIsCollapsed, isCollapsed)
  * @output Hook return: size, isCollapsed, collapse/expand/resize methods, props for handle
  * @position Public hook; consumed by layout components via `resizable` prop
  */
@@ -51,16 +52,48 @@ function clampSize(size, min, max, snaps) {
   }
   return clamped;
 }
-function loadPersistedSize(key) {
+/**
+ * Reads a persisted entry. Three formats exist in storage:
+ * - `{size, isCollapsed}` — the current format; `size` is the expanded size,
+ *   so the pre-collapse width survives a collapsed session
+ * - a plain non-zero number — a legacy width-only entry that never recorded
+ *   collapse, so `isCollapsed` is null (unknown)
+ * - a plain `0` — written by legacy collapse, which restored the region as a
+ *   zero-width expanded panel (#4790); read as "collapsed, no saved size"
+ */
+function loadPersistedState(key) {
   if (typeof window === 'undefined') {
     return null;
   }
   try {
     const raw = localStorage.getItem(STORAGE_PREFIX + key);
-    if (raw != null) {
-      const parsed = JSON.parse(raw);
-      if (typeof parsed === 'number') {
-        return parsed;
+    if (raw == null) {
+      return null;
+    }
+    const parsed = JSON.parse(raw);
+    if (typeof parsed === 'number') {
+      if (!Number.isFinite(parsed)) {
+        return null;
+      }
+      return parsed === 0 ? {
+        size: null,
+        isCollapsed: true
+      } : {
+        size: parsed,
+        isCollapsed: null
+      };
+    }
+    if (typeof parsed === 'object' && parsed != null) {
+      const {
+        size,
+        isCollapsed
+      } = parsed;
+      const hasSize = typeof size === 'number' && Number.isFinite(size) && size > 0;
+      if (hasSize || isCollapsed === true) {
+        return {
+          size: hasSize ? size : null,
+          isCollapsed: isCollapsed === true
+        };
       }
     }
   } catch {
@@ -68,12 +101,12 @@ function loadPersistedSize(key) {
   }
   return null;
 }
-function persistSize(key, size) {
+function persistState(key, state) {
   if (typeof window === 'undefined') {
     return;
   }
   try {
-    localStorage.setItem(STORAGE_PREFIX + key, JSON.stringify(size));
+    localStorage.setItem(STORAGE_PREFIX + key, JSON.stringify(state));
   } catch {
     /* ignore */
   }
@@ -106,70 +139,103 @@ function useSingleResizable(config) {
     maxSizePx = Infinity,
     collapsible = false,
     collapsedSize = DEFAULT_COLLAPSED_SIZE,
-    snaps = [],
+    snaps: configuredSnaps,
     autoSaveId,
+    defaultIsCollapsed,
+    isCollapsed: controlledIsCollapsed,
     onSizeChange,
     onCollapseChange
   } = config;
+  const emptySnapsRef = useRef([]);
+  const snaps = configuredSnaps ?? emptySnapsRef.current;
   const resolvedDefault = resolveDefaultSize(defaultSize);
-  const persisted = autoSaveId ? loadPersistedSize(autoSaveId) : null;
-  const initial = persisted ?? resolvedDefault;
+  const persisted = autoSaveId ? loadPersistedState(autoSaveId) : null;
+  const initial = persisted?.size ?? resolvedDefault;
+
+  // `size` is always the *expanded* size: collapse hides it behind the
+  // isCollapsed gate below rather than zeroing it, so the width the user had
+  // survives a collapse, a persist round-trip, and an expand.
   const [size, setSize] = useState(() => clampSize(initial, minSizePx, maxSizePx, snaps));
-  const [isCollapsed, setIsCollapsed] = useState(() => persisted === 0 && collapsible);
-  const preCollapseSizeRef = useRef(size);
+  const [uncontrolledIsCollapsed, setUncontrolledIsCollapsed] = useState(() => persisted?.isCollapsed ?? defaultIsCollapsed ?? false);
+  const isControlled = controlledIsCollapsed !== undefined;
+  const isCollapsed = collapsible && (isControlled ? controlledIsCollapsed : uncontrolledIsCollapsed);
   const dragStartSizeRef = useRef(size);
+
+  // Mirrors isCollapsed so the callbacks below read the live value instead of
+  // the one their last render captured. Two cases reach them from a stale
+  // closure: two imperative calls in one tick, and a drag — ResizeHandle
+  // registers its pointermove listener once at pointer down, so a whole
+  // gesture runs against one props snapshot.
+  const isCollapsedRef = useRef(isCollapsed);
+  isCollapsedRef.current = isCollapsed;
+
+  // Controlled callers own the state; collapse() and a drag past the
+  // threshold report through onCollapseChange and change nothing here.
+  const setCollapsed = useCallback(value => {
+    if (!isControlled) {
+      isCollapsedRef.current = value;
+      setUncontrolledIsCollapsed(value);
+    }
+  }, [isControlled]);
   useEffect(() => {
     if (autoSaveId) {
-      persistSize(autoSaveId, isCollapsed ? 0 : size);
+      persistState(autoSaveId, {
+        size,
+        isCollapsed
+      });
     }
   }, [size, isCollapsed, autoSaveId]);
   const collapse = useCallback(() => {
-    if (!collapsible) {
+    // The already-collapsed guard keeps a repeated call from re-notifying a
+    // transition that already happened.
+    if (!collapsible || isCollapsedRef.current) {
       return;
     }
-    preCollapseSizeRef.current = size;
-    setIsCollapsed(true);
-    setSize(0);
+    setCollapsed(true);
     onCollapseChange?.(true);
     onSizeChange?.(0);
-  }, [collapsible, size, onCollapseChange, onSizeChange]);
+  }, [collapsible, setCollapsed, onCollapseChange, onSizeChange]);
   const expand = useCallback(() => {
-    setIsCollapsed(false);
-    const restored = preCollapseSizeRef.current || resolvedDefault;
-    const newSize = clampSize(restored, minSizePx, maxSizePx, snaps);
-    setSize(newSize);
-    onCollapseChange?.(false);
-    onSizeChange?.(newSize);
-  }, [resolvedDefault, minSizePx, maxSizePx, snaps, onCollapseChange, onSizeChange]);
+    const wasCollapsed = isCollapsedRef.current;
+    setCollapsed(false);
+    if (wasCollapsed) {
+      onCollapseChange?.(false);
+    }
+    onSizeChange?.(size);
+  }, [setCollapsed, size, onCollapseChange, onSizeChange]);
   const resize = useCallback(newSize => {
     const clamped = clampSize(newSize, minSizePx, maxSizePx, snaps);
+    const wasCollapsed = isCollapsedRef.current;
     setSize(clamped);
-    setIsCollapsed(false);
+    setCollapsed(false);
+    // Resizing out of the collapsed state is an implicit expand — notify
+    // like the drag path does when it crosses back over the threshold.
+    if (wasCollapsed) {
+      onCollapseChange?.(false);
+    }
     onSizeChange?.(clamped);
-  }, [minSizePx, maxSizePx, snaps, onSizeChange]);
+  }, [minSizePx, maxSizePx, snaps, setCollapsed, onCollapseChange, onSizeChange]);
   const onResizeStart = useCallback(() => {
-    dragStartSizeRef.current = isCollapsed ? 0 : size;
-  }, [size, isCollapsed]);
+    dragStartSizeRef.current = isCollapsedRef.current ? 0 : size;
+  }, [size]);
   const onResizeMove = useCallback(delta => {
     const raw = dragStartSizeRef.current + delta;
     if (collapsible && raw < collapsedSize) {
-      if (!isCollapsed) {
-        preCollapseSizeRef.current = size;
+      if (!isCollapsedRef.current) {
+        setCollapsed(true);
         onCollapseChange?.(true);
+        onSizeChange?.(0);
       }
-      setIsCollapsed(true);
-      setSize(0);
-      onSizeChange?.(0);
       return;
     }
-    if (isCollapsed && raw >= collapsedSize) {
-      setIsCollapsed(false);
+    if (isCollapsedRef.current && raw >= collapsedSize) {
+      setCollapsed(false);
       onCollapseChange?.(false);
     }
     const clamped = clampSize(raw, minSizePx, maxSizePx, snaps);
     setSize(clamped);
     onSizeChange?.(clamped);
-  }, [collapsible, collapsedSize, isCollapsed, size, minSizePx, maxSizePx, snaps, onSizeChange, onCollapseChange]);
+  }, [collapsible, collapsedSize, setCollapsed, minSizePx, maxSizePx, snaps, onSizeChange, onCollapseChange]);
   const onResizeEnd = useCallback(() => {
     // Sizes already committed during move
   }, []);

package/dist/SelectableCard/SelectableCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectableCard.d.ts","sourceRoot":"","sources":["../../src/SelectableCard/SelectableCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,EACL,KAAK,SAAS,EAKd,KAAK,GAAG,EACT,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAC,SAAS,EAAE,SAAS,EAAE,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAGtE,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,cAAc,CAAC;AAE9C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgJ5C,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACtE,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAE1B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,UAAU,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,QAAQ,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAExC;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,yBAAyB;IACzB,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,0BAA0B;IAC1B,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,UAAU,EACV,QAAQ,EACR,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,UAAkB,EAClB,QAAQ,EACR,OAAO,EACP,OAAmB,EACnB,SAAkB,EAClB,KAAK,EACL,MAAM,EACN,QAAQ,EACR,GAAG,EACH,MAAM,EAAE,UAAU,EAClB,SAAS,EAAE,aAAa,EACxB,KAAK,EACL,GAAG,KAAK,EACT,EAAE,mBAAmB,+BA2FrB;yBA9Ge,cAAc"}
+{"version":3,"file":"SelectableCard.d.ts","sourceRoot":"","sources":["../../src/SelectableCard/SelectableCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,EACL,KAAK,SAAS,EAKd,KAAK,GAAG,EACT,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAC,SAAS,EAAE,SAAS,EAAE,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAGtE,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,cAAc,CAAC;AAE9C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgK5C,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACtE,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAE1B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,UAAU,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,QAAQ,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAExC;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,yBAAyB;IACzB,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,0BAA0B;IAC1B,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,UAAU,EACV,QAAQ,EACR,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,UAAkB,EAClB,QAAQ,EACR,OAAO,EACP,OAAmB,EACnB,SAAkB,EAClB,KAAK,EACL,MAAM,EACN,QAAQ,EACR,GAAG,EACH,MAAM,EAAE,UAAU,EAClB,SAAS,EAAE,aAAa,EACxB,KAAK,EACL,GAAG,KAAK,EACT,EAAE,mBAAmB,+BA2FrB;yBA9Ge,cAAc"}

package/dist/SelectableCard/SelectableCard.js

@@ -43,6 +43,7 @@ import { useMergedRefs } from "../hooks/useMergedRefs.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const styles = {
   interactive: {
+    "--selectable-card-ring-color": "x11rj6l1",
     kVAEAm: "x1n2onr6",
     kkrTdU: "x1ypdohk x16khyan",
     k1ekBW: "x16mfhj0",
@@ -126,6 +127,10 @@ const styles = {
     kVAM5u: "x1kpnwn1",
     "--_card-ring": "x1glw7ee",
     $$css: true
+  },
+  selectedUnknown: {
+    "--_card-ring": "x3zsw4j",
+    $$css: true
   }
 };
 const selectedStyleForVariant = variant => {
@@ -154,6 +159,10 @@ const selectedStyleForVariant = variant => {
       return styles.selectedTeal;
     case 'yellow':
       return styles.selectedYellow;
+    // CardVariant is open — a theme can add a variant this switch has never
+    // seen, and it still has to look selected.
+    default:
+      return styles.selectedUnknown;
   }
 };
 

package/dist/Selector/Selector.d.ts

@@ -16,7 +16,7 @@ import React, { type ReactNode } from 'react';
 import { type IconType } from '../Icon';
 import type { IndicatorPosition } from '../Indicator';
 import { type FieldStatusVariant } from '../Field';
-import type { LayerPlacement } from '../Layer/useLayer';
+import { type LayerPlacement } from '../Layer/useLayer';
 import type { SelectorOptionType, SelectorOptionData } from './types';
 import type { BaseProps } from '../BaseProps';
 import type { SizeValue } from '../utils/types';
@@ -189,6 +189,23 @@ interface SelectorPropsBase<T extends SelectorOptionType = SelectorOptionType> e
      * @default 'Search...'
      */
     searchPlaceholder?: string;
+    /**
+     * Content shown in the panel when there are no options to show, and
+     * announced in a polite live region when the panel opens. Not shown while
+     * `isLoading` — the options have not arrived yet.
+     * @default 'No options'
+     */
+    emptyText?: ReactNode;
+    /**
+     * Content shown in the panel when a search query matches no options, and
+     * announced in a polite live region at the same time.
+     *
+     * The panel message is `role="presentation"`, so the live region is the only
+     * route to assistive tech: a string is announced verbatim, a richer node
+     * falls back to the default text since it cannot be spoken.
+     * @default 'No results found'
+     */
+    emptySearchText?: ReactNode;
     /**
      * Position placement relative to the trigger.
      *

package/dist/Selector/Selector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Selector.d.ts","sourceRoot":"","sources":["../../src/Selector/Selector.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Selector.d.ts","sourceRoot":"","sources":["../../src/Selector/Selector.tsx"],"names":[],"mappings":"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"}

package/dist/Selector/Selector.js

@@ -18,13 +18,15 @@
  */
 import React, { useCallback, useEffect, useId, useMemo, useOptimistic, useRef, useState, useTransition } from 'react';
 import * as stylex from '@stylexjs/stylex';
-import { usePopover } from "../Popover/usePopover.js";
+import { usePopoverInternal } from "../Popover/usePopover.js";
 import { useTooltip } from "../Tooltip/index.js";
 import { Icon, renderIconSlot } from "../Icon/index.js";
 import { useIndicator } from "../Indicator/index.js";
-import { Field, InputClearButton, inputStatusBorderStyles, inputStatusHoverShadowStyles, inputWrapperStyles } from "../Field/index.js";
+import { Field, inputStatusBorderStyles, inputStatusHoverShadowStyles, inputWrapperStyles } from "../Field/index.js";
 import { Divider } from "../Divider/index.js";
 import { layerAnimations } from "../Layer/layerAnimations.stylex.js";
+import { useKeepLayerOpenProps } from "../Layer/useLayer.js";
+import { InternalInputClearButton } from "../Field/InputClearButton.js";
 import { Spinner } from "../Spinner/index.js";
 import { PanelSearchInput } from "../Field/PanelSearchInput.js";
 import { useAnnounce } from "../hooks/useAnnounce.js";
@@ -40,6 +42,7 @@ import { getInputARIA, isImeKeyEvent, mergeProps } from "../utils/index.js";
 import { useSize } from "../SizeContext/SizeContext.js";
 import { themeProps } from "../utils/themeProps.js";
 import { focusOutlineStyles } from "../utils/focusOutline.stylex.js";
+import { interactionOverlayStyles } from "../utils/interactionOverlay.stylex.js";
 import { stableClassName } from "../naming.js";
 import { groupStyles } from "../InputGroup/groupStyles.js";
 import { useInputGroup } from "../InputGroup/InputGroupContext.js";
@@ -91,7 +94,6 @@ const styles = {
     kzqmXN: "x14atkfc",
     kMzoRj: "xc342km",
     kWkggS: "xjbqb8w",
-    kKwaWg: "xmvprkv xq8i9tn",
     kGVxlE: "x1gnnqk1 x1s17dad x15ysqaf",
     k63SB2: "x1e4wzip",
     k1ekBW: "xrafxwg",
@@ -172,7 +174,10 @@ const styles = {
 // `--spacing-5` is one line here because `triggerContainer` pins its
 // line-height to exactly that; the two must stay in step, which is why both
 // read the same token rather than one hardcoding 20px.
-const linePad = token => `calc((${token} - ${spacingVars['--spacing-5']} - 2 * ${borderVars['--border-width']}) / 2)`;
+// Keep these calculations inline: a consumer's Babel preset can lower a
+// module-scope helper to a function expression before StyleX evaluates this
+// object, and StyleX cannot constant-evaluate that transformed helper.
+
 const sizeStyles = {
   sm: {
     kAzted: "x1gdqauq",
@@ -308,6 +313,8 @@ export function Selector(props) {
     indicatorPosition = 'end',
     hasSearch = false,
     searchPlaceholder: searchPlaceholderFromProps,
+    emptyText: emptyTextFromProps,
+    emptySearchText: emptySearchTextFromProps,
     placement,
     isDefaultOpen = false,
     'data-testid': testId,
@@ -316,6 +323,7 @@ export function Selector(props) {
     className,
     style,
     hasClear: hasClearProp,
+    id,
     ...rest
   } = props;
   const isEffectivelyRequired = useResolvedRequired({
@@ -324,13 +332,18 @@ export function Selector(props) {
   });
   const placeholder = placeholderFromProps ?? t('@astryx.selector.placeholder');
   const searchPlaceholder = searchPlaceholderFromProps ?? t('@astryx.selector.searchPlaceholder');
+  const emptyText = emptyTextFromProps ?? t('@astryx.selector.empty');
+  const emptySearchText = emptySearchTextFromProps ?? t('@astryx.selector.emptySearchResults');
   const hasClear = hasClearProp === true;
   const size = useSize(sizeProp, 'md');
   const effectiveStatusVariant = variant === 'ghost' && statusVariant === 'attached' ? 'detached' : statusVariant;
 
   // Normalize null to undefined for internal use (null is the clear sentinel)
   const normalizedValue = value === null ? undefined : value;
-  const triggerId = useId();
+  const generatedTriggerId = useId();
+  // A caller's `id` lands on the trigger either way, so the internal identity
+  // has to be that same value or the label and listbox point at nothing.
+  const triggerId = id ?? generatedTriggerId;
   const listboxId = useId();
   const descriptionId = useId();
   const statusMessageId = useId();
@@ -343,6 +356,9 @@ export function Selector(props) {
   const searchRef = useRef(null);
   const inputGroup = useInputGroup();
   const [searchQuery, setSearchQuery] = useState('');
+  // Mirrors searchQuery for the seed path, which runs before focus reaches the
+  // input and so cannot read the rendered state.
+  const searchQueryRef = useRef('');
   // A typed query shows the search row's clear (✕) button, which becomes
   // the next tab stop after the search input.
   const hasQuery = searchQuery.length > 0;
@@ -351,6 +367,13 @@ export function Selector(props) {
   const isBusy = isLoading || optimisticValue !== normalizedValue;
   const announce = useAnnounce();
 
+  // The panel's empty message is role="presentation" and reaches assistive tech
+  // only through this live region, so the region has to speak whatever the
+  // panel shows. A ReactNode override cannot be spoken; fall back to the
+  // catalog copy for that case rather than announcing nothing.
+  const emptyAnnouncement = typeof emptyText === 'string' ? emptyText : t('@astryx.selector.empty');
+  const emptySearchAnnouncement = typeof emptySearchText === 'string' ? emptySearchText : t('@astryx.selector.emptySearchResults');
+
   // Disabled-reason tooltip. Disabled controls swallow pointer events, so the
   // tooltip listeners attach to the trigger container (which already exists)
   // and the trigger button stays perceivable via aria-disabled instead of the
@@ -398,13 +421,14 @@ export function Selector(props) {
   // Layer for dropdown positioning
   const handleLayerHide = useCallback(() => {
     setSearchQuery('');
+    searchQueryRef.current = '';
     resetTypeaheadRef.current();
     // Clear any lingering result count when the popover closes so stale status
     // text does not linger in the a11y tree.
     announce('');
     triggerRef.current?.focus();
   }, [announce]);
-  const popover = usePopover({
+  const popover = usePopoverInternal({
     onHide: handleLayerHide,
     hasLightDismiss: true,
     hasCloseButton: false,
@@ -416,6 +440,7 @@ export function Selector(props) {
     // `usePopover` owns — not on the scrolling list inside it.
     surfaceTarget: 'selector-popup'
   });
+  const keepOpenProps = useKeepLayerOpenProps(popover.id, popover.isOpen);
 
   // Open dropdown on mount when isDefaultOpen is true
   useEffect(() => {
@@ -425,22 +450,55 @@ export function Selector(props) {
     // eslint-disable-next-line @eslint-react/exhaustive-deps -- mount-only: isDefaultOpen is not reactive
   }, []);
 
-  // Announce the filtered result count from the query-change handler (matching
+  // Announce the filtered result count from the query-change handlers (matching
   // BaseTypeahead) rather than a reactive effect: computing the count for the
   // next query here fires the announcement exactly once per keystroke and does
-  // not re-speak on unrelated re-renders.
-  const handleSearchChange = useCallback(nextQuery => {
-    setSearchQuery(nextQuery);
+  // not re-speak on unrelated re-renders. Split out from handleSearchChange so
+  // the type-to-open seed below reaches the same live region — a query the user
+  // typed is a query however it arrived.
+  const announceSearchResults = useCallback(nextQuery => {
     if (nextQuery.length === 0) {
       // Emptying the query clears the region rather than announcing a count.
       announce('');
       return;
     }
+    // While isLoading the panel deliberately shows nothing, so announcing a
+    // result would put a claim in the one channel the screen has gone quiet
+    // for.
+    if (isLoading) {
+      announce('');
+      return;
+    }
     const count = filterOptionsByQuery(selectableItems, nextQuery).length;
-    announce(count === 0 ? t('@astryx.selector.emptySearchResults') : t('@astryx.selector.resultCount', {
+    announce(count === 0 ? emptySearchAnnouncement : t('@astryx.selector.resultCount', {
       count
     }));
-  }, [announce, selectableItems, t]);
+  }, [announce, isLoading, selectableItems, emptySearchAnnouncement, t]);
+  const handleSearchChange = useCallback(nextQuery => {
+    setSearchQuery(nextQuery);
+    searchQueryRef.current = nextQuery;
+    announceSearchResults(nextQuery);
+  }, [announceSearchResults]);
+
+  // The panel's empty message is role="presentation", so this region is the
+  // only route to assistive tech. It has to watch the STATE rather than the
+  // open event: the panel can become empty either on open or when a fetch
+  // lands with nothing in it, and an open-only announcement leaves the second
+  // case silent while the message sits on screen. The ref makes it fire once
+  // per arrival at that state rather than on every re-render.
+  const announcedEmptyRef = useRef(null);
+  useEffect(() => {
+    const isPanelEmpty = popover.isOpen && !isLoading && searchQuery === '' && selectableItems.length === 0;
+    if (!isPanelEmpty) {
+      announcedEmptyRef.current = null;
+      return;
+    }
+    if (announcedEmptyRef.current === emptyAnnouncement) {
+      return;
+    }
+    announcedEmptyRef.current = emptyAnnouncement;
+    announce(emptyAnnouncement);
+  }, [popover.isOpen, isLoading, searchQuery, selectableItems.length, emptyAnnouncement, announce]);
 
   // Calculate offset to position selected item over trigger. Explicit
   // placement opts out of the selector-specific overlay behavior and uses the
@@ -477,10 +535,17 @@ export function Selector(props) {
   }, [onChange, changeAction, startTransition, setOptimisticValue]);
 
   // Type-to-find appends to the query rather than replacing it: characters
-  // typed before focus reaches the search input must not be dropped.
+  // typed before focus reaches the search input must not be dropped. The ref
+  // is what makes that safe without a state updater — it advances
+  // synchronously, so a second character seeded in the same tick still sees
+  // the first, and the announcement can be computed here rather than inside a
+  // setState callback.
   const appendSearchQuery = useCallback(char => {
-    setSearchQuery(query => query + char);
-  }, []);
+    const nextQuery = searchQueryRef.current + char;
+    searchQueryRef.current = nextQuery;
+    setSearchQuery(nextQuery);
+    announceSearchResults(nextQuery);
+  }, [announceSearchResults]);
   const commitValue = useCallback(newValue => {
     onChange?.(newValue);
     if (changeAction) {
@@ -502,6 +567,7 @@ export function Selector(props) {
     onItemMouseEnter
   } = useCombobox({
     selectableItems: filteredItems,
+    wasJustDismissed: popover.wasJustDismissed,
     // The optimistic value, not the raw prop: with a pending changeAction the
     // prop still holds the old selection, so the popup would open with the
     // highlight on it and Delete/Backspace could clear a value the action has
@@ -732,8 +798,11 @@ export function Selector(props) {
   const renderOptions = useCallback(() => {
     const isSearching = hasSearch && Boolean(searchQuery);
 
-    // Nothing matched across every group/option: show the empty state.
-    if (isSearching && filteredItems.length === 0) {
+    // Nothing to show — either the query matched nothing, or no options were
+    // given at all. Both render the same slot with different copy. While
+    // isLoading the options have not arrived yet, so asserting either would be
+    // a claim the component cannot make; the trigger's spinner covers it.
+    if (filteredItems.length === 0 && !isLoading) {
       // role="presentation" keeps the message out of the listbox's
       // accessibility tree (role="listbox" only permits option/group
       // children); the no-results outcome is announced via the
@@ -743,7 +812,7 @@ export function Selector(props) {
         ...mergeProps(themeProps('selector-empty-state'), {
           className: "x1b2ylru x2b8uid xv1l7n4 x9ynric xcr08ib"
         }),
-        children: "No results found"
+        children: isSearching ? emptySearchText : emptyText
       }, "empty")];
     }
     let flatIndex = 0;
@@ -805,7 +874,7 @@ export function Selector(props) {
       }
     }
     return elements;
-  }, [options, renderItem, hasSearch, searchQuery, filteredItems]);
+  }, [options, renderItem, hasSearch, searchQuery, filteredItems, isLoading, emptyText, emptySearchText]);
 
   // The detached message box renders its own leading status icon, so the
   // on-field icon would duplicate it — keep the chevron indicator instead.
@@ -865,7 +934,7 @@ export function Selector(props) {
         size,
         status: status?.type ?? null,
         disabled: isDisabled ? 'disabled' : null
-      }), stylex.props(inputWrapperStyles.base, styles.triggerContainer, sizeStyles[size], variant === 'ghost' && styles.triggerGhost, variant === 'ghost' && focusOutlineStyles.focusWithin, isDisabled && inputWrapperStyles.disabled, variant === 'ghost' && isDisabled && styles.triggerGhostDisabled, !selectedItem && styles.triggerPlaceholder, variant !== 'ghost' && status && inputStatusBorderStyles[status.type], variant !== 'ghost' && status && !isDisabled && inputStatusHoverShadowStyles[status.type], variant !== 'ghost' && inputGroup && groupStyles.inGroup, inputGroup && styles.triggerInGroup, xstyle), className, style),
+      }), stylex.props(inputWrapperStyles.base, styles.triggerContainer, sizeStyles[size], variant === 'ghost' && styles.triggerGhost, variant === 'ghost' && interactionOverlayStyles.backgroundImage, variant === 'ghost' && focusOutlineStyles.focusWithin, isDisabled && inputWrapperStyles.disabled, variant === 'ghost' && isDisabled && styles.triggerGhostDisabled, !selectedItem && styles.triggerPlaceholder, variant !== 'ghost' && status && inputStatusBorderStyles[status.type], variant !== 'ghost' && status && !isDisabled && inputStatusHoverShadowStyles[status.type], variant !== 'ghost' && inputGroup && groupStyles.inGroup, inputGroup && styles.triggerInGroup, xstyle), className, style),
       children: [startIcon && renderIconSlot(startIcon, {
         size: 'sm',
         color: 'secondary'
@@ -918,7 +987,8 @@ export function Selector(props) {
         disabled: isDisabled
       }), isBusy && /*#__PURE__*/_jsx(Spinner, {
         size: "sm"
-      }), hasClear && value != null && !isDisabled && /*#__PURE__*/_jsx(InputClearButton, {
+      }), hasClear && value != null && !isDisabled && /*#__PURE__*/_jsx(InternalInputClearButton, {
+        ...keepOpenProps,
         label: t('@astryx.selector.clearLabel', {
           label
         }),
@@ -929,6 +999,7 @@ export function Selector(props) {
         type: "button",
         "aria-label": t(STATUS_BUTTON_LABEL_KEY[status.type]),
         "aria-describedby": statusTooltip.describedBy,
+        ...keepOpenProps,
         onClick: e => e.stopPropagation(),
         ...stylex.props(focusOutlineStyles.focusVisible, styles.statusButton),
         children: /*#__PURE__*/_jsx(Icon, {

package/dist/Selector/hooks.d.ts

@@ -45,6 +45,12 @@ interface UseComboboxOptions {
      * lands in the search input, which then owns its own typing.
      */
     onSearchSeed?: (char: string) => void;
+    /**
+     * Whether the browser's light dismiss just closed the popup. The trigger
+     * click that follows belongs to that same press, so acting on it would
+     * reopen the popup the user just closed.
+     */
+    wasJustDismissed?: () => boolean;
     listboxId: string;
 }
 interface UseComboboxResult {
@@ -64,6 +70,6 @@ interface UseComboboxResult {
  * keeps matching consistent with the other collections and leaves consumers
  * whose own input already filters the items (CommandPalette) untouched.
  */
-export declare function useCombobox({ selectableItems, value, isDisabled, isOpen, hasSearch, onOpen, onClose, onSelect, onClear, onSearchSeed, listboxId, }: UseComboboxOptions): UseComboboxResult;
+export declare function useCombobox({ selectableItems, value, isDisabled, isOpen, hasSearch, onOpen, onClose, onSelect, onClear, onSearchSeed, wasJustDismissed, listboxId, }: UseComboboxOptions): UseComboboxResult;
 export {};
 //# sourceMappingURL=hooks.d.ts.map

package/dist/Selector/hooks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../src/Selector/hooks.ts"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAyBhD,UAAU,4BAA4B;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC7C,SAAS,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CAC1C;AAED,UAAU,2BAA2B;IACnC,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,OAAO,CAAC;CACvB;AAED;;;;;;;;;GASG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,MAAM,EACN,iBAAiB,EACjB,SAAS,EACT,UAAU,EACV,SAAS,GACV,EAAE,4BAA4B,GAAG,2BAA2B,CAgF5D;AAMD,UAAU,kBAAkB;IAC1B,eAAe,EAAE,kBAAkB,EAAE,CAAC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,UAAU,iBAAiB;IACzB,gBAAgB,EAAE,MAAM,CAAC;IACzB,mBAAmB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACrC,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,SAAS,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;IAC5C,YAAY,EAAE,CAAC,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IACjD,gBAAgB,EAAE,CAAC,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACrE;AAED;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,EAC1B,eAAe,EACf,KAAK,EACL,UAAkB,EAClB,MAAM,EACN,SAAiB,EACjB,MAAM,EACN,OAAO,EACP,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,SAAS,GACV,EAAE,kBAAkB,GAAG,iBAAiB,CA2NxC"}
+{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../src/Selector/hooks.ts"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAyBhD,UAAU,4BAA4B;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC7C,SAAS,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CAC1C;AAED,UAAU,2BAA2B;IACnC,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,OAAO,CAAC;CACvB;AAED;;;;;;;;;GASG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,MAAM,EACN,iBAAiB,EACjB,SAAS,EACT,UAAU,EACV,SAAS,GACV,EAAE,4BAA4B,GAAG,2BAA2B,CAgF5D;AAMD,UAAU,kBAAkB;IAC1B,eAAe,EAAE,kBAAkB,EAAE,CAAC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,MAAM,OAAO,CAAC;IACjC,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,UAAU,iBAAiB;IACzB,gBAAgB,EAAE,MAAM,CAAC;IACzB,mBAAmB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACrC,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,SAAS,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;IAC5C,YAAY,EAAE,CAAC,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IACjD,gBAAgB,EAAE,CAAC,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACrE;AAED;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,EAC1B,eAAe,EACf,KAAK,EACL,UAAkB,EAClB,MAAM,EACN,SAAiB,EACjB,MAAM,EACN,OAAO,EACP,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,gBAAgB,EAChB,SAAS,GACV,EAAE,kBAAkB,GAAG,iBAAiB,CAmOxC"}

package/dist/Selector/hooks.js

@@ -136,6 +136,7 @@ export function useCombobox({
   onSelect,
   onClear,
   onSearchSeed,
+  wasJustDismissed,
   listboxId
 }) {
   const [highlightedIndex, setHighlightedIndex] = useState(-1);
@@ -158,7 +159,7 @@ export function useCombobox({
     closeAndReset();
   }, [onSelect, closeAndReset]);
   const onTriggerClick = useCallback(() => {
-    if (isDisabled) {
+    if (isDisabled || wasJustDismissed?.()) {
       return;
     }
     if (isOpen) {
@@ -170,7 +171,7 @@ export function useCombobox({
         setHighlightedIndex(selectedIndex >= 0 ? selectedIndex : 0);
       }
     }
-  }, [isDisabled, isOpen, onOpen, closeAndReset, findSelectedIndex, hasSearch]);
+  }, [isDisabled, wasJustDismissed, isOpen, onOpen, closeAndReset, findSelectedIndex, hasSearch]);
   const onItemMouseEnter = useCallback((item, index) => {
     if (!item.disabled) {
       setHighlightedIndex(index);

package/dist/SideNav/SideNav.d.ts

@@ -88,8 +88,13 @@ export interface SideNavProps extends BaseProps<HTMLElement> {
      *   - `defaultWidth` — initial width in pixels (default: 260)
      *   - `minWidth` — minimum width in pixels (default: 180)
      *   - `maxWidth` — maximum width in pixels (default: 480)
-     *   - `autoSaveId` — localStorage key for persisting width
+     *   - `autoSaveId` — localStorage key for persisting width and collapse state
      *   - `onWidthChange` — called when the width changes
+     *   - `defaultIsCollapsed` / `isCollapsed` / `onCollapseChange` — collapse
+     *     state, when `resizable` should own it rather than `collapsible`
+     *
+     * When both props carry collapse state, `resizable` wins and a dev warning
+     * names the conflicting keys.
      *
      * @default false
      */