@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.
- package/README.md +9 -0
- package/dist/{BottomSheetCore-CK8Rh1He.d.cts → BottomSheetCore-BHv6LPmS.d.cts} +1 -1
- package/dist/{BottomSheetCore-CIijwtdi.d.ts → BottomSheetCore-CK_mq14p.d.ts} +1 -1
- package/dist/{BottomSheetEngine-hLSAxzla.d.cts → BottomSheetEngine-mmFzIK1Z.d.cts} +1 -1
- package/dist/{BottomSheetEngine-CZglPsTF.d.ts → BottomSheetEngine-wLn6Q2kA.d.ts} +1 -1
- package/dist/core.cjs +31 -21
- package/dist/core.d.cts +2 -2
- package/dist/core.d.ts +2 -2
- package/dist/core.js +31 -21
- package/dist/debug.d.cts +1 -1
- package/dist/debug.d.ts +1 -1
- package/dist/element.cjs +37 -26
- package/dist/element.d.cts +2 -2
- package/dist/element.d.ts +2 -2
- package/dist/element.iife.global.js +2 -2
- package/dist/element.js +37 -26
- package/dist/features.d.cts +2 -2
- package/dist/features.d.ts +2 -2
- package/dist/{index-BqLHKOeM.d.ts → index-CWKv1Xy4.d.ts} +1 -1
- package/dist/{index-BEX-NHRJ.d.cts → index-juAyT76E.d.cts} +1 -1
- package/dist/index.cjs +31 -21
- package/dist/index.d.cts +4 -4
- package/dist/index.d.ts +4 -4
- package/dist/index.js +31 -21
- package/dist/integrations/formik.d.cts +1 -1
- package/dist/integrations/formik.d.ts +1 -1
- package/dist/integrations/react-hook-form.d.cts +1 -1
- package/dist/integrations/react-hook-form.d.ts +1 -1
- package/dist/preact.d.cts +2 -2
- package/dist/preact.d.ts +2 -2
- package/dist/qwik-lib/index.qwik.cjs +29 -19
- package/dist/qwik-lib/index.qwik.mjs +29 -19
- package/dist/qwik.cjs +31 -21
- package/dist/qwik.d.cts +2 -2
- package/dist/qwik.d.ts +2 -2
- package/dist/qwik.js +31 -21
- package/dist/react.cjs +31 -21
- package/dist/react.d.cts +3 -3
- package/dist/react.d.ts +3 -3
- package/dist/react.js +31 -21
- package/dist/solid.cjs +31 -21
- package/dist/solid.d.cts +1 -1
- package/dist/solid.d.ts +1 -1
- package/dist/solid.js +31 -21
- package/dist/solid.source.jsx +31 -21
- package/dist/svelte-core.cjs +31 -21
- package/dist/svelte-core.js +31 -21
- package/dist/svelte.cjs +31 -21
- package/dist/svelte.js +31 -21
- package/dist/vue.cjs +31 -21
- package/dist/vue.js +31 -21
- package/dist/webgl.d.cts +1 -1
- package/dist/webgl.d.ts +1 -1
- package/package.json +2 -2
package/dist/solid.js
CHANGED
|
@@ -376,14 +376,26 @@ function notifyLinkedSheets(sheets, self) {
|
|
|
376
376
|
}
|
|
377
377
|
}
|
|
378
378
|
|
|
379
|
+
// src/core/primitives/hot-path-thresholds.ts
|
|
380
|
+
var SIZE_WRITE_EPSILON = 0.5;
|
|
381
|
+
var OPACITY_WRITE_EPSILON = 5e-3;
|
|
382
|
+
var POINTER_EVENTS_OPACITY_THRESHOLD = 0.05;
|
|
383
|
+
var RANGE_DIVISION_EPSILON = 1e-4;
|
|
384
|
+
|
|
379
385
|
// src/core/features/resize-observer.ts
|
|
380
386
|
function installResizeObserver(deps) {
|
|
381
387
|
if (typeof window === "undefined") {
|
|
382
388
|
return () => {
|
|
383
389
|
};
|
|
384
390
|
}
|
|
391
|
+
const seatFor = () => {
|
|
392
|
+
const snap = deps.resolveActiveSnap();
|
|
393
|
+
const max = deps.getMaxAxisSize();
|
|
394
|
+
return { target: snap ? Math.min(snap.size, max) : null, max };
|
|
395
|
+
};
|
|
385
396
|
const onResize = () => {
|
|
386
397
|
if (deps.isDestroyed()) return;
|
|
398
|
+
const before = seatFor();
|
|
387
399
|
deps.recomputeSnaps();
|
|
388
400
|
const mode = deps.getMode();
|
|
389
401
|
const isVerticalAxis = mode === "bottom" || mode === "top";
|
|
@@ -392,6 +404,10 @@ function installResizeObserver(deps) {
|
|
|
392
404
|
if (viewportSize2 > 0 && viewportSize2 < max) {
|
|
393
405
|
deps.setMaxAxisSize(viewportSize2);
|
|
394
406
|
}
|
|
407
|
+
const after = seatFor();
|
|
408
|
+
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) {
|
|
409
|
+
return;
|
|
410
|
+
}
|
|
395
411
|
const wasAnimating = deps.isAnimating?.() ?? false;
|
|
396
412
|
deps.cancelInFlight();
|
|
397
413
|
deps.newCycle();
|
|
@@ -660,12 +676,6 @@ var SCRIM_PRESETS = Object.freeze({
|
|
|
660
676
|
}
|
|
661
677
|
});
|
|
662
678
|
|
|
663
|
-
// src/core/primitives/hot-path-thresholds.ts
|
|
664
|
-
var SIZE_WRITE_EPSILON = 0.5;
|
|
665
|
-
var OPACITY_WRITE_EPSILON = 5e-3;
|
|
666
|
-
var POINTER_EVENTS_OPACITY_THRESHOLD = 0.05;
|
|
667
|
-
var RANGE_DIVISION_EPSILON = 1e-4;
|
|
668
|
-
|
|
669
679
|
// src/core/primitives/opacity-dedup.ts
|
|
670
680
|
var WriteSentinel = class {
|
|
671
681
|
constructor() {
|
|
@@ -775,7 +785,6 @@ var ScrimController = class {
|
|
|
775
785
|
__publicField(this, "backdrop");
|
|
776
786
|
__publicField(this, "mode");
|
|
777
787
|
__publicField(this, "isDestroyed");
|
|
778
|
-
__publicField(this, "isTopSheet");
|
|
779
788
|
__publicField(this, "getAllowedIds");
|
|
780
789
|
__publicField(this, "getResolvedSnaps");
|
|
781
790
|
__publicField(this, "snapToFn");
|
|
@@ -797,7 +806,6 @@ var ScrimController = class {
|
|
|
797
806
|
this.backdrop = deps.backdrop;
|
|
798
807
|
this.mode = deps.mode;
|
|
799
808
|
this.isDestroyed = deps.isDestroyed;
|
|
800
|
-
this.isTopSheet = deps.isTopSheet;
|
|
801
809
|
this.getAllowedIds = deps.getAllowedIds;
|
|
802
810
|
this.getResolvedSnaps = deps.getResolvedSnaps;
|
|
803
811
|
this.snapToFn = deps.snapTo;
|
|
@@ -842,8 +850,10 @@ var ScrimController = class {
|
|
|
842
850
|
if (this.backdrop) {
|
|
843
851
|
const [s, e] = this.backdropRange;
|
|
844
852
|
const range = Math.max(e - s, RANGE_DIVISION_EPSILON);
|
|
845
|
-
const
|
|
846
|
-
|
|
853
|
+
const backdropOpacity = Math.min(
|
|
854
|
+
Math.max((progress - s) / range, 0),
|
|
855
|
+
1
|
|
856
|
+
);
|
|
847
857
|
if (this.backdropOpacitySentinel.shouldWrite(
|
|
848
858
|
backdropOpacity,
|
|
849
859
|
OPACITY_WRITE_EPSILON
|
|
@@ -2618,6 +2628,7 @@ var BottomSheetCore = class {
|
|
|
2618
2628
|
__publicField(this, "progressWriteSentinel", new WriteSentinel());
|
|
2619
2629
|
__publicField(this, "isTopSheet", true);
|
|
2620
2630
|
__publicField(this, "opening", false);
|
|
2631
|
+
__publicField(this, "promotedForOpen", false);
|
|
2621
2632
|
__publicField(this, "allowOvershoot", false);
|
|
2622
2633
|
__publicField(this, "progressPayload", {
|
|
2623
2634
|
value: 0,
|
|
@@ -2674,7 +2685,6 @@ var BottomSheetCore = class {
|
|
|
2674
2685
|
screenComponent: this.screenComponent,
|
|
2675
2686
|
backdrop: this.backdrop,
|
|
2676
2687
|
isDestroyed: () => this.destroyed,
|
|
2677
|
-
isTopSheet: () => this.isTopSheet,
|
|
2678
2688
|
getAllowedIds: () => this.snaps.getAllowedIds().slice(),
|
|
2679
2689
|
getResolvedSnaps: () => this.snaps.getResolvedSnaps().slice(),
|
|
2680
2690
|
snapTo: (id) => {
|
|
@@ -2944,13 +2954,14 @@ var BottomSheetCore = class {
|
|
|
2944
2954
|
if (!_skipBeforeSnap && this.emitBeforeSnap(target, this.activeId)) {
|
|
2945
2955
|
return;
|
|
2946
2956
|
}
|
|
2957
|
+
const resumingOpen = this.opening;
|
|
2947
2958
|
const signal = this.newCycle();
|
|
2948
2959
|
const onExternalAbort = () => {
|
|
2949
2960
|
this.animation.cancel();
|
|
2950
2961
|
this.newCycle();
|
|
2951
2962
|
};
|
|
2952
2963
|
externalSignal?.addEventListener("abort", onExternalAbort, { once: true });
|
|
2953
|
-
const wasClosed = this.size === 0;
|
|
2964
|
+
const wasClosed = this.size === 0 || resumingOpen;
|
|
2954
2965
|
const previousId = this.activeId;
|
|
2955
2966
|
const previousSize = this.size;
|
|
2956
2967
|
this.scrollCache.cache(previousId, previousSize, target.size);
|
|
@@ -2959,7 +2970,10 @@ var BottomSheetCore = class {
|
|
|
2959
2970
|
const opensToRest = id === "closed" || rawTargetSize === 0;
|
|
2960
2971
|
if (wasClosed && !opensToRest) {
|
|
2961
2972
|
this.opening = true;
|
|
2962
|
-
|
|
2973
|
+
if (!resumingOpen) {
|
|
2974
|
+
this.promotedForOpen = true;
|
|
2975
|
+
sheetStack.promote(this.id);
|
|
2976
|
+
}
|
|
2963
2977
|
}
|
|
2964
2978
|
if (this.animation.viewTransitionsAvailable) {
|
|
2965
2979
|
this.currentViewTransition?.skipTransition?.();
|
|
@@ -3400,19 +3414,12 @@ var BottomSheetCore = class {
|
|
|
3400
3414
|
for (const anchor of this.anchors) anchor.syncZ(z + 1);
|
|
3401
3415
|
},
|
|
3402
3416
|
setIsTop: (isTop) => {
|
|
3403
|
-
if (this.isTopSheet === isTop) return;
|
|
3404
3417
|
this.isTopSheet = isTop;
|
|
3405
|
-
this.repaintScrim();
|
|
3406
3418
|
},
|
|
3407
3419
|
isOpen: () => this.size > 0 || this.opening,
|
|
3408
3420
|
setDepth: (depth) => this.applyStackDepth(depth)
|
|
3409
3421
|
}));
|
|
3410
3422
|
}
|
|
3411
|
-
repaintScrim() {
|
|
3412
|
-
if (this.destroyed) return;
|
|
3413
|
-
this.scrim.invalidateOpacityCache();
|
|
3414
|
-
this.scrim.applyOpacity(this.computeProgress(this.size), true);
|
|
3415
|
-
}
|
|
3416
3423
|
applyStackDepth(depth) {
|
|
3417
3424
|
if (!this.stackEffectEnabled) return;
|
|
3418
3425
|
this.element.setAttribute("data-stack-depth", String(depth));
|
|
@@ -3657,6 +3664,7 @@ var BottomSheetCore = class {
|
|
|
3657
3664
|
this.activeId = target.id;
|
|
3658
3665
|
if (previousSnapSize === 0 && target.size > 0) {
|
|
3659
3666
|
this.opening = true;
|
|
3667
|
+
this.promotedForOpen = true;
|
|
3660
3668
|
sheetStack.promote(this.id);
|
|
3661
3669
|
}
|
|
3662
3670
|
const settleCap = this.snaps.getMaxAxisSize();
|
|
@@ -3738,7 +3746,8 @@ var BottomSheetCore = class {
|
|
|
3738
3746
|
return Math.min(Math.max((size - min) / (reachableMax - min), 0), 1);
|
|
3739
3747
|
}
|
|
3740
3748
|
handleOpen() {
|
|
3741
|
-
|
|
3749
|
+
if (this.promotedForOpen) this.promotedForOpen = false;
|
|
3750
|
+
else sheetStack.promote(this.id);
|
|
3742
3751
|
try {
|
|
3743
3752
|
this.lifecycle.install();
|
|
3744
3753
|
} catch (err) {
|
|
@@ -3770,6 +3779,7 @@ var BottomSheetCore = class {
|
|
|
3770
3779
|
}
|
|
3771
3780
|
handleClose() {
|
|
3772
3781
|
this.opening = false;
|
|
3782
|
+
this.promotedForOpen = false;
|
|
3773
3783
|
this.lifecycle.release();
|
|
3774
3784
|
sheetStack.update();
|
|
3775
3785
|
}
|
package/dist/solid.source.jsx
CHANGED
|
@@ -381,14 +381,26 @@ function notifyLinkedSheets(sheets, self) {
|
|
|
381
381
|
}
|
|
382
382
|
}
|
|
383
383
|
|
|
384
|
+
// src/core/primitives/hot-path-thresholds.ts
|
|
385
|
+
var SIZE_WRITE_EPSILON = 0.5;
|
|
386
|
+
var OPACITY_WRITE_EPSILON = 5e-3;
|
|
387
|
+
var POINTER_EVENTS_OPACITY_THRESHOLD = 0.05;
|
|
388
|
+
var RANGE_DIVISION_EPSILON = 1e-4;
|
|
389
|
+
|
|
384
390
|
// src/core/features/resize-observer.ts
|
|
385
391
|
function installResizeObserver(deps) {
|
|
386
392
|
if (typeof window === "undefined") {
|
|
387
393
|
return () => {
|
|
388
394
|
};
|
|
389
395
|
}
|
|
396
|
+
const seatFor = () => {
|
|
397
|
+
const snap = deps.resolveActiveSnap();
|
|
398
|
+
const max = deps.getMaxAxisSize();
|
|
399
|
+
return { target: snap ? Math.min(snap.size, max) : null, max };
|
|
400
|
+
};
|
|
390
401
|
const onResize = () => {
|
|
391
402
|
if (deps.isDestroyed()) return;
|
|
403
|
+
const before = seatFor();
|
|
392
404
|
deps.recomputeSnaps();
|
|
393
405
|
const mode = deps.getMode();
|
|
394
406
|
const isVerticalAxis = mode === "bottom" || mode === "top";
|
|
@@ -397,6 +409,10 @@ function installResizeObserver(deps) {
|
|
|
397
409
|
if (viewportSize2 > 0 && viewportSize2 < max) {
|
|
398
410
|
deps.setMaxAxisSize(viewportSize2);
|
|
399
411
|
}
|
|
412
|
+
const after = seatFor();
|
|
413
|
+
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) {
|
|
414
|
+
return;
|
|
415
|
+
}
|
|
400
416
|
const wasAnimating = deps.isAnimating?.() ?? false;
|
|
401
417
|
deps.cancelInFlight();
|
|
402
418
|
deps.newCycle();
|
|
@@ -665,12 +681,6 @@ var SCRIM_PRESETS = Object.freeze({
|
|
|
665
681
|
}
|
|
666
682
|
});
|
|
667
683
|
|
|
668
|
-
// src/core/primitives/hot-path-thresholds.ts
|
|
669
|
-
var SIZE_WRITE_EPSILON = 0.5;
|
|
670
|
-
var OPACITY_WRITE_EPSILON = 5e-3;
|
|
671
|
-
var POINTER_EVENTS_OPACITY_THRESHOLD = 0.05;
|
|
672
|
-
var RANGE_DIVISION_EPSILON = 1e-4;
|
|
673
|
-
|
|
674
684
|
// src/core/primitives/opacity-dedup.ts
|
|
675
685
|
var WriteSentinel = class {
|
|
676
686
|
last = -1;
|
|
@@ -777,7 +787,6 @@ var ScrimController = class {
|
|
|
777
787
|
backdrop;
|
|
778
788
|
mode;
|
|
779
789
|
isDestroyed;
|
|
780
|
-
isTopSheet;
|
|
781
790
|
getAllowedIds;
|
|
782
791
|
getResolvedSnaps;
|
|
783
792
|
snapToFn;
|
|
@@ -804,7 +813,6 @@ var ScrimController = class {
|
|
|
804
813
|
this.backdrop = deps.backdrop;
|
|
805
814
|
this.mode = deps.mode;
|
|
806
815
|
this.isDestroyed = deps.isDestroyed;
|
|
807
|
-
this.isTopSheet = deps.isTopSheet;
|
|
808
816
|
this.getAllowedIds = deps.getAllowedIds;
|
|
809
817
|
this.getResolvedSnaps = deps.getResolvedSnaps;
|
|
810
818
|
this.snapToFn = deps.snapTo;
|
|
@@ -845,8 +853,10 @@ var ScrimController = class {
|
|
|
845
853
|
if (this.backdrop) {
|
|
846
854
|
const [s, e] = this.backdropRange;
|
|
847
855
|
const range = Math.max(e - s, RANGE_DIVISION_EPSILON);
|
|
848
|
-
const
|
|
849
|
-
|
|
856
|
+
const backdropOpacity = Math.min(
|
|
857
|
+
Math.max((progress - s) / range, 0),
|
|
858
|
+
1
|
|
859
|
+
);
|
|
850
860
|
if (this.backdropOpacitySentinel.shouldWrite(
|
|
851
861
|
backdropOpacity,
|
|
852
862
|
OPACITY_WRITE_EPSILON
|
|
@@ -2619,6 +2629,7 @@ var BottomSheetCore = class {
|
|
|
2619
2629
|
progressWriteSentinel = new WriteSentinel();
|
|
2620
2630
|
isTopSheet = true;
|
|
2621
2631
|
opening = false;
|
|
2632
|
+
promotedForOpen = false;
|
|
2622
2633
|
allowOvershoot = false;
|
|
2623
2634
|
progressPayload = {
|
|
2624
2635
|
value: 0,
|
|
@@ -2676,7 +2687,6 @@ var BottomSheetCore = class {
|
|
|
2676
2687
|
screenComponent: this.screenComponent,
|
|
2677
2688
|
backdrop: this.backdrop,
|
|
2678
2689
|
isDestroyed: () => this.destroyed,
|
|
2679
|
-
isTopSheet: () => this.isTopSheet,
|
|
2680
2690
|
getAllowedIds: () => this.snaps.getAllowedIds().slice(),
|
|
2681
2691
|
getResolvedSnaps: () => this.snaps.getResolvedSnaps().slice(),
|
|
2682
2692
|
snapTo: (id) => {
|
|
@@ -2946,13 +2956,14 @@ var BottomSheetCore = class {
|
|
|
2946
2956
|
if (!_skipBeforeSnap && this.emitBeforeSnap(target, this.activeId)) {
|
|
2947
2957
|
return;
|
|
2948
2958
|
}
|
|
2959
|
+
const resumingOpen = this.opening;
|
|
2949
2960
|
const signal = this.newCycle();
|
|
2950
2961
|
const onExternalAbort = () => {
|
|
2951
2962
|
this.animation.cancel();
|
|
2952
2963
|
this.newCycle();
|
|
2953
2964
|
};
|
|
2954
2965
|
externalSignal?.addEventListener("abort", onExternalAbort, { once: true });
|
|
2955
|
-
const wasClosed = this.size === 0;
|
|
2966
|
+
const wasClosed = this.size === 0 || resumingOpen;
|
|
2956
2967
|
const previousId = this.activeId;
|
|
2957
2968
|
const previousSize = this.size;
|
|
2958
2969
|
this.scrollCache.cache(previousId, previousSize, target.size);
|
|
@@ -2961,7 +2972,10 @@ var BottomSheetCore = class {
|
|
|
2961
2972
|
const opensToRest = id === "closed" || rawTargetSize === 0;
|
|
2962
2973
|
if (wasClosed && !opensToRest) {
|
|
2963
2974
|
this.opening = true;
|
|
2964
|
-
|
|
2975
|
+
if (!resumingOpen) {
|
|
2976
|
+
this.promotedForOpen = true;
|
|
2977
|
+
sheetStack.promote(this.id);
|
|
2978
|
+
}
|
|
2965
2979
|
}
|
|
2966
2980
|
if (this.animation.viewTransitionsAvailable) {
|
|
2967
2981
|
this.currentViewTransition?.skipTransition?.();
|
|
@@ -3402,19 +3416,12 @@ var BottomSheetCore = class {
|
|
|
3402
3416
|
for (const anchor of this.anchors) anchor.syncZ(z + 1);
|
|
3403
3417
|
},
|
|
3404
3418
|
setIsTop: (isTop) => {
|
|
3405
|
-
if (this.isTopSheet === isTop) return;
|
|
3406
3419
|
this.isTopSheet = isTop;
|
|
3407
|
-
this.repaintScrim();
|
|
3408
3420
|
},
|
|
3409
3421
|
isOpen: () => this.size > 0 || this.opening,
|
|
3410
3422
|
setDepth: (depth) => this.applyStackDepth(depth)
|
|
3411
3423
|
}));
|
|
3412
3424
|
}
|
|
3413
|
-
repaintScrim() {
|
|
3414
|
-
if (this.destroyed) return;
|
|
3415
|
-
this.scrim.invalidateOpacityCache();
|
|
3416
|
-
this.scrim.applyOpacity(this.computeProgress(this.size), true);
|
|
3417
|
-
}
|
|
3418
3425
|
applyStackDepth(depth) {
|
|
3419
3426
|
if (!this.stackEffectEnabled) return;
|
|
3420
3427
|
this.element.setAttribute("data-stack-depth", String(depth));
|
|
@@ -3659,6 +3666,7 @@ var BottomSheetCore = class {
|
|
|
3659
3666
|
this.activeId = target.id;
|
|
3660
3667
|
if (previousSnapSize === 0 && target.size > 0) {
|
|
3661
3668
|
this.opening = true;
|
|
3669
|
+
this.promotedForOpen = true;
|
|
3662
3670
|
sheetStack.promote(this.id);
|
|
3663
3671
|
}
|
|
3664
3672
|
const settleCap = this.snaps.getMaxAxisSize();
|
|
@@ -3740,7 +3748,8 @@ var BottomSheetCore = class {
|
|
|
3740
3748
|
return Math.min(Math.max((size - min) / (reachableMax - min), 0), 1);
|
|
3741
3749
|
}
|
|
3742
3750
|
handleOpen() {
|
|
3743
|
-
|
|
3751
|
+
if (this.promotedForOpen) this.promotedForOpen = false;
|
|
3752
|
+
else sheetStack.promote(this.id);
|
|
3744
3753
|
try {
|
|
3745
3754
|
this.lifecycle.install();
|
|
3746
3755
|
} catch (err) {
|
|
@@ -3772,6 +3781,7 @@ var BottomSheetCore = class {
|
|
|
3772
3781
|
}
|
|
3773
3782
|
handleClose() {
|
|
3774
3783
|
this.opening = false;
|
|
3784
|
+
this.promotedForOpen = false;
|
|
3775
3785
|
this.lifecycle.release();
|
|
3776
3786
|
sheetStack.update();
|
|
3777
3787
|
}
|
package/dist/svelte-core.cjs
CHANGED
|
@@ -377,14 +377,26 @@ function notifyLinkedSheets(sheets, self) {
|
|
|
377
377
|
}
|
|
378
378
|
}
|
|
379
379
|
|
|
380
|
+
// src/core/primitives/hot-path-thresholds.ts
|
|
381
|
+
var SIZE_WRITE_EPSILON = 0.5;
|
|
382
|
+
var OPACITY_WRITE_EPSILON = 5e-3;
|
|
383
|
+
var POINTER_EVENTS_OPACITY_THRESHOLD = 0.05;
|
|
384
|
+
var RANGE_DIVISION_EPSILON = 1e-4;
|
|
385
|
+
|
|
380
386
|
// src/core/features/resize-observer.ts
|
|
381
387
|
function installResizeObserver(deps) {
|
|
382
388
|
if (typeof window === "undefined") {
|
|
383
389
|
return () => {
|
|
384
390
|
};
|
|
385
391
|
}
|
|
392
|
+
const seatFor = () => {
|
|
393
|
+
const snap = deps.resolveActiveSnap();
|
|
394
|
+
const max = deps.getMaxAxisSize();
|
|
395
|
+
return { target: snap ? Math.min(snap.size, max) : null, max };
|
|
396
|
+
};
|
|
386
397
|
const onResize = () => {
|
|
387
398
|
if (deps.isDestroyed()) return;
|
|
399
|
+
const before = seatFor();
|
|
388
400
|
deps.recomputeSnaps();
|
|
389
401
|
const mode = deps.getMode();
|
|
390
402
|
const isVerticalAxis = mode === "bottom" || mode === "top";
|
|
@@ -393,6 +405,10 @@ function installResizeObserver(deps) {
|
|
|
393
405
|
if (viewportSize2 > 0 && viewportSize2 < max) {
|
|
394
406
|
deps.setMaxAxisSize(viewportSize2);
|
|
395
407
|
}
|
|
408
|
+
const after = seatFor();
|
|
409
|
+
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) {
|
|
410
|
+
return;
|
|
411
|
+
}
|
|
396
412
|
const wasAnimating = deps.isAnimating?.() ?? false;
|
|
397
413
|
deps.cancelInFlight();
|
|
398
414
|
deps.newCycle();
|
|
@@ -661,12 +677,6 @@ var SCRIM_PRESETS = Object.freeze({
|
|
|
661
677
|
}
|
|
662
678
|
});
|
|
663
679
|
|
|
664
|
-
// src/core/primitives/hot-path-thresholds.ts
|
|
665
|
-
var SIZE_WRITE_EPSILON = 0.5;
|
|
666
|
-
var OPACITY_WRITE_EPSILON = 5e-3;
|
|
667
|
-
var POINTER_EVENTS_OPACITY_THRESHOLD = 0.05;
|
|
668
|
-
var RANGE_DIVISION_EPSILON = 1e-4;
|
|
669
|
-
|
|
670
680
|
// src/core/primitives/opacity-dedup.ts
|
|
671
681
|
var WriteSentinel = class {
|
|
672
682
|
constructor() {
|
|
@@ -776,7 +786,6 @@ var ScrimController = class {
|
|
|
776
786
|
__publicField(this, "backdrop");
|
|
777
787
|
__publicField(this, "mode");
|
|
778
788
|
__publicField(this, "isDestroyed");
|
|
779
|
-
__publicField(this, "isTopSheet");
|
|
780
789
|
__publicField(this, "getAllowedIds");
|
|
781
790
|
__publicField(this, "getResolvedSnaps");
|
|
782
791
|
__publicField(this, "snapToFn");
|
|
@@ -798,7 +807,6 @@ var ScrimController = class {
|
|
|
798
807
|
this.backdrop = deps.backdrop;
|
|
799
808
|
this.mode = deps.mode;
|
|
800
809
|
this.isDestroyed = deps.isDestroyed;
|
|
801
|
-
this.isTopSheet = deps.isTopSheet;
|
|
802
810
|
this.getAllowedIds = deps.getAllowedIds;
|
|
803
811
|
this.getResolvedSnaps = deps.getResolvedSnaps;
|
|
804
812
|
this.snapToFn = deps.snapTo;
|
|
@@ -843,8 +851,10 @@ var ScrimController = class {
|
|
|
843
851
|
if (this.backdrop) {
|
|
844
852
|
const [s, e] = this.backdropRange;
|
|
845
853
|
const range = Math.max(e - s, RANGE_DIVISION_EPSILON);
|
|
846
|
-
const
|
|
847
|
-
|
|
854
|
+
const backdropOpacity = Math.min(
|
|
855
|
+
Math.max((progress - s) / range, 0),
|
|
856
|
+
1
|
|
857
|
+
);
|
|
848
858
|
if (this.backdropOpacitySentinel.shouldWrite(
|
|
849
859
|
backdropOpacity,
|
|
850
860
|
OPACITY_WRITE_EPSILON
|
|
@@ -2619,6 +2629,7 @@ var BottomSheetCore = class {
|
|
|
2619
2629
|
__publicField(this, "progressWriteSentinel", new WriteSentinel());
|
|
2620
2630
|
__publicField(this, "isTopSheet", true);
|
|
2621
2631
|
__publicField(this, "opening", false);
|
|
2632
|
+
__publicField(this, "promotedForOpen", false);
|
|
2622
2633
|
__publicField(this, "allowOvershoot", false);
|
|
2623
2634
|
__publicField(this, "progressPayload", {
|
|
2624
2635
|
value: 0,
|
|
@@ -2675,7 +2686,6 @@ var BottomSheetCore = class {
|
|
|
2675
2686
|
screenComponent: this.screenComponent,
|
|
2676
2687
|
backdrop: this.backdrop,
|
|
2677
2688
|
isDestroyed: () => this.destroyed,
|
|
2678
|
-
isTopSheet: () => this.isTopSheet,
|
|
2679
2689
|
getAllowedIds: () => this.snaps.getAllowedIds().slice(),
|
|
2680
2690
|
getResolvedSnaps: () => this.snaps.getResolvedSnaps().slice(),
|
|
2681
2691
|
snapTo: (id) => {
|
|
@@ -2945,13 +2955,14 @@ var BottomSheetCore = class {
|
|
|
2945
2955
|
if (!_skipBeforeSnap && this.emitBeforeSnap(target, this.activeId)) {
|
|
2946
2956
|
return;
|
|
2947
2957
|
}
|
|
2958
|
+
const resumingOpen = this.opening;
|
|
2948
2959
|
const signal = this.newCycle();
|
|
2949
2960
|
const onExternalAbort = () => {
|
|
2950
2961
|
this.animation.cancel();
|
|
2951
2962
|
this.newCycle();
|
|
2952
2963
|
};
|
|
2953
2964
|
externalSignal?.addEventListener("abort", onExternalAbort, { once: true });
|
|
2954
|
-
const wasClosed = this.size === 0;
|
|
2965
|
+
const wasClosed = this.size === 0 || resumingOpen;
|
|
2955
2966
|
const previousId = this.activeId;
|
|
2956
2967
|
const previousSize = this.size;
|
|
2957
2968
|
this.scrollCache.cache(previousId, previousSize, target.size);
|
|
@@ -2960,7 +2971,10 @@ var BottomSheetCore = class {
|
|
|
2960
2971
|
const opensToRest = id === "closed" || rawTargetSize === 0;
|
|
2961
2972
|
if (wasClosed && !opensToRest) {
|
|
2962
2973
|
this.opening = true;
|
|
2963
|
-
|
|
2974
|
+
if (!resumingOpen) {
|
|
2975
|
+
this.promotedForOpen = true;
|
|
2976
|
+
sheetStack.promote(this.id);
|
|
2977
|
+
}
|
|
2964
2978
|
}
|
|
2965
2979
|
if (this.animation.viewTransitionsAvailable) {
|
|
2966
2980
|
this.currentViewTransition?.skipTransition?.();
|
|
@@ -3401,19 +3415,12 @@ var BottomSheetCore = class {
|
|
|
3401
3415
|
for (const anchor of this.anchors) anchor.syncZ(z + 1);
|
|
3402
3416
|
},
|
|
3403
3417
|
setIsTop: (isTop) => {
|
|
3404
|
-
if (this.isTopSheet === isTop) return;
|
|
3405
3418
|
this.isTopSheet = isTop;
|
|
3406
|
-
this.repaintScrim();
|
|
3407
3419
|
},
|
|
3408
3420
|
isOpen: () => this.size > 0 || this.opening,
|
|
3409
3421
|
setDepth: (depth) => this.applyStackDepth(depth)
|
|
3410
3422
|
}));
|
|
3411
3423
|
}
|
|
3412
|
-
repaintScrim() {
|
|
3413
|
-
if (this.destroyed) return;
|
|
3414
|
-
this.scrim.invalidateOpacityCache();
|
|
3415
|
-
this.scrim.applyOpacity(this.computeProgress(this.size), true);
|
|
3416
|
-
}
|
|
3417
3424
|
applyStackDepth(depth) {
|
|
3418
3425
|
if (!this.stackEffectEnabled) return;
|
|
3419
3426
|
this.element.setAttribute("data-stack-depth", String(depth));
|
|
@@ -3658,6 +3665,7 @@ var BottomSheetCore = class {
|
|
|
3658
3665
|
this.activeId = target.id;
|
|
3659
3666
|
if (previousSnapSize === 0 && target.size > 0) {
|
|
3660
3667
|
this.opening = true;
|
|
3668
|
+
this.promotedForOpen = true;
|
|
3661
3669
|
sheetStack.promote(this.id);
|
|
3662
3670
|
}
|
|
3663
3671
|
const settleCap = this.snaps.getMaxAxisSize();
|
|
@@ -3739,7 +3747,8 @@ var BottomSheetCore = class {
|
|
|
3739
3747
|
return Math.min(Math.max((size - min) / (reachableMax - min), 0), 1);
|
|
3740
3748
|
}
|
|
3741
3749
|
handleOpen() {
|
|
3742
|
-
|
|
3750
|
+
if (this.promotedForOpen) this.promotedForOpen = false;
|
|
3751
|
+
else sheetStack.promote(this.id);
|
|
3743
3752
|
try {
|
|
3744
3753
|
this.lifecycle.install();
|
|
3745
3754
|
} catch (err) {
|
|
@@ -3771,6 +3780,7 @@ var BottomSheetCore = class {
|
|
|
3771
3780
|
}
|
|
3772
3781
|
handleClose() {
|
|
3773
3782
|
this.opening = false;
|
|
3783
|
+
this.promotedForOpen = false;
|
|
3774
3784
|
this.lifecycle.release();
|
|
3775
3785
|
sheetStack.update();
|
|
3776
3786
|
}
|
package/dist/svelte-core.js
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
|
|
845
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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
|
}
|