@patternmode/stacksheet 1.3.7 → 1.3.8

package/dist/Drag/drag-velocity.d.ts

@@ -0,0 +1,24 @@
+/** A single pointer sample recorded during a drag gesture. */
+export interface VelocitySample {
+    /** Drag offset in the dismiss direction (px) at sample time */
+    offset: number;
+    /** Timestamp in ms (Date.now()) */
+    time: number;
+}
+/** Sliding window (ms) of samples used to compute release velocity. */
+export declare const VELOCITY_WINDOW_MS = 100;
+/**
+ * Append a pointer sample, pruning entries that fall outside the sliding
+ * window (plus a hard cap as a memory guard). Mutates and returns `samples`.
+ */
+export declare const appendVelocitySample: (samples: VelocitySample[], sample: VelocitySample) => VelocitySample[];
+/**
+ * Compute release velocity (px/ms, positive = dismiss direction) from the
+ * samples recorded within the sliding window before `releaseTime`.
+ *
+ * Using only recent samples means a pause followed by a flick reports the
+ * flick's velocity — not the whole-gesture average, which would dilute it
+ * to near zero.
+ */
+export declare const getReleaseVelocity: (samples: VelocitySample[], releaseTime: number) => number;
+//# sourceMappingURL=drag-velocity.d.ts.map

package/dist/Drag/drag-velocity.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drag-velocity.d.ts","sourceRoot":"","sources":["../../src/Drag/drag-velocity.ts"],"names":[],"mappings":"AAAA,8DAA8D;AAC9D,MAAM,WAAW,cAAc;IAC7B,+DAA+D;IAC/D,MAAM,EAAE,MAAM,CAAC;IACf,mCAAmC;IACnC,IAAI,EAAE,MAAM,CAAC;CACd;AAED,uEAAuE;AACvE,eAAO,MAAM,kBAAkB,MAAM,CAAC;AAKtC;;;GAGG;AACH,eAAO,MAAM,oBAAoB,GAC/B,SAAS,cAAc,EAAE,EACzB,QAAQ,cAAc,KACrB,cAAc,EAOhB,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,kBAAkB,GAAI,SAAS,cAAc,EAAE,EAAE,aAAa,MAAM,KAAG,MASnF,CAAC"}

