@astryxdesign/core 0.7.6-canary.fdabeba → 0.7.6

package/dist/Layer/layerStructureReset.stylex.d.ts

@@ -18,6 +18,7 @@ import * as stylex from '@stylexjs/stylex';
 export declare const layerStructureReset: Readonly<{
     readonly reset: Readonly<{
         readonly '--step-connector-gap': stylex.StyleXClassNameFor<"--step-connector-gap", "initial">;
+        readonly '--_astryx-text-overflow-wrap': stylex.StyleXClassNameFor<"--_astryx-text-overflow-wrap", "initial">;
     }>;
 }>;
 //# sourceMappingURL=layerStructureReset.stylex.d.ts.map

package/dist/Layer/layerStructureReset.stylex.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"layerStructureReset.stylex.d.ts","sourceRoot":"","sources":["../../src/Layer/layerStructureReset.stylex.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAE3C;;;;;;;;;GASG;AACH,eAAO,MAAM,mBAAmB;;;;EAS9B,CAAC"}
+{"version":3,"file":"layerStructureReset.stylex.d.ts","sourceRoot":"","sources":["../../src/Layer/layerStructureReset.stylex.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAE3C;;;;;;;;;GASG;AACH,eAAO,MAAM,mBAAmB;;;;;EAc9B,CAAC"}

package/dist/Layer/layerStructureReset.stylex.js

@@ -22,6 +22,7 @@ import * as stylex from '@stylexjs/stylex';
 export const layerStructureReset = {
   reset: {
     "--step-connector-gap": "x1qkaldv",
+    "--_astryx-text-overflow-wrap": "x1c9qq8g",
     $$css: true
   }
 };

package/dist/Layer/layerSurfacePress.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Ref callback for a layer surface's content element. The layer root around
+ * it is registered too: a caller's `style`, `xstyle` or `className` (padding,
+ * for instance) lands there, so a press on that edge is still the surface's.
+ */
+export declare function registerLayerSurface(element: Element | null): void;
+/** Whether this element is a registered layer surface. */
+export declare function isLayerSurface(element: Element): boolean;
+//# sourceMappingURL=layerSurfacePress.d.ts.map

package/dist/Layer/layerSurfacePress.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"layerSurfacePress.d.ts","sourceRoot":"","sources":["../../src/Layer/layerSurfacePress.ts"],"names":[],"mappings":"AAeA;;;;GAIG;AACH,wBAAgB,oBAAoB,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,GAAG,IAAI,CASlE;AAED,0DAA0D;AAC1D,wBAAgB,cAAc,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,CAExD"}

package/dist/Layer/layerSurfacePress.js

@@ -0,0 +1,35 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file layerSurfacePress.ts
+ * @input The content element of an open Tooltip or HoverCard surface.
+ * @output A registry of those elements, read only by the public
+ *   hasInteractiveAncestor, whose documentation promises that a press inside
+ *   one answers true.
+ * @position Kept until the next minor for that public answer; Core's own
+ *   containers rely on layer roots stopping such presses instead. Not
+ *   exported from the package.
+ */
+
+const surfaces = new WeakSet();
+
+/**
+ * Ref callback for a layer surface's content element. The layer root around
+ * it is registered too: a caller's `style`, `xstyle` or `className` (padding,
+ * for instance) lands there, so a press on that edge is still the surface's.
+ */
+export function registerLayerSurface(element) {
+  if (element == null) {
+    return;
+  }
+  surfaces.add(element);
+  const root = element.parentElement;
+  if (root?.hasAttribute('popover')) {
+    surfaces.add(root);
+  }
+}
+
+/** Whether this element is a registered layer surface. */
+export function isLayerSurface(element) {
+  return surfaces.has(element);
+}

package/dist/Layer/outsidePress.d.ts

