@surdeddd/bottom-sheet 0.9.1 → 0.10.0

package/dist/overlay.js

@@ -118,6 +118,13 @@ var resolveSnap = (point, mode, measureFit) => {
   }
 };
 
+// src/core/primitives/devWarn.ts
+function devWarn(...args) {
+  if (typeof process !== "undefined" && process.env && process.env.NODE_ENV !== "production" && typeof console !== "undefined") {
+    console.warn(...args);
+  }
+}
+
 // src/core/primitives/instance-id.ts
 var counters = {};
 function nextInstanceId(prefix) {
@@ -520,7 +527,7 @@ function installOverlaySwipe(deps) {
   };
 }
 
-// src/core/overlay.ts
+// src/core/overlay-options.ts
 var OVERLAY_PRESETS = Object.freeze({
   sheet: Object.freeze({
     enterAnimation: "slide",
@@ -551,6 +558,8 @@ var OVERLAY_PRESETS = Object.freeze({
     swipeToClose: false
   })
 });
+
+// src/core/overlay.ts
 var OverlayEngine = class {
   constructor(opts) {
     __publicField(this, "id", nextInstanceId("ovl"));
@@ -627,7 +636,7 @@ var OverlayEngine = class {
     this.onOpenCb = opts.onOpen;
     this.onCloseCb = opts.onClose;
     if (this.peekRaw !== void 0 && this.edge !== "bottom") {
-      console.warn(
+      devWarn(
         "[OverlayEngine] `peek` is only supported on edge: 'bottom' \u2014 ignoring."
       );
       this.peekRaw = void 0;
@@ -694,10 +703,9 @@ var OverlayEngine = class {
           this.element.style.opacity = "1";
           if (this.backdrop) {
             this.backdrop.style.opacity = String(this.backdropOpacity);
-            this.backdrop.style.pointerEvents = this.backdropOpacity > 0 ? "auto" : "none";
+            this.syncBackdropPointerEvents();
             if (this.backdropFilter) {
-              this.backdrop.style.backdropFilter = this.backdropFilter;
-              this.backdrop.style.webkitBackdropFilter = this.backdropFilter;
+              this.applyBackdropFilter(this.backdropFilter);
             }
           }
           try {
@@ -717,8 +725,7 @@ var OverlayEngine = class {
               this.backdrop.style.opacity = "0";
               this.backdrop.style.pointerEvents = "none";
               if (this.backdropFilter) {
-                this.backdrop.style.backdropFilter = "";
-                this.backdrop.style.webkitBackdropFilter = "";
+                this.applyBackdropFilter(void 0);
               }
             }
             this.element.setAttribute("data-state", "closed");
@@ -776,8 +783,7 @@ var OverlayEngine = class {
           this.backdrop.style.opacity = "0";
           this.backdrop.style.pointerEvents = "none";
           if (this.backdropFilter) {
-            this.backdrop.style.backdropFilter = "";
-            this.backdrop.style.webkitBackdropFilter = "";
+            this.applyBackdropFilter(void 0);
           }
         }
         this.releaseInteractiveListeners();
@@ -825,20 +831,14 @@ var OverlayEngine = class {
     this.backdropOpacity = opacity;
     if (this.isOpen_ && this.backdrop) {
       this.backdrop.style.opacity = String(opacity);
+      this.syncBackdropPointerEvents();
     }
   }
   setBackdropFilter(filter) {
     if (this.destroyed) return;
     this.backdropFilter = filter;
     if (!this.isOpen_ || !this.backdrop) return;
-    const style = this.backdrop.style;
-    if (filter) {
-      this.backdrop.style.backdropFilter = filter;
-      style.webkitBackdropFilter = filter;
-    } else {
-      this.backdrop.style.backdropFilter = "";
-      style.webkitBackdropFilter = "";
-    }
+    this.applyBackdropFilter(filter);
   }
   setSwipeToClose(config) {
     if (this.destroyed) return;
@@ -907,16 +907,10 @@ var OverlayEngine = class {
     if (this.isOpen_ && this.backdrop) {
       if (merged.backdropOpacity !== void 0) {
         this.backdrop.style.opacity = String(this.backdropOpacity);
+        this.syncBackdropPointerEvents();
       }
       if (merged.backdropFilter !== void 0) {
-        const style = this.backdrop.style;
-        if (this.backdropFilter) {
-          this.backdrop.style.backdropFilter = this.backdropFilter;
-          style.webkitBackdropFilter = this.backdropFilter;
-        } else {
-          this.backdrop.style.backdropFilter = "";
-          style.webkitBackdropFilter = "";
-        }
+        this.applyBackdropFilter(this.backdropFilter);
       }
     }
     if (opts.duration !== void 0) this.duration = opts.duration;
@@ -1051,6 +1045,21 @@ var OverlayEngine = class {
       this.backdrop.style.pointerEvents = "none";
     }
   }
+  syncBackdropPointerEvents() {
+    if (!this.backdrop) return;
+    this.backdrop.style.pointerEvents = this.backdropOpacity > 0 ? "auto" : "none";
+  }
+  applyBackdropFilter(filter) {
+    if (!this.backdrop) return;
+    const style = this.backdrop.style;
+    if (filter) {
+      this.backdrop.style.backdropFilter = filter;
+      style.webkitBackdropFilter = filter;
+    } else {
+      this.backdrop.style.backdropFilter = "";
+      style.webkitBackdropFilter = "";
+    }
+  }
   setWillChange(on) {
     this.element.style.willChange = on ? "transform, opacity" : "";
     if (this.backdrop) {

package/dist/preact.d.cts

@@ -1,5 +1,6 @@
 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-BcyruNP1.cjs';
+export { E as EngineState, b as SheetMode, e as SnapPoint, a as SnapPointDef } from './BottomSheetEngine-DzsIwD28.cjs';
 export { OverlayEdge, OverlayOptions, OverlayState } from './overlay.cjs';
 import 'react';
+import './teleport-7uYNiEAT.cjs';
 import './transform-jVfAikE9.cjs';

package/dist/preact.d.ts

@@ -1,5 +1,6 @@
 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-CBRcBwV-.js';
+export { E as EngineState, b as SheetMode, e as SnapPoint, a as SnapPointDef } from './BottomSheetEngine-DRjCU73e.js';
 export { OverlayEdge, OverlayOptions, OverlayState } from './overlay.js';
 import 'react';
+import './teleport-7uYNiEAT.js';
 import './transform-jVfAikE9.js';

package/dist/qwik.cjs

@@ -186,11 +186,18 @@ var resolveSnap = (point, mode, measureFit) => {
   return Math.max(0, el.getBoundingClientRect().width);
 };
 
+// src/core/primitives/devWarn.ts
+function devWarn(...args) {
+  if (typeof process !== "undefined" && process.env && process.env.NODE_ENV !== "production" && typeof console !== "undefined") {
+    console.warn(...args);
+  }
+}
+
 // src/core/primitives/snap-points.ts
 var resolveSnapList = (points, mode, measureFit) => points.map((p) => {
   const raw = resolveSnap(p.size, mode, measureFit);
   if (!Number.isFinite(raw) || raw < 0) {
-    console.warn(
+    devWarn(
       `[BottomSheet] snap "${p.id}" resolved to invalid size (${String(p.size)} \u2192 ${raw}); clamped to 0.`
     );
     return { id: p.id, size: 0 };
@@ -202,7 +209,7 @@ var auditVhUsage = (points) => {
   for (const p of points) {
     if (typeof p.size !== "string") continue;
     if (!VH_NOT_DVH.test(p.size)) continue;
-    console.warn(
+    devWarn(
       `[BottomSheet] snap "${p.id}" uses "vh" \u2014 prefer "dvh" on mobile (iOS Safari URL bar makes vh unstable). See https://web.dev/blog/viewport-units`
     );
   }
@@ -256,6 +263,26 @@ var findDragSettleTarget = (input) => {
   );
 };
 
+// src/core/primitives/cancelable-emit.ts
+function emitCancelable(emit, base, warnLabel) {
+  let cancelled = false;
+  let frozen = false;
+  emit({
+    ...base,
+    cancel: () => {
+      if (frozen) {
+        devWarn(
+          `[BottomSheet] ${warnLabel}.cancel() called asynchronously \u2014 ignored. cancel() must be invoked synchronously inside the listener.`
+        );
+        return;
+      }
+      cancelled = true;
+    }
+  });
+  frozen = true;
+  return cancelled;
+}
+
 // src/core/primitives/snap-resolver.ts
 var SnapResolver = class {
   constructor(raw, allowed, mode, measureFit, onMaxAxisSizeChange) {
@@ -400,7 +427,9 @@ function notifyLinkedSheets(sheets, self) {
     try {
       if (linked.state.size === 0) continue;
       const ids = linked.getAllowedIds();
-      const target = ids.find((id) => id !== "closed");
+      const resolved = linked.getResolvedSnaps();
+      const sizeOf = (id) => resolved.find((s) => s.id === id)?.size ?? 0;
+      const target = ids.find((id) => sizeOf(id) > 0);
       if (target && target !== linked.state.activeId) {
         void linked.snapTo(target);
       }
@@ -617,11 +646,15 @@ function installVisualViewport(deps) {
       if (clamp < deps.getMaxAxisSize()) {
         deps.setMaxAxisSize(clamp);
       }
+      const wasAnimating = deps.isAnimating?.() ?? false;
+      deps.cancelInFlight();
+      deps.newCycle();
       const max = deps.getMaxAxisSize();
       deps.setSize(Math.min(deps.getSize(), max));
       const current = deps.resolveActiveSnap();
       if (current && !deps.isDragging()) {
         deps.applySize(Math.min(current.size, max));
+        if (wasAnimating) deps.resyncAfterCancel?.();
       } else {
         deps.applySize(deps.getSize());
       }
@@ -762,6 +795,54 @@ function installFitObserver(deps) {
   };
 }
 
+// src/core/features/max-height-controller.ts
+function createMaxHeightController(deps) {
+  let maxHeightCap;
+  let maxHeightRaw;
+  const resolveCap = () => {
+    const raw = maxHeightRaw;
+    if (raw === void 0) {
+      maxHeightCap = void 0;
+      return;
+    }
+    if (typeof raw === "number") {
+      maxHeightCap = raw;
+      return;
+    }
+    if (typeof window === "undefined") return;
+    const measured = resolveSnap(raw, deps.mode);
+    maxHeightCap = measured > 0 ? measured : void 0;
+  };
+  const clampTo = () => {
+    if (maxHeightCap === void 0) return;
+    if (deps.getMaxAxisSize() > maxHeightCap) {
+      deps.setMaxAxisSize(maxHeightCap);
+    }
+  };
+  return {
+    setRadius(r) {
+      deps.element.style.setProperty(
+        "--bs-radius",
+        typeof r === "number" ? `${r}px` : r
+      );
+    },
+    setMaxHeight(h) {
+      const value = typeof h === "number" ? `${h}px` : h;
+      const axis = layoutAxis(deps.mode);
+      deps.element.style.setProperty(
+        axis === "height" ? "max-height" : "max-width",
+        value
+      );
+      maxHeightRaw = h;
+      resolveCap();
+      deps.recompute();
+    },
+    resolveCap,
+    clampTo,
+    getCap: () => maxHeightCap
+  };
+}
+
 // src/core/features/fit-measurement.ts
 var measureSheetNatural = (element, content, vertical) => {
   if (!content) {
@@ -893,13 +974,6 @@ var WriteSentinel = class {
   }
 };
 
-// src/core/primitives/devWarn.ts
-function devWarn(...args) {
-  if (typeof process !== "undefined" && process.env && process.env.NODE_ENV !== "production" && typeof console !== "undefined") {
-    console.warn(...args);
-  }
-}
-
 // src/core/primitives/overlay-position.ts
 function resolveSheetAnchoredStyle(mode, position, inset) {
   const sizeOffset = `calc(var(--bs-size, 0px) + ${inset})`;
@@ -2545,8 +2619,7 @@ var BottomSheetEngine = class {
     __publicField(this, "disableCloseFlag");
     __publicField(this, "disableDragFlag");
     __publicField(this, "closeOnRouteChange");
-    __publicField(this, "maxHeightCap");
-    __publicField(this, "maxHeightRaw");
+    __publicField(this, "maxHeight");
     __publicField(this, "snapPointsRaw");
     __publicField(this, "snaps");
     __publicField(this, "activeId");
@@ -2657,11 +2730,20 @@ var BottomSheetEngine = class {
     auditVhUsage(this.snapPointsRaw);
     this.auditDuplicateSnapIds(this.snapPointsRaw);
     this.rootEl = this.element.closest(".bs-root");
+    this.maxHeight = createMaxHeightController({
+      element: this.element,
+      mode: this.mode,
+      getMaxAxisSize: () => this.snaps.getMaxAxisSize(),
+      setMaxAxisSize: (size) => {
+        this.snaps.setMaxAxisSize(size);
+      },
+      recompute: () => this.recompute()
+    });
     this.fitDeps = {
       element: this.element,
       scrollContainer: this.scrollContainer,
       mode: this.mode,
-      getMaxHeightCap: () => this.maxHeightCap
+      getMaxHeightCap: () => this.maxHeight.getCap()
     };
     this.snaps = new SnapResolver(
       this.snapPointsRaw,
@@ -2772,7 +2854,7 @@ var BottomSheetEngine = class {
   }
   use(plugin) {
     if (this.destroyed) {
-      console.warn(
+      devWarn(
         `[BottomSheet] use("${plugin.name}") called on destroyed engine \u2014 ignored.`
       );
       return this;
@@ -2814,6 +2896,9 @@ var BottomSheetEngine = class {
   getAllowedIds() {
     return this.snaps.getAllowedIds().slice();
   }
+  getResolvedSnaps() {
+    return this.snaps.getResolvedSnaps();
+  }
   async snapTo(id, velocityOrOpts = 0, _skipBeforeSnap = false) {
     if (this.destroyed) return;
     const opts = typeof velocityOrOpts === "object" ? velocityOrOpts : { velocity: velocityOrOpts };
@@ -2822,11 +2907,11 @@ var BottomSheetEngine = class {
     if (externalSignal?.aborted) return;
     const target = this.snaps.findById(id);
     if (!target) {
-      console.warn(`[BottomSheet] unknown snap id: ${id}`);
+      devWarn(`[BottomSheet] unknown snap id: ${id}`);
       return;
     }
     if (!this.snaps.getAllowedIds().includes(id)) {
-      console.warn(`[BottomSheet] snap "${id}" is not in allowed list`);
+      devWarn(`[BottomSheet] snap "${id}" is not in allowed list`);
       return;
     }
     if (!_skipBeforeSnap && this.emitBeforeSnap(target, this.activeId)) {
@@ -2958,42 +3043,11 @@ var BottomSheetEngine = class {
   }
   setRadius(r) {
     if (this.destroyed) return;
-    this.element.style.setProperty(
-      "--bs-radius",
-      typeof r === "number" ? `${r}px` : r
-    );
+    this.maxHeight.setRadius(r);
   }
   setMaxHeight(h) {
     if (this.destroyed) return;
-    const value = typeof h === "number" ? `${h}px` : h;
-    const axis = layoutAxis(this.mode);
-    this.element.style.setProperty(
-      axis === "height" ? "max-height" : "max-width",
-      value
-    );
-    this.maxHeightRaw = h;
-    this.resolveMaxHeightCap();
-    this.recompute();
-  }
-  resolveMaxHeightCap() {
-    const raw = this.maxHeightRaw;
-    if (raw === void 0) {
-      this.maxHeightCap = void 0;
-      return;
-    }
-    if (typeof raw === "number") {
-      this.maxHeightCap = raw;
-      return;
-    }
-    if (typeof window === "undefined") return;
-    const measured = resolveSnap(raw, this.mode);
-    this.maxHeightCap = measured > 0 ? measured : void 0;
-  }
-  clampToMaxHeight() {
-    if (this.maxHeightCap === void 0) return;
-    if (this.snaps.getMaxAxisSize() > this.maxHeightCap) {
-      this.snaps.setMaxAxisSize(this.maxHeightCap);
-    }
+    this.maxHeight.setMaxHeight(h);
   }
   setAllowed(ids, snap) {
     if (this.destroyed) return;
@@ -3081,7 +3135,7 @@ var BottomSheetEngine = class {
     };
     const host = this.screenComponent?.parentElement;
     if (!host) {
-      console.warn(
+      devWarn(
         "[BottomSheet] setScrimStages: no scrim element mounted \u2014 pass `scrim` to the engine first."
       );
       return () => {
@@ -3131,9 +3185,9 @@ var BottomSheetEngine = class {
   }
   recompute() {
     if (this.destroyed) return;
-    this.resolveMaxHeightCap();
+    this.maxHeight.resolveCap();
     this.snaps.recompute();
-    this.clampToMaxHeight();
+    this.maxHeight.clampTo();
     this.scrim.invalidateOpacityCache();
     if (this.gesture?.isDragging) return;
     const current = this.snaps.findById(this.activeId);
@@ -3183,42 +3237,18 @@ var BottomSheetEngine = class {
     return this.currentAbort.signal;
   }
   emitBeforeSnap(target, previousId) {
-    let cancelled = false;
-    let frozen = false;
-    this.emit("before-snap", {
-      id: target.id,
-      size: target.size,
-      previousId,
-      cancel: () => {
-        if (frozen) {
-          console.warn(
-            "[BottomSheet] before-snap.cancel() called asynchronously \u2014 ignored. cancel() must be invoked synchronously inside the listener."
-          );
-          return;
-        }
-        cancelled = true;
-      }
-    });
-    frozen = true;
-    return cancelled;
+    return emitCancelable(
+      (payload) => this.emit("before-snap", payload),
+      { id: target.id, size: target.size, previousId },
+      "before-snap"
+    );
   }
   emitBeforeClose(reason) {
-    let cancelled = false;
-    let frozen = false;
-    this.emit("before-close", {
-      reason,
-      cancel: () => {
-        if (frozen) {
-          console.warn(
-            "[BottomSheet] before-close.cancel() called asynchronously \u2014 ignored. cancel() must be invoked synchronously inside the listener."
-          );
-          return;
-        }
-        cancelled = true;
-      }
-    });
-    frozen = true;
-    return cancelled;
+    return emitCancelable(
+      (payload) => this.emit("before-close", payload),
+      { reason },
+      "before-close"
+    );
   }
   applyAutoAriaLabelledBy() {
     if (typeof document === "undefined") return;
@@ -3233,16 +3263,16 @@ var BottomSheetEngine = class {
     this.element.setAttribute("aria-labelledby", titled.id);
   }
   recomputeSnaps() {
-    this.resolveMaxHeightCap();
+    this.maxHeight.resolveCap();
     this.snaps.setRaw(this.snapPointsRaw);
-    this.clampToMaxHeight();
+    this.maxHeight.clampTo();
     this.scrim.invalidateOpacityCache();
   }
   auditDuplicateSnapIds(points) {
     const seen = /* @__PURE__ */ new Set();
     for (const p of points) {
       if (seen.has(p.id)) {
-        console.warn(
+        devWarn(
           `[BottomSheet] duplicate snap id "${p.id}" \u2014 only the first occurrence is reachable.`
         );
       }
@@ -3409,7 +3439,15 @@ var BottomSheetEngine = class {
         setSize: (size) => {
           this.size = size;
         },
-        applySize: (size) => this.applySize(size)
+        applySize: (size) => this.applySize(size),
+        cancelInFlight: () => {
+          this.animation.cancel();
+        },
+        newCycle: () => {
+          this.newCycle();
+        },
+        isAnimating: () => this.animation.isAnimating,
+        resyncAfterCancel: () => this.resyncAfterResize()
       }));
     }
     this.teardowns.add(installSliderKeyboard({
@@ -3570,6 +3608,38 @@ var BottomSheetEngine = class {
     sheetStack.update();
   }
 };
+
+// src/core/features/teleport.ts
+var resolveTeleportTarget = (target) => {
+  if (!target) return null;
+  if (typeof target !== "string") return target;
+  if (typeof document === "undefined") return null;
+  if (target === "body") return document.body;
+  return document.querySelector(target);
+};
+var teleportElements = (els, target) => {
+  const records = [];
+  for (const el of els) {
+    if (!el || el.parentNode === target) continue;
+    records.push({ el, parent: el.parentNode, next: el.nextSibling });
+    target.appendChild(el);
+  }
+  return () => {
+    for (let i = records.length - 1; i >= 0; i--) {
+      const { el, parent, next } = records[i];
+      if (parent && parent.isConnected) {
+        const before = next && next.parentNode === parent ? next : null;
+        try {
+          parent.insertBefore(el, before);
+        } catch {
+          el.parentNode?.removeChild(el);
+        }
+      } else {
+        el.parentNode?.removeChild(el);
+      }
+    }
+  };
+};
 var BottomSheet = qwik.component$((props) => {
   const sheetRef = qwik.useSignal();
   const handleRef = qwik.useSignal();
@@ -3592,7 +3662,7 @@ var BottomSheet = qwik.component$((props) => {
   qwik.useVisibleTask$(({ cleanup }) => {
     if (!sheetRef.value) return;
     if (!handleRef.value || !contentRef.value) {
-      console.warn(
+      devWarn(
         "[BottomSheet/qwik] handle or content ref missing at attach time \u2014 drag and content-swipe disabled. Make sure ref bindings render before useVisibleTask$ fires."
       );
     }
@@ -3625,6 +3695,11 @@ var BottomSheet = qwik.component$((props) => {
     };
     const engine = new BottomSheetEngine(engineOpts);
     engineStore.engine = qwik.noSerialize(engine);
+    const teleportTarget = props.teleport === false ? null : resolveTeleportTarget(props.teleportTo);
+    const restoreTeleport = teleportTarget ? teleportElements(
+      [backdropRef.value, scrimRef.value, sheetRef.value],
+      teleportTarget
+    ) : null;
     const sync = () => {
       const s = engine.state;
       state.size = s.size;
@@ -3639,8 +3714,18 @@ var BottomSheet = qwik.component$((props) => {
       sync();
       props.onSnap$?.(payload.id);
     });
-    engine.on("dragstart", sync);
-    engine.on("dragend", sync);
+    engine.on("open", (payload) => props.onOpen$?.(payload.id));
+    engine.on("close", () => props.onClose$?.());
+    engine.on("opened", (payload) => props.onOpened$?.(payload.id));
+    engine.on("closed", () => props.onClosed$?.());
+    engine.on("dragstart", (payload) => {
+      sync();
+      props.onDragStart$?.(payload);
+    });
+    engine.on("dragend", (payload) => {
+      sync();
+      props.onDragEnd$?.(payload);
+    });
     let onBackdropClick;
     if (props.backdrop !== false && props.closeOnBackdrop !== false && backdropRef.value) {
       onBackdropClick = () => {
@@ -3684,6 +3769,7 @@ var BottomSheet = qwik.component$((props) => {
       if (onBackdropClick && backdropRef.value) {
         backdropRef.value.removeEventListener("click", onBackdropClick);
       }
+      restoreTeleport?.();
       engineStore.engine = void 0;
       engine.destroy();
     });

package/dist/qwik.d.cts

@@ -1,7 +1,8 @@
 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-BcyruNP1.cjs';
-export { d as SnapPoint } from './BottomSheetEngine-BcyruNP1.cjs';
+import { T as TeleportTarget } from './teleport-7uYNiEAT.cjs';
+import { a as SnapPointDef, b as SheetMode, c as EngineOptions, d as SheetEventMap, E as EngineState } from './BottomSheetEngine-DzsIwD28.cjs';
+export { e as SnapPoint } from './BottomSheetEngine-DzsIwD28.cjs';
 import './transform-jVfAikE9.cjs';
 
 type BottomSheetProps<TId extends string = string> = {
@@ -28,11 +29,19 @@ type BottomSheetProps<TId extends string = string> = {
     disableDrag?: boolean;
     closeOnRouteChange?: boolean;
     stackEffect?: boolean;
+    teleport?: boolean;
+    teleportTo?: TeleportTarget;
     returnFocusTo?: EngineOptions["returnFocusTo"];
     ariaLabel?: string;
     radius?: string | number;
     maxHeight?: string | number;
     onSnap$?: QRL<(id: TId) => void>;
+    onOpen$?: QRL<(id: TId) => void>;
+    onClose$?: QRL<() => void>;
+    onOpened$?: QRL<(id: TId) => void>;
+    onClosed$?: QRL<() => void>;
+    onDragStart$?: QRL<(payload: SheetEventMap["dragstart"]) => void>;
+    onDragEnd$?: QRL<(payload: SheetEventMap["dragend"]) => void>;
     onChange$?: QRL<(state: EngineState & {
         activeId: TId;
     }) => void>;

package/dist/qwik.d.ts

@@ -1,7 +1,8 @@
 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-CBRcBwV-.js';
-export { d as SnapPoint } from './BottomSheetEngine-CBRcBwV-.js';
+import { T as TeleportTarget } from './teleport-7uYNiEAT.js';
+import { a as SnapPointDef, b as SheetMode, c as EngineOptions, d as SheetEventMap, E as EngineState } from './BottomSheetEngine-DRjCU73e.js';
+export { e as SnapPoint } from './BottomSheetEngine-DRjCU73e.js';
 import './transform-jVfAikE9.js';
 
 type BottomSheetProps<TId extends string = string> = {
@@ -28,11 +29,19 @@ type BottomSheetProps<TId extends string = string> = {
     disableDrag?: boolean;
     closeOnRouteChange?: boolean;
     stackEffect?: boolean;
+    teleport?: boolean;
+    teleportTo?: TeleportTarget;
     returnFocusTo?: EngineOptions["returnFocusTo"];
     ariaLabel?: string;
     radius?: string | number;
     maxHeight?: string | number;
     onSnap$?: QRL<(id: TId) => void>;
+    onOpen$?: QRL<(id: TId) => void>;
+    onClose$?: QRL<() => void>;
+    onOpened$?: QRL<(id: TId) => void>;
+    onClosed$?: QRL<() => void>;
+    onDragStart$?: QRL<(payload: SheetEventMap["dragstart"]) => void>;
+    onDragEnd$?: QRL<(payload: SheetEventMap["dragend"]) => void>;
     onChange$?: QRL<(state: EngineState & {
         activeId: TId;
     }) => void>;