@astryxdesign/lab 0.4.2-canary.b2057d1 → 0.4.2-canary.bb07062

package/dist/BottomSheet/BottomSheet.d.ts

@@ -20,6 +20,7 @@
  */
 import { type ReactNode } from 'react';
 import type { BaseProps } from '@astryxdesign/core';
+import type { DialogPurpose } from '@astryxdesign/core/Dialog';
 export type { BottomSheetHeight } from './BottomSheetPanel';
 import type { BottomSheetHeight } from './BottomSheetPanel';
 interface BottomSheetSharedProps extends BaseProps<HTMLDivElement> {
@@ -31,6 +32,14 @@ interface BottomSheetSharedProps extends BaseProps<HTMLDivElement> {
     children: ReactNode;
     /** Height budget or custom CSS length. Only fully expanded Tall is keyboard-aware. @default 'capped' */
     height?: BottomSheetHeight | number | string;
+    /**
+     * Configures implicit dismissal behavior, matching Dialog.
+     * - required: Blocks swipe, scrim click, and Escape
+     * - form: Blocks swipe and scrim click, allows Escape
+     * - info: Allows swipe, scrim click, and Escape
+     * @default 'info'
+     */
+    purpose?: DialogPurpose;
 }
 interface StandaloneBottomSheetProps extends BottomSheetSharedProps {
     isOpen: boolean;

package/dist/BottomSheet/BottomSheet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BottomSheet.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheet.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,oBAAoB,CAAC;AAkBlD,YAAY,EAAC,iBAAiB,EAAC,MAAM,oBAAoB,CAAC;AAC1D,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,oBAAoB,CAAC;AA2D1D,UAAU,sBAAuB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,qDAAqD;IACrD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAC;IAEd,0EAA0E;IAC1E,QAAQ,EAAE,SAAS,CAAC;IAEpB,wGAAwG;IACxG,MAAM,CAAC,EAAE,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;CAC9C;AAED,UAAU,0BAA2B,SAAQ,sBAAsB;IACjE,MAAM,EAAE,OAAO,CAAC;IAChB,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB;AAED,UAAU,wBAAyB,SAAQ,sBAAsB;IAC/D,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB;AAED,MAAM,MAAM,gBAAgB,GAC1B,0BAA0B,GAAG,wBAAwB,CAAC;AAwUxD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,+BA6BlD;yBA7Be,WAAW"}
+{"version":3,"file":"BottomSheet.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheet.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,oBAAoB,CAAC;AAClD,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,2BAA2B,CAAC;AAkB7D,YAAY,EAAC,iBAAiB,EAAC,MAAM,oBAAoB,CAAC;AAC1D,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,oBAAoB,CAAC;AA2D1D,UAAU,sBAAuB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,qDAAqD;IACrD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAC;IAEd,0EAA0E;IAC1E,QAAQ,EAAE,SAAS,CAAC;IAEpB,wGAAwG;IACxG,MAAM,CAAC,EAAE,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;IAE7C;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB;AAED,UAAU,0BAA2B,SAAQ,sBAAsB;IACjE,MAAM,EAAE,OAAO,CAAC;IAChB,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB;AAED,UAAU,wBAAyB,SAAQ,sBAAsB;IAC/D,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB;AAED,MAAM,MAAM,gBAAgB,GAC1B,0BAA0B,GAAG,wBAAwB,CAAC;AA+VxD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,+BA6BlD;yBA7Be,WAAW"}

package/dist/BottomSheet/BottomSheet.js

@@ -80,6 +80,7 @@ function StandaloneBottomSheet({
   children,
   height = 'capped',
   hasScrim = true,
+  purpose = 'info',
   xstyle,
   ...props
 }) {
@@ -96,7 +97,16 @@ function StandaloneBottomSheet({
   } : {
     kind: 'hidden'
   };
-  const close = useCallback(() => onOpenChange(false), [onOpenChange]);
+  const dismissOnEscape = useCallback(() => {
+    if (purpose !== 'required') {
+      onOpenChange(false);
+    }
+  }, [onOpenChange, purpose]);
+  const dismissOnLightInteraction = useCallback(() => {
+    if (purpose === 'info') {
+      onOpenChange(false);
+    }
+  }, [onOpenChange, purpose]);
   const handlePanelElementChange = useCallback(element => {
     panelRef.current = element;
   }, []);
@@ -142,19 +152,19 @@ function StandaloneBottomSheet({
   useDevWarning('BottomSheet', 'requires a non-empty `label` for an accessible name; the open sheet ' + 'has no built-in heading to derive one from.', isOpen && !label);
   const handleCancel = useCallback(event => {
     event.preventDefault();
-    close();
-  }, [close]);
+    dismissOnEscape();
+  }, [dismissOnEscape]);
   const handleKeyDown = useCallback(event => {
     if (event.key === 'Escape') {
       event.preventDefault();
-      close();
+      dismissOnEscape();
     }
-  }, [close]);
+  }, [dismissOnEscape]);
   const handleClick = useCallback(event => {
     if (hasScrim && event.target === event.currentTarget) {
-      close();
+      dismissOnLightInteraction();
     }
-  }, [close, hasScrim]);
+  }, [dismissOnLightInteraction, hasScrim]);
   return /*#__PURE__*/_jsx("dialog", {
     ...{
       0: {
@@ -186,6 +196,7 @@ function StandaloneBottomSheet({
     "aria-label": label,
     "aria-hidden": !isOpen && isPresented ? 'true' : undefined,
     "aria-modal": hasScrim && isOpen ? 'true' : undefined,
+    role: purpose === 'required' ? 'alertdialog' : undefined,
     inert: !isOpen && isPresented ? true : undefined,
     onCancel: handleCancel,
     onClick: handleClick,
@@ -199,8 +210,9 @@ function StandaloneBottomSheet({
         ref: ref,
         state: panelState,
         height: height,
+        canSwipeDismiss: purpose === 'info',
         xstyle: xstyle,
-        onDismiss: close,
+        onDismiss: dismissOnLightInteraction,
         onScrimOpacity: handleScrimOpacity,
         onElementChange: handlePanelElementChange,
         onMotionComplete: handleMotionComplete,
@@ -216,6 +228,7 @@ function SwitcherBottomSheetItem({
   label,
   children,
   height = 'capped',
+  purpose = 'info',
   xstyle,
   ...props
 }) {
@@ -227,6 +240,7 @@ function SwitcherBottomSheetItem({
     getSheetAlignmentOffset,
     registerSheetElement,
     registerSheetLabel,
+    registerSheetPurpose,
     onSheetEnterStart,
     onSheetTransitionComplete,
     onSheetScrimOpacityChange
@@ -246,11 +260,11 @@ function SwitcherBottomSheetItem({
   useLayoutEffect(() => {
     previousPhaseRef.current = phase;
   }, [phase]);
-  const close = useCallback(() => {
-    if (hasValidSheetId && activeSheet === sheetId) {
+  const dismissOnSwipe = useCallback(() => {
+    if (purpose === 'info' && hasValidSheetId && activeSheet === sheetId) {
       onActiveSheetChange(null);
     }
-  }, [activeSheet, hasValidSheetId, onActiveSheetChange, sheetId]);
+  }, [activeSheet, hasValidSheetId, onActiveSheetChange, purpose, sheetId]);
   const handlePanelElementChange = useCallback(element => {
     panelRef.current = element;
     if (hasValidSheetId) {
@@ -282,6 +296,13 @@ function SwitcherBottomSheetItem({
     registerSheetLabel(sheetId, label);
     return () => registerSheetLabel(sheetId, null);
   }, [hasValidSheetId, label, registerSheetLabel, sheetId]);
+  useLayoutEffect(() => {
+    if (!hasValidSheetId) {
+      return;
+    }
+    registerSheetPurpose(sheetId, purpose);
+    return () => registerSheetPurpose(sheetId, null);
+  }, [hasValidSheetId, purpose, registerSheetPurpose, sheetId]);
   useEffect(() => {
     if (isInteractive) {
       const wasInteractive = previousPhase === 'active' || previousPhase === 'entering';
@@ -317,8 +338,9 @@ function SwitcherBottomSheetItem({
       ref: ref,
       state: panelState,
       height: height,
+      canSwipeDismiss: purpose === 'info',
       xstyle: xstyle,
-      onDismiss: close,
+      onDismiss: dismissOnSwipe,
       onScrimOpacity: handleScrimOpacity,
       onElementChange: handlePanelElementChange,
       onMotionStart: handleMotionStart,

package/dist/BottomSheet/BottomSheetPanel.d.ts

@@ -41,6 +41,7 @@ interface BottomSheetPanelProps extends BaseProps<HTMLDivElement> {
     state: BottomSheetPanelState;
     height: BottomSheetHeight | number | string;
     children: ReactNode;
+    canSwipeDismiss?: boolean;
     onDismiss: () => void;
     onScrimOpacity: (opacity: number) => void;
     onElementChange?: (element: HTMLDivElement | null) => void;
@@ -48,7 +49,7 @@ interface BottomSheetPanelProps extends BaseProps<HTMLDivElement> {
     onMotionComplete?: (motion: BottomSheetPanelMotion) => void;
 }
 /** Internal visual and gesture surface shared by every BottomSheet host. */
-export declare function BottomSheetPanel({ ref, state, height, children, className, style, tabIndex, xstyle, onDismiss, onScrimOpacity, onElementChange, onMotionStart, onMotionComplete, ...props }: BottomSheetPanelProps): import("react").JSX.Element;
+export declare function BottomSheetPanel({ ref, state, height, children, className, style, tabIndex, xstyle, canSwipeDismiss, onDismiss, onScrimOpacity, onElementChange, onMotionStart, onMotionComplete, ...props }: BottomSheetPanelProps): import("react").JSX.Element;
 export declare namespace BottomSheetPanel {
     var displayName: string;
 }

package/dist/BottomSheet/BottomSheetPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BottomSheetPanel.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetPanel.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,oBAAoB,CAAC;AAgBlD,QAAA,MAAM,cAAc;;;;CAIV,CAAC;AAEX,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,cAAc,CAAC;AA8F5D,MAAM,MAAM,sBAAsB,GAChC,UAAU,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEjD,MAAM,MAAM,qBAAqB,GAC7B;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAC,GAChB;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,OAAO,CAAA;CAAC,GACjC;IACE,IAAI,EAAE,UAAU,CAAC;IACjB,MAAM,EAAE,SAAS,GAAG,UAAU,GAAG,QAAQ,CAAC;IAC1C,eAAe,EAAE,MAAM,CAAC;CACzB,GACD;IAAC,IAAI,EAAE,SAAS,CAAA;CAAC,CAAC;AAEtB,UAAU,qBAAsB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/D,+CAA+C;IAC/C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,KAAK,EAAE,qBAAqB,CAAC;IAC7B,MAAM,EAAE,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;IAC5C,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,cAAc,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;IAC3D,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,sBAAsB,KAAK,IAAI,CAAC;IACzD,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,sBAAsB,KAAK,IAAI,CAAC;CAC7D;AA+GD,4EAA4E;AAC5E,wBAAgB,gBAAgB,CAAC,EAC/B,GAAG,EACH,KAAK,EACL,MAAM,EACN,QAAQ,EACR,SAAS,EACT,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,cAAc,EACd,eAAe,EACf,aAAa,EACb,gBAAgB,EAChB,GAAG,KAAK,EACT,EAAE,qBAAqB,+BAkLvB;yBAjMe,gBAAgB"}
+{"version":3,"file":"BottomSheetPanel.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetPanel.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,oBAAoB,CAAC;AAgBlD,QAAA,MAAM,cAAc;;;;CAIV,CAAC;AAEX,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,cAAc,CAAC;AA8F5D,MAAM,MAAM,sBAAsB,GAChC,UAAU,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEjD,MAAM,MAAM,qBAAqB,GAC7B;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAC,GAChB;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,OAAO,CAAA;CAAC,GACjC;IACE,IAAI,EAAE,UAAU,CAAC;IACjB,MAAM,EAAE,SAAS,GAAG,UAAU,GAAG,QAAQ,CAAC;IAC1C,eAAe,EAAE,MAAM,CAAC;CACzB,GACD;IAAC,IAAI,EAAE,SAAS,CAAA;CAAC,CAAC;AAEtB,UAAU,qBAAsB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/D,+CAA+C;IAC/C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,KAAK,EAAE,qBAAqB,CAAC;IAC7B,MAAM,EAAE,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;IAC5C,QAAQ,EAAE,SAAS,CAAC;IACpB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,cAAc,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;IAC3D,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,sBAAsB,KAAK,IAAI,CAAC;IACzD,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,sBAAsB,KAAK,IAAI,CAAC;CAC7D;AA+GD,4EAA4E;AAC5E,wBAAgB,gBAAgB,CAAC,EAC/B,GAAG,EACH,KAAK,EACL,MAAM,EACN,QAAQ,EACR,SAAS,EACT,KAAK,EACL,QAAQ,EACR,MAAM,EACN,eAAsB,EACtB,SAAS,EACT,cAAc,EACd,eAAe,EACf,aAAa,EACb,gBAAgB,EAChB,GAAG,KAAK,EACT,EAAE,qBAAqB,+BAmLvB;yBAnMe,gBAAgB"}

package/dist/BottomSheet/BottomSheetPanel.js

@@ -188,6 +188,7 @@ export function BottomSheetPanel({
   style,
   tabIndex,
   xstyle,
+  canSwipeDismiss = true,
   onDismiss,
   onScrimOpacity,
   onElementChange,
@@ -233,6 +234,7 @@ export function BottomSheetPanel({
     isDragging
   } = useSheetGestures({
     isOpen: isInteractive,
+    canDismiss: canSwipeDismiss,
     onDismiss,
     snapHeights: defaultSnapHeights,
     onScrimOpacity

package/dist/BottomSheet/BottomSheetSwitcher.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BottomSheetSwitcher.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetSwitcher.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,EAQL,KAAK,SAAS,EACd,KAAK,cAAc,EACpB,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,oBAAoB,CAAC;AAkIlD,MAAM,WAAW,wBAAyB,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC5E,iDAAiD;IACjD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAEnC,oEAAoE;IACpE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAE9D;;;;;OAKG;IACH,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAE3B,iEAAiE;IACjE,mBAAmB,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAEtD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,0DAA0D;IAC1D,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,WAAW,EACX,mBAAmB,EACnB,QAAe,EACf,QAAQ,EACR,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,QAAQ,EACR,OAAO,EACP,SAAS,EACT,GAAG,KAAK,EACT,EAAE,wBAAwB,+BAmX1B;yBAhYe,mBAAmB"}
+{"version":3,"file":"BottomSheetSwitcher.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetSwitcher.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,EAQL,KAAK,SAAS,EACd,KAAK,cAAc,EACpB,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,oBAAoB,CAAC;AAmIlD,MAAM,WAAW,wBAAyB,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC5E,iDAAiD;IACjD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAEnC,oEAAoE;IACpE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAE9D;;;;;OAKG;IACH,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAE3B,iEAAiE;IACjE,mBAAmB,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAEtD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,0DAA0D;IAC1D,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,WAAW,EACX,mBAAmB,EACnB,QAAe,EACf,QAAQ,EACR,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,QAAQ,EACR,OAAO,EACP,SAAS,EACT,GAAG,KAAK,EACT,EAAE,wBAAwB,+BA2Z1B;yBAxae,mBAAmB"}

package/dist/BottomSheet/BottomSheetSwitcher.js

@@ -135,12 +135,16 @@ export function BottomSheetSwitcher({
   const sheetElementsRef = useRef(new Map());
   const committedActiveSheetRef = useRef(activeSheet);
   const [sheetLabels, setSheetLabels] = useState(() => new Map());
+  const [sheetPurposes, setSheetPurposes] = useState(() => new Map());
   const [unmountedSheetIds, setUnmountedSheetIds] = useState(() => new Set());
   const [transition, setTransition] = useState(IDLE_TRANSITION);
   const activeSheetChanged = committedActiveSheetRef.current !== activeSheet;
   const visibleTransition = activeSheetChanged ? transitionForActiveSheetChange(committedActiveSheetRef.current, activeSheet) : transition;
   const isFlowVisible = activeSheet != null && !unmountedSheetIds.has(activeSheet) || visibleTransition.retainedSheet != null && !unmountedSheetIds.has(visibleTransition.retainedSheet);
   const isModal = hasScrim && isFlowVisible;
+  const activeSheetPurpose = (activeSheet == null ? null : sheetPurposes.get(activeSheet)) ?? 'info';
+  const allowsEscapeDismiss = activeSheetPurpose !== 'required';
+  const allowsLightDismiss = activeSheetPurpose === 'info';
   useLayoutEffect(() => {
     const previousActiveSheet = committedActiveSheetRef.current;
     if (previousActiveSheet === activeSheet) {
@@ -150,12 +154,21 @@ export function BottomSheetSwitcher({
     const nextTransition = transitionForActiveSheetChange(previousActiveSheet, activeSheet);
     setTransition(nextTransition.retainedSheet != null && !sheetElementsRef.current.has(nextTransition.retainedSheet) ? IDLE_TRANSITION : nextTransition);
   }, [activeSheet]);
-  const close = useCallback(() => onActiveSheetChange(null), [onActiveSheetChange]);
+  const dismissOnEscape = useCallback(() => {
+    if (allowsEscapeDismiss) {
+      onActiveSheetChange(null);
+    }
+  }, [allowsEscapeDismiss, onActiveSheetChange]);
+  const dismissOnLightInteraction = useCallback(() => {
+    if (allowsLightDismiss) {
+      onActiveSheetChange(null);
+    }
+  }, [allowsLightDismiss, onActiveSheetChange]);
   const {
     containerRef
   } = useFocusTrap({
     isActive: isModal,
-    onEscape: close
+    onEscape: dismissOnEscape
   });
   useScrollLock(isModal);
 
@@ -247,6 +260,24 @@ export function BottomSheetSwitcher({
       return next;
     });
   }, []);
+  const registerSheetPurpose = useCallback((sheetId, purpose) => {
+    setSheetPurposes(current => {
+      if (purpose == null) {
+        if (!current.has(sheetId)) {
+          return current;
+        }
+        const next = new Map(current);
+        next.delete(sheetId);
+        return next;
+      }
+      if (current.get(sheetId) === purpose) {
+        return current;
+      }
+      const next = new Map(current);
+      next.set(sheetId, purpose);
+      return next;
+    });
+  }, []);
   useLayoutEffect(() => {
     setTransition(current => current.retainedSheet != null && unmountedSheetIds.has(current.retainedSheet) ? IDLE_TRANSITION : current);
   }, [unmountedSheetIds]);
@@ -329,29 +360,30 @@ export function BottomSheetSwitcher({
     getSheetAlignmentOffset,
     registerSheetElement,
     registerSheetLabel,
+    registerSheetPurpose,
     onSheetEnterStart,
     onSheetTransitionComplete,
     onSheetScrimOpacityChange
-  }), [activeSheet, getSheetAlignmentOffset, getSheetPhase, hasScrim, onActiveSheetChange, onSheetEnterStart, onSheetScrimOpacityChange, onSheetTransitionComplete, registerSheetElement, registerSheetLabel]);
+  }), [activeSheet, getSheetAlignmentOffset, getSheetPhase, hasScrim, onActiveSheetChange, onSheetEnterStart, onSheetScrimOpacityChange, onSheetTransitionComplete, registerSheetElement, registerSheetLabel, registerSheetPurpose]);
   const activeLabel = (activeSheet == null ? null : sheetLabels.get(activeSheet)) ?? (visibleTransition.retainedSheet == null ? undefined : sheetLabels.get(visibleTransition.retainedSheet));
   const handleCancel = useCallback(event => {
     event.preventDefault();
-    close();
-  }, [close]);
+    dismissOnEscape();
+  }, [dismissOnEscape]);
   const handleKeyDown = useCallback(event => {
     // Modal Escape is owned by useFocusTrap so nested traps can win. A
     // non-modal switcher has no outer trap, so retain local dismissal while
     // deferring to an active nested layer and ignoring IME cancellation.
     if (!isModal && event.key === 'Escape' && !isImeKeyEvent(event.nativeEvent) && !hasActiveFocusTrapEscape()) {
       event.preventDefault();
-      close();
+      dismissOnEscape();
     }
-  }, [close, isModal]);
+  }, [dismissOnEscape, isModal]);
   const handleClick = useCallback(event => {
     if (hasScrim && event.target === event.currentTarget) {
-      close();
+      dismissOnLightInteraction();
     }
-  }, [close, hasScrim]);
+  }, [dismissOnLightInteraction, hasScrim]);
   const dialogStyleProps = stylex.props(styles.dialog, isFlowVisible && styles.dialogOpen, hasScrim && styles.scrim, !hasScrim && styles.dialogNonModal, xstyle);
   const dialogPresentationProps = mergeProps(dialogStyleProps, className, style);
   const ariaLabel = props['aria-label'] ?? (props['aria-labelledby'] == null ? activeLabel : undefined);
@@ -366,6 +398,9 @@ export function BottomSheetSwitcher({
       onCancel: composeEventHandlers(onCancel, handleCancel),
       onClick: composeEventHandlers(onClick, handleClick),
       onKeyDown: composeEventHandlers(onKeyDown, handleKeyDown),
+      ...(activeSheetPurpose === 'required' ? {
+        role: 'alertdialog'
+      } : undefined),
       children: children
     })
   });

package/dist/BottomSheet/BottomSheetSwitcherContext.d.ts

@@ -1,3 +1,4 @@
+import type { DialogPurpose } from '@astryxdesign/core/Dialog';
 export type BottomSheetSwitcherPhase = 'entering' | 'active' | 'covered' | 'aligning' | 'fading' | 'exiting' | 'hidden';
 export interface BottomSheetSwitcherTransitionEvent {
     sheetId: string;
@@ -11,6 +12,7 @@ export interface BottomSheetSwitcherContextValue {
     getSheetAlignmentOffset: (sheetId: string) => number;
     registerSheetElement: (sheetId: string, element: HTMLElement | null) => void;
     registerSheetLabel: (sheetId: string, label: string | null) => void;
+    registerSheetPurpose: (sheetId: string, purpose: DialogPurpose | null) => void;
     onSheetEnterStart: (sheetId: string) => void;
     onSheetTransitionComplete: (event: BottomSheetSwitcherTransitionEvent) => void;
     onSheetScrimOpacityChange: (sheetId: string, opacity: number) => void;

package/dist/BottomSheet/BottomSheetSwitcherContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BottomSheetSwitcherContext.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetSwitcherContext.ts"],"names":[],"mappings":"AAaA,MAAM,MAAM,wBAAwB,GAChC,UAAU,GACV,QAAQ,GACR,SAAS,GACT,UAAU,GACV,QAAQ,GACR,SAAS,GACT,QAAQ,CAAC;AAEb,MAAM,WAAW,kCAAkC;IACjD,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,UAAU,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;CACvD;AAED,MAAM,WAAW,+BAA+B;IAC9C,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,QAAQ,EAAE,OAAO,CAAC;IAClB,mBAAmB,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACtD,aAAa,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,wBAAwB,CAAC;IAC7D,uBAAuB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM,CAAC;IACrD,oBAAoB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7E,kBAAkB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACpE,iBAAiB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,yBAAyB,EAAE,CACzB,KAAK,EAAE,kCAAkC,KACtC,IAAI,CAAC;IACV,yBAAyB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACvE;AAED,eAAO,MAAM,0BAA0B,iEACsB,CAAC"}
+{"version":3,"file":"BottomSheetSwitcherContext.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetSwitcherContext.ts"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,2BAA2B,CAAC;AAE7D,MAAM,MAAM,wBAAwB,GAChC,UAAU,GACV,QAAQ,GACR,SAAS,GACT,UAAU,GACV,QAAQ,GACR,SAAS,GACT,QAAQ,CAAC;AAEb,MAAM,WAAW,kCAAkC;IACjD,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,UAAU,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;CACvD;AAED,MAAM,WAAW,+BAA+B;IAC9C,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,QAAQ,EAAE,OAAO,CAAC;IAClB,mBAAmB,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACtD,aAAa,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,wBAAwB,CAAC;IAC7D,uBAAuB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM,CAAC;IACrD,oBAAoB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7E,kBAAkB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACpE,oBAAoB,EAAE,CACpB,OAAO,EAAE,MAAM,EACf,OAAO,EAAE,aAAa,GAAG,IAAI,KAC1B,IAAI,CAAC;IACV,iBAAiB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,yBAAyB,EAAE,CACzB,KAAK,EAAE,kCAAkC,KACtC,IAAI,CAAC;IACV,yBAAyB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACvE;AAED,eAAO,MAAM,0BAA0B,iEACsB,CAAC"}

package/dist/BottomSheet/useSheetGestures.d.ts

@@ -22,10 +22,16 @@
  * - /packages/lab/src/BottomSheet/useSheetGestures.doc.mjs
  * - /packages/lab/src/BottomSheet/useSheetGestures.test.ts
  */
-import { type CSSProperties, type PointerEvent as ReactPointerEvent } from 'react';
+import { type CSSProperties, type MouseEvent as ReactMouseEvent, type PointerEvent as ReactPointerEvent } from 'react';
 export interface UseSheetGesturesOptions {
     /** Whether the owning sheet is open. Drag state resets when it closes. */
     isOpen: boolean;
+    /**
+     * Whether a downward swipe may dismiss the sheet. When false, a gesture
+     * past the dismiss threshold settles at the shortest detent instead.
+     * @default true
+     */
+    canDismiss?: boolean;
     /** Called on a swipe-to-close (fast downward flick, or drag past the floor). */
     onDismiss: () => void;
     /**
@@ -53,6 +59,8 @@ export interface SheetContentProps {
 }
 export interface SheetHandleProps {
     style: CSSProperties;
+    onContextMenu: (event: ReactMouseEvent) => void;
+    onLostPointerCapture: (event: ReactPointerEvent) => void;
     onPointerDown: (event: ReactPointerEvent) => void;
     onPointerMove: (event: ReactPointerEvent) => void;
     onPointerUp: (event: ReactPointerEvent) => void;
@@ -60,6 +68,8 @@ export interface SheetHandleProps {
 }
 export interface SheetBodyProps {
     ref: (node: HTMLElement | null) => void;
+    onContextMenu: (event: ReactMouseEvent) => void;
+    onLostPointerCapture: (event: ReactPointerEvent) => void;
     onPointerDown: (event: ReactPointerEvent) => void;
     onPointerMove: (event: ReactPointerEvent) => void;
     onPointerUp: (event: ReactPointerEvent) => void;
@@ -108,5 +118,5 @@ export interface UseSheetGesturesResult {
  * </div>
  * ```
  */
-export declare function useSheetGestures({ isOpen, onDismiss, snapHeights, onSnap, onScrimOpacity, }: UseSheetGesturesOptions): UseSheetGesturesResult;
+export declare function useSheetGestures({ isOpen, canDismiss, onDismiss, snapHeights, onSnap, onScrimOpacity, }: UseSheetGesturesOptions): UseSheetGesturesResult;
 //# sourceMappingURL=useSheetGestures.d.ts.map

package/dist/BottomSheet/useSheetGestures.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSheetGestures.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/useSheetGestures.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAEH,OAAO,EAML,KAAK,aAAa,EAClB,KAAK,YAAY,IAAI,iBAAiB,EACvC,MAAM,OAAO,CAAC;AAgEf,MAAM,WAAW,uBAAuB;IACtC,0EAA0E;IAC1E,MAAM,EAAE,OAAO,CAAC;IAChB,gFAAgF;IAChF,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB;;;;;;;OAOG;IACH,WAAW,CAAC,EAAE,MAAM,MAAM,EAAE,CAAC;IAC7B,4DAA4D;IAC5D,MAAM,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,aAAa,CAAC;CACtB;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,aAAa,CAAC;IACrB,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,WAAW,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAChD,eAAe,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;CACrD;AAED,MAAM,WAAW,cAAc;IAC7B,GAAG,EAAE,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IACxC,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,WAAW,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAChD,eAAe,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;CACrD;AAED,MAAM,WAAW,sBAAsB;IACrC;;;;OAIG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7C,0EAA0E;IAC1E,YAAY,EAAE,iBAAiB,CAAC;IAChC,gEAAgE;IAChE,WAAW,EAAE,gBAAgB,CAAC;IAC9B;;;;OAIG;IACH,SAAS,EAAE,cAAc,CAAC;IAC1B,kFAAkF;IAClF,UAAU,EAAE,MAAM,CAAC;IACnB,kEAAkE;IAClE,aAAa,EAAE,MAAM,CAAC;IACtB,+CAA+C;IAC/C,UAAU,EAAE,OAAO,CAAC;CACrB;AASD;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,SAAS,EACT,WAAW,EACX,MAAM,EACN,cAAc,GACf,EAAE,uBAAuB,GAAG,sBAAsB,CAqelD"}
+{"version":3,"file":"useSheetGestures.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/useSheetGestures.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAEH,OAAO,EAML,KAAK,aAAa,EAClB,KAAK,UAAU,IAAI,eAAe,EAClC,KAAK,YAAY,IAAI,iBAAiB,EACvC,MAAM,OAAO,CAAC;AAgEf,MAAM,WAAW,uBAAuB;IACtC,0EAA0E;IAC1E,MAAM,EAAE,OAAO,CAAC;IAChB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gFAAgF;IAChF,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB;;;;;;;OAOG;IACH,WAAW,CAAC,EAAE,MAAM,MAAM,EAAE,CAAC;IAC7B,4DAA4D;IAC5D,MAAM,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,aAAa,CAAC;CACtB;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,aAAa,CAAC;IACrB,aAAa,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAChD,oBAAoB,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACzD,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,WAAW,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAChD,eAAe,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;CACrD;AAED,MAAM,WAAW,cAAc;IAC7B,GAAG,EAAE,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IACxC,aAAa,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAChD,oBAAoB,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACzD,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,WAAW,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAChD,eAAe,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;CACrD;AAED,MAAM,WAAW,sBAAsB;IACrC;;;;OAIG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7C,0EAA0E;IAC1E,YAAY,EAAE,iBAAiB,CAAC;IAChC,gEAAgE;IAChE,WAAW,EAAE,gBAAgB,CAAC;IAC9B;;;;OAIG;IACH,SAAS,EAAE,cAAc,CAAC;IAC1B,kFAAkF;IAClF,UAAU,EAAE,MAAM,CAAC;IACnB,kEAAkE;IAClE,aAAa,EAAE,MAAM,CAAC;IACtB,+CAA+C;IAC/C,UAAU,EAAE,OAAO,CAAC;CACrB;AASD;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,UAAiB,EACjB,SAAS,EACT,WAAW,EACX,MAAM,EACN,cAAc,GACf,EAAE,uBAAuB,GAAG,sBAAsB,CAolBlD"}

package/dist/BottomSheet/useSheetGestures.js

@@ -110,6 +110,7 @@ function prefersReducedMotion() {
  */
 export function useSheetGestures({
   isOpen,
+  canDismiss = true,
   onDismiss,
   snapHeights,
   onSnap,
@@ -119,11 +120,13 @@ export function useSheetGestures({
   const [settledOffset, setSettledOffset] = useState(0);
   const [isDragging, setIsDragging] = useState(false);
   const onDismissRef = useRef(onDismiss);
+  const canDismissRef = useRef(canDismiss);
   const onSnapRef = useRef(onSnap);
   const onScrimOpacityRef = useRef(onScrimOpacity);
   const snapHeightsRef = useRef(snapHeights);
   useEffect(() => {
     onDismissRef.current = onDismiss;
+    canDismissRef.current = canDismiss;
     onSnapRef.current = onSnap;
     onScrimOpacityRef.current = onScrimOpacity;
     snapHeightsRef.current = snapHeights;
@@ -185,14 +188,65 @@ export function useSheetGestures({
   const detentOffsets = useCallback(height => {
     return computeDetentOffsets(height, snapHeightsRef.current?.() ?? []);
   }, []);
+  const cancelDrag = useCallback(target => {
+    const state = dragStateRef.current;
+    if (state == null) {
+      return;
+    }
+
+    // Clear first: releasePointerCapture() may synchronously dispatch
+    // lostpointercapture, which must observe that this drag is already done.
+    dragStateRef.current = null;
+    if (target?.hasPointerCapture?.(state.pointerId)) {
+      target.releasePointerCapture(state.pointerId);
+    }
+    setDragOffset(state.baseOffset);
+    setIsDragging(false);
+
+    // An interrupted drag returns to its previous resting detent. Restore
+    // the matching scrim opacity as well so the modal shell cannot remain
+    // dimmed with its sheet translated out of view.
+    const offsets = detentOffsets(state.height);
+    const maxOffset = offsets[offsets.length - 1];
+    const shortestDetentHeight = state.height - maxOffset;
+    const dismissOffset = maxOffset + shortestDetentHeight * DISMISS_OVERSHOOT_RATIO;
+    onScrimOpacityRef.current?.(scrimOpacityForOffset(state.baseOffset, offsets, dismissOffset));
+  }, [detentOffsets]);
+  useEffect(() => {
+    const handleWindowBlur = () => cancelDrag();
+    const handleVisibilityChange = () => {
+      if (document.visibilityState === 'hidden') {
+        cancelDrag();
+      }
+    };
+    window.addEventListener('blur', handleWindowBlur);
+    document.addEventListener('visibilitychange', handleVisibilityChange);
+    return () => {
+      window.removeEventListener('blur', handleWindowBlur);
+      document.removeEventListener('visibilitychange', handleVisibilityChange);
+    };
+  }, [cancelDrag]);
   const settleFromDrag = useCallback((offset, velocity, height, dir, travel, baseOffset) => {
     const offsets = detentOffsets(height);
     const maxOffset = offsets[offsets.length - 1];
     const shortestDetentHeight = height - maxOffset;
     const speed = Math.abs(velocity);
     const isFlick = speed > FLICK_VELOCITY && travel > FLICK_MIN_DISTANCE;
+    const settleAt = target => {
+      setSettledOffset(target);
+      onSnapRef.current?.(height - target);
+      const dismissOffset = maxOffset + shortestDetentHeight * DISMISS_OVERSHOOT_RATIO;
+      onScrimOpacityRef.current?.(scrimOpacityForOffset(target, offsets, dismissOffset));
+      if (target !== baseOffset) {
+        hapticTick();
+      }
+    };
     if (dir > 0 && isFlick) {
-      onDismissRef.current();
+      if (canDismissRef.current) {
+        onDismissRef.current();
+      } else {
+        settleAt(maxOffset);
+      }
       return;
     }
     // Fast upward flick = expand to the tallest detent (the sheet's full
@@ -205,21 +259,17 @@ export function useSheetGestures({
       return;
     }
     if (offset > maxOffset + shortestDetentHeight * DISMISS_OVERSHOOT_RATIO) {
-      onDismissRef.current();
+      if (canDismissRef.current) {
+        onDismissRef.current();
+      } else {
+        settleAt(maxOffset);
+      }
       return;
     }
     // Settle to the nearest detent in the drag direction (never back past
     // the starting detent), de-duped and direction-clamped by the util.
     const target = resolveSettleOffset(offset, offsets, dir, baseOffset);
-    setSettledOffset(target);
-    onSnapRef.current?.(height - target);
-    // Keep the scrim in sync with the resting detent (faint floor at the peek).
-    const dismissOffset = maxOffset + shortestDetentHeight * DISMISS_OVERSHOOT_RATIO;
-    onScrimOpacityRef.current?.(scrimOpacityForOffset(target, offsets, dismissOffset));
-    // Haptic "tick" when landing on a different detent (where supported).
-    if (target !== baseOffset) {
-      hapticTick();
-    }
+    settleAt(target);
   }, [detentOffsets]);
   const beginDrag = useCallback((event, sheetHeight, startCoord) => {
     const target = event.currentTarget;
@@ -243,12 +293,27 @@ export function useSheetGestures({
     setIsDragging(true);
   }, [settledOffset]);
   const handlePointerDown = useCallback(event => {
+    if (event.button !== 0 || !event.isPrimary) {
+      return;
+    }
     // The handle has no native focus action. Prevent pointer-down from
     // moving focus off a form control on a tap; once the pointer actually
     // moves, BottomSheet dismisses the keyboard as sheet travel begins.
     event.preventDefault();
     beginDrag(event, measureHeight());
   }, [beginDrag, measureHeight]);
+  const handleContextMenu = useCallback(event => {
+    if (dragStateRef.current == null) {
+      return;
+    }
+    event.preventDefault();
+    cancelDrag(event.currentTarget);
+  }, [cancelDrag]);
+  const handleLostPointerCapture = useCallback(event => {
+    if (dragStateRef.current?.pointerId === event.pointerId) {
+      cancelDrag();
+    }
+  }, [cancelDrag]);
   const handlePointerMove = useCallback(event => {
     const state = dragStateRef.current;
     if (!state || state.pointerId !== event.pointerId) {
@@ -291,11 +356,11 @@ export function useSheetGestures({
       return;
     }
     const target = event.currentTarget;
-    target.releasePointerCapture?.(event.pointerId);
     const delta = event.clientY - state.startCoord;
     const offset = Math.max(0, state.baseOffset + delta);
     const dir = delta === 0 ? 0 : delta > 0 ? 1 : -1;
     dragStateRef.current = null;
+    target.releasePointerCapture?.(event.pointerId);
     setIsDragging(false);
     settleFromDrag(offset, state.velocity, state.height || 1, dir, Math.abs(delta), state.baseOffset);
   }, [settleFromDrag]);
@@ -305,6 +370,9 @@ export function useSheetGestures({
   // native pan starts.
   const armedBodyRef = useRef(null);
   const handleBodyPointerDown = useCallback(event => {
+    if (event.button !== 0 || !event.isPrimary) {
+      return;
+    }
     const scroller = event.currentTarget;
     if (scroller.scrollTop > 0) {
       armedBodyRef.current = null;
@@ -351,11 +419,13 @@ export function useSheetGestures({
   const touchDragRef = useRef(null);
   const previousTouchHandlersRef = useRef(null);
   const beginDragRef = useRef(beginDrag);
+  const cancelDragRef = useRef(cancelDrag);
   const pointerMoveRef = useRef(handlePointerMove);
   const endDragRef = useRef(endDrag);
   const measureHeightRef = useRef(measureHeight);
   useEffect(() => {
     beginDragRef.current = beginDrag;
+    cancelDragRef.current = cancelDrag;
     pointerMoveRef.current = handlePointerMove;
     endDragRef.current = endDrag;
     measureHeightRef.current = measureHeight;
@@ -431,11 +501,18 @@ export function useSheetGestures({
     };
     const onTouchEnd = event => {
       touchDragRef.current = null;
-      if (dragStateRef.current) {
-        const t = event.changedTouches[0];
-        if (t) {
-          endDragRef.current(asPointer(t, event.currentTarget));
-        }
+      const pointerId = dragStateRef.current?.pointerId;
+      if (pointerId == null) {
+        return;
+      }
+      const t = [...event.changedTouches].find(touch => touch.identifier === pointerId);
+      const target = event.currentTarget;
+      if (t) {
+        endDragRef.current(asPointer(t, target));
+      } else if (event.touches.length === 0) {
+        // Some interrupted multi-touch sequences omit the active touch from
+        // changedTouches. If no fingers remain, the drag cannot finish later.
+        cancelDragRef.current(target);
       }
     };
     const prev = bodyNodeRef.current;
@@ -486,18 +563,22 @@ export function useSheetGestures({
       touchAction: 'none',
       cursor: 'grab'
     },
+    onContextMenu: handleContextMenu,
+    onLostPointerCapture: handleLostPointerCapture,
     onPointerDown: handlePointerDown,
     onPointerMove: handlePointerMove,
     onPointerUp: endDrag,
     onPointerCancel: endDrag
-  }), [handlePointerDown, handlePointerMove, endDrag]);
+  }), [endDrag, handleContextMenu, handleLostPointerCapture, handlePointerDown, handlePointerMove]);
   const bodyProps = useMemo(() => ({
     ref: bodyRef,
+    onContextMenu: handleContextMenu,
+    onLostPointerCapture: handleLostPointerCapture,
     onPointerDown: handleBodyPointerDown,
     onPointerMove: handleBodyPointerMove,
     onPointerUp: handleBodyEnd,
     onPointerCancel: handleBodyEnd
-  }), [bodyRef, handleBodyPointerDown, handleBodyPointerMove, handleBodyEnd]);
+  }), [bodyRef, handleBodyEnd, handleBodyPointerDown, handleBodyPointerMove, handleContextMenu, handleLostPointerCapture]);
   return {
     sheetRef,
     contentProps,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astryxdesign/lab",
-  "version": "0.4.2-canary.b2057d1",
+  "version": "0.4.2-canary.bb07062",
   "description": "Experimental Astryx components — published to npm only under the @canary dist-tag for early testing; never released as a stable (latest) version.",
   "author": "Meta Open Source",
   "license": "MIT",
@@ -45,7 +45,7 @@
   },
   "peerDependencies": {
     "@stylexjs/stylex": ">=0.10.0",
-    "@astryxdesign/core": "0.4.2-canary.b2057d1",
+    "@astryxdesign/core": "0.4.2-canary.bb07062",
     "react": ">=19.0.0",
     "react-dom": ">=19.0.0"
   },
@@ -55,7 +55,7 @@
     "d3-shape": "^3.2.0"
   },
   "devDependencies": {
-    "@astryxdesign/cli": "0.4.2-canary.b2057d1",
+    "@astryxdesign/cli": "0.4.2-canary.bb07062",
     "@types/d3-array": "^3.2.2",
     "@types/d3-scale": "^4.0.9",
     "@types/d3-shape": "^3.1.8",