@surdeddd/bottom-sheet 0.21.0 → 0.21.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (54) hide show
  1. package/README.md +9 -0
  2. package/dist/{BottomSheetCore-CK8Rh1He.d.cts → BottomSheetCore-BHv6LPmS.d.cts} +1 -1
  3. package/dist/{BottomSheetCore-CIijwtdi.d.ts → BottomSheetCore-CK_mq14p.d.ts} +1 -1
  4. package/dist/{BottomSheetEngine-hLSAxzla.d.cts → BottomSheetEngine-mmFzIK1Z.d.cts} +1 -1
  5. package/dist/{BottomSheetEngine-CZglPsTF.d.ts → BottomSheetEngine-wLn6Q2kA.d.ts} +1 -1
  6. package/dist/core.cjs +31 -21
  7. package/dist/core.d.cts +2 -2
  8. package/dist/core.d.ts +2 -2
  9. package/dist/core.js +31 -21
  10. package/dist/debug.d.cts +1 -1
  11. package/dist/debug.d.ts +1 -1
  12. package/dist/element.cjs +37 -26
  13. package/dist/element.d.cts +2 -2
  14. package/dist/element.d.ts +2 -2
  15. package/dist/element.iife.global.js +2 -2
  16. package/dist/element.js +37 -26
  17. package/dist/features.d.cts +2 -2
  18. package/dist/features.d.ts +2 -2
  19. package/dist/{index-BqLHKOeM.d.ts → index-CWKv1Xy4.d.ts} +1 -1
  20. package/dist/{index-BEX-NHRJ.d.cts → index-juAyT76E.d.cts} +1 -1
  21. package/dist/index.cjs +31 -21
  22. package/dist/index.d.cts +4 -4
  23. package/dist/index.d.ts +4 -4
  24. package/dist/index.js +31 -21
  25. package/dist/integrations/formik.d.cts +1 -1
  26. package/dist/integrations/formik.d.ts +1 -1
  27. package/dist/integrations/react-hook-form.d.cts +1 -1
  28. package/dist/integrations/react-hook-form.d.ts +1 -1
  29. package/dist/preact.d.cts +2 -2
  30. package/dist/preact.d.ts +2 -2
  31. package/dist/qwik-lib/index.qwik.cjs +29 -19
  32. package/dist/qwik-lib/index.qwik.mjs +29 -19
  33. package/dist/qwik.cjs +31 -21
  34. package/dist/qwik.d.cts +2 -2
  35. package/dist/qwik.d.ts +2 -2
  36. package/dist/qwik.js +31 -21
  37. package/dist/react.cjs +31 -21
  38. package/dist/react.d.cts +3 -3
  39. package/dist/react.d.ts +3 -3
  40. package/dist/react.js +31 -21
  41. package/dist/solid.cjs +31 -21
  42. package/dist/solid.d.cts +1 -1
  43. package/dist/solid.d.ts +1 -1
  44. package/dist/solid.js +31 -21
  45. package/dist/solid.source.jsx +31 -21
  46. package/dist/svelte-core.cjs +31 -21
  47. package/dist/svelte-core.js +31 -21
  48. package/dist/svelte.cjs +31 -21
  49. package/dist/svelte.js +31 -21
  50. package/dist/vue.cjs +31 -21
  51. package/dist/vue.js +31 -21
  52. package/dist/webgl.d.cts +1 -1
  53. package/dist/webgl.d.ts +1 -1
  54. package/package.json +2 -2
package/README.md CHANGED
@@ -499,6 +499,15 @@ element — drive any CSS animation from drag without touching JS:
499
499
  > `z-index` on bs-managed elements. See
500
500
  > [Architecture → z-index & the sheet stack](docs/ARCHITECTURE.md).
501
501
 
502
+ **Every sheet owns its backdrop.** Open a list, then a detail sheet over it,
503
+ and both backdrops stay live: the dimming deepens with each level, and the
504
+ sheet underneath stays masked for the whole time the one above it closes, so
505
+ taps never reach the page mid-animation. Each backdrop follows its own sheet's
506
+ progress, so a buried sheet that closes clears its own scrim. The stack keeps
507
+ the order sheets started opening in — a sheet opened while another is still
508
+ animating stays on top. If you want a single dim level, pass `backdrop={false}`
509
+ (`:backdrop="false"` in Vue) to the sheets you open on top.
510
+
502
511
  ### Scrim, blur & high contrast
503
512
 
504
513
  | Token | Default | Region |