@@ -0,0 +1,45 @@
+/**
+ * Watch the owner's document for a press outside, until the returned function
+ * is called. The caller stops it when its layer hides and when it unmounts.
+ *
+ * @param owner - The element that owns the layer (the field); its document is
+ *   watched.
+ * @param isInside - Whether a press with this composed path is inside.
+ * @param onOutside - Called once for each press that starts and ends outside.
+ * @returns Stops watching.
+ */
+export declare function watchOutsidePress(owner: Element, isInside: (path: ReadonlyArray<EventTarget>) => boolean, onOutside: () => void): () => void;
+export interface OutsidePressWatch {
+    /** Start watching, replacing any watch already running. */
+    start: (owner: Element, isInside: (path: ReadonlyArray<EventTarget>) => boolean, onOutside: () => void) => void;
+    /** Stop watching; does nothing when no watch is running. */
+    stop: () => void;
+}
+/**
+ * One outside-press watch for a component: it calls `start` when its layer
+ * shows and `stop` when it hides, and the watch's document listeners (an
+ * external system) are removed when the component unmounts with it running.
+ * Both functions are stable.
+ */
+export declare function useOutsidePress(): OutsidePressWatch;
+/**
+ * Whether a press with this composed path is on a text field or in the
+ * field's own layer, which may be hosted outside the field.
+ *
+ * @param path - The press's composed path.
+ * @param field - The field that owns the layer.
+ * @param layerId - The layer element's id.
+ */
+export declare function isPressInsideOwnedLayer(path: ReadonlyArray<EventTarget>, field: Element, layerId: string): boolean;
+/**
+ * Whether focus moving to `next` stays with a text field's own layer: on the
+ * field, or in the layer, which may be hosted outside the field or inside a
+ * shadow root. Each owner decides what a blur that fails this means,
+ * including when `next` is null.
+ *
+ * @param next - The blur's `relatedTarget`.
+ * @param field - The field that owns the layer.
+ * @param layerId - The layer element's id.
+ */
+export declare function isFocusInsideOwnedLayer(next: EventTarget | null, field: Element | null | undefined, layerId: string): boolean;
+//# sourceMappingURL=outsidePress.d.ts.map

package/dist/Layer/outsidePress.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"outsidePress.d.ts","sourceRoot":"","sources":["../../src/Layer/outsidePress.ts"],"names":[],"mappings":"AAyBA;;;;;;;;;GASG;AACH,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,OAAO,EACd,QAAQ,EAAE,CAAC,IAAI,EAAE,aAAa,CAAC,WAAW,CAAC,KAAK,OAAO,EACvD,SAAS,EAAE,MAAM,IAAI,GACpB,MAAM,IAAI,CA2BZ;AAED,MAAM,WAAW,iBAAiB;IAChC,2DAA2D;IAC3D,KAAK,EAAE,CACL,KAAK,EAAE,OAAO,EACd,QAAQ,EAAE,CAAC,IAAI,EAAE,aAAa,CAAC,WAAW,CAAC,KAAK,OAAO,EACvD,SAAS,EAAE,MAAM,IAAI,KAClB,IAAI,CAAC;IACV,4DAA4D;IAC5D,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,IAAI,iBAAiB,CAenD;AAoCD;;;;;;;GAOG;AACH,wBAAgB,uBAAuB,CACrC,IAAI,EAAE,aAAa,CAAC,WAAW,CAAC,EAChC,KAAK,EAAE,OAAO,EACd,OAAO,EAAE,MAAM,GACd,OAAO,CAST;AAED;;;;;;;;;GASG;AACH,wBAAgB,uBAAuB,CACrC,IAAI,EAAE,WAAW,GAAG,IAAI,EACxB,KAAK,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,EACjC,OAAO,EAAE,MAAM,GACd,OAAO,CAKT"}

package/dist/Layer/outsidePress.js