package/dist/Drag/use-drag.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-drag.d.ts","sourceRoot":"","sources":["../../src/Drag/use-drag.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAUvC,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAmI1D;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,OAAO,GAClB,UAAU,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,EAC1C,QAAQ,UAAU,EAClB,cAAc,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,SAyDzC,CAAC"}
+{"version":3,"file":"use-drag.d.ts","sourceRoot":"","sources":["../../src/Drag/use-drag.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAUvC,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAqJ1D;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,OAAO,GAClB,UAAU,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,EAC1C,QAAQ,UAAU,EAClB,cAAc,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,SAyDzC,CAAC"}

package/dist/SheetPanel/sheet-panel-focus.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sheet-panel-focus.d.ts","sourceRoot":"","sources":["../../src/SheetPanel/sheet-panel-focus.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAsClD,eAAO,MAAM,cAAc,GAAI,6CAK5B;IACD,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC3C,QAAQ,EAAE,SAAS,CAAC;CACrB,KAAG,SAyBH,CAAC"}
+{"version":3,"file":"sheet-panel-focus.d.ts","sourceRoot":"","sources":["../../src/SheetPanel/sheet-panel-focus.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAsClD,eAAO,MAAM,cAAc,GAAI,6CAK5B;IACD,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC3C,QAAQ,EAAE,SAAS,CAAC;CACrB,KAAG,SA2BH,CAAC"}

package/dist/SheetPanel/sheet-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sheet-panel.d.ts","sourceRoot":"","sources":["../../src/SheetPanel/sheet-panel.tsx"],"names":[],"mappings":"AA+BA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAqR3D,eAAO,MAAM,UAAU,GAAI,OAAO,eAAe,gCAiFhD,CAAC"}
+{"version":3,"file":"sheet-panel.d.ts","sourceRoot":"","sources":["../../src/SheetPanel/sheet-panel.tsx"],"names":[],"mappings":"AA+BA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAyT3D,eAAO,MAAM,UAAU,GAAI,OAAO,eAAe,gCAiFhD,CAAC"}

package/dist/SheetParts/sheet-title.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sheet-title.d.ts","sourceRoot":"","sources":["../../src/SheetParts/sheet-title.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEzD,eAAO,MAAM,UAAU,GAAI,yCAAyC,cAAc,gCAUjF,CAAC"}
+{"version":3,"file":"sheet-title.d.ts","sourceRoot":"","sources":["../../src/SheetParts/sheet-title.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEzD,eAAO,MAAM,UAAU,GAAI,yCAAyC,cAAc,gCAWjF,CAAC"}

package/dist/Store/store-args.d.ts

@@ -9,6 +9,12 @@ declare global {
 }
 export declare const toRecord: (value: unknown) => Record<string, unknown>;
 export declare const isComponent: (value: unknown) => value is AnyComponent;
+/**
+ * Generate a unique sheet id. `crypto.randomUUID` is only available in
+ * secure contexts, so fall back to a timestamp + random suffix on
+ * non-secure origins (e.g. plain-HTTP LAN dev servers).
+ */
+export declare const generateSheetId: () => string;
 export declare const getStringArg: (value: unknown, name: string) => string;
 export declare const resolvePresentationOptions: (value: unknown) => SheetPresentationOptions | undefined;
 /**

package/dist/Store/store-args.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"store-args.d.ts","sourceRoot":"","sources":["../../src/Store/store-args.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,UAAU,CAAC;AACzD,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAEhE,OAAO,CAAC,MAAM,CAAC;IACb,IAAI,OAAO,EACP,SAAS,GACT;QACE,GAAG,CAAC,EAAE;YACJ,QAAQ,CAAC,EAAE,MAAM,CAAC;SACnB,CAAC;KACH,CAAC;CACP;AAKD,eAAO,MAAM,QAAQ,GAAI,OAAO,OAAO,KAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAmC,CAAC;AAEpG,eAAO,MAAM,WAAW,GAAI,OAAO,OAAO,KAAG,KAAK,IAAI,YAA2C,CAAC;AASlG,eAAO,MAAM,YAAY,GAAI,OAAO,OAAO,EAAE,MAAM,MAAM,KAAG,MAK3D,CAAC;AAEF,eAAO,MAAM,0BAA0B,GACrC,OAAO,OAAO,KACb,wBAAwB,GAAG,SAS7B,CAAC;AACF;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,GAC9B,WAAW,YAAY,EACvB,mBAAmB,GAAG,CAAC,YAAY,EAAE,MAAM,CAAC,EAC5C,aAAa,GAAG,CAAC,MAAM,CAAC,KACvB,IAyBF,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAC5B,WAAW,YAAY,EACvB,mBAAmB,GAAG,CAAC,YAAY,EAAE,MAAM,CAAC,EAC5C,cAAc,GAAG,CAAC,MAAM,EAAE,YAAY,CAAC,EACvC,YAAY,MAAM,MAAM,EACxB,aAAa,GAAG,CAAC,MAAM,CAAC,KACvB,MAWF,CAAC;AACF;;;GAGG;AACH,eAAO,MAAM,WAAW,GACtB,mBAAmB,GAAG,CAAC,YAAY,EAAE,MAAM,CAAC,EAC5C,cAAc,GAAG,CAAC,MAAM,EAAE,YAAY,CAAC,EACvC,YAAY,MAAM,MAAM,EACxB,aAAa,GAAG,CAAC,MAAM,CAAC,EACxB,OAAO,OAAO,EACd,QAAQ,OAAO,EACf,OAAO,OAAO,EACd,SAAS,OAAO,KACf,YA8BF,CAAC"}
+{"version":3,"file":"store-args.d.ts","sourceRoot":"","sources":["../../src/Store/store-args.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,UAAU,CAAC;AACzD,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAEhE,OAAO,CAAC,MAAM,CAAC;IACb,IAAI,OAAO,EACP,SAAS,GACT;QACE,GAAG,CAAC,EAAE;YACJ,QAAQ,CAAC,EAAE,MAAM,CAAC;SACnB,CAAC;KACH,CAAC;CACP;AAKD,eAAO,MAAM,QAAQ,GAAI,OAAO,OAAO,KAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAmC,CAAC;AAEpG,eAAO,MAAM,WAAW,GAAI,OAAO,OAAO,KAAG,KAAK,IAAI,YAA2C,CAAC;AASlG;;;;GAIG;AACH,eAAO,MAAM,eAAe,QAAO,MAKlC,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,OAAO,OAAO,EAAE,MAAM,MAAM,KAAG,MAK3D,CAAC;AAEF,eAAO,MAAM,0BAA0B,GACrC,OAAO,OAAO,KACb,wBAAwB,GAAG,SAS7B,CAAC;AACF;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,GAC9B,WAAW,YAAY,EACvB,mBAAmB,GAAG,CAAC,YAAY,EAAE,MAAM,CAAC,EAC5C,aAAa,GAAG,CAAC,MAAM,CAAC,KACvB,IAyBF,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAC5B,WAAW,YAAY,EACvB,mBAAmB,GAAG,CAAC,YAAY,EAAE,MAAM,CAAC,EAC5C,cAAc,GAAG,CAAC,MAAM,EAAE,YAAY,CAAC,EACvC,YAAY,MAAM,MAAM,EACxB,aAAa,GAAG,CAAC,MAAM,CAAC,KACvB,MAWF,CAAC;AACF;;;GAGG;AACH,eAAO,MAAM,WAAW,GACtB,mBAAmB,GAAG,CAAC,YAAY,EAAE,MAAM,CAAC,EAC5C,cAAc,GAAG,CAAC,MAAM,EAAE,YAAY,CAAC,EACvC,YAAY,MAAM,MAAM,EACxB,aAAa,GAAG,CAAC,MAAM,CAAC,EACxB,OAAO,OAAO,EACd,QAAQ,OAAO,EACf,OAAO,OAAO,EACd,SAAS,OAAO,KACf,YA8BF,CAAC"}

package/dist/index.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { Portal } from "@radix-ui/react-portal";
-import { createContext, use, useEffect, useRef, useState, useSyncExternalStore } from "react";
+import { createContext, use, useCallback, useEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
 import { createStore, useStore } from "zustand";
 import { useShallow } from "zustand/react/shallow";
 import { springs as springs$1 } from "@howells/motion";
@@ -169,38 +169,50 @@ const useViewportHeight = (active) => {
 	}, []);
 	return active ? height ?? 0 : 0;
 };
+const BODY_SCALE_TRANSITION = "transform 500ms cubic-bezier(0.32, 0.72, 0, 1), border-radius 500ms cubic-bezier(0.32, 0.72, 0, 1)";
+/** Fallback delay (transition duration + margin) if `transitionend` never fires. */
+const BODY_SCALE_RESET_FALLBACK_MS = 600;
+/** Cancels a pending un-scale reset when the sheet reopens mid-animation. */
+let cancelPendingBodyScaleReset;
 const useBodyScale = (config, isOpen, prefersReducedMotion) => {
 	useEffect(() => {
 		const wrapper = document.querySelector("[data-stacksheet-wrapper]");
-		const resetWrapper = () => {
-			if (wrapper instanceof HTMLElement) {
-				wrapper.style.transform = "";
-				wrapper.style.borderRadius = "";
-				wrapper.style.transition = "";
-				wrapper.style.overflow = "";
-				wrapper.style.transformOrigin = "";
-			}
-		};
-		const canScale = config.shouldScaleBackground && !prefersReducedMotion && wrapper instanceof HTMLElement;
-		if (canScale && isOpen) {
-			const scale = config.scaleBackgroundAmount;
-			wrapper.style.transition = "transform 500ms cubic-bezier(0.32, 0.72, 0, 1), border-radius 500ms cubic-bezier(0.32, 0.72, 0, 1)";
-			wrapper.style.transform = `scale(${scale})`;
-			wrapper.style.borderRadius = "8px";
-			wrapper.style.overflow = "hidden";
-			wrapper.style.transformOrigin = "center top";
-			return resetWrapper;
-		}
-		const handleEnd = () => {
-			resetWrapper();
-		};
-		if (canScale) {
-			wrapper.style.transform = "";
-			wrapper.style.borderRadius = "";
-			wrapper.addEventListener("transitionend", handleEnd, { once: true });
+		const scalable = config.shouldScaleBackground && !prefersReducedMotion && wrapper instanceof HTMLElement && isOpen ? wrapper : null;
+		if (scalable !== null) {
+			cancelPendingBodyScaleReset?.();
+			scalable.style.transition = BODY_SCALE_TRANSITION;
+			scalable.style.transform = `scale(${config.scaleBackgroundAmount})`;
+			scalable.style.borderRadius = "8px";
+			scalable.style.overflow = "hidden";
+			scalable.style.transformOrigin = "center top";
 		}
 		return () => {
-			if (wrapper instanceof HTMLElement) wrapper.removeEventListener("transitionend", handleEnd);
+			if (scalable === null) return;
+			scalable.style.transition = BODY_SCALE_TRANSITION;
+			scalable.style.transform = "";
+			scalable.style.borderRadius = "";
+			const controller = new AbortController();
+			const { signal } = controller;
+			const finish = () => {
+				controller.abort();
+				cancelPendingBodyScaleReset = void 0;
+				scalable.style.transition = "";
+				scalable.style.overflow = "";
+				scalable.style.transformOrigin = "";
+			};
+			scalable.addEventListener("transitionend", (event) => {
+				if (event.target === scalable && event.propertyName === "transform") finish();
+			}, { signal });
+			const timeoutId = setTimeout(() => {
+				if (!signal.aborted) finish();
+			}, BODY_SCALE_RESET_FALLBACK_MS);
+			signal.addEventListener("abort", () => {
+				clearTimeout(timeoutId);
+			});
+			cancelPendingBodyScaleReset = () => {
+				controller.abort();
+				cancelPendingBodyScaleReset = void 0;
+			};
 		};
 	}, [
 		isOpen,
@@ -318,12 +330,13 @@ const resolveClassNames = (cn) => {
 		panel: cn.panel ?? ""
 	};
 };
-const buildAriaProps = (isTop, isModal, isComposable, ariaLabel, panelId, hasDescription) => {
+const buildAriaProps = ({ ariaLabel, hasDescription, hasTitle, isComposable, isModal, isTop, panelId }) => {
 	if (!isTop) return {};
 	const props = { role: "dialog" };
 	if (isModal) props["aria-modal"] = "true";
 	if (isComposable) {
-		props["aria-labelledby"] = `${panelId}-title`;
+		if (hasTitle) props["aria-labelledby"] = `${panelId}-title`;
+		else props["aria-label"] = ariaLabel;
 		if (hasDescription) props["aria-describedby"] = `${panelId}-desc`;
 	} else props["aria-label"] = ariaLabel;
 	return props;
@@ -504,12 +517,41 @@ const getPanelDimension = (panel, axis) => {
 	if (!panel) return 300;
 	return axis === "x" ? panel.offsetWidth : panel.offsetHeight;
 };
+/** Upper bound on retained samples — plenty for a 100ms window at 120Hz. */
+const MAX_SAMPLES = 20;
+/**
+* Append a pointer sample, pruning entries that fall outside the sliding
+* window (plus a hard cap as a memory guard). Mutates and returns `samples`.
+*/
+const appendVelocitySample = (samples, sample) => {
+	samples.push(sample);
+	const cutoff = sample.time - 100;
+	while (samples.length > MAX_SAMPLES || samples.length > 2 && (samples[0]?.time ?? 0) < cutoff) samples.shift();
+	return samples;
+};
+/**
+* Compute release velocity (px/ms, positive = dismiss direction) from the
+* samples recorded within the sliding window before `releaseTime`.
+*
+* Using only recent samples means a pause followed by a flick reports the
+* flick's velocity — not the whole-gesture average, which would dilute it
+* to near zero.
+*/
+const getReleaseVelocity = (samples, releaseTime) => {
+	const cutoff = releaseTime - 100;
+	const recent = samples.filter((sample) => sample.time >= cutoff);
+	const [first] = recent;
+	const last = recent.at(-1);
+	if (first === void 0 || last === void 0 || last.time <= first.time) return 0;
+	return (last.offset - first.offset) / (last.time - first.time);
+};
 //#endregion
 //#region src/Drag/use-drag.ts
-const resetDragRefs = ({ committedRef, offsetRef, scrollTargetRef, startRef }) => {
+const resetDragRefs = ({ committedRef, offsetRef, samplesRef, scrollTargetRef, startRef }) => {
 	startRef.current = null;
 	committedRef.current = null;
 	offsetRef.current = 0;
+	samplesRef.current = [];
 	scrollTargetRef.current = null;
 };
 const createDragHandlers = ({ axis, config, onDragUpdate, panelRef, refs, sign }) => {
@@ -524,13 +566,15 @@ const createDragHandlers = ({ axis, config, onDragUpdate, panelRef, refs, sign }
 		if (!isHandle && isInteractiveElement(target)) return;
 		refs.scrollTargetRef.current = isHandle ? null : findScrollableAncestor(target, axis);
 		refs.startRef.current = {
-			time: Date.now(),
 			x: e.clientX,
 			y: e.clientY
 		};
 		refs.committedRef.current = null;
 		refs.offsetRef.current = 0;
-		if (e.currentTarget instanceof HTMLElement) e.currentTarget.setPointerCapture(e.pointerId);
+		refs.samplesRef.current = [{
+			offset: 0,
+			time: Date.now()
+		}];
 	};
 	const handlePointerMove = (e) => {
 		if (refs.startRef.current === null) return;
@@ -544,11 +588,16 @@ const createDragHandlers = ({ axis, config, onDragUpdate, panelRef, refs, sign }
 				refs.startRef.current = null;
 				return;
 			}
+			if (e.currentTarget instanceof HTMLElement) e.currentTarget.setPointerCapture(e.pointerId);
 		}
 		if (refs.committedRef.current !== "drag") return;
 		const directional = (axis === "x" ? dx : dy) * sign;
 		const clampedOffset = directional >= 0 ? directional : -Math.sqrt(Math.abs(directional)) * RUBBER_BAND_FACTOR;
 		refs.offsetRef.current = clampedOffset;
+		appendVelocitySample(refs.samplesRef.current, {
+			offset: clampedOffset,
+			time: Date.now()
+		});
 		onDragUpdate({
 			isDragging: true,
 			offset: clampedOffset
@@ -561,8 +610,7 @@ const createDragHandlers = ({ axis, config, onDragUpdate, panelRef, refs, sign }
 			return;
 		}
 		const offset = Math.max(0, refs.offsetRef.current);
-		const elapsed = Date.now() - refs.startRef.current.time;
-		const velocity = elapsed > 0 ? offset / elapsed : 0;
+		const velocity = getReleaseVelocity(refs.samplesRef.current, Date.now());
 		resetDragRefs(refs);
 		const panelSize = getPanelDimension(panelRef.current, axis);
 		if (config.snapHeights.length > 0) {
@@ -619,6 +667,7 @@ const useDrag = (panelRef, config, onDragUpdate) => {
 	const startRef = useRef(null);
 	const committedRef = useRef(null);
 	const offsetRef = useRef(0);
+	const samplesRef = useRef([]);
 	const scrollTargetRef = useRef(null);
 	const { axis, sign } = getDismissAxis(config.side);
 	const { handlePointerCancel, handlePointerDown, handlePointerMove, handlePointerUp } = createDragHandlers({
@@ -629,6 +678,7 @@ const useDrag = (panelRef, config, onDragUpdate) => {
 		refs: {
 			committedRef,
 			offsetRef,
+			samplesRef,
 			scrollTargetRef,
 			startRef
 		},
@@ -896,7 +946,7 @@ const ModalFocusTrap = ({ enabled, active, fallbackRef, children }) => {
 				if (fallbackRef.current !== null) return fallbackRef.current;
 				return document.body;
 			},
-			initialFocus: false,
+			initialFocus: () => fallbackRef.current ?? void 0,
 			returnFocusOnDeactivate: true
 		},
 		paused,
@@ -969,14 +1019,16 @@ const getHeaderProps = ({ close, isNested, pop, side }) => ({
 	onClose: close,
 	side
 });
-const getPanelContext = ({ close, hasDescription, isNested, isTop, panelId, pop, registerDescription, side }) => ({
+const getPanelContext = ({ close, hasDescription, hasTitle, isNested, isTop, panelId, pop, registerDescription, registerTitle, side }) => ({
 	back: pop,
 	close,
 	hasDescription,
+	hasTitle,
 	isNested,
 	isTop,
 	panelId,
 	registerDescription,
+	registerTitle,
 	side
 });
 const getOptionalSideHandle = ({ isHovered, onDismiss, show, side }) => show ? /* @__PURE__ */ jsx(SideHandle, {
@@ -1024,24 +1076,45 @@ const useSheetPanelDrag = ({ activeSnapIndex, config, isNested, isTop, onSnap, p
 };
 const useSheetPanelContext = ({ close, isNested, isTop, pop, side }, panelId) => {
 	const [hasDescription, setHasDescription] = useState(false);
-	const registerDescription = () => {
+	const [hasTitle, setHasTitle] = useState(false);
+	const registerDescription = useCallback(() => {
 		setHasDescription(true);
 		return () => {
 			setHasDescription(false);
 		};
-	};
+	}, []);
+	const registerTitle = useCallback(() => {
+		setHasTitle(true);
+		return () => {
+			setHasTitle(false);
+		};
+	}, []);
 	return {
 		hasDescription,
-		panelContext: getPanelContext({
+		hasTitle,
+		panelContext: useMemo(() => getPanelContext({
 			close,
 			hasDescription,
+			hasTitle,
 			isNested,
 			isTop,
 			panelId,
 			pop,
 			registerDescription,
+			registerTitle,
 			side
-		})
+		}), [
+			close,
+			hasDescription,
+			hasTitle,
+			isNested,
+			isTop,
+			panelId,
+			pop,
+			registerDescription,
+			registerTitle,
+			side
+		])
 	};
 };
 const useSheetPanelModel = (props) => {
@@ -1055,7 +1128,7 @@ const useSheetPanelModel = (props) => {
 	const dragState = useSheetPanelDrag(props, panelRef);
 	const ariaLabel = getPanelAriaLabel(item, config.ariaLabel);
 	const panelId = `stacksheet-${item.id}`;
-	const { hasDescription, panelContext } = useSheetPanelContext(props, panelId);
+	const { hasDescription, hasTitle, panelContext } = useSheetPanelContext(props, panelId);
 	const isComposable = resolvePanelLayout(layout, renderHeader) === "composable";
 	const hasPanelClass = classNames.panel !== "";
 	const dragOffset = getDragTransform(side, dragState.offset);
@@ -1066,7 +1139,15 @@ const useSheetPanelModel = (props) => {
 		pop,
 		side
 	});
-	const ariaProps = buildAriaProps(isTop, config.modal, isComposable, ariaLabel, panelId, hasDescription);
+	const ariaProps = buildAriaProps({
+		ariaLabel,
+		hasDescription,
+		hasTitle,
+		isComposable,
+		isModal: config.modal,
+		isTop,
+		panelId
+	});
 	const transition = buildPanelTransition(dragState.isDragging, isTop, spring, stackSpring);
 	const animatedRadius = getAnimatedBorderRadius(side, depth, config.stacking);
 	const snapYOffset = computeSnapYOffset(side, snapHeights, activeSnapIndex, measuredHeight);
@@ -1275,15 +1356,14 @@ const useDismissalEffects = ({ closeReasonRef, config, isOpen, rawClose, rawPop,
 	useEffect(() => {
 		const shouldListen = isOpen && config.closeOnEscape && config.dismissible;
 		const handleKeyDown = (e) => {
-			if (e.key === "Escape") {
-				e.preventDefault();
-				dismissFromEscape({
-					closeReasonRef,
-					rawClose,
-					rawPop,
-					stackLengthRef
-				});
-			}
+			if (e.key !== "Escape" || e.defaultPrevented) return;
+			e.preventDefault();
+			dismissFromEscape({
+				closeReasonRef,
+				rawClose,
+				rawPop,
+				stackLengthRef
+			});
 		};
 		if (shouldListen) document.addEventListener("keydown", handleKeyDown);
 		return () => {
@@ -1299,7 +1379,7 @@ const useDismissalEffects = ({ closeReasonRef, config, isOpen, rawClose, rawPop,
 	]);
 	useEffect(() => {
 		const CloseWatcherConstructor = globalThis.CloseWatcher;
-		const shouldListen = isOpen && config.dismissible && CloseWatcherConstructor !== void 0;
+		const shouldListen = isOpen && config.closeOnEscape && config.dismissible && CloseWatcherConstructor !== void 0;
 		let watcher;
 		const handleClose = () => {
 			dismissFromEscape({
@@ -1321,6 +1401,7 @@ const useDismissalEffects = ({ closeReasonRef, config, isOpen, rawClose, rawPop,
 		};
 	}, [
 		isOpen,
+		config.closeOnEscape,
 		config.dismissible,
 		rawPop,
 		rawClose,
@@ -1438,6 +1519,15 @@ const getComponentName = (component) => {
 	return name === "" ? void 0 : name;
 };
 const getNodeEnv = () => globalThis.process?.env?.NODE_ENV;
+/**
+* Generate a unique sheet id. `crypto.randomUUID` is only available in
+* secure contexts, so fall back to a timestamp + random suffix on
+* non-secure origins (e.g. plain-HTTP LAN dev servers).
+*/
+const generateSheetId = () => {
+	if (typeof globalThis.crypto?.randomUUID === "function") return globalThis.crypto.randomUUID();
+	return `sheet-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 10)}`;
+};
 const getStringArg = (value, name) => {
 	if (typeof value !== "string") throw new TypeError(`Expected ${name} to be a string.`);
 	return value;
@@ -1489,7 +1579,7 @@ const resolveArgs = (componentRegistry, componentMap, getNextKey, warnedNames, f
 		return {
 			ariaLabel: resolvePresentationOptions(third)?.ariaLabel,
 			data: toRecord(second),
-			id: crypto.randomUUID(),
+			id: generateSheetId(),
 			type: typeKey
 		};
 	}
@@ -1889,7 +1979,8 @@ const SheetHeader = ({ asChild, className, style, children }) => {
 //#endregion
 //#region src/SheetParts/sheet-title.tsx
 const SheetTitle = ({ asChild, className, style, children }) => {
-	const { panelId } = useSheetPanel();
+	const { panelId, registerTitle } = useSheetPanel();
+	useEffect(() => registerTitle(), [registerTitle]);
 	const isAsChild = asChild === true;
 	return /* @__PURE__ */ jsx(isAsChild ? Slot : "h2", {
 		className: joinClassNames(isAsChild ? void 0 : "font-semibold text-sm", className),