@surdeddd/bottom-sheet 0.7.0 → 0.8.0

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/dist/index.cjs CHANGED
@@ -2364,6 +2364,7 @@ var BottomSheetEngine = class {
2364
2364
  __publicField(this, "progressWriteSentinel", new WriteSentinel());
2365
2365
  __publicField(this, "isTopSheet", true);
2366
2366
  __publicField(this, "opening", false);
2367
+ __publicField(this, "allowOvershoot", false);
2367
2368
  __publicField(this, "progressPayload", {
2368
2369
  value: 0,
2369
2370
  size: 0
@@ -2916,40 +2917,32 @@ var BottomSheetEngine = class {
2916
2917
  }
2917
2918
  return out;
2918
2919
  }
2919
- measureContentExtent(vertical) {
2920
+ measureSheetNatural(vertical) {
2921
+ const el = this.element;
2920
2922
  const content = this.scrollContainer;
2921
- if (!content) return 0;
2922
- const targets = this.contentTargets();
2923
- if (targets.length === 0) {
2924
- return vertical ? content.scrollHeight : content.scrollWidth;
2925
- }
2926
- let min = Infinity;
2927
- let max = -Infinity;
2928
- for (const el of targets) {
2929
- const r = el.getBoundingClientRect();
2930
- if (vertical) {
2931
- if (r.top < min) min = r.top;
2932
- if (r.bottom > max) max = r.bottom;
2933
- } else {
2934
- if (r.left < min) min = r.left;
2935
- if (r.right > max) max = r.right;
2936
- }
2937
- }
2938
- if (!isFinite(min) || !isFinite(max) || max <= min) {
2939
- return vertical ? content.scrollHeight : content.scrollWidth;
2940
- }
2941
- let pad = 0;
2942
- if (typeof getComputedStyle !== "undefined") {
2943
- const cs = getComputedStyle(content);
2944
- pad = vertical ? (parseFloat(cs.paddingTop) || 0) + (parseFloat(cs.paddingBottom) || 0) : (parseFloat(cs.paddingLeft) || 0) + (parseFloat(cs.paddingRight) || 0);
2945
- }
2946
- return max - min + pad;
2923
+ if (!content) {
2924
+ return vertical ? el.offsetHeight : el.offsetWidth;
2925
+ }
2926
+ const axis = vertical ? "height" : "width";
2927
+ const sheetStyle = el.style;
2928
+ const cs = content.style;
2929
+ const prevSheet = sheetStyle[axis];
2930
+ const prevFlex = cs.flex;
2931
+ const prevContent = vertical ? cs.height : cs.width;
2932
+ sheetStyle[axis] = "auto";
2933
+ cs.flex = "none";
2934
+ if (vertical) cs.height = "auto";
2935
+ else cs.width = "auto";
2936
+ const natural = vertical ? el.offsetHeight : el.offsetWidth;
2937
+ sheetStyle[axis] = prevSheet;
2938
+ cs.flex = prevFlex;
2939
+ if (vertical) cs.height = prevContent;
2940
+ else cs.width = prevContent;
2941
+ return natural;
2947
2942
  }
2948
2943
  measureFitSize() {
2949
2944
  const vertical = layoutAxis(this.mode) === "height";
2950
- const handleSize = vertical ? this.handle.offsetHeight : this.handle.offsetWidth;
2951
- const content = this.scrollContainer;
2952
- const natural = content ? handleSize + this.measureContentExtent(vertical) : handleSize;
2945
+ const natural = this.measureSheetNatural(vertical);
2953
2946
  const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
2954
2947
  if (typeof window === "undefined") return capped;
2955
2948
  const viewport = vertical ? window.innerHeight : window.innerWidth;
@@ -3035,6 +3028,10 @@ var BottomSheetEngine = class {
3035
3028
  this.backdrop.style.opacity = "";
3036
3029
  this.backdrop.style.pointerEvents = "";
3037
3030
  }
3031
+ if (this.anchorHost) {
3032
+ this.anchorHost.style.removeProperty("--bs-size");
3033
+ this.anchorHost.style.removeProperty("--bs-progress");
3034
+ }
3038
3035
  if (this.screenComponent) {
3039
3036
  this.screenComponent.style.opacity = "";
3040
3037
  this.screenComponent.style.display = "";
@@ -3046,6 +3043,7 @@ var BottomSheetEngine = class {
3046
3043
  this.bus.emit(event, payload);
3047
3044
  }
3048
3045
  newCycle() {
3046
+ this.allowOvershoot = false;
3049
3047
  this.currentAbort.abort();
3050
3048
  this.currentAbort = new AbortController();
3051
3049
  return this.currentAbort.signal;
@@ -3111,6 +3109,7 @@ var BottomSheetEngine = class {
3111
3109
  seen.add(p.id);
3112
3110
  }
3113
3111
  this.snaps.setRaw(this.snapPointsRaw);
3112
+ this.clampToMaxHeight();
3114
3113
  this.scrim.invalidateOpacityCache();
3115
3114
  }
3116
3115
  getAllowedRange() {
@@ -3317,9 +3316,13 @@ var BottomSheetEngine = class {
3317
3316
  this.opening = true;
3318
3317
  sheetStack.promote(this.id);
3319
3318
  }
3320
- void this.animation.animateTo(target.size, velocity).then(() => {
3321
- this.opening = false;
3319
+ const settleCap = this.snaps.getMaxAxisSize();
3320
+ const settleSize = settleCap > 0 ? Math.min(target.size, settleCap) : target.size;
3321
+ this.allowOvershoot = true;
3322
+ void this.animation.animateTo(settleSize, velocity).then(() => {
3322
3323
  if (signal.aborted) return;
3324
+ this.allowOvershoot = false;
3325
+ this.opening = false;
3323
3326
  this.scrollCache.restore(target.id, previousSize, target.size);
3324
3327
  this.updateAriaSlider();
3325
3328
  this.emit("snap", {
@@ -3351,7 +3354,7 @@ var BottomSheetEngine = class {
3351
3354
  }
3352
3355
  applySize(size) {
3353
3356
  const cap = this.snaps.getMaxAxisSize();
3354
- const clamped = cap > 0 && size > cap && !this.gesture?.isDragging ? cap : size;
3357
+ const clamped = cap > 0 && size > cap && !this.gesture?.isDragging && !this.allowOvershoot ? cap : size;
3355
3358
  this.size = clamped;
3356
3359
  const offset = cap - clamped;
3357
3360
  const style = this.element.style;
package/dist/index.d.cts CHANGED
@@ -1,5 +1,5 @@
1
- import { d as SnapPoint, b as SheetMode, a as SnapPointDef, c as EngineOptions, f as ScrimOverlayPosition } from './BottomSheetEngine-CqiCz64W.cjs';
2
- export { g as AnchorAnimationPreset, h as AnchorAnimationSpec, i as AnchorHandle, A as AnchorOptions, j as AnchorPosition, k as AnchorState, B as BottomSheetEngine, C as CloseReason, E as EngineState, P as Plugin, l as SCRIM_PRESETS, m as ScrimOverlayOptions, n as ScrimPreset, o as ScrimPresetConfig, p as ScrimStageDef, S as ScrimStagesOptions, q as ScrimUpdate, e as SheetEventMap, r as SnapId, T as TeardownScope, s as runAnchorTransition } from './BottomSheetEngine-CqiCz64W.cjs';
1
+ import { d as SnapPoint, b as SheetMode, a as SnapPointDef, c as EngineOptions, f as ScrimOverlayPosition } from './BottomSheetEngine-BD1mSExI.cjs';
2
+ export { g as AnchorAnimationPreset, h as AnchorAnimationSpec, i as AnchorHandle, A as AnchorOptions, j as AnchorPosition, k as AnchorState, B as BottomSheetEngine, C as CloseReason, E as EngineState, P as Plugin, l as SCRIM_PRESETS, m as ScrimOverlayOptions, n as ScrimPreset, o as ScrimPresetConfig, p as ScrimStageDef, S as ScrimStagesOptions, q as ScrimUpdate, e as SheetEventMap, r as SnapId, T as TeardownScope, s as runAnchorTransition } from './BottomSheetEngine-BD1mSExI.cjs';
3
3
  export { OVERLAY_PRESETS, Overlay, OverlayAnimation, OverlayCloseReason, OverlayEdge, Overlay as OverlayEngine, OverlayEventMap, OverlayMountTarget, OverlayOptions, OverlayPreset, OverlayState, OverlayUpdate, SwipeToCloseConfig, createOverlay } from './overlay.cjs';
4
4
  import './transform-jVfAikE9.cjs';
5
5
 
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import { d as SnapPoint, b as SheetMode, a as SnapPointDef, c as EngineOptions, f as ScrimOverlayPosition } from './BottomSheetEngine-BHjKFtnM.js';
2
- export { g as AnchorAnimationPreset, h as AnchorAnimationSpec, i as AnchorHandle, A as AnchorOptions, j as AnchorPosition, k as AnchorState, B as BottomSheetEngine, C as CloseReason, E as EngineState, P as Plugin, l as SCRIM_PRESETS, m as ScrimOverlayOptions, n as ScrimPreset, o as ScrimPresetConfig, p as ScrimStageDef, S as ScrimStagesOptions, q as ScrimUpdate, e as SheetEventMap, r as SnapId, T as TeardownScope, s as runAnchorTransition } from './BottomSheetEngine-BHjKFtnM.js';
1
+ import { d as SnapPoint, b as SheetMode, a as SnapPointDef, c as EngineOptions, f as ScrimOverlayPosition } from './BottomSheetEngine-BDGRWa2i.js';
2
+ export { g as AnchorAnimationPreset, h as AnchorAnimationSpec, i as AnchorHandle, A as AnchorOptions, j as AnchorPosition, k as AnchorState, B as BottomSheetEngine, C as CloseReason, E as EngineState, P as Plugin, l as SCRIM_PRESETS, m as ScrimOverlayOptions, n as ScrimPreset, o as ScrimPresetConfig, p as ScrimStageDef, S as ScrimStagesOptions, q as ScrimUpdate, e as SheetEventMap, r as SnapId, T as TeardownScope, s as runAnchorTransition } from './BottomSheetEngine-BDGRWa2i.js';
3
3
  export { OVERLAY_PRESETS, Overlay, OverlayAnimation, OverlayCloseReason, OverlayEdge, Overlay as OverlayEngine, OverlayEventMap, OverlayMountTarget, OverlayOptions, OverlayPreset, OverlayState, OverlayUpdate, SwipeToCloseConfig, createOverlay } from './overlay.js';
4
4
  import './transform-jVfAikE9.js';
5
5
 
package/dist/index.js CHANGED
@@ -2362,6 +2362,7 @@ var BottomSheetEngine = class {
2362
2362
  __publicField(this, "progressWriteSentinel", new WriteSentinel());
2363
2363
  __publicField(this, "isTopSheet", true);
2364
2364
  __publicField(this, "opening", false);
2365
+ __publicField(this, "allowOvershoot", false);
2365
2366
  __publicField(this, "progressPayload", {
2366
2367
  value: 0,
2367
2368
  size: 0
@@ -2914,40 +2915,32 @@ var BottomSheetEngine = class {
2914
2915
  }
2915
2916
  return out;
2916
2917
  }
2917
- measureContentExtent(vertical) {
2918
+ measureSheetNatural(vertical) {
2919
+ const el = this.element;
2918
2920
  const content = this.scrollContainer;
2919
- if (!content) return 0;
2920
- const targets = this.contentTargets();
2921
- if (targets.length === 0) {
2922
- return vertical ? content.scrollHeight : content.scrollWidth;
2923
- }
2924
- let min = Infinity;
2925
- let max = -Infinity;
2926
- for (const el of targets) {
2927
- const r = el.getBoundingClientRect();
2928
- if (vertical) {
2929
- if (r.top < min) min = r.top;
2930
- if (r.bottom > max) max = r.bottom;
2931
- } else {
2932
- if (r.left < min) min = r.left;
2933
- if (r.right > max) max = r.right;
2934
- }
2935
- }
2936
- if (!isFinite(min) || !isFinite(max) || max <= min) {
2937
- return vertical ? content.scrollHeight : content.scrollWidth;
2938
- }
2939
- let pad = 0;
2940
- if (typeof getComputedStyle !== "undefined") {
2941
- const cs = getComputedStyle(content);
2942
- pad = vertical ? (parseFloat(cs.paddingTop) || 0) + (parseFloat(cs.paddingBottom) || 0) : (parseFloat(cs.paddingLeft) || 0) + (parseFloat(cs.paddingRight) || 0);
2943
- }
2944
- return max - min + pad;
2921
+ if (!content) {
2922
+ return vertical ? el.offsetHeight : el.offsetWidth;
2923
+ }
2924
+ const axis = vertical ? "height" : "width";
2925
+ const sheetStyle = el.style;
2926
+ const cs = content.style;
2927
+ const prevSheet = sheetStyle[axis];
2928
+ const prevFlex = cs.flex;
2929
+ const prevContent = vertical ? cs.height : cs.width;
2930
+ sheetStyle[axis] = "auto";
2931
+ cs.flex = "none";
2932
+ if (vertical) cs.height = "auto";
2933
+ else cs.width = "auto";
2934
+ const natural = vertical ? el.offsetHeight : el.offsetWidth;
2935
+ sheetStyle[axis] = prevSheet;
2936
+ cs.flex = prevFlex;
2937
+ if (vertical) cs.height = prevContent;
2938
+ else cs.width = prevContent;
2939
+ return natural;
2945
2940
  }
2946
2941
  measureFitSize() {
2947
2942
  const vertical = layoutAxis(this.mode) === "height";
2948
- const handleSize = vertical ? this.handle.offsetHeight : this.handle.offsetWidth;
2949
- const content = this.scrollContainer;
2950
- const natural = content ? handleSize + this.measureContentExtent(vertical) : handleSize;
2943
+ const natural = this.measureSheetNatural(vertical);
2951
2944
  const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
2952
2945
  if (typeof window === "undefined") return capped;
2953
2946
  const viewport = vertical ? window.innerHeight : window.innerWidth;
@@ -3033,6 +3026,10 @@ var BottomSheetEngine = class {
3033
3026
  this.backdrop.style.opacity = "";
3034
3027
  this.backdrop.style.pointerEvents = "";
3035
3028
  }
3029
+ if (this.anchorHost) {
3030
+ this.anchorHost.style.removeProperty("--bs-size");
3031
+ this.anchorHost.style.removeProperty("--bs-progress");
3032
+ }
3036
3033
  if (this.screenComponent) {
3037
3034
  this.screenComponent.style.opacity = "";
3038
3035
  this.screenComponent.style.display = "";
@@ -3044,6 +3041,7 @@ var BottomSheetEngine = class {
3044
3041
  this.bus.emit(event, payload);
3045
3042
  }
3046
3043
  newCycle() {
3044
+ this.allowOvershoot = false;
3047
3045
  this.currentAbort.abort();
3048
3046
  this.currentAbort = new AbortController();
3049
3047
  return this.currentAbort.signal;
@@ -3109,6 +3107,7 @@ var BottomSheetEngine = class {
3109
3107
  seen.add(p.id);
3110
3108
  }
3111
3109
  this.snaps.setRaw(this.snapPointsRaw);
3110
+ this.clampToMaxHeight();
3112
3111
  this.scrim.invalidateOpacityCache();
3113
3112
  }
3114
3113
  getAllowedRange() {
@@ -3315,9 +3314,13 @@ var BottomSheetEngine = class {
3315
3314
  this.opening = true;
3316
3315
  sheetStack.promote(this.id);
3317
3316
  }
3318
- void this.animation.animateTo(target.size, velocity).then(() => {
3319
- this.opening = false;
3317
+ const settleCap = this.snaps.getMaxAxisSize();
3318
+ const settleSize = settleCap > 0 ? Math.min(target.size, settleCap) : target.size;
3319
+ this.allowOvershoot = true;
3320
+ void this.animation.animateTo(settleSize, velocity).then(() => {
3320
3321
  if (signal.aborted) return;
3322
+ this.allowOvershoot = false;
3323
+ this.opening = false;
3321
3324
  this.scrollCache.restore(target.id, previousSize, target.size);
3322
3325
  this.updateAriaSlider();
3323
3326
  this.emit("snap", {
@@ -3349,7 +3352,7 @@ var BottomSheetEngine = class {
3349
3352
  }
3350
3353
  applySize(size) {
3351
3354
  const cap = this.snaps.getMaxAxisSize();
3352
- const clamped = cap > 0 && size > cap && !this.gesture?.isDragging ? cap : size;
3355
+ const clamped = cap > 0 && size > cap && !this.gesture?.isDragging && !this.allowOvershoot ? cap : size;
3353
3356
  this.size = clamped;
3354
3357
  const offset = cap - clamped;
3355
3358
  const style = this.element.style;
@@ -1,4 +1,4 @@
1
- import { e as SheetEventMap } from '../BottomSheetEngine-CqiCz64W.cjs';
1
+ import { e as SheetEventMap } from '../BottomSheetEngine-BD1mSExI.cjs';
2
2
  import '../transform-jVfAikE9.cjs';
3
3
 
4
4
  type FormikStateLike = {
@@ -1,4 +1,4 @@
1
- import { e as SheetEventMap } from '../BottomSheetEngine-BHjKFtnM.js';
1
+ import { e as SheetEventMap } from '../BottomSheetEngine-BDGRWa2i.js';
2
2
  import '../transform-jVfAikE9.js';
3
3
 
4
4
  type FormikStateLike = {
@@ -1,4 +1,4 @@
1
- import { e as SheetEventMap } from '../BottomSheetEngine-CqiCz64W.cjs';
1
+ import { e as SheetEventMap } from '../BottomSheetEngine-BD1mSExI.cjs';
2
2
  import '../transform-jVfAikE9.cjs';
3
3
 
4
4
  type RhfFormStateLike = {
@@ -1,4 +1,4 @@
1
- import { e as SheetEventMap } from '../BottomSheetEngine-BHjKFtnM.js';
1
+ import { e as SheetEventMap } from '../BottomSheetEngine-BDGRWa2i.js';
2
2
  import '../transform-jVfAikE9.js';
3
3
 
4
4
  type RhfFormStateLike = {
package/dist/preact.d.cts CHANGED
@@ -1,5 +1,5 @@
1
1
  export { BottomSheet, BottomSheetFromConfig, BottomSheetFromConfigProps, BottomSheetHandle, BottomSheetProps, HeaderProp, Overlay, OverlayHandle, OverlayProps, SheetConfig, UseBottomSheetRefs, UseBottomSheetReturn, UseOverlayReturn, useBottomSheet, useOverlay } from './react.cjs';
2
- export { E as EngineState, b as SheetMode, d as SnapPoint, a as SnapPointDef } from './BottomSheetEngine-CqiCz64W.cjs';
2
+ export { E as EngineState, b as SheetMode, d as SnapPoint, a as SnapPointDef } from './BottomSheetEngine-BD1mSExI.cjs';
3
3
  export { OverlayEdge, OverlayOptions, OverlayState } from './overlay.cjs';
4
4
  import 'react';
5
5
  import './transform-jVfAikE9.cjs';
package/dist/preact.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  export { BottomSheet, BottomSheetFromConfig, BottomSheetFromConfigProps, BottomSheetHandle, BottomSheetProps, HeaderProp, Overlay, OverlayHandle, OverlayProps, SheetConfig, UseBottomSheetRefs, UseBottomSheetReturn, UseOverlayReturn, useBottomSheet, useOverlay } from './react.js';
2
- export { E as EngineState, b as SheetMode, d as SnapPoint, a as SnapPointDef } from './BottomSheetEngine-BHjKFtnM.js';
2
+ export { E as EngineState, b as SheetMode, d as SnapPoint, a as SnapPointDef } from './BottomSheetEngine-BDGRWa2i.js';
3
3
  export { OverlayEdge, OverlayOptions, OverlayState } from './overlay.js';
4
4
  import 'react';
5
5
  import './transform-jVfAikE9.js';
package/dist/qwik.cjs CHANGED
@@ -2360,6 +2360,7 @@ var BottomSheetEngine = class {
2360
2360
  __publicField(this, "progressWriteSentinel", new WriteSentinel());
2361
2361
  __publicField(this, "isTopSheet", true);
2362
2362
  __publicField(this, "opening", false);
2363
+ __publicField(this, "allowOvershoot", false);
2363
2364
  __publicField(this, "progressPayload", {
2364
2365
  value: 0,
2365
2366
  size: 0
@@ -2912,40 +2913,32 @@ var BottomSheetEngine = class {
2912
2913
  }
2913
2914
  return out;
2914
2915
  }
2915
- measureContentExtent(vertical) {
2916
+ measureSheetNatural(vertical) {
2917
+ const el = this.element;
2916
2918
  const content = this.scrollContainer;
2917
- if (!content) return 0;
2918
- const targets = this.contentTargets();
2919
- if (targets.length === 0) {
2920
- return vertical ? content.scrollHeight : content.scrollWidth;
2921
- }
2922
- let min = Infinity;
2923
- let max = -Infinity;
2924
- for (const el of targets) {
2925
- const r = el.getBoundingClientRect();
2926
- if (vertical) {
2927
- if (r.top < min) min = r.top;
2928
- if (r.bottom > max) max = r.bottom;
2929
- } else {
2930
- if (r.left < min) min = r.left;
2931
- if (r.right > max) max = r.right;
2932
- }
2933
- }
2934
- if (!isFinite(min) || !isFinite(max) || max <= min) {
2935
- return vertical ? content.scrollHeight : content.scrollWidth;
2936
- }
2937
- let pad = 0;
2938
- if (typeof getComputedStyle !== "undefined") {
2939
- const cs = getComputedStyle(content);
2940
- pad = vertical ? (parseFloat(cs.paddingTop) || 0) + (parseFloat(cs.paddingBottom) || 0) : (parseFloat(cs.paddingLeft) || 0) + (parseFloat(cs.paddingRight) || 0);
2941
- }
2942
- return max - min + pad;
2919
+ if (!content) {
2920
+ return vertical ? el.offsetHeight : el.offsetWidth;
2921
+ }
2922
+ const axis = vertical ? "height" : "width";
2923
+ const sheetStyle = el.style;
2924
+ const cs = content.style;
2925
+ const prevSheet = sheetStyle[axis];
2926
+ const prevFlex = cs.flex;
2927
+ const prevContent = vertical ? cs.height : cs.width;
2928
+ sheetStyle[axis] = "auto";
2929
+ cs.flex = "none";
2930
+ if (vertical) cs.height = "auto";
2931
+ else cs.width = "auto";
2932
+ const natural = vertical ? el.offsetHeight : el.offsetWidth;
2933
+ sheetStyle[axis] = prevSheet;
2934
+ cs.flex = prevFlex;
2935
+ if (vertical) cs.height = prevContent;
2936
+ else cs.width = prevContent;
2937
+ return natural;
2943
2938
  }
2944
2939
  measureFitSize() {
2945
2940
  const vertical = layoutAxis(this.mode) === "height";
2946
- const handleSize = vertical ? this.handle.offsetHeight : this.handle.offsetWidth;
2947
- const content = this.scrollContainer;
2948
- const natural = content ? handleSize + this.measureContentExtent(vertical) : handleSize;
2941
+ const natural = this.measureSheetNatural(vertical);
2949
2942
  const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
2950
2943
  if (typeof window === "undefined") return capped;
2951
2944
  const viewport = vertical ? window.innerHeight : window.innerWidth;
@@ -3031,6 +3024,10 @@ var BottomSheetEngine = class {
3031
3024
  this.backdrop.style.opacity = "";
3032
3025
  this.backdrop.style.pointerEvents = "";
3033
3026
  }
3027
+ if (this.anchorHost) {
3028
+ this.anchorHost.style.removeProperty("--bs-size");
3029
+ this.anchorHost.style.removeProperty("--bs-progress");
3030
+ }
3034
3031
  if (this.screenComponent) {
3035
3032
  this.screenComponent.style.opacity = "";
3036
3033
  this.screenComponent.style.display = "";
@@ -3042,6 +3039,7 @@ var BottomSheetEngine = class {
3042
3039
  this.bus.emit(event, payload);
3043
3040
  }
3044
3041
  newCycle() {
3042
+ this.allowOvershoot = false;
3045
3043
  this.currentAbort.abort();
3046
3044
  this.currentAbort = new AbortController();
3047
3045
  return this.currentAbort.signal;
@@ -3107,6 +3105,7 @@ var BottomSheetEngine = class {
3107
3105
  seen.add(p.id);
3108
3106
  }
3109
3107
  this.snaps.setRaw(this.snapPointsRaw);
3108
+ this.clampToMaxHeight();
3110
3109
  this.scrim.invalidateOpacityCache();
3111
3110
  }
3112
3111
  getAllowedRange() {
@@ -3313,9 +3312,13 @@ var BottomSheetEngine = class {
3313
3312
  this.opening = true;
3314
3313
  sheetStack.promote(this.id);
3315
3314
  }
3316
- void this.animation.animateTo(target.size, velocity).then(() => {
3317
- this.opening = false;
3315
+ const settleCap = this.snaps.getMaxAxisSize();
3316
+ const settleSize = settleCap > 0 ? Math.min(target.size, settleCap) : target.size;
3317
+ this.allowOvershoot = true;
3318
+ void this.animation.animateTo(settleSize, velocity).then(() => {
3318
3319
  if (signal.aborted) return;
3320
+ this.allowOvershoot = false;
3321
+ this.opening = false;
3319
3322
  this.scrollCache.restore(target.id, previousSize, target.size);
3320
3323
  this.updateAriaSlider();
3321
3324
  this.emit("snap", {
@@ -3347,7 +3350,7 @@ var BottomSheetEngine = class {
3347
3350
  }
3348
3351
  applySize(size) {
3349
3352
  const cap = this.snaps.getMaxAxisSize();
3350
- const clamped = cap > 0 && size > cap && !this.gesture?.isDragging ? cap : size;
3353
+ const clamped = cap > 0 && size > cap && !this.gesture?.isDragging && !this.allowOvershoot ? cap : size;
3351
3354
  this.size = clamped;
3352
3355
  const offset = cap - clamped;
3353
3356
  const style = this.element.style;
@@ -3439,6 +3442,8 @@ var BottomSheet = qwik.component$((props) => {
3439
3442
  const contentRef = qwik.useSignal();
3440
3443
  const backdropRef = qwik.useSignal();
3441
3444
  const scrimRef = qwik.useSignal();
3445
+ const headerRef = qwik.useSignal();
3446
+ const footerRef = qwik.useSignal();
3442
3447
  const initialActive = props.initial ?? props.snapPoints[0]?.id ?? "default";
3443
3448
  const state = qwik.useStore({
3444
3449
  size: 0,
@@ -3473,6 +3478,11 @@ var BottomSheet = qwik.component$((props) => {
3473
3478
  lockBodyScroll: props.lockBodyScroll,
3474
3479
  rubberBand: props.rubberBand,
3475
3480
  backdropRange: props.backdropRange,
3481
+ persistent: props.persistent,
3482
+ disableClose: props.disableClose,
3483
+ disableDrag: props.disableDrag,
3484
+ closeOnRouteChange: props.closeOnRouteChange,
3485
+ returnFocusTo: props.returnFocusTo,
3476
3486
  radius: props.radius,
3477
3487
  maxHeight: props.maxHeight
3478
3488
  };
@@ -3494,7 +3504,25 @@ var BottomSheet = qwik.component$((props) => {
3494
3504
  });
3495
3505
  engine.on("dragstart", sync);
3496
3506
  engine.on("dragend", sync);
3507
+ let onBackdropClick;
3508
+ if (props.backdrop !== false && props.closeOnBackdrop !== false && backdropRef.value) {
3509
+ onBackdropClick = () => {
3510
+ if (engine.canDismiss()) void engine.close("backdrop");
3511
+ };
3512
+ backdropRef.value.addEventListener("click", onBackdropClick);
3513
+ }
3514
+ const collapseEmpty = (el) => {
3515
+ if (!el) return;
3516
+ const empty = el.children.length === 0 && el.textContent?.trim() === "";
3517
+ if (empty) el.setAttribute("hidden", "");
3518
+ else el.removeAttribute("hidden");
3519
+ };
3520
+ collapseEmpty(headerRef.value);
3521
+ collapseEmpty(footerRef.value);
3497
3522
  cleanup(() => {
3523
+ if (onBackdropClick && backdropRef.value) {
3524
+ backdropRef.value.removeEventListener("click", onBackdropClick);
3525
+ }
3498
3526
  engineStore.engine = void 0;
3499
3527
  engine.destroy();
3500
3528
  });
@@ -3544,9 +3572,9 @@ var BottomSheet = qwik.component$((props) => {
3544
3572
  "aria-label": "Resize sheet"
3545
3573
  }
3546
3574
  ),
3547
- /* @__PURE__ */ jsxRuntime.jsx("div", { class: "bs-header", children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, { name: "header" }) }),
3575
+ /* @__PURE__ */ jsxRuntime.jsx("div", { class: "bs-header", ref: headerRef, children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, { name: "header" }) }),
3548
3576
  /* @__PURE__ */ jsxRuntime.jsx("div", { class: "bs-content", ref: contentRef, children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {}) }),
3549
- /* @__PURE__ */ jsxRuntime.jsx("div", { class: "bs-footer", children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, { name: "footer" }) }),
3577
+ /* @__PURE__ */ jsxRuntime.jsx("div", { class: "bs-footer", ref: footerRef, children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, { name: "footer" }) }),
3550
3578
  /* @__PURE__ */ jsxRuntime.jsx("span", { class: "bs-sr-only", role: "status", "aria-live": "polite", children: state.activeId })
3551
3579
  ]
3552
3580
  }
package/dist/qwik.d.cts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as _builder_io_qwik from '@builder.io/qwik';
2
2
  import { QRL } from '@builder.io/qwik';
3
- import { a as SnapPointDef, b as SheetMode, E as EngineState } from './BottomSheetEngine-CqiCz64W.cjs';
4
- export { c as EngineOptions, d as SnapPoint } from './BottomSheetEngine-CqiCz64W.cjs';
3
+ import { a as SnapPointDef, b as SheetMode, c as EngineOptions, E as EngineState } from './BottomSheetEngine-BD1mSExI.cjs';
4
+ export { d as SnapPoint } from './BottomSheetEngine-BD1mSExI.cjs';
5
5
  import './transform-jVfAikE9.cjs';
6
6
 
7
7
  type BottomSheetProps<TId extends string = string> = {
@@ -23,6 +23,11 @@ type BottomSheetProps<TId extends string = string> = {
23
23
  backdropRange?: [number, number];
24
24
  backdrop?: boolean;
25
25
  closeOnBackdrop?: boolean;
26
+ persistent?: boolean;
27
+ disableClose?: boolean;
28
+ disableDrag?: boolean;
29
+ closeOnRouteChange?: boolean;
30
+ returnFocusTo?: EngineOptions["returnFocusTo"];
26
31
  ariaLabel?: string;
27
32
  radius?: string | number;
28
33
  maxHeight?: string | number;
@@ -33,4 +38,4 @@ type BottomSheetProps<TId extends string = string> = {
33
38
  };
34
39
  declare const BottomSheet: _builder_io_qwik.Component<BottomSheetProps<string>>;
35
40
 
36
- export { BottomSheet, type BottomSheetProps, EngineState, SheetMode, SnapPointDef };
41
+ export { BottomSheet, type BottomSheetProps, EngineOptions, EngineState, SheetMode, SnapPointDef };
package/dist/qwik.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as _builder_io_qwik from '@builder.io/qwik';
2
2
  import { QRL } from '@builder.io/qwik';
3
- import { a as SnapPointDef, b as SheetMode, E as EngineState } from './BottomSheetEngine-BHjKFtnM.js';
4
- export { c as EngineOptions, d as SnapPoint } from './BottomSheetEngine-BHjKFtnM.js';
3
+ import { a as SnapPointDef, b as SheetMode, c as EngineOptions, E as EngineState } from './BottomSheetEngine-BDGRWa2i.js';
4
+ export { d as SnapPoint } from './BottomSheetEngine-BDGRWa2i.js';
5
5
  import './transform-jVfAikE9.js';
6
6
 
7
7
  type BottomSheetProps<TId extends string = string> = {
@@ -23,6 +23,11 @@ type BottomSheetProps<TId extends string = string> = {
23
23
  backdropRange?: [number, number];
24
24
  backdrop?: boolean;
25
25
  closeOnBackdrop?: boolean;
26
+ persistent?: boolean;
27
+ disableClose?: boolean;
28
+ disableDrag?: boolean;
29
+ closeOnRouteChange?: boolean;
30
+ returnFocusTo?: EngineOptions["returnFocusTo"];
26
31
  ariaLabel?: string;
27
32
  radius?: string | number;
28
33
  maxHeight?: string | number;
@@ -33,4 +38,4 @@ type BottomSheetProps<TId extends string = string> = {
33
38
  };
34
39
  declare const BottomSheet: _builder_io_qwik.Component<BottomSheetProps<string>>;
35
40
 
36
- export { BottomSheet, type BottomSheetProps, EngineState, SheetMode, SnapPointDef };
41
+ export { BottomSheet, type BottomSheetProps, EngineOptions, EngineState, SheetMode, SnapPointDef };