@surdeddd/bottom-sheet 0.8.0 → 0.8.2

package/dist/index.d.ts

@@ -1,5 +1,5 @@
-import { d as SnapPoint, b as SheetMode, a as SnapPointDef, c as EngineOptions, f as ScrimOverlayPosition } from './BottomSheetEngine-BDGRWa2i.js';
-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';
+import { d as SnapPoint, b as SheetMode, a as SnapPointDef, c as EngineOptions, f as ScrimOverlayPosition } from './BottomSheetEngine-BFTb0-4Z.js';
+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-BFTb0-4Z.js';
 export { OVERLAY_PRESETS, Overlay, OverlayAnimation, OverlayCloseReason, OverlayEdge, Overlay as OverlayEngine, OverlayEventMap, OverlayMountTarget, OverlayOptions, OverlayPreset, OverlayState, OverlayUpdate, SwipeToCloseConfig, createOverlay } from './overlay.js';
 import './transform-jVfAikE9.js';
 

package/dist/index.js

@@ -2931,7 +2931,10 @@ var BottomSheetEngine = class {
     cs.flex = "none";
     if (vertical) cs.height = "auto";
     else cs.width = "auto";
-    const natural = vertical ? el.offsetHeight : el.offsetWidth;
+    const poked = vertical ? el.offsetHeight : el.offsetWidth;
+    const contentBox = vertical ? content.clientHeight : content.clientWidth;
+    const contentScroll = vertical ? content.scrollHeight : content.scrollWidth;
+    const natural = Math.max(poked, poked - contentBox + contentScroll);
     sheetStyle[axis] = prevSheet;
     cs.flex = prevFlex;
     if (vertical) cs.height = prevContent;
@@ -2943,9 +2946,21 @@ var BottomSheetEngine = class {
     const natural = this.measureSheetNatural(vertical);
     const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
     if (typeof window === "undefined") return capped;
-    const viewport = vertical ? window.innerHeight : window.innerWidth;
+    const viewport = this.containingExtent(vertical);
     return viewport > 0 ? Math.min(capped, viewport) : capped;
   }
+  // The fit cap is the sheet's containing block, not always the window: a
+  // position:fixed sheet nested under a transform/filter/will-change ancestor
+  // is clipped to that ancestor, so capping by window.innerHeight oversizes the
+  // sheet and the content/footer get clipped. offsetParent resolves to that
+  // ancestor when present, and is null (→ viewport) for a plain fixed sheet.
+  containingExtent(vertical) {
+    const op = this.element.offsetParent;
+    if (op && op !== document.body && op !== document.documentElement) {
+      return vertical ? op.clientHeight : op.clientWidth;
+    }
+    return vertical ? window.innerHeight : window.innerWidth;
+  }
   installFitObserver() {
     if (typeof ResizeObserver === "undefined") return;
     if (!this.snapPointsRaw.some((p) => p.size === "fit" || p.size === "content"))

package/dist/integrations/formik.d.cts

@@ -1,4 +1,4 @@
-import { e as SheetEventMap } from '../BottomSheetEngine-BD1mSExI.cjs';
+import { e as SheetEventMap } from '../BottomSheetEngine-7BDK2OWX.cjs';
 import '../transform-jVfAikE9.cjs';
 
 type FormikStateLike = {

package/dist/integrations/formik.d.ts

@@ -1,4 +1,4 @@
-import { e as SheetEventMap } from '../BottomSheetEngine-BDGRWa2i.js';
+import { e as SheetEventMap } from '../BottomSheetEngine-BFTb0-4Z.js';
 import '../transform-jVfAikE9.js';
 
 type FormikStateLike = {

package/dist/integrations/react-hook-form.d.cts

@@ -1,4 +1,4 @@
-import { e as SheetEventMap } from '../BottomSheetEngine-BD1mSExI.cjs';
+import { e as SheetEventMap } from '../BottomSheetEngine-7BDK2OWX.cjs';
 import '../transform-jVfAikE9.cjs';
 
 type RhfFormStateLike = {

package/dist/integrations/react-hook-form.d.ts

@@ -1,4 +1,4 @@
-import { e as SheetEventMap } from '../BottomSheetEngine-BDGRWa2i.js';
+import { e as SheetEventMap } from '../BottomSheetEngine-BFTb0-4Z.js';
 import '../transform-jVfAikE9.js';
 
 type RhfFormStateLike = {

package/dist/preact.d.cts

@@ -1,5 +1,5 @@
 export { BottomSheet, BottomSheetFromConfig, BottomSheetFromConfigProps, BottomSheetHandle, BottomSheetProps, HeaderProp, Overlay, OverlayHandle, OverlayProps, SheetConfig, UseBottomSheetRefs, UseBottomSheetReturn, UseOverlayReturn, useBottomSheet, useOverlay } from './react.cjs';
-export { E as EngineState, b as SheetMode, d as SnapPoint, a as SnapPointDef } from './BottomSheetEngine-BD1mSExI.cjs';
+export { E as EngineState, b as SheetMode, d as SnapPoint, a as SnapPointDef } from './BottomSheetEngine-7BDK2OWX.cjs';
 export { OverlayEdge, OverlayOptions, OverlayState } from './overlay.cjs';
 import 'react';
 import './transform-jVfAikE9.cjs';

package/dist/preact.d.ts

@@ -1,5 +1,5 @@
 export { BottomSheet, BottomSheetFromConfig, BottomSheetFromConfigProps, BottomSheetHandle, BottomSheetProps, HeaderProp, Overlay, OverlayHandle, OverlayProps, SheetConfig, UseBottomSheetRefs, UseBottomSheetReturn, UseOverlayReturn, useBottomSheet, useOverlay } from './react.js';
-export { E as EngineState, b as SheetMode, d as SnapPoint, a as SnapPointDef } from './BottomSheetEngine-BDGRWa2i.js';
+export { E as EngineState, b as SheetMode, d as SnapPoint, a as SnapPointDef } from './BottomSheetEngine-BFTb0-4Z.js';
 export { OverlayEdge, OverlayOptions, OverlayState } from './overlay.js';
 import 'react';
 import './transform-jVfAikE9.js';

package/dist/qwik.cjs

@@ -2929,7 +2929,10 @@ var BottomSheetEngine = class {
     cs.flex = "none";
     if (vertical) cs.height = "auto";
     else cs.width = "auto";
-    const natural = vertical ? el.offsetHeight : el.offsetWidth;
+    const poked = vertical ? el.offsetHeight : el.offsetWidth;
+    const contentBox = vertical ? content.clientHeight : content.clientWidth;
+    const contentScroll = vertical ? content.scrollHeight : content.scrollWidth;
+    const natural = Math.max(poked, poked - contentBox + contentScroll);
     sheetStyle[axis] = prevSheet;
     cs.flex = prevFlex;
     if (vertical) cs.height = prevContent;
@@ -2941,9 +2944,21 @@ var BottomSheetEngine = class {
     const natural = this.measureSheetNatural(vertical);
     const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
     if (typeof window === "undefined") return capped;
-    const viewport = vertical ? window.innerHeight : window.innerWidth;
+    const viewport = this.containingExtent(vertical);
     return viewport > 0 ? Math.min(capped, viewport) : capped;
   }
+  // The fit cap is the sheet's containing block, not always the window: a
+  // position:fixed sheet nested under a transform/filter/will-change ancestor
+  // is clipped to that ancestor, so capping by window.innerHeight oversizes the
+  // sheet and the content/footer get clipped. offsetParent resolves to that
+  // ancestor when present, and is null (→ viewport) for a plain fixed sheet.
+  containingExtent(vertical) {
+    const op = this.element.offsetParent;
+    if (op && op !== document.body && op !== document.documentElement) {
+      return vertical ? op.clientHeight : op.clientWidth;
+    }
+    return vertical ? window.innerHeight : window.innerWidth;
+  }
   installFitObserver() {
     if (typeof ResizeObserver === "undefined") return;
     if (!this.snapPointsRaw.some((p) => p.size === "fit" || p.size === "content"))

package/dist/qwik.d.cts

@@ -1,7 +1,7 @@
 import * as _builder_io_qwik from '@builder.io/qwik';
 import { QRL } from '@builder.io/qwik';
-import { a as SnapPointDef, b as SheetMode, c as EngineOptions, E as EngineState } from './BottomSheetEngine-BD1mSExI.cjs';
-export { d as SnapPoint } from './BottomSheetEngine-BD1mSExI.cjs';
+import { a as SnapPointDef, b as SheetMode, c as EngineOptions, E as EngineState } from './BottomSheetEngine-7BDK2OWX.cjs';
+export { d as SnapPoint } from './BottomSheetEngine-7BDK2OWX.cjs';
 import './transform-jVfAikE9.cjs';
 
 type BottomSheetProps<TId extends string = string> = {

package/dist/qwik.d.ts

@@ -1,7 +1,7 @@
 import * as _builder_io_qwik from '@builder.io/qwik';
 import { QRL } from '@builder.io/qwik';
-import { a as SnapPointDef, b as SheetMode, c as EngineOptions, E as EngineState } from './BottomSheetEngine-BDGRWa2i.js';
-export { d as SnapPoint } from './BottomSheetEngine-BDGRWa2i.js';
+import { a as SnapPointDef, b as SheetMode, c as EngineOptions, E as EngineState } from './BottomSheetEngine-BFTb0-4Z.js';
+export { d as SnapPoint } from './BottomSheetEngine-BFTb0-4Z.js';
 import './transform-jVfAikE9.js';
 
 type BottomSheetProps<TId extends string = string> = {

package/dist/qwik.js

@@ -2927,7 +2927,10 @@ var BottomSheetEngine = class {
     cs.flex = "none";
     if (vertical) cs.height = "auto";
     else cs.width = "auto";
-    const natural = vertical ? el.offsetHeight : el.offsetWidth;
+    const poked = vertical ? el.offsetHeight : el.offsetWidth;
+    const contentBox = vertical ? content.clientHeight : content.clientWidth;
+    const contentScroll = vertical ? content.scrollHeight : content.scrollWidth;
+    const natural = Math.max(poked, poked - contentBox + contentScroll);
     sheetStyle[axis] = prevSheet;
     cs.flex = prevFlex;
     if (vertical) cs.height = prevContent;
@@ -2939,9 +2942,21 @@ var BottomSheetEngine = class {
     const natural = this.measureSheetNatural(vertical);
     const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
     if (typeof window === "undefined") return capped;
-    const viewport = vertical ? window.innerHeight : window.innerWidth;
+    const viewport = this.containingExtent(vertical);
     return viewport > 0 ? Math.min(capped, viewport) : capped;
   }
+  // The fit cap is the sheet's containing block, not always the window: a
+  // position:fixed sheet nested under a transform/filter/will-change ancestor
+  // is clipped to that ancestor, so capping by window.innerHeight oversizes the
+  // sheet and the content/footer get clipped. offsetParent resolves to that
+  // ancestor when present, and is null (→ viewport) for a plain fixed sheet.
+  containingExtent(vertical) {
+    const op = this.element.offsetParent;
+    if (op && op !== document.body && op !== document.documentElement) {
+      return vertical ? op.clientHeight : op.clientWidth;
+    }
+    return vertical ? window.innerHeight : window.innerWidth;
+  }
   installFitObserver() {
     if (typeof ResizeObserver === "undefined") return;
     if (!this.snapPointsRaw.some((p) => p.size === "fit" || p.size === "content"))

package/dist/react.cjs

@@ -2936,7 +2936,10 @@ var BottomSheetEngine = class {
     cs.flex = "none";
     if (vertical) cs.height = "auto";
     else cs.width = "auto";
-    const natural = vertical ? el.offsetHeight : el.offsetWidth;
+    const poked = vertical ? el.offsetHeight : el.offsetWidth;
+    const contentBox = vertical ? content.clientHeight : content.clientWidth;
+    const contentScroll = vertical ? content.scrollHeight : content.scrollWidth;
+    const natural = Math.max(poked, poked - contentBox + contentScroll);
     sheetStyle[axis] = prevSheet;
     cs.flex = prevFlex;
     if (vertical) cs.height = prevContent;
@@ -2948,9 +2951,21 @@ var BottomSheetEngine = class {
     const natural = this.measureSheetNatural(vertical);
     const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
     if (typeof window === "undefined") return capped;
-    const viewport = vertical ? window.innerHeight : window.innerWidth;
+    const viewport = this.containingExtent(vertical);
     return viewport > 0 ? Math.min(capped, viewport) : capped;
   }
+  // The fit cap is the sheet's containing block, not always the window: a
+  // position:fixed sheet nested under a transform/filter/will-change ancestor
+  // is clipped to that ancestor, so capping by window.innerHeight oversizes the
+  // sheet and the content/footer get clipped. offsetParent resolves to that
+  // ancestor when present, and is null (→ viewport) for a plain fixed sheet.
+  containingExtent(vertical) {
+    const op = this.element.offsetParent;
+    if (op && op !== document.body && op !== document.documentElement) {
+      return vertical ? op.clientHeight : op.clientWidth;
+    }
+    return vertical ? window.innerHeight : window.innerWidth;
+  }
   installFitObserver() {
     if (typeof ResizeObserver === "undefined") return;
     if (!this.snapPointsRaw.some((p) => p.size === "fit" || p.size === "content"))

package/dist/react.d.cts

@@ -1,5 +1,5 @@
-import { c as EngineOptions, E as EngineState, A as AnchorOptions, S as ScrimStagesOptions, p as ScrimStageDef, e as SheetEventMap, C as CloseReason, q as ScrimUpdate, m as ScrimOverlayOptions, B as BottomSheetEngine, a as SnapPointDef, b as SheetMode } from './BottomSheetEngine-BD1mSExI.cjs';
-export { d as SnapPoint } from './BottomSheetEngine-BD1mSExI.cjs';
+import { c as EngineOptions, E as EngineState, A as AnchorOptions, S as ScrimStagesOptions, p as ScrimStageDef, e as SheetEventMap, C as CloseReason, q as ScrimUpdate, m as ScrimOverlayOptions, B as BottomSheetEngine, a as SnapPointDef, b as SheetMode } from './BottomSheetEngine-7BDK2OWX.cjs';
+export { d as SnapPoint } from './BottomSheetEngine-7BDK2OWX.cjs';
 import { OverlayOptions, OverlayState, Overlay as OverlayEngine } from './overlay.cjs';
 export { OverlayEdge } from './overlay.cjs';
 import * as react from 'react';

package/dist/react.d.ts

@@ -1,5 +1,5 @@
-import { c as EngineOptions, E as EngineState, A as AnchorOptions, S as ScrimStagesOptions, p as ScrimStageDef, e as SheetEventMap, C as CloseReason, q as ScrimUpdate, m as ScrimOverlayOptions, B as BottomSheetEngine, a as SnapPointDef, b as SheetMode } from './BottomSheetEngine-BDGRWa2i.js';
-export { d as SnapPoint } from './BottomSheetEngine-BDGRWa2i.js';
+import { c as EngineOptions, E as EngineState, A as AnchorOptions, S as ScrimStagesOptions, p as ScrimStageDef, e as SheetEventMap, C as CloseReason, q as ScrimUpdate, m as ScrimOverlayOptions, B as BottomSheetEngine, a as SnapPointDef, b as SheetMode } from './BottomSheetEngine-BFTb0-4Z.js';
+export { d as SnapPoint } from './BottomSheetEngine-BFTb0-4Z.js';
 import { OverlayOptions, OverlayState, Overlay as OverlayEngine } from './overlay.js';
 export { OverlayEdge } from './overlay.js';
 import * as react from 'react';

package/dist/react.js

@@ -2934,7 +2934,10 @@ var BottomSheetEngine = class {
     cs.flex = "none";
     if (vertical) cs.height = "auto";
     else cs.width = "auto";
-    const natural = vertical ? el.offsetHeight : el.offsetWidth;
+    const poked = vertical ? el.offsetHeight : el.offsetWidth;
+    const contentBox = vertical ? content.clientHeight : content.clientWidth;
+    const contentScroll = vertical ? content.scrollHeight : content.scrollWidth;
+    const natural = Math.max(poked, poked - contentBox + contentScroll);
     sheetStyle[axis] = prevSheet;
     cs.flex = prevFlex;
     if (vertical) cs.height = prevContent;
@@ -2946,9 +2949,21 @@ var BottomSheetEngine = class {
     const natural = this.measureSheetNatural(vertical);
     const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
     if (typeof window === "undefined") return capped;
-    const viewport = vertical ? window.innerHeight : window.innerWidth;
+    const viewport = this.containingExtent(vertical);
     return viewport > 0 ? Math.min(capped, viewport) : capped;
   }
+  // The fit cap is the sheet's containing block, not always the window: a
+  // position:fixed sheet nested under a transform/filter/will-change ancestor
+  // is clipped to that ancestor, so capping by window.innerHeight oversizes the
+  // sheet and the content/footer get clipped. offsetParent resolves to that
+  // ancestor when present, and is null (→ viewport) for a plain fixed sheet.
+  containingExtent(vertical) {
+    const op = this.element.offsetParent;
+    if (op && op !== document.body && op !== document.documentElement) {
+      return vertical ? op.clientHeight : op.clientWidth;
+    }
+    return vertical ? window.innerHeight : window.innerWidth;
+  }
   installFitObserver() {
     if (typeof ResizeObserver === "undefined") return;
     if (!this.snapPointsRaw.some((p) => p.size === "fit" || p.size === "content"))

package/dist/solid.cjs

@@ -2929,7 +2929,10 @@ var BottomSheetEngine = class {
     cs.flex = "none";
     if (vertical) cs.height = "auto";
     else cs.width = "auto";
-    const natural = vertical ? el.offsetHeight : el.offsetWidth;
+    const poked = vertical ? el.offsetHeight : el.offsetWidth;
+    const contentBox = vertical ? content.clientHeight : content.clientWidth;
+    const contentScroll = vertical ? content.scrollHeight : content.scrollWidth;
+    const natural = Math.max(poked, poked - contentBox + contentScroll);
     sheetStyle[axis] = prevSheet;
     cs.flex = prevFlex;
     if (vertical) cs.height = prevContent;
@@ -2941,9 +2944,21 @@ var BottomSheetEngine = class {
     const natural = this.measureSheetNatural(vertical);
     const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
     if (typeof window === "undefined") return capped;
-    const viewport = vertical ? window.innerHeight : window.innerWidth;
+    const viewport = this.containingExtent(vertical);
     return viewport > 0 ? Math.min(capped, viewport) : capped;
   }
+  // The fit cap is the sheet's containing block, not always the window: a
+  // position:fixed sheet nested under a transform/filter/will-change ancestor
+  // is clipped to that ancestor, so capping by window.innerHeight oversizes the
+  // sheet and the content/footer get clipped. offsetParent resolves to that
+  // ancestor when present, and is null (→ viewport) for a plain fixed sheet.
+  containingExtent(vertical) {
+    const op = this.element.offsetParent;
+    if (op && op !== document.body && op !== document.documentElement) {
+      return vertical ? op.clientHeight : op.clientWidth;
+    }
+    return vertical ? window.innerHeight : window.innerWidth;
+  }
   installFitObserver() {
     if (typeof ResizeObserver === "undefined") return;
     if (!this.snapPointsRaw.some((p) => p.size === "fit" || p.size === "content"))

package/dist/solid.d.cts

@@ -277,6 +277,7 @@ declare class BottomSheetEngine {
     private contentTargets;
     private measureSheetNatural;
     private measureFitSize;
+    private containingExtent;
     private installFitObserver;
     destroy(): void;
     private emit;

package/dist/solid.d.ts

@@ -277,6 +277,7 @@ declare class BottomSheetEngine {
     private contentTargets;
     private measureSheetNatural;
     private measureFitSize;
+    private containingExtent;
     private installFitObserver;
     destroy(): void;
     private emit;

package/dist/solid.js

@@ -2927,7 +2927,10 @@ var BottomSheetEngine = class {
     cs.flex = "none";
     if (vertical) cs.height = "auto";
     else cs.width = "auto";
-    const natural = vertical ? el.offsetHeight : el.offsetWidth;
+    const poked = vertical ? el.offsetHeight : el.offsetWidth;
+    const contentBox = vertical ? content.clientHeight : content.clientWidth;
+    const contentScroll = vertical ? content.scrollHeight : content.scrollWidth;
+    const natural = Math.max(poked, poked - contentBox + contentScroll);
     sheetStyle[axis] = prevSheet;
     cs.flex = prevFlex;
     if (vertical) cs.height = prevContent;
@@ -2939,9 +2942,21 @@ var BottomSheetEngine = class {
     const natural = this.measureSheetNatural(vertical);
     const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
     if (typeof window === "undefined") return capped;
-    const viewport = vertical ? window.innerHeight : window.innerWidth;
+    const viewport = this.containingExtent(vertical);
     return viewport > 0 ? Math.min(capped, viewport) : capped;
   }
+  // The fit cap is the sheet's containing block, not always the window: a
+  // position:fixed sheet nested under a transform/filter/will-change ancestor
+  // is clipped to that ancestor, so capping by window.innerHeight oversizes the
+  // sheet and the content/footer get clipped. offsetParent resolves to that
+  // ancestor when present, and is null (→ viewport) for a plain fixed sheet.
+  containingExtent(vertical) {
+    const op = this.element.offsetParent;
+    if (op && op !== document.body && op !== document.documentElement) {
+      return vertical ? op.clientHeight : op.clientWidth;
+    }
+    return vertical ? window.innerHeight : window.innerWidth;
+  }
   installFitObserver() {
     if (typeof ResizeObserver === "undefined") return;
     if (!this.snapPointsRaw.some((p) => p.size === "fit" || p.size === "content"))

package/dist/solid.source.jsx

@@ -2929,7 +2929,10 @@ var BottomSheetEngine = class {
     cs.flex = "none";
     if (vertical) cs.height = "auto";
     else cs.width = "auto";
-    const natural = vertical ? el.offsetHeight : el.offsetWidth;
+    const poked = vertical ? el.offsetHeight : el.offsetWidth;
+    const contentBox = vertical ? content.clientHeight : content.clientWidth;
+    const contentScroll = vertical ? content.scrollHeight : content.scrollWidth;
+    const natural = Math.max(poked, poked - contentBox + contentScroll);
     sheetStyle[axis] = prevSheet;
     cs.flex = prevFlex;
     if (vertical) cs.height = prevContent;
@@ -2941,9 +2944,21 @@ var BottomSheetEngine = class {
     const natural = this.measureSheetNatural(vertical);
     const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
     if (typeof window === "undefined") return capped;
-    const viewport = vertical ? window.innerHeight : window.innerWidth;
+    const viewport = this.containingExtent(vertical);
     return viewport > 0 ? Math.min(capped, viewport) : capped;
   }
+  // The fit cap is the sheet's containing block, not always the window: a
+  // position:fixed sheet nested under a transform/filter/will-change ancestor
+  // is clipped to that ancestor, so capping by window.innerHeight oversizes the
+  // sheet and the content/footer get clipped. offsetParent resolves to that
+  // ancestor when present, and is null (→ viewport) for a plain fixed sheet.
+  containingExtent(vertical) {
+    const op = this.element.offsetParent;
+    if (op && op !== document.body && op !== document.documentElement) {
+      return vertical ? op.clientHeight : op.clientWidth;
+    }
+    return vertical ? window.innerHeight : window.innerWidth;
+  }
   installFitObserver() {
     if (typeof ResizeObserver === "undefined") return;
     if (!this.snapPointsRaw.some((p) => p.size === "fit" || p.size === "content"))

package/dist/svelte-core.cjs

@@ -2928,7 +2928,10 @@ var BottomSheetEngine = class {
     cs.flex = "none";
     if (vertical) cs.height = "auto";
     else cs.width = "auto";
-    const natural = vertical ? el.offsetHeight : el.offsetWidth;
+    const poked = vertical ? el.offsetHeight : el.offsetWidth;
+    const contentBox = vertical ? content.clientHeight : content.clientWidth;
+    const contentScroll = vertical ? content.scrollHeight : content.scrollWidth;
+    const natural = Math.max(poked, poked - contentBox + contentScroll);
     sheetStyle[axis] = prevSheet;
     cs.flex = prevFlex;
     if (vertical) cs.height = prevContent;
@@ -2940,9 +2943,21 @@ var BottomSheetEngine = class {
     const natural = this.measureSheetNatural(vertical);
     const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
     if (typeof window === "undefined") return capped;
-    const viewport = vertical ? window.innerHeight : window.innerWidth;
+    const viewport = this.containingExtent(vertical);
     return viewport > 0 ? Math.min(capped, viewport) : capped;
   }
+  // The fit cap is the sheet's containing block, not always the window: a
+  // position:fixed sheet nested under a transform/filter/will-change ancestor
+  // is clipped to that ancestor, so capping by window.innerHeight oversizes the
+  // sheet and the content/footer get clipped. offsetParent resolves to that
+  // ancestor when present, and is null (→ viewport) for a plain fixed sheet.
+  containingExtent(vertical) {
+    const op = this.element.offsetParent;
+    if (op && op !== document.body && op !== document.documentElement) {
+      return vertical ? op.clientHeight : op.clientWidth;
+    }
+    return vertical ? window.innerHeight : window.innerWidth;
+  }
   installFitObserver() {
     if (typeof ResizeObserver === "undefined") return;
     if (!this.snapPointsRaw.some((p) => p.size === "fit" || p.size === "content"))

package/dist/svelte-core.js

@@ -2926,7 +2926,10 @@ var BottomSheetEngine = class {
     cs.flex = "none";
     if (vertical) cs.height = "auto";
     else cs.width = "auto";
-    const natural = vertical ? el.offsetHeight : el.offsetWidth;
+    const poked = vertical ? el.offsetHeight : el.offsetWidth;
+    const contentBox = vertical ? content.clientHeight : content.clientWidth;
+    const contentScroll = vertical ? content.scrollHeight : content.scrollWidth;
+    const natural = Math.max(poked, poked - contentBox + contentScroll);
     sheetStyle[axis] = prevSheet;
     cs.flex = prevFlex;
     if (vertical) cs.height = prevContent;
@@ -2938,9 +2941,21 @@ var BottomSheetEngine = class {
     const natural = this.measureSheetNatural(vertical);
     const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
     if (typeof window === "undefined") return capped;
-    const viewport = vertical ? window.innerHeight : window.innerWidth;
+    const viewport = this.containingExtent(vertical);
     return viewport > 0 ? Math.min(capped, viewport) : capped;
   }
+  // The fit cap is the sheet's containing block, not always the window: a
+  // position:fixed sheet nested under a transform/filter/will-change ancestor
+  // is clipped to that ancestor, so capping by window.innerHeight oversizes the
+  // sheet and the content/footer get clipped. offsetParent resolves to that
+  // ancestor when present, and is null (→ viewport) for a plain fixed sheet.
+  containingExtent(vertical) {
+    const op = this.element.offsetParent;
+    if (op && op !== document.body && op !== document.documentElement) {
+      return vertical ? op.clientHeight : op.clientWidth;
+    }
+    return vertical ? window.innerHeight : window.innerWidth;
+  }
   installFitObserver() {
     if (typeof ResizeObserver === "undefined") return;
     if (!this.snapPointsRaw.some((p) => p.size === "fit" || p.size === "content"))

package/dist/svelte-src/BottomSheet.svelte

@@ -276,6 +276,9 @@
       tabindex="0"
       aria-label="Resize sheet"
       aria-orientation={isVerticalAxis ? "vertical" : "horizontal"}
+      aria-valuemin="0"
+      aria-valuemax="0"
+      aria-valuenow="0"
     ></div>
     {#if header}<div class="bs-header">{@render header(viewState)}</div>{/if}
     <!-- svelte-ignore a11y_no_noninteractive_tabindex -->

package/dist/svelte.cjs

@@ -2950,7 +2950,10 @@ var BottomSheetEngine = class {
     cs.flex = "none";
     if (vertical) cs.height = "auto";
     else cs.width = "auto";
-    const natural = vertical ? el.offsetHeight : el.offsetWidth;
+    const poked = vertical ? el.offsetHeight : el.offsetWidth;
+    const contentBox = vertical ? content.clientHeight : content.clientWidth;
+    const contentScroll = vertical ? content.scrollHeight : content.scrollWidth;
+    const natural = Math.max(poked, poked - contentBox + contentScroll);
     sheetStyle[axis] = prevSheet;
     cs.flex = prevFlex;
     if (vertical) cs.height = prevContent;
@@ -2962,9 +2965,21 @@ var BottomSheetEngine = class {
     const natural = this.measureSheetNatural(vertical);
     const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
     if (typeof window === "undefined") return capped;
-    const viewport = vertical ? window.innerHeight : window.innerWidth;
+    const viewport = this.containingExtent(vertical);
     return viewport > 0 ? Math.min(capped, viewport) : capped;
   }
+  // The fit cap is the sheet's containing block, not always the window: a
+  // position:fixed sheet nested under a transform/filter/will-change ancestor
+  // is clipped to that ancestor, so capping by window.innerHeight oversizes the
+  // sheet and the content/footer get clipped. offsetParent resolves to that
+  // ancestor when present, and is null (→ viewport) for a plain fixed sheet.
+  containingExtent(vertical) {
+    const op = this.element.offsetParent;
+    if (op && op !== document.body && op !== document.documentElement) {
+      return vertical ? op.clientHeight : op.clientWidth;
+    }
+    return vertical ? window.innerHeight : window.innerWidth;
+  }
   installFitObserver() {
     if (typeof ResizeObserver === "undefined") return;
     if (!this.snapPointsRaw.some((p) => p.size === "fit" || p.size === "content"))
@@ -3577,7 +3592,7 @@ var root_3 = $2__namespace.from_html(`<div class="bs-header"><!></div>`);
 var root_5 = $2__namespace.from_html(`<div class="bs-footer"><!></div>`);
 var root_6 = $2__namespace.from_html(`<div class="bs-button-slot" data-side="left"><!></div>`);
 var root_7 = $2__namespace.from_html(`<div class="bs-button-slot" data-side="right"><!></div>`);
-var root = $2__namespace.from_html(`<div class="bs-root"><!> <div class="bs-screen"><!></div> <section class="bs-sheet" role="dialog"><div class="bs-handle" role="slider" tabindex="0" aria-label="Resize sheet"></div> <!> <div class="bs-content" tabindex="0" role="region" aria-label="Sheet content"><!></div> <!> <span class="bs-sr-only" role="status" aria-live="polite"> </span></section> <!> <!></div>`);
+var root = $2__namespace.from_html(`<div class="bs-root"><!> <div class="bs-screen"><!></div> <section class="bs-sheet" role="dialog"><div class="bs-handle" role="slider" tabindex="0" aria-label="Resize sheet" aria-valuemin="0" aria-valuemax="0" aria-valuenow="0"></div> <!> <div class="bs-content" tabindex="0" role="region" aria-label="Sheet content"><!></div> <!> <span class="bs-sr-only" role="status" aria-live="polite"> </span></section> <!> <!></div>`);
 function BottomSheet($$anchor, $$props) {
   $2__namespace.push($$props, true);
   let mode = $2__namespace.prop($$props, "mode", 3, "bottom"), animation = $2__namespace.prop($$props, "animation", 3, "spring"), focusTrap = $2__namespace.prop($$props, "focusTrap", 3, false), closeOnEscape = $2__namespace.prop($$props, "closeOnEscape", 3, true), closeOnBack = $2__namespace.prop($$props, "closeOnBack", 3, false), lockBodyScroll2 = $2__namespace.prop($$props, "lockBodyScroll", 3, true), rubberBand2 = $2__namespace.prop($$props, "rubberBand", 3, true), backdrop = $2__namespace.prop($$props, "backdrop", 3, true), closeOnBackdrop = $2__namespace.prop($$props, "closeOnBackdrop", 3, true), persistent = $2__namespace.prop($$props, "persistent", 3, false), disableClose = $2__namespace.prop($$props, "disableClose", 3, false), disableDrag = $2__namespace.prop($$props, "disableDrag", 3, false), closeOnRouteChange = $2__namespace.prop($$props, "closeOnRouteChange", 3, false), openProp = $2__namespace.prop($$props, "open", 15), snap = $2__namespace.prop($$props, "snap", 15), ariaLabel = $2__namespace.prop($$props, "ariaLabel", 3, "Bottom sheet");

package/dist/svelte.js

@@ -2928,7 +2928,10 @@ var BottomSheetEngine = class {
     cs.flex = "none";
     if (vertical) cs.height = "auto";
     else cs.width = "auto";
-    const natural = vertical ? el.offsetHeight : el.offsetWidth;
+    const poked = vertical ? el.offsetHeight : el.offsetWidth;
+    const contentBox = vertical ? content.clientHeight : content.clientWidth;
+    const contentScroll = vertical ? content.scrollHeight : content.scrollWidth;
+    const natural = Math.max(poked, poked - contentBox + contentScroll);
     sheetStyle[axis] = prevSheet;
     cs.flex = prevFlex;
     if (vertical) cs.height = prevContent;
@@ -2940,9 +2943,21 @@ var BottomSheetEngine = class {
     const natural = this.measureSheetNatural(vertical);
     const capped = this.maxHeightCap !== void 0 ? Math.min(natural, this.maxHeightCap) : natural;
     if (typeof window === "undefined") return capped;
-    const viewport = vertical ? window.innerHeight : window.innerWidth;
+    const viewport = this.containingExtent(vertical);
     return viewport > 0 ? Math.min(capped, viewport) : capped;
   }
+  // The fit cap is the sheet's containing block, not always the window: a
+  // position:fixed sheet nested under a transform/filter/will-change ancestor
+  // is clipped to that ancestor, so capping by window.innerHeight oversizes the
+  // sheet and the content/footer get clipped. offsetParent resolves to that
+  // ancestor when present, and is null (→ viewport) for a plain fixed sheet.
+  containingExtent(vertical) {
+    const op = this.element.offsetParent;
+    if (op && op !== document.body && op !== document.documentElement) {
+      return vertical ? op.clientHeight : op.clientWidth;
+    }
+    return vertical ? window.innerHeight : window.innerWidth;
+  }
   installFitObserver() {
     if (typeof ResizeObserver === "undefined") return;
     if (!this.snapPointsRaw.some((p) => p.size === "fit" || p.size === "content"))
@@ -3555,7 +3570,7 @@ var root_3 = $2.from_html(`<div class="bs-header"><!></div>`);
 var root_5 = $2.from_html(`<div class="bs-footer"><!></div>`);
 var root_6 = $2.from_html(`<div class="bs-button-slot" data-side="left"><!></div>`);
 var root_7 = $2.from_html(`<div class="bs-button-slot" data-side="right"><!></div>`);
-var root = $2.from_html(`<div class="bs-root"><!> <div class="bs-screen"><!></div> <section class="bs-sheet" role="dialog"><div class="bs-handle" role="slider" tabindex="0" aria-label="Resize sheet"></div> <!> <div class="bs-content" tabindex="0" role="region" aria-label="Sheet content"><!></div> <!> <span class="bs-sr-only" role="status" aria-live="polite"> </span></section> <!> <!></div>`);
+var root = $2.from_html(`<div class="bs-root"><!> <div class="bs-screen"><!></div> <section class="bs-sheet" role="dialog"><div class="bs-handle" role="slider" tabindex="0" aria-label="Resize sheet" aria-valuemin="0" aria-valuemax="0" aria-valuenow="0"></div> <!> <div class="bs-content" tabindex="0" role="region" aria-label="Sheet content"><!></div> <!> <span class="bs-sr-only" role="status" aria-live="polite"> </span></section> <!> <!></div>`);
 function BottomSheet($$anchor, $$props) {
   $2.push($$props, true);
   let mode = $2.prop($$props, "mode", 3, "bottom"), animation = $2.prop($$props, "animation", 3, "spring"), focusTrap = $2.prop($$props, "focusTrap", 3, false), closeOnEscape = $2.prop($$props, "closeOnEscape", 3, true), closeOnBack = $2.prop($$props, "closeOnBack", 3, false), lockBodyScroll2 = $2.prop($$props, "lockBodyScroll", 3, true), rubberBand2 = $2.prop($$props, "rubberBand", 3, true), backdrop = $2.prop($$props, "backdrop", 3, true), closeOnBackdrop = $2.prop($$props, "closeOnBackdrop", 3, true), persistent = $2.prop($$props, "persistent", 3, false), disableClose = $2.prop($$props, "disableClose", 3, false), disableDrag = $2.prop($$props, "disableDrag", 3, false), closeOnRouteChange = $2.prop($$props, "closeOnRouteChange", 3, false), openProp = $2.prop($$props, "open", 15), snap = $2.prop($$props, "snap", 15), ariaLabel = $2.prop($$props, "ariaLabel", 3, "Bottom sheet");