@@ -0,0 +1,132 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+'use client';
+
+/**
+ * @file outsidePress.ts
+ * @input Listens for pointerdown, pointerup and pointercancel on a document
+ * @output Exports watchOutsidePress and useOutsidePress, which owns one watch
+ *   for a component: start on show, stop on hide, stop on unmount; and the
+ *   inside tests a text field's owner runs: isPressInsideOwnedLayer for a
+ *   press, isFocusInsideOwnedLayer for a blur
+ * @position Internal to Layer; the outside-press dismissal for a manual
+ *   popover whose owner decides what counts as inside (a combobox's field
+ *   and its list). Not exported from the package.
+ *
+ * A press closes the layer only when it starts and ends outside, as native
+ * light dismiss does: a pointerdown outside is remembered, the pointerup that
+ * follows closes the layer if it is outside too, and a pointercancel (the
+ * browser took the gesture for a scroll or a pinch) forgets it. Inside is
+ * judged on the event's composed path, so a field or list inside an open
+ * shadow root, which the document sees as its shadow host, is still inside.
+ */
+import { useCallback, useEffect, useMemo, useRef } from 'react';
+
+/**
+ * Watch the owner's document for a press outside, until the returned function
+ * is called. The caller stops it when its layer hides and when it unmounts.
+ *
+ * @param owner - The element that owns the layer (the field); its document is
+ *   watched.
+ * @param isInside - Whether a press with this composed path is inside.
+ * @param onOutside - Called once for each press that starts and ends outside.
+ * @returns Stops watching.
+ */
+export function watchOutsidePress(owner, isInside, onOutside) {
+  const doc = owner.ownerDocument;
+  let startedOutside = false;
+
+  // Capture phase, so a press whose target stops propagation is still seen.
+  const handleDown = event => {
+    startedOutside = !isInside(event.composedPath());
+  };
+  const handleUp = event => {
+    const wasOutside = startedOutside;
+    startedOutside = false;
+    if (wasOutside && !isInside(event.composedPath())) {
+      onOutside();
+    }
+  };
+  const handleCancel = () => {
+    startedOutside = false;
+  };
+  doc.addEventListener('pointerdown', handleDown, true);
+  doc.addEventListener('pointerup', handleUp, true);
+  doc.addEventListener('pointercancel', handleCancel, true);
+  return () => {
+    doc.removeEventListener('pointerdown', handleDown, true);
+    doc.removeEventListener('pointerup', handleUp, true);
+    doc.removeEventListener('pointercancel', handleCancel, true);
+  };
+}
+/**
+ * One outside-press watch for a component: it calls `start` when its layer
+ * shows and `stop` when it hides, and the watch's document listeners (an
+ * external system) are removed when the component unmounts with it running.
+ * Both functions are stable.
+ */
+export function useOutsidePress() {
+  const stopRef = useRef(null);
+  const stop = useCallback(() => {
+    stopRef.current?.();
+    stopRef.current = null;
+  }, []);
+  const start = useCallback((owner, isInside, onOutside) => {
+    stopRef.current?.();
+    stopRef.current = watchOutsidePress(owner, isInside, onOutside);
+  }, []);
+  useEffect(() => stop, [stop]);
+  return useMemo(() => ({
+    start,
+    stop
+  }), [start, stop]);
+}
+
+// Node, Element and ShadowRoot are checked by nodeType, not instanceof: a
+// node from a same-origin iframe or a Picture-in-Picture window belongs to
+// another realm, where instanceof against this window's classes is false.
+function isNode(target) {
+  return typeof target === 'object' && target !== null && typeof target.nodeType === 'number';
+}
+function isElement(node) {
+  return node.nodeType === 1;
+}
+function isShadowRoot(node) {
+  return node.nodeType === 11 && 'host' in node;
+}
+
+/** Whether `node` is the layer with this id, or inside it across shadow roots. */
+function isWithinLayer(node, layerId) {
+  for (let current = node; current != null; current = current.parentNode ?? (isShadowRoot(current) ? current.host : null)) {
+    if (isElement(current) && current.id === layerId) {
+      return true;
+    }
+  }
+  return false;
+}
+
+/**
+ * Whether a press with this composed path is on a text field or in the
+ * field's own layer, which may be hosted outside the field.
+ *
+ * @param path - The press's composed path.
+ * @param field - The field that owns the layer.
+ * @param layerId - The layer element's id.
+ */
+export function isPressInsideOwnedLayer(path, field, layerId) {
+  return path.some(target => target === field || layerId !== '' && isNode(target) && isElement(target) && target.id === layerId);
+}
+
+/**
+ * Whether focus moving to `next` stays with a text field's own layer: on the
+ * field, or in the layer, which may be hosted outside the field or inside a
+ * shadow root. Each owner decides what a blur that fails this means,
+ * including when `next` is null.
+ *
+ * @param next - The blur's `relatedTarget`.
+ * @param field - The field that owns the layer.
+ * @param layerId - The layer element's id.
+ */
+export function isFocusInsideOwnedLayer(next, field, layerId) {
+  return isNode(next) && (field?.contains(next) === true || isWithinLayer(next, layerId));
+}

package/dist/Layer/useLayer.d.ts

@@ -270,6 +270,14 @@ interface InternalContextLayerOptions extends ContextLayerOptions {
      * its trigger keeps open.
      */
     keepsAnchorClear?: boolean;
+    /**
+     * With `lazyMount`, the layer stays mounted once its first `show()` mounted
+     * it: hiding leaves it in place, so its close plays out and every later
+     * `show()` opens it at once. A layer never shown still mounts only its inert
+     * marker. For a component with many triggers that each own a layer (a
+     * context menu on every table cell).
+     */
+    keepsMountAfterShow?: boolean;
 }
 type InternalContextLayerReturn = ContextLayerReturn & InternalLayerFields;
 type InternalFixedLayerReturn = FixedLayerReturn & InternalLayerFields;

