welcome-ui 8.1.2 → 8.1.3

package/dist/Drawer.mjs

@@ -1,9 +1,9 @@
 "use client";
-import r from "react";
+import e from "react";
 import a, { th as n, css as c, useTheme as x } from "@xstyled/styled-components";
-import { CloseButton as k } from "./CloseButton.mjs";
+import { CloseButton as v } from "./CloseButton.mjs";
 import { Box as l } from "./Box.mjs";
-import { D as v } from "./SYRFVSLH-jn06-eLy.mjs";
+import { D as k } from "./SYRFVSLH-jn06-eLy.mjs";
 import { forwardRef as m } from "./System.mjs";
 import { Text as h } from "./Text.mjs";
 import "./Icon.mjs";
@@ -42,8 +42,8 @@ const F = (t) => {
         transform: "translateX(-100%)"
       };
   }
-}, g = ["sm", "md", "lg"], _ = (t, e) => {
-  switch (e) {
+}, g = ["sm", "md", "lg"], _ = (t, r) => {
+  switch (r) {
     case "top":
     case "bottom":
       return g.includes(t) ? n(`drawers.sizes.vertical.${t}`) : {
@@ -56,11 +56,11 @@ const F = (t) => {
       };
   }
 }, j = a.divBox(
-  ({ placement: t, size: e }) => c`
+  ({ placement: t, size: r }) => c`
     ${n("cards.default")};
     ${n("drawers.default")};
     ${F(t)}
-    ${_(e, t)}
+    ${_(r, t)}
     position: fixed;
     display: flex;
     flex-direction: column;
@@ -99,35 +99,35 @@ const F = (t) => {
   ${n("drawers.title")};
 `, R = a.divBox`
   ${n("drawers.content")};
-`, P = a(k)`
+`, P = a(v)`
   ${n("drawers.closeButton")};
 `, Y = a.divBox`
   ${n("drawers.footer")};
-`, E = ({ zIndex: t = "2", ...e }) => {
+`, E = ({ zIndex: t = "2", ...r }) => {
   const o = x();
-  return /* @__PURE__ */ r.createElement(l, { h: "0", position: "sticky", top: 0, zIndex: t }, /* @__PURE__ */ r.createElement(
-    v,
+  return /* @__PURE__ */ e.createElement(l, { h: "0", position: "sticky", top: 0, zIndex: t }, /* @__PURE__ */ e.createElement(
+    k,
     {
-      render: /* @__PURE__ */ r.createElement(
+      render: /* @__PURE__ */ e.createElement(
         P,
         {
           left: `calc(100% - ${o.space.lg} - ${o.buttons.sizes.sm.height})`,
           mt: "lg",
-          ...e
+          ...r
         }
       )
     }
   ));
-}, L = m((t, e) => /* @__PURE__ */ r.createElement(R, { flex: "1", overflowY: { md: "auto" }, ref: e, ...t })), W = m((t, e) => /* @__PURE__ */ r.createElement(
+}, L = m((t, r) => /* @__PURE__ */ e.createElement(R, { flex: "1", overflowY: { md: "auto" }, ref: r, ...t })), W = m((t, r) => /* @__PURE__ */ e.createElement(
   Y,
   {
     bottom: { xs: 0, md: "auto" },
     position: { xs: "sticky", md: "static" },
-    ref: e,
+    ref: r,
     w: "100%",
     ...t
   }
-)), X = ({ children: t, zIndex: e = "1", ...o }) => /* @__PURE__ */ r.createElement(
+)), X = ({ children: t, zIndex: r = "1", ...o }) => /* @__PURE__ */ e.createElement(
   A,
   {
     alignItems: "center",
@@ -136,10 +136,10 @@ const F = (t) => {
     position: { xs: "sticky", md: "static" },
     top: { xs: 0, md: "auto" },
     w: "100%",
-    zIndex: e,
+    zIndex: r,
     ...o
   },
-  /* @__PURE__ */ r.createElement(h, { m: "0", variant: "h3", w: "100%" }, t)
+  /* @__PURE__ */ e.createElement(h, { m: "0", variant: "h3", w: "100%" }, t)
 ), q = a.divBox`
   flex: 1;
   margin: 0 auto;
@@ -164,20 +164,20 @@ const F = (t) => {
 ), H = m(
   ({
     children: t,
-    getPersistentElements: e,
+    getPersistentElements: r,
     maxWidth: o = 820,
     store: s,
     ...i
   }, d) => {
     const u = x(), p = () => Array.from(
-      e ? e() : document.querySelectorAll("[data-wui-persistent]")
-    ), b = !!e || (($) => {
+      r ? r() : document.querySelectorAll("[data-wui-persistent]")
+    ), b = !!r || (($) => {
       const D = $.target;
       return !p().some(
         (B) => B.contains(D)
       );
     });
-    return /* @__PURE__ */ r.createElement(
+    return /* @__PURE__ */ e.createElement(
       N,
       {
         ...i,
@@ -185,6 +185,7 @@ const F = (t) => {
         getPersistentElements: p,
         h: { _: "100%", md: "calc(100% - 3rem)" },
         hideOnInteractOutside: b,
+        overflow: "hidden",
         placement: "bottom",
         ref: d,
         store: s,
@@ -194,16 +195,16 @@ const F = (t) => {
         },
         withBackdrop: !0
       },
-      /* @__PURE__ */ r.createElement(q, { maxWidth: o }, /* @__PURE__ */ r.createElement(l, { p: { _: "xl md", md: "3xl xl" } }, t))
+      /* @__PURE__ */ e.createElement(l, { h: "100%", mt: { _: "xl", md: "3xl" }, overflowY: "auto", w: "100%" }, /* @__PURE__ */ e.createElement(q, { maxWidth: o }, /* @__PURE__ */ e.createElement(l, { p: { _: "0 md xl", md: "0 xl 3xl" } }, t)))
     );
   }
 ), Z = ({
   action: t,
-  icon: e,
+  icon: r,
   onBackButtonClick: o,
   subtitle: s,
   title: i
-}) => /* @__PURE__ */ r.createElement(
+}) => /* @__PURE__ */ e.createElement(
   l,
   {
     alignItems: { md: "center" },
@@ -213,36 +214,35 @@ const F = (t) => {
     gap: "xl",
     justifyContent: "space-between",
     mb: "xl",
-    mt: "-md",
+    pb: "md",
     position: "sticky",
-    py: "md",
     top: 0,
     zIndex: 1
   },
-  /* @__PURE__ */ r.createElement(l, { alignItems: "center", display: "flex", gap: { _: "md", md: "xl" } }, !!o && /* @__PURE__ */ r.createElement(I, { onClick: o, shape: "circle", size: "lg", variant: "ghost" }, /* @__PURE__ */ r.createElement(C, null)), !!e && /* @__PURE__ */ r.createElement(J, { icon: e }), /* @__PURE__ */ r.createElement(l, { display: "flex", flexDirection: "column", gap: "xxs" }, /* @__PURE__ */ r.createElement(h, { pr: "xl", variant: "h3" }, i), s)),
-  t && /* @__PURE__ */ r.createElement(l, { alignItems: "center", display: "flex", flexShrink: 0, gap: "md" }, t)
-), J = ({ icon: t, size: e = "md" }) => /* @__PURE__ */ r.createElement(z, { size: e }, /* @__PURE__ */ r.createElement(t, { color: "neutral-90", size: e })), K = m(
+  /* @__PURE__ */ e.createElement(l, { alignItems: "center", display: "flex", gap: { _: "md", md: "xl" } }, !!o && /* @__PURE__ */ e.createElement(I, { onClick: o, shape: "circle", size: "lg", variant: "ghost" }, /* @__PURE__ */ e.createElement(C, null)), !!r && /* @__PURE__ */ e.createElement(J, { icon: r }), /* @__PURE__ */ e.createElement(l, { display: "flex", flexDirection: "column", gap: "xxs" }, /* @__PURE__ */ e.createElement(h, { pr: "xl", variant: "h3" }, i), s)),
+  t && /* @__PURE__ */ e.createElement(l, { alignItems: "center", display: "flex", flexShrink: 0, gap: "md" }, t)
+), J = ({ icon: t, size: r = "md" }) => /* @__PURE__ */ e.createElement(z, { size: r }, /* @__PURE__ */ e.createElement(t, { color: "neutral-90", size: r })), K = m(
   ({
     children: t,
-    hideOnInteractOutside: e = !0,
+    hideOnInteractOutside: r = !0,
     placement: o = "right",
     size: s = "lg",
     store: i,
     withBackdrop: d = !1,
     withCloseButton: u = !0,
     ...p
-  }, f) => /* @__PURE__ */ r.createElement(
+  }, f) => /* @__PURE__ */ e.createElement(
     O,
     {
-      backdrop: d ? /* @__PURE__ */ r.createElement(w, { hideOnInteractOutside: e }) : !1,
-      hideOnInteractOutside: e,
+      backdrop: d ? /* @__PURE__ */ e.createElement(w, { hideOnInteractOutside: r }) : !1,
+      hideOnInteractOutside: r,
       modal: d,
       ref: f,
-      render: /* @__PURE__ */ r.createElement(j, { placement: o, size: s }),
+      render: /* @__PURE__ */ e.createElement(j, { placement: o, size: s }),
       store: i,
       ...p
     },
-    /* @__PURE__ */ r.createElement(r.Fragment, null, u && /* @__PURE__ */ r.createElement(E, null), t)
+    /* @__PURE__ */ e.createElement(e.Fragment, null, u && /* @__PURE__ */ e.createElement(E, null), t)
   )
 );
 function ct(t = {}) {
@@ -250,13 +250,13 @@ function ct(t = {}) {
 }
 const M = ({
   hideOnInteractOutside: t = !0,
-  ...e
-}) => /* @__PURE__ */ r.createElement(w, { hideOnInteractOutside: t, ...e }), y = m(({ as: t, store: e, ...o }, s) => /* @__PURE__ */ r.createElement(
+  ...r
+}) => /* @__PURE__ */ e.createElement(w, { hideOnInteractOutside: t, ...r }), y = m(({ as: t, store: r, ...o }, s) => /* @__PURE__ */ e.createElement(
   T,
   {
     ref: s,
-    render: t ? (i) => /* @__PURE__ */ r.createElement(t, { ...i }) : void 0,
-    store: e,
+    render: t ? (i) => /* @__PURE__ */ e.createElement(t, { ...i }) : void 0,
+    store: r,
     ...o
   }
 )), N = Object.assign(K, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "welcome-ui",
-  "version": "8.1.2",
+  "version": "8.1.3",
   "description": "Customizable design system with react • styled-components • styled-system and ariakit.",
   "files": [
     "dist"