@purpurds/drawer 5.19.0 → 5.19.1

package/dist/drawer.es.js

@@ -272,19 +272,19 @@ const Cr = /* @__PURE__ */ de({
     (x) => f(x)
   ), b = Array.from(u.layers), [g] = [
     ...u.layersWithOutsidePointerEventsDisabled
-  ].slice(-1), C = b.indexOf(g), S = d ? b.indexOf(d) : -1, E = u.layersWithOutsidePointerEventsDisabled.size > 0, P = S >= C, I = Tr((x) => {
-    const T = x.target, R = [
+  ].slice(-1), P = b.indexOf(g), S = d ? b.indexOf(d) : -1, E = u.layersWithOutsidePointerEventsDisabled.size > 0, T = S >= P, I = Tr((x) => {
+    const C = x.target, R = [
       ...u.branches
     ].some(
-      (z) => z.contains(T)
+      (W) => W.contains(C)
     );
-    !P || R || (n == null || n(x), c == null || c(x), x.defaultPrevented || l == null || l());
+    !T || R || (n == null || n(x), c == null || c(x), x.defaultPrevented || l == null || l());
   }, v), O = Ar((x) => {
-    const T = x.target;
+    const C = x.target;
     [
       ...u.branches
     ].some(
-      (z) => z.contains(T)
+      (W) => W.contains(C)
     ) || (i == null || i(x), c == null || c(x), x.defaultPrevented || l == null || l());
   }, v);
   return Sr((x) => {
@@ -310,7 +310,7 @@ const Cr = /* @__PURE__ */ de({
   }, []), /* @__PURE__ */ h(F.div, y({}, s, {
     ref: p,
     style: {
-      pointerEvents: E ? P ? "auto" : "none" : void 0,
+      pointerEvents: E ? T ? "auto" : "none" : void 0,
       ...e.style
     },
     onFocusCapture: L(e.onFocusCapture, O.onFocusCapture),
@@ -417,15 +417,15 @@ const Le = "focusScope.autoFocusOnMount", Re = "focusScope.autoFocusOnUnmount",
         }));
       }, g = function(S) {
         if (document.activeElement === document.body)
-          for (const P of S) P.removedNodes.length > 0 && V(c);
+          for (const T of S) T.removedNodes.length > 0 && V(c);
       };
       document.addEventListener("focusin", p), document.addEventListener("focusout", b);
-      const C = new MutationObserver(g);
-      return c && C.observe(c, {
+      const P = new MutationObserver(g);
+      return c && P.observe(c, {
         childList: !0,
         subtree: !0
       }), () => {
-        document.removeEventListener("focusin", p), document.removeEventListener("focusout", b), C.disconnect();
+        document.removeEventListener("focusin", p), document.removeEventListener("focusout", b), P.disconnect();
       };
     }
   }, [
@@ -461,12 +461,12 @@ const Le = "focusScope.autoFocusOnMount", Re = "focusScope.autoFocusOnUnmount",
     if (!t && !o || v.paused) return;
     const b = p.key === "Tab" && !p.altKey && !p.ctrlKey && !p.metaKey, g = document.activeElement;
     if (b && g) {
-      const C = p.currentTarget, [S, E] = Or(C);
+      const P = p.currentTarget, [S, E] = Or(P);
       S && E ? !p.shiftKey && g === E ? (p.preventDefault(), t && V(S, {
         select: !0
       })) : p.shiftKey && g === S && (p.preventDefault(), t && V(E, {
         select: !0
-      })) : g === C && p.preventDefault();
+      })) : g === P && p.preventDefault();
     }
   }, [
     t,
@@ -637,7 +637,7 @@ function pe(e) {
   return (e == null ? void 0 : e.animationName) || "none";
 }
 let Me = 0;
-function zr() {
+function Wr() {
   D(() => {
     var e, r;
     const t = document.querySelectorAll("[data-radix-focus-guard]");
@@ -652,14 +652,14 @@ function ut() {
   const e = document.createElement("span");
   return e.setAttribute("data-radix-focus-guard", ""), e.tabIndex = 0, e.style.cssText = "outline: none; opacity: 0; position: fixed; pointer-events: none", e;
 }
-var W = function() {
-  return W = Object.assign || function(r) {
+var z = function() {
+  return z = Object.assign || function(r) {
     for (var t, o = 1, a = arguments.length; o < a; o++) {
       t = arguments[o];
       for (var n in t) Object.prototype.hasOwnProperty.call(t, n) && (r[n] = t[n]);
     }
     return r;
-  }, W.apply(this, arguments);
+  }, z.apply(this, arguments);
 };
 function Pt(e, r) {
   var t = {};
@@ -669,7 +669,7 @@ function Pt(e, r) {
       r.indexOf(o[a]) < 0 && Object.prototype.propertyIsEnumerable.call(e, o[a]) && (t[o[a]] = e[o[a]]);
   return t;
 }
-function Wr(e, r, t) {
+function zr(e, r, t) {
   if (t || arguments.length === 2) for (var o = 0, a = r.length, n; o < a; o++)
     (n || !(o in r)) && (n || (n = Array.prototype.slice.call(r, 0, o)), n[o] = r[o]);
   return e.concat(n || Array.prototype.slice.call(r));
@@ -780,7 +780,7 @@ function qr(e, r) {
 function Kr(e) {
   e === void 0 && (e = {});
   var r = qr(null);
-  return r.options = W({ async: !0, ssr: !1 }, e), r;
+  return r.options = z({ async: !0, ssr: !1 }, e), r;
 }
 var Tt = function(e) {
   var r = e.sideCar, t = Pt(e, ["sideCar"]);
@@ -789,7 +789,7 @@ var Tt = function(e) {
   var o = r.read();
   if (!o)
     throw new Error("Sidecar medium not found");
-  return $.createElement(o, W({}, t));
+  return $.createElement(o, z({}, t));
 };
 Tt.isSideCarExport = !0;
 function Gr(e, r) {
@@ -801,12 +801,12 @@ var At = Kr(), ke = function() {
     onScrollCapture: ke,
     onWheelCapture: ke,
     onTouchMoveCapture: ke
-  }), a = o[0], n = o[1], i = e.forwardProps, c = e.children, l = e.className, s = e.removeScrollBar, u = e.enabled, d = e.shards, f = e.sideCar, v = e.noIsolation, m = e.inert, p = e.allowPinchZoom, b = e.as, g = b === void 0 ? "div" : b, C = Pt(e, ["forwardProps", "children", "className", "removeScrollBar", "enabled", "shards", "sideCar", "noIsolation", "inert", "allowPinchZoom", "as"]), S = f, E = Br([t, r]), P = W(W({}, C), a);
+  }), a = o[0], n = o[1], i = e.forwardProps, c = e.children, l = e.className, s = e.removeScrollBar, u = e.enabled, d = e.shards, f = e.sideCar, v = e.noIsolation, m = e.inert, p = e.allowPinchZoom, b = e.as, g = b === void 0 ? "div" : b, P = Pt(e, ["forwardProps", "children", "className", "removeScrollBar", "enabled", "shards", "sideCar", "noIsolation", "inert", "allowPinchZoom", "as"]), S = f, E = Br([t, r]), T = z(z({}, P), a);
   return $.createElement(
     $.Fragment,
     null,
     u && $.createElement(S, { sideCar: At, removeScrollBar: s, shards: d, noIsolation: v, inert: m, setCallbacks: n, allowPinchZoom: !!p, lockRef: t }),
-    i ? $.cloneElement($.Children.only(c), W(W({}, P), { ref: E })) : $.createElement(g, W({}, P, { className: l, ref: E }), c)
+    i ? $.cloneElement($.Children.only(c), z(z({}, T), { ref: E })) : $.createElement(g, z({}, T, { className: l, ref: E }), c)
   );
 });
 Ae.defaultProps = {
@@ -1035,7 +1035,7 @@ function wn(e) {
   }, [e]), $.useEffect(function() {
     if (e.inert) {
       document.body.classList.add("block-interactivity-".concat(a));
-      var p = Wr([e.lockRef.current], (e.shards || []).map(ht), !0).filter(Boolean);
+      var p = zr([e.lockRef.current], (e.shards || []).map(ht), !0).filter(Boolean);
       return p.forEach(function(b) {
         return b.classList.add("allow-interactivity-".concat(a));
       }), function() {
@@ -1048,37 +1048,37 @@ function wn(e) {
   var c = $.useCallback(function(p, b) {
     if ("touches" in p && p.touches.length === 2)
       return !i.current.allowPinchZoom;
-    var g = he(p), C = t.current, S = "deltaX" in p ? p.deltaX : C[0] - g[0], E = "deltaY" in p ? p.deltaY : C[1] - g[1], P, I = p.target, O = Math.abs(S) > Math.abs(E) ? "h" : "v";
+    var g = he(p), P = t.current, S = "deltaX" in p ? p.deltaX : P[0] - g[0], E = "deltaY" in p ? p.deltaY : P[1] - g[1], T, I = p.target, O = Math.abs(S) > Math.abs(E) ? "h" : "v";
     if ("touches" in p && O === "h" && I.type === "range")
       return !1;
     var x = pt(O, I);
     if (!x)
       return !0;
-    if (x ? P = O : (P = O === "v" ? "h" : "v", x = pt(O, I)), !x)
+    if (x ? T = O : (T = O === "v" ? "h" : "v", x = pt(O, I)), !x)
       return !1;
-    if (!o.current && "changedTouches" in p && (S || E) && (o.current = P), !P)
+    if (!o.current && "changedTouches" in p && (S || E) && (o.current = T), !T)
       return !0;
-    var T = o.current || P;
-    return mn(T, b, p, T === "h" ? S : E, !0);
+    var C = o.current || T;
+    return mn(C, b, p, C === "h" ? S : E, !0);
   }, []), l = $.useCallback(function(p) {
     var b = p;
     if (!(!ee.length || ee[ee.length - 1] !== n)) {
-      var g = "deltaY" in b ? vt(b) : he(b), C = r.current.filter(function(P) {
-        return P.name === b.type && P.target === b.target && gn(P.delta, g);
+      var g = "deltaY" in b ? vt(b) : he(b), P = r.current.filter(function(T) {
+        return T.name === b.type && T.target === b.target && gn(T.delta, g);
       })[0];
-      if (C && C.should) {
+      if (P && P.should) {
         b.cancelable && b.preventDefault();
         return;
       }
-      if (!C) {
-        var S = (i.current.shards || []).map(ht).filter(Boolean).filter(function(P) {
-          return P.contains(b.target);
+      if (!P) {
+        var S = (i.current.shards || []).map(ht).filter(Boolean).filter(function(T) {
+          return T.contains(b.target);
         }), E = S.length > 0 ? c(b, S[0]) : !i.current.noIsolation;
         E && b.cancelable && b.preventDefault();
       }
     }
-  }, []), s = $.useCallback(function(p, b, g, C) {
-    var S = { name: p, delta: b, target: g, should: C };
+  }, []), s = $.useCallback(function(p, b, g, P) {
+    var S = { name: p, delta: b, target: g, should: P };
     r.current.push(S), setTimeout(function() {
       r.current = r.current.filter(function(E) {
         return E !== S;
@@ -1112,7 +1112,7 @@ function wn(e) {
 }
 const yn = Gr(At, wn);
 var Rt = $.forwardRef(function(e, r) {
-  return $.createElement(Ae, W({}, e, { ref: r, sideCar: yn }));
+  return $.createElement(Ae, z({}, e, { ref: r, sideCar: yn }));
 });
 Rt.classNames = Ae.classNames;
 var Sn = function(e) {
@@ -1259,7 +1259,7 @@ const It = "Dialog", [kt, ga] = Et(It), [Pn, j] = kt(It), Tn = (e) => {
   return D(() => {
     const n = o.current;
     if (n) return Cn(n);
-  }, []), /* @__PURE__ */ h(zt, y({}, e, {
+  }, []), /* @__PURE__ */ h(Wt, y({}, e, {
     ref: a,
     trapFocus: t.open,
     disableOutsidePointerEvents: !0,
@@ -1278,7 +1278,7 @@ const It = "Dialog", [kt, ga] = Et(It), [Pn, j] = kt(It), Tn = (e) => {
   }));
 }), kn = /* @__PURE__ */ w((e, r) => {
   const t = j(fe, e.__scopeDialog), o = A(!1), a = A(!1);
-  return /* @__PURE__ */ h(zt, y({}, e, {
+  return /* @__PURE__ */ h(Wt, y({}, e, {
     ref: r,
     trapFocus: !1,
     disableOutsidePointerEvents: !1,
@@ -1297,9 +1297,9 @@ const It = "Dialog", [kt, ga] = Et(It), [Pn, j] = kt(It), Tn = (e) => {
       ((c = t.triggerRef.current) === null || c === void 0 ? void 0 : c.contains(l)) && n.preventDefault(), n.detail.originalEvent.type === "focusin" && a.current && n.preventDefault();
     }
   }));
-}), zt = /* @__PURE__ */ w((e, r) => {
+}), Wt = /* @__PURE__ */ w((e, r) => {
   const { __scopeDialog: t, trapFocus: o, onOpenAutoFocus: a, onCloseAutoFocus: n, ...i } = e, c = j(fe, t), l = A(null), s = k(r, l);
-  return zr(), /* @__PURE__ */ h(Je, null, /* @__PURE__ */ h(Dr, {
+  return Wr(), /* @__PURE__ */ h(Je, null, /* @__PURE__ */ h(Dr, {
     asChild: !0,
     loop: !0,
     trapped: o,
@@ -1322,8 +1322,8 @@ const It = "Dialog", [kt, ga] = Et(It), [Pn, j] = kt(It), Tn = (e) => {
   }, o, {
     ref: r
   }));
-}), zn = "DialogDescription", Wn = /* @__PURE__ */ w((e, r) => {
-  const { __scopeDialog: t, ...o } = e, a = j(zn, t);
+}), Wn = "DialogDescription", zn = /* @__PURE__ */ w((e, r) => {
+  const { __scopeDialog: t, ...o } = e, a = j(Wn, t);
   return /* @__PURE__ */ h(F.p, y({
     id: a.descriptionId
   }, o, {
@@ -1344,11 +1344,11 @@ const It = "Dialog", [kt, ga] = Et(It), [Pn, j] = kt(It), Tn = (e) => {
 function tt(e) {
   return e ? "open" : "closed";
 }
-const Yn = Tn, Xn = Dn, Bn = On, Vn = Ln, qn = Mn, bt = jn, Kn = Wn, Gn = Hn;
+const Yn = Tn, Xn = Dn, Bn = On, Vn = Ln, qn = Mn, bt = jn, Kn = zn, Gn = Hn;
 function Zn(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
-var Wt = { exports: {} };
+var zt = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -1383,8 +1383,8 @@ var Wt = { exports: {} };
     }
     e.exports ? (t.default = t, e.exports = t) : window.classNames = t;
   })();
-})(Wt);
-var Qn = Wt.exports;
+})(zt);
+var Qn = zt.exports;
 const Q = /* @__PURE__ */ Zn(Qn), Ut = de(null), Jn = {}, eo = "_drawerSmallScreenAnimation_10vdf_1", to = "_drawerLargeScreenAnimation_10vdf_1", ro = "_slideDown_10vdf_1", no = "_overlayAnimation_10vdf_1", oo = {
   "purpur-drawer-content": "_purpur-drawer-content_10vdf_1",
   drawerSmallScreenAnimation: eo,
@@ -1400,7 +1400,7 @@ const Q = /* @__PURE__ */ Zn(Qn), Ut = de(null), Jn = {}, eo = "_drawerSmallScre
   "purpur-drawer-container--body": "_purpur-drawer-container--body_1r6tb_5",
   "purpur-drawer-container--sticky": "_purpur-drawer-container--sticky_1r6tb_8",
   "purpur-drawer-container--footer": "_purpur-drawer-container--footer_1r6tb_11"
-}, co = Q.bind(ao), ze = "purpur-drawer-container", ne = w(
+}, co = Q.bind(ao), We = "purpur-drawer-container", ne = w(
   ({
     ["data-testid"]: e = "purpur-drawer-container",
     children: r,
@@ -1411,12 +1411,12 @@ const Q = /* @__PURE__ */ Zn(Qn), Ut = de(null), Jn = {}, eo = "_drawerSmallScre
   }, i) => {
     const c = co([
       t,
-      ze,
+      We,
       {
-        [`${ze}--${o}`]: o
+        [`${We}--${o}`]: o
       },
       {
-        [`${ze}--sticky`]: a
+        [`${We}--sticky`]: a
       }
     ]);
     return /* @__PURE__ */ _("div", { className: c, "data-testid": e, ref: i, ...n, children: r });
@@ -1639,7 +1639,7 @@ const So = /* @__PURE__ */ wo(yo), Eo = {
   "purpur-button--tertiary-purple-negative": "_purpur-button--tertiary-purple-negative_1acxn_160",
   "purpur-button--text-negative": "_purpur-button--text-negative_1acxn_175",
   "purpur-button--text": "_purpur-button--text_1acxn_175"
-}, We = {
+}, ze = {
   ...po,
   DESTRUCTIVE: "destructive",
   TERTIARY_PURPLE: "tertiary-purple",
@@ -1865,7 +1865,7 @@ const Io = Oo.bind(Lo), _t = "purpur-icon", ko = "md", Fo = (e) => e.filter((r)
     r ? { name: "role", value: "img" } : { name: "aria-hidden", value: "true" }
   ], o = r ? `<title>${r}</title>` : "";
   return `<svg ${Fo(t)}>${o}${e}</svg>`;
-}, zo = (e) => e.replace(/<(\/?)svg([^>]*)>/g, "").trim(), Gt = ({
+}, Wo = (e) => e.replace(/<(\/?)svg([^>]*)>/g, "").trim(), Gt = ({
   ["data-testid"]: e,
   svg: r,
   allyTitle: t,
@@ -1874,7 +1874,7 @@ const Io = Oo.bind(Lo), _t = "purpur-icon", ko = "md", Fo = (e) => e.filter((r)
   ...n
 }) => {
   const i = jo({
-    content: zo(r.svg),
+    content: Wo(r.svg),
     title: t
   }), c = Io(o, _t, `${_t}--${a}`);
   return /* @__PURE__ */ _(
@@ -1887,14 +1887,14 @@ const Io = Oo.bind(Lo), _t = "purpur-icon", ko = "md", Fo = (e) => e.filter((r)
       ...n
     }
   );
-}, Wo = {
+}, zo = {
   "purpur-drawer-header__row": "_purpur-drawer-header__row_1yg5w_1",
   "purpur-drawer-header__row--with-back-button": "_purpur-drawer-header__row--with-back-button_1yg5w_6",
   "purpur-drawer-header__left": "_purpur-drawer-header__left_1yg5w_9",
   "purpur-drawer-header__right": "_purpur-drawer-header__right_1yg5w_12",
   "purpur-drawer-header__close-button": "_purpur-drawer-header__close-button_1yg5w_15",
   "purpur-drawer-header__back-button--only-icon": "_purpur-drawer-header__back-button--only-icon_1yg5w_18"
-}, G = Q.bind(Wo), H = "purpur-drawer-header", Zt = w(
+}, G = Q.bind(zo), H = "purpur-drawer-header", Zt = w(
   ({
     ["data-testid"]: e = "purpur-drawer-header",
     backButton: r,
@@ -1933,7 +1933,7 @@ const Io = Oo.bind(Lo), _t = "purpur-icon", ko = "md", Fo = (e) => e.filter((r)
                 iconOnly: o,
                 onClick: i,
                 size: "sm",
-                variant: o ? We.TERTIARY_PURPLE : We.TEXT,
+                variant: o ? ze.TERTIARY_PURPLE : ze.TEXT,
                 children: [
                   /* @__PURE__ */ _(qt, { size: "sm" }),
                   !o && t
@@ -1955,7 +1955,7 @@ const Io = Oo.bind(Lo), _t = "purpur-icon", ko = "md", Fo = (e) => e.filter((r)
                 className: G(`${H}__close-button`),
                 iconOnly: !0,
                 size: "sm",
-                variant: We.TERTIARY_PURPLE,
+                variant: ze.TERTIARY_PURPLE,
                 children: /* @__PURE__ */ _(Kt, { size: "sm" })
               }
             ) }) })
@@ -1991,9 +1991,9 @@ function Xo(e, r) {
   }, e);
 }
 const Qt = "ScrollArea", [Jt, _a] = Et(Qt), [Bo, U] = Jt(Qt), Vo = /* @__PURE__ */ w((e, r) => {
-  const { __scopeScrollArea: t, type: o = "hover", dir: a, scrollHideDelay: n = 600, ...i } = e, [c, l] = N(null), [s, u] = N(null), [d, f] = N(null), [v, m] = N(null), [p, b] = N(null), [g, C] = N(0), [S, E] = N(0), [P, I] = N(!1), [O, x] = N(!1), T = k(
+  const { __scopeScrollArea: t, type: o = "hover", dir: a, scrollHideDelay: n = 600, ...i } = e, [c, l] = N(null), [s, u] = N(null), [d, f] = N(null), [v, m] = N(null), [p, b] = N(null), [g, P] = N(0), [S, E] = N(0), [T, I] = N(!1), [O, x] = N(!1), C = k(
     r,
-    (z) => l(z)
+    (W) => l(W)
   ), R = Ho(a);
   return /* @__PURE__ */ h(Bo, {
     scope: t,
@@ -2007,18 +2007,18 @@ const Qt = "ScrollArea", [Jt, _a] = Et(Qt), [Bo, U] = Jt(Qt), Vo = /* @__PURE__
     onContentChange: f,
     scrollbarX: v,
     onScrollbarXChange: m,
-    scrollbarXEnabled: P,
+    scrollbarXEnabled: T,
     onScrollbarXEnabledChange: I,
     scrollbarY: p,
     onScrollbarYChange: b,
     scrollbarYEnabled: O,
     onScrollbarYEnabledChange: x,
-    onCornerWidthChange: C,
+    onCornerWidthChange: P,
     onCornerHeightChange: E
   }, /* @__PURE__ */ h(F.div, y({
     dir: R
   }, i, {
-    ref: T,
+    ref: C,
     style: {
       position: "relative",
       // Pass corner sizes as CSS vars to reduce re-renders of context consumers
@@ -2316,32 +2316,32 @@ const Qt = "ScrollArea", [Jt, _a] = Et(Qt), [Bo, U] = Jt(Qt), Vo = /* @__PURE__
 }), [ta, tr] = Jt(X), rr = /* @__PURE__ */ w((e, r) => {
   const { __scopeScrollArea: t, sizes: o, hasThumb: a, onThumbChange: n, onThumbPointerUp: i, onThumbPointerDown: c, onThumbPositionChange: l, onDragScroll: s, onWheelScroll: u, onResize: d, ...f } = e, v = U(X, t), [m, p] = N(null), b = k(
     r,
-    (T) => p(T)
-  ), g = A(null), C = A(""), S = v.viewport, E = o.content - o.viewport, P = M(u), I = M(l), O = Ne(d, 10);
-  function x(T) {
+    (C) => p(C)
+  ), g = A(null), P = A(""), S = v.viewport, E = o.content - o.viewport, T = M(u), I = M(l), O = Ne(d, 10);
+  function x(C) {
     if (g.current) {
-      const R = T.clientX - g.current.left, z = T.clientY - g.current.top;
+      const R = C.clientX - g.current.left, W = C.clientY - g.current.top;
       s({
         x: R,
-        y: z
+        y: W
       });
     }
   }
   return D(() => {
-    const T = (R) => {
-      const z = R.target;
-      (m == null ? void 0 : m.contains(z)) && P(R, E);
+    const C = (R) => {
+      const W = R.target;
+      (m == null ? void 0 : m.contains(W)) && T(R, E);
     };
-    return document.addEventListener("wheel", T, {
+    return document.addEventListener("wheel", C, {
       passive: !1
-    }), () => document.removeEventListener("wheel", T, {
+    }), () => document.removeEventListener("wheel", C, {
       passive: !1
     });
   }, [
     S,
     m,
     E,
-    P
+    T
   ]), D(I, [
     o,
     I
@@ -2359,13 +2359,13 @@ const Qt = "ScrollArea", [Jt, _a] = Et(Qt), [Bo, U] = Jt(Qt), Vo = /* @__PURE__
       position: "absolute",
       ...f.style
     },
-    onPointerDown: L(e.onPointerDown, (T) => {
-      T.button === 0 && (T.target.setPointerCapture(T.pointerId), g.current = m.getBoundingClientRect(), C.current = document.body.style.webkitUserSelect, document.body.style.webkitUserSelect = "none", v.viewport && (v.viewport.style.scrollBehavior = "auto"), x(T));
+    onPointerDown: L(e.onPointerDown, (C) => {
+      C.button === 0 && (C.target.setPointerCapture(C.pointerId), g.current = m.getBoundingClientRect(), P.current = document.body.style.webkitUserSelect, document.body.style.webkitUserSelect = "none", v.viewport && (v.viewport.style.scrollBehavior = "auto"), x(C));
     }),
     onPointerMove: L(e.onPointerMove, x),
-    onPointerUp: L(e.onPointerUp, (T) => {
-      const R = T.target;
-      R.hasPointerCapture(T.pointerId) && R.releasePointerCapture(T.pointerId), document.body.style.webkitUserSelect = C.current, v.viewport && (v.viewport.style.scrollBehavior = ""), g.current = null;
+    onPointerUp: L(e.onPointerUp, (C) => {
+      const R = C.target;
+      R.hasPointerCapture(C.pointerId) && R.releasePointerCapture(C.pointerId), document.body.style.webkitUserSelect = P.current, v.viewport && (v.viewport.style.scrollBehavior = ""), g.current = null;
     })
   })));
 }), Ge = "ScrollAreaThumb", ra = /* @__PURE__ */ w((e, r) => {
@@ -2556,7 +2556,7 @@ const re = Q.bind(io), B = "purpur-drawer-frame", cr = w(
     stickyFooter: p,
     ...b
   }, g) => {
-    const C = re([
+    const P = re([
       n,
       B,
       {
@@ -2566,7 +2566,7 @@ const re = Q.bind(io), B = "purpur-drawer-frame", cr = w(
     return /* @__PURE__ */ Y(
       "div",
       {
-        className: C,
+        className: P,
         "data-testid": e,
         ref: g,
         onAnimationEnd: l,
@@ -2690,24 +2690,27 @@ const da = (e, r) => ({
     onBackButtonClick: u,
     stickyFooter: d = !1,
     title: f,
-    ...v
-  }, m) => {
-    const p = ue([i, $e]), b = A(null), g = Te(Ut), { onAnimationEnd: C, onSwipeStart: S, onSwipeMove: E, onSwipeCancel: P, onSwipeEnd: I } = da(b, g), O = (x) => {
-      l && x.preventDefault();
+    zIndex: v,
+    ...m
+  }, p) => {
+    const b = ue([i, $e]), g = A(null), P = Te(Ut), { onAnimationEnd: S, onSwipeStart: E, onSwipeMove: T, onSwipeCancel: I, onSwipeEnd: O } = da(g, P), x = (C) => {
+      l && C.preventDefault();
     };
     return /* @__PURE__ */ _(Bn, { children: /* @__PURE__ */ _(
       Vn,
       {
         className: ue("purpur-drawer-overlay"),
+        style: { zIndex: typeof v == "number" ? v : "auto" },
         "data-testid": `${e}-overlay`,
         children: /* @__PURE__ */ _(
           qn,
           {
-            onPointerDownOutside: O,
-            className: p,
+            onPointerDownOutside: x,
+            className: b,
             "data-testid": e,
-            ref: m,
-            ...v,
+            ref: p,
+            style: { zIndex: typeof v == "number" ? v + 1 : "auto" },
+            ...m,
             children: /* @__PURE__ */ _(
               cr,
               {
@@ -2717,13 +2720,13 @@ const da = (e, r) => ({
                 closeButtonText: c,
                 className: ue(`${$e}__drawer-frame`),
                 footerContent: s,
-                ref: b,
-                onAnimationEnd: C,
+                ref: g,
+                onAnimationEnd: S,
                 onBackButtonClick: u,
-                onSwipeStart: S,
-                onSwipeMove: E,
-                onSwipeCancel: P,
-                onSwipeEnd: I,
+                onSwipeStart: E,
+                onSwipeMove: T,
+                onSwipeCancel: I,
+                onSwipeEnd: O,
                 stickyFooter: d,
                 title: f,
                 children: a ? /* @__PURE__ */ Y("div", { className: ue(`${$e}__content-container`), children: [