package/dist/Layer/useLayer.d.ts.map

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

package/dist/Layer/useLayer.js

@@ -17,6 +17,7 @@ import React, { useCallback, useEffect, useId, useMemo, useRef, useState, useSyn
 import * as stylex from '@stylexjs/stylex';
 import { createPortal } from 'react-dom';
 import { LayerContentBoundary } from "./layerScopedContext.js";
+import { layerClickBoundary } from "./layerClickBoundary.js";
 import { addAnchorName, removeAnchorName } from "./anchorName.js";
 import { currentGesture, currentGestureHasClicked } from "./gestureCounter.js";
 import { resolveLayerPortalTarget } from "./layerHost.js";
@@ -785,6 +786,7 @@ function useLayerImplementation(options) {
     lightDismiss = false
   } = options;
   const lazyMount = mode === 'context' ? options.lazyMount ?? false : false;
+  const keepsMountAfterShow = lazyMount && mode === 'context' ? options.keepsMountAfterShow ?? false : false;
   const keepsAnchorClear = mode === 'context' ? options.keepsAnchorClear ?? false : false;
   const id = useId();
   const anchorId = `--astryx-layer-${id.replace(/:/g, '')}`;
@@ -963,12 +965,12 @@ function useLayerImplementation(options) {
     mountStore.set(next);
   }, [mountStore]);
   const clearContextMount = useCallback(() => {
-    if (mode !== 'context' || !lazyMount) {
+    if (mode !== 'context' || !lazyMount || keepsMountAfterShow) {
       return;
     }
     contextMountRef.current = null;
     mountStore.set(null);
-  }, [mode, lazyMount, mountStore]);
+  }, [mode, lazyMount, keepsMountAfterShow, mountStore]);
   const show = useCallback(() => {
     // Every caller lands here, so this is where the dismissing press is
     // absorbed: opening now would reopen the popup that same press closed.
@@ -1220,13 +1222,14 @@ function useLayerImplementation(options) {
   }, [handleToggle, bindToggleListener, show, showPopoverElement, isCurrentContextPopover, keepsAnchorClear]);
   const sentinelRefCallback = useCallback(el => {
     sentinelRef.current = el;
-    if (el && (!lazyMount || pendingShowRef.current || isOpenRef.current)) {
+    // A layer that keeps its mount re-resolves it too once it has one.
+    if (el && (!lazyMount || pendingShowRef.current || isOpenRef.current || keepsMountAfterShow && contextMountRef.current != null)) {
       // The render call may have moved while the hook stayed mounted.
       // Resolve again from the newly attached marker rather than reusing a
       // portal target from its previous JSX position.
       requestContextMount();
     }
-  }, [lazyMount, requestContextMount]);
+  }, [lazyMount, keepsMountAfterShow, requestContextMount]);
 
   // Re-bind when the handler identity changes while the element stays mounted,
   // and detach on unmount.
@@ -1371,7 +1374,11 @@ function useLayerImplementation(options) {
         ...extraStyle
       },
       onMouseEnter: onMouseEnter,
-      onMouseLeave: onMouseLeave,
+      onMouseLeave: onMouseLeave
+      // Presses inside the layer do not reach handlers around where it
+      // is written.
+      ,
+      ...layerClickBoundary(),
       children: /*#__PURE__*/_jsx(LayerContentBoundary, {
         children: children
       })
@@ -1409,7 +1416,11 @@ function useLayerImplementation(options) {
         ...stylexResult.style,
         ...positionStyle,
         ...extraStyle
-      },
+      }
+      // Presses inside the layer do not reach handlers around where it
+      // is written.
+      ,
+      ...layerClickBoundary(),
       children: /*#__PURE__*/_jsx(LayerContentBoundary, {
         children: children
       })

package/dist/Layer/useTouchTrigger.d.ts

