welcome-ui 9.0.0-alpha.0 → 9.0.0-alpha.2

package/dist/Drawer.js

@@ -1,53 +1,53 @@
 "use client";
-import { jsx as e, jsxs as f, Fragment as z } from "react/jsx-runtime";
-import { D as y } from "./JC64G2H7-jNBZrGfv.js";
-import { d as we } from "./JC64G2H7-jNBZrGfv.js";
-import { useCallback as g, forwardRef as u } from "react";
-import { c as o } from "./classNames-qiokGROM.js";
-import { f as b } from "./forwardRefWithAs-8eP3ZN15.js";
-import { Button as A } from "./Button.js";
-import "./Icon-CvQNL_iy.js";
-import { A as C } from "./index-Cl7vCH7S.js";
-import { Text as x } from "./Text.js";
-import { D as O } from "./SYRFVSLH-D5X1Ofws.js";
-import { CloseButton as T } from "./CloseButton.js";
-import { D as j } from "./AXB53BZF-ClCOTGI-.js";
-const F = "_content_19lei_8", I = "_title_19lei_62", w = {
-  "asset-drawer": "_asset-drawer_19lei_3",
-  "content-wrapper": "_content-wrapper_19lei_8",
-  "content-max-width": "_content-max-width_19lei_19",
-  content: F,
-  "asset-drawer-header": "_asset-drawer-header_19lei_34",
-  "back-button": "_back-button_19lei_52",
-  title: I,
-  "icon-block": "_icon-block_19lei_67",
-  "size-md": "_size-md_19lei_79",
-  "size-sm": "_size-sm_19lei_82"
-}, d = o(w), W = b(
+import { jsx as t, jsxs as f, Fragment as y } from "react/jsx-runtime";
+import { D as A } from "./JC64G2H7-DPy9R0De.js";
+import { u as bt } from "./JC64G2H7-DPy9R0De.js";
+import { useCallback as b, forwardRef as h } from "react";
+import { c as n } from "./index-PAaZGbyz.js";
+import { f as x } from "./forwardRefWithAs-8eP3ZN15.js";
+import { Button as C } from "./Button.js";
+import "./Icon-BisRi8B3.js";
+import { A as O } from "./index-C8GsqBDe.js";
+import { Text as g } from "./Text.js";
+import { D as T } from "./SYRFVSLH-CHNUB1rW.js";
+import { CloseButton as j } from "./CloseButton.js";
+import { D as F } from "./AXB53BZF-BHeessqV.js";
+const I = "_content_xrztb_13", B = "_title_xrztb_67", w = {
+  "asset-drawer": "_asset-drawer_xrztb_3",
+  "content-wrapper": "_content-wrapper_xrztb_13",
+  "content-max-width": "_content-max-width_xrztb_24",
+  content: I,
+  "asset-drawer-header": "_asset-drawer-header_xrztb_39",
+  "back-button": "_back-button_xrztb_57",
+  title: B,
+  "icon-block": "_icon-block_xrztb_72",
+  "size-md": "_size-md_xrztb_84",
+  "size-sm": "_size-sm_xrztb_87"
+}, d = n(w), E = x(
   ({
-    children: t,
+    children: e,
     className: r,
     getPersistentElements: s,
-    maxWidth: n,
+    maxWidth: o,
     store: a,
     ...i
   }, m) => {
-    const l = g(
+    const l = b(
       () => Array.from(
         s ? s() : document.querySelectorAll("[data-wui-persistent]")
       ),
       [s]
-    ), p = g(
-      (h) => {
-        const k = h.target;
+    ), p = b(
+      ($) => {
+        const k = $.target;
         return !l().some(
           (D) => D.contains(k)
         );
       },
       [l]
-    );
-    return /* @__PURE__ */ e(
-      ee,
+    ), u = typeof o == "number" ? `${o}px` : o;
+    return /* @__PURE__ */ t(
+      et,
       {
         autoFocusOnShow: !1,
         className: d("asset-drawer", r),
@@ -56,39 +56,38 @@ const F = "_content_19lei_8", I = "_title_19lei_62", w = {
         placement: "bottom",
         ref: m,
         store: a,
-        style: { "--drawer-height": "calc(100% - 3rem)" },
         withBackdrop: !0,
         ...i,
-        children: /* @__PURE__ */ e("div", { className: d("content-wrapper"), children: /* @__PURE__ */ e(
+        children: /* @__PURE__ */ t("div", { className: d("content-wrapper"), children: /* @__PURE__ */ t(
           "div",
           {
             className: d("content-max-width"),
-            style: { "--asset-drawer-content-max-width": n },
-            children: /* @__PURE__ */ e("div", { className: d("content"), children: t })
+            style: { "--asset-drawer-content-max-width": u },
+            children: /* @__PURE__ */ t("div", { className: d("content"), children: e })
           }
         ) })
       }
     );
   }
-), B = o(w), E = ({ icon: t, size: r = "md" }) => /* @__PURE__ */ e("div", { className: B("icon-block", `size-${r}`), children: /* @__PURE__ */ e(t, { className: "text-neutral-90", size: r }) }), _ = o(w), P = ({
-  action: t,
+), P = n(w), R = ({ icon: e, size: r = "md" }) => /* @__PURE__ */ t("div", { className: P("icon-block", `size-${r}`), children: /* @__PURE__ */ t(e, { className: "text-neutral-90", size: r }) }), _ = n(w), S = ({
+  action: e,
   className: r,
   icon: s,
-  onBackButtonClick: n,
+  onBackButtonClick: o,
   subtitle: a,
   title: i
 }) => /* @__PURE__ */ f("div", { className: _("asset-drawer-header", r), children: [
   /* @__PURE__ */ f("div", { className: _("back-button"), children: [
-    !!n && /* @__PURE__ */ e(A, { onClick: n, shape: "circle", size: "lg", variant: "ghost", children: /* @__PURE__ */ e(C, {}) }),
-    !!s && /* @__PURE__ */ e(E, { icon: s }),
+    !!o && /* @__PURE__ */ t(C, { onClick: o, shape: "circle", size: "lg", variant: "ghost", children: /* @__PURE__ */ t(O, {}) }),
+    !!s && /* @__PURE__ */ t(R, { icon: s }),
     /* @__PURE__ */ f("div", { className: _("title"), children: [
-      /* @__PURE__ */ e(x, { className: "pr-xl", variant: "h3", children: i }),
+      /* @__PURE__ */ t(g, { className: "pr-xl", variant: "h3", children: i }),
       a
     ] })
   ] }),
-  t ? /* @__PURE__ */ e("div", { className: _("actions"), children: t }) : null
-] }), R = "_root_11f0r_3", S = "_backdrop_11f0r_68", q = "_content_11f0r_85", H = "_footer_11f0r_94", L = "_title_11f0r_108", c = {
-  root: R,
+  e ? /* @__PURE__ */ t("div", { className: _("actions"), children: e }) : null
+] }), W = "_root_11f0r_3", q = "_backdrop_11f0r_68", H = "_content_11f0r_85", L = "_footer_11f0r_94", M = "_title_11f0r_108", c = {
+  root: W,
   "placement-bottom": "_placement-bottom_11f0r_30",
   "placement-left": "_placement-left_11f0r_34",
   "placement-right": "_placement-right_11f0r_38",
@@ -96,62 +95,62 @@ const F = "_content_19lei_8", I = "_title_19lei_62", w = {
   "size-sm": "_size-sm_11f0r_46",
   "size-md": "_size-md_11f0r_49",
   "size-lg": "_size-lg_11f0r_52",
-  backdrop: S,
+  backdrop: q,
   "drawer-hide-on-interact-outside": "_drawer-hide-on-interact-outside_11f0r_79",
-  content: q,
-  footer: H,
-  title: L,
+  content: H,
+  footer: L,
+  title: M,
   "drawer-close": "_drawer-close_11f0r_120"
-}, J = o(c), N = ({ hideOnInteractOutside: t = !0, ...r }) => /* @__PURE__ */ e(
+}, J = n(c), z = ({ hideOnInteractOutside: e = !0, ...r }) => /* @__PURE__ */ t(
   "div",
   {
-    className: J("backdrop", t && "drawer-hide-on-interact-outside"),
+    className: J("backdrop", e && "drawer-hide-on-interact-outside"),
     ...r
   }
-), K = o(c), v = ({ className: t }) => /* @__PURE__ */ e(
-  O,
+), K = n(c), N = ({ className: e }) => /* @__PURE__ */ t(
+  T,
   {
-    render: (r) => /* @__PURE__ */ e(T, { className: K("drawer-close", t), ...r })
+    render: (r) => /* @__PURE__ */ t(j, { className: K("drawer-close", e), ...r })
   }
-), M = o(c), Q = u(({ className: t, ...r }, s) => /* @__PURE__ */ e("div", { className: M("content", t), ref: s, ...r })), U = o(c), V = u(({ className: t, ...r }, s) => /* @__PURE__ */ e("div", { className: U("footer", t), ref: s, ...r })), X = o(c), Y = ({ children: t, className: r, ...s }) => /* @__PURE__ */ e("div", { className: X("title", r), ...s, children: /* @__PURE__ */ e(x, { className: "w-full", variant: "h3", children: t }) }), $ = b(
-  ({ as: t, store: r, ...s }, n) => /* @__PURE__ */ e(j, { ref: n, render: t ? /* @__PURE__ */ e(t, {}) : void 0, store: r, ...s })
-), Z = o(c), G = u(
+), Q = n(c), U = h(({ className: e, ...r }, s) => /* @__PURE__ */ t("div", { className: Q("content", e), ref: s, ...r })), V = n(c), X = h(({ className: e, ...r }, s) => /* @__PURE__ */ t("div", { className: V("footer", e), ref: s, ...r })), Y = n(c), Z = ({ children: e, className: r, ...s }) => /* @__PURE__ */ t("div", { className: Y("title", r), ...s, children: /* @__PURE__ */ t(g, { className: "w-full", variant: "h3", children: e }) }), v = x(
+  ({ as: e, store: r, ...s }, o) => /* @__PURE__ */ t(F, { ref: o, render: e ? /* @__PURE__ */ t(e, {}) : void 0, store: r, ...s })
+), G = n(c), tt = h(
   ({
-    children: t,
+    children: e,
     className: r,
     hideOnInteractOutside: s = !0,
-    placement: n = "right",
+    placement: o = "right",
     size: a = "lg",
     store: i,
     withBackdrop: m = !1,
     withCloseButton: l = !0,
     ...p
-  }, h) => /* @__PURE__ */ e(
-    y,
+  }, u) => /* @__PURE__ */ t(
+    A,
     {
-      backdrop: m ? /* @__PURE__ */ e(N, { hideOnInteractOutside: s }) : !1,
+      backdrop: m ? /* @__PURE__ */ t(z, { hideOnInteractOutside: s }) : !1,
       hideOnInteractOutside: s,
       modal: m,
-      ref: h,
-      render: /* @__PURE__ */ e("div", { className: Z("root", `placement-${n}`, `size-${a}`, r) }),
+      ref: u,
+      render: /* @__PURE__ */ t("div", { className: G("root", `placement-${o}`, `size-${a}`, r) }),
       store: i,
       ...p,
-      children: /* @__PURE__ */ f(z, { children: [
-        l ? /* @__PURE__ */ e(v, {}) : null,
-        t
+      children: /* @__PURE__ */ f(y, { children: [
+        l ? /* @__PURE__ */ t(N, {}) : null,
+        e
       ] })
     }
   )
-), ee = Object.assign(G, {
-  Backdrop: N,
-  Close: v,
-  Content: Q,
-  Footer: V,
-  Title: Y,
-  Trigger: $
-}), pe = Object.assign(W, { Header: P, Trigger: $ });
+), et = Object.assign(tt, {
+  Backdrop: z,
+  Close: N,
+  Content: U,
+  Footer: X,
+  Title: Z,
+  Trigger: v
+}), ut = Object.assign(E, { Header: S, Trigger: v });
 export {
-  pe as AssetDrawer,
-  ee as Drawer,
-  we as useDrawer
+  ut as AssetDrawer,
+  et as Drawer,
+  bt as useDrawer
 };