@astryxdesign/core 0.7.5 → 0.7.6-canary.0135af4

package/dist/DropdownMenu/DropdownMenu.js

@@ -44,6 +44,7 @@ import { renderDropdownItems } from "./renderDropdownItems.js";
 import { MENU_ITEM_ROLES, MENU_ITEM_SELECTOR, MENU_BOUNDARY_SELECTOR, activateMenuItem } from "./menuItemRoles.js";
 import { DropdownMenuContext, DropdownMenuRootOpenContext, DropdownMenuSurfaceContext } from "./DropdownMenuContext.js";
 import { useIsomorphicLayoutEffect } from "../hooks/useIsomorphicLayoutEffect.js";
+import { useMergedRefs } from "../hooks/useMergedRefs.js";
 import { useListFocus } from "../hooks/useListFocus.js";
 import { useMenuPress } from "../hooks/useMenuPress.js";
 import { useTypeahead } from "../hooks/useTypeahead.js";
@@ -360,6 +361,11 @@ function DropdownMenuBottomSheet({
   };
   const backLabel = t('@astryx.dropdownMenu.back');
   const buttonRef = useRef(null);
+  // The trigger, where focus returns after the sheet closes, carries the
+  // modality tracking for its document.
+  const modality = useInteractionModalityTracking();
+  // The caller's `button.ref` rides along with the sheet's own trigger ref.
+  const triggerRef = useMergedRefs(buttonRef, modality.ref, button.ref);
   const triggerId = useId();
   const sheetId = useId();
   const actionListRef = useRef(null);
@@ -369,7 +375,7 @@ function DropdownMenuBottomSheet({
     onFocusReturnTargetFocus,
     prepareFocusReturn,
     resetFocusReturn
-  } = useFocusReturnVisibility();
+  } = useFocusReturnVisibility(modality);
   const viewHeadingRef = useRef(null);
   const previousSubmenuDepthRef = useRef(0);
   const [internalIsOpen, setInternalIsOpen] = useState(false);
@@ -384,9 +390,10 @@ function DropdownMenuBottomSheet({
     }
   }
   // The closed sheet renders nothing, so load its rows at rest: the first
-  // open shows the actions at once.
+  // open shows the actions at once. The preload's result says whether they
+  // loaded; after a failure the first open loads them.
   useEffect(() => {
-    preloadMenuBottomSheetActionList();
+    void preloadMenuBottomSheetActionList();
   }, []);
   const currentSubmenu = submenuPath.at(-1);
   const currentItems = currentSubmenu?.items ?? items;
@@ -505,11 +512,15 @@ function DropdownMenuBottomSheet({
     xstyle: [bottomSheetStyles.viewHeading, submenuPath.length === 0 && [bottomSheetStyles.rootHeading, menuBottomSheetStyles.headingAlone]],
     children: currentTitle
   });
+  // A stable ref: an inline one re-runs on every render (null, then the element).
+  const sheetModalityRef = modality.ref;
+  const sheetTriggerRef = useCallback(el => {
+    buttonRef.current = el;
+    sheetModalityRef(el);
+  }, [sheetModalityRef]);
   return /*#__PURE__*/_jsxs(_Fragment, {
     children: [renderTrigger != null ? renderTrigger({
-      ref: el => {
-        buttonRef.current = el;
-      },
+      ref: sheetTriggerRef,
       id: triggerId,
       onClick: handleSheetTriggerClick,
       onClickCapture: () => {},
@@ -522,7 +533,7 @@ function DropdownMenuBottomSheet({
       'aria-controls': sheetId
     }) : /*#__PURE__*/_jsx(Button, {
       ...button,
-      ref: buttonRef,
+      ref: triggerRef,
       xstyle: [isOpen && styles.triggerOpen, button.xstyle, isFocusRingSuppressed && focusOutlineStyles.suppressed],
       tooltip: isOpen ? undefined : button.tooltip,
       endContent: resolvedEndContent,
@@ -639,14 +650,14 @@ function DropdownMenuPopover({
   const notifyClickOnShowRef = useRef(false);
   const pendingControlledOpenRef = useRef(false);
   const suppressControlledRollbackHideRef = useRef(false);
-  useInteractionModalityTracking();
+  const contentRef = useRef(null);
+  const modality = useInteractionModalityTracking();
   const {
     isFocusRingSuppressed,
     onFocusReturnTargetFocus,
     prepareFocusReturn,
     resetFocusReturn
-  } = useFocusReturnVisibility();
-  const contentRef = useRef(null);
+  } = useFocusReturnVisibility(modality);
   const headerRef = useRef(null);
   const footerRef = useRef(null);
   const hasRegions = useMemo(() => isRenderable(header) || isRenderable(footer), [header, footer]);
@@ -1174,11 +1185,35 @@ function DropdownMenuPopover({
   }) : /*#__PURE__*/_jsxs(_Fragment, {
     children: [menu, surfaceHostElement]
   });
+
+  // Stable trigger refs. An inline ref is a new function every render, so React
+  // re-runs it on every commit (null, then the element), and each run moved the
+  // popover's anchor off the trigger and back: two inline-style writes on the
+  // trigger per render of the menu.
+  const popoverTriggerRef = popover.triggerRef;
+  // The trigger, where focus returns, also carries the modality tracking for
+  // its document.
+  const modalityRef = modality.ref;
+  const triggerRef = useCallback(el => {
+    buttonRef.current = el;
+    popoverTriggerRef(el);
+    // Called with each node and with `null`, so its cleanup isn't returned
+    // (a returned cleanup would stop React's `null` call to the others).
+    modalityRef(el);
+  }, [popoverTriggerRef, modalityRef]);
+  const consumerButtonRef = button.ref;
+  const buttonTriggerRef = useCallback(el => {
+    triggerRef(el);
+    if (typeof consumerButtonRef === 'function') {
+      consumerButtonRef(el);
+    } else if (consumerButtonRef) {
+      /* eslint-disable react-compiler/react-compiler -- ref callback: forwarding consumer ref object */
+      consumerButtonRef.current = el;
+      /* eslint-enable react-compiler/react-compiler */
+    }
+  }, [triggerRef, consumerButtonRef]);
   const triggerProps = {
-    ref: el => {
-      buttonRef.current = el;
-      popover.triggerRef(el);
-    },
+    ref: triggerRef,
     id: triggerId,
     onClick: handleButtonClick,
     onClickCapture: handleTriggerClickCapture,
@@ -1196,18 +1231,7 @@ function DropdownMenuPopover({
   return /*#__PURE__*/_jsxs(_Fragment, {
     children: [renderTrigger != null ? renderTrigger(triggerProps) : /*#__PURE__*/_jsx(Button, {
       ...button,
-      ref: el => {
-        buttonRef.current = el;
-        popover.triggerRef(el);
-        const consumerRef = button.ref;
-        if (typeof consumerRef === 'function') {
-          consumerRef(el);
-        } else if (consumerRef) {
-          /* eslint-disable react-compiler/react-compiler -- ref callback: forwarding consumer ref object */
-          consumerRef.current = el;
-          /* eslint-enable react-compiler/react-compiler */
-        }
-      },
+      ref: buttonTriggerRef,
       xstyle: [styles.triggerPressable, isOpen && styles.triggerOpen, button.xstyle, isFocusRingSuppressed && focusOutlineStyles.suppressed],
       tooltip: isOpen ? undefined : button.tooltip,
       endContent: resolvedEndContent,
@@ -1258,7 +1282,7 @@ function DropdownMenuPopover({
       onFocus: event => {
         rest.onFocus?.(event);
         if (event.target === event.currentTarget) {
-          setIsMenuKeyboardFocused(getInteractionModality() === 'keyboard');
+          setIsMenuKeyboardFocused(getInteractionModality(event.currentTarget) === 'keyboard');
         }
       },
       ...menuPress.menuProps,

package/dist/DropdownMenu/DropdownMenuGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenuGroup.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuGroup.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH,OAAO,EAAQ,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAQ5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgB5C,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAClD,SAAS,CAAC,cAAc,CAAC,EACzB,MAAM,CACP;IACC;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,sEAAsE;IACtE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,mDAAmD;IACnD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;CACjC;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,iBAAiB,EAAE,cAAc,EACjC,GAAG,IAAI,EACR,EAAE,sBAAsB,+BAwBxB;yBAjCe,iBAAiB"}
+{"version":3,"file":"DropdownMenuGroup.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuGroup.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH,OAAO,EAAQ,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAQ5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAiB5C,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAClD,SAAS,CAAC,cAAc,CAAC,EACzB,MAAM,CACP;IACC;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,sEAAsE;IACtE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,mDAAmD;IACnD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;CACjC;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,iBAAiB,EAAE,cAAc,EACjC,GAAG,IAAI,EACR,EAAE,sBAAsB,+BAwBxB;yBAjCe,iBAAiB"}

package/dist/DropdownMenu/DropdownMenuGroup.js

@@ -29,6 +29,7 @@ import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, typographyVars, typeScaleVars } from "../theme/tokens.stylex.js";
 import { mergeProps } from "../utils/index.js";
 import { themeProps } from "../utils/themeProps.js";
+import { isRenderable } from "../utils/isRenderable.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * A titled group of menu rows.
@@ -64,7 +65,7 @@ export function DropdownMenuGroup({
   ...rest
 }) {
   const headingId = useId();
-  const hasTitle = title != null && title !== '' && title !== false;
+  const hasTitle = isRenderable(title);
   return /*#__PURE__*/_jsxs("div", {
     ...rest,
     ref: ref,

package/dist/DropdownMenu/DropdownMenuSubMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenuSubMenu.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuSubMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AAEH,OAAO,KAAK,EAAE,EASZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAyC5D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA6N5C,MAAM,MAAM,+BAA+B,GACzC,QAAQ,GAAG,UAAU,GAAG,UAAU,CAAC;AAErC,UAAU,4BAA6B,SAAQ,IAAI,CACjD,SAAS,EACT,MAAM,GAAG,UAAU,CACpB;IACC,2DAA2D;IAC3D,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B,8CAA8C;IAC9C,KAAK,EAAE,SAAS,CAAC;IACjB,4DAA4D;IAC5D,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,8CAA8C;IAC9C,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,+BAA+B,CAAC;IAC/C;;;;;;;;;;OAUG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,mCAAmC;IACnC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;;OAGG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;CAC9B;AAED,MAAM,WAAW,wBAAyB,SAAQ,4BAA4B;IAC5E;;;;;;;;OAQG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AA6CD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,wBAAwB,GAC9B,SAAS,CAg5BX;yBAl5Be,mBAAmB"}
+{"version":3,"file":"DropdownMenuSubMenu.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuSubMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AAEH,OAAO,KAAK,EAAE,EASZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAyC5D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA6N5C,MAAM,MAAM,+BAA+B,GACzC,QAAQ,GAAG,UAAU,GAAG,UAAU,CAAC;AAErC,UAAU,4BAA6B,SAAQ,IAAI,CACjD,SAAS,EACT,MAAM,GAAG,UAAU,CACpB;IACC,2DAA2D;IAC3D,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B,8CAA8C;IAC9C,KAAK,EAAE,SAAS,CAAC;IACjB,4DAA4D;IAC5D,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,8CAA8C;IAC9C,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,+BAA+B,CAAC;IAC/C;;;;;;;;;;OAUG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,mCAAmC;IACnC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;;OAGG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;CAC9B;AAED,MAAM,WAAW,wBAAyB,SAAQ,4BAA4B;IAC5E;;;;;;;;OAQG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AA6CD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,wBAAwB,GAC9B,SAAS,CAk5BX;yBAp5Be,mBAAmB"}

package/dist/DropdownMenu/DropdownMenuSubMenu.js

@@ -874,7 +874,7 @@ export function DropdownMenuSubMenu(props) {
   // on the menu element shows the ring the base style otherwise removes.
   const handleMenuFocus = event => {
     if (hasRegions && event.target === event.currentTarget) {
-      setIsMenuKeyboardFocused(getInteractionModality() === 'keyboard');
+      setIsMenuKeyboardFocused(getInteractionModality(event.currentTarget) === 'keyboard');
     }
   };
   const handleMenuBlur = event => {

package/dist/DropdownMenu/MenuBottomSheetActionList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuBottomSheetActionList.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/MenuBottomSheetActionList.tsx"],"names":[],"mappings":"AAIA;;;;;GAKG;AAEH,OAAO,KAAkC,MAAM,OAAO,CAAC;AAUvD,OAAO,KAAK,EAAC,oBAAoB,EAAE,kBAAkB,EAAC,MAAM,gBAAgB,CAAC;AAsC7E,wBAAgB,yBAAyB,CAAC,EACxC,KAAK,EACL,QAAQ,EACR,aAAa,GACd,EAAE;IACD,KAAK,EAAE,kBAAkB,EAAE,CAAC;IAC5B,QAAQ,EAAE,CAAC,IAAI,EAAE,oBAAoB,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxE,aAAa,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;CACrD,qBAyHA;yBAjIe,yBAAyB"}
+{"version":3,"file":"MenuBottomSheetActionList.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/MenuBottomSheetActionList.tsx"],"names":[],"mappings":"AAIA;;;;;GAKG;AAEH,OAAO,KAAkC,MAAM,OAAO,CAAC;AAYvD,OAAO,KAAK,EAAC,oBAAoB,EAAE,kBAAkB,EAAC,MAAM,gBAAgB,CAAC;AAsC7E,wBAAgB,yBAAyB,CAAC,EACxC,KAAK,EACL,QAAQ,EACR,aAAa,GACd,EAAE;IACD,KAAK,EAAE,kBAAkB,EAAE,CAAC;IAC5B,QAAQ,EAAE,CAAC,IAAI,EAAE,oBAAoB,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxE,aAAa,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;CACrD,qBA2HA;yBAnIe,yBAAyB"}

package/dist/DropdownMenu/MenuBottomSheetActionList.js

@@ -10,15 +10,17 @@
  */
 import React, { useRef } from 'react';
 import * as stylex from '@stylexjs/stylex';
-import { Divider } from "../Divider/index.js";
-import { Heading } from "../Heading/index.js";
-import { Icon, renderIconSlot } from "../Icon/index.js";
-import { List, ListItem } from "../List/index.js";
+import { Divider } from "../Divider/Divider.js";
+import { Heading } from "../Heading/Heading.js";
+import { Icon, renderIconSlot } from "../Icon/Icon.js";
+import { List } from "../List/List.js";
+import { ListItem } from "../List/ListItem.js";
 import { useMenuPress } from "../hooks/useMenuPress.js";
+import { useMergedRefs } from "../hooks/useMergedRefs.js";
 import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars } from "../theme/tokens.stylex.js";
-import { rtlStyles } from "../utils/index.js";
-import { getInteractionModality } from "../utils/interactionModality.js";
+import { rtlStyles } from "../utils/rtlStyles.js";
+import { useInteractionModalityTracking } from "../utils/interactionModality.js";
 import { isModifiedClick } from "./menuItemRoles.js";
 
 /** The action rows: ListItem renders its action as a button (or a link). */
@@ -54,6 +56,11 @@ export function MenuBottomSheetActionList({
   onOpenSubmenu
 }) {
   const listRef = useRef(null);
+  const {
+    ref: modalityRef,
+    readModality
+  } = useInteractionModalityTracking();
+  const listComposedRef = useMergedRefs(listRef, modalityRef);
   // The press model: the row under a finger's RELEASE acts, and the
   // highlight (focus) follows the finger across the rows. The sheet is modal,
   // so a release outside it is the scrim's, not a dismissal of ours.
@@ -71,7 +78,7 @@ export function MenuBottomSheetActionList({
         event.preventDefault();
         return;
       }
-      if (getInteractionModality() === 'pointer') {
+      if (readModality() === 'pointer') {
         event.currentTarget.blur();
       }
       if (isSubmenu) {
@@ -115,7 +122,7 @@ export function MenuBottomSheetActionList({
     }, getItemKey(item, index));
   };
   return /*#__PURE__*/_jsx(List, {
-    ref: listRef,
+    ref: listComposedRef,
     density: "spacious",
     xstyle: styles.list,
     ...menuPress.menuProps,

package/dist/DropdownMenu/lazyMenuBottomSheet.d.ts

@@ -11,6 +11,11 @@
  * of pages whose dropdowns only open as anchored popovers. Each wrapper keeps
  * the wrapped component's props and renders nothing until its module loads.
  *
+ * The action list preloads at rest, and the preload's result says whether it
+ * loaded. A failed load is not kept, so the next preload or open asks the
+ * module loader again (a loader that retries then loads it; a browser does not
+ * fetch a native module again once its import failed).
+ *
  * Neither wrapper renders on the server or in the render that hydrates server
  * HTML (spec:AST-013 FR9): a lazy component that has not loaded yet would
  * leave server markup incomplete and abort hydration. The closed sheet has no
@@ -19,8 +24,21 @@
 import { type ComponentProps, type ReactElement } from 'react';
 import type { MenuBottomSheet as EagerMenuBottomSheet } from './MenuBottomSheet.js';
 import type { MenuBottomSheetActionList as EagerMenuBottomSheetActionList } from './MenuBottomSheetActionList.js';
-/** Starts loading the action list; a sheet menu calls it at rest. */
-export declare function preloadMenuBottomSheetActionList(): void;
+/** What a preload of the action list came to: loaded, or failed with the loader's error. */
+export type ActionListPreload = {
+    readonly isLoaded: true;
+} | {
+    readonly isLoaded: false;
+    readonly error: unknown;
+};
+/**
+ * Starts loading the action list; a sheet menu calls it at rest. Its result
+ * says whether the list loaded: a failure (a dropped connection) is that
+ * result, with the loader's error, and never a rejection. The failed load is
+ * not kept, so the first open asks the module loader again, and a load that
+ * fails there reaches the menu through lazy().
+ */
+export declare function preloadMenuBottomSheetActionList(): Promise<ActionListPreload>;
 export declare function MenuBottomSheet(props: ComponentProps<typeof EagerMenuBottomSheet>): ReactElement | null;
 export declare function MenuBottomSheetActionList(props: ComponentProps<typeof EagerMenuBottomSheetActionList>): ReactElement | null;
 //# sourceMappingURL=lazyMenuBottomSheet.d.ts.map

package/dist/DropdownMenu/lazyMenuBottomSheet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"lazyMenuBottomSheet.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/lazyMenuBottomSheet.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;GAiBG;AAEH,OAAO,EAKL,KAAK,cAAc,EACnB,KAAK,YAAY,EAClB,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,eAAe,IAAI,oBAAoB,EAAC,MAAM,mBAAmB,CAAC;AAC/E,OAAO,KAAK,EAAC,yBAAyB,IAAI,8BAA8B,EAAC,MAAM,6BAA6B,CAAC;AAuB7G,qEAAqE;AACrE,wBAAgB,gCAAgC,IAAI,IAAI,CAEvD;AAQD,wBAAgB,eAAe,CAC7B,KAAK,EAAE,cAAc,CAAC,OAAO,oBAAoB,CAAC,GACjD,YAAY,GAAG,IAAI,CASrB;AAED,wBAAgB,yBAAyB,CACvC,KAAK,EAAE,cAAc,CAAC,OAAO,8BAA8B,CAAC,GAC3D,YAAY,GAAG,IAAI,CAcrB"}
+{"version":3,"file":"lazyMenuBottomSheet.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/lazyMenuBottomSheet.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAEH,OAAO,EAKL,KAAK,cAAc,EACnB,KAAK,YAAY,EAClB,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,eAAe,IAAI,oBAAoB,EAAC,MAAM,mBAAmB,CAAC;AAC/E,OAAO,KAAK,EAAC,yBAAyB,IAAI,8BAA8B,EAAC,MAAM,6BAA6B,CAAC;AA+B7G,4FAA4F;AAC5F,MAAM,MAAM,iBAAiB,GACzB;IAAC,QAAQ,CAAC,QAAQ,EAAE,IAAI,CAAA;CAAC,GACzB;IAAC,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC;IAAC,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAA;CAAC,CAAC;AAExD;;;;;;GAMG;AACH,wBAAsB,gCAAgC,IAAI,OAAO,CAAC,iBAAiB,CAAC,CAOnF;AAQD,wBAAgB,eAAe,CAC7B,KAAK,EAAE,cAAc,CAAC,OAAO,oBAAoB,CAAC,GACjD,YAAY,GAAG,IAAI,CASrB;AAED,wBAAgB,yBAAyB,CACvC,KAAK,EAAE,cAAc,CAAC,OAAO,8BAA8B,CAAC,GAC3D,YAAY,GAAG,IAAI,CAcrB"}

package/dist/DropdownMenu/lazyMenuBottomSheet.js

@@ -15,6 +15,11 @@
  * of pages whose dropdowns only open as anchored popovers. Each wrapper keeps
  * the wrapped component's props and renders nothing until its module loads.
  *
+ * The action list preloads at rest, and the preload's result says whether it
+ * loaded. A failed load is not kept, so the next preload or open asks the
+ * module loader again (a loader that retries then loads it; a browser does not
+ * fetch a native module again once its import failed).
+ *
  * Neither wrapper renders on the server or in the render that hydrates server
  * HTML (spec:AST-013 FR9): a lazy component that has not loaded yet would
  * leave server markup incomplete and abort hydration. The closed sheet has no
@@ -36,13 +41,36 @@ async function loadActionList() {
   actionListLoad ??= import("./MenuBottomSheetActionList.js").then(module => {
     actionListModule = module;
     return module;
+  }, error => {
+    // A failed load (a dropped connection) is not kept: the next caller
+    // asks the module loader again.
+    actionListLoad = null;
+    throw error;
   });
   return actionListLoad;
 }
 
-/** Starts loading the action list; a sheet menu calls it at rest. */
-export function preloadMenuBottomSheetActionList() {
-  void loadActionList();
+/** What a preload of the action list came to: loaded, or failed with the loader's error. */
+
+/**
+ * Starts loading the action list; a sheet menu calls it at rest. Its result
+ * says whether the list loaded: a failure (a dropped connection) is that
+ * result, with the loader's error, and never a rejection. The failed load is
+ * not kept, so the first open asks the module loader again, and a load that
+ * fails there reaches the menu through lazy().
+ */
+export async function preloadMenuBottomSheetActionList() {
+  try {
+    await loadActionList();
+    return {
+      isLoaded: true
+    };
+  } catch (error) {
+    return {
+      isLoaded: false,
+      error
+    };
+  }
 }
 const LazyMenuBottomSheetActionList = /*#__PURE__*/lazy(async () => loadActionList().then(module => ({
   default: module.MenuBottomSheetActionList

package/dist/DropdownMenu/renderDropdownItems.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"renderDropdownItems.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/renderDropdownItems.tsx"],"names":[],"mappings":"AAEA;;;;GAIG;AAEH,OAAO,KAAK,EAAe,SAAS,EAAC,MAAM,OAAO,CAAC;AAYnD,OAAO,KAAK,EAEV,kBAAkB,EAEnB,MAAM,gBAAgB,CAAC;AA8CxB;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,kBAAkB,EAAE,GAAG,SAAS,CAkD1E"}
+{"version":3,"file":"renderDropdownItems.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/renderDropdownItems.tsx"],"names":[],"mappings":"AAEA;;;;GAIG;AAEH,OAAO,KAAK,EAAe,SAAS,EAAC,MAAM,OAAO,CAAC;AAYnD,OAAO,KAAK,EAEV,kBAAkB,EAEnB,MAAM,gBAAgB,CAAC;AAoExB;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,kBAAkB,EAAE,GAAG,SAAS,CAiC1E"}

package/dist/DropdownMenu/renderDropdownItems.js

@@ -48,6 +48,25 @@ function renderLeafItem(item, index) {
   }, getItemKey(item, index));
 }
 
+/**
+ * A data item that declares nested `items` becomes a submenu (data-mode
+ * parity with the compound DropdownMenuSubMenu API), at the top level and
+ * inside a section alike; otherwise it's a leaf. renderDropdownItems owns the
+ * recursion and hands the rendered children to DropdownMenuSubMenu, so
+ * DropdownMenuSubMenu never imports this module back (no import cycle).
+ */
+function renderItem(item, index) {
+  if (item.items && item.items.length > 0) {
+    return /*#__PURE__*/_jsx(DropdownMenuSubMenu, {
+      icon: item.icon,
+      label: item.label,
+      isDisabled: item.isDisabled,
+      children: renderDropdownItems(item.items)
+    }, getItemKey(item, index));
+  }
+  return renderLeafItem(item, index);
+}
+
 /**
  * Converts data-driven items into DropdownMenuItem components,
  * so both modes share the same rendering and keyboard navigation path.
@@ -68,24 +87,10 @@ export function renderDropdownItems(items) {
             className: "xu0wf1k xf314gf x9ynric x141an7d x1ltkj2j xv1l7n4 x87ps6o"
           }),
           children: option.title
-        }), option.items.map(renderLeafItem)]
+        }), option.items.map(renderItem)]
       }, getSectionKey(option, i)));
     } else if (!('type' in option)) {
-      // A plain item that declares nested `items` becomes a submenu (data-mode
-      // parity with the compound DropdownMenuSubMenu API); otherwise it's a
-      // leaf. renderDropdownItems owns the recursion and hands the rendered
-      // children to DropdownMenuSubMenu — so DropdownMenuSubMenu never imports
-      // this module back (no import cycle).
-      if (option.items && option.items.length > 0) {
-        elements.push(/*#__PURE__*/_jsx(DropdownMenuSubMenu, {
-          icon: option.icon,
-          label: option.label,
-          isDisabled: option.isDisabled,
-          children: renderDropdownItems(option.items)
-        }, getItemKey(option, i)));
-      } else {
-        elements.push(renderLeafItem(option, i));
-      }
+      elements.push(renderItem(option, i));
     }
   }
   return elements;

package/dist/EmptyState/EmptyState.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../src/EmptyState/EmptyState.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAgB,MAAM,OAAO,CAAC;AAQpD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA6D5C,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACrC;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,YAAgB,EAChB,SAAiB,EACjB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,eAAe,+BAmDjB;yBA/De,UAAU"}
+{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../src/EmptyState/EmptyState.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAgB,MAAM,OAAO,CAAC;AAQpD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA8D5C,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACrC;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,YAAgB,EAChB,SAAiB,EACjB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,eAAe,+BAmDjB;yBA/De,UAAU"}

package/dist/EmptyState/EmptyState.js

@@ -19,7 +19,8 @@ import * as stylex from '@stylexjs/stylex';
 import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, fontWeightVars, typeScaleVars } from "../theme/tokens.stylex.js";
 import { AnnounceRenderedText } from "../hooks/AnnounceRenderedText.js";
-import { isRenderable, mergeProps } from "../utils/index.js";
+import { isRenderable } from "../utils/isRenderable.js";
+import { mergeProps } from "../utils/mergeProps.js";
 import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const styles = {

package/dist/Field/Field.d.ts

@@ -14,8 +14,8 @@
 import { type ReactNode } from 'react';
 import type { BaseProps } from '../BaseProps.js';
 import type { SizeValue } from '../utils/types.js';
-import type { FieldStatusVariant } from '../FieldStatus/FieldStatus.js';
 import type { IconType } from '../Icon/index.js';
+import type { FieldStatusPlacement } from './fieldStatusPlacement.js';
 export type { SizeValue } from '../utils/types.js';
 export type FieldStatusType = 'warning' | 'error' | 'success';
 export interface FieldStatusInput {
@@ -109,7 +109,7 @@ export interface FieldProps extends Omit<BaseProps<HTMLDivElement>, 'children'>
      * - 'tooltip': No message box; the input surfaces status through a tooltip on its on-field icon
      * @default 'attached'
      */
-    statusVariant?: FieldStatusVariant;
+    statusVariant?: FieldStatusPlacement;
     /**
      * Width of the field. Numbers are treated as pixels, strings are used as-is
      * (e.g. `'100%'`). Sizes the whole field — label, control, and status — so

package/dist/Field/Field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../../src/Field/Field.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAM,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,4BAA4B,CAAC;AAGnE,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AA+DtC,YAAY,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAE9C,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;AAE9D,MAAM,WAAW,gBAAgB;IAC/B;;OAEG;IACH,IAAI,EAAE,eAAe,CAAC;IACtB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,UAAW,SAAQ,IAAI,CACtC,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,CACX;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACjC;;;OAGG;IACH,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,OAAO,EACP,OAAO,EACP,YAAoB,EACpB,aAAa,EACb,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,SAAS,EACT,MAAM,EACN,YAAY,EACZ,aAA0B,EAC1B,KAAK,EACL,MAAM,EACN,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,UAAU,+BA0HZ;yBAhJe,KAAK"}
+{"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../../src/Field/Field.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAM,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAK9C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AAOtC,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,wBAAwB,CAAC;AAyDjE,YAAY,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAE9C,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;AAE9D,MAAM,WAAW,gBAAgB;IAC/B;;OAEG;IACH,IAAI,EAAE,eAAe,CAAC;IACtB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,UAAW,SAAQ,IAAI,CACtC,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,CACX;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACjC;;;OAGG;IACH,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,oBAAoB,CAAC;IACrC;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,OAAO,EACP,OAAO,EACP,YAAoB,EACpB,aAAa,EACb,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,SAAS,EACT,MAAM,EACN,YAAY,EACZ,aAA0B,EAC1B,KAAK,EACL,MAAM,EACN,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,UAAU,+BA0HZ;yBAhJe,KAAK"}

package/dist/Field/FieldLabel.d.ts

@@ -13,7 +13,7 @@
  */
 import { type ReactNode } from 'react';
 import type { BaseProps } from '../BaseProps.js';
-import { type IconType } from '../Icon/index.js';
+import type { IconType } from '../Icon/index.js';
 export interface FieldLabelProps extends BaseProps<HTMLLabelElement> {
     /** Ref forwarded to the root element */
     ref?: React.Ref<HTMLLabelElement>;

package/dist/Field/FieldLabel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldLabel.d.ts","sourceRoot":"","sources":["../../src/Field/FieldLabel.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAuB,KAAK,SAAS,EAAiB,MAAM,OAAO,CAAC;AAE3E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAU5C,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAgF5D,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,gBAAgB,CAAC;IAClE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACjC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,OAAO,EACP,OAAO,EACP,YAAoB,EACpB,aAAqB,EACrB,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,SAAS,EACT,YAAY,EACZ,WAAW,EACX,aAAa,EACb,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,EACH,GAAG,IAAI,EACR,EAAE,eAAe,+BAyIjB;yBA3Je,UAAU"}
+{"version":3,"file":"FieldLabel.d.ts","sourceRoot":"","sources":["../../src/Field/FieldLabel.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAuB,KAAK,SAAS,EAAiB,MAAM,OAAO,CAAC;AAE3E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAW5C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AAiFtC,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,gBAAgB,CAAC;IAClE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACjC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,OAAO,EACP,OAAO,EACP,YAAoB,EACpB,aAAqB,EACrB,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,SAAS,EACT,YAAY,EACZ,WAAW,EACX,aAAa,EACb,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,EACH,GAAG,IAAI,EACR,EAAE,eAAe,+BAwJjB;yBA1Ke,UAAU"}

package/dist/Field/FieldLabel.js

@@ -17,12 +17,13 @@
  */
 import { use, useMemo, useRef } from 'react';
 import * as stylex from '@stylexjs/stylex';
-import { mergeProps } from "../utils/index.js";
+import { mergeProps } from "../utils/mergeProps.js";
 import "../theme/tokens.stylex.js";
 import { colorVars, fontWeightVars, spacingVars, typographyVars, typeScaleVars } from "../theme/tokens.stylex.js";
-import { Icon, renderIconSlot } from "../Icon/index.js";
-import { Tooltip } from "../Tooltip/index.js";
-import { useTranslator } from "../i18n/index.js";
+import { Icon, renderIconSlot } from "../Icon/Icon.js";
+import { Tooltip } from "../Tooltip/Tooltip.js";
+import { useTapStop } from "../Layer/useTouchTrigger.js";
+import { useTranslator } from "../i18n/useTranslator.js";
 import { themeProps } from "../utils/themeProps.js";
 import { useInputContainer } from "../hooks/useInputContainer.js";
 import { FormLayoutContext } from "../FormLayout/FormLayoutContext.js";
@@ -136,6 +137,14 @@ export function FieldLabel({
   // a ref-shaped object, since FieldLabel points at the control by id rather
   // than holding a ref to it.
   const descriptionRef = useRef(null);
+  // A tap on the info icon asks for the help, so it stops there: it does not
+  // go on to activate the label's control, as a press anywhere else on the
+  // label would (focus the field, toggle a switch). A mouse click on the icon
+  // keeps that native activation, and hover shows the help.
+  const {
+    onPointerDown: handleIconPointerDown,
+    onClick: handleIconClick
+  } = useTapStop('click');
   const controlRef = useMemo(() => ({
     get current() {
       return inputID == null ? null : descriptionRef.current?.ownerDocument.getElementById(inputID) ?? null;
@@ -159,13 +168,21 @@ export function FieldLabel({
         "aria-hidden": "true",
         children: " \u2219 "
       }), statusText]
-    }), labelTooltip && /*#__PURE__*/_jsx(Tooltip, {
+    }), labelTooltip &&
+    /*#__PURE__*/
+    // The icon's one job is to reveal the help, so a tap on it opens or
+    // closes the help (`touchTrigger="tap"`), although it sits inside a
+    // `<label>`.
+    _jsx(Tooltip, {
       content: labelTooltip,
       placement: "above",
+      touchTrigger: "tap",
       children: /*#__PURE__*/_jsx(Icon, {
         icon: "info",
         size: "sm",
-        color: "inherit"
+        color: "inherit",
+        onPointerDown: handleIconPointerDown,
+        onClick: handleIconClick
       })
     })]
   });

package/dist/Field/InputClearButton.js

@@ -16,9 +16,9 @@
  *   `astryx-input-clear-button` target.
  */
 import * as stylex from '@stylexjs/stylex';
-import { Button } from "../Button/index.js";
-import { Icon } from "../Icon/index.js";
-import { useTranslator } from "../i18n/index.js";
+import { Button } from "../Button/Button.js";
+import { Icon } from "../Icon/Icon.js";
+import { useTranslator } from "../i18n/useTranslator.js";
 import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const styles = {

package/dist/Field/PanelSearchInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PanelSearchInput.d.ts","sourceRoot":"","sources":["../../src/Field/PanelSearchInput.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AAEH,OAAO,EAAwB,KAAK,GAAG,EAAC,MAAM,OAAO,CAAC;AAEtD,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AAiBnD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgF5C,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CACjD,SAAS,CAAC,gBAAgB,CAAC,EAC3B,UAAU,CACX;IACC,iEAAiE;IACjE,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAE5B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd,6EAA6E;IAC7E,UAAU,EAAE,MAAM,CAAC;IAEnB,uDAAuD;IACvD,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,yBAAyB;IACzB,KAAK,EAAE,MAAM,CAAC;IAEd,kEAAkE;IAClE,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAEvC,wCAAwC;IACxC,SAAS,CAAC,EAAE,KAAK,CAAC,oBAAoB,CAAC,gBAAgB,CAAC,CAAC;IAEzD,0EAA0E;IAC1E,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;IAEpD,yEAAyE;IACzE,MAAM,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;IAEnD;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,KAAK,CAAC,oBAAoB,CAAC,cAAc,CAAC,CAAC;IAEhE;;;;;OAKG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC;CAC5B;AAED;;;;;;;;GAQG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,GAAG,EACH,KAAK,EACL,UAAU,EACV,WAAW,EACX,KAAK,EACL,aAAa,EACb,SAAS,EACT,OAAO,EACP,MAAM,EACN,kBAAkB,EAClB,WAAW,EACX,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,qBAAqB,+BA6EvB;yBA7Fe,gBAAgB"}
+{"version":3,"file":"PanelSearchInput.d.ts","sourceRoot":"","sources":["../../src/Field/PanelSearchInput.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AAEH,OAAO,EAAwB,KAAK,GAAG,EAAC,MAAM,OAAO,CAAC;AAEtD,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AAenD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgF5C,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CACjD,SAAS,CAAC,gBAAgB,CAAC,EAC3B,UAAU,CACX;IACC,iEAAiE;IACjE,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAE5B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd,6EAA6E;IAC7E,UAAU,EAAE,MAAM,CAAC;IAEnB,uDAAuD;IACvD,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,yBAAyB;IACzB,KAAK,EAAE,MAAM,CAAC;IAEd,kEAAkE;IAClE,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAEvC,wCAAwC;IACxC,SAAS,CAAC,EAAE,KAAK,CAAC,oBAAoB,CAAC,gBAAgB,CAAC,CAAC;IAEzD,0EAA0E;IAC1E,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;IAEpD,yEAAyE;IACzE,MAAM,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;IAEnD;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,KAAK,CAAC,oBAAoB,CAAC,cAAc,CAAC,CAAC;IAEhE;;;;;OAKG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC;CAC5B;AAED;;;;;;;;GAQG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,GAAG,EACH,KAAK,EACL,UAAU,EACV,WAAW,EACX,KAAK,EACL,aAAa,EACb,SAAS,EACT,OAAO,EACP,MAAM,EACN,kBAAkB,EAClB,WAAW,EACX,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,qBAAqB,+BA8EvB;yBA9Fe,gBAAgB"}

package/dist/Field/PanelSearchInput.js

@@ -40,10 +40,11 @@
  */
 import { useCallback, useState } from 'react';
 import * as stylex from '@stylexjs/stylex';
-import { Icon } from "../Icon/index.js";
+import { Icon } from "../Icon/Icon.js";
 import { InputClearButton } from "./InputClearButton.js";
-import { mergeProps } from "../utils/index.js";
-import { getInteractionModality, useInteractionModalityTracking } from "../utils/interactionModality.js";
+import { mergeProps } from "../utils/mergeProps.js";
+import { useInteractionModalityTracking } from "../utils/interactionModality.js";
+import { useMergedRefs } from "../hooks/useMergedRefs.js";
 import "../theme/tokens.stylex.js";
 import { colorVars, durationVars, easeVars, radiusVars, spacingVars, typeScaleVars, typographyVars } from "../theme/tokens.stylex.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
@@ -109,11 +110,15 @@ export function PanelSearchInput({
   // by itself. Gate it on how the user last interacted; the CSS condition
   // stays `:focus-visible`, this only narrows it.
   const [isKeyboardFocus, setIsKeyboardFocus] = useState(false);
-  useInteractionModalityTracking();
+  const {
+    ref: modalityRef,
+    readModality
+  } = useInteractionModalityTracking();
+  const mergedInputRef = useMergedRefs(ref, modalityRef);
   const handleFocus = useCallback(e => {
-    setIsKeyboardFocus(getInteractionModality() === 'keyboard');
+    setIsKeyboardFocus(readModality() === 'keyboard');
     onFocus?.(e);
-  }, [onFocus]);
+  }, [onFocus, readModality]);
   const handleBlur = useCallback(e => {
     setIsKeyboardFocus(false);
     onBlur?.(e);
@@ -147,7 +152,7 @@ export function PanelSearchInput({
         color: "secondary",
         xstyle: styles.icon
       }), /*#__PURE__*/_jsx("input", {
-        ref: ref,
+        ref: mergedInputRef,
         type: "text",
         "aria-label": label,
         placeholder: placeholder,

package/dist/Field/fieldStatusPlacement.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @file fieldStatusPlacement.ts
+ * @input The FieldStatus variant map
+ * @output FieldStatusPlacement, where a field control shows its status
+ * @position Field family type behind every field control's `statusVariant`
+ *
+ * A field control places its status message as a FieldStatus variant, or under
+ * `'tooltip'`, which the Field family consumes before rendering FieldStatus and
+ * shows through the control's on-field status icon (`component:FieldStatus`
+ * FR7, DEC-2). `'tooltip'` belongs here, not to FieldStatus itself, whose map
+ * keeps it only as a deprecated entry until the next minor.
+ */
+import type { FieldStatusVariantMap } from '../FieldStatus/index.js';
+export type FieldStatusPlacement = keyof FieldStatusVariantMap | 'tooltip';
+//# sourceMappingURL=fieldStatusPlacement.d.ts.map

package/dist/Field/fieldStatusPlacement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fieldStatusPlacement.d.ts","sourceRoot":"","sources":["../../src/Field/fieldStatusPlacement.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAC,qBAAqB,EAAC,MAAM,gBAAgB,CAAC;AAE1D,MAAM,MAAM,oBAAoB,GAAG,MAAM,qBAAqB,GAAG,SAAS,CAAC"}

package/dist/Field/fieldStatusPlacement.js

@@ -0,0 +1 @@
+export {};