@@ -305,6 +305,7 @@ declare class BottomSheetCore {
305
305
  private progressWriteSentinel;
306
306
  private isTopSheet;
307
307
  private opening;
308
+ private promotedForOpen;
308
309
  private allowOvershoot;
309
310
  private progressPayload;
310
311
  private dragContextBuf;
@@ -397,7 +398,6 @@ declare class BottomSheetCore {
397
398
  private allowedIdsBySize;
398
399
  private updateAriaSlider;
399
400
  private registerInStack;
400
- private repaintScrim;
401
401
  private applyStackDepth;
402
402
  private buildGestureDeps;
403
403
  private isContentDragAllowed;
@@ -305,6 +305,7 @@ declare class BottomSheetCore {
305
305
  private progressWriteSentinel;
306
306
  private isTopSheet;
307
307
  private opening;
308
+ private promotedForOpen;
308
309
  private allowOvershoot;
309
310
  private progressPayload;
310
311
  private dragContextBuf;
@@ -397,7 +398,6 @@ declare class BottomSheetCore {
397
398
  private allowedIdsBySize;
398
399
  private updateAriaSlider;
399
400
  private registerInStack;
400
- private repaintScrim;
401
401
  private applyStackDepth;
402
402
  private buildGestureDeps;
403
403
  private isContentDragAllowed;
@@ -1,4 +1,4 @@
1
- import { B as BottomSheetCore, c as EngineOptions } from './BottomSheetCore-CK8Rh1He.cjs';
1
+ import { B as BottomSheetCore, c as EngineOptions } from './BottomSheetCore-BHv6LPmS.cjs';
2
2
 
3
3
  declare class BottomSheetEngine extends BottomSheetCore {
4
4
  constructor(opts: EngineOptions);
@@ -1,4 +1,4 @@
1
- import { B as BottomSheetCore, c as EngineOptions } from './BottomSheetCore-CIijwtdi.js';
1
+ import { B as BottomSheetCore, c as EngineOptions } from './BottomSheetCore-CK_mq14p.js';
2
2
 
3
3
  declare class BottomSheetEngine extends BottomSheetCore {
4
4
  constructor(opts: EngineOptions);
package/dist/core.cjs CHANGED
@@ -375,14 +375,26 @@ function notifyLinkedSheets(sheets, self) {
375
375
  }
376
376
  }
377
377
 
378
+ // src/core/primitives/hot-path-thresholds.ts
379
+ var SIZE_WRITE_EPSILON = 0.5;
380
+ var OPACITY_WRITE_EPSILON = 5e-3;
381
+ var POINTER_EVENTS_OPACITY_THRESHOLD = 0.05;
382
+ var RANGE_DIVISION_EPSILON = 1e-4;
383
+
378
384
  // src/core/features/resize-observer.ts
379
385
  function installResizeObserver(deps) {
380
386
  if (typeof window === "undefined") {
381
387
  return () => {
382
388
  };
383
389
  }
390
+ const seatFor = () => {
391
+ const snap = deps.resolveActiveSnap();
392
+ const max = deps.getMaxAxisSize();
393
+ return { target: snap ? Math.min(snap.size, max) : null, max };
394
+ };
384
395
  const onResize = () => {
385
396
  if (deps.isDestroyed()) return;
397
+ const before = seatFor();
386
398
  deps.recomputeSnaps();
387
399
  const mode = deps.getMode();
388
400
  const isVerticalAxis = mode === "bottom" || mode === "top";
@@ -391,6 +403,10 @@ function installResizeObserver(deps) {
391
403
  if (viewportSize2 > 0 && viewportSize2 < max) {
392
404
  deps.setMaxAxisSize(viewportSize2);
393
405
  }
406
+ const after = seatFor();
407
+ 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) {
408
+ return;
409
+ }
394
410
  const wasAnimating = deps.isAnimating?.() ?? false;
395
411
  deps.cancelInFlight();
396
412
  deps.newCycle();
@@ -659,12 +675,6 @@ var SCRIM_PRESETS = Object.freeze({
659
675
  }
660
676
  });
661
677
 
662
- // src/core/primitives/hot-path-thresholds.ts
663
- var SIZE_WRITE_EPSILON = 0.5;
664
- var OPACITY_WRITE_EPSILON = 5e-3;
665
- var POINTER_EVENTS_OPACITY_THRESHOLD = 0.05;
666
- var RANGE_DIVISION_EPSILON = 1e-4;
667
-
668
678
  // src/core/primitives/opacity-dedup.ts
669
679
  var WriteSentinel = class {
670
680
  constructor() {
@@ -774,7 +784,6 @@ var ScrimController = class {
774
784
  __publicField(this, "backdrop");
775
785
  __publicField(this, "mode");
776
786
  __publicField(this, "isDestroyed");
777
- __publicField(this, "isTopSheet");
778
787
  __publicField(this, "getAllowedIds");
779
788
  __publicField(this, "getResolvedSnaps");
780
789
  __publicField(this, "snapToFn");
@@ -796,7 +805,6 @@ var ScrimController = class {
796
805
  this.backdrop = deps.backdrop;
797
806
  this.mode = deps.mode;
798
807
  this.isDestroyed = deps.isDestroyed;
799
- this.isTopSheet = deps.isTopSheet;
800
808
  this.getAllowedIds = deps.getAllowedIds;
801
809
  this.getResolvedSnaps = deps.getResolvedSnaps;
802
810
  this.snapToFn = deps.snapTo;
@@ -841,8 +849,10 @@ var ScrimController = class {
841
849
  if (this.backdrop) {
842
850
  const [s, e] = this.backdropRange;
843
851
  const range = Math.max(e - s, RANGE_DIVISION_EPSILON);
844
- const ramp = Math.min(Math.max((progress - s) / range, 0), 1);
845
- const backdropOpacity = this.isTopSheet() ? ramp : 0;
852
+ const backdropOpacity = Math.min(
853
+ Math.max((progress - s) / range, 0),
854
+ 1
855
+ );
846
856
  if (this.backdropOpacitySentinel.shouldWrite(
847
857
  backdropOpacity,
848
858
  OPACITY_WRITE_EPSILON
@@ -2617,6 +2627,7 @@ var BottomSheetCore = class {
2617
2627
  __publicField(this, "progressWriteSentinel", new WriteSentinel());
2618
2628
  __publicField(this, "isTopSheet", true);
2619
2629
  __publicField(this, "opening", false);
2630
+ __publicField(this, "promotedForOpen", false);
2620
2631
  __publicField(this, "allowOvershoot", false);
2621
2632
  __publicField(this, "progressPayload", {
2622
2633
  value: 0,
@@ -2673,7 +2684,6 @@ var BottomSheetCore = class {
2673
2684
  screenComponent: this.screenComponent,
2674
2685
  backdrop: this.backdrop,
2675
2686
  isDestroyed: () => this.destroyed,
2676
- isTopSheet: () => this.isTopSheet,
2677
2687
  getAllowedIds: () => this.snaps.getAllowedIds().slice(),
2678
2688
  getResolvedSnaps: () => this.snaps.getResolvedSnaps().slice(),
2679
2689
  snapTo: (id) => {
@@ -2943,13 +2953,14 @@ var BottomSheetCore = class {
2943
2953
  if (!_skipBeforeSnap && this.emitBeforeSnap(target, this.activeId)) {
2944
2954
  return;
2945
2955
  }
2956
+ const resumingOpen = this.opening;
2946
2957
  const signal = this.newCycle();
2947
2958
  const onExternalAbort = () => {
2948
2959
  this.animation.cancel();
2949
2960
  this.newCycle();
2950
2961
  };
2951
2962
  externalSignal?.addEventListener("abort", onExternalAbort, { once: true });
2952
- const wasClosed = this.size === 0;
2963
+ const wasClosed = this.size === 0 || resumingOpen;
2953
2964
  const previousId = this.activeId;
2954
2965
  const previousSize = this.size;
2955
2966
  this.scrollCache.cache(previousId, previousSize, target.size);
@@ -2958,7 +2969,10 @@ var BottomSheetCore = class {
2958
2969
  const opensToRest = id === "closed" || rawTargetSize === 0;
2959
2970
  if (wasClosed && !opensToRest) {
2960
2971
  this.opening = true;
2961
- sheetStack.promote(this.id);
2972
+ if (!resumingOpen) {
2973
+ this.promotedForOpen = true;
2974
+ sheetStack.promote(this.id);
2975
+ }
2962
2976
  }
2963
2977
  if (this.animation.viewTransitionsAvailable) {
2964
2978
  this.currentViewTransition?.skipTransition?.();
@@ -3399,19 +3413,12 @@ var BottomSheetCore = class {
3399
3413
  for (const anchor of this.anchors) anchor.syncZ(z + 1);
3400
3414
  },
3401
3415
  setIsTop: (isTop) => {
3402
- if (this.isTopSheet === isTop) return;
3403
3416
  this.isTopSheet = isTop;
3404
- this.repaintScrim();
3405
3417
  },
3406
3418
  isOpen: () => this.size > 0 || this.opening,
3407
3419
  setDepth: (depth) => this.applyStackDepth(depth)
3408
3420
  }));
3409
3421
  }
3410
- repaintScrim() {
3411
- if (this.destroyed) return;
3412
- this.scrim.invalidateOpacityCache();
3413
- this.scrim.applyOpacity(this.computeProgress(this.size), true);
3414
- }
3415
3422
  applyStackDepth(depth) {
3416
3423
  if (!this.stackEffectEnabled) return;
3417
3424
  this.element.setAttribute("data-stack-depth", String(depth));
@@ -3656,6 +3663,7 @@ var BottomSheetCore = class {
3656
3663
  this.activeId = target.id;
3657
3664
  if (previousSnapSize === 0 && target.size > 0) {
3658
3665
  this.opening = true;
3666
+ this.promotedForOpen = true;
3659
3667
  sheetStack.promote(this.id);
3660
3668
  }
3661
3669
  const settleCap = this.snaps.getMaxAxisSize();
@@ -3737,7 +3745,8 @@ var BottomSheetCore = class {
3737
3745
  return Math.min(Math.max((size - min) / (reachableMax - min), 0), 1);
3738
3746
  }
3739
3747
  handleOpen() {
3740
- sheetStack.promote(this.id);
3748
+ if (this.promotedForOpen) this.promotedForOpen = false;
3749
+ else sheetStack.promote(this.id);
3741
3750
  try {
3742
3751
  this.lifecycle.install();
3743
3752
  } catch (err) {
@@ -3769,6 +3778,7 @@ var BottomSheetCore = class {
3769
3778
  }
3770
3779
  handleClose() {
3771
3780
  this.opening = false;
3781
+ this.promotedForOpen = false;
3772
3782
  this.lifecycle.release();
3773
3783
  sheetStack.update();
3774
3784
  }
package/dist/core.d.cts CHANGED
@@ -1,3 +1,3 @@
1
- export { B as BottomSheetCore, C as CloseReason, f as EngineFeature, m as EngineFeatureContext, n as EngineFeatureOptions, o as EngineFeatureStage, c as EngineOptions, E as EngineState, S as SheetEventMap, b as SheetMode, w as SnapId, d as SnapPoint, a as SnapPointDef } from './BottomSheetCore-CK8Rh1He.cjs';
2
- export { R as ResolvedSnap } from './index-BEX-NHRJ.cjs';
1
+ export { B as BottomSheetCore, C as CloseReason, f as EngineFeature, m as EngineFeatureContext, n as EngineFeatureOptions, o as EngineFeatureStage, c as EngineOptions, E as EngineState, S as SheetEventMap, b as SheetMode, w as SnapId, d as SnapPoint, a as SnapPointDef } from './BottomSheetCore-BHv6LPmS.cjs';
2
+ export { R as ResolvedSnap } from './index-juAyT76E.cjs';
3
3
  import './transform-jVfAikE9.cjs';
package/dist/core.d.ts CHANGED
@@ -1,3 +1,3 @@
1
- export { B as BottomSheetCore, C as CloseReason, f as EngineFeature, m as EngineFeatureContext, n as EngineFeatureOptions, o as EngineFeatureStage, c as EngineOptions, E as EngineState, S as SheetEventMap, b as SheetMode, w as SnapId, d as SnapPoint, a as SnapPointDef } from './BottomSheetCore-CIijwtdi.js';
2
- export { R as ResolvedSnap } from './index-BqLHKOeM.js';
1
+ export { B as BottomSheetCore, C as CloseReason, f as EngineFeature, m as EngineFeatureContext, n as EngineFeatureOptions, o as EngineFeatureStage, c as EngineOptions, E as EngineState, S as SheetEventMap, b as SheetMode, w as SnapId, d as SnapPoint, a as SnapPointDef } from './BottomSheetCore-CK_mq14p.js';
2
+ export { R as ResolvedSnap } from './index-CWKv1Xy4.js';
3
3
  import './transform-jVfAikE9.js';
package/dist/core.js CHANGED
@@ -373,14 +373,26 @@ function notifyLinkedSheets(sheets, self) {
373
373
  }
374
374
  }
375
375
 
376
+ // src/core/primitives/hot-path-thresholds.ts
377
+ var SIZE_WRITE_EPSILON = 0.5;
378
+ var OPACITY_WRITE_EPSILON = 5e-3;
379
+ var POINTER_EVENTS_OPACITY_THRESHOLD = 0.05;
380
+ var RANGE_DIVISION_EPSILON = 1e-4;
381
+
376
382
  // src/core/features/resize-observer.ts
377
383
  function installResizeObserver(deps) {
378
384
  if (typeof window === "undefined") {
379
385
  return () => {
380
386
  };
381
387
  }
388
+ const seatFor = () => {
389
+ const snap = deps.resolveActiveSnap();
390
+ const max = deps.getMaxAxisSize();
391
+ return { target: snap ? Math.min(snap.size, max) : null, max };
392
+ };
382
393
  const onResize = () => {
383
394
  if (deps.isDestroyed()) return;
395
+ const before = seatFor();
384
396
  deps.recomputeSnaps();
385
397
  const mode = deps.getMode();
386
398
  const isVerticalAxis = mode === "bottom" || mode === "top";
@@ -389,6 +401,10 @@ function installResizeObserver(deps) {
389
401
  if (viewportSize2 > 0 && viewportSize2 < max) {
390
402
  deps.setMaxAxisSize(viewportSize2);
391
403
  }
404
+ const after = seatFor();
405
+ 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) {
406
+ return;
407
+ }
392
408
  const wasAnimating = deps.isAnimating?.() ?? false;
393
409
  deps.cancelInFlight();
394
410
  deps.newCycle();
@@ -657,12 +673,6 @@ var SCRIM_PRESETS = Object.freeze({
657
673
  }
658
674
  });
659
675
 
660
- // src/core/primitives/hot-path-thresholds.ts
661
- var SIZE_WRITE_EPSILON = 0.5;
662
- var OPACITY_WRITE_EPSILON = 5e-3;
663
- var POINTER_EVENTS_OPACITY_THRESHOLD = 0.05;
664
- var RANGE_DIVISION_EPSILON = 1e-4;
665
-
666
676
  // src/core/primitives/opacity-dedup.ts
667
677
  var WriteSentinel = class {
668
678
  constructor() {
@@ -772,7 +782,6 @@ var ScrimController = class {
772
782
  __publicField(this, "backdrop");
773
783
  __publicField(this, "mode");
774
784
  __publicField(this, "isDestroyed");
775
- __publicField(this, "isTopSheet");
776
785
  __publicField(this, "getAllowedIds");
777
786
  __publicField(this, "getResolvedSnaps");
778
787
  __publicField(this, "snapToFn");
@@ -794,7 +803,6 @@ var ScrimController = class {
794
803
  this.backdrop = deps.backdrop;
795
804
  this.mode = deps.mode;
796
805
  this.isDestroyed = deps.isDestroyed;
797
- this.isTopSheet = deps.isTopSheet;
798
806
  this.getAllowedIds = deps.getAllowedIds;
799
807
  this.getResolvedSnaps = deps.getResolvedSnaps;
800
808
  this.snapToFn = deps.snapTo;
@@ -839,8 +847,10 @@ var ScrimController = class {
839
847
  if (this.backdrop) {
840
848
  const [s, e] = this.backdropRange;
841
849
  const range = Math.max(e - s, RANGE_DIVISION_EPSILON);
842
- const ramp = Math.min(Math.max((progress - s) / range, 0), 1);
843
- const backdropOpacity = this.isTopSheet() ? ramp : 0;
850
+ const backdropOpacity = Math.min(
851
+ Math.max((progress - s) / range, 0),
852
+ 1
853
+ );
844
854
  if (this.backdropOpacitySentinel.shouldWrite(
845
855
  backdropOpacity,
846
856
  OPACITY_WRITE_EPSILON
@@ -2615,6 +2625,7 @@ var BottomSheetCore = class {
2615
2625
  __publicField(this, "progressWriteSentinel", new WriteSentinel());
2616
2626
  __publicField(this, "isTopSheet", true);
2617
2627
  __publicField(this, "opening", false);
2628
+ __publicField(this, "promotedForOpen", false);
2618
2629
  __publicField(this, "allowOvershoot", false);
2619
2630
  __publicField(this, "progressPayload", {
2620
2631
  value: 0,
@@ -2671,7 +2682,6 @@ var BottomSheetCore = class {
2671
2682
  screenComponent: this.screenComponent,
2672
2683
  backdrop: this.backdrop,
2673
2684
  isDestroyed: () => this.destroyed,
2674
- isTopSheet: () => this.isTopSheet,
2675
2685
  getAllowedIds: () => this.snaps.getAllowedIds().slice(),
2676
2686
  getResolvedSnaps: () => this.snaps.getResolvedSnaps().slice(),
2677
2687
  snapTo: (id) => {
@@ -2941,13 +2951,14 @@ var BottomSheetCore = class {
2941
2951
  if (!_skipBeforeSnap && this.emitBeforeSnap(target, this.activeId)) {
2942
2952
  return;
2943
2953
  }
2954
+ const resumingOpen = this.opening;
2944
2955
  const signal = this.newCycle();
2945
2956
  const onExternalAbort = () => {
2946
2957
  this.animation.cancel();
2947
2958
  this.newCycle();
2948
2959
  };
2949
2960
  externalSignal?.addEventListener("abort", onExternalAbort, { once: true });
2950
- const wasClosed = this.size === 0;
2961
+ const wasClosed = this.size === 0 || resumingOpen;
2951
2962
  const previousId = this.activeId;
2952
2963
  const previousSize = this.size;
2953
2964
  this.scrollCache.cache(previousId, previousSize, target.size);
@@ -2956,7 +2967,10 @@ var BottomSheetCore = class {
2956
2967
  const opensToRest = id === "closed" || rawTargetSize === 0;
2957
2968
  if (wasClosed && !opensToRest) {
2958
2969
  this.opening = true;
2959
- sheetStack.promote(this.id);
2970
+ if (!resumingOpen) {
2971
+ this.promotedForOpen = true;
2972
+ sheetStack.promote(this.id);
2973
+ }
2960
2974
  }
2961
2975
  if (this.animation.viewTransitionsAvailable) {
2962
2976
  this.currentViewTransition?.skipTransition?.();
@@ -3397,19 +3411,12 @@ var BottomSheetCore = class {
3397
3411
  for (const anchor of this.anchors) anchor.syncZ(z + 1);
3398
3412
  },
3399
3413
  setIsTop: (isTop) => {
3400
- if (this.isTopSheet === isTop) return;
3401
3414
  this.isTopSheet = isTop;
3402
- this.repaintScrim();
3403
3415
  },
3404
3416
  isOpen: () => this.size > 0 || this.opening,
3405
3417
  setDepth: (depth) => this.applyStackDepth(depth)
3406
3418
  }));
3407
3419
  }
3408
- repaintScrim() {
3409
- if (this.destroyed) return;
3410
- this.scrim.invalidateOpacityCache();
3411
- this.scrim.applyOpacity(this.computeProgress(this.size), true);
3412
- }
3413
3420
  applyStackDepth(depth) {
3414
3421
  if (!this.stackEffectEnabled) return;
3415
3422
  this.element.setAttribute("data-stack-depth", String(depth));
@@ -3654,6 +3661,7 @@ var BottomSheetCore = class {
3654
3661
  this.activeId = target.id;
3655
3662
  if (previousSnapSize === 0 && target.size > 0) {
3656
3663
  this.opening = true;
3664
+ this.promotedForOpen = true;
3657
3665
  sheetStack.promote(this.id);
3658
3666
  }
3659
3667
  const settleCap = this.snaps.getMaxAxisSize();
@@ -3735,7 +3743,8 @@ var BottomSheetCore = class {
3735
3743
  return Math.min(Math.max((size - min) / (reachableMax - min), 0), 1);
3736
3744
  }
3737
3745
  handleOpen() {
3738
- sheetStack.promote(this.id);
3746
+ if (this.promotedForOpen) this.promotedForOpen = false;
3747
+ else sheetStack.promote(this.id);
3739
3748
  try {
3740
3749
  this.lifecycle.install();
3741
3750
  } catch (err) {
@@ -3767,6 +3776,7 @@ var BottomSheetCore = class {
3767
3776
  }
3768
3777
  handleClose() {
3769
3778
  this.opening = false;
3779
+ this.promotedForOpen = false;
3770
3780
  this.lifecycle.release();
3771
3781
  sheetStack.update();
3772
3782
  }
package/dist/debug.d.cts CHANGED
@@ -1,4 +1,4 @@
1
- import { E as EngineState, S as SheetEventMap } from './BottomSheetCore-CK8Rh1He.cjs';
1
+ import { E as EngineState, S as SheetEventMap } from './BottomSheetCore-BHv6LPmS.cjs';
2
2
  import './transform-jVfAikE9.cjs';
3
3
 
4
4
  type DebugOverlayPosition = "top-left" | "top-right" | "bottom-left" | "bottom-right";
package/dist/debug.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { E as EngineState, S as SheetEventMap } from './BottomSheetCore-CIijwtdi.js';
1
+ import { E as EngineState, S as SheetEventMap } from './BottomSheetCore-CK_mq14p.js';
2
2
  import './transform-jVfAikE9.js';
3
3
 
4
4
  type DebugOverlayPosition = "top-left" | "top-right" | "bottom-left" | "bottom-right";
package/dist/element.cjs CHANGED
@@ -433,14 +433,31 @@ var init_linked_sheets = __esm({
433
433
  }
434
434
  });
435
435
 
436
+ // src/core/primitives/hot-path-thresholds.ts
437
+ var SIZE_WRITE_EPSILON, OPACITY_WRITE_EPSILON, POINTER_EVENTS_OPACITY_THRESHOLD, RANGE_DIVISION_EPSILON;
438
+ var init_hot_path_thresholds = __esm({
439
+ "src/core/primitives/hot-path-thresholds.ts"() {
440
+ SIZE_WRITE_EPSILON = 0.5;
441
+ OPACITY_WRITE_EPSILON = 5e-3;
442
+ POINTER_EVENTS_OPACITY_THRESHOLD = 0.05;
443
+ RANGE_DIVISION_EPSILON = 1e-4;
444
+ }
445
+ });
446
+
436
447
  // src/core/features/resize-observer.ts
437
448
  function installResizeObserver(deps) {
438
449
  if (typeof window === "undefined") {
439
450
  return () => {
440
451
  };
441
452
  }
453
+ const seatFor = () => {
454
+ const snap = deps.resolveActiveSnap();
455
+ const max = deps.getMaxAxisSize();
456
+ return { target: snap ? Math.min(snap.size, max) : null, max };
457
+ };
442
458
  const onResize = () => {
443
459
  if (deps.isDestroyed()) return;
460
+ const before = seatFor();
444
461
  deps.recomputeSnaps();
445
462
  const mode = deps.getMode();
446
463
  const isVerticalAxis = mode === "bottom" || mode === "top";
@@ -449,6 +466,10 @@ function installResizeObserver(deps) {
449
466
  if (viewportSize2 > 0 && viewportSize2 < max) {
450
467
  deps.setMaxAxisSize(viewportSize2);
451
468
  }
469
+ const after = seatFor();
470
+ 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) {
471
+ return;
472
+ }
452
473
  const wasAnimating = deps.isAnimating?.() ?? false;
453
474
  deps.cancelInFlight();
454
475
  deps.newCycle();
@@ -483,6 +504,7 @@ function installResizeObserver(deps) {
483
504
  }
484
505
  var init_resize_observer = __esm({
485
506
  "src/core/features/resize-observer.ts"() {
507
+ init_hot_path_thresholds();
486
508
  }
487
509
  });
488
510
 
@@ -747,17 +769,6 @@ var init_types = __esm({
747
769
  }
748
770
  });
749
771
 
750
- // src/core/primitives/hot-path-thresholds.ts
751
- var SIZE_WRITE_EPSILON, OPACITY_WRITE_EPSILON, POINTER_EVENTS_OPACITY_THRESHOLD, RANGE_DIVISION_EPSILON;
752
- var init_hot_path_thresholds = __esm({
753
- "src/core/primitives/hot-path-thresholds.ts"() {
754
- SIZE_WRITE_EPSILON = 0.5;
755
- OPACITY_WRITE_EPSILON = 5e-3;
756
- POINTER_EVENTS_OPACITY_THRESHOLD = 0.05;
757
- RANGE_DIVISION_EPSILON = 1e-4;
758
- }
759
- });
760
-
761
772
  // src/core/primitives/opacity-dedup.ts
762
773
  var WriteSentinel;
763
774
  var init_opacity_dedup = __esm({
@@ -885,7 +896,6 @@ var init_scrim_controller = __esm({
885
896
  __publicField(this, "backdrop");
886
897
  __publicField(this, "mode");
887
898
  __publicField(this, "isDestroyed");
888
- __publicField(this, "isTopSheet");
889
899
  __publicField(this, "getAllowedIds");
890
900
  __publicField(this, "getResolvedSnaps");
891
901
  __publicField(this, "snapToFn");
@@ -907,7 +917,6 @@ var init_scrim_controller = __esm({
907
917
  this.backdrop = deps.backdrop;
908
918
  this.mode = deps.mode;
909
919
  this.isDestroyed = deps.isDestroyed;
910
- this.isTopSheet = deps.isTopSheet;
911
920
  this.getAllowedIds = deps.getAllowedIds;
912
921
  this.getResolvedSnaps = deps.getResolvedSnaps;
913
922
  this.snapToFn = deps.snapTo;
@@ -952,8 +961,10 @@ var init_scrim_controller = __esm({
952
961
  if (this.backdrop) {
953
962
  const [s, e] = this.backdropRange;
954
963
  const range = Math.max(e - s, RANGE_DIVISION_EPSILON);
955
- const ramp = Math.min(Math.max((progress - s) / range, 0), 1);
956
- const backdropOpacity = this.isTopSheet() ? ramp : 0;
964
+ const backdropOpacity = Math.min(
965
+ Math.max((progress - s) / range, 0),
966
+ 1
967
+ );
957
968
  if (this.backdropOpacitySentinel.shouldWrite(
958
969
  backdropOpacity,
959
970
  OPACITY_WRITE_EPSILON
@@ -2895,6 +2906,7 @@ var init_BottomSheetCore = __esm({
2895
2906
  __publicField(this, "progressWriteSentinel", new WriteSentinel());
2896
2907
  __publicField(this, "isTopSheet", true);
2897
2908
  __publicField(this, "opening", false);
2909
+ __publicField(this, "promotedForOpen", false);
2898
2910
  __publicField(this, "allowOvershoot", false);
2899
2911
  __publicField(this, "progressPayload", {
2900
2912
  value: 0,
@@ -2951,7 +2963,6 @@ var init_BottomSheetCore = __esm({
2951
2963
  screenComponent: this.screenComponent,
2952
2964
  backdrop: this.backdrop,
2953
2965
  isDestroyed: () => this.destroyed,
2954
- isTopSheet: () => this.isTopSheet,
2955
2966
  getAllowedIds: () => this.snaps.getAllowedIds().slice(),
2956
2967
  getResolvedSnaps: () => this.snaps.getResolvedSnaps().slice(),
2957
2968
  snapTo: (id) => {
@@ -3221,13 +3232,14 @@ var init_BottomSheetCore = __esm({
3221
3232
  if (!_skipBeforeSnap && this.emitBeforeSnap(target, this.activeId)) {
3222
3233
  return;
3223
3234
  }
3235
+ const resumingOpen = this.opening;
3224
3236
  const signal = this.newCycle();
3225
3237
  const onExternalAbort = () => {
3226
3238
  this.animation.cancel();
3227
3239
  this.newCycle();
3228
3240
  };
3229
3241
  externalSignal?.addEventListener("abort", onExternalAbort, { once: true });
3230
- const wasClosed = this.size === 0;
3242
+ const wasClosed = this.size === 0 || resumingOpen;
3231
3243
  const previousId = this.activeId;
3232
3244
  const previousSize = this.size;
3233
3245
  this.scrollCache.cache(previousId, previousSize, target.size);
@@ -3236,7 +3248,10 @@ var init_BottomSheetCore = __esm({
3236
3248
  const opensToRest = id === "closed" || rawTargetSize === 0;
3237
3249
  if (wasClosed && !opensToRest) {
3238
3250
  this.opening = true;
3239
- sheetStack.promote(this.id);
3251
+ if (!resumingOpen) {
3252
+ this.promotedForOpen = true;
3253
+ sheetStack.promote(this.id);
3254
+ }
3240
3255
  }
3241
3256
  if (this.animation.viewTransitionsAvailable) {
3242
3257
  this.currentViewTransition?.skipTransition?.();
@@ -3677,19 +3692,12 @@ var init_BottomSheetCore = __esm({
3677
3692
  for (const anchor of this.anchors) anchor.syncZ(z + 1);
3678
3693
  },
3679
3694
  setIsTop: (isTop) => {
3680
- if (this.isTopSheet === isTop) return;
3681
3695
  this.isTopSheet = isTop;
3682
- this.repaintScrim();
3683
3696
  },
3684
3697
  isOpen: () => this.size > 0 || this.opening,
3685
3698
  setDepth: (depth) => this.applyStackDepth(depth)
3686
3699
  }));
3687
3700
  }
3688
- repaintScrim() {
3689
- if (this.destroyed) return;
3690
- this.scrim.invalidateOpacityCache();
3691
- this.scrim.applyOpacity(this.computeProgress(this.size), true);
3692
- }
3693
3701
  applyStackDepth(depth) {
3694
3702
  if (!this.stackEffectEnabled) return;
3695
3703
  this.element.setAttribute("data-stack-depth", String(depth));
@@ -3934,6 +3942,7 @@ var init_BottomSheetCore = __esm({
3934
3942
  this.activeId = target.id;
3935
3943
  if (previousSnapSize === 0 && target.size > 0) {
3936
3944
  this.opening = true;
3945
+ this.promotedForOpen = true;
3937
3946
  sheetStack.promote(this.id);
3938
3947
  }
3939
3948
  const settleCap = this.snaps.getMaxAxisSize();
@@ -4015,7 +4024,8 @@ var init_BottomSheetCore = __esm({
4015
4024
  return Math.min(Math.max((size - min) / (reachableMax - min), 0), 1);
4016
4025
  }
4017
4026
  handleOpen() {
4018
- sheetStack.promote(this.id);
4027
+ if (this.promotedForOpen) this.promotedForOpen = false;
4028
+ else sheetStack.promote(this.id);
4019
4029
  try {
4020
4030
  this.lifecycle.install();
4021
4031
  } catch (err) {
@@ -4047,6 +4057,7 @@ var init_BottomSheetCore = __esm({
4047
4057
  }
4048
4058
  handleClose() {
4049
4059
  this.opening = false;
4060
+ this.promotedForOpen = false;
4050
4061
  this.lifecycle.release();
4051
4062
  sheetStack.update();
4052
4063
  }
@@ -1,5 +1,5 @@
1
- import { B as BottomSheetEngine } from './BottomSheetEngine-hLSAxzla.cjs';
2
- import { C as CloseReason, A as AnchorOptions, e as ScrimStagesOptions, E as EngineState } from './BottomSheetCore-CK8Rh1He.cjs';
1
+ import { B as BottomSheetEngine } from './BottomSheetEngine-mmFzIK1Z.cjs';
2
+ import { C as CloseReason, A as AnchorOptions, e as ScrimStagesOptions, E as EngineState } from './BottomSheetCore-BHv6LPmS.cjs';
3
3
  import './transform-jVfAikE9.cjs';
4
4
 
5
5
  declare const BaseHTMLElement: typeof HTMLElement;
package/dist/element.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import { B as BottomSheetEngine } from './BottomSheetEngine-CZglPsTF.js';
2
- import { C as CloseReason, A as AnchorOptions, e as ScrimStagesOptions, E as EngineState } from './BottomSheetCore-CIijwtdi.js';
1
+ import { B as BottomSheetEngine } from './BottomSheetEngine-wLn6Q2kA.js';
2
+ import { C as CloseReason, A as AnchorOptions, e as ScrimStagesOptions, E as EngineState } from './BottomSheetCore-CK_mq14p.js';
3
3
  import './transform-jVfAikE9.js';
4
4
 
5
5
  declare const BaseHTMLElement: typeof HTMLElement;