@@ -1,11 +1,14 @@
 /**
  * @file useTouchTrigger.ts
  * @input Touch trigger mode, layer open state, trigger ref, show/hide callbacks
- * @output Exports useTouchTrigger hook, isActionTrigger, LayerTouchTrigger type
+ * @output Exports useTouchTrigger hook, isActionTrigger, LayerTouchTrigger type,
+ *   tapLandsOnDisabledControl, TOUCH_POINTER_TYPES and useTapStop (internal:
+ *   not re-exported from index)
  * @position Layer hook; shared touch behavior for useTooltip and useHoverCard
  *
  * SYNC: When modified, update:
  * - /packages/core/src/Layer/index.ts
+ * - /packages/core/src/hooks/useClickableContainer.ts (innermostInteractive)
  *
  * Hover is the one trigger a touch screen cannot express. A tap synthesizes
  * `mouseenter`, so an untreated hover layer either opens on every tap and
@@ -19,7 +22,10 @@
  * action — an info icon, an abbreviation, a truncated label — has nothing to
  * lose, so the tap opens the layer and the next tap outside dismisses it. That
  * is `auto`; `tap` and `none` state the choice outright, which is what an
- * icon-button whose only job is to reveal the layer needs.
+ * icon-button whose only job is to reveal the layer needs. An `aria-disabled`
+ * control performs no action: a tap that lands in one, or on a label for a
+ * disabled control, opens the layer, so its reason has a touch path. (A
+ * natively `disabled` control receives no click at all.)
  *
  * A touch decides nothing until it is a tap. A finger landing on the trigger
  * may be starting a scroll, a pinch or a long press, and only the browser
@@ -32,7 +38,7 @@
  * layer counts when the finger lifts too, or when a scroll takes the touch,
  * which is when UIKit dismisses a popover.
  */
-import { type RefObject } from 'react';
+import { type MouseEvent as ReactMouseEvent, type PointerEvent as ReactPointerEvent, type RefObject } from 'react';
 /**
  * How a hover layer behaves on a touch pointer.
  *
@@ -50,6 +56,14 @@ export type LayerTouchTrigger = 'auto' | 'tap' | 'none';
  * once it lands. See `handlePointerEnter`.
  */
 export declare const TOUCH_POINTER_TYPES: Set<string>;
+export declare function useTapStop(event: 'click'): {
+    onPointerDown: (event: ReactPointerEvent<Element>) => void;
+    onClick: (event: ReactMouseEvent<Element>) => void;
+};
+export declare function useTapStop(event: 'mousedown'): {
+    onPointerDown: (event: ReactPointerEvent<Element>) => void;
+    onMouseDown: (event: ReactMouseEvent<Element>) => void;
+};
 /**
  * Whether activating this element does something other than reveal the layer.
  *
@@ -63,6 +77,15 @@ export declare const TOUCH_POINTER_TYPES: Set<string>;
  * with no role) gets both: the layer opens and the handler runs.
  */
 export declare function isActionTrigger(element: HTMLElement): boolean;
