@plainsheet/react 0.4.0 → 0.4.4

package/dist/plainsheet-react.es.js

@@ -1,70 +1,70 @@
-import { forwardRef as Ot, useRef as nt, useState as ot, useImperativeHandle as Dt, useCallback as Bt, useEffect as _, useMemo as Pt } from "react";
-import { createPortal as Mt } from "react-dom";
-function Yt(t) {
+import { forwardRef as Dt, useRef as ot, useState as rt, useImperativeHandle as Bt, useCallback as Mt, useEffect as _, useMemo as Pt } from "react";
+import { createPortal as Yt } from "react-dom";
+function It(t) {
   return t != null;
 }
 (function() {
   try {
     if (typeof document < "u") {
       var t = document.createElement("style");
-      t.appendChild(document.createTextNode('.pbs-root{position:fixed;left:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100%;height:fit-content;max-height:100vh;z-index:2}.pbs-dialog-reset{background-color:transparent;color:inherit;border:none;outline:none;padding:0;margin:0}.pbs-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;background-color:transparent;z-index:1;transition:background-color .2s ease-out}.pbs-backdrop.hidden{display:none}.pbs-backdrop.open{background-color:#454545b3}.pbs-container{--pbs-container-background-color: rgb(240, 240, 240);background-color:var(--pbs-container-background-color);position:relative;display:none;flex-direction:column;align-items:center;justify-content:flex-start;width:92%;height:fit-content;max-height:100vh;border-radius:10px 10px 0 0}.pbs-container.open{display:flex}.pbs-container .pbs-gap-filler{position:absolute;bottom:calc(-100vh + .5px);left:0;background-color:var(--pbs-container-background-color);content:"";width:100%;height:100vh}.pbs-handle{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:30px;cursor:pointer}.pbs-handle.hidden{display:none}.pbs-button-reset{background-color:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;border:none}button:focus.pbs-button-reset{outline:none}.pbs-handle-bar{background-color:#a8a8a8;position:relative;width:12%;height:7px;border-radius:12px}.pbs-handle-bar.hidden{display:none}.pbs-content-wrapper{position:relative;width:100%;height:fit-content;max-height:100%;overflow-y:scroll}.pbs-content-wrapper::-webkit-scrollbar{display:none}.example{-ms-overflow-style:none;scrollbar-width:none}')), document.head.appendChild(t);
+      t.appendChild(document.createTextNode('.pbs-root{position:fixed;left:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100%;height:fit-content;max-height:100vh;z-index:2}.pbs-dialog-reset{background-color:transparent;color:inherit;border:none;outline:none;padding:0;margin:0}.pbs-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:transparent;z-index:1;transition:background-color .2s ease-out}.pbs-backdrop.hidden{visibility:hidden}.pbs-backdrop.open{background-color:#454545b3}.pbs-backdrop.transparent{background-color:transparent}.pbs-container{--pbs-container-background-color: rgb(240, 240, 240);background-color:var(--pbs-container-background-color);position:relative;display:none;flex-direction:column;align-items:center;justify-content:flex-start;width:92%;height:fit-content;max-height:100vh;border-radius:10px 10px 0 0}.pbs-container.open{display:flex}.pbs-container .pbs-gap-filler{position:absolute;bottom:calc(-100vh + .5px);left:0;background-color:var(--pbs-container-background-color);content:"";width:100%;height:100vh}.pbs-handle{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:30px;cursor:pointer}.pbs-handle.hidden{display:none}.pbs-button-reset{background-color:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;border:none}button:focus.pbs-button-reset{outline:none}.pbs-handle-bar{background-color:#a8a8a8;position:relative;width:12%;height:7px;border-radius:12px}.pbs-handle-bar.hidden{display:none}.pbs-content-wrapper{position:relative;width:100%;height:fit-content;max-height:100%;overflow-y:scroll}.pbs-content-wrapper::-webkit-scrollbar{display:none}.example{-ms-overflow-style:none;scrollbar-width:none}')), document.head.appendChild(t);
     }
   } catch (e) {
     console.error("vite-plugin-css-injected-by-js", e);
   }
 })();
-var It = Object.defineProperty, Nt = (t, e, n) => e in t ? It(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n, $ = (t, e, n) => (Nt(t, typeof e != "symbol" ? e + "" : e, n), n);
-function H(t) {
+var Rt = Object.defineProperty, Nt = (t, e, n) => e in t ? Rt(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n, V = (t, e, n) => Nt(t, typeof e != "symbol" ? e + "" : e, n);
+function L(t) {
   return typeof t == "string";
 }
-function Rt(t, e) {
-  return t.classList.contains(Q(e));
+function Ft(t, e) {
+  return t.classList.contains(et(e));
 }
-function q(t, e) {
-  t.classList.add(Q(e));
+function X(t, e) {
+  t.classList.add(et(e));
 }
-function rt(t, e) {
-  t.classList.remove(Q(e));
+function it(t, e) {
+  t.classList.remove(et(e));
 }
-function U(t, e, n) {
-  H(n) && (H(e) && rt(t, e), q(t, n));
+function $(t, e, n) {
+  L(n) && (L(e) && it(t, e), X(t, n));
 }
-function Q(t) {
-  return H(t) ? t.trim().replace(/\./g, "") : "";
+function et(t) {
+  return L(t) ? t.trim().replace(/\./g, "") : "";
 }
-function I(t) {
-  return t.map((e) => Q(e)).filter(Boolean).join(" ");
+function R(t) {
+  return t.map((e) => et(e)).filter(Boolean).join(" ");
 }
-function Ft(t) {
+function Wt(t) {
   return t.map((e) => e == null ? void 0 : e.trim()).filter(Boolean).map((e) => `.${e}`).join(" ");
 }
-const dt = "open", pt = "hidden";
-function et(t, e) {
+const dt = "open", ht = "hidden";
+function nt(t, e) {
   const n = e;
   if (Array.isArray(t)) {
     t.forEach((o) => {
-      z(o, n), o.setAttribute("aria-modal", n ? "true" : "false");
+      J(o, n), o.setAttribute("aria-modal", n ? "true" : "false");
     });
     return;
   }
-  z(t, n), t.setAttribute("aria-modal", n ? "true" : "false");
+  J(t, n), t.setAttribute("aria-modal", n ? "true" : "false");
 }
-function z(t, e) {
-  e ? (q(t, dt), rt(t, pt)) : (q(t, pt), rt(t, dt));
+function J(t, e) {
+  e ? (X(t, dt), it(t, ht)) : (X(t, ht), it(t, dt));
 }
 function Ct(t) {
   return t instanceof HTMLElement;
 }
-function L(t) {
+function O(t) {
   return typeof t == "number" && !Number.isNaN(t);
 }
-function Wt(t) {
+function Ut(t) {
   Ct(t) && t.focus();
 }
-function Ut(t) {
+function jt(t) {
   if (!Ct(t) || t.offsetParent === null || "disabled" in t && t.disabled)
     return !1;
-  const e = t.getAttribute("tabindex"), n = L(e) ? parseInt(e, 10) : -1, o = [
+  const e = t.getAttribute("tabindex"), n = O(e) ? parseInt(e, 10) : -1, o = [
     "INPUT",
     "BUTTON",
     "SELECT",
@@ -75,21 +75,21 @@ function Ut(t) {
   ].includes(t.tagName), i = t instanceof HTMLAnchorElement && t.href !== "" || t instanceof HTMLAreaElement && t.href !== "";
   return o || i || n > -1;
 }
-var w = /* @__PURE__ */ ((t) => (t.Backdrop = "pbs-backdrop", t.Root = "pbs-root", t.Container = "pbs-container", t.GapFiller = "pbs-gap-filler", t.Handle = "pbs-handle", t.HandleBar = "pbs-handle-bar", t.ContentWrapper = "pbs-content-wrapper", t))(w || {}), it = /* @__PURE__ */ ((t) => (t.Button = "pbs-button-reset", t.Dialog = "pbs-dialog-reset", t))(it || {}), X = /* @__PURE__ */ ((t) => (t.Hidden = "hidden", t))(X || {});
-function P(t, e, n) {
+var w = /* @__PURE__ */ ((t) => (t.Backdrop = "pbs-backdrop", t.Root = "pbs-root", t.Container = "pbs-container", t.GapFiller = "pbs-gap-filler", t.Handle = "pbs-handle", t.HandleBar = "pbs-handle-bar", t.ContentWrapper = "pbs-content-wrapper", t))(w || {}), at = /* @__PURE__ */ ((t) => (t.Button = "pbs-button-reset", t.Dialog = "pbs-dialog-reset", t))(at || {}), K = /* @__PURE__ */ ((t) => (t.Hidden = "hidden", t))(K || {});
+function M(t, e, n) {
   const o = document.createElement(t);
   return e.split(" ").forEach((i) => {
-    q(o, i);
-  }), H(n) && o.setAttribute("data-testid", n), o;
+    X(o, i);
+  }), L(n) && o.setAttribute("data-testid", n), o;
 }
-Ft([
+Wt([
   w.Root,
   w.ContentWrapper
 ]);
-function ht(t, e, n, o) {
+function pt(t, e, n, o) {
   switch (o) {
     case "content-height":
-      return e >= t ? Et(t, e, n) : 0;
+      return e >= t ? wt(t, e, n) : 0;
     case "middle":
       return -(t / 2 - e);
     case "top":
@@ -98,7 +98,7 @@ function ht(t, e, n, o) {
       return 0;
   }
 }
-function wt(t, e) {
+function yt(t, e) {
   const n = e < t, o = e > t;
   return {
     isUp: n,
@@ -106,13 +106,13 @@ function wt(t, e) {
     stayedSame: e === t
   };
 }
-function yt(t, e) {
+function Et(t, e) {
   return e < t ? -(t - e) : e - t;
 }
-function V(t, e) {
+function Q(t, e) {
   return t > e ? t - e : e - t;
 }
-function jt(t, e) {
+function $t(t, e) {
   const n = t < e, o = t > e;
   return {
     isUp: n,
@@ -127,20 +127,20 @@ function mt(t, e, n) {
     return o ? e.visibleHeight < r : e.visibleHeight > r;
   });
 }
-function Et(t, e, n) {
+function wt(t, e, n) {
   return -(t - e) + n;
 }
 function ft(t) {
   return Number(t.replace("px", ""));
 }
-function K(t, ...e) {
+function Z(t, ...e) {
   return Number(t.toFixed(...e));
 }
 function Tt(t) {
   const e = /(?<type>\w+)\((?<values>[^)]+)\)/g, n = [];
   let o;
   for (; (o = e.exec(t)) !== null; ) {
-    const i = o[1], r = o[2].split(",").map((c) => c.trim());
+    const i = o[1], r = o[2].split(",").map((s) => s.trim());
     n.push({ type: i, values: r });
   }
   return n;
@@ -154,28 +154,28 @@ function Ht(t, e) {
     (o) => o.type.startsWith(e)
   ) || null;
 }
-const at = "translate";
-function D(t) {
+const st = "translate";
+function B(t) {
   const e = t.style.transform, n = Tt(e), o = Ht(
     n,
-    at
+    st
   );
   return kt(o ?? {
-    type: at,
+    type: st,
     values: []
   });
 }
-function J(t, { x: e, y: n }) {
+function tt(t, { x: e, y: n }) {
   const {
     transform: o,
     transformValues: i
   } = Gt(t), r = Ht(
     i,
-    at
+    st
   );
   if (r) {
-    const c = kt(r);
-    t.style.transform = `translate(${e ?? c.x ?? 0}px,${n ?? c.y ?? 0}px)`;
+    const s = kt(r);
+    t.style.transform = `translate(${e ?? s.x ?? 0}px,${n ?? s.y ?? 0}px)`;
     return;
   }
   if (o) {
@@ -195,20 +195,20 @@ function kt(t) {
     y: ft(n) ?? 0
   };
 }
-function st(t) {
+function ct(t) {
   return t != null;
 }
 function gt(t, {
   min: e,
   max: n
 }) {
-  return st(n) && t >= n ? n : st(e) && t <= e ? e : t;
+  return ct(n) && t >= n ? n : ct(e) && t <= e ? e : t;
 }
 const _t = (t, e, n) => {
-  e instanceof HTMLElement && !Rt(e, w.Handle) && n.scrollTop >= 1 || (t.isDragging = !0);
-}, $t = (t, e, n, o) => (i) => {
-  o.startY = t.getCoordinates(i).y, o.containerStartTranslate = D(e), n.onDragStart();
-}, Xt = (t, e, n, o, i) => (r) => {
+  e instanceof HTMLElement && !Ft(e, w.Handle) && n.scrollTop >= 1 || (t.isDragging = !0);
+}, Xt = (t, e, n, o) => (i) => {
+  o.startY = t.getCoordinates(i).y, o.containerStartTranslate = B(e), n.onDragStart();
+}, zt = (t, e, n, o, i) => (r) => {
   qt(
     r,
     t,
@@ -219,34 +219,34 @@ const _t = (t, e, n) => {
     n.marginTop
   );
 };
-function qt(t, e, n, o, i, r, c) {
-  if (!o.isDragging || !L(o.startY))
+function qt(t, e, n, o, i, r, s) {
+  if (!o.isDragging || !O(o.startY))
     return;
-  const s = e.getCoordinates(t).y, p = yt(o.startY, s), f = window.innerHeight, l = r.clientHeight, b = l - (o.containerStartTranslate.y + p);
-  if (b >= f)
+  const a = e.getCoordinates(t).y, d = Et(o.startY, a), p = window.innerHeight, c = r.clientHeight, m = c - (o.containerStartTranslate.y + d);
+  if (m >= p)
     return;
-  const E = wt(o.startY, s);
-  if (E.isUp && !n.expandable && b >= l)
+  const C = yt(o.startY, a);
+  if (C.isUp && !n.expandable && m >= c)
     return;
   i.start(() => {
-    J(r, {
-      y: o.containerStartTranslate.y + p
+    tt(r, {
+      y: o.containerStartTranslate.y + d
     });
   }, 0);
-  const a = f - c, k = l - o.containerStartTranslate.y;
-  if (E.isUp) {
-    const v = a - k, S = a - b, T = gt(
-      1 - K(S / v, 2),
+  const l = p - s, y = c - o.containerStartTranslate.y;
+  if (C.isUp) {
+    const v = l - y, S = l - m, E = gt(
+      1 - Z(S / v, 2),
       {
         min: 0,
         max: 1
       }
     );
-    n.onDragMove(E, T);
-  } else if (E.isDown) {
+    n.onDragMove(C, E);
+  } else if (C.isDown) {
     const v = gt(
-      K(
-        1 - b / k,
+      Z(
+        1 - m / y,
         2
       ),
       {
@@ -254,61 +254,61 @@ function qt(t, e, n, o, i, r, c) {
         max: 1
       }
     );
-    n.onDragMove(E, v);
+    n.onDragMove(C, v);
   }
 }
-const zt = (t, e, n, o, i, r, c) => (s) => {
-  if (!o.isDragging || (o.isDragging = !1, !L(o.startY)))
+const Vt = (t, e, n, o, i, r, s) => (a) => {
+  if (!o.isDragging || (o.isDragging = !1, !O(o.startY)))
     return;
   n.onDragEnd();
-  const p = o.startY, f = t.getCoordinates(s).y, l = D(e).y, b = wt(p, f), E = window.innerHeight, a = e.clientHeight;
-  if (b.isUp) {
-    const k = [...n.snapPoints].sort(
-      (T, C) => T - C
-    ), v = a + -l;
-    if (!n.expandable && v >= a)
+  const d = o.startY, p = t.getCoordinates(a).y, c = B(e).y, m = yt(d, p), C = window.innerHeight, l = e.clientHeight;
+  if (m.isUp) {
+    const y = [...n.snapPoints].sort(
+      (E, k) => E - k
+    ), v = l + -c;
+    if (!n.expandable && v >= l)
       return;
-    for (const T of k) {
-      const C = T * window.innerHeight;
-      if (v <= C) {
-        const B = V(
+    for (const E of y) {
+      const k = E * window.innerHeight;
+      if (v <= k) {
+        const T = Q(
           v,
-          C
+          k
         );
-        c.translateContainer({
-          startY: l,
-          endY: l - B,
+        s.translateContainer({
+          startY: c,
+          endY: c - T,
           animationFrame: i,
           bottomSheetContainer: e
         });
         return;
       }
     }
-    const S = Et(
-      E,
-      a,
+    const S = wt(
+      C,
+      l,
       n.marginTop
     );
-    c.translateContainer({
-      startY: l,
+    s.translateContainer({
+      startY: c,
       endY: S,
       animationFrame: i,
       bottomSheetContainer: e
     });
-  } else if (b.isDown) {
-    const k = [...n.snapPoints].sort(
+  } else if (m.isDown) {
+    const y = [...n.snapPoints].sort(
       (v, S) => S - v
     );
-    for (const v of k) {
-      const S = v * window.innerHeight, T = a + -l;
-      if (T >= S) {
-        const C = V(
-          T,
+    for (const v of y) {
+      const S = v * window.innerHeight, E = l + -c;
+      if (E >= S) {
+        const k = Q(
+          E,
           S
         );
-        c.translateContainer({
-          startY: l,
-          endY: l + C,
+        s.translateContainer({
+          startY: c,
+          endY: c + k,
           animationFrame: i,
           bottomSheetContainer: e
         });
@@ -318,7 +318,7 @@ const zt = (t, e, n, o, i, r, c) => (s) => {
     r();
   }
 };
-var F = /* @__PURE__ */ ((t) => (t[t.All = -1] = "All", t[t.None = 0] = "None", t[t.Capture = 1] = "Capture", t[t.Target = 2] = "Target", t[t.Bubble = 3] = "Bubble", t))(F || {});
+var W = /* @__PURE__ */ ((t) => (t[t.All = -1] = "All", t[t.None = 0] = "None", t[t.Capture = 1] = "Capture", t[t.Target = 2] = "Target", t[t.Bubble = 3] = "Bubble", t))(W || {});
 function bt(t) {
   switch (t) {
     case 0:
@@ -333,16 +333,16 @@ function bt(t) {
       return -1;
   }
 }
-const Vt = {
-  eventPhase: F.All
+const Kt = {
+  eventPhase: W.All
 };
-class j {
+class G {
   constructor(e) {
-    $(this, "currentTarget"), this.currentTarget = e;
+    V(this, "currentTarget"), this.currentTarget = e;
   }
   addEventListeners({
     onStart: e,
-    onStartOptions: n = Vt,
+    onStartOptions: n = Kt,
     onMove: o,
     onEnd: i
   }) {
@@ -357,7 +357,7 @@ class j {
     e && this.currentTarget.addEventListener(
       "touchstart",
       (r) => {
-        if (n.eventPhase === F.All) {
+        if (n.eventPhase === W.All) {
           e(r);
           return;
         }
@@ -377,7 +377,7 @@ class j {
     e && this.currentTarget.addEventListener(
       "mousedown",
       (r) => {
-        if (n.eventPhase === F.All) {
+        if (n.eventPhase === W.All) {
           e(r);
           return;
         }
@@ -428,86 +428,92 @@ class j {
     };
   }
 }
-function Kt(t, e) {
-  const n = Jt(t);
-  Qt(n), n.bottomSheetContainer.style.width = t.width;
+function Lt(t) {
+  const e = t;
+  return `${e} ${e} 0px 0px`;
+}
+function Jt(t, e) {
+  const n = Qt(t);
+  Zt(n), n.bottomSheetContainer.style.width = t.width;
   const o = document.createElement("div");
   o.innerHTML = t.content ?? "";
   const i = window.innerHeight;
   n.bottomSheetContainer.style.maxHeight = `${i}px`, n.bottomSheetContentWrapper.appendChild(o);
-  const r = Zt({
+  const r = te({
     bottomSheetElements: n,
     bottomSheetProps: t,
     options: e
   });
   return { elements: n, eventHandlers: r };
 }
-function Jt(t) {
-  const e = P(
+function Qt(t) {
+  const e = M(
     "dialog",
-    I([
+    R([
       w.Root,
-      it.Dialog,
+      at.Dialog,
       t.rootClass
     ]),
     w.Root
   );
   e.ariaLabel = t.ariaLabel;
-  const n = P(
+  const n = M(
     "section",
-    I([w.Container, t.containerClass]),
+    R([w.Container, t.containerClass]),
     w.Container
   );
-  t.containerBorderRadius && (n.style.borderRadius = t.containerBorderRadius);
-  const o = P(
+  t.containerBorderRadius && (n.style.borderRadius = Lt(
+    t.containerBorderRadius
+  ));
+  const o = M(
     "div",
     w.GapFiller,
     w.GapFiller
-  ), i = P(
+  ), i = M(
     "button",
-    I([
+    R([
       w.Handle,
-      it.Button,
-      t.shouldShowHandle ? null : X.Hidden,
+      at.Button,
+      t.shouldShowHandle ? null : K.Hidden,
       t.handleClass
     ]),
     w.Handle
   );
   i.setAttribute("type", "button"), i.ariaLabel = "bottom sheet close button";
-  const r = P(
+  const r = M(
     "span",
-    I([
+    R([
       w.HandleBar,
-      t.shouldShowHandle ? null : X.Hidden
+      t.shouldShowHandle ? null : K.Hidden
     ]),
     w.HandleBar
-  ), c = P(
+  ), s = M(
     "article",
-    I([
+    R([
       w.ContentWrapper,
       t.contentWrapperClass
     ]),
     w.ContentWrapper
-  ), s = P(
+  ), a = M(
     "div",
-    I([
+    R([
       w.Backdrop,
       t.backdropClass,
-      X.Hidden
+      K.Hidden
     ]),
     w.Backdrop
   );
-  return t.backdropColor && (s.style.backgroundColor = t.backdropColor), t.backDropTransition && (s.style.transition = t.backDropTransition), {
+  return t.backdropColor && (a.style.backgroundColor = t.backdropColor), t.backDropTransition && (a.style.transition = t.backDropTransition), {
     bottomSheetRoot: e,
-    bottomSheetBackdrop: s,
+    bottomSheetBackdrop: a,
     bottomSheetContainer: n,
     bottomSheetHandle: i,
     bottomSheetHandleBar: r,
-    bottomSheetContentWrapper: c,
+    bottomSheetContentWrapper: s,
     bottomSheetContainerGapFiller: o
   };
 }
-function Qt({
+function Zt({
   bottomSheetRoot: t,
   bottomSheetContainer: e,
   bottomSheetHandle: n,
@@ -517,7 +523,7 @@ function Qt({
 }) {
   t.appendChild(e), n.appendChild(o), e.appendChild(n), e.appendChild(i), e.appendChild(r);
 }
-function Zt({
+function te({
   bottomSheetElements: t,
   bottomSheetProps: e,
   options: n
@@ -526,36 +532,37 @@ function Zt({
     bottomSheetRoot: o,
     bottomSheetContainer: i,
     bottomSheetHandle: r,
-    bottomSheetContainerGapFiller: c,
-    bottomSheetContentWrapper: s
-  } = t, { animationFrame: p } = n, f = new j(r), l = new j(
+    bottomSheetContainerGapFiller: s,
+    bottomSheetContentWrapper: a,
+    bottomSheetBackdrop: d
+  } = t, { animationFrame: p } = n, c = new G(r), m = new G(
+    a
+  ), C = new G(
     s
-  ), b = new j(
-    c
-  ), E = e.dragTriggers.reduce(
-    (g, x) => {
-      const O = o.querySelectorAll(x);
-      if (!O.length)
-        return g;
-      const tt = Array.from(O).map((M) => M instanceof HTMLElement ? new j(M) : null).filter((M) => !!M);
-      return [...g, ...tt];
+  ), l = e.dragTriggers.reduce(
+    (b, A) => {
+      const D = o.querySelectorAll(A);
+      if (!D.length)
+        return b;
+      const h = Array.from(D).map((u) => u instanceof HTMLElement ? new G(u) : null).filter((u) => !!u);
+      return [...b, ...h];
     },
     []
-  ), a = new j(
+  ), y = new G(
     window
-  ), k = $t(
-    a,
+  ), v = Xt(
+    y,
     i,
     e,
     n.draggingState
-  ), v = Xt(
-    a,
+  ), S = zt(
+    y,
     i,
     e,
     n.draggingState,
     p
-  ), S = zt(
-    a,
+  ), E = Vt(
+    y,
     i,
     e,
     n.draggingState,
@@ -563,94 +570,102 @@ function Zt({
     n.onClose,
     n.bottomSheetState
   );
-  function T(g) {
-    g.target instanceof Element && !o.contains(g.target) && n.onClose();
+  function k(b) {
+    b.target instanceof Element && !o.contains(b.target) && n.onClose();
   }
-  function C(g) {
+  function T(b) {
     _t(
       n.draggingState,
-      g.target,
+      b.target,
       t.bottomSheetContentWrapper
     );
   }
-  function B() {
-    e.draggable && (f.addEventListeners({
-      onStart: C
-    }), E.forEach((g) => {
-      g.addEventListeners({
-        onStart: C,
+  function P() {
+    e.draggable && (c.addEventListeners({
+      onStart: T
+    }), l.forEach((b) => {
+      b.addEventListeners({
+        onStart: T,
         onStartOptions: {
-          eventPhase: F.Target
+          eventPhase: W.Target
         }
       });
-    })), e.draggable && e.backgroundDraggable && (l.addEventListeners({
-      onStart: C,
+    })), e.draggable && e.backgroundDraggable && (m.addEventListeners({
+      onStart: T,
       onStartOptions: {
-        eventPhase: F.Target
+        eventPhase: W.Target
       }
-    }), b.addEventListeners({
-      onStart: C
-    })), e.draggable && a.addEventListeners({
-      onStart: k,
-      onMove: v,
-      onEnd: S
-    }), e.draggable && window.document.addEventListener("keyup", (g) => {
-      g.key === "Escape" && n.onClose();
-    }), e.shouldCloseOnOutsideClick && window.document.addEventListener("click", T), r.addEventListener("keyup", (g) => {
-      if (g.key === "ArrowUp") {
+    }), C.addEventListeners({
+      onStart: T
+    })), e.draggable && y.addEventListeners({
+      onStart: v,
+      onMove: S,
+      onEnd: E
+    }), e.draggable && window.document.addEventListener("keyup", (b) => {
+      b.key === "Escape" && n.onClose();
+    }), r.addEventListener("keyup", (b) => {
+      if (b.key === "ArrowUp") {
         n.moveUp();
         return;
       }
-      if (g.key === "ArrowDown") {
+      if (b.key === "ArrowDown") {
         n.moveDown();
         return;
       }
-      if (g.shiftKey && g.key === "Tab") {
-        const x = G(
+      if (b.shiftKey && b.key === "Tab") {
+        const A = Y(
           t.bottomSheetContentWrapper
         );
-        Wt(x);
+        Ut(A);
       }
     });
   }
-  function G(g) {
-    let x = [...Array.from(g.childNodes).reverse()];
-    for (; x.length; ) {
-      const O = x.shift();
-      if (Ut(O))
-        return O;
-      O && (x = [
-        ...x,
-        ...Array.from(O.childNodes).reverse()
+  function z() {
+    e.shouldCloseOnOutsideClick ? d.addEventListener("click", k) : d.style.pointerEvents = "none";
+  }
+  function j() {
+    d.removeEventListener("click", k);
+  }
+  function Y(b) {
+    let A = [...Array.from(b.childNodes).reverse()];
+    for (; A.length; ) {
+      const D = A.shift();
+      if (jt(D))
+        return D;
+      D && (A = [
+        ...A,
+        ...Array.from(D.childNodes).reverse()
       ]);
     }
     return null;
   }
-  function Z() {
-    f.removeEventListeners({
-      onStart: C
-    }), l.removeEventListeners({
-      onStart: C
-    }), b.removeEventListeners({
-      onStart: C
-    }), E.forEach((g) => {
-      g.removeEventListeners({
-        onStart: C
+  function q() {
+    c.removeEventListeners({
+      onStart: T
+    }), m.removeEventListeners({
+      onStart: T
+    }), C.removeEventListeners({
+      onStart: T
+    }), l.forEach((b) => {
+      b.removeEventListeners({
+        onStart: T
       });
-    }), a.removeEventListeners({
-      onStart: k,
-      onMove: v,
-      onEnd: S
-    }), window.removeEventListener("click", T);
+    }), y.removeEventListeners({
+      onStart: v,
+      onMove: S,
+      onEnd: E
+    });
   }
   return {
-    attachEventListeners: B,
-    clearEventListeners: Z
+    attachEventListeners: P,
+    clearEventListeners: q,
+    attacheOnOpenEventListeners: z,
+    clearOnOpenEventListeners: j
   };
 }
-class te {
+class ee {
   constructor() {
-    $(this, "animationId"), $(this, "isInProgress"), $(this, "startedAt"), this.animationId = null, this.isInProgress = !1, this.startedAt = null;
+    V(this, "animationId"), V(this, "isInProgress"), V(this, "startedAt"), this.animationId = null, this.isInProgress = !1, this.startedAt = null;
   }
   /**
    *
@@ -661,57 +676,57 @@ class te {
     this.isInProgress = !0;
     const i = (r) => {
       this.startedAt || (this.startedAt = r);
-      const c = r - this.startedAt, s = n === 0 ? 1 : K(c / n, 2), p = s >= 1 && !o;
-      e(s), p ? this.stop() : this.animationId = requestAnimationFrame(i);
+      const s = r - this.startedAt, a = n === 0 ? 1 : Z(s / n, 2), d = a >= 1 && !o;
+      e(a), d ? this.stop() : this.animationId = requestAnimationFrame(i);
     };
     this.animationId = requestAnimationFrame(i);
   }
   stop() {
-    this.isInProgress = !1, this.startedAt = null, L(this.animationId) && cancelAnimationFrame(this.animationId);
+    this.isInProgress = !1, this.startedAt = null, O(this.animationId) && cancelAnimationFrame(this.animationId);
   }
 }
-function ee(t) {
+function ne(t) {
   const {
     startY: e,
     endY: n,
     bottomSheetContainer: o,
     animationFrame: i,
     onEnd: r,
-    animationTimingFunction: c,
-    animationDuration: s
-  } = t, p = yt(e, n);
+    animationTimingFunction: s,
+    animationDuration: a
+  } = t, d = Et(e, n);
   i.stop();
-  let f = !1;
-  i.start((l) => {
-    J(o, {
-      y: e + p * c(l)
-    }), !f && l >= 1 && (r == null || r(), f = !0);
-  }, s);
+  let p = !1;
+  i.start((c) => {
+    tt(o, {
+      y: e + d * s(c)
+    }), !p && c >= 1 && (r == null || r(), p = !0);
+  }, a);
 }
-const ct = (t, e) => (n) => {
-  ee({
+const lt = (t, e) => (n) => {
+  ne({
     ...n,
     animationTimingFunction: t,
     animationDuration: e
   });
-}, R = {
+}, F = {
   TOP: "top",
   MIDDLE: "middle",
   CONTENT_HEIGHT: "content-height",
   CLOSED: "closed"
 };
-function ne(t) {
-  return !(!L(t) || t > 1 || t < 0);
+function oe(t) {
+  return !(!O(t) || t > 1 || t < 0);
 }
-function oe(t, e) {
+function re(t, e) {
   const n = {
-    set(o, i, r, c) {
-      return e(i, r), Reflect.set(o, i, r, c);
+    set(o, i, r, s) {
+      return e(i, r), Reflect.set(o, i, r, s);
     }
   };
   return new Proxy(t, n);
 }
-function re(...t) {
+function ie(...t) {
   console.error(t);
 }
 const N = {
@@ -721,50 +736,50 @@ const N = {
   EASE_IN_OUT: "ease-in-out",
   SPRING: "spring"
 };
-function ie(t) {
+function ae(t) {
   for (const e of Object.values(N))
     if (e === t)
       return !0;
   return !1;
 }
-function Lt(t) {
-  return !!(t instanceof Object && "p1x" in t && "p1y" in t && "p2x" in t && "p2y" in t && L(t.p1x) && L(t.p1y) && L(t.p2x) && L(t.p2y));
+function Ot(t) {
+  return !!(t instanceof Object && "p1x" in t && "p1y" in t && "p2x" in t && "p2y" in t && O(t.p1x) && O(t.p1y) && O(t.p2x) && O(t.p2y));
 }
-function W(t, e, n, o) {
-  return function(s) {
-    return c(i(s));
+function U(t, e, n, o) {
+  return function(a) {
+    return s(i(a));
   };
-  function i(s) {
-    let p = 0, f = 1, l = s, b;
-    if (s === 0 || s === 1)
-      return s;
-    for (; p < f; ) {
-      if (b = r(l), Math.abs(b - s) < 1e-3)
-        return l;
-      s > b ? p = l : f = l, l = (f + p) / 2;
+  function i(a) {
+    let d = 0, p = 1, c = a, m;
+    if (a === 0 || a === 1)
+      return a;
+    for (; d < p; ) {
+      if (m = r(c), Math.abs(m - a) < 1e-3)
+        return c;
+      a > m ? d = c : p = c, c = (p + d) / 2;
     }
-    return l;
+    return c;
   }
-  function r(s) {
-    return 3 * t * s * Math.pow(1 - s, 2) + 3 * n * Math.pow(s, 2) * (1 - s) + Math.pow(s, 3);
+  function r(a) {
+    return 3 * t * a * Math.pow(1 - a, 2) + 3 * n * Math.pow(a, 2) * (1 - a) + Math.pow(a, 3);
   }
-  function c(s) {
-    return 3 * e * s * Math.pow(1 - s, 2) + 3 * o * Math.pow(s, 2) * (1 - s) + Math.pow(s, 3);
+  function s(a) {
+    return 3 * e * a * Math.pow(1 - a, 2) + 3 * o * Math.pow(a, 2) * (1 - a) + Math.pow(a, 3);
   }
 }
-const ae = W(0.25, 0.1, 0.25, 1), se = W(0.42, 0, 1, 1), xt = W(0.42, 0, 0.58, 1), vt = W(0.4, 0.1, 0.6, 1), ce = W(0.45, 1.5, 0.55, 1);
-function le(t) {
+const vt = U(0.25, 0.1, 0.25, 1), se = U(0.42, 0, 1, 1), xt = U(0.42, 0, 0.58, 1), ce = U(0.4, 0.1, 0.6, 1), le = U(0.45, 1.5, 0.55, 1);
+function ue(t) {
   switch (t) {
     case N.EASE:
-      return ae;
+      return vt;
     case N.EASE_IN:
       return se;
     case N.EASE_OUT:
       return xt;
     case N.EASE_IN_OUT:
-      return vt;
-    case N.SPRING:
       return ce;
+    case N.SPRING:
+      return le;
     default:
       return vt;
   }
@@ -772,10 +787,10 @@ function le(t) {
 function St(t) {
   return typeof t == "boolean";
 }
-const ue = {
+const de = {
   ariaLabel: "Bottom sheet",
   content: "",
-  defaultPosition: R.CONTENT_HEIGHT,
+  defaultPosition: F.CONTENT_HEIGHT,
   marginTop: 20,
   snapPoints: [],
   width: "92%",
@@ -811,13 +826,13 @@ const ue = {
   draggingAnimationTimings: "ease-in-out",
   draggingAnimationDuration: 180
 };
-function de(t) {
+function he(t) {
   const e = {
-    ...ue
+    ...de
   }, n = Object.entries(t).reduce(
     (o, i) => {
-      const [r, c] = i;
-      return st(c) && (o[r] = c), o;
+      const [r, s] = i;
+      return ct(s) && (o[r] = s), o;
     },
     {}
   );
@@ -826,112 +841,112 @@ function de(t) {
     ...n
   };
 }
-function lt(t) {
-  if (Lt(t)) {
+function ut(t) {
+  if (Ot(t)) {
     const { p1x: e, p1y: n, p2x: o, p2y: i } = t;
-    return W(e, n, o, i);
+    return U(e, n, o, i);
   }
-  return ie(t) ? le(t) : xt;
+  return ae(t) ? ue(t) : xt;
 }
 function pe(t, e, n) {
   function o(i, r) {
     switch (i) {
       case "content":
-        H(r) && (t.bottomSheetContentWrapper.innerHTML = r);
+        L(r) && (t.bottomSheetContentWrapper.innerHTML = r);
         break;
       case "width":
-        H(r) && (t.bottomSheetContainer.style.width = r);
+        L(r) && (t.bottomSheetContainer.style.width = r);
         break;
       case "shouldShowHandle":
-        St(r) || z(t.bottomSheetHandle, !1);
+        St(r) || J(t.bottomSheetHandle, !1);
         break;
       case "shouldShowBackdrop":
-        St(r) || z(t.bottomSheetBackdrop, !1);
+        St(r) || J(t.bottomSheetBackdrop, !1);
         break;
       case "containerBorderRadius":
-        H(r) && (t.bottomSheetContainer.style.borderRadius = r);
+        L(r) && (t.bottomSheetContainer.style.borderRadius = Lt(r));
         break;
       case "backdropColor":
-        H(r) && (t.bottomSheetBackdrop.style.backgroundColor = r);
+        L(r) && (t.bottomSheetBackdrop.style.backgroundColor = r);
         break;
       case "backDropTransition":
-        H(r) && (t.bottomSheetBackdrop.style.transition = r);
+        L(r) && (t.bottomSheetBackdrop.style.transition = r);
         break;
       case "rootClass":
-        if (!H(r))
+        if (!L(r))
           return;
-        U(
+        $(
           t.bottomSheetRoot,
           n.rootClass,
           r
         );
         break;
       case "containerClass":
-        if (!H(r))
+        if (!L(r))
           return;
-        U(
+        $(
           t.bottomSheetContainer,
           n.containerClass,
           r
         );
         break;
       case "handleClass":
-        if (!H(r))
+        if (!L(r))
           return;
-        U(
+        $(
           t.bottomSheetHandle,
           n.handleClass,
           r
         );
         break;
       case "contentWrapperClass":
-        if (!H(r))
+        if (!L(r))
           return;
-        U(
+        $(
           t.bottomSheetContentWrapper,
           n.contentWrapperClass,
           r
         );
         break;
       case "backdropClass":
-        if (!H(r))
+        if (!L(r))
           return;
-        U(
+        $(
           t.bottomSheetBackdrop,
           n.backdropClass,
           r
         );
         break;
       case "draggingAnimationTimings":
-        if (Lt(r)) {
-          const c = lt(r), s = ct(
-            c,
+        if (Ot(r)) {
+          const s = ut(r), a = lt(
+            s,
             n.draggingAnimationDuration
           );
-          e.translateContainer = s;
+          e.translateContainer = a;
         }
         break;
       case "draggingAnimationDuration":
-        if (L(r)) {
-          const c = lt(
+        if (O(r)) {
+          const s = ut(
             n.draggingAnimationTimings
-          ), s = ct(
-            c,
+          ), a = lt(
+            s,
             r
           );
-          e.translateContainer = s;
+          e.translateContainer = a;
         }
         break;
     }
   }
   return o;
 }
-function he(t) {
-  const e = de(t), n = lt(
+function me(t) {
+  const e = he(t), n = ut(
     t.draggingAnimationTimings
   ), o = {
     isMounted: !1,
-    translateContainer: ct(
+    translateContainer: lt(
       n,
       e.draggingAnimationDuration
     )
@@ -948,198 +963,198 @@ function he(t) {
   function r() {
     i.originalDocumentOverflowY && i.originalDocumentOverflowY !== "hidden" && (document.body.style.overflowY = i.originalDocumentOverflowY), i.originalDocumentOverscrollBehavior && (document.body.style.position = i.originalDocumentOverscrollBehavior);
   }
-  const c = new te(), s = {
-    animationFrame: c,
-    onClose: T,
+  const s = new ee(), a = {
+    animationFrame: s,
+    onClose: E,
     bottomSheetState: o,
     draggingState: i,
-    snapTo: ut,
-    moveUp: tt,
-    moveDown: M
-  }, { elements: p, eventHandlers: f } = Kt(
+    snapTo: D,
+    moveUp: b,
+    moveDown: A
+  }, { elements: d, eventHandlers: p } = Jt(
     e,
-    s
-  ), l = oe(
+    a
+  ), c = re(
     e,
-    pe(p, o, e)
-  ), { bottomSheetBackdrop: b, bottomSheetRoot: E, bottomSheetContainer: a } = p, k = (u) => {
-    const d = u ?? window.document.body;
-    d.appendChild(E), d.appendChild(b);
-    const h = window.innerHeight;
-    J(a, {
-      y: h
-    }), f.attachEventListeners(), o.isMounted = !0;
+    pe(d, o, e)
+  ), { bottomSheetBackdrop: m, bottomSheetRoot: C, bottomSheetContainer: l } = d, y = (h) => {
+    const u = h ?? window.document.body;
+    u.appendChild(C), u.appendChild(m);
+    const f = window.innerHeight;
+    tt(l, {
+      y: f
+    }), p.attachEventListeners(), o.isMounted = !0;
   }, v = () => {
-    f.clearEventListeners(), Object.values(p).forEach((u) => {
-      u.remove();
+    p.clearEventListeners(), Object.values(d).forEach((h) => {
+      h.remove();
     }), r(), o.isMounted = !1;
   }, S = () => {
-    var u;
-    if (C() || re(
+    var h;
+    if (k() || ie(
       'Bottom Sheet is not mounted yet. call the "mount" method first.'
-    ), (u = t.beforeOpen) == null || u.call(t), B())
+    ), (h = t.beforeOpen) == null || h.call(t), T())
       return;
-    l.shouldShowBackdrop && et(b, !0), et([a], !0), J(a, {
-      y: a.clientHeight
+    nt(m, !0), c.shouldShowBackdrop || X(m, "transparent"), nt([l], !0), tt(l, {
+      y: l.clientHeight
     });
-    const d = window.innerHeight, h = ht(
-      d,
-      a.clientHeight,
-      l.marginTop,
-      l.defaultPosition
-    ), m = D(a).y;
+    const u = window.innerHeight, f = pt(
+      u,
+      l.clientHeight,
+      c.marginTop,
+      c.defaultPosition
+    ), g = B(l).y;
     o.translateContainer({
-      startY: m,
-      endY: h,
-      animationFrame: c,
-      bottomSheetContainer: a,
+      startY: g,
+      endY: f,
+      animationFrame: s,
+      bottomSheetContainer: l,
       onEnd: t.afterOpen
-    }), p.bottomSheetHandle.focus();
-    const y = document.body.style.overflowY;
-    i.originalDocumentOverflowY = y || "initial";
-    const A = document.body.style.overscrollBehavior;
-    i.originalDocumentOverscrollBehavior = A || "initial", document.body.style.overflow = "hidden", document.body.style.overscrollBehavior = "contain";
+    });
+    const H = document.body.style.overflowY;
+    i.originalDocumentOverflowY = H || "initial";
+    const x = document.body.style.overscrollBehavior;
+    i.originalDocumentOverscrollBehavior = x || "initial", document.body.style.overflow = "hidden", document.body.style.overscrollBehavior = "contain", d.bottomSheetHandle.focus(), p.attacheOnOpenEventListeners();
   };
-  function T() {
-    var u;
-    if (G())
+  function E() {
+    var h;
+    if (P())
       return;
-    (u = t.beforeClose) == null || u.call(t);
-    const d = D(a).y, h = a.clientHeight;
+    (h = t.beforeClose) == null || h.call(t);
+    const u = B(l).y, f = l.clientHeight;
     o.translateContainer({
-      startY: d,
-      endY: h,
-      animationFrame: c,
-      bottomSheetContainer: a,
+      startY: u,
+      endY: f,
+      animationFrame: s,
+      bottomSheetContainer: l,
       onEnd: () => {
-        var m;
-        (m = t.afterClose) == null || m.call(t), et([b, a], !1);
+        var g;
+        (g = t.afterClose) == null || g.call(t), nt([m, l], !1), p.clearOnOpenEventListeners();
       }
     }), r();
   }
-  function C() {
+  function k() {
     return o.isMounted;
   }
-  function B() {
-    const u = D(a).y, d = window.innerHeight, h = a.clientHeight >= d ? d : a.clientHeight;
-    return u < h;
+  function T() {
+    const h = B(l).y, u = window.innerHeight, f = l.clientHeight >= u ? u : l.clientHeight;
+    return h <= f;
   }
-  function G() {
-    return !B();
+  function P() {
+    return !T();
   }
-  function Z() {
-    const u = D(a).y, d = a.clientHeight, h = window.innerHeight;
-    if (u <= 5 && u >= -5)
-      return R.CONTENT_HEIGHT;
-    const m = d - u;
-    if (m === h / 2)
-      return R.MIDDLE;
-    const y = h - l.marginTop, A = 10;
-    return m <= y + A && m >= y - A ? R.TOP : R.CLOSED;
+  function z() {
+    const h = B(l).y, u = l.clientHeight, f = window.innerHeight;
+    if (h <= 5 && h >= -5)
+      return F.CONTENT_HEIGHT;
+    const g = u - h;
+    if (g === f / 2)
+      return F.MIDDLE;
+    const H = f - c.marginTop, x = 10;
+    return g <= H + x && g >= H - x ? F.TOP : F.CLOSED;
   }
-  function g() {
-    return a.clientHeight;
+  function j() {
+    return l.clientHeight;
   }
-  function x(u) {
-    if (!B())
+  function Y(h) {
+    if (!T())
       return;
-    const d = D(a).y, h = a.clientHeight - d, m = window.innerHeight - u, y = jt(h, m), A = V(h, m);
+    const u = B(l).y, f = l.clientHeight - u, g = window.innerHeight - h, H = $t(f, g), x = Q(f, g);
     o.translateContainer({
-      startY: d,
-      endY: d + (y.isUp ? -A : A),
-      animationFrame: c,
-      bottomSheetContainer: a
+      startY: u,
+      endY: u + (H.isUp ? -x : x),
+      animationFrame: s,
+      bottomSheetContainer: l
     });
   }
-  function O(u, {
-    viewportHeight: d,
-    visibleHeight: h
+  function q(h, {
+    viewportHeight: u,
+    visibleHeight: f
   }) {
-    let m = null;
-    for (const y of u) {
-      const A = y * d, Y = V(
-        h,
-        A
+    let g = null;
+    for (const H of h) {
+      const x = H * u, I = Q(
+        f,
+        x
       );
-      (m === null || Y < m) && (m = Y);
+      (g === null || I < g) && (g = I);
     }
     return {
-      minOffset: m
+      minOffset: g
     };
   }
-  function tt() {
-    const u = [...l.snapPoints].reverse(), d = D(a).y, h = a.clientHeight, m = h - d;
-    if (!l.expandable && m >= h)
+  function b() {
+    const h = [...c.snapPoints].reverse(), u = B(l).y, f = l.clientHeight, g = f - u;
+    if (!c.expandable && g >= f)
       return;
-    const y = window.innerHeight, A = mt(
+    const H = window.innerHeight, x = mt(
       "above",
-      { visibleHeight: m, viewportHeight: y },
-      u
-    ), { minOffset: Y } = O(A, {
-      visibleHeight: m,
-      viewportHeight: y
+      { visibleHeight: g, viewportHeight: H },
+      h
+    ), { minOffset: I } = q(x, {
+      visibleHeight: g,
+      viewportHeight: H
     });
-    if (Y === null && m < y - l.marginTop) {
+    if (I === null && g < H - c.marginTop) {
       o.translateContainer({
-        startY: d,
-        endY: ht(
-          y,
-          h,
-          l.marginTop,
+        startY: u,
+        endY: pt(
+          H,
+          f,
+          c.marginTop,
           "top"
         ),
-        animationFrame: c,
-        bottomSheetContainer: a
+        animationFrame: s,
+        bottomSheetContainer: l
       });
       return;
     }
-    L(Y) && o.translateContainer({
-      startY: d,
-      endY: d - Y,
-      animationFrame: c,
-      bottomSheetContainer: a
+    O(I) && o.translateContainer({
+      startY: u,
+      endY: u - I,
+      animationFrame: s,
+      bottomSheetContainer: l
     });
   }
-  function M() {
-    const u = D(a).y, d = a.clientHeight - u;
-    if (d < 1)
+  function A() {
+    const h = B(l).y, u = l.clientHeight - h;
+    if (u < 1)
       return;
-    const h = window.innerHeight, m = mt(
+    const f = window.innerHeight, g = mt(
       "below",
-      { visibleHeight: d, viewportHeight: h },
-      l.snapPoints
-    ), { minOffset: y } = O(m, {
-      visibleHeight: d,
-      viewportHeight: h
+      { visibleHeight: u, viewportHeight: f },
+      c.snapPoints
+    ), { minOffset: H } = q(g, {
+      visibleHeight: u,
+      viewportHeight: f
     });
-    L(y) && o.translateContainer({
-      startY: u,
-      endY: u + y,
-      animationFrame: c,
-      bottomSheetContainer: a
+    O(H) && o.translateContainer({
+      startY: h,
+      endY: h + H,
+      animationFrame: s,
+      bottomSheetContainer: l
     });
   }
-  function ut(u) {
-    const d = window.innerHeight;
-    if (!ne(u))
+  function D(h) {
+    const u = window.innerHeight;
+    if (!oe(h))
       return;
-    const h = K(d * u, 2);
-    x(h);
+    const f = Z(u * h, 2);
+    Y(f);
   }
   return {
-    props: l,
-    elements: p,
-    mount: k,
+    props: c,
+    elements: d,
+    mount: y,
     unmount: v,
     open: S,
-    close: T,
-    getIsMounted: C,
-    getIsOpen: B,
-    getIsClosed: G,
-    getPosition: Z,
-    getHeight: g,
-    moveTo: x,
-    snapTo: ut
+    close: E,
+    getIsMounted: k,
+    getIsOpen: T,
+    getIsClosed: P,
+    getPosition: z,
+    getHeight: j,
+    moveTo: Y,
+    snapTo: D
   };
 }
 function At() {
@@ -1165,7 +1180,7 @@ function At() {
     getHeight: () => 0,
     getIsOpen: () => !1,
     getIsClosed: () => !0,
-    getPosition: () => R.CLOSED,
+    getPosition: () => F.CLOSED,
     moveTo: () => {
     },
     snapTo: () => {
@@ -1175,73 +1190,115 @@ function At() {
     }
   };
 }
-const me = At(), ve = Ot(
+const fe = At(), Se = Dt(
   function(e, n) {
     const {
       children: o,
       isOpen: i,
       setIsOpen: r,
-      afterClose: c,
-      mountingPoint: s,
-      ...p
-    } = e, f = nt(me), [l, b] = ot(
-      f.current
+      afterClose: s,
+      mountingPointRef: a,
+      ...d
+    } = e, p = ot(fe), [c, m] = rt(
+      p.current
     );
-    Dt(
+    Bt(
       n,
-      () => l,
-      [l]
+      () => c,
+      [c]
     );
-    const E = Bt(() => {
-      r(!1), c == null || c();
-    }, [c]);
+    const C = Mt(() => {
+      r(!1), s == null || s();
+    }, [s]);
     _(() => {
-      i ? l.open() : l.close();
+      i ? c.open() : c.close();
     }, [i]);
-    const a = nt(null);
+    const l = ot(null);
     return _(
       function() {
-        const v = Yt(e.mountingPoint) ? e.mountingPoint : window.document.body;
-        if (!v || l.getIsMounted())
+        var E;
+        if (a && !a.current)
+          return;
+        const v = It((E = e.mountingPointRef) == null ? void 0 : E.current) ? e.mountingPointRef.current : window.document.body;
+        if (!v || c.getIsMounted())
           return;
-        const S = he({
+        const S = me({
           content: "",
-          ...p,
-          afterClose: E
+          ...d,
+          afterClose: C
         });
-        return S.mount(v), a.current = S.elements.bottomSheetContentWrapper ?? null, f.current = S, b(S), () => {
-          l.unmount();
+        return S.mount(v), l.current = S.elements.bottomSheetContentWrapper ?? null, p.current = S, m(S), () => {
+          c.unmount();
         };
       },
-      [e.mountingPoint, p, E]
+      [e.mountingPointRef, d, C]
     ), _(
       function() {
-        Object.assign(f.current.props, {
-          ...p
-        }), b(f.current);
+        Object.assign(p.current.props, {
+          ...d
+        }), m(p.current);
       },
-      [p]
-    ), a.current ? Mt(
+      [d]
+    ), _(function() {
+      return () => {
+        p.current.unmount();
+      };
+    }, []), l.current ? Yt(
       e.children,
-      a.current
+      l.current
     ) : null;
   }
-), fe = At();
-function Se() {
-  const t = nt(fe), [e, n] = ot(!1), [o, i] = ot(t.current);
-  return _(() => {
-    i(t.current);
-  }, [t.current]), {
+), ge = At();
+function Ce(t = {}) {
+  const e = ot(ge), [n, o] = rt(!1), [i, r] = rt(e.current);
+  _(() => {
+    r(e.current);
+  }, [e.current]);
+  const {
+    beforeOpen: s,
+    afterOpen: a,
+    beforeClose: d,
+    afterClose: p,
+    onDragStart: c,
+    onDragMove: m,
+    onDragEnd: C,
+    ...l
+  } = t, y = () => {
+    s == null || s();
+  }, v = () => {
+    a == null || a(), o(!0);
+  }, S = () => {
+    d == null || d();
+  }, E = () => {
+    p == null || p(), o(!1);
+  }, k = () => {
+    c == null || c();
+  }, T = (j, Y) => {
+    m == null || m(j, Y);
+  }, P = () => {
+    C == null || C();
+  };
+  return {
     props: Pt(() => ({
-      ref: t,
-      isOpen: e,
-      setIsOpen: n
-    }), [e]),
-    instance: o
+      ref: e,
+      isOpen: n,
+      setIsOpen: o,
+      beforeOpen: y,
+      afterOpen: v,
+      beforeClose: S,
+      afterClose: E,
+      onDragStart: k,
+      onDragMove: T,
+      onDragEnd: P,
+      ...l
+    }), [e.current, n, o, t]),
+    instance: i,
+    isOpen: n,
+    setIsOpen: o
   };
 }
 export {
-  ve as BottomSheet,
+  Se as BottomSheet,
   At as createPlaceholderBottomSheet,
-  Se as useBottomSheet
+  Ce as useBottomSheet
 };