@surdeddd/bottom-sheet 0.23.4 → 0.24.0

package/dist/core.js

@@ -2,6 +2,15 @@ var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 
+// src/core/primitives/shared.ts
+var STORE_KEY = /* @__PURE__ */ Symbol.for("@surdeddd/bottom-sheet/shared/1");
+function shared(name, init) {
+  const host = globalThis;
+  const store = host[STORE_KEY] ?? (host[STORE_KEY] = {});
+  if (!(name in store)) store[name] = init();
+  return store[name];
+}
+
 // src/core/lifecycle/sheet-stack.ts
 var BASE_Z = 100;
 var STEP = 10;
@@ -69,7 +78,7 @@ var SheetStack = class {
     });
   }
 };
-var sheetStack = new SheetStack();
+var sheetStack = shared("stack", () => new SheetStack());
 
 // src/core/primitives/transform.ts
 function buildTransformTemplate(axis) {
@@ -88,7 +97,7 @@ var offsetFromMatrix = (axis, m) => axis === "bottom" ? m.m42 : axis === "top" ?
 var layoutAxis = (axis) => axis === "left" || axis === "right" ? "width" : "height";
 
 // src/core/primitives/instance-id.ts
-var counters = {};
+var counters = shared("instanceIds", () => ({}));
 function nextInstanceId(prefix) {
   if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") {
     return `${prefix}-${crypto.randomUUID()}`;
@@ -116,7 +125,13 @@ function createEventBus() {
       const set = listeners.get(event);
       if (!set) return;
       for (const fn of [...set]) {
-        fn(payload);
+        try {
+          fn(payload);
+        } catch (err) {
+          queueMicrotask(() => {
+            throw err;
+          });
+        }
       }
     },
     listenerCount(event) {
@@ -128,8 +143,23 @@ function createEventBus() {
   };
 }
 
+// src/core/primitives/dev-warn.ts
+function devWarn(...args) {
+  if (typeof process !== "undefined" && process.env && process.env.NODE_ENV !== "production" && typeof console !== "undefined") {
+    console.warn(...args);
+  }
+}
+
 // src/core/primitives/css-length.ts
 var probe = null;
+var rejected = /* @__PURE__ */ new Set();
+var warnRejected = (value) => {
+  if (rejected.has(value)) return;
+  rejected.add(value);
+  devWarn(
+    `[BottomSheet] snap size "${value}" is not a CSS length the browser accepts \u2014 it resolves to 0.`
+  );
+};
 var PROBE_ATTR = "data-bs-probe";
 var ensureProbe = (axis) => {
   if (typeof document === "undefined") return null;
@@ -176,19 +206,14 @@ var resolveSnap = (point, mode, measureFit) => {
   if (!el) return 0;
   if (axis === "vertical") {
     el.style.height = point;
+    if (el.style.height === "") warnRejected(point);
     return Math.max(0, el.getBoundingClientRect().height);
   }
   el.style.width = point;
+  if (el.style.width === "") warnRejected(point);
   return Math.max(0, el.getBoundingClientRect().width);
 };
 
-// src/core/primitives/dev-warn.ts
-function devWarn(...args) {
-  if (typeof process !== "undefined" && process.env && process.env.NODE_ENV !== "production" && typeof console !== "undefined") {
-    console.warn(...args);
-  }
-}
-
 // src/core/primitives/snap-points.ts
 var resolveSnapList = (points, mode, measureFit) => points.map((p) => {
   const raw = resolveSnap(p.size, mode, measureFit);
@@ -317,6 +342,7 @@ var SnapResolver = class {
   setMode(mode) {
     if (mode === this.mode) return;
     this.mode = mode;
+    this.notified = false;
     this.recompute();
   }
   setAllowedIds(ids) {
@@ -326,14 +352,20 @@ var SnapResolver = class {
   findById(id) {
     return findById(id, this.resolved);
   }
-  findDragSettleTarget(args) {
+  findDragSettleTarget(args, openOnly = false) {
     return findDragSettleTarget({
       ...args,
       resolved: this.resolved,
-      allowed: this.allowedIds,
+      allowed: this.pool(openOnly),
       maxAxisSize: this.maxAxisSize
     });
   }
+  nearest(size, openOnly) {
+    return findNearest(size, this.resolved, this.pool(openOnly));
+  }
+  pool(openOnly) {
+    return openOnly ? this.allowedIds.filter((id) => (this.findById(id)?.size ?? 0) > 0) : this.allowedIds;
+  }
   getAllowedRange() {
     return this.rangeCache ?? (this.rangeCache = allowedRange(this.resolved, this.allowedIds));
   }
@@ -381,19 +413,20 @@ var POINTER_EVENTS_OPACITY_THRESHOLD = 0.05;
 var RANGE_DIVISION_EPSILON = 1e-4;
 
 // src/core/features/resize-observer.ts
+var seatOf = (deps) => {
+  const snap = deps.resolveActiveSnap();
+  const max = deps.getMaxAxisSize();
+  return { target: snap ? Math.min(snap.size, max) : null, max };
+};
+var sameSeat = (before, after) => before.target !== null && after.target !== null && Math.abs(after.target - before.target) < SIZE_WRITE_EPSILON && Math.abs(after.max - before.max) < SIZE_WRITE_EPSILON;
 function installResizeObserver(deps) {
   if (typeof window === "undefined") {
     return () => {
     };
   }
-  const seatFor = () => {
-    const snap = deps.resolveActiveSnap();
-    const max = deps.getMaxAxisSize();
-    return { target: snap ? Math.min(snap.size, max) : null, max };
-  };
   const onResize = () => {
     if (deps.isDestroyed()) return;
-    const before = seatFor();
+    const before = seatOf(deps);
     deps.recomputeSnaps();
     const mode = deps.getMode();
     const isVerticalAxis = mode === "bottom" || mode === "top";
@@ -402,21 +435,8 @@ function installResizeObserver(deps) {
     if (viewportSize2 > 0 && viewportSize2 < max) {
       deps.setMaxAxisSize(viewportSize2);
     }
-    const after = seatFor();
-    if (before.target !== null && after.target !== null && Math.abs(after.target - before.target) < SIZE_WRITE_EPSILON && Math.abs(after.max - before.max) < SIZE_WRITE_EPSILON) {
-      return;
-    }
-    const wasAnimating = deps.isAnimating?.() ?? false;
-    deps.cancelInFlight();
-    deps.newCycle();
-    const current = deps.resolveActiveSnap();
-    const newMax = deps.getMaxAxisSize();
-    const targetSize = current ? Math.min(current.size, newMax) : Math.min(deps.getSize(), newMax);
-    deps.setSize(targetSize);
-    if (current && !deps.isDragging()) {
-      deps.applySize(targetSize);
-      if (wasAnimating) deps.resyncAfterCancel?.();
-    }
+    if (sameSeat(before, seatOf(deps))) return;
+    deps.reseat();
   };
   let resizeObserver = null;
   if (typeof ResizeObserver !== "undefined") {
@@ -428,7 +448,7 @@ function installResizeObserver(deps) {
   window.addEventListener("orientationchange", onResize);
   const onVisibility = () => {
     if (deps.isDestroyed()) return;
-    if (document.hidden) deps.cancelInFlight();
+    if (document.hidden) deps.landNow();
   };
   document.addEventListener("visibilitychange", onVisibility);
   return () => {
@@ -453,6 +473,16 @@ var contentTargets = (scroller) => {
   }
   return out;
 };
+var chromeTargets = (deps) => {
+  const out = [];
+  for (const child of Array.from(deps.element.children)) {
+    if (child !== deps.scrollContainer) out.push(child);
+  }
+  if (deps.handle !== deps.element && !out.includes(deps.handle)) {
+    out.push(deps.handle);
+  }
+  return out;
+};
 function installFitObserver(deps) {
   if (typeof ResizeObserver === "undefined") return () => {
   };
@@ -468,7 +498,6 @@ function installFitObserver(deps) {
     });
   };
   const ro = new ResizeObserver(schedule);
-  ro.observe(deps.handle);
   const scroller = deps.scrollContainer;
   const observed = /* @__PURE__ */ new Set();
   const slots = /* @__PURE__ */ new Set();
@@ -485,7 +514,7 @@ function installFitObserver(deps) {
   };
   const resync = () => {
     trackSlots();
-    const targets = contentTargets(scroller);
+    const targets = [...chromeTargets(deps), ...contentTargets(scroller)];
     for (const el of observed) {
       if (!targets.includes(el)) {
         ro.unobserve(el);
@@ -500,13 +529,12 @@ function installFitObserver(deps) {
     }
     schedule();
   };
+  resync();
   let mo;
-  if (scroller) {
-    resync();
-    if (typeof MutationObserver !== "undefined") {
-      mo = new MutationObserver(resync);
-      mo.observe(scroller, { childList: true });
-    }
+  if (typeof MutationObserver !== "undefined") {
+    mo = new MutationObserver(resync);
+    mo.observe(deps.element, { childList: true });
+    if (scroller) mo.observe(scroller, { childList: true });
   }
   return () => {
     ro.disconnect();
@@ -518,6 +546,10 @@ function installFitObserver(deps) {
   };
 }
 
+// src/core/features/teleport.ts
+var homes = /* @__PURE__ */ new WeakMap();
+var homeRootOf = (root) => (root && homes.get(root)) ?? null;
+
 // src/core/features/max-height-controller.ts
 function createMaxHeightController(deps) {
   let maxHeightCap;
@@ -621,8 +653,9 @@ function installSliderKeyboard(deps) {
   const isVerticalAxis = deps.mode === "bottom" || deps.mode === "top";
   const stepUp = isVerticalAxis ? "ArrowUp" : "ArrowRight";
   const stepDown = isVerticalAxis ? "ArrowDown" : "ArrowLeft";
-  const sheetExpandsKey = deps.mode === "top" ? stepDown : stepUp;
-  const sheetCollapsesKey = deps.mode === "top" ? stepUp : stepDown;
+  const flipped = deps.mode === "top" || deps.mode === "right";
+  const sheetExpandsKey = flipped ? stepDown : stepUp;
+  const sheetCollapsesKey = flipped ? stepUp : stepDown;
   const onHandleKey = (e) => {
     if (deps.isDestroyed()) return;
     const allowed = deps.getAllowedIds();
@@ -698,11 +731,12 @@ var WriteSentinel = class {
 // src/core/primitives/overlay-position.ts
 function resolveSheetAnchoredStyle(mode, position, inset) {
   const sizeOffset = `calc(var(--bs-size, 0px) + ${inset})`;
+  const lifted = `calc(var(--bs-size, 0px) + var(--bs-keyboard-inset, 0px) + ${inset})`;
   switch (mode) {
     case "bottom":
-      if (position === "sheet-top-left") return { bottom: sizeOffset, left: inset };
-      if (position === "sheet-top-right") return { bottom: sizeOffset, right: inset };
-      return { bottom: sizeOffset, left: "50%", transform: "translateX(-50%)" };
+      if (position === "sheet-top-left") return { bottom: lifted, left: inset };
+      if (position === "sheet-top-right") return { bottom: lifted, right: inset };
+      return { bottom: lifted, left: "50%", transform: "translateX(-50%)" };
     case "top":
       if (position === "sheet-top-left") return { top: sizeOffset, left: inset };
       if (position === "sheet-top-right") return { top: sizeOffset, right: inset };
@@ -717,6 +751,13 @@ function resolveSheetAnchoredStyle(mode, position, inset) {
       return { right: sizeOffset, top: "50%", transform: "translateY(-50%)" };
   }
 }
+function resetOverlayPosition(ws) {
+  ws.top = "";
+  ws.bottom = "";
+  ws.left = "";
+  ws.right = "";
+  ws.transform = "";
+}
 function applyOverlayPosition(ws, mode, position, inset) {
   switch (position) {
     case "top-left":
@@ -777,6 +818,8 @@ function applyOverlayPosition(ws, mode, position, inset) {
 // src/core/controllers/scrim-controller.ts
 var VALID_CSS_LENGTH = /^-?\d+(?:\.\d+)?(?:px|em|rem|%)$/;
 var DEFAULT_SCRIM_DIM = "rgba(0, 0, 0, 0.4)";
+var BACKDROP_COLOR_VAR = "--bs-backdrop-color";
+var unit = (value) => Number.isFinite(value) ? Math.min(Math.max(value, 0), 1) : 1;
 var ScrimController = class {
   constructor(deps, opts) {
     __publicField(this, "screenComponent");
@@ -791,11 +834,13 @@ var ScrimController = class {
     __publicField(this, "scrimMode");
     __publicField(this, "backdropRange");
     __publicField(this, "screenRange");
+    __publicField(this, "backdropPeak");
     __publicField(this, "scrimEnabled", true);
     __publicField(this, "savedScrimRanges", null);
     __publicField(this, "scrimTapToCloseEnabled", false);
     __publicField(this, "detachScrimTap", null);
     __publicField(this, "scrimOverlayTeardown", null);
+    __publicField(this, "placeOverlay", null);
     __publicField(this, "backdropOpacitySentinel", new WriteSentinel());
     __publicField(this, "screenOpacitySentinel", new WriteSentinel());
     __publicField(this, "lastBackdropPointer", "");
@@ -812,6 +857,8 @@ var ScrimController = class {
     const preset = opts.scrimPreset ? SCRIM_PRESETS[opts.scrimPreset] : null;
     this.backdropRange = opts.backdropRange ?? preset?.range ?? [0, 1];
     this.screenRange = opts.screenRange ?? preset?.range ?? [0, 1];
+    this.backdropPeak = unit(opts.backdropOpacity ?? 1);
+    this.setBackdropColor(opts.backdropColor);
     this.scrimTapToCloseEnabled = opts.scrimTapToClose ?? false;
     const explicitColor = opts.scrimColor ?? preset?.color;
     const effectiveColor = explicitColor ?? (this.scrimMode !== "off" && !this.backdrop ? DEFAULT_SCRIM_DIM : void 0);
@@ -841,24 +888,19 @@ var ScrimController = class {
       this.setScrimTapToClose(true);
     }
   }
-  applyOpacity(progress, progressChanged) {
-    if (!progressChanged && this.backdropOpacitySentinel.value !== -1 && this.screenOpacitySentinel.value !== -1) {
+  applyOpacity(progress, progressChanged, epsilon = OPACITY_WRITE_EPSILON) {
+    if (epsilon > 0 && !progressChanged && this.backdropOpacitySentinel.value !== -1 && this.screenOpacitySentinel.value !== -1) {
       return;
     }
     if (this.backdrop) {
       const [s, e] = this.backdropRange;
       const range = Math.max(e - s, RANGE_DIVISION_EPSILON);
-      const backdropOpacity = Math.min(
-        Math.max((progress - s) / range, 0),
-        1
-      );
-      if (this.backdropOpacitySentinel.shouldWrite(
-        backdropOpacity,
-        OPACITY_WRITE_EPSILON
-      )) {
+      const along = Math.min(Math.max((progress - s) / range, 0), 1);
+      const backdropOpacity = along * this.backdropPeak;
+      if (this.backdropOpacitySentinel.shouldWrite(backdropOpacity, epsilon)) {
         this.backdrop.style.opacity = String(backdropOpacity);
       }
-      const nextPointer = backdropOpacity > POINTER_EVENTS_OPACITY_THRESHOLD ? "auto" : "none";
+      const nextPointer = along > POINTER_EVENTS_OPACITY_THRESHOLD ? "auto" : "none";
       if (nextPointer !== this.lastBackdropPointer) {
         this.backdrop.style.pointerEvents = nextPointer;
         this.lastBackdropPointer = nextPointer;
@@ -873,10 +915,7 @@ var ScrimController = class {
           (progress - ss) / Math.max(RANGE_DIVISION_EPSILON, se - ss)
         )
       );
-      if (this.screenOpacitySentinel.shouldWrite(
-        screenOpacity,
-        OPACITY_WRITE_EPSILON
-      )) {
+      if (this.screenOpacitySentinel.shouldWrite(screenOpacity, epsilon)) {
         this.screenComponent.style.opacity = String(screenOpacity);
       }
       const nextDisplay = screenOpacity > 0 ? "" : "none";
@@ -892,6 +931,17 @@ var ScrimController = class {
     this.invalidateOpacityCache();
     applySize();
   }
+  setBackdropColor(color) {
+    if (this.isDestroyed() || !this.backdrop) return;
+    if (color) this.backdrop.style.setProperty(BACKDROP_COLOR_VAR, color);
+    else this.backdrop.style.removeProperty(BACKDROP_COLOR_VAR);
+  }
+  setBackdropOpacity(value, applySize) {
+    if (this.isDestroyed()) return;
+    this.backdropPeak = unit(value);
+    this.invalidateOpacityCache();
+    applySize();
+  }
   setScreenRange(range, applySize) {
     if (this.isDestroyed()) return;
     this.screenRange = range;
@@ -914,6 +964,8 @@ var ScrimController = class {
     if (this.isDestroyed() || mode === this.mode) return;
     this.mode = mode;
     this.invalidateOpacityCache();
+    if (this.scrimMode === "above-sheet") this.applyAboveSheetInset();
+    this.placeOverlay?.();
   }
   setScrimMode(mode, applySize) {
     if (this.isDestroyed()) return;
@@ -926,7 +978,7 @@ var ScrimController = class {
       if (previous === "above-sheet" && mode !== "above-sheet") {
         s.position = "";
         s.inset = "";
-        s.pointerEvents = "";
+        this.syncPointer();
       }
       if (mode === "above-sheet") {
         this.applyAboveSheetInset();
@@ -951,9 +1003,6 @@ var ScrimController = class {
     if (enabled === installed) return;
     if (enabled) {
       const target = this.screenComponent;
-      if (target.style.pointerEvents === "none") {
-        target.style.pointerEvents = "auto";
-      }
       const onClick = () => {
         if (this.isDestroyed()) return;
         if (this.closeFn) {
@@ -976,6 +1025,11 @@ var ScrimController = class {
       this.detachScrimTap = null;
       this.scrimTapToCloseEnabled = false;
     }
+    this.syncPointer();
+  }
+  syncPointer() {
+    if (!this.screenComponent) return;
+    this.screenComponent.style.pointerEvents = this.scrimInteractive || this.detachScrimTap ? "auto" : "none";
   }
   setScrimEnabled(enabled, applySize) {
     if (this.isDestroyed()) return;
@@ -1059,8 +1113,12 @@ var ScrimController = class {
     const wrapper = screen.ownerDocument.createElement("div");
     wrapper.className = "bs-scrim-overlay";
     const ws = wrapper.style;
-    ws.position = "absolute";
-    applyOverlayPosition(ws, this.mode, position, inset);
+    ws.position = "fixed";
+    const place = () => {
+      resetOverlayPosition(ws);
+      applyOverlayPosition(ws, this.mode, position, inset);
+    };
+    place();
     if (interactive) {
       ws.pointerEvents = "auto";
     }
@@ -1074,8 +1132,10 @@ var ScrimController = class {
       };
     }
     host.appendChild(wrapper);
+    this.placeOverlay = place;
     const teardown = () => {
       if (wrapper.parentNode) wrapper.parentNode.removeChild(wrapper);
+      if (this.placeOverlay === place) this.placeOverlay = null;
       if (this.scrimOverlayTeardown === teardown) {
         this.scrimOverlayTeardown = null;
       }
@@ -1099,6 +1159,7 @@ var ScrimController = class {
     if (this.backdrop) {
       this.backdrop.style.opacity = "";
       this.backdrop.style.pointerEvents = "";
+      this.backdrop.style.removeProperty(BACKDROP_COLOR_VAR);
     }
     this.invalidateOpacityCache();
     this.lastBackdropPointer = "";
@@ -1123,13 +1184,13 @@ var ScrimController = class {
     }
     if (opts.interactive !== void 0) {
       this.scrimInteractive = opts.interactive;
-      s.pointerEvents = opts.interactive ? "auto" : "none";
+      this.syncPointer();
     }
   }
   applyAboveSheetInset() {
     if (!this.screenComponent) return;
     const insetByMode = {
-      bottom: "0 0 var(--bs-size) 0",
+      bottom: "0 0 calc(var(--bs-size) + var(--bs-keyboard-inset, 0px)) 0",
       top: "var(--bs-size) 0 0 0",
       left: "0 0 0 var(--bs-size)",
       right: "0 var(--bs-size) 0 0"
@@ -1137,7 +1198,7 @@ var ScrimController = class {
     const s = this.screenComponent.style;
     s.position = "fixed";
     s.inset = insetByMode[this.mode];
-    s.pointerEvents = this.scrimInteractive || this.scrimTapToCloseEnabled ? "auto" : "none";
+    this.syncPointer();
   }
 };
 
@@ -1150,6 +1211,7 @@ var easeOutBack = (t) => {
 var easeOutCubic = (t) => 1 - Math.pow(1 - t, 3);
 var easeLinear = (t) => t;
 var easeOutQuint = (t) => 1 - Math.pow(1 - t, 5);
+var MIN_RETARGET_MS = 120;
 var tween = ({
   from,
   to,
@@ -1158,12 +1220,18 @@ var tween = ({
   onUpdate
 }) => {
   let cancelled = false;
+  let finished = false;
   let rafId = 0;
   let resolveFn = null;
-  const start = performance.now();
+  let start = performance.now();
+  let origin = from;
+  let target = to;
+  let span = duration;
+  let last = from;
   const promise = new Promise((resolve) => {
     resolveFn = resolve;
     if (duration <= 0) {
+      finished = true;
       onUpdate(to);
       resolve();
       return;
@@ -1171,12 +1239,13 @@ var tween = ({
     const step = (now) => {
       if (cancelled) return;
       const elapsed = Math.max(0, now - start);
-      const t = Math.min(elapsed / duration, 1);
-      const value = from + (to - from) * easing(t);
-      onUpdate(value);
+      const t = Math.min(elapsed / span, 1);
+      last = origin + (target - origin) * easing(t);
+      onUpdate(last);
       if (t < 1) {
         rafId = requestAnimationFrame(step);
       } else {
+        finished = true;
         resolve();
       }
     };
@@ -1188,6 +1257,15 @@ var tween = ({
       cancelAnimationFrame(rafId);
       resolveFn?.();
     },
+    retarget: (next) => {
+      if (cancelled || finished || next === target) return;
+      const now = performance.now();
+      const remaining = span - Math.max(0, now - start);
+      origin = last;
+      target = next;
+      start = now;
+      span = Math.max(remaining, MIN_RETARGET_MS);
+    },
     promise
   };
 };
@@ -1205,22 +1283,32 @@ var DEFAULT_SPRING = {
   restSpeed: 0.5
 };
 var MAX_DT = 1 / 30;
+var MAX_DURATION_MS = 3e3;
 var runSpring = ({
   from,
   to,
   velocity = 0,
   config,
+  maxDuration = MAX_DURATION_MS,
   onUpdate
 }) => {
   const cfg = { ...DEFAULT_SPRING, ...config };
   let cancelled = false;
+  let finished = false;
   let rafId = 0;
   let resolveFn = null;
   let x = from;
   let v = velocity;
+  let target = to;
   let lastTime = performance.now();
+  let deadline = lastTime + maxDuration;
   const promise = new Promise((resolve) => {
     resolveFn = resolve;
+    const land = () => {
+      finished = true;
+      onUpdate(target, 0);
+      resolve();
+    };
     const step = (now) => {
       if (cancelled) return;
       const dt = Math.min(Math.max(0, now - lastTime) / 1e3, MAX_DT);
@@ -1229,21 +1317,19 @@ var runSpring = ({
       const subDt = dt / steps;
       let stepsLeft = steps;
       while (stepsLeft-- > 0) {
-        const force = -cfg.stiffness * (x - to) - cfg.damping * v;
+        const force = -cfg.stiffness * (x - target) - cfg.damping * v;
         const accel = force / cfg.mass;
         v += accel * subDt;
         x += v * subDt;
       }
-      if (!Number.isFinite(x) || !Number.isFinite(v)) {
-        onUpdate(to, 0);
-        resolve();
+      if (!Number.isFinite(x) || !Number.isFinite(v) || lastTime >= deadline) {
+        land();
         return;
       }
       onUpdate(x, v);
-      const isAtRest = Math.abs(to - x) < (cfg.restDelta ?? 0.5) && Math.abs(v) < (cfg.restSpeed ?? 0.5);
+      const isAtRest = Math.abs(target - x) < (cfg.restDelta ?? 0.5) && Math.abs(v) < (cfg.restSpeed ?? 0.5);
       if (isAtRest) {
-        onUpdate(to, 0);
-        resolve();
+        land();
       } else {
         rafId = requestAnimationFrame(step);
       }
@@ -1256,6 +1342,11 @@ var runSpring = ({
       cancelAnimationFrame(rafId);
       resolveFn?.();
     },
+    retarget: (next) => {
+      if (cancelled || finished) return;
+      target = next;
+      deadline = performance.now() + maxDuration;
+    },
     promise
   };
 };
@@ -1407,21 +1498,40 @@ var AnimationRunner = class {
     this.applySizeFn(size);
   }
   cancel() {
-    this.currentTween?.cancel();
-    this.currentSpring?.cancel();
+    const tween2 = this.currentTween;
+    const spring = this.currentSpring;
+    this.currentTween = null;
+    this.currentSpring = null;
+    tween2?.cancel();
+    spring?.cancel();
     this.cancelWaapi();
   }
+  retarget(target) {
+    if (this.currentSpring) {
+      this.currentSpring.retarget(target);
+      return true;
+    }
+    if (this.currentTween) {
+      this.currentTween.retarget(target);
+      return true;
+    }
+    if (this.currentWaapi) {
+      this.currentWaapi.retarget(target);
+      return true;
+    }
+    return false;
+  }
   async animateTo(target, velocityPxPerMs) {
     if (target === this.getSize()) {
-      if (!this.isAnimating && !this.isDragging()) {
+      if (this.isAnimating) this.cancel();
+      if (!this.isDragging()) {
         this.applySizeFn(target);
+        this.getRootEl()?.removeAttribute("data-animating");
         this.element.style.willChange = "";
       }
       return;
     }
-    this.currentTween?.cancel();
-    this.currentSpring?.cancel();
-    this.cancelWaapi();
+    this.cancel();
     this.getRootEl()?.setAttribute("data-animating", "true");
     this.element.style.willChange = "transform";
     if (this.reducedMotion) {
@@ -1431,19 +1541,13 @@ var AnimationRunner = class {
       return;
     }
     if (this.settleWaapi && this.applyAux && this.getTransformFor && typeof this.element.animate === "function") {
-      const samples = this.animationKind === "spring" ? sampleSpringSettle(
+      const samples = this.sampleSettle(
         this.getSize(),
         target,
-        velocityPxPerMs * VELOCITY_PX_PER_S,
-        this.springConfig
-      ) : sampleTweenSettle(
-        this.getSize(),
-        target,
-        this.duration,
-        this.easing
+        velocityPxPerMs * VELOCITY_PX_PER_S
       );
       if (samples.values.length >= 2 && samples.durationMs > 0) {
-        await this.runWaapiSettle(samples, target);
+        await this.runWaapiSettle({ samples, target });
         if (!this.isAnimating) {
           this.getRootEl()?.removeAttribute("data-animating");
           if (!this.isDragging()) this.element.style.willChange = "";
@@ -1485,7 +1589,10 @@ var AnimationRunner = class {
       }
     }
   }
-  async runWaapiSettle(samples, target) {
+  sampleSettle(from, to, velocityPxPerS) {
+    return this.animationKind === "spring" ? sampleSpringSettle(from, to, velocityPxPerS, this.springConfig) : sampleTweenSettle(from, to, this.duration, this.easing);
+  }
+  startWaapiLeg(samples, onRetarget) {
     const applyAux = this.applyAux;
     const getTransformFor = this.getTransformFor;
     const frames = samples.values.map((v) => ({
@@ -1500,16 +1607,20 @@ var AnimationRunner = class {
     let stopped = false;
     let auxRaf = 0;
     const lastIdx = samples.values.length - 1;
+    const cursor = () => Math.min((Number(anim.currentTime) || 0) / samples.stepMs, lastIdx);
     const sizeNow = () => {
-      const at = Math.min(
-        (Number(anim.currentTime) || 0) / samples.stepMs,
-        lastIdx
-      );
+      const at = cursor();
       const idx = Math.floor(at);
       const from = samples.values[idx];
       const to = samples.values[Math.min(idx + 1, lastIdx)];
       return from + (to - from) * (at - idx);
     };
+    const velocityNow = () => {
+      const idx = Math.min(Math.floor(cursor()), Math.max(lastIdx - 1, 0));
+      const from = samples.values[idx];
+      const to = samples.values[Math.min(idx + 1, lastIdx)];
+      return (to - from) / samples.stepMs * 1e3;
+    };
     const auxTick = () => {
       if (stopped) return;
       applyAux(sizeNow());
@@ -1522,22 +1633,55 @@ var AnimationRunner = class {
         stopped = true;
         cancelAnimationFrame(auxRaf);
       },
-      sizeNow
+      sizeNow,
+      velocityNow,
+      retarget: (to) => onRetarget(entry, to)
     };
-    this.currentWaapi = entry;
-    try {
-      await anim.finished;
-    } catch {
-    }
-    entry.stop();
-    const wasCurrent = this.currentWaapi === entry;
-    if (wasCurrent) this.currentWaapi = null;
-    if (wasCurrent && anim.playState === "finished") {
-      this.applySizeFn(target);
+    return entry;
+  }
+  async runWaapiSettle(first) {
+    let leg = first;
+    for (; ; ) {
+      let queued = null;
+      const entry = this.startWaapiLeg(leg.samples, (running, to) => {
+        const size = this.readShownSize?.() ?? running.sizeNow();
+        queued = {
+          samples: this.sampleSettle(size, to, running.velocityNow()),
+          target: to
+        };
+        running.stop();
+        try {
+          running.anim.cancel();
+        } catch {
+        }
+        this.applySizeFn(size);
+      });
+      this.currentWaapi = entry;
       try {
-        anim.cancel();
+        await entry.anim.finished;
       } catch {
       }
+      entry.stop();
+      const wasCurrent = this.currentWaapi === entry;
+      const next = queued;
+      if (wasCurrent && next) {
+        if (next.samples.values.length >= 2 && next.samples.durationMs > 0) {
+          leg = next;
+          continue;
+        }
+        this.currentWaapi = null;
+        this.applySizeFn(next.target);
+        return;
+      }
+      if (wasCurrent) this.currentWaapi = null;
+      if (wasCurrent && entry.anim.playState === "finished") {
+        this.applySizeFn(leg.target);
+        try {
+          entry.anim.cancel();
+        } catch {
+        }
+      }
+      return;
     }
   }
   destroy() {
@@ -1592,27 +1736,51 @@ var collectFocusables = (root) => {
 var focusables = (root) => collectFocusables(root).filter(
   (el) => !el.hasAttribute("inert") && isVisible(el) && !el.matches("[aria-hidden='true']")
 );
+var findDeep = (root, selector) => {
+  const direct = root.querySelector(selector);
+  if (direct || typeof HTMLSlotElement === "undefined") return direct;
+  for (const slot of Array.from(root.querySelectorAll("slot"))) {
+    for (const assigned of slot.assignedElements()) {
+      if (assigned.matches(selector)) return assigned;
+      const inner = findDeep(assigned, selector);
+      if (inner) return inner;
+    }
+  }
+  return null;
+};
+var FOCUS_ALLOW_ATTR = "data-bs-focus-allow";
+var composedParent = (node) => {
+  const slot = node.assignedSlot;
+  if (slot) return slot;
+  const parent = node.parentNode;
+  return parent instanceof ShadowRoot ? parent.host : parent;
+};
 var containsComposed = (container, node) => {
-  let n = node;
-  while (n) {
+  for (let n = node; n; n = composedParent(n)) {
     if (n === container) return true;
-    const slot = n.assignedSlot;
-    if (slot) {
-      n = slot;
-      continue;
-    }
-    const parent = n.parentNode;
-    n = parent instanceof ShadowRoot ? parent.host : parent;
   }
   return false;
 };
-var trapStack = [];
+var isAllowedOutside = (node) => {
+  for (let n = node; n; n = composedParent(n)) {
+    if (n instanceof Element && n.hasAttribute(FOCUS_ALLOW_ATTR)) return true;
+  }
+  return false;
+};
+var deepActiveElement = () => {
+  let active = document.activeElement;
+  while (active?.shadowRoot?.activeElement) {
+    active = active.shadowRoot.activeElement;
+  }
+  return active;
+};
+var trapStack = shared("focusTraps", () => []);
 var installFocusTrap = (container, options = {}) => {
   if (typeof document === "undefined") return () => {
   };
   const token = {};
-  trapStack.push(token);
-  const isActive = () => trapStack[trapStack.length - 1] === token;
+  if (!options.isActive) trapStack.push(token);
+  const isActive = options.isActive ?? (() => trapStack[trapStack.length - 1] === token);
   const previouslyFocused = document.activeElement;
   const focusInitial = () => {
     const spec = options.initialFocus;
@@ -1621,10 +1789,11 @@ var installFocusTrap = (container, options = {}) => {
       container.focus({ preventScroll: true });
       return;
     }
-    const initial = typeof spec === "string" ? container.querySelector(spec) : spec ?? focusables(container)[0] ?? container;
+    const initial = typeof spec === "string" ? findDeep(container, spec) : spec ?? focusables(container)[0] ?? container;
     initial?.focus({ preventScroll: true });
   };
-  focusInitial();
+  if (!containsComposed(container, deepActiveElement())) focusInitial();
+  let backwards = false;
   const handleKey = (e) => {
     if (!isActive()) return;
     if (e.key === "Escape" && options.onEscape) {
@@ -1632,6 +1801,10 @@ var installFocusTrap = (container, options = {}) => {
       return;
     }
     if (e.key !== "Tab") return;
+    backwards = e.shiftKey;
+    setTimeout(() => {
+      backwards = false;
+    }, 0);
     const list = focusables(container);
     if (list.length === 0) {
       e.preventDefault();
@@ -1639,7 +1812,7 @@ var installFocusTrap = (container, options = {}) => {
     }
     const first = list[0];
     const last = list[list.length - 1];
-    const active = document.activeElement;
+    const active = deepActiveElement();
     if (e.shiftKey && active === first) {
       e.preventDefault();
       last.focus();
@@ -1650,11 +1823,11 @@ var installFocusTrap = (container, options = {}) => {
   };
   const handleFocusIn = (e) => {
     if (!isActive()) return;
-    const target = e.target;
-    if (target && !containsComposed(container, target)) {
-      const list = focusables(container);
-      list[0]?.focus({ preventScroll: true });
-    }
+    const target = e.composedPath()[0] ?? e.target;
+    if (!target || containsComposed(container, target)) return;
+    if (isAllowedOutside(target)) return;
+    const list = focusables(container);
+    list[backwards ? list.length - 1 : 0]?.focus({ preventScroll: true });
   };
   document.addEventListener("keydown", handleKey, true);
   document.addEventListener("focusin", handleFocusIn, true);
@@ -1676,21 +1849,25 @@ var installFocusTrap = (container, options = {}) => {
 };
 
 // src/core/lifecycle/scroll-lock.ts
-var lockCount = 0;
-var savedStyles = null;
+var state = shared("scrollLock", () => ({
+  count: 0,
+  saved: null
+}));
 var lockBodyScroll = () => {
   if (typeof document === "undefined") return () => {
   };
-  if (lockCount === 0) {
+  if (state.count === 0) {
     const body = document.body;
-    savedStyles = {
+    const saved = {
       overflow: body.style.overflow,
       position: body.style.position,
       top: body.style.top,
       width: body.style.width,
       paddingRight: body.style.paddingRight,
+      scrollX: window.scrollX,
       scrollY: window.scrollY
     };
+    state.saved = saved;
     const scrollbarGap = window.innerWidth - document.documentElement.clientWidth;
     if (scrollbarGap > 0) {
       const current = parseFloat(getComputedStyle(body).paddingRight) || 0;
@@ -1698,53 +1875,72 @@ var lockBodyScroll = () => {
     }
     body.style.overflow = "hidden";
     body.style.position = "fixed";
-    body.style.top = `-${savedStyles.scrollY}px`;
+    body.style.top = `-${saved.scrollY}px`;
     body.style.width = "100%";
   }
-  lockCount++;
+  state.count++;
   let released = false;
   return () => {
     if (released) return;
     released = true;
-    lockCount = Math.max(0, lockCount - 1);
-    if (lockCount === 0 && savedStyles) {
+    state.count = Math.max(0, state.count - 1);
+    if (state.count === 0 && state.saved) {
       const body = document.body;
-      body.style.overflow = savedStyles.overflow;
-      body.style.position = savedStyles.position;
-      body.style.top = savedStyles.top;
-      body.style.width = savedStyles.width;
-      body.style.paddingRight = savedStyles.paddingRight;
-      window.scrollTo(0, savedStyles.scrollY);
-      savedStyles = null;
+      const saved = state.saved;
+      body.style.overflow = saved.overflow;
+      body.style.position = saved.position;
+      body.style.top = saved.top;
+      body.style.width = saved.width;
+      body.style.paddingRight = saved.paddingRight;
+      window.scrollTo({
+        top: saved.scrollY,
+        left: saved.scrollX,
+        behavior: "instant"
+      });
+      state.saved = null;
     }
   };
 };
 
 // src/core/features/inert-siblings.ts
+var OWN_ROOTS = ".bs-root, .ovl-root";
+var LAYER_CLASSES = [
+  "bs-backdrop",
+  "bs-screen",
+  "bs-root",
+  "ovl-backdrop",
+  "ovl-root"
+];
+var isLayer = (el) => LAYER_CLASSES.some((name) => el.classList.contains(name));
 function createInertSiblings(rootProvider) {
   const tracked = [];
+  const remove = () => {
+    for (const el of tracked) el.removeAttribute("inert");
+    tracked.length = 0;
+  };
   return {
     apply() {
       if (typeof document === "undefined") return;
-      let top = rootProvider();
-      while (top.parentElement && top.parentElement !== document.body) {
-        top = top.parentElement;
-      }
-      const parent = top.parentElement ?? document.body;
-      for (const child of Array.from(parent.children)) {
-        if (child === top) continue;
-        if (child.hasAttribute("inert")) continue;
-        if (child.classList.contains("bs-backdrop") || child.classList.contains("bs-screen") || child.classList.contains("bs-root")) {
+      remove();
+      const surface = rootProvider();
+      let node = surface.closest(OWN_ROOTS) ?? surface;
+      while (node && node !== document.body) {
+        const parent = node.parentElement;
+        if (!parent) {
+          const root = node.getRootNode();
+          node = typeof ShadowRoot !== "undefined" && root instanceof ShadowRoot ? root.host : null;
           continue;
         }
-        child.setAttribute("inert", "");
-        tracked.push(child);
+        for (const sibling of Array.from(parent.children)) {
+          if (sibling === node) continue;
+          if (sibling.hasAttribute("inert") || isLayer(sibling)) continue;
+          sibling.setAttribute("inert", "");
+          tracked.push(sibling);
+        }
+        node = parent;
       }
     },
-    remove() {
-      for (const el of tracked) el.removeAttribute("inert");
-      tracked.length = 0;
-    }
+    remove
   };
 }
 
@@ -1752,6 +1948,7 @@ function createInertSiblings(rootProvider) {
 var LifecycleController = class {
   constructor(deps, opts) {
     __publicField(this, "element");
+    __publicField(this, "isTop");
     __publicField(this, "focusTrapEnabled");
     __publicField(this, "initialFocus");
     __publicField(this, "closeOnEscape");
@@ -1765,6 +1962,7 @@ var LifecycleController = class {
     __publicField(this, "installed", false);
     __publicField(this, "destroyed", false);
     this.element = deps.element;
+    this.isTop = deps.isTop;
     this.focusTrapEnabled = opts.focusTrap ?? false;
     this.initialFocus = opts.initialFocus;
     this.closeOnEscape = opts.closeOnEscape ?? true;
@@ -1785,12 +1983,17 @@ var LifecycleController = class {
     }
     if (this.focusTrapEnabled && !this.releaseFocusTrap) {
       this.releaseFocusTrap = installFocusTrap(this.element, {
-        initialFocus: this.initialFocus
+        initialFocus: this.initialFocus,
+        isActive: this.isTop
       });
     }
-    if (this.inertSiblingsEnabled && this.shouldApplyInertSiblings()) {
-      this.inertSiblings.apply();
-    }
+    this.syncTop();
+  }
+  syncTop() {
+    if (!this.installed || !this.inertSiblingsEnabled) return;
+    if (!this.shouldApplyInertSiblings()) return;
+    if (this.isTop?.() ?? true) this.inertSiblings.apply();
+    else this.inertSiblings.remove();
   }
   setReturnFocus(target) {
     if (this.destroyed) return;
@@ -1960,10 +2163,14 @@ var installGestures = (handle, mode, callbacks, options = {}) => {
     if (wasPending) return;
     callbacks.onCancel?.();
   };
+  const onLostCapture = (e) => {
+    if (e.target === handle) onPointerCancel(e);
+  };
   handle.addEventListener("pointerdown", onPointerDown);
   handle.addEventListener("pointermove", onPointerMove);
   handle.addEventListener("pointerup", finishGesture);
   handle.addEventListener("pointercancel", onPointerCancel);
+  handle.addEventListener("lostpointercapture", onLostCapture);
   const managesTouchAction = options.manageTouchAction !== false;
   const prevTouchAction = handle.style.touchAction;
   if (managesTouchAction) {
@@ -1974,6 +2181,7 @@ var installGestures = (handle, mode, callbacks, options = {}) => {
     handle.removeEventListener("pointermove", onPointerMove);
     handle.removeEventListener("pointerup", finishGesture);
     handle.removeEventListener("pointercancel", onPointerCancel);
+    handle.removeEventListener("lostpointercapture", onLostCapture);
     if (managesTouchAction) handle.style.touchAction = prevTouchAction;
     if (activePointerId !== null && handle.hasPointerCapture(activePointerId)) {
       handle.releasePointerCapture(activePointerId);
@@ -2090,8 +2298,7 @@ var GestureController = class {
           size: this.deps.getDragContext().size,
           velocity: 0
         });
-        const restoreTo = this.dragStartSize;
-        void this.deps.animateTo(restoreTo, 0);
+        this.deps.restoreAfterDrag();
       }
     }, this.deps.gestureOptions);
     return this.detach;
@@ -2208,22 +2415,24 @@ function createScrollCache(deps) {
     return size < max / 2;
   };
   return {
-    cache(fromId, prevSize, nextSize) {
+    leave(fromId, prevSize, nextSize) {
       const container = deps.scrollContainer;
       if (!container) return;
-      if (isSmallSize(prevSize)) return;
-      if (!isSmallSize(nextSize)) return;
+      if (nextSize <= 0) {
+        positions.clear();
+        return;
+      }
+      if (isSmallSize(prevSize) || !isSmallSize(nextSize)) return;
       positions.set(fromId, container.scrollTop);
     },
-    restore(toId, prevSize, nextSize) {
+    enter(toId, prevSize, nextSize) {
       const container = deps.scrollContainer;
       if (!container) return;
-      if (isSmallSize(nextSize)) return;
-      if (!isSmallSize(prevSize)) return;
+      if (isSmallSize(nextSize) || !isSmallSize(prevSize)) return;
       const cached = positions.get(toId);
       if (cached === void 0) return;
-      container.scrollTop = cached;
       positions.delete(toId);
+      container.scrollTop = cached;
     },
     clear() {
       positions.clear();
@@ -2337,17 +2546,18 @@ function attachAnchor(deps, opts) {
   const isDock = position === "dock-bottom" || position === "dock-top";
   const ws = wrapper.style;
   ws.position = "fixed";
-  if (isDock) {
+  const place = () => {
+    resetOverlayPosition(ws);
+    if (!isDock) {
+      applyOverlayPosition(ws, deps.getMode(), position, opts.inset ?? "16px");
+      return;
+    }
     ws.left = "0";
     ws.right = "0";
-    if (position === "dock-bottom") {
-      ws.bottom = "0";
-    } else {
-      ws.top = "0";
-    }
-  } else {
-    applyOverlayPosition(ws, deps.mode, position, opts.inset ?? "16px");
-  }
+    if (position === "dock-bottom") ws.bottom = "0";
+    else ws.top = "0";
+  };
+  place();
   if (opts.fadeRange) {
     const [r0, r1] = opts.fadeRange;
     const span = Math.max(r1 - r0, 1e-4);
@@ -2357,10 +2567,10 @@ function attachAnchor(deps, opts) {
   deps.host.appendChild(wrapper);
   let visible = null;
   let inFlight = null;
-  const shouldShow = (state) => {
-    if (typeof opts.showOn === "function") return opts.showOn(state);
-    if (Array.isArray(opts.showOn)) return opts.showOn.includes(state.activeId);
-    return isDock || state.size > 0;
+  const shouldShow = (state2) => {
+    if (typeof opts.showOn === "function") return opts.showOn(state2);
+    if (Array.isArray(opts.showOn)) return opts.showOn.includes(state2.activeId);
+    return isDock || state2.size > 0;
   };
   const applyVisibility = (next, animate) => {
     if (next === visible) return;
@@ -2407,7 +2617,8 @@ function attachAnchor(deps, opts) {
     },
     syncZ: (z) => {
       wrapper.style.zIndex = String(z);
-    }
+    },
+    reposition: place
   };
 }
 
@@ -2427,26 +2638,33 @@ function installScrimStages(deps, opts) {
     const wrapper = doc.createElement("div");
     wrapper.className = "bs-scrim-stage";
     const ws = wrapper.style;
-    ws.position = "absolute";
-    applyOverlayPosition(
-      ws,
-      deps.mode,
-      def.position ?? opts.position ?? "center",
-      def.inset ?? opts.inset ?? "16px"
-    );
+    ws.position = "fixed";
     ws.visibility = "hidden";
     ws.pointerEvents = "none";
     wrapper.appendChild(def.element);
     deps.host.appendChild(wrapper);
     return { def, wrapper, inFlight: null };
   });
+  const place = () => {
+    for (const entry of entries) {
+      const ws = entry.wrapper.style;
+      resetOverlayPosition(ws);
+      applyOverlayPosition(
+        ws,
+        deps.getMode(),
+        entry.def.position ?? opts.position ?? "center",
+        entry.def.inset ?? opts.inset ?? "16px"
+      );
+    }
+  };
+  place();
   let active = null;
   const resolveActive = () => {
-    const state = deps.getState();
-    if (state.size === 0) {
-      return entries.find((e) => matchesId(e.def, state.activeId)) ?? null;
+    const state2 = deps.getState();
+    if (state2.size === 0) {
+      return entries.find((e) => matchesId(e.def, state2.activeId)) ?? null;
     }
-    return entries.find((e) => matchesId(e.def, state.activeId)) ?? entries.find((e) => matchesRange(e.def, state.progress)) ?? null;
+    return entries.find((e) => matchesId(e.def, state2.activeId)) ?? entries.find((e) => matchesRange(e.def, state2.progress)) ?? null;
   };
   const hide = (entry, animate) => {
     entry.inFlight?.cancel();
@@ -2499,16 +2717,19 @@ function installScrimStages(deps, opts) {
     offs.push(deps.on("progress", () => update(true)));
   }
   update(false);
-  return () => {
-    offs.forEach((off) => off());
-    for (const entry of entries) {
-      entry.inFlight?.cancel();
-      entry.inFlight = null;
-      if (entry.wrapper.parentNode) {
-        entry.wrapper.parentNode.removeChild(entry.wrapper);
+  return {
+    reposition: place,
+    detach: () => {
+      offs.forEach((off) => off());
+      for (const entry of entries) {
+        entry.inFlight?.cancel();
+        entry.inFlight = null;
+        if (entry.wrapper.parentNode) {
+          entry.wrapper.parentNode.removeChild(entry.wrapper);
+        }
       }
+      active = null;
     }
-    active = null;
   };
 }
 
@@ -2544,11 +2765,13 @@ function resolveEngineOptions(opts, extras) {
       scrimMode: opts.scrimMode,
       scrimColor: opts.scrimColor,
       scrimBlur: opts.scrimBlur,
-      scrimInteractive: opts.scrimInteractive ?? (opts.scrimTapToClose ? true : void 0),
+      scrimInteractive: opts.scrimInteractive,
       scrimTapToClose: opts.scrimTapToClose,
       scrimPreset: opts.scrimPreset,
       screenRange: opts.screenRange,
-      backdropRange: opts.backdropRange
+      backdropRange: opts.backdropRange,
+      backdropOpacity: opts.backdropOpacity,
+      backdropColor: opts.backdropColor
     },
     animation: {
       animation: opts.animation,
@@ -2627,6 +2850,7 @@ var BottomSheetCore = class {
     __publicField(this, "fitContentToSnap");
     __publicField(this, "settleAnimation");
     __publicField(this, "persistent");
+    __publicField(this, "keyboardInset", 0);
     __publicField(this, "disableCloseFlag");
     __publicField(this, "disableDragFlag");
     __publicField(this, "closeOnRouteChange");
@@ -2641,6 +2865,7 @@ var BottomSheetCore = class {
     __publicField(this, "detachSheetGesture", null);
     __publicField(this, "detachSliderKeyboard", null);
     __publicField(this, "rootEl", null);
+    __publicField(this, "homeRoot", null);
     __publicField(this, "destroyed", false);
     __publicField(this, "restClosed", false);
     __publicField(this, "currentViewTransition", null);
@@ -2648,8 +2873,13 @@ var BottomSheetCore = class {
     __publicField(this, "sizeWriteSentinel", new WriteSentinel());
     __publicField(this, "progressWriteSentinel", new WriteSentinel());
     __publicField(this, "isTopSheet", true);
-    __publicField(this, "opening", false);
-    __publicField(this, "promotedForOpen", false);
+    __publicField(this, "phase", "closed");
+    __publicField(this, "transition", null);
+    __publicField(this, "inFlight", null);
+    __publicField(this, "outbox", []);
+    __publicField(this, "flushing", false);
+    __publicField(this, "openPending", false);
+    __publicField(this, "settleHolds", []);
     __publicField(this, "allowOvershoot", false);
     __publicField(this, "progressPayload", {
       value: 0,
@@ -2670,6 +2900,7 @@ var BottomSheetCore = class {
     __publicField(this, "anchorHost", null);
     __publicField(this, "stackZ", 100);
     __publicField(this, "detachScrimStages", null);
+    __publicField(this, "placeScrimStages", null);
     __publicField(this, "stackEffectEnabled", false);
     __publicField(this, "stackEffectPrimed", false);
     __publicField(this, "fitDeps");
@@ -2677,13 +2908,7 @@ var BottomSheetCore = class {
     __publicField(this, "featureList", []);
     __publicField(this, "featureCtx");
     const resolved = resolveEngineOptions(opts, {
-      shouldApplyInertSiblings: () => {
-        if (typeof document === "undefined") return false;
-        const bodyChildren = Array.from(document.body.children);
-        return bodyChildren.some(
-          (c) => c === opts.element || c.contains(opts.element)
-        );
-      }
+      shouldApplyInertSiblings: () => opts.element.isConnected
     });
     this.element = opts.element;
     this.handle = opts.handle ?? opts.element;
@@ -2712,7 +2937,6 @@ var BottomSheetCore = class {
           void this.snapTo(id);
         },
         close: () => {
-          if (!this.canDismiss()) return;
           void this.close("backdrop");
         }
       },
@@ -2742,7 +2966,8 @@ var BottomSheetCore = class {
     this.lifecycle = new LifecycleController(
       {
         element: this.element,
-        close: () => this.close()
+        close: () => this.close(),
+        isTop: () => this.isTopSheet
       },
       resolved.lifecycle
     );
@@ -2769,6 +2994,7 @@ var BottomSheetCore = class {
     auditVhUsage(this.snapPointsRaw);
     this.auditDuplicateSnapIds(this.snapPointsRaw);
     this.rootEl = this.element.closest(".bs-root");
+    this.homeRoot = homeRootOf(this.rootEl);
     this.maxHeightDeps = {
       element: this.element,
       mode: this.mode,
@@ -2796,7 +3022,9 @@ var BottomSheetCore = class {
     );
     const initial = this.snaps.findById(this.activeId);
     if (initial) this.size = initial.size;
+    this.phase = this.size > 0 ? "open" : "closed";
     this.applySize(this.size);
+    this.restClosed = this.element.getAttribute("data-bs-rest") === "closed";
     this.setRestClosed(this.size === 0);
     this.updateAriaSlider();
     this.scrollCache = createScrollCache({
@@ -2811,8 +3039,7 @@ var BottomSheetCore = class {
         for (const entry of entries) {
           if (!entry.isIntersecting) continue;
           if (this.destroyed) return;
-          this.snaps.recompute();
-          this.healActiveSnap();
+          this.recompute();
           io.disconnect();
           return;
         }
@@ -2822,6 +3049,7 @@ var BottomSheetCore = class {
     }
     this.teardowns.add(
       installFitObserver({
+        element: this.element,
         handle: this.handle,
         scrollContainer: this.scrollContainer,
         hasFitSnap: () => this.snapPointsRaw.some(
@@ -2837,9 +3065,7 @@ var BottomSheetCore = class {
     this.applyAutoAriaLabelledBy();
     this.runFeatureStage("post");
     this.warnOrphanFeatureOptions();
-    if (this.size > 0) {
-      this.handleOpen();
-    }
+    if (this.phase === "open") this.installLifecycle(true);
   }
   buildFeatureContext(autoCollapseAfter) {
     return {
@@ -2867,21 +3093,27 @@ var BottomSheetCore = class {
       getMaxAxisSize: () => this.snaps.getMaxAxisSize(),
       resolveSnap: (id) => this.snaps.findById(id),
       resolveActiveSnap: () => this.snaps.findById(this.activeId),
+      getPhase: () => this.phase,
       setSize: (size) => {
         this.size = size;
       },
       setMaxAxisSize: (size) => {
         this.snaps.setMaxAxisSize(size);
       },
+      setKeyboardInset: (px) => this.setKeyboardInset(px),
       applySize: (size) => this.applySize(size),
       recomputeSnaps: () => this.recomputeSnaps(),
+      reseat: () => this.reseat(),
+      holdSettle: (settled) => {
+        this.settleHolds.push(settled);
+      },
       newCycle: () => {
         this.newCycle();
       },
-      cancelInFlight: () => {
-        this.animation.cancel();
+      cancelInFlight: () => this.suspend(),
+      resyncAfterResize: () => {
+        if (!this.destroyed) this.land(false);
       },
-      resyncAfterResize: () => this.resyncAfterResize(),
       snapTo: (id) => {
         void this.snapTo(id);
       },
@@ -2920,8 +3152,9 @@ var BottomSheetCore = class {
     return {
       size: this.size,
       activeId: this.activeId,
+      phase: this.phase,
       isDragging: this.isDraggingAny(),
-      isAnimating: this.animation.isAnimating,
+      isAnimating: this.animation.isAnimating || this.currentViewTransition !== null,
       progress: this.computeProgress(this.size)
     };
   }
@@ -2975,49 +3208,53 @@ var BottomSheetCore = class {
   getResolvedSnaps() {
     return this.snaps.getResolvedSnaps();
   }
-  async snapTo(id, velocityOrOpts = 0, _skipBeforeSnap = false) {
-    if (this.destroyed) return;
+  snapTo(id, velocityOrOpts = 0, _skipBeforeSnap = false) {
     const opts = typeof velocityOrOpts === "object" ? velocityOrOpts : { velocity: velocityOrOpts };
-    const velocityPxPerMs = opts.velocity ?? 0;
-    const externalSignal = opts.signal;
-    if (externalSignal?.aborted) return;
+    return this.transitionTo(
+      id,
+      opts.velocity ?? 0,
+      _skipBeforeSnap,
+      opts.signal
+    );
+  }
+  transitionTo(id, velocityPxPerMs = 0, skipBeforeSnap = false, externalSignal) {
+    if (this.destroyed || externalSignal?.aborted) return Promise.resolve();
     const target = this.snaps.findById(id);
     if (!target) {
       devWarn(`[BottomSheet] unknown snap id: ${id}`);
-      return;
+      return Promise.resolve();
     }
     if (!this.snaps.getAllowedIds().includes(id)) {
       devWarn(`[BottomSheet] snap "${id}" is not in allowed list`);
-      return;
-    }
-    if (!_skipBeforeSnap && this.emitBeforeSnap(target, this.activeId)) {
-      return;
-    }
-    const resumingOpen = this.opening;
-    const signal = this.newCycle();
-    const onExternalAbort = () => {
-      this.animation.cancel();
-      this.newCycle();
-    };
+      return Promise.resolve();
+    }
+    if (target.size === 0 && this.closingBlocked()) return Promise.resolve();
+    if (!externalSignal && this.inFlight?.id === id) return this.inFlight.done;
+    if (!skipBeforeSnap && this.emitBeforeSnap(target, this.activeId)) {
+      return Promise.resolve();
+    }
+    const flight = { id, done: Promise.resolve() };
+    flight.done = this.runTransition(
+      target,
+      velocityPxPerMs,
+      false,
+      externalSignal,
+      flight
+    );
+    return flight.done;
+  }
+  async runTransition(target, velocityPxPerMs, fromDrag, externalSignal, flight = null) {
+    const signal = this.beginTransition(target);
+    const transition = this.transition;
+    if (signal.aborted || !transition) return;
+    this.inFlight = flight;
+    const onExternalAbort = () => this.suspend();
     externalSignal?.addEventListener("abort", onExternalAbort, { once: true });
-    const wasClosed = this.size === 0 || resumingOpen;
-    const previousId = this.activeId;
-    const previousSize = this.size;
-    this.scrollCache.cache(previousId, previousSize, target.size);
-    this.activeId = id;
-    const rawTargetSize = this.snapPointsRaw.find((p) => p.id === id)?.size;
-    const opensToRest = id === "closed" || rawTargetSize === 0;
-    if (wasClosed && !opensToRest) {
-      this.opening = true;
-      if (!resumingOpen) {
-        this.promotedForOpen = true;
-        sheetStack.promote(this.id);
-      }
-    }
-    if (this.animation.viewTransitionsAvailable) {
+    this.allowOvershoot = fromDrag;
+    if (!fromDrag && this.animation.viewTransitionsAvailable) {
       this.currentViewTransition?.skipTransition?.();
       const vt = document.startViewTransition(() => {
-        this.applySize(target.size);
+        if (!signal.aborted) this.applySize(transition.size);
       });
       vt.ready?.catch(() => {
       });
@@ -3028,25 +3265,202 @@ var BottomSheetCore = class {
       }
       if (this.currentViewTransition === vt) this.currentViewTransition = null;
     } else {
-      await this.animation.animateTo(target.size, velocityPxPerMs);
+      await this.animation.animateTo(transition.size, velocityPxPerMs);
     }
     externalSignal?.removeEventListener("abort", onExternalAbort);
     if (signal.aborted) return;
-    this.opening = false;
-    this.completeSnap(id, target.size, previousSize, wasClosed, false);
+    if (this.size !== transition.size) this.applySize(transition.size);
+    this.land(fromDrag);
+    if (this.settleHolds.length > 0) {
+      await Promise.allSettled(this.settleHolds.splice(0));
+    }
+  }
+  beginTransition(target) {
+    const signal = this.newCycle();
+    const cap = this.snaps.getMaxAxisSize();
+    const fromId = this.activeId;
+    const fromSize = this.snaps.findById(fromId)?.size ?? this.size;
+    this.scrollCache.leave(fromId, fromSize, target.size);
+    this.scrollCache.enter(target.id, fromSize, target.size);
+    this.activeId = target.id;
+    this.transition = {
+      size: cap > 0 ? Math.min(target.size, cap) : target.size,
+      cap
+    };
+    if (target.size > 0) {
+      this.enterOpening(target.id);
+    } else {
+      if (this.phase === "closed" && !this.isClosedSnap(target.id)) {
+        sheetStack.promote(this.id);
+      }
+      this.enterClosing();
+    }
+    this.flush();
+    return signal;
+  }
+  enterOpening(id) {
+    if (this.phase === "open" || this.phase === "opening") return;
+    const fresh = this.phase === "closed";
+    this.phase = "opening";
+    this.setRestClosed(false);
+    if (!this.installLifecycle(fresh)) return;
+    this.post("open", { id });
+    this.outbox.push(() => {
+      if (this.phase !== "closed") {
+        notifyLinkedSheets(this.linkedSheets, this);
+      }
+    });
   }
-  completeSnap(id, targetSize, previousSize, wasClosed, withHaptic) {
-    this.scrollCache.restore(id, previousSize, targetSize);
+  enterClosing() {
+    if (this.phase === "closed" || this.phase === "closing") return;
+    this.phase = "closing";
+    this.post("close", void 0);
+  }
+  settlePhase(heal) {
+    if (this.size > 0) {
+      this.enterOpening(this.activeId);
+      if (this.phase === "opening") {
+        this.phase = "open";
+        this.post("opened", { id: this.activeId });
+      }
+      return;
+    }
+    if (heal && this.phase !== "closing") return;
+    this.enterClosing();
+    if (this.phase === "closing") {
+      this.phase = "closed";
+      this.setRestClosed(true);
+      this.lifecycle.release();
+      sheetStack.update();
+      this.post("closed", void 0);
+    }
+  }
+  land(haptic) {
+    this.transition = null;
+    this.inFlight = null;
+    this.allowOvershoot = false;
+    this.openPending = this.size === 0 && !this.isClosedSnap(this.activeId);
     this.updateAriaSlider();
-    this.emit("snap", {
-      id,
+    this.setRestClosed(this.size === 0);
+    this.post("snap", {
+      id: this.activeId,
       size: this.size,
       progress: this.computeProgress(this.size)
     });
-    if (withHaptic) this.haptic();
-    this.setRestClosed(targetSize === 0);
-    if (wasClosed && targetSize > 0) this.emitOpenSequence(id);
-    if (targetSize === 0) this.emitCloseSequence();
+    this.settlePhase(false);
+    if (haptic) this.haptic();
+    this.flush();
+  }
+  suspend() {
+    this.animation.cancel();
+    this.currentViewTransition?.skipTransition?.();
+    this.newCycle();
+  }
+  landNow() {
+    const transition = this.transition;
+    if (this.destroyed || !transition || this.isDraggingAny()) return;
+    this.animation.cancel();
+    this.currentViewTransition?.skipTransition?.();
+    this.newCycle();
+    this.applySize(transition.size);
+    this.land(false);
+  }
+  reseat() {
+    if (this.destroyed || this.isDraggingAny()) return;
+    const active = this.snaps.findById(this.activeId);
+    if (!active) return;
+    const cap = this.snaps.getMaxAxisSize();
+    const target = cap > 0 ? Math.min(active.size, cap) : active.size;
+    this.updateAriaSlider();
+    const transition = this.transition;
+    if (transition) {
+      if (Math.abs(target - transition.size) < SIZE_WRITE_EPSILON && Math.abs(cap - transition.cap) < SIZE_WRITE_EPSILON) {
+        return;
+      }
+      transition.size = target;
+      transition.cap = cap;
+      this.applySize(this.animation.retarget(target) ? this.size : target);
+      return;
+    }
+    if (this.openPending && target > 0 && this.phase === "closed") {
+      void this.runTransition(active, 0, false);
+      return;
+    }
+    this.applySize(target);
+    this.settlePhase(true);
+    this.flush();
+  }
+  installLifecycle(promote) {
+    if (promote) sheetStack.promote(this.id);
+    if (this.lifecycle.isInstalled) return true;
+    try {
+      this.lifecycle.install();
+      return true;
+    } catch (err) {
+      this.abortOpen();
+      queueMicrotask(() => {
+        throw err;
+      });
+      return false;
+    }
+  }
+  abortOpen() {
+    this.animation.cancel();
+    if (!this.destroyed) this.newCycle();
+    this.phase = "closed";
+    this.openPending = false;
+    this.lifecycle.release();
+    sheetStack.update();
+    this.activeId = this.zeroSnapId() ?? this.activeId;
+    this.applySize(0);
+    this.setRestClosed(true);
+    this.updateAriaSlider();
+  }
+  zeroSnapId() {
+    return this.snapPointsRaw.find((p) => p.id === "closed")?.id ?? this.snaps.getAllowedIds().find((a) => this.snaps.findById(a)?.size === 0);
+  }
+  isClosedSnap(id) {
+    if (id === "closed") return true;
+    return this.snapPointsRaw.find((p) => p.id === id)?.size === 0;
+  }
+  closingBlocked() {
+    return this.disableCloseFlag && this.phase !== "closed";
+  }
+  setKeyboardInset(px) {
+    if (px === this.keyboardInset) return;
+    this.keyboardInset = px;
+    for (const host of this.varHosts()) {
+      host.style.setProperty("--bs-keyboard-inset", `${px}px`);
+    }
+  }
+  varHosts() {
+    const hosts = /* @__PURE__ */ new Set([this.element]);
+    for (const host of [
+      this.anchorHost,
+      this.scrimParent,
+      this.rootEl,
+      this.homeRoot
+    ]) {
+      if (host) hosts.add(host);
+    }
+    return hosts;
+  }
+  dismissBlocked() {
+    return (this.disableCloseFlag || this.persistent) && this.phase !== "closed";
+  }
+  post(event, payload) {
+    this.outbox.push(() => this.bus.emit(event, payload));
+  }
+  flush() {
+    if (this.flushing) return;
+    this.flushing = true;
+    try {
+      for (let next = this.outbox.shift(); next; next = this.outbox.shift()) {
+        next();
+      }
+    } finally {
+      this.flushing = false;
+    }
   }
   setRestClosed(closed) {
     if (closed === this.restClosed) return;
@@ -3054,17 +3468,6 @@ var BottomSheetCore = class {
     if (closed) this.element.setAttribute("data-bs-rest", "closed");
     else this.element.removeAttribute("data-bs-rest");
   }
-  emitOpenSequence(id) {
-    this.emit("open", { id });
-    this.handleOpen();
-    notifyLinkedSheets(this.linkedSheets, this);
-    this.emit("opened", { id });
-  }
-  emitCloseSequence() {
-    this.emit("close", void 0);
-    this.handleClose();
-    this.emit("closed", void 0);
-  }
   async dragTo(targetSize, velocityOrOpts = 0) {
     if (this.destroyed) return;
     const opts = typeof velocityOrOpts === "object" ? velocityOrOpts : { velocity: velocityOrOpts };
@@ -3072,27 +3475,31 @@ var BottomSheetCore = class {
     const externalSignal = opts.signal;
     if (externalSignal?.aborted) return;
     this.newCycle();
-    const onExternalAbort = () => {
-      this.animation.cancel();
-      this.newCycle();
-    };
+    const onExternalAbort = () => this.suspend();
     externalSignal?.addEventListener("abort", onExternalAbort, { once: true });
     const clamped = Math.max(0, Math.min(targetSize, this.snaps.getMaxAxisSize()));
     await this.animation.animateTo(clamped, velocityPxPerMs);
     externalSignal?.removeEventListener("abort", onExternalAbort);
-    if (this.destroyed || externalSignal?.aborted) return;
   }
   open(id) {
     if (this.destroyed) return Promise.resolve();
+    if (!id && (this.phase === "open" || this.phase === "opening")) {
+      return Promise.resolve();
+    }
     const target = id ?? this.snaps.getAllowedIds().find((a) => (this.snaps.findById(a)?.size ?? 0) > 0) ?? this.activeId;
     return this.snapTo(target);
   }
   close(reason = "programmatic") {
-    if (this.destroyed) return Promise.resolve();
-    if (this.disableCloseFlag) return Promise.resolve();
-    if (this.size > 0 && this.emitBeforeClose(reason)) return Promise.resolve();
-    const closedId = this.snapPointsRaw.find((p) => p.id === "closed")?.id ?? this.snaps.getAllowedIds().find((a) => this.snaps.findById(a)?.size === 0) ?? this.snaps.getAllowedIds()[0];
-    return this.snapTo(closedId ?? this.activeId);
+    if (this.destroyed || this.disableCloseFlag) return Promise.resolve();
+    if (this.persistent && reason !== "programmatic") return Promise.resolve();
+    const target = this.zeroSnapId() ?? this.allowedIdsBySize()[0];
+    if (target === void 0) return Promise.resolve();
+    if (this.phase === "closed" && this.activeId === target) {
+      return Promise.resolve();
+    }
+    const visible = this.phase === "open" || this.phase === "opening";
+    if (visible && this.emitBeforeClose(reason)) return Promise.resolve();
+    return this.snapTo(target);
   }
   canDismiss() {
     return !this.persistent && !this.disableCloseFlag && !this.destroyed;
@@ -3115,10 +3522,12 @@ var BottomSheetCore = class {
   }
   setDragFrom(mode) {
     if (this.destroyed || mode === this.dragFromMode) return;
+    const wasDragging = this.gesture?.isDragging ?? false;
     this.gesture?.forceClearDragState();
     this.detachSheetGesture?.();
     this.dragFromMode = mode;
     this.mountSheetGesture();
+    if (wasDragging) this.restoreAfterDrag();
   }
   getDragFrom() {
     return this.dragFromMode;
@@ -3131,6 +3540,7 @@ var BottomSheetCore = class {
     const nowVertical = next === "bottom" || next === "top";
     this.gesture?.forceClearDragState();
     this.detachSheetGesture?.();
+    this.landNow();
     this.animation.cancel();
     this.element.style.removeProperty(layoutAxis(this.mode));
     this.mode = next;
@@ -3146,9 +3556,12 @@ var BottomSheetCore = class {
     this.detachSliderKeyboard?.();
     this.mountSliderKeyboard();
     this.mountSheetGesture();
+    for (const anchor of this.anchors) anchor.reposition();
+    this.placeScrimStages?.();
+    if (this.stackEffectPrimed) {
+      this.element.style.transformOrigin = nowVertical ? "50% 100%" : "0% 50%";
+    }
     this.recompute();
-    const active = this.snaps.findById(this.activeId);
-    if (active) this.applySize(active.size);
     this.updateAriaSlider();
   }
   getMode() {
@@ -3190,13 +3603,24 @@ var BottomSheetCore = class {
     if (snap && ids.includes(snap)) {
       void this.snapTo(snap, 0, true);
     } else if (!ids.includes(this.activeId)) {
-      const fallback = ids[0];
-      if (fallback) void this.snapTo(fallback, 0, true);
+      const fallback = this.fallbackSnap(
+        this.snaps.findById(this.activeId)?.size ?? this.size
+      );
+      if (fallback) void this.snapTo(fallback.id, 0, true);
     }
   }
+  fallbackSnap(from) {
+    return (from > 0 ? this.snaps.nearest(from, true) : null) ?? this.snaps.nearest(from, false);
+  }
   setBackdropRange(range) {
     this.scrim.setBackdropRange(range, () => this.applySize(this.size));
   }
+  setBackdropOpacity(value) {
+    this.scrim.setBackdropOpacity(value, () => this.applySize(this.size));
+  }
+  setBackdropColor(color) {
+    this.scrim.setBackdropColor(color);
+  }
   setScreenRange(range) {
     this.scrim.setScreenRange(range, () => this.applySize(this.size));
   }
@@ -3237,7 +3661,7 @@ var BottomSheetCore = class {
     }
     const handle = attachAnchor(
       {
-        mode: this.mode,
+        getMode: () => this.mode,
         host: this.anchorHost,
         getState: () => ({
           activeId: this.activeId,
@@ -3275,9 +3699,9 @@ var BottomSheetCore = class {
       return () => {
       };
     }
-    const detachInstalled = installScrimStages(
+    const stages = installScrimStages(
       {
-        mode: this.mode,
+        getMode: () => this.mode,
         host,
         getState: () => ({
           activeId: this.activeId,
@@ -3290,10 +3714,14 @@ var BottomSheetCore = class {
       opts
     );
     const detach = () => {
-      if (this.detachScrimStages === detach) this.detachScrimStages = null;
-      detachInstalled();
+      if (this.detachScrimStages === detach) {
+        this.detachScrimStages = null;
+        this.placeScrimStages = null;
+      }
+      stages.detach();
     };
     this.detachScrimStages = detach;
+    this.placeScrimStages = stages.reposition;
     this.teardowns.add(() => this.detachScrimStages?.());
     return detach;
   }
@@ -3302,32 +3730,29 @@ var BottomSheetCore = class {
   }
   setSnapPoints(points, allowed) {
     if (this.destroyed) return;
-    this.animation.cancel();
-    this.newCycle();
+    const from = this.snaps.findById(this.activeId)?.size ?? this.size;
+    const restricted = this.snaps.getResolvedSnaps().some((s) => !this.snaps.getAllowedIds().includes(s.id));
     this.snapPointsRaw = points;
     auditVhUsage(points);
     this.auditDuplicateSnapIds(points);
+    this.maxHeight.resolveCap();
     this.snaps.setRaw(points);
+    this.maxHeight.clampTo();
     if (allowed) {
       this.snaps.setAllowedIds(allowed);
     } else {
       const present = this.snaps.getResolvedSnaps().map((s) => s.id);
-      const kept = this.snaps.getAllowedIds().filter((id) => present.includes(id));
+      const kept = restricted ? this.snaps.getAllowedIds().filter((id) => present.includes(id)) : [];
       this.snaps.setAllowedIds(kept.length ? kept : present);
     }
     this.scrollCache.clear();
     this.scrim.invalidateOpacityCache();
-    const current = this.snaps.findById(this.activeId);
-    if (current) {
-      this.applySize(current.size);
-    } else {
-      const fallback = this.snaps.getResolvedSnaps().find((s) => this.snaps.getAllowedIds().includes(s.id)) ?? this.snaps.getResolvedSnaps()[0];
-      if (fallback) {
-        this.activeId = fallback.id;
-        this.applySize(fallback.size);
-      }
+    if (this.snaps.findById(this.activeId)) {
+      this.reseat();
+      return;
     }
-    this.updateAriaSlider();
+    const fallback = this.fallbackSnap(from) ?? this.snaps.getResolvedSnaps()[0];
+    if (fallback) void this.transitionTo(fallback.id, 0, true);
   }
   recompute() {
     if (this.destroyed) return;
@@ -3335,22 +3760,11 @@ var BottomSheetCore = class {
     this.snaps.recompute();
     this.maxHeight.clampTo();
     this.scrim.invalidateOpacityCache();
-    if (this.isDraggingAny()) return;
-    this.healActiveSnap();
-  }
-  healActiveSnap() {
-    const current = this.snaps.findById(this.activeId);
-    if (!current) return;
-    this.size = current.size;
-    this.applySize(this.size);
-    this.updateAriaSlider();
-    if (this.size > 0 && !this.lifecycle.isInstalled && !this.opening && !this.animation.isAnimating) {
-      this.emitOpenSequence(this.activeId);
-    }
+    this.reseat();
   }
   destroy() {
     this.destroyed = true;
-    this.opening = false;
+    this.outbox.length = 0;
     this.currentAbort.abort();
     this.currentViewTransition?.skipTransition?.();
     this.currentViewTransition = null;
@@ -3367,11 +3781,19 @@ var BottomSheetCore = class {
       this.backdrop.style.opacity = "";
       this.backdrop.style.pointerEvents = "";
     }
-    for (const host of [this.anchorHost, this.scrimParent, this.rootEl]) {
+    for (const host of [
+      this.anchorHost,
+      this.scrimParent,
+      this.rootEl,
+      this.homeRoot
+    ]) {
       if (!host) continue;
       host.style.removeProperty("--bs-size");
       host.style.removeProperty("--bs-progress");
+      host.style.removeProperty("--bs-z-sheet");
+      host.style.removeProperty("--bs-keyboard-inset");
     }
+    this.element.style.removeProperty("--bs-keyboard-inset");
     if (this.screenComponent) {
       this.screenComponent.style.opacity = "";
       this.screenComponent.style.display = "";
@@ -3384,7 +3806,8 @@ var BottomSheetCore = class {
   }
   newCycle() {
     this.allowOvershoot = false;
-    this.opening = false;
+    this.transition = null;
+    this.inFlight = null;
     this.currentAbort.abort();
     this.currentAbort = new AbortController();
     return this.currentAbort.signal;
@@ -3407,8 +3830,9 @@ var BottomSheetCore = class {
     if (typeof document === "undefined") return;
     if (!this.lifecycle.focusTrapEnabled) return;
     if (this.element.getAttribute("aria-labelledby")) return;
-    const scope = this.handle ?? this.element;
-    const titled = scope.querySelector("[data-bs-title]") ?? scope.querySelector("h1,h2,h3,h4,h5,h6");
+    const HEADING = "h1,h2,h3,h4,h5,h6";
+    const header = this.element.querySelector(".bs-header");
+    const titled = this.element.querySelector("[data-bs-title]") ?? this.handle.querySelector(HEADING) ?? header?.querySelector(HEADING);
     if (!titled) return;
     if (!titled.id) {
       titled.id = nextInstanceId("bs-title");
@@ -3450,12 +3874,16 @@ var BottomSheetCore = class {
         this.stackZ = z;
         this.element.style.zIndex = String(z);
         if (this.backdrop) this.backdrop.style.zIndex = String(z - 1);
+        this.rootEl?.style.setProperty("--bs-z-sheet", String(z));
+        this.homeRoot?.style.setProperty("--bs-z-sheet", String(z));
         for (const anchor of this.anchors) anchor.syncZ(z + 1);
       },
       setIsTop: (isTop) => {
+        if (isTop === this.isTopSheet) return;
         this.isTopSheet = isTop;
+        this.lifecycle.syncTop();
       },
-      isOpen: () => this.size > 0 || this.opening,
+      isOpen: () => this.phase !== "closed",
       setDepth: (depth) => this.applyStackDepth(depth)
     }));
   }
@@ -3483,15 +3911,15 @@ var BottomSheetCore = class {
         const r = this.getAllowedRange();
         buf.size = this.size;
         buf.maxAxisSize = this.snaps.getMaxAxisSize();
-        buf.range.min = r.min;
+        buf.range.min = this.dismissBlocked() ? Math.max(r.min, this.smallestOpenSize()) : r.min;
         buf.range.max = r.max;
         buf.rubberBandEnabled = this.rubberBandEnabled;
         return buf;
       },
       getDisableDrag: () => this.disableDragFlag,
-      cancelAnimation: () => this.animation.cancel(),
+      cancelAnimation: () => this.suspend(),
       applySize: (size) => this.applySize(size),
-      animateTo: (size, velocity) => this.animation.animateTo(size, velocity),
+      restoreAfterDrag: () => this.restoreAfterDrag(),
       settleAfterDrag: (delta, velocity, kind) => this.settleAfterDrag(delta, velocity, kind),
       emit: (event, payload) => this.emit(event, payload),
       listenerCount: (event) => this.bus.listenerCount(event)
@@ -3615,32 +4043,19 @@ var BottomSheetCore = class {
         element: this.element,
         getMode: () => this.mode,
         isDestroyed: () => this.destroyed,
-        isDragging: () => this.isDraggingAny(),
         resolveActiveSnap: () => this.snaps.findById(this.activeId),
         getMaxAxisSize: () => this.snaps.getMaxAxisSize(),
-        getSize: () => this.size,
         setMaxAxisSize: (size) => {
           this.snaps.setMaxAxisSize(size);
         },
-        setSize: (size) => {
-          this.size = size;
-        },
         recomputeSnaps: () => this.recomputeSnaps(),
-        applySize: (size) => this.applySize(size),
-        cancelInFlight: () => {
-          this.animation.cancel();
-        },
-        newCycle: () => {
-          this.newCycle();
-        },
-        isAnimating: () => this.animation.isAnimating,
-        resyncAfterCancel: () => this.resyncAfterResize()
+        reseat: () => this.reseat(),
+        landNow: () => this.landNow()
       }));
       if (this.lifecycle.closeOnEscape) {
         const onKey = (e) => {
           if (this.destroyed || e.defaultPrevented) return;
-          if (!this.canDismiss()) return;
-          if (e.key === "Escape" && this.isTopSheet && this.size > 0) {
+          if (e.key === "Escape" && this.isTopSheet) {
             void this.close("escape");
           }
         };
@@ -3658,7 +4073,10 @@ var BottomSheetCore = class {
       handle: this.handle,
       mode: this.mode,
       isDestroyed: () => this.destroyed,
-      getAllowedIds: () => this.allowedIdsBySize(),
+      getAllowedIds: () => {
+        const ids = this.allowedIdsBySize();
+        return this.dismissBlocked() ? ids.filter((id) => (this.snaps.findById(id)?.size ?? 0) > 0) : ids;
+      },
       getActiveId: () => this.activeId,
       snapTo: (id) => {
         void this.snapTo(id);
@@ -3671,56 +4089,46 @@ var BottomSheetCore = class {
     });
   }
   settleAfterDrag(delta, velocity, kind = "touch") {
-    const signal = this.newCycle();
-    const target = this.snaps.findDragSettleTarget({
-      delta,
-      velocity,
-      pointerKind: kind,
-      size: this.size,
-      activeId: this.activeId,
-      flickVelocity: this.flickVelocity,
-      dragThreshold: this.dragThreshold
-    });
+    const target = this.snaps.findDragSettleTarget(
+      {
+        delta,
+        velocity,
+        pointerKind: kind,
+        size: this.size,
+        activeId: this.activeId,
+        flickVelocity: this.flickVelocity,
+        dragThreshold: this.dragThreshold
+      },
+      this.dismissBlocked()
+    );
     if (!target) {
       this.clearWillChangeIfIdle();
       return;
     }
     const previousId = this.activeId;
     if (target.id === previousId && target.size === this.size) {
+      if (this.phase === "opening" || this.phase === "closing") {
+        this.land(false);
+      }
       this.clearWillChangeIfIdle();
       return;
     }
     if (this.emitBeforeSnap(target, previousId)) {
-      const restore = this.snaps.findById(previousId);
-      if (restore) {
-        void this.animation.animateTo(restore.size, 0);
-      }
+      this.restoreAfterDrag();
       return;
     }
-    const previousSize = this.size;
-    const previousSnapSize = this.snaps.findById(previousId)?.size;
-    this.scrollCache.cache(previousId, previousSize, target.size);
-    this.activeId = target.id;
-    if (previousSnapSize === 0 && target.size > 0) {
-      this.opening = true;
-      this.promotedForOpen = true;
-      sheetStack.promote(this.id);
-    }
-    const settleCap = this.snaps.getMaxAxisSize();
-    const settleSize = settleCap > 0 ? Math.min(target.size, settleCap) : target.size;
-    this.allowOvershoot = true;
-    void this.animation.animateTo(settleSize, velocity).then(() => {
-      if (signal.aborted) return;
-      this.allowOvershoot = false;
-      this.opening = false;
-      this.completeSnap(
-        target.id,
-        target.size,
-        previousSize,
-        previousSnapSize === 0,
-        true
-      );
-    });
+    void this.runTransition(target, velocity, true);
+  }
+  restoreAfterDrag() {
+    const active = this.snaps.findById(this.activeId);
+    if (active) void this.runTransition(active, 0, false);
+  }
+  smallestOpenSize() {
+    const allowed = this.snaps.getAllowedIds();
+    for (const snap of this.snaps.getResolvedSnaps()) {
+      if (snap.size > 0 && allowed.includes(snap.id)) return snap.size;
+    }
+    return 0;
   }
   isDraggingAny() {
     return (this.gesture?.isDragging ?? false) || (this.contentGesture?.isDragging ?? false);
@@ -3745,9 +4153,10 @@ var BottomSheetCore = class {
     const offset = cap - clamped;
     const style = this.element.style;
     if (!skipTransform) style.transform = this.transformTemplate(offset);
+    const moving = this.animation.isAnimating || this.isDraggingAny();
     const sizeChanged = this.sizeWriteSentinel.shouldWrite(
       clamped,
-      this.animation.isAnimating || this.isDraggingAny() ? SIZE_WRITE_EPSILON : 0
+      moving ? SIZE_WRITE_EPSILON : 0
     );
     if (sizeChanged) {
       style.setProperty("--bs-size", `${clamped}px`);
@@ -3760,11 +4169,13 @@ var BottomSheetCore = class {
       if (this.rootEl && this.rootEl !== this.scrimParent && this.rootEl !== this.anchorHost) {
         this.rootEl.style.setProperty("--bs-size", `${clamped}px`);
       }
+      this.homeRoot?.style.setProperty("--bs-size", `${clamped}px`);
     }
     const progress = this.computeProgress(clamped);
+    const opacityEpsilon = moving ? OPACITY_WRITE_EPSILON : 0;
     const progressChanged = this.progressWriteSentinel.shouldWrite(
       progress,
-      OPACITY_WRITE_EPSILON
+      opacityEpsilon
     );
     if (progressChanged) {
       style.setProperty("--bs-progress", String(progress));
@@ -3774,8 +4185,9 @@ var BottomSheetCore = class {
       if (this.rootEl && this.rootEl !== this.anchorHost) {
         this.rootEl.style.setProperty("--bs-progress", String(progress));
       }
+      this.homeRoot?.style.setProperty("--bs-progress", String(progress));
     }
-    this.scrim.applyOpacity(progress, progressChanged);
+    this.scrim.applyOpacity(progress, progressChanged, opacityEpsilon);
     if ((progressChanged || sizeChanged) && this.bus.listenerCount("progress") > 0) {
       this.progressPayload.value = progress;
       this.progressPayload.size = clamped;
@@ -3788,44 +4200,6 @@ var BottomSheetCore = class {
     if (reachableMax <= min) return 0;
     return Math.min(Math.max((size - min) / (reachableMax - min), 0), 1);
   }
-  handleOpen() {
-    if (this.promotedForOpen) this.promotedForOpen = false;
-    else sheetStack.promote(this.id);
-    try {
-      this.lifecycle.install();
-    } catch (err) {
-      if (!this.destroyed) this.newCycle();
-      this.handleClose();
-      this.applySize(0);
-      this.activeId = this.snapPointsRaw.find((p) => p.id === "closed")?.id ?? this.activeId;
-      this.size = 0;
-      queueMicrotask(() => {
-        throw err;
-      });
-    }
-  }
-  resyncAfterResize() {
-    if (this.destroyed) return;
-    const target = this.snaps.findById(this.activeId);
-    if (!target) return;
-    this.updateAriaSlider();
-    this.emit("snap", {
-      id: target.id,
-      size: this.size,
-      progress: this.computeProgress(this.size)
-    });
-    if (target.size > 0 && !this.lifecycle.isInstalled) {
-      this.emitOpenSequence(target.id);
-    } else if (target.size === 0 && this.lifecycle.isInstalled) {
-      this.emitCloseSequence();
-    }
-  }
-  handleClose() {
-    this.opening = false;
-    this.promotedForOpen = false;
-    this.lifecycle.release();
-    sheetStack.update();
-  }
 };
 
 export { BottomSheetCore };