+/**
+ * Whether a tap landed in a disabled control: walking out from the tapped
+ * element on the clickable containers' own walk (`innermostInteractive`),
+ * with labels counted, the innermost interactive element is an
+ * `aria-disabled` control or a label for a disabled control. That element
+ * takes the tap: the layer opens with its reason, and nothing activates.
+ * Every other tap is left to the trigger (`isActionTrigger`).
+ */
+export declare function tapLandsOnDisabledControl(tapped: Element): boolean;
 export interface UseTouchTriggerOptions {
     /** How the layer should behave on a touch pointer. */
     touchTrigger: LayerTouchTrigger;

package/dist/Layer/useTouchTrigger.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useTouchTrigger.d.ts","sourceRoot":"","sources":["../../src/Layer/useTouchTrigger.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AAEH,OAAO,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAOrE;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,KAAK,GAAG,MAAM,CAAC;AAExD;;;;;;;GAOG;AACH,eAAO,MAAM,mBAAmB,aAA4B,CAAC;AAyB7D;;;;;;;;;;;GAWG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CAoB7D;AAeD,MAAM,WAAW,sBAAsB;IACrC,sDAAsD;IACtD,YAAY,EAAE,iBAAiB,CAAC;IAEhC,oDAAoD;IACpD,SAAS,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,YAAY,EAAE,OAAO,CAAC;IAEtB,2CAA2C;IAC3C,MAAM,EAAE,OAAO,CAAC;IAEhB,0EAA0E;IAC1E,OAAO,EAAE,MAAM,CAAC;IAEhB,oDAAoD;IACpD,UAAU,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAE1C,uDAAuD;IACvD,IAAI,EAAE,MAAM,IAAI,CAAC;IAEjB,mCAAmC;IACnC,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB;AAED,MAAM,WAAW,qBAAqB;IACpC;;;;OAIG;IACH,iBAAiB,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAEtC;;;;OAIG;IACH,kBAAkB,EAAE,MAAM,OAAO,CAAC;IAElC;;;;OAIG;IACH,kBAAkB,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAElD;;;;;;OAMG;IACH,iBAAiB,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,OAAO,CAAC;IAEpD,gFAAgF;IAChF,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,eAAe,CAC7B,OAAO,EAAE,sBAAsB,GAC9B,qBAAqB,CAuMvB"}
+{"version":3,"file":"useTouchTrigger.d.ts","sourceRoot":"","sources":["../../src/Layer/useTouchTrigger.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AAEH,OAAO,EAIL,KAAK,UAAU,IAAI,eAAe,EAClC,KAAK,YAAY,IAAI,iBAAiB,EACtC,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AASf;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,KAAK,GAAG,MAAM,CAAC;AAExD;;;;;;;GAOG;AACH,eAAO,MAAM,mBAAmB,aAA4B,CAAC;AAE7D,wBAAgB,UAAU,CAAC,KAAK,EAAE,OAAO,GAAG;IAC1C,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;IAC3D,OAAO,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;CACpD,CAAC;AACF,wBAAgB,UAAU,CAAC,KAAK,EAAE,WAAW,GAAG;IAC9C,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;IAC3D,WAAW,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;CACxD,CAAC;AAwCF;;;;;;;;;;;GAWG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CA8B7D;AAiBD;;;;;;;GAOG;AACH,wBAAgB,yBAAyB,CAAC,MAAM,EAAE,OAAO,GAAG,OAAO,CAUlE;AAeD,MAAM,WAAW,sBAAsB;IACrC,sDAAsD;IACtD,YAAY,EAAE,iBAAiB,CAAC;IAEhC,oDAAoD;IACpD,SAAS,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,YAAY,EAAE,OAAO,CAAC;IAEtB,2CAA2C;IAC3C,MAAM,EAAE,OAAO,CAAC;IAEhB,0EAA0E;IAC1E,OAAO,EAAE,MAAM,CAAC;IAEhB,oDAAoD;IACpD,UAAU,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAE1C,uDAAuD;IACvD,IAAI,EAAE,MAAM,IAAI,CAAC;IAEjB,mCAAmC;IACnC,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB;AAED,MAAM,WAAW,qBAAqB;IACpC;;;;OAIG;IACH,iBAAiB,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAEtC;;;;OAIG;IACH,kBAAkB,EAAE,MAAM,OAAO,CAAC;IAElC;;;;OAIG;IACH,kBAAkB,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAElD;;;;;;OAMG;IACH,iBAAiB,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,OAAO,CAAC;IAEpD,gFAAgF;IAChF,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,eAAe,CAC7B,OAAO,EAAE,sBAAsB,GAC9B,qBAAqB,CA4MvB"}

package/dist/Layer/useTouchTrigger.js

@@ -5,11 +5,14 @@
 /**
  * @file useTouchTrigger.ts
  * @input Touch trigger mode, layer open state, trigger ref, show/hide callbacks
- * @output Exports useTouchTrigger hook, isActionTrigger, LayerTouchTrigger type
+ * @output Exports useTouchTrigger hook, isActionTrigger, LayerTouchTrigger type,
+ *   tapLandsOnDisabledControl, TOUCH_POINTER_TYPES and useTapStop (internal:
+ *   not re-exported from index)
  * @position Layer hook; shared touch behavior for useTooltip and useHoverCard
  *
  * SYNC: When modified, update:
  * - /packages/core/src/Layer/index.ts
+ * - /packages/core/src/hooks/useClickableContainer.ts (innermostInteractive)
  *
  * Hover is the one trigger a touch screen cannot express. A tap synthesizes
  * `mouseenter`, so an untreated hover layer either opens on every tap and
@@ -23,7 +26,10 @@
  * action — an info icon, an abbreviation, a truncated label — has nothing to
  * lose, so the tap opens the layer and the next tap outside dismisses it. That
  * is `auto`; `tap` and `none` state the choice outright, which is what an
- * icon-button whose only job is to reveal the layer needs.
+ * icon-button whose only job is to reveal the layer needs. An `aria-disabled`
+ * control performs no action: a tap that lands in one, or on a label for a
+ * disabled control, opens the layer, so its reason has a touch path. (A
+ * natively `disabled` control receives no click at all.)
  *
  * A touch decides nothing until it is a tap. A finger landing on the trigger
  * may be starting a scroll, a pinch or a long press, and only the browser
@@ -38,7 +44,9 @@
  */
 import { useCallback, useEffect, useRef } from 'react';
 import { currentGesture } from "./gestureCounter.js";
-import { getInteractionModality, useInteractionModalityTracking } from "../utils/interactionModality.js";
+import { innermostInteractive, matchesInteractiveSelectors } from "../hooks/useClickableContainer.js";
+import { isDisabledControl } from "../utils/pressDisabled.js";
+import { useInteractionModalityTrackingFor } from "../utils/interactionModality.js";
 
 /**
  * How a hover layer behaves on a touch pointer.
@@ -57,6 +65,25 @@ import { getInteractionModality, useInteractionModalityTracking } from "../utils
  * once it lands. See `handlePointerEnter`.
  */
 export const TOUCH_POINTER_TYPES = new Set(['touch', 'pen']);
+export function useTapStop(event) {
+  const pressIsTapRef = useRef(false);
+  const onPointerDown = pointer => {
+    pressIsTapRef.current = TOUCH_POINTER_TYPES.has(pointer.pointerType);
+  };
+  const cancel = mouse => {
+    if (pressIsTapRef.current) {
+      mouse.preventDefault();
+    }
+    pressIsTapRef.current = false;
+  };
+  return event === 'click' ? {
+    onPointerDown,
+    onClick: cancel
+  } : {
+    onPointerDown,
+    onMouseDown: cancel
+  };
+}
 
 /**
  * ARIA roles that make an element do something when activated. An explicit
@@ -78,14 +105,25 @@ const ACTION_ROLES = new Set(['button', 'checkbox', 'combobox', 'link', 'menuite
  * with no role) gets both: the layer opens and the handler runs.
  */
 export function isActionTrigger(element) {
+  // A disabled control performs no action: its tap is free to open the layer
+  // that explains why it is disabled.
+  if (isDisabledControl(element)) {
+    return false;
+  }
   const role = element.getAttribute('role');
   if (role != null && role !== '') {
     return ACTION_ROLES.has(role);
   }
   switch (element.tagName) {
+    case 'LABEL':
+      {
+        // A label acts by operating its control, so a label for a disabled one
+        // performs none.
+        const control = element.control;
+        return control == null || !isDisabledControl(control);
+      }
     case 'BUTTON':
     case 'INPUT':
-    case 'LABEL':
     case 'SELECT':
     case 'SUMMARY':
     case 'TEXTAREA':
@@ -98,6 +136,34 @@ export function isActionTrigger(element) {
   }
 }
 
+/**
+ * Whether this element takes a tap itself, as a disabled control does: an
+ * `aria-disabled` (or `:disabled`) control, or a label for one.
+ */
+function isDisabledTarget(element) {
+  if (isDisabledControl(element)) {
+    return true;
+  }
+  if (element.tagName === 'LABEL') {
+    const control = element.control;
+    return control != null && isDisabledControl(control);
+  }
+  return false;
+}
+
+/**
+ * Whether a tap landed in a disabled control: walking out from the tapped
+ * element on the clickable containers' own walk (`innermostInteractive`),
+ * with labels counted, the innermost interactive element is an
+ * `aria-disabled` control or a label for a disabled control. That element
+ * takes the tap: the layer opens with its reason, and nothing activates.
+ * Every other tap is left to the trigger (`isActionTrigger`).
+ */
+export function tapLandsOnDisabledControl(tapped) {
+  const innermost = innermostInteractive(tapped, null, element => matchesInteractiveSelectors(element) || element.tagName === 'LABEL' || isDisabledControl(element));
+  return innermost != null && isDisabledTarget(innermost);
+}
+
 /**
  * Whether typing into this element edits it. Reads the attribute as well as
  * the property: jsdom does not implement `isContentEditable`, and an editor
@@ -159,7 +225,7 @@ export function useTouchTrigger(options) {
   // A touch press on the trigger still waiting for its tap: calling it stops
   // waiting. The next press, a cancel, the tap itself or unmounting calls it.
   const forgetPendingTapRef = useRef(null);
-  useInteractionModalityTracking();
+  const readModality = useInteractionModalityTrackingFor(triggerRef);
   const disarmOutsideDismiss = useCallback(() => {
     isTapOpenRef.current = false;
     const listener = outsideListenerRef.current;
@@ -203,7 +269,7 @@ export function useTouchTrigger(options) {
   }, [triggerRef, disarmOutsideDismiss]);
   useEffect(() => disarmOutsideDismiss, [disarmOutsideDismiss]);
   useEffect(() => () => forgetPendingTapRef.current?.(), []);
-  const isTouchInteraction = useCallback(() => isTouchPointerRef.current && getInteractionModality() === 'pointer', []);
+  const isTouchInteraction = useCallback(() => isTouchPointerRef.current && readModality() === 'pointer', [readModality]);
   const handlePointerEnter = useCallback(event => {
     // Only a finger is hoverless on arrival. A pen in detection range hovers
     // like a mouse, and treating its arrival as touch would bail out of the
@@ -215,9 +281,12 @@ export function useTouchTrigger(options) {
   // What a tap on the trigger does. It runs from the tap's `click`, after the
   // render that armed it, so it reads the latest props through this ref.
   const answerTapRef = useRef(() => {});
-  answerTapRef.current = () => {
+  answerTapRef.current = tapEvent => {
     const trigger = triggerRef.current;
-    const mode = touchTrigger === 'auto' ? trigger != null && isActionTrigger(trigger) ? 'none' : 'tap' : touchTrigger;
+    // A tap that landed in a disabled control is that control's: its reason
+    // opens. Every other tap is the trigger's to decide.
+    const tapped = tapEvent.target instanceof Element ? tapEvent.target : null;
+    const mode = touchTrigger === 'auto' ? tapped != null && tapLandsOnDisabledControl(tapped) ? 'tap' : trigger != null && isActionTrigger(trigger) ? 'none' : 'tap' : touchTrigger;
     if (mode === 'none' || !isEnabled) {
       // A layer left open by an earlier tap must not survive the next one.
       disarmOutsideDismiss();
@@ -259,10 +328,10 @@ export function useTouchTrigger(options) {
         forgetPendingTapRef.current = null;
       }
     };
-    const handleTap = () => {
+    const handleTap = tapEvent => {
       forget();
       if (currentGesture() === gesture) {
-        answerTapRef.current();
+        answerTapRef.current(tapEvent);
       }
     };
     trigger.addEventListener('click', handleTap);

package/dist/Layout/LayoutSlotsContext.d.ts

@@ -13,6 +13,11 @@ export interface LayoutSlots {
     /** Whether an end panel is rendered */
     hasEnd: boolean;
 }
+/**
+ * Default slot state - no slots filled.
+ */
+/** The slots outside any Layout: none rendered (a layout root resets to it). */
+export declare const DEFAULT_LAYOUT_SLOTS: LayoutSlots;
 /**
  * Context for layout slot information.
  * Content area components use this to determine if they are at an edge

package/dist/Layout/LayoutSlotsContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LayoutSlotsContext.d.ts","sourceRoot":"","sources":["../../src/Layout/LayoutSlotsContext.ts"],"names":[],"mappings":"AAiBA;;;;GAIG;AACH,MAAM,WAAW,WAAW;IAC1B,mCAAmC;IACnC,SAAS,EAAE,OAAO,CAAC;IACnB,mCAAmC;IACnC,SAAS,EAAE,OAAO,CAAC;IACnB,wCAAwC;IACxC,QAAQ,EAAE,OAAO,CAAC;IAClB,uCAAuC;IACvC,MAAM,EAAE,OAAO,CAAC;CACjB;AAYD;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,sCAA2C,CAAC"}
+{"version":3,"file":"LayoutSlotsContext.d.ts","sourceRoot":"","sources":["../../src/Layout/LayoutSlotsContext.ts"],"names":[],"mappings":"AAiBA;;;;GAIG;AACH,MAAM,WAAW,WAAW;IAC1B,mCAAmC;IACnC,SAAS,EAAE,OAAO,CAAC;IACnB,mCAAmC;IACnC,SAAS,EAAE,OAAO,CAAC;IACnB,wCAAwC;IACxC,QAAQ,EAAE,OAAO,CAAC;IAClB,uCAAuC;IACvC,MAAM,EAAE,OAAO,CAAC;CACjB;AAED;;GAEG;AACH,gFAAgF;AAChF,eAAO,MAAM,oBAAoB,EAAE,WAKlC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,sCACmB,CAAC"}

package/dist/Layout/LayoutSlotsContext.js

@@ -23,7 +23,8 @@ import { createLayerScopedContext as createContext } from "../Layer/layerScopedC
 /**
  * Default slot state - no slots filled.
  */
-const defaultSlots = {
+/** The slots outside any Layout: none rendered (a layout root resets to it). */
+export const DEFAULT_LAYOUT_SLOTS = {
   hasHeader: false,
   hasFooter: false,
   hasStart: false,
@@ -35,5 +36,5 @@ const defaultSlots = {
  * Content area components use this to determine if they are at an edge
  * (for applying outer padding).
  */
-export const LayoutSlotsContext = createContext(defaultSlots);
+export const LayoutSlotsContext = createContext(DEFAULT_LAYOUT_SLOTS);
 LayoutSlotsContext.displayName = 'LayoutSlotsContext';