@plainsheet/react 0.4.7 → 0.4.9

package/dist/plainsheet-react.es.js

@@ -1,6 +1,6 @@
-import { forwardRef as Bt, useRef as rt, useState as at, useImperativeHandle as Mt, useCallback as z, useEffect as q, useMemo as Pt } from "react";
-import { createPortal as Yt } from "react-dom";
-function It(t) {
+import { forwardRef as Dt, useRef as rt, useState as at, useImperativeHandle as Mt, useCallback as z, useEffect as q, useMemo as Yt } from "react";
+import { createPortal as Pt } from "react-dom";
+function Ft(t) {
   return t != null;
 }
 (function() {
@@ -13,29 +13,29 @@ function It(t) {
     console.error("vite-plugin-css-injected-by-js", e);
   }
 })();
-var Rt = Object.defineProperty, Wt = (t, e, n) => e in t ? Rt(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n, K = (t, e, n) => Wt(t, typeof e != "symbol" ? e + "" : e, n);
-function x(t) {
+var It = Object.defineProperty, Rt = (t, e, n) => e in t ? It(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n, J = (t, e, n) => Rt(t, typeof e != "symbol" ? e + "" : e, n);
+function L(t) {
   return typeof t == "string";
 }
-function Nt(t, e) {
+function Wt(t, e) {
   return t.classList.contains(nt(e));
 }
-function V(t, e) {
+function K(t, e) {
   t.classList.add(nt(e));
 }
 function it(t, e) {
   t.classList.remove(nt(e));
 }
 function _(t, e, n) {
-  x(n) && (x(e) && it(t, e), V(t, n));
+  L(n) && (L(e) && it(t, e), K(t, n));
 }
 function nt(t) {
-  return x(t) ? t.trim().replace(/\./g, "") : "";
+  return L(t) ? t.trim().replace(/\./g, "") : "";
 }
-function W(t) {
+function R(t) {
   return t.map((e) => nt(e)).filter(Boolean).join(" ");
 }
-function Ft(t) {
+function Nt(t) {
   return t.map((e) => e == null ? void 0 : e.trim()).filter(Boolean).map((e) => `.${e}`).join(" ");
 }
 const pt = "open", ht = "hidden";
@@ -43,14 +43,14 @@ function ot(t, e) {
   const n = e;
   if (Array.isArray(t)) {
     t.forEach((o) => {
-      Q(o, n), o.setAttribute("aria-modal", n ? "true" : "false");
+      Z(o, n), o.setAttribute("aria-modal", n ? "true" : "false");
     });
     return;
   }
-  Q(t, n), t.setAttribute("aria-modal", n ? "true" : "false");
+  Z(t, n), t.setAttribute("aria-modal", n ? "true" : "false");
 }
-function Q(t, e) {
-  e ? (V(t, pt), it(t, ht)) : (V(t, ht), it(t, pt));
+function Z(t, e) {
+  e ? (K(t, pt), it(t, ht)) : (K(t, ht), it(t, pt));
 }
 function Ct(t) {
   return t instanceof HTMLElement;
@@ -61,7 +61,7 @@ function A(t) {
 function jt(t) {
   Ct(t) && t.focus();
 }
-function Ut(t) {
+function Gt(t) {
   if (!Ct(t) || t.offsetParent === null || "disabled" in t && t.disabled)
     return !1;
   const e = t.getAttribute("tabindex"), n = A(e) ? parseInt(e, 10) : -1, o = [
@@ -75,14 +75,14 @@ function Ut(t) {
   ].includes(t.tagName), r = t instanceof HTMLAnchorElement && t.href !== "" || t instanceof HTMLAreaElement && t.href !== "";
   return o || r || n > -1;
 }
-var k = /* @__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))(k || {}), st = /* @__PURE__ */ ((t) => (t.Button = "pbs-button-reset", t.Dialog = "pbs-dialog-reset", t))(st || {}), J = /* @__PURE__ */ ((t) => (t.Hidden = "hidden", t))(J || {});
+var k = /* @__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))(k || {}), st = /* @__PURE__ */ ((t) => (t.Button = "pbs-button-reset", t.Dialog = "pbs-dialog-reset", t))(st || {}), Q = /* @__PURE__ */ ((t) => (t.Hidden = "hidden", t))(Q || {});
 function M(t, e, n) {
   const o = document.createElement(t);
   return e.split(" ").forEach((r) => {
-    V(o, r);
-  }), x(n) && o.setAttribute("data-testid", n), o;
+    K(o, r);
+  }), L(n) && o.setAttribute("data-testid", n), o;
 }
-Ft([
+Nt([
   k.Root,
   k.ContentWrapper
 ]);
@@ -109,10 +109,10 @@ function Et(t, e) {
 function wt(t, e) {
   return e < t ? -(t - e) : e - t;
 }
-function Z(t, e) {
+function V(t, e) {
   return t > e ? t - e : e - t;
 }
-function $t(t, e) {
+function Ut(t, e) {
   const n = t < e, o = t > e;
   return {
     isUp: n,
@@ -120,7 +120,7 @@ function $t(t, e) {
     stayedSame: t === e
   };
 }
-function bt(t, e, n) {
+function ft(t, e, n) {
   const o = t === "above";
   return n.filter((r) => {
     const i = r * e.viewportHeight;
@@ -130,13 +130,13 @@ function bt(t, e, n) {
 function kt(t, e, n) {
   return -(t - e) + n;
 }
-function ft(t) {
+function bt(t) {
   return Number(t.replace("px", ""));
 }
 function tt(t, ...e) {
   return Number(t.toFixed(...e));
 }
-function Ht(t) {
+function Tt(t) {
   const e = /(?<type>\w+)\((?<values>[^)]+)\)/g, n = [];
   let o;
   for (; (o = e.exec(t)) !== null; ) {
@@ -145,18 +145,18 @@ function Ht(t) {
   }
   return n;
 }
-function Gt(t) {
-  const e = t.style.transform, n = Ht(e);
+function $t(t) {
+  const e = t.style.transform, n = Tt(e);
   return { transform: e, transformValues: n };
 }
-function Tt(t, e) {
+function Ht(t, e) {
   return t.find(
     (o) => o.type.startsWith(e)
   ) || null;
 }
 const ct = "translate";
-function B(t) {
-  const e = t.style.transform, n = Ht(e), o = Tt(
+function D(t) {
+  const e = t.style.transform, n = Tt(e), o = Ht(
     n,
     ct
   );
@@ -169,7 +169,7 @@ function et(t, { x: e, y: n }) {
   const {
     transform: o,
     transformValues: r
-  } = Gt(t), i = Tt(
+  } = $t(t), i = Ht(
     r,
     ct
   );
@@ -191,8 +191,8 @@ function Ot(t) {
     );
   const e = t.values[0], n = t.values[1];
   return {
-    x: ft(e) ?? 0,
-    y: ft(n) ?? 0
+    x: bt(e) ?? 0,
+    y: bt(n) ?? 0
   };
 }
 function lt(t) {
@@ -205,9 +205,9 @@ function gt(t, {
   return lt(n) && t >= n ? n : lt(e) && t <= e ? e : t;
 }
 const _t = (t, e, n) => {
-  e instanceof HTMLElement && !Nt(e, k.Handle) && n.scrollTop >= 1 || (t.isDragging = !0);
+  e instanceof HTMLElement && !Wt(e, k.Handle) && n.scrollTop >= 1 || (t.isDragging = !0);
 }, Xt = (t, e, n, o) => (r) => {
-  o.startY = t.getCoordinates(r).y, o.containerStartTranslate = B(e), n.onDragStart();
+  o.startY = t.getCoordinates(r).y, o.containerStartTranslate = D(e), n.onDragStart();
 }, zt = (t, e, n, o, r) => (i) => {
   qt(
     i,
@@ -222,21 +222,21 @@ const _t = (t, e, n) => {
 function qt(t, e, n, o, r, i, a) {
   if (!o.isDragging || !A(o.startY))
     return;
-  const s = e.getCoordinates(t).y, u = wt(o.startY, s), h = window.innerHeight, c = i.clientHeight, m = c - (o.containerStartTranslate.y + u);
+  const c = e.getCoordinates(t).y, u = wt(o.startY, c), h = window.innerHeight, s = i.clientHeight, m = s - (o.containerStartTranslate.y + u);
   if (m >= h)
     return;
-  const C = Et(o.startY, s);
-  if (C.isUp && !n.expandable && m >= c)
+  const C = Et(o.startY, c);
+  if (C.isUp && !n.expandable && m >= s || n.preventClosing && m <= s)
     return;
   r.start(() => {
     et(i, {
       y: o.containerStartTranslate.y + u
     });
   }, 0);
-  const l = h - a, E = c - o.containerStartTranslate.y;
+  const l = h - a, E = s - o.containerStartTranslate.y;
   if (C.isUp) {
-    const g = l - E, S = l - m, w = gt(
-      1 - tt(S / g, 2),
+    const f = l - E, S = l - m, w = gt(
+      1 - tt(S / f, 2),
       {
         min: 0,
         max: 1
@@ -244,7 +244,7 @@ function qt(t, e, n, o, r, i, a) {
     );
     n.onDragMove(C, w);
   } else if (C.isDown) {
-    const g = gt(
+    const f = gt(
       tt(
         1 - m / E,
         2
@@ -254,30 +254,30 @@ function qt(t, e, n, o, r, i, a) {
         max: 1
       }
     );
-    n.onDragMove(C, g);
+    n.onDragMove(C, f);
   }
 }
-const Vt = (t, e, n, o, r, i, a) => (s) => {
+const Vt = (t, e, n, o, r, i, a) => (c) => {
   if (!o.isDragging || (o.isDragging = !1, !A(o.startY)))
     return;
   n.onDragEnd();
-  const u = o.startY, h = t.getCoordinates(s).y, c = B(e).y, m = Et(u, h), C = window.innerHeight, l = e.clientHeight;
+  const u = o.startY, h = t.getCoordinates(c).y, s = D(e).y, m = Et(u, h), C = window.innerHeight, l = e.clientHeight;
   if (m.isUp) {
     const E = [...n.snapPoints].sort(
-      (w, L) => w - L
-    ), g = l + -c;
-    if (!n.expandable && g >= l)
+      (w, x) => w - x
+    ), f = l + -s;
+    if (!n.expandable && f >= l)
       return;
     for (const w of E) {
-      const L = w * window.innerHeight;
-      if (g <= L) {
-        const H = Z(
-          g,
-          L
+      const x = w * window.innerHeight;
+      if (f <= x) {
+        const T = V(
+          f,
+          x
         );
         a.translateContainer({
-          startY: c,
-          endY: c - H,
+          startY: s,
+          endY: s - T,
           animationFrame: r,
           bottomSheetContainer: e
         });
@@ -290,36 +290,49 @@ const Vt = (t, e, n, o, r, i, a) => (s) => {
       n.marginTop
     );
     a.translateContainer({
-      startY: c,
+      startY: s,
       endY: S,
       animationFrame: r,
       bottomSheetContainer: e
     });
   } else if (m.isDown) {
     const E = [...n.snapPoints].sort(
-      (g, S) => S - g
+      (f, S) => S - f
     );
-    for (const g of E) {
-      const S = g * window.innerHeight, w = l + -c;
+    for (const f of E) {
+      const S = f * window.innerHeight, w = l + -s;
       if (w >= S) {
-        const L = Z(
+        const x = V(
           w,
           S
         );
         a.translateContainer({
-          startY: c,
-          endY: c + L,
+          startY: s,
+          endY: s + x,
           animationFrame: r,
           bottomSheetContainer: e
         });
         return;
       }
     }
+    if (n.preventClosing) {
+      const f = l + -s;
+      if (f >= l) {
+        const S = V(f, l);
+        a.translateContainer({
+          startY: s,
+          endY: s + S,
+          animationFrame: r,
+          bottomSheetContainer: e
+        });
+      }
+      return;
+    }
     i();
   }
 };
 var j = /* @__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))(j || {});
-function vt(t) {
+function St(t) {
   switch (t) {
     case 0:
       return 0;
@@ -338,7 +351,7 @@ const Kt = {
 };
 class X {
   constructor(e) {
-    K(this, "currentTarget"), this.currentTarget = e;
+    J(this, "currentTarget"), this.currentTarget = e;
   }
   addEventListeners({
     onStart: e,
@@ -361,7 +374,7 @@ class X {
           e(i);
           return;
         }
-        vt(i.eventPhase) === n.eventPhase && e(i);
+        St(i.eventPhase) === n.eventPhase && e(i);
       },
       {
         passive: !0
@@ -381,7 +394,7 @@ class X {
           e(i);
           return;
         }
-        vt(i.eventPhase) === n.eventPhase && e(i);
+        St(i.eventPhase) === n.eventPhase && e(i);
       },
       {
         passive: !0
@@ -444,7 +457,10 @@ function Jt(t, e) {
     bottomSheetProps: t,
     options: e
   });
-  return t.rootStyle && Object.assign(n.bottomSheetRoot.style, t.rootStyle), t.backdropStyle && Object.assign(n.bottomSheetBackdrop.style, t.backdropStyle), t.containerStyle && Object.assign(n.bottomSheetContainer.style, t.containerStyle), t.handleStyle && Object.assign(n.bottomSheetHandleBar.style, t.handleStyle), t.contentWrapperStyle && Object.assign(
+  return t.rootStyle && Object.assign(n.bottomSheetRoot.style, t.rootStyle), t.backdropStyle && Object.assign(n.bottomSheetBackdrop.style, t.backdropStyle), t.containerGapFillerStyle && Object.assign(n.bottomSheetContainer.style, t.containerStyle), t.containerStyle && Object.assign(
+    n.bottomSheetContainerGapFiller.style,
+    t.containerGapFillerStyle
+  ), t.handleStyle && Object.assign(n.bottomSheetHandleBar.style, t.handleStyle), t.contentWrapperStyle && Object.assign(
     n.bottomSheetContentWrapper.style,
     t.contentWrapperStyle
   ), { elements: n, eventHandlers: i };
@@ -452,7 +468,7 @@ function Jt(t, e) {
 function Qt(t) {
   const e = M(
     "dialog",
-    W([
+    R([
       k.Root,
       st.Dialog,
       t.rootClass
@@ -462,7 +478,7 @@ function Qt(t) {
   e.ariaLabel = t.ariaLabel;
   const n = M(
     "section",
-    W([k.Container, t.containerClass]),
+    R([k.Container, t.containerClass]),
     k.Container
   );
   t.containerBorderRadius && (n.style.borderRadius = Lt(
@@ -472,12 +488,14 @@ function Qt(t) {
     "div",
     k.GapFiller,
     k.GapFiller
-  ), r = M(
+  );
+  t.containerBackgroundColor && (n.style.backgroundColor = t.containerBackgroundColor, o.style.backgroundColor = t.containerBackgroundColor);
+  const r = M(
     "button",
-    W([
+    R([
       k.Handle,
       st.Button,
-      t.shouldShowHandle ? null : J.Hidden,
+      t.shouldShowHandle ? null : Q.Hidden,
       t.handleClass
     ]),
     k.Handle
@@ -485,30 +503,30 @@ function Qt(t) {
   r.setAttribute("type", "button"), r.ariaLabel = "bottom sheet close button";
   const i = M(
     "span",
-    W([
+    R([
       k.HandleBar,
-      t.shouldShowHandle ? null : J.Hidden
+      t.shouldShowHandle ? null : Q.Hidden
     ]),
     k.HandleBar
   ), a = M(
     "article",
-    W([
+    R([
       k.ContentWrapper,
       t.contentWrapperClass
     ]),
     k.ContentWrapper
-  ), s = M(
+  ), c = M(
     "div",
-    W([
+    R([
       k.Backdrop,
       t.backdropClass,
-      J.Hidden
+      Q.Hidden
     ]),
     k.Backdrop
   );
-  return t.backdropColor && (s.style.backgroundColor = t.backdropColor), t.backDropTransition && (s.style.transition = t.backDropTransition), {
+  return t.backdropColor && (c.style.backgroundColor = t.backdropColor), t.backDropTransition && (c.style.transition = t.backDropTransition), {
     bottomSheetRoot: e,
-    bottomSheetBackdrop: s,
+    bottomSheetBackdrop: c,
     bottomSheetContainer: n,
     bottomSheetHandle: r,
     bottomSheetHandleBar: i,
@@ -536,24 +554,24 @@ function te({
     bottomSheetContainer: r,
     bottomSheetHandle: i,
     bottomSheetContainerGapFiller: a,
-    bottomSheetContentWrapper: s,
+    bottomSheetContentWrapper: c,
     bottomSheetBackdrop: u
-  } = t, { animationFrame: h } = n, c = new X(i), m = new X(
-    s
+  } = t, { animationFrame: h } = n, s = new X(i), m = new X(
+    c
   ), C = new X(
     a
   ), l = e.dragTriggers.reduce(
-    (T, y) => {
+    (H, y) => {
       const v = o.querySelectorAll(y);
       if (!v.length)
-        return T;
+        return H;
       const p = Array.from(v).map((d) => d instanceof HTMLElement ? new X(d) : null).filter((d) => !!d);
-      return [...T, ...p];
+      return [...H, ...p];
     },
     []
   ), E = new X(
     window
-  ), g = Xt(
+  ), f = Xt(
     E,
     r,
     e,
@@ -573,36 +591,36 @@ function te({
     n.onClose,
     n.bottomSheetState
   );
-  function L(T) {
-    T.target instanceof Element && !o.contains(T.target) && n.onClose();
+  function x(H) {
+    H.target instanceof Element && !o.contains(H.target) && n.onClose();
   }
-  function H(T) {
+  function T(H) {
     _t(
       n.draggingState,
-      T.target,
+      H.target,
       t.bottomSheetContentWrapper
     );
   }
-  function P(T) {
-    const y = T ?? e;
-    y.draggable && (c.addEventListeners({
-      onStart: H
+  function Y(H) {
+    const y = H ?? e;
+    y.draggable && (s.addEventListeners({
+      onStart: T
     }), l.forEach((v) => {
       v.addEventListeners({
-        onStart: H,
+        onStart: T,
         onStartOptions: {
           eventPhase: j.Target
         }
       });
     })), y.draggable && y.backgroundDraggable && (m.addEventListeners({
-      onStart: H,
+      onStart: T,
       onStartOptions: {
         eventPhase: j.Target
       }
     }), C.addEventListeners({
-      onStart: H
+      onStart: T
     })), y.draggable && E.addEventListeners({
-      onStart: g,
+      onStart: f,
       onMove: S,
       onEnd: w
     }), y.draggable && window.document.addEventListener("keyup", (v) => {
@@ -617,24 +635,24 @@ function te({
         return;
       }
       if (v.shiftKey && v.key === "Tab") {
-        const p = Y(
+        const p = P(
           t.bottomSheetContentWrapper
         );
         jt(p);
       }
     });
   }
-  function $() {
-    e.shouldCloseOnOutsideClick ? u.addEventListener("click", L) : u.style.pointerEvents = "none";
+  function U() {
+    e.shouldCloseOnOutsideClick ? u.addEventListener("click", x) : u.style.pointerEvents = "none";
   }
-  function G() {
-    u.removeEventListener("click", L);
+  function $() {
+    u.removeEventListener("click", x);
   }
-  function Y(T) {
-    let y = [...Array.from(T.childNodes).reverse()];
+  function P(H) {
+    let y = [...Array.from(H.childNodes).reverse()];
     for (; y.length; ) {
       const v = y.shift();
-      if (Ut(v))
+      if (Gt(v))
         return v;
       v && (y = [
         ...y,
@@ -643,33 +661,33 @@ function te({
     }
     return null;
   }
-  function I() {
-    c.removeEventListeners({
-      onStart: H
+  function F() {
+    s.removeEventListeners({
+      onStart: T
     }), m.removeEventListeners({
-      onStart: H
+      onStart: T
     }), C.removeEventListeners({
-      onStart: H
-    }), l.forEach((T) => {
-      T.removeEventListeners({
-        onStart: H
+      onStart: T
+    }), l.forEach((H) => {
+      H.removeEventListeners({
+        onStart: T
       });
     }), E.removeEventListeners({
-      onStart: g,
+      onStart: f,
       onMove: S,
       onEnd: w
     });
   }
   return {
-    attachEventListeners: P,
-    clearEventListeners: I,
-    attacheOnOpenEventListeners: $,
-    clearOnOpenEventListeners: G
+    attachEventListeners: Y,
+    clearEventListeners: F,
+    attacheOnOpenEventListeners: U,
+    clearOnOpenEventListeners: $
   };
 }
 class ee {
   constructor() {
-    K(this, "animationId"), K(this, "isInProgress"), K(this, "startedAt"), this.animationId = null, this.isInProgress = !1, this.startedAt = null;
+    J(this, "animationId"), J(this, "isInProgress"), J(this, "startedAt"), this.animationId = null, this.isInProgress = !1, this.startedAt = null;
   }
   /**
    *
@@ -680,8 +698,8 @@ class ee {
     this.isInProgress = !0;
     const r = (i) => {
       this.startedAt || (this.startedAt = i);
-      const a = i - this.startedAt, s = n === 0 ? 1 : tt(a / n, 2), u = s >= 1 && !o;
-      e(s), u ? this.stop() : this.animationId = requestAnimationFrame(r);
+      const a = i - this.startedAt, c = n === 0 ? 1 : tt(a / n, 2), u = c >= 1 && !o;
+      e(c), u ? this.stop() : this.animationId = requestAnimationFrame(r);
     };
     this.animationId = requestAnimationFrame(r);
   }
@@ -697,15 +715,15 @@ function ne(t) {
     animationFrame: r,
     onEnd: i,
     animationTimingFunction: a,
-    animationDuration: s
+    animationDuration: c
   } = t, u = wt(e, n);
   r.stop();
   let h = !1;
-  r.start((c) => {
+  r.start((s) => {
     et(o, {
-      y: e + u * a(c)
-    }), !h && c >= 1 && (i == null || i(), h = !0);
-  }, s);
+      y: e + u * a(s)
+    }), !h && s >= 1 && (i == null || i(), h = !0);
+  }, c);
 }
 const ut = (t, e) => (n) => {
   ne({
@@ -713,7 +731,7 @@ const ut = (t, e) => (n) => {
     animationTimingFunction: t,
     animationDuration: e
   });
-}, F = {
+}, N = {
   TOP: "top",
   MIDDLE: "middle",
   CONTENT_HEIGHT: "content-height",
@@ -733,7 +751,7 @@ function re(t, e) {
 function ae(...t) {
   console.error(t);
 }
-const N = {
+const W = {
   EASE: "ease",
   EASE_IN: "ease-in",
   EASE_OUT: "ease-out",
@@ -741,7 +759,7 @@ const N = {
   SPRING: "spring"
 };
 function ie(t) {
-  for (const e of Object.values(N))
+  for (const e of Object.values(W))
     if (e === t)
       return !0;
   return !1;
@@ -749,43 +767,43 @@ function ie(t) {
 function xt(t) {
   return !!(t instanceof Object && "p1x" in t && "p1y" in t && "p2x" in t && "p2y" in t && A(t.p1x) && A(t.p1y) && A(t.p2x) && A(t.p2y));
 }
-function U(t, e, n, o) {
-  return function(s) {
-    return a(r(s));
+function G(t, e, n, o) {
+  return function(c) {
+    return a(r(c));
   };
-  function r(s) {
-    let u = 0, h = 1, c = s, m;
-    if (s === 0 || s === 1)
-      return s;
+  function r(c) {
+    let u = 0, h = 1, s = c, m;
+    if (c === 0 || c === 1)
+      return c;
     for (; u < h; ) {
-      if (m = i(c), Math.abs(m - s) < 1e-3)
-        return c;
-      s > m ? u = c : h = c, c = (h + u) / 2;
+      if (m = i(s), Math.abs(m - c) < 1e-3)
+        return s;
+      c > m ? u = s : h = s, s = (h + u) / 2;
     }
-    return c;
+    return s;
   }
-  function i(s) {
-    return 3 * t * s * Math.pow(1 - s, 2) + 3 * n * Math.pow(s, 2) * (1 - s) + Math.pow(s, 3);
+  function i(c) {
+    return 3 * t * c * Math.pow(1 - c, 2) + 3 * n * Math.pow(c, 2) * (1 - c) + Math.pow(c, 3);
   }
-  function a(s) {
-    return 3 * e * s * Math.pow(1 - s, 2) + 3 * o * Math.pow(s, 2) * (1 - s) + Math.pow(s, 3);
+  function a(c) {
+    return 3 * e * c * Math.pow(1 - c, 2) + 3 * o * Math.pow(c, 2) * (1 - c) + Math.pow(c, 3);
   }
 }
-const St = U(0.25, 0.1, 0.25, 1), se = U(0.42, 0, 1, 1), At = 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);
+const vt = G(0.25, 0.1, 0.25, 1), se = G(0.42, 0, 1, 1), At = G(0.42, 0, 0.58, 1), ce = G(0.4, 0.1, 0.6, 1), le = G(0.45, 1.5, 0.55, 1);
 function ue(t) {
   switch (t) {
-    case N.EASE:
-      return St;
-    case N.EASE_IN:
+    case W.EASE:
+      return vt;
+    case W.EASE_IN:
       return se;
-    case N.EASE_OUT:
+    case W.EASE_OUT:
       return At;
-    case N.EASE_IN_OUT:
+    case W.EASE_IN_OUT:
       return ce;
-    case N.SPRING:
+    case W.SPRING:
       return le;
     default:
-      return St;
+      return vt;
   }
 }
 function yt(t) {
@@ -794,7 +812,7 @@ function yt(t) {
 const de = {
   ariaLabel: "Bottom sheet",
   content: "",
-  defaultPosition: F.CONTENT_HEIGHT,
+  defaultPosition: N.CONTENT_HEIGHT,
   marginTop: 20,
   snapPoints: [],
   width: "92%",
@@ -814,6 +832,7 @@ const de = {
   onDragEnd: () => {
   },
   expandable: !0,
+  preventClosing: !1,
   draggable: !0,
   backgroundDraggable: !0,
   shouldCloseOnOutsideClick: !0,
@@ -821,6 +840,7 @@ const de = {
   shouldShowHandle: !0,
   backDropTransition: null,
   backdropColor: null,
+  containerBackgroundColor: null,
   containerBorderRadius: null,
   rootClass: null,
   containerClass: null,
@@ -833,7 +853,8 @@ const de = {
   containerStyle: {},
   handleStyle: {},
   contentWrapperStyle: {},
-  backdropStyle: {}
+  backdropStyle: {},
+  containerGapFillerStyle: {}
 };
 function pe(t) {
   const e = {
@@ -853,7 +874,7 @@ function pe(t) {
 function dt(t) {
   if (xt(t)) {
     const { p1x: e, p1y: n, p2x: o, p2y: r } = t;
-    return U(e, n, o, r);
+    return G(e, n, o, r);
   }
   return ie(t) ? ue(t) : At;
 }
@@ -861,28 +882,31 @@ function he(t, e, n, o) {
   function r(i, a) {
     switch (i) {
       case "content":
-        x(a) && (t.bottomSheetContentWrapper.innerHTML = a);
+        L(a) && (t.bottomSheetContentWrapper.innerHTML = a);
         break;
       case "width":
-        x(a) && (t.bottomSheetContainer.style.width = a);
+        L(a) && (t.bottomSheetContainer.style.width = a);
         break;
       case "shouldShowHandle":
-        yt(a) || Q(t.bottomSheetHandle, !1);
+        yt(a) || Z(t.bottomSheetHandle, !1);
         break;
       case "shouldShowBackdrop":
-        yt(a) || Q(t.bottomSheetBackdrop, !1);
+        yt(a) || Z(t.bottomSheetBackdrop, !1);
         break;
       case "containerBorderRadius":
-        x(a) && (t.bottomSheetContainer.style.borderRadius = Lt(a));
+        L(a) && (t.bottomSheetContainer.style.borderRadius = Lt(a));
+        break;
+      case "containerBackgroundColor":
+        L(a) && (t.bottomSheetContainer.style.backgroundColor = a, t.bottomSheetContainerGapFiller.style.backgroundColor = a);
         break;
       case "backdropColor":
-        x(a) && (t.bottomSheetBackdrop.style.backgroundColor = a);
+        L(a) && (t.bottomSheetBackdrop.style.backgroundColor = a);
         break;
       case "backDropTransition":
-        x(a) && (t.bottomSheetBackdrop.style.transition = a);
+        L(a) && (t.bottomSheetBackdrop.style.transition = a);
         break;
       case "rootClass":
-        if (!x(a))
+        if (!L(a))
           return;
         _(
           t.bottomSheetRoot,
@@ -891,7 +915,7 @@ function he(t, e, n, o) {
         );
         break;
       case "containerClass":
-        if (!x(a))
+        if (!L(a))
           return;
         _(
           t.bottomSheetContainer,
@@ -900,7 +924,7 @@ function he(t, e, n, o) {
         );
         break;
       case "handleClass":
-        if (!x(a))
+        if (!L(a))
           return;
         _(
           t.bottomSheetHandle,
@@ -909,7 +933,7 @@ function he(t, e, n, o) {
         );
         break;
       case "contentWrapperClass":
-        if (!x(a))
+        if (!L(a))
           return;
         _(
           t.bottomSheetContentWrapper,
@@ -918,7 +942,7 @@ function he(t, e, n, o) {
         );
         break;
       case "backdropClass":
-        if (!x(a))
+        if (!L(a))
           return;
         _(
           t.bottomSheetBackdrop,
@@ -929,13 +953,16 @@ function he(t, e, n, o) {
       case "expandable":
         o.clearEventListeners(), o.attachEventListeners(n);
         break;
+      case "preventClosing":
+        o.clearEventListeners(), o.attachEventListeners(n);
+        break;
       case "draggable":
         o.clearEventListeners(), o.attachEventListeners(n);
         break;
       case "draggingAnimationTimings":
         if (xt(a)) {
-          const s = dt(a), u = ut(
-            s,
+          const c = dt(a), u = ut(
+            c,
             n.draggingAnimationDuration
           );
           e.translateContainer = u;
@@ -943,10 +970,10 @@ function he(t, e, n, o) {
         break;
       case "draggingAnimationDuration":
         if (A(a)) {
-          const s = dt(
+          const c = dt(
             n.draggingAnimationTimings
           ), u = ut(
-            s,
+            c,
             a
           );
           e.translateContainer = u;
@@ -970,6 +997,12 @@ function he(t, e, n, o) {
           n.containerStyle
         );
         break;
+      case "containerGapFillerStyle":
+        n.containerGapFillerStyle && Object.assign(
+          t.bottomSheetContainerGapFiller.style,
+          n.containerGapFillerStyle
+        );
+        break;
       case "handleStyle":
         n.handleStyle && Object.assign(
           t.bottomSheetHandleBar.style,
@@ -1008,18 +1041,18 @@ function me(t) {
   function i() {
     r.originalDocumentOverflowY && r.originalDocumentOverflowY !== "hidden" && (document.body.style.overflowY = r.originalDocumentOverflowY), r.originalDocumentOverscrollBehavior && (document.body.style.position = r.originalDocumentOverscrollBehavior);
   }
-  const a = new ee(), s = {
+  const a = new ee(), c = {
     animationFrame: a,
     onClose: w,
     bottomSheetState: o,
     draggingState: r,
     snapTo: v,
-    moveUp: T,
+    moveUp: H,
     moveDown: y
   }, { elements: u, eventHandlers: h } = Jt(
     e,
-    s
-  ), c = re(
+    c
+  ), s = re(
     e,
     he(
       u,
@@ -1034,27 +1067,27 @@ function me(t) {
     et(l, {
       y: b
     }), h.attachEventListeners(), o.isMounted = !0;
-  }, g = () => {
+  }, f = () => {
     h.clearEventListeners(), Object.values(u).forEach((p) => {
       p.remove();
     }), i(), o.isMounted = !1;
   }, S = () => {
     var p;
-    if (L() || ae(
+    if (x() || ae(
       'Bottom Sheet is not mounted yet. call the "mount" method first.'
-    ), (p = t.beforeOpen) == null || p.call(t), H())
+    ), (p = t.beforeOpen) == null || p.call(t), T())
       return;
-    ot(m, !0), c.shouldShowBackdrop || V(m, "transparent"), ot([l], !0), et(l, {
+    ot(m, !0), s.shouldShowBackdrop || K(m, "transparent"), ot([l], !0), et(l, {
       y: l.clientHeight
     });
     const d = window.innerHeight, b = mt(
       d,
       l.clientHeight,
-      c.marginTop,
-      c.defaultPosition
-    ), f = B(l).y;
+      s.marginTop,
+      s.defaultPosition
+    ), g = D(l).y;
     o.translateContainer({
-      startY: f,
+      startY: g,
       endY: b,
       animationFrame: a,
       bottomSheetContainer: l,
@@ -1062,95 +1095,95 @@ function me(t) {
     });
     const O = document.body.style.overflowY;
     r.originalDocumentOverflowY = O || "initial";
-    const D = document.body.style.overscrollBehavior;
-    r.originalDocumentOverscrollBehavior = D || "initial", document.body.style.overflow = "hidden", document.body.style.overscrollBehavior = "contain", u.bottomSheetHandle.focus(), h.attacheOnOpenEventListeners();
+    const B = document.body.style.overscrollBehavior;
+    r.originalDocumentOverscrollBehavior = B || "initial", document.body.style.overflow = "hidden", document.body.style.overscrollBehavior = "contain", u.bottomSheetHandle.focus(), h.attacheOnOpenEventListeners();
   };
   function w() {
     var p;
-    if (P())
+    if (Y())
       return;
     (p = t.beforeClose) == null || p.call(t);
-    const d = B(l).y, b = l.clientHeight;
+    const d = D(l).y, b = l.clientHeight;
     o.translateContainer({
       startY: d,
       endY: b,
       animationFrame: a,
       bottomSheetContainer: l,
       onEnd: () => {
-        var f;
-        (f = t.afterClose) == null || f.call(t), ot([m, l], !1), h.clearOnOpenEventListeners();
+        var g;
+        (g = t.afterClose) == null || g.call(t), ot([m, l], !1), h.clearOnOpenEventListeners();
       }
     }), i();
   }
-  function L() {
+  function x() {
     return o.isMounted;
   }
-  function H() {
-    const p = B(l).y, d = window.innerHeight, b = l.clientHeight >= d ? d : l.clientHeight;
+  function T() {
+    const p = D(l).y, d = window.innerHeight, b = l.clientHeight >= d ? d : l.clientHeight;
     return p <= b;
   }
-  function P() {
-    return !H();
+  function Y() {
+    return !T();
   }
-  function $() {
-    const p = B(l).y, d = l.clientHeight, b = window.innerHeight;
+  function U() {
+    const p = D(l).y, d = l.clientHeight, b = window.innerHeight;
     if (p <= 5 && p >= -5)
-      return F.CONTENT_HEIGHT;
-    const f = d - p;
-    if (f === b / 2)
-      return F.MIDDLE;
-    const O = b - c.marginTop, D = 10;
-    return f <= O + D && f >= O - D ? F.TOP : F.CLOSED;
+      return N.CONTENT_HEIGHT;
+    const g = d - p;
+    if (g === b / 2)
+      return N.MIDDLE;
+    const O = b - s.marginTop, B = 10;
+    return g <= O + B && g >= O - B ? N.TOP : N.CLOSED;
   }
-  function G() {
+  function $() {
     return l.clientHeight;
   }
-  function Y(p) {
-    if (!H())
+  function P(p) {
+    if (!T())
       return;
-    const d = B(l).y, b = l.clientHeight - d, f = window.innerHeight - p, O = $t(b, f), D = Z(b, f);
+    const d = D(l).y, b = l.clientHeight - d, g = window.innerHeight - p, O = Ut(b, g), B = V(b, g);
     o.translateContainer({
       startY: d,
-      endY: d + (O.isUp ? -D : D),
+      endY: d + (O.isUp ? -B : B),
       animationFrame: a,
       bottomSheetContainer: l
     });
   }
-  function I(p, {
+  function F(p, {
     viewportHeight: d,
     visibleHeight: b
   }) {
-    let f = null;
+    let g = null;
     for (const O of p) {
-      const D = O * d, R = Z(
+      const B = O * d, I = V(
         b,
-        D
+        B
       );
-      (f === null || R < f) && (f = R);
+      (g === null || I < g) && (g = I);
     }
     return {
-      minOffset: f
+      minOffset: g
     };
   }
-  function T() {
-    const p = [...c.snapPoints].reverse(), d = B(l).y, b = l.clientHeight, f = b - d;
-    if (!c.expandable && f >= b)
+  function H() {
+    const p = [...s.snapPoints].reverse(), d = D(l).y, b = l.clientHeight, g = b - d;
+    if (!s.expandable && g >= b)
       return;
-    const O = window.innerHeight, D = bt(
+    const O = window.innerHeight, B = ft(
       "above",
-      { visibleHeight: f, viewportHeight: O },
+      { visibleHeight: g, viewportHeight: O },
       p
-    ), { minOffset: R } = I(D, {
-      visibleHeight: f,
+    ), { minOffset: I } = F(B, {
+      visibleHeight: g,
       viewportHeight: O
     });
-    if (R === null && f < O - c.marginTop) {
+    if (I === null && g < O - s.marginTop) {
       o.translateContainer({
         startY: d,
         endY: mt(
           O,
           b,
-          c.marginTop,
+          s.marginTop,
           "top"
         ),
         animationFrame: a,
@@ -1158,22 +1191,22 @@ function me(t) {
       });
       return;
     }
-    A(R) && o.translateContainer({
+    A(I) && o.translateContainer({
       startY: d,
-      endY: d - R,
+      endY: d - I,
       animationFrame: a,
       bottomSheetContainer: l
     });
   }
   function y() {
-    const p = B(l).y, d = l.clientHeight - p;
+    const p = D(l).y, d = l.clientHeight - p;
     if (d < 1)
       return;
-    const b = window.innerHeight, f = bt(
+    const b = window.innerHeight, g = ft(
       "below",
       { visibleHeight: d, viewportHeight: b },
-      c.snapPoints
-    ), { minOffset: O } = I(f, {
+      s.snapPoints
+    ), { minOffset: O } = F(g, {
       visibleHeight: d,
       viewportHeight: b
     });
@@ -1189,25 +1222,25 @@ function me(t) {
     if (!oe(p))
       return;
     const b = tt(d * p, 2);
-    Y(b);
+    P(b);
   }
   return {
-    props: c,
+    props: s,
     elements: u,
     mount: E,
-    unmount: g,
+    unmount: f,
     open: S,
     close: w,
-    getIsMounted: L,
-    getIsOpen: H,
-    getIsClosed: P,
-    getPosition: $,
-    getHeight: G,
-    moveTo: Y,
+    getIsMounted: x,
+    getIsOpen: T,
+    getIsClosed: Y,
+    getPosition: U,
+    getHeight: $,
+    moveTo: P,
     snapTo: v
   };
 }
-function Dt() {
+function Bt() {
   return {
     elements: {
       bottomSheetRoot: void 0,
@@ -1230,7 +1263,7 @@ function Dt() {
     getHeight: () => 0,
     getIsOpen: () => !1,
     getIsClosed: () => !0,
-    getPosition: () => F.CLOSED,
+    getPosition: () => N.CLOSED,
     moveTo: () => {
     },
     snapTo: () => {
@@ -1240,45 +1273,45 @@ function Dt() {
     }
   };
 }
-const be = Dt(), Se = Bt(
+const fe = Bt(), ve = Dt(
   function(e, n) {
     const {
       children: o,
       isOpen: r,
       setIsOpen: i,
       afterClose: a,
-      mountingPointRef: s,
+      mountingPointRef: c,
       ...u
-    } = e, h = rt(be), [c, m] = at(
+    } = e, h = rt(fe), [s, m] = at(
       h.current
     );
     Mt(
       n,
-      () => c,
-      [c]
+      () => s,
+      [s]
     );
     const C = z(() => {
       i(!1), a == null || a();
     }, [a]);
     q(() => {
-      r ? c.open() : c.close();
+      r ? s.open() : s.close();
     }, [r]);
     const l = rt(null);
     return q(
       function() {
         var w;
-        if (s && !s.current)
+        if (c && !c.current)
           return;
-        const g = It((w = e.mountingPointRef) == null ? void 0 : w.current) ? e.mountingPointRef.current : window.document.body;
-        if (!g || c.getIsMounted())
+        const f = Ft((w = e.mountingPointRef) == null ? void 0 : w.current) ? e.mountingPointRef.current : window.document.body;
+        if (!f || s.getIsMounted())
           return;
         const S = me({
           content: "",
           ...u,
           afterClose: C
         });
-        return S.mount(g), l.current = S.elements.bottomSheetContentWrapper ?? null, h.current = S, m(S), () => {
-          c.unmount();
+        return S.mount(f), l.current = S.elements.bottomSheetContentWrapper ?? null, h.current = S, m(S), () => {
+          s.unmount();
         };
       },
       [e.mountingPointRef, u, C]
@@ -1293,80 +1326,80 @@ const be = Dt(), Se = Bt(
       return () => {
         h.current.unmount();
       };
-    }, []), l.current ? Yt(
+    }, []), l.current ? Pt(
       e.children,
       l.current
     ) : null;
   }
-), fe = Dt();
+), be = Bt();
 function ye(t = {}) {
-  const e = rt(fe), [n, o] = at(!1), [r, i] = at(e.current);
+  const e = rt(be), [n, o] = at(!1), [r, i] = at(e.current);
   q(() => {
     i(e.current);
   }, [e.current]);
   const {
     beforeOpen: a,
-    afterOpen: s,
+    afterOpen: c,
     beforeClose: u,
     afterClose: h,
-    onDragStart: c,
+    onDragStart: s,
     onDragMove: m,
     onDragEnd: C,
     ...l
   } = t, E = () => {
     a == null || a();
-  }, g = () => {
-    s == null || s(), o(!0);
+  }, f = () => {
+    c == null || c(), o(!0);
   }, S = () => {
     u == null || u();
   }, w = () => {
     h == null || h(), o(!1);
-  }, L = () => {
-    c == null || c();
-  }, H = (y, v) => {
+  }, x = () => {
+    s == null || s();
+  }, T = (y, v) => {
     m == null || m(y, v);
-  }, P = () => {
+  }, Y = () => {
     C == null || C();
-  }, $ = Pt(() => ({
+  }, U = Yt(() => ({
     ref: e,
     isOpen: n,
     setIsOpen: o,
     beforeOpen: E,
-    afterOpen: g,
+    afterOpen: f,
     beforeClose: S,
     afterClose: w,
-    onDragStart: L,
-    onDragMove: H,
-    onDragEnd: P,
+    onDragStart: x,
+    onDragMove: T,
+    onDragEnd: Y,
     ...l
-  }), [e.current, n, o, t]), G = z(() => {
+  }), [e.current, n, o, t]), $ = z(() => {
     o(!0);
-  }, [o]), Y = z(() => {
+  }, [o]), P = z(() => {
     o(!0);
-  }, [o]), I = z(
+  }, [o]), F = z(
     (...y) => {
       r.moveTo(...y);
     },
     [r]
-  ), T = z(
+  ), H = z(
     (...y) => {
       r.snapTo(...y);
     },
     [r]
   );
   return {
-    props: $,
+    props: U,
     instance: r,
     isOpen: n,
     setIsOpen: o,
-    open: G,
-    close: Y,
-    moveTo: I,
-    snapTo: T
+    open: $,
+    close: P,
+    moveTo: F,
+    snapTo: H
   };
 }
 export {
-  Se as BottomSheet,
-  Dt as createPlaceholderBottomSheet,
+  ve as BottomSheet,
+  Bt as createPlaceholderBottomSheet,
   ye as useBottomSheet
 };