@svnrnns/react-bottom-sheets 1.0.0

package/dist/index.js

@@ -0,0 +1,727 @@
+import { jsx as D, Fragment as pe, jsxs as Zt } from "react/jsx-runtime";
+import { createContext as Jt, useContext as Qt, useRef as B, useCallback as y, useEffect as W, useState as Y, useLayoutEffect as zt, useSyncExternalStore as be } from "react";
+import { flushSync as ve, createPortal as Se } from "react-dom";
+let ye = 0;
+function Ce() {
+  return Symbol(`bottom-sheet-${++ye}`);
+}
+let Q = [];
+const Ct = /* @__PURE__ */ new Set();
+function Pt() {
+  Ct.forEach((t) => t());
+}
+function wt() {
+  return Q;
+}
+function we(t) {
+  return Ct.add(t), () => Ct.delete(t);
+}
+function xe(t) {
+  const e = Ce(), n = { ...t, id: e };
+  return Q = [...Q, n], Pt(), e;
+}
+function j(t) {
+  Q = Q.filter((e) => e.id !== t), Pt();
+}
+function Ee() {
+  Q = [], Pt();
+}
+const st = /* @__PURE__ */ new Map(), xt = /* @__PURE__ */ new Map(), Et = /* @__PURE__ */ new Set();
+function Te(t, e) {
+  st.set(t, e);
+  const n = xt.get(t);
+  n !== void 0 && (xt.delete(t), e.snapToIndex(n)), Et.has(t) && (Et.delete(t), e.openFully());
+}
+function Pe(t) {
+  st.delete(t);
+}
+function Fe(t) {
+  return st.get(t);
+}
+function Re(t, e) {
+  const n = st.get(t);
+  n ? n.snapToIndex(e) : xt.set(t, e);
+}
+function Ne(t) {
+  const e = st.get(t);
+  e ? e.openFully() : Et.add(t);
+}
+function Oe(t, e, n) {
+  const o = t.trim();
+  if (!o) return null;
+  if (o.endsWith("%")) {
+    const s = parseFloat(o.slice(0, -1));
+    return Number.isNaN(s) || s < 0 || s > 100 ? null : s / 100 * e;
+  }
+  if (o.endsWith("px")) {
+    const s = parseFloat(o.slice(0, -2));
+    return Number.isNaN(s) ? null : s;
+  }
+  if (o.endsWith("rem")) {
+    const s = parseFloat(o.slice(0, -3));
+    return Number.isNaN(s) ? null : s * n;
+  }
+  const r = parseFloat(o);
+  return Number.isNaN(r) ? null : r;
+}
+function Be() {
+  if (typeof document > "u") return 16;
+  const t = document.documentElement, e = getComputedStyle(t).fontSize, n = parseFloat(e);
+  return Number.isNaN(n) ? 16 : n;
+}
+function De(t, e) {
+  if (!(t != null && t.length)) return [];
+  const n = Be(), o = t.map((s) => Oe(s, e, n)).filter((s) => s !== null && s >= 0), r = [...new Set(o)];
+  return r.sort((s, c) => s - c), r;
+}
+const Me = 80, Ie = 0.35, Vt = 0.08;
+function Ut(t) {
+  return Vt + (Ie - Vt) / (1 + t / Me);
+}
+function St(t, e, n) {
+  if (t >= e && t <= n) return t;
+  if (t < e) {
+    const s = e - t, c = Ut(s);
+    return e - s * c;
+  }
+  const o = t - n, r = Ut(o);
+  return n + o * r;
+}
+const qt = 0.5, Gt = 0.6, Ye = 0.5;
+function ke(t, e, n, o, r = 0) {
+  const s = e + r;
+  if (n.length === 0)
+    return t >= s * Gt ? { action: "close" } : { action: "snap", targetY: 0 };
+  const c = [...n].sort((S, z) => S - z), m = c[0], d = e - m, C = e + r, f = d, E = C - f, v = f + Gt * E;
+  if (o > qt) {
+    if (t >= v)
+      return { action: "close" };
+    const S = Le(t, c, e);
+    if (S !== void 0)
+      return { action: "snap", targetY: e - S, targetIndex: n.indexOf(S) };
+  }
+  if (o < -qt) {
+    const S = Ae(t, c, e);
+    if (S !== void 0) {
+      const z = e - S, it = c.indexOf(S);
+      return { action: "snap", targetY: z, targetIndex: it };
+    }
+  }
+  const F = $e(t, c, e);
+  if (He(t, F, c, e) >= Ye && F < c.length - 1) {
+    const S = c[F + 1];
+    return { action: "snap", targetY: e - S, targetIndex: F + 1 };
+  }
+  if (F > 0 || t < f) {
+    const S = c[F];
+    return { action: "snap", targetY: e - S, targetIndex: F };
+  }
+  return t >= v ? { action: "close" } : { action: "snap", targetY: d, targetIndex: 0 };
+}
+function Le(t, e, n) {
+  const o = n - t;
+  for (let r = e.length - 1; r >= 0; r--)
+    if (e[r] < o) return e[r];
+}
+function Ae(t, e, n) {
+  const o = n - t;
+  for (let r = 0; r < e.length; r++)
+    if (e[r] > o) return e[r];
+}
+function $e(t, e, n) {
+  const o = n - t;
+  let r = 0, s = 1 / 0;
+  for (let c = 0; c < e.length; c++) {
+    const m = Math.abs(e[c] - o);
+    m < s && (s = m, r = c);
+  }
+  return r;
+}
+function He(t, e, n, o) {
+  if (e >= n.length - 1) return 0;
+  const r = o - t, s = n[e], m = n[e + 1] - s;
+  if (m <= 0) return 0;
+  const d = (r - s) / m;
+  return Math.max(0, Math.min(1, d));
+}
+const te = Jt(null);
+function _e() {
+  return Qt(te);
+}
+function yt(t, e) {
+  let n = t;
+  for (; n && n !== document.body; ) {
+    if (n instanceof HTMLElement && e.has(n))
+      return { el: n, getCanDrag: e.get(n) };
+    n = n.parentNode;
+  }
+  return null;
+}
+function We() {
+  const t = B(/* @__PURE__ */ new Map()), e = y((s, c) => (t.current.set(s, c), () => {
+    t.current.delete(s);
+  }), []), n = y((s) => yt(s, t.current) !== null, []), o = y((s) => {
+    const c = yt(s, t.current);
+    return c ? !c.getCanDrag() : !1;
+  }, []), r = y((s) => {
+    const c = yt(s, t.current);
+    return c ? c.getCanDrag() : !1;
+  }, []);
+  return {
+    registerScrollContainer: e,
+    isInScrollContainer: n,
+    shouldBlockGestures: o,
+    canCaptureForDownSwipe: r
+  };
+}
+const ze = 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])', Ve = "modals-close";
+function Tt(t) {
+  return Array.from(t.querySelectorAll(ze));
+}
+function Ue(t) {
+  return Tt(t).filter(
+    (e) => !e.classList.contains(Ve)
+  );
+}
+function qe(t, e, n = !1) {
+  W(() => {
+    if (!e || !t.current) return;
+    const o = t.current, r = document.activeElement;
+    if (!n) {
+      const c = Ue(o), m = Tt(o), d = c[0] ?? m[0];
+      d ? d.focus() : (o.setAttribute("tabindex", "-1"), o.focus());
+    }
+    function s(c) {
+      if (c.key !== "Tab") return;
+      const m = Tt(o), d = m[0], C = m[m.length - 1];
+      c.shiftKey ? document.activeElement === d && C && (c.preventDefault(), C.focus()) : document.activeElement === C && d && (c.preventDefault(), d.focus());
+    }
+    return o.addEventListener("keydown", s), () => {
+      o.removeEventListener("keydown", s), r && typeof r.focus == "function" && r.focus();
+    };
+  }, [e, n]);
+}
+const Ge = typeof window < "u" ? () => window.innerHeight : () => 800, Xe = 5;
+function ft(t, e) {
+  return typeof document > "u" ? e : getComputedStyle(document.documentElement).getPropertyValue(t).trim() || e;
+}
+function _() {
+  const t = ft("--bottom-sheet-duration", "0.5s"), e = t.match(/^([\d.]+)s$/);
+  if (e) return parseFloat(e[1]) * 1e3;
+  const n = t.match(/^([\d.]+)ms$/);
+  return n ? parseFloat(n[1]) : 500;
+}
+function je(t, e, n) {
+  const o = 1 - t;
+  return 3 * o * o * t * e + 3 * o * t * t * n + t * t * t;
+}
+function Ke(t, e) {
+  const n = e.match(/cubic-bezier\s*\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*\)/);
+  if (!n) return t;
+  const o = n.map(Number), r = o[2], s = o[4];
+  return je(t, r, s);
+}
+function Xt(t) {
+  return t === 0 ? 1 : Math.max(0.5, 0.9 - (t - 1) * 0.05);
+}
+function jt(t) {
+  return t === 0 ? 0 : 12 + (t - 1) * 8;
+}
+function Ze({ descriptor: t, index: e, isTop: n, stackDepth: o }) {
+  const r = Qt(ee), {
+    id: s,
+    component: c,
+    props: m,
+    height: d,
+    width: C,
+    snapPoint: f,
+    className: E,
+    onClose: v,
+    enableBackdrop: F,
+    enableClickBackdropToClose: dt,
+    disableEsc: S,
+    gestureOnlyOnHandler: z,
+    disableSwipeDownToClose: it
+  } = t, ct = C ?? (r == null ? void 0 : r.defaultWidth), Ft = ct == null ? void 0 : typeof ct == "number" ? `${ct}px` : ct, k = Ge(), M = typeof document < "u" && parseFloat(ft("--bottom-sheet-close-extra-offset", "0")) || 0, ne = !!(f != null && f.length), I = d == null && !ne, V = B(null), at = B(null), U = B(null), q = We(), [h, tt] = Y(() => d != null ? Kt(d) : I ? 0 : k), [Rt, Nt] = Y(!I), lt = h + M, p = De(f, k).filter((i) => i <= h).sort((i, l) => i - l), et = p.length > 0 ? h - p[0] : 0, [G, R] = Y(
+    () => I ? k : p.length > 0 ? lt : 0
+  ), [K, X] = Y(!1), [ut, g] = Y(!1), [ht, re] = Y(!1), [oe, mt] = Y(0), N = B(null), L = B(null), P = B(!1), A = B(null);
+  zt(() => {
+    p.length > 0 && R(lt);
+  }, []), W(() => {
+    var w;
+    if (d != null) {
+      tt(Kt(d)), Nt(!0);
+      return;
+    }
+    if (!I) {
+      const b = U.current;
+      if (!b) return;
+      const T = new ResizeObserver(() => {
+        const O = b.getBoundingClientRect().height;
+        tt((H) => Math.min(Math.max(H, O), k));
+      });
+      T.observe(b);
+      const x = b.getBoundingClientRect().height;
+      return tt((O) => Math.min(Math.max(O, x), k)), () => T.disconnect();
+    }
+    if (!V.current) return;
+    const l = () => {
+      const b = V.current, T = at.current, x = U.current;
+      if (!b || !T || !x) return;
+      if (h === 0) {
+        const Wt = Math.min(b.getBoundingClientRect().height, k);
+        Wt > 0 && (tt(Wt), Nt(!0));
+        return;
+      }
+      const O = getComputedStyle(b), H = parseFloat(O.paddingTop) || 0, vt = parseFloat(O.paddingBottom) || 0, J = O.gap || "0.5rem", me = J.endsWith("rem") ? parseFloat(J) * (parseFloat(getComputedStyle(document.documentElement).fontSize) || 16) : parseFloat(J) || 8, Ht = x.firstElementChild, ge = Ht ? Ht.getBoundingClientRect().height : x.scrollHeight || x.getBoundingClientRect().height, _t = Math.min(
+        H + vt + T.offsetHeight + me + ge,
+        k
+      );
+      _t > 0 && (A.current && (clearTimeout(A.current), A.current = null), tt(_t), g(!0), A.current = setTimeout(() => {
+        A.current = null, g(!1);
+      }, _()));
+    }, u = new ResizeObserver(l);
+    U.current && u.observe(U.current);
+    const a = (w = U.current) == null ? void 0 : w.firstElementChild;
+    return a && u.observe(a), at.current && u.observe(at.current), u.observe(V.current), requestAnimationFrame(l), () => {
+      u.disconnect(), A.current && (clearTimeout(A.current), A.current = null);
+    };
+  }, [d, k, I, h]), W(() => {
+    ht || I && !Rt || (re(!0), R(lt), requestAnimationFrame(() => {
+      mt(1), g(!0), R(et);
+      const i = _();
+      setTimeout(() => g(!1), i);
+    }));
+  }, [ht, I, Rt, et, lt, h]);
+  const nt = y(() => {
+    if (ut) return;
+    mt(0), g(!0);
+    const i = _();
+    if (R(h + M), n && r) {
+      r.setTopSheetClosingProgress(0);
+      const l = Date.now(), u = () => {
+        const a = Date.now() - l, w = Math.min(1, a / i);
+        r == null || r.setTopSheetClosingProgress(w), w < 1 ? requestAnimationFrame(u) : (v == null || v(), j(s), r == null || r.setTopSheetClosingProgress(null), g(!1));
+      };
+      requestAnimationFrame(u);
+    } else {
+      const l = setTimeout(() => {
+        v == null || v(), j(s), g(!1);
+      }, i);
+      return () => clearTimeout(l);
+    }
+  }, [s, h, M, v, ut, n, r]), rt = y(
+    (i) => {
+      if (ut) return;
+      if (p.length === 0) {
+        R(0);
+        return;
+      }
+      const l = Math.max(0, Math.min(i, p.length - 1)), u = h - p[l];
+      g(!0), R(u);
+      const a = _(), w = setTimeout(() => g(!1), a);
+      return () => clearTimeout(w);
+    },
+    [p, h, ut]
+  ), Ot = y(() => {
+    if (p.length > 0)
+      rt(p.length - 1);
+    else {
+      g(!0), R(0);
+      const i = setTimeout(() => g(!1), _());
+      return () => clearTimeout(i);
+    }
+  }, [p.length, rt]);
+  zt(() => {
+    if (r)
+      return r.registerController(s, { snapToIndex: rt, openFully: Ot, close: nt }), () => r.unregisterController(s);
+  }, [s, r, rt, Ot, nt]), W(() => {
+    if (!n) return;
+    const i = (l) => {
+      l.key === "Escape" && !S && (l.preventDefault(), ve(() => {
+        X(!1), g(!1);
+      }), N.current = null, L.current = null, nt());
+    };
+    return window.addEventListener("keydown", i), () => window.removeEventListener("keydown", i);
+  }, [n, S, nt]), qe(V, n && ht);
+  const Bt = y((i) => {
+    if (P.current && V.current && i != null) {
+      try {
+        V.current.releasePointerCapture(i);
+      } catch {
+      }
+      X(!1);
+    }
+    N.current = null, L.current = null, P.current = !1;
+  }, []), se = y(
+    (i) => {
+      var a;
+      if (i.button !== 0) return;
+      const l = i.pointerType === "touch", u = ((a = U.current) == null ? void 0 : a.contains(i.target)) ?? !1;
+      if (l && u) {
+        if (q.isInScrollContainer(i.target))
+          return;
+        i.currentTarget.setPointerCapture(i.pointerId), P.current = !0, X(!0);
+      }
+    },
+    [q]
+  ), ie = y(
+    (i) => {
+      if (i.button !== 0) return;
+      const l = i.pointerId;
+      N.current = { y: i.clientY, sheetY: G, time: Date.now() }, L.current = { y: i.clientY, time: Date.now() };
+      const u = (a) => {
+        a.pointerId === l && (window.removeEventListener("pointerup", u), window.removeEventListener("pointercancel", u), Bt(l));
+      };
+      window.addEventListener("pointerup", u), window.addEventListener("pointercancel", u);
+    },
+    [G, Bt]
+  ), ce = y(
+    (i) => {
+      if (!N.current) return;
+      if (i.buttons === 0) {
+        P.current && (i.currentTarget.releasePointerCapture(i.pointerId), X(!1)), N.current = null, L.current = null, P.current = !1;
+        return;
+      }
+      L.current = { y: i.clientY, time: Date.now() };
+      const l = i.clientY - N.current.y, u = i.pointerType === "touch" ? 1 : Xe;
+      if (!P.current && Math.abs(l) > u) {
+        const T = i.target;
+        if (q.isInScrollContainer(T)) {
+          if (q.shouldBlockGestures(T) || !q.canCaptureForDownSwipe(T) || l <= 0) return;
+          i.preventDefault();
+        }
+        i.currentTarget.setPointerCapture(i.pointerId), P.current = !0, X(!0);
+      }
+      if (!P.current) return;
+      let a = N.current.sheetY + l;
+      const w = 0, b = h + M;
+      if (p.length > 0) {
+        const T = Math.max(...p), x = h - T;
+        a > b || a < x ? a = St(a, x, b) : a = Math.max(x, Math.min(b, a));
+      } else
+        a > b || a < w ? a = St(a, w, b) : a = Math.max(w, Math.min(b, a));
+      R(a);
+    },
+    [h, M, p, q]
+  ), ae = y(
+    (i) => {
+      if (!N.current) return;
+      const l = P.current;
+      l && (i.currentTarget.releasePointerCapture(i.pointerId), X(!1));
+      const u = L.current, a = u && u.time !== N.current.time ? (i.clientY - u.y) / (Date.now() - u.time) : 0;
+      if (N.current = null, L.current = null, P.current = !1, !l) return;
+      const w = ke(
+        G,
+        h,
+        p,
+        a,
+        M
+      );
+      if (w.action === "close") {
+        if (it) {
+          const O = p.length > 0 ? h - p[0] : 0;
+          g(!0), R(O);
+          const H = _();
+          setTimeout(() => g(!1), H);
+          return;
+        }
+        mt(0), g(!0), R(h + M);
+        const x = _();
+        if (n && r) {
+          r.setTopSheetClosingProgress(0);
+          const O = Date.now(), H = () => {
+            const vt = Date.now() - O, J = Math.min(1, vt / x);
+            r == null || r.setTopSheetClosingProgress(J), J < 1 ? requestAnimationFrame(H) : (v == null || v(), j(s), r == null || r.setTopSheetClosingProgress(null), g(!1));
+          };
+          requestAnimationFrame(H);
+        } else
+          setTimeout(() => {
+            v == null || v(), j(s), g(!1);
+          }, x);
+        return;
+      }
+      const b = w.targetY ?? 0;
+      g(!0), R(b);
+      const T = _();
+      setTimeout(() => g(!1), T);
+    },
+    [
+      G,
+      h,
+      p,
+      M,
+      s,
+      v,
+      it,
+      n,
+      r
+    ]
+  ), le = y((i) => {
+    P.current && (i.currentTarget.releasePointerCapture(i.pointerId), X(!1)), N.current = null, L.current = null, P.current = !1;
+  }, []);
+  W(() => {
+    if (!K) return;
+    const i = document.body.style.userSelect;
+    return document.body.style.userSelect = "none", () => {
+      document.body.style.userSelect = i;
+    };
+  }, [K]);
+  const Dt = {
+    onPointerDownCapture: se,
+    onPointerDown: ie,
+    onPointerMove: ce,
+    onPointerUp: ae,
+    onPointerCancel: le
+  }, ot = ft("--bottom-sheet-duration", "0.5s"), Z = ft("--bottom-sheet-easing", "cubic-bezier(0.32, 0.72, 0, 1)"), Mt = (r == null ? void 0 : r.topSheetClosingProgress) ?? null, $ = o >= 1 && Mt != null, gt = $ ? Ke(Mt, Z) : 0, ue = K || $ ? "none" : `transform ${ot} ${Z}, height ${ot} ${Z}, transform-origin ${ot} ${Z}`, pt = Xt(o), fe = Xt(o - 1), bt = jt(o), de = jt(o - 1), It = $ ? pt + (fe - pt) * gt : pt, Yt = $ ? bt + (de - bt) * gt : bt, kt = h + M, he = kt > et ? Math.max(0, Math.min(1, (G - et) / (kt - et))) : 0, Lt = K ? 1 - he : oe, At = K ? "none" : `opacity ${ot} ${Z}`, $t = B(null);
+  return W(() => {
+    if (!n || !r) return;
+    const i = F ? Lt : 0, l = At, u = F && dt ? "auto" : "none", a = $t.current;
+    a && a.opacity === i && a.transition === l && a.pointerEvents === u || ($t.current = { opacity: i, transition: l, pointerEvents: u }, r.setOverlayStyle({ opacity: i, transition: l, pointerEvents: u }));
+  }, [n, r, F, dt, Lt, At]), /* @__PURE__ */ D(pe, { children: /* @__PURE__ */ Zt(
+    "div",
+    {
+      ref: V,
+      role: n ? "dialog" : void 0,
+      "aria-modal": n ? !0 : void 0,
+      className: `bottom-sheet${K ? " dragging" : ""}${o > 0 ? " stacked" : ""} ${E ?? ""}`.trim(),
+      ...o === 0 && !z ? Dt : {},
+      style: {
+        position: "fixed",
+        ...Ft ? {
+          width: Ft,
+          maxWidth: "100%",
+          left: "50%",
+          transform: `translateX(-50%) translateY(${G}px) scale(${It}) translateY(-${Yt}%)`,
+          transformOrigin: "bottom center"
+        } : {
+          left: 0,
+          right: 0,
+          transform: `translateY(${G}px) scale(${It}) translateY(-${Yt}%)`,
+          transformOrigin: "bottom center"
+        },
+        bottom: 0,
+        ...I ? { height: h === 0 ? "auto" : h, maxHeight: "100vh" } : { height: h, maxHeight: "100vh" },
+        "--bottom-sheet-height": `${h}px`,
+        transition: ue,
+        zIndex: e + 1,
+        display: "flex",
+        flexDirection: "column",
+        background: "var(--bottom-sheet-bg)",
+        borderRadius: "var(--bottom-sheet-border-radius)",
+        boxShadow: "var(--bottom-sheet-shadow)",
+        padding: "var(--bottom-sheet-padding)"
+      },
+      children: [
+        /* @__PURE__ */ D(
+          "div",
+          {
+            ref: at,
+            className: "bottom-sheet-handler",
+            ...o === 0 && z ? Dt : {},
+            style: {
+              flexShrink: 0,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              padding: "var(--bottom-sheet-handler-padding)",
+              gap: "var(--bottom-sheet-gap)"
+            },
+            children: /* @__PURE__ */ D(
+              "div",
+              {
+                style: {
+                  width: "var(--bottom-sheet-handler-width)",
+                  height: "var(--bottom-sheet-handler-height)",
+                  borderRadius: "var(--bottom-sheet-handler-border-radius)",
+                  background: "var(--bottom-sheet-handler-bg)"
+                }
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ D(
+          "div",
+          {
+            ref: U,
+            className: "bottom-sheet-content",
+            style: {
+              ...I && h === 0 ? { flex: "0 0 auto", overflow: "visible", minHeight: 0 } : { flex: 1, overflow: "auto", minHeight: 0 }
+            },
+            children: /* @__PURE__ */ D(te.Provider, { value: q, children: /* @__PURE__ */ D(
+              c,
+              {
+                ...m,
+                closeDrawer: nt,
+                snapToIndex: rt
+              }
+            ) })
+          }
+        ),
+        /* @__PURE__ */ D(
+          "div",
+          {
+            className: "bottom-sheet-stack-overlay",
+            "aria-hidden": !0,
+            style: {
+              position: "absolute",
+              inset: 0,
+              background: "var(--bottom-sheet-stack-overlay-bg)",
+              borderRadius: "inherit",
+              pointerEvents: o === 0 && !$ ? "none" : "auto",
+              opacity: $ && o === 1 ? 1 - gt : o === 0 ? 0 : 1,
+              transition: $ ? "none" : `opacity ${ot} ${Z}`,
+              ...o > 0 || $ ? { cursor: "default" } : {}
+            }
+          }
+        )
+      ]
+    }
+  ) });
+}
+function Kt(t) {
+  if (typeof t == "number") return t;
+  if (typeof document > "u") return 400;
+  const e = t.trim();
+  if (e.endsWith("%"))
+    return window.innerHeight * parseFloat(e.slice(0, -1)) / 100;
+  if (e.endsWith("px")) return parseFloat(e.slice(0, -2)) || 400;
+  if (e.endsWith("rem")) {
+    const n = parseFloat(getComputedStyle(document.documentElement).fontSize) || 16;
+    return parseFloat(e.slice(0, -3)) * n || 400;
+  }
+  return parseFloat(e) || 400;
+}
+const ee = Jt(null);
+function Je() {
+  return be(we, wt, wt);
+}
+function on({ width: t } = {}) {
+  const e = Je(), [n, o] = Y(null), [r, s] = Y({ opacity: 0, transition: "opacity 0.5s cubic-bezier(0.32, 0.72, 0, 1)", pointerEvents: "none" }), c = y(
+    (f, E) => {
+      Te(f, E);
+    },
+    []
+  ), m = y((f) => {
+    Pe(f);
+  }, []), d = typeof document < "u" ? document.body : null;
+  return e.length > 0 && d ? /* @__PURE__ */ D(ee.Provider, { value: { registerController: c, unregisterController: m, defaultWidth: t, setOverlayStyle: s, topSheetClosingProgress: n, setTopSheetClosingProgress: o }, children: Se(
+    /* @__PURE__ */ Zt("div", { className: "bottom-sheets-portal", "aria-hidden": "false", children: [
+      e.length > 0 && /* @__PURE__ */ D(
+        "div",
+        {
+          className: "bottom-sheet-overlay",
+          style: {
+            position: "fixed",
+            inset: 0,
+            background: "var(--bottom-sheet-overlay-bg)",
+            backdropFilter: "var(--bottom-sheet-overlay-blur-filter)",
+            zIndex: 0,
+            pointerEvents: r.pointerEvents ?? "none",
+            opacity: r.opacity,
+            transition: r.transition
+          },
+          onClick: () => {
+            var E;
+            const f = e[e.length - 1];
+            f != null && f.enableClickBackdropToClose && ((E = Fe(f.id)) == null || E.close());
+          },
+          "aria-hidden": !0
+        }
+      ),
+      e.map((f, E) => /* @__PURE__ */ D(
+        Ze,
+        {
+          descriptor: f,
+          index: E,
+          isTop: E === e.length - 1,
+          stackDepth: e.length - 1 - E
+        },
+        f.id.toString()
+      ))
+    ] }),
+    d
+  ) }) : null;
+}
+function sn(t) {
+  const e = {
+    component: t.component,
+    props: t.props ?? {},
+    height: t.height,
+    width: t.width,
+    snapPoint: t.snapPoint ?? t.snapPoints,
+    className: t.className,
+    onClose: t.onClose,
+    enableClickBackdropToClose: t.enableClickBackdropToClose,
+    enableBackdrop: t.enableBackdrop,
+    disableEsc: t.disableEsc,
+    gestureOnlyOnHandler: t.gestureOnlyOnHandler,
+    disableSwipeDownToClose: t.disableSwipeDownToClose
+  }, n = xe(e);
+  return {
+    id: n,
+    close: () => j(n),
+    snapToIndex: (o) => Re(n, o),
+    openFully: () => Ne(n)
+  };
+}
+function cn() {
+  const t = wt();
+  if (t.length > 0) {
+    const e = t[t.length - 1];
+    j(e.id);
+  }
+}
+function an(t) {
+  j(t);
+}
+function ln() {
+  Ee();
+}
+function un({ children: t, className: e, style: n }) {
+  const o = B(null), r = B(0), s = _e();
+  return W(() => {
+    if (!s || !o.current) return;
+    const c = o.current, m = () => c.scrollTop === 0;
+    return s.registerScrollContainer(c, m);
+  }, [s]), W(() => {
+    const c = o.current;
+    if (!c) return;
+    const m = (C) => {
+      var f;
+      r.current = ((f = C.touches[0]) == null ? void 0 : f.clientY) ?? 0;
+    }, d = (C) => {
+      if (c.scrollTop > 0 || !C.cancelable) return;
+      const f = C.touches[0];
+      if (!f) return;
+      f.clientY - r.current > 8 && C.preventDefault();
+    };
+    return c.addEventListener("touchstart", m, { passive: !0 }), c.addEventListener("touchmove", d, { passive: !1, capture: !0 }), () => {
+      c.removeEventListener("touchstart", m), c.removeEventListener("touchmove", d, { capture: !0 });
+    };
+  }, []), /* @__PURE__ */ D(
+    "div",
+    {
+      ref: o,
+      className: e,
+      style: {
+        flex: 1,
+        minHeight: 0,
+        overflow: "auto",
+        WebkitOverflowScrolling: "touch",
+        overscrollBehaviorY: "contain",
+        ...n
+      },
+      children: t
+    }
+  );
+}
+export {
+  on as BottomSheetRoot,
+  un as BottomSheetScrollable,
+  ln as closeAllBottomSheets,
+  an as closeBottomSheet,
+  cn as popBottomSheet,
+  sn as pushBottomSheet
+};
+//# sourceMappingURL=index.js.map