@paciu/ui 0.0.47 → 0.0.49

package/dist/dialog.css

@@ -0,0 +1 @@
+@keyframes _animated-opening-translate_1u8dn_1{0%{transform:translate(var(--animated-from-x, 0),var(--animated-from-y, 0))}to{transform:translate(0)}}@keyframes _animated-opening-opacity_1u8dn_1{0%{opacity:0}to{opacity:1}}@keyframes _animated-closing-translate_1u8dn_1{0%{transform:translate(0)}to{transform:translate(var(--animated-from-x, 0),var(--animated-from-y, 0))}}@keyframes _animated-closing-opacity_1u8dn_1{0%{opacity:1}to{opacity:0}}._dialog-overlay_1u8dn_33{--window-background-color: var(--base-color-100);--window-shadow: var(--dialog-shadow, rgba(12, 12, 12, .06) 0px 0px 12px 0px);--window-width: var(--dialog-width, 768px);cursor:pointer;position:fixed;width:100%;height:100%;display:flex;flex-direction:column;opacity:0;left:0;top:0;padding:24px;transition:var(--transition-normal) transform;background:none}._dialog-overlay_1u8dn_33 ._dialog-compose_1u8dn_50{position:relative;max-height:100%;width:100%;max-width:var(--window-width)}._dialog-overlay_1u8dn_33 ._dialog-compose_1u8dn_50 ._dialog-close_1u8dn_56{width:32px;height:32px;background:var(--window-background-color);box-shadow:var(--window-shadow);border-radius:16px;position:fixed;top:-6px;right:-6px;z-index:2;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:var(--transition-normal)}._dialog-overlay_1u8dn_33 ._dialog-compose_1u8dn_50 ._dialog-close_1u8dn_56 ._dialog-close-cross_1u8dn_73{position:relative;width:16px;height:16px;cursor:pointer}._dialog-overlay_1u8dn_33 ._dialog-compose_1u8dn_50 ._dialog-close_1u8dn_56 ._dialog-close-cross_1u8dn_73:before,._dialog-overlay_1u8dn_33 ._dialog-compose_1u8dn_50 ._dialog-close_1u8dn_56 ._dialog-close-cross_1u8dn_73:after{content:"";position:absolute;top:50%;left:0;width:100%;height:2px;background-color:var(--base-color-900);transition:var(--transition-normal) background;border-radius:2px}._dialog-overlay_1u8dn_33 ._dialog-compose_1u8dn_50 ._dialog-close_1u8dn_56 ._dialog-close-cross_1u8dn_73:before{transform:translateY(-50%) rotate(45deg)}._dialog-overlay_1u8dn_33 ._dialog-compose_1u8dn_50 ._dialog-close_1u8dn_56 ._dialog-close-cross_1u8dn_73:after{transform:translateY(-50%) rotate(-45deg)}._dialog-overlay_1u8dn_33 ._dialog-compose_1u8dn_50 ._dialog-window_1u8dn_97{position:relative;cursor:default;width:100%;height:100%;border-radius:32px;background:var(--window-background-color);transition:var(--transition-normal) background;display:flex;flex-direction:column;box-shadow:var(--window-shadow);overflow:auto;filter:blur(2px)}._dialog-overlay_1u8dn_33 ._dialog-compose_1u8dn_50 ._dialog-window_1u8dn_97 ._dialog-window-header_1u8dn_111{position:sticky;top:0;z-index:1;background:var(--window-background-color);transition:var(--transition-normal) background;padding:12px;border-radius:inherit;box-shadow:var(--window-shadow);display:flex;flex-direction:column;justify-content:center}._dialog-overlay_1u8dn_33 ._dialog-compose_1u8dn_50 ._dialog-window_1u8dn_97 ._dialog-window-body_1u8dn_124{flex-grow:1;padding:12px;position:relative;z-index:0}._dialog-overlay_1u8dn_33 ._dialog-compose_1u8dn_50 ._dialog-window_1u8dn_97 ._dialog-window-footer_1u8dn_130{position:sticky;bottom:0;z-index:1;background:var(--window-background-color);transition:var(--transition-normal) background;padding:12px;border-radius:inherit;box-shadow:var(--window-shadow);display:flex;flex-direction:column;justify-content:center}._dialog-overlay_1u8dn_33._full-height_1u8dn_143 ._dialog-compose_1u8dn_50{height:100%}._dialog-overlay_1u8dn_33._full-width_1u8dn_146 ._dialog-compose_1u8dn_50{max-width:unset}._dialog-overlay_1u8dn_33._un-closable_1u8dn_149 ._dialog-compose_1u8dn_50 ._dialog-close_1u8dn_56{display:none}._dialog-overlay_1u8dn_33._active_1u8dn_152 ._dialog-compose_1u8dn_50 ._dialog-close_1u8dn_56{opacity:1}._dialog-overlay_1u8dn_33._active_1u8dn_152 ._dialog-compose_1u8dn_50 ._dialog-window_1u8dn_97{filter:unset}._dialog-overlay_1u8dn_33._position-top-center_1u8dn_158{--animated-from-x: 0;--animated-from-y: -24px;justify-content:start;align-items:center}._dialog-overlay_1u8dn_33._position-center_1u8dn_164{justify-content:center;align-items:center}._dialog-overlay_1u8dn_33._position-bottom-center_1u8dn_168{--animated-from-x: 0;--animated-from-y: 24px;justify-content:end;align-items:center}._dialog-overlay_1u8dn_33._position-left-top_1u8dn_174{--animated-from-x: -24px;--animated-from-y: -24px;justify-content:start;align-items:start}._dialog-overlay_1u8dn_33._position-left-center_1u8dn_180{--animated-from-x: -24px;--animated-from-y: 0;justify-content:center;align-items:start}._dialog-overlay_1u8dn_33._position-left-bottom_1u8dn_186{--animated-from-x: -24px;--animated-from-y: 24px;justify-content:end;align-items:start}._dialog-overlay_1u8dn_33._position-right-top_1u8dn_192{--animated-from-x: 24px;--animated-from-y: -24px;justify-content:start;align-items:end}._dialog-overlay_1u8dn_33._position-right-center_1u8dn_198{--animated-from-x: 24px;--animated-from-y: 0;justify-content:center;align-items:end}._dialog-overlay_1u8dn_33._position-right-bottom_1u8dn_204{--animated-from-x: 24px;--animated-from-y: 24px;justify-content:end;align-items:end}._dialog-overlay_1u8dn_33._animated-opening_1u8dn_210{animation:_animated-opening-opacity_1u8dn_1 .24s linear forwards}._dialog-overlay_1u8dn_33._animated-opening_1u8dn_210 ._dialog-compose_1u8dn_50{animation:_animated-opening-translate_1u8dn_1 .24s linear forwards}._dialog-overlay_1u8dn_33._animated-closing_1u8dn_216{pointer-events:none;animation:_animated-closing-opacity_1u8dn_1 .24s linear forwards}._dialog-overlay_1u8dn_33._animated-closing_1u8dn_216 ._dialog-compose_1u8dn_50{animation:_animated-closing-translate_1u8dn_1 .24s linear forwards}

package/dist/dialog.d.ts

@@ -0,0 +1,71 @@
+import { default as default_2 } from 'react';
+
+export declare interface CloseDialogOptions {
+    esc?: boolean;
+    outside?: boolean;
+}
+
+export declare const Dialog: default_2.FC<DialogProps>;
+
+export declare const DialogContext: default_2.Context<DialogContextType | undefined>;
+
+export declare interface DialogContextType {
+    providerProps: DialogProviderProps;
+    queue: DialogQueueItem[];
+    openDialog: (node: () => default_2.ReactNode, options?: OpenDialogOptions) => void;
+    closeDialog: (options?: CloseDialogOptions) => void;
+}
+
+declare enum DialogPosition {
+    TopCenter = "top-center",
+    Center = "center",
+    BottomCenter = "bottom-center",
+    LeftTop = "left-top",
+    LeftCenter = "left-center",
+    LeftBottom = "left-bottom",
+    RightTop = "right-top",
+    RightCenter = "right-center",
+    RightBottom = "right-bottom"
+}
+
+export declare interface DialogProps extends default_2.PropsWithChildren {
+    header?: default_2.ReactNode;
+    footer?: default_2.ReactNode;
+}
+
+export declare const DialogProvider: default_2.FC<DialogProviderProps & default_2.PropsWithChildren>;
+
+export declare interface DialogProviderProps {
+    defaultPosition?: DialogPosition;
+}
+
+export declare interface DialogQueueItem {
+    id: number;
+    status: DialogQueueItemStatus;
+    node: () => default_2.ReactNode;
+    options?: OpenDialogOptions;
+}
+
+declare enum DialogQueueItemStatus {
+    Opening = "opening",
+    Opened = "opened",
+    Closing = "closing",
+    Closed = "closed"
+}
+
+export declare interface OpenDialogOptions {
+    position?: DialogPosition;
+    unClosable?: boolean;
+    fullHeight?: boolean;
+    fullWidth?: boolean;
+    onClose?: () => boolean | void;
+    onClosed?: () => boolean | void;
+    onOpen?: () => boolean | void;
+    onOpened?: () => boolean | void;
+}
+
+export declare const useDialog: () => DialogContextType;
+
+export declare const useDialogContext: () => DialogContextType | undefined;
+
+export { }

package/dist/dialog.es.js

@@ -0,0 +1,137 @@
+"use client";
+import { jsxs as m, jsx as l } from "react/jsx-runtime";
+import { createContext as D, useState as f, useRef as x, useCallback as w, useEffect as _, useMemo as O, useContext as N } from "react";
+import { createPortal as k } from "react-dom";
+import { a as s, c as P, D as E } from "./index-CbbUQvJ6.js";
+import './dialog.css';const I = "_active_1u8dn_152", e = {
+  "dialog-overlay": "_dialog-overlay_1u8dn_33",
+  "dialog-compose": "_dialog-compose_1u8dn_50",
+  "dialog-close": "_dialog-close_1u8dn_56",
+  "dialog-close-cross": "_dialog-close-cross_1u8dn_73",
+  "dialog-window": "_dialog-window_1u8dn_97",
+  "dialog-window-header": "_dialog-window-header_1u8dn_111",
+  "dialog-window-body": "_dialog-window-body_1u8dn_124",
+  "dialog-window-footer": "_dialog-window-footer_1u8dn_130",
+  "full-height": "_full-height_1u8dn_143",
+  "full-width": "_full-width_1u8dn_146",
+  "un-closable": "_un-closable_1u8dn_149",
+  active: I,
+  "position-top-center": "_position-top-center_1u8dn_158",
+  "position-center": "_position-center_1u8dn_164",
+  "position-bottom-center": "_position-bottom-center_1u8dn_168",
+  "position-left-top": "_position-left-top_1u8dn_174",
+  "position-left-center": "_position-left-center_1u8dn_180",
+  "position-left-bottom": "_position-left-bottom_1u8dn_186",
+  "position-right-top": "_position-right-top_1u8dn_192",
+  "position-right-center": "_position-right-center_1u8dn_198",
+  "position-right-bottom": "_position-right-bottom_1u8dn_204",
+  "animated-opening": "_animated-opening_1u8dn_210",
+  "animated-opening-opacity": "_animated-opening-opacity_1u8dn_1",
+  "animated-opening-translate": "_animated-opening-translate_1u8dn_1",
+  "animated-closing": "_animated-closing_1u8dn_216",
+  "animated-closing-opacity": "_animated-closing-opacity_1u8dn_1",
+  "animated-closing-translate": "_animated-closing-translate_1u8dn_1"
+}, C = D(void 0), L = () => N(C), $ = () => {
+  const d = L();
+  if (!d)
+    throw new Error("useDialogContext must be used within DialogProvider");
+  return d;
+}, q = ({ header: d, children: c, footer: u }) => /* @__PURE__ */ m("div", { className: e["dialog-compose"], children: [
+  /* @__PURE__ */ l("div", { className: e["dialog-close"], children: /* @__PURE__ */ l("div", { className: e["dialog-close-cross"] }) }),
+  /* @__PURE__ */ m("div", { className: e["dialog-window"], onClick: (p) => p.stopPropagation(), children: [
+    d && /* @__PURE__ */ l("div", { className: e["dialog-window-header"], children: d }),
+    c && /* @__PURE__ */ l("div", { className: e["dialog-window-body"], children: c }),
+    u && /* @__PURE__ */ l("div", { className: e["dialog-window-footer"], children: u })
+  ] })
+] }), z = ({
+  children: d,
+  ...c
+}) => {
+  const [u, p] = f(!1), [i, r] = f([]), y = x(0), h = w((o, n) => {
+    r((t) => {
+      if (t.length > 0) {
+        const a = [...t], v = a.length - 1;
+        if (a[v].status === s.Opening)
+          return t;
+      }
+      return [...t, { id: ++y.current, status: s.Opening, node: o, options: n }];
+    });
+  }, []), g = w((o) => {
+    r((n) => {
+      if (n.length === 0)
+        return n;
+      const t = [...n], a = t.length - 1;
+      return t[a].status === s.Closing || (o?.esc || o?.outside) && t[a]?.options?.unClosable ? n : (t[a] = { ...t[a], status: s.Closing }, t);
+    });
+  }, []);
+  _(() => {
+    if (i.length) {
+      const o = i[i.length - 1];
+      o.status === s.Opening && (o?.options?.onOpen && o.options.onOpen(), setTimeout(() => {
+        r((n) => {
+          const t = [...n];
+          return t[t.length - 1].status = s.Opened, t;
+        }), o?.options?.onOpened && o.options.onOpened();
+      }, 240)), o.status === s.Closing && (o?.options?.onClose && o.options.onClose(), setTimeout(() => {
+        r((n) => n.slice(0, -1)), o?.options?.onClosed && o.options.onClosed();
+      }, 240));
+    }
+  }, [i]), _(() => {
+    document.body.style.overflowY = i.length ? "hidden" : "";
+  }, [i]), _(() => {
+    const o = (a) => {
+      a.key === "Escape" && (a.stopPropagation(), g({ esc: !0 }));
+    }, n = () => {
+      document.addEventListener("keydown", o);
+    }, t = () => {
+      document.removeEventListener("keydown", o);
+    };
+    return n(), () => {
+      t();
+    };
+  }, []), _(() => {
+    p(!0);
+  });
+  const b = O(
+    () => ({ openDialog: h, closeDialog: g, queue: i, providerProps: c }),
+    [h, g, i, c]
+  );
+  return /* @__PURE__ */ m(C.Provider, { value: b, children: [
+    d,
+    u && k(
+      /* @__PURE__ */ l("div", { id: "paciu-ui-dialogs", children: i.map((o, n) => /* @__PURE__ */ l(
+        "div",
+        {
+          className: P(e["dialog-overlay"], {
+            [e["animated-opening"]]: [s.Opening, s.Opened].includes(
+              o.status
+            ),
+            [e["animated-closing"]]: [s.Closing, s.Closed].includes(
+              o.status
+            ),
+            [e.active]: n === i.length - 1,
+            [e["full-height"]]: o?.options?.fullHeight,
+            [e["full-width"]]: o?.options?.fullWidth,
+            [e["un-closable"]]: o?.options?.unClosable,
+            [e[`position-${o?.options?.position || c?.defaultPosition || E.Center}`]]: !0
+          }),
+          onClick: () => g({ outside: !0 }),
+          style: {
+            zIndex: n + 1e3,
+            transform: `scale(calc(1 - ${(i.length - n - 1) * 0.02}))`
+          },
+          children: o.node()
+        },
+        o.id
+      )) }),
+      document.body
+    )
+  ] });
+};
+export {
+  q as Dialog,
+  C as DialogContext,
+  z as DialogProvider,
+  $ as useDialog,
+  L as useDialogContext
+};

package/dist/index-CbbUQvJ6.js

@@ -0,0 +1,19 @@
+function p(r) {
+  var n, e, t = "";
+  if (typeof r == "string" || typeof r == "number") t += r;
+  else if (typeof r == "object") if (Array.isArray(r)) {
+    var f = r.length;
+    for (n = 0; n < f; n++) r[n] && (e = p(r[n])) && (t && (t += " "), t += e);
+  } else for (e in r) r[e] && (t && (t += " "), t += e);
+  return t;
+}
+function o() {
+  for (var r, n, e = 0, t = "", f = arguments.length; e < f; e++) (r = arguments[e]) && (n = p(r)) && (t && (t += " "), t += n);
+  return t;
+}
+var c = /* @__PURE__ */ ((r) => (r.Opening = "opening", r.Opened = "opened", r.Closing = "closing", r.Closed = "closed", r))(c || {}), h = /* @__PURE__ */ ((r) => (r.TopCenter = "top-center", r.Center = "center", r.BottomCenter = "bottom-center", r.LeftTop = "left-top", r.LeftCenter = "left-center", r.LeftBottom = "left-bottom", r.RightTop = "right-top", r.RightCenter = "right-center", r.RightBottom = "right-bottom", r))(h || {});
+export {
+  h as D,
+  c as a,
+  o as c
+};

package/dist/index.d.ts

@@ -4,6 +4,8 @@ import { default as default_2 } from 'react';
 export declare const Button: default_2.ForwardRefExoticComponent<ButtonProps & default_2.RefAttributes<HTMLButtonElement>>;
 
 declare interface ButtonProps extends Omit<default_2.ButtonHTMLAttributes<HTMLButtonElement>, 'color'>, Modifiers {
+    stopPropagation?: boolean;
+    stopImmediatePropagation?: boolean;
 }
 
 export declare const Card: default_2.ForwardRefExoticComponent<CardProps & default_2.RefAttributes<HTMLDivElement>>;
@@ -13,6 +15,25 @@ declare interface CardProps extends default_2.HTMLAttributes<HTMLDivElement>, Pi
 
 export declare type ColorType = 'opposite' | 'accent' | 'error';
 
+export declare enum DialogPosition {
+    TopCenter = "top-center",
+    Center = "center",
+    BottomCenter = "bottom-center",
+    LeftTop = "left-top",
+    LeftCenter = "left-center",
+    LeftBottom = "left-bottom",
+    RightTop = "right-top",
+    RightCenter = "right-center",
+    RightBottom = "right-bottom"
+}
+
+export declare enum DialogQueueItemStatus {
+    Opening = "opening",
+    Opened = "opened",
+    Closing = "closing",
+    Closed = "closed"
+}
+
 export declare const Flex: default_2.ForwardRefExoticComponent<FlexProps & default_2.RefAttributes<HTMLDivElement>>;
 
 declare interface FlexProps extends default_2.HTMLAttributes<HTMLDivElement> {

package/dist/index.es.js

@@ -1,5 +1,7 @@
-import { jsx as d } from "react/jsx-runtime";
-import c, { useState as j, useEffect as y, useRef as P } from "react";
+import { jsx as u } from "react/jsx-runtime";
+import c, { useState as N, useEffect as g, useRef as I } from "react";
+import { c as m } from "./index-CbbUQvJ6.js";
+import { D as M, a as T } from "./index-CbbUQvJ6.js";
 import './index.css';const n = {
   "paciu-ui-button": "_paciu-ui-button_y249s_14",
   "size-micro": "_size-micro_y249s_23",
@@ -19,72 +21,60 @@ import './index.css';const n = {
   "color-opposite": "_color-opposite_y249s_139",
   "color-accent": "_color-accent_y249s_207",
   "color-error": "_color-error_y249s_275"
-};
-function N(s) {
-  var r, i, e = "";
-  if (typeof s == "string" || typeof s == "number") e += s;
-  else if (typeof s == "object") if (Array.isArray(s)) {
-    var o = s.length;
-    for (r = 0; r < o; r++) s[r] && (i = N(s[r])) && (e && (e += " "), e += i);
-  } else for (i in s) s[i] && (e && (e += " "), e += i);
-  return e;
-}
-function m() {
-  for (var s, r, i = 0, e = "", o = arguments.length; i < o; i++) (s = arguments[i]) && (r = N(s)) && (e && (e += " "), e += r);
-  return e;
-}
-const L = c.forwardRef((s, r) => {
+}, L = c.forwardRef((i, e) => {
   const {
-    children: i,
-    className: e,
-    color: o,
+    children: s,
+    className: o,
+    color: r,
     square: _,
-    loading: a,
-    link: l,
-    soft: u,
+    loading: t,
+    link: d,
+    soft: l,
     solid: f,
-    outline: z,
+    outline: p,
     // opaque,
-    rounded: p,
-    size: g,
-    onClick: w,
-    ...$
-  } = s, [x, k] = j(!1), E = async (R) => {
-    if (w) {
-      const h = w(R);
-      if (h instanceof Promise) {
-        k(!0);
+    rounded: z,
+    size: w,
+    onClick: k,
+    stopPropagation: P,
+    stopImmediatePropagation: $,
+    ...x
+  } = i, [E, h] = N(!1), R = async (y) => {
+    if (P && y?.stopPropagation(), $ && y?.nativeEvent?.stopImmediatePropagation(), k) {
+      const b = k(y);
+      if (b instanceof Promise) {
+        h(!0);
         try {
-          await h;
+          await b;
         } finally {
-          k(!1);
+          h(!1);
         }
       }
     }
   };
-  return /* @__PURE__ */ d(
+  return /* @__PURE__ */ u(
     "button",
     {
-      ref: r,
+      ref: e,
       className: m(
         n["paciu-ui-button"],
         {
           // [ styles.opaque ]: opaque,
-          [n["modifier-loading"]]: x || a,
-          [n["modifier-rounded"]]: p,
+          [n["modifier-loading"]]: E || t,
+          [n["modifier-rounded"]]: z,
           [n["modifier-square"]]: _,
-          [n["modifier-link"]]: l,
-          [n["modifier-soft"]]: u,
-          [n["modifier-outline"]]: z,
+          [n["modifier-link"]]: d,
+          [n["modifier-soft"]]: l,
+          [n["modifier-outline"]]: p,
           [n["modifier-solid"]]: f,
-          ...o && { [n[`color-${o}`]]: o }
+          ...r && { [n[`color-${r}`]]: r }
         },
-        g && n[`size-${g}`],
-        e
+        w && n[`size-${w}`],
+        o
       ),
-      onClick: E,
-      ...$,
-      children: i
+      onClick: R,
+      ...x,
+      children: s
     }
   );
 });
@@ -98,15 +88,15 @@ const v = {
   "size-huge": "_size-huge_kd3dr_39",
   "size-enormous": "_size-enormous_kd3dr_43",
   "paciu-ui-blink-animation": "_paciu-ui-blink-animation_kd3dr_1"
-}, C = c.forwardRef((s, r) => {
-  const { className: i, size: e, children: o, ..._ } = s;
-  return /* @__PURE__ */ d("div", { ref: r, className: m(v["paciu-ui-row"], e && v[`size-${e}`], i), ..._, children: o });
+}, S = c.forwardRef((i, e) => {
+  const { className: s, size: o, children: r, ..._ } = i;
+  return /* @__PURE__ */ u("div", { ref: e, className: m(v["paciu-ui-row"], o && v[`size-${o}`], s), ..._, children: r });
 });
-C.displayName = "Row";
-const S = "_flex_ssd0s_14", q = "_inline_ssd0s_22", I = "_grow_ssd0s_25", t = {
-  flex: S,
+S.displayName = "Row";
+const C = "_flex_ssd0s_14", q = "_inline_ssd0s_22", D = "_grow_ssd0s_25", a = {
+  flex: C,
   inline: q,
-  grow: I,
+  grow: D,
   "direction-column": "_direction-column_ssd0s_28",
   "direction-row-reverse": "_direction-row-reverse_ssd0s_31",
   "direction-column-reverse": "_direction-column-reverse_ssd0s_34",
@@ -129,32 +119,32 @@ const S = "_flex_ssd0s_14", q = "_inline_ssd0s_22", I = "_grow_ssd0s_25", t = {
   "size-huge": "_size-huge_ssd0s_95",
   "size-enormous": "_size-enormous_ssd0s_99",
   "paciu-ui-blink-animation": "_paciu-ui-blink-animation_ssd0s_1"
-}, A = c.forwardRef((s, r) => {
-  const { children: i, className: e, direction: o, align: _, justify: a, wrap: l, size: u, inline: f, grow: z, ...p } = s;
-  return /* @__PURE__ */ d(
+}, B = c.forwardRef((i, e) => {
+  const { children: s, className: o, direction: r, align: _, justify: t, wrap: d, size: l, inline: f, grow: p, ...z } = i;
+  return /* @__PURE__ */ u(
     "div",
     {
-      ref: r,
+      ref: e,
       className: m(
-        t.flex,
+        a.flex,
         {
-          [t.inline]: f,
-          [t.grow]: z,
-          [t[`direction-${o}`]]: o,
-          [t[`align-${_}`]]: _,
-          [t[`justify-${a}`]]: a,
-          [t[`wrap-${l}`]]: l
+          [a.inline]: f,
+          [a.grow]: p,
+          [a[`direction-${r}`]]: r,
+          [a[`align-${_}`]]: _,
+          [a[`justify-${t}`]]: t,
+          [a[`wrap-${d}`]]: d
         },
-        u && t[`size-${u}`],
-        e
+        l && a[`size-${l}`],
+        o
       ),
-      ...p,
-      children: i
+      ...z,
+      children: s
     }
   );
 });
-A.displayName = "Flex";
-const b = {
+B.displayName = "Flex";
+const j = {
   "paciu-ui-card": "_paciu-ui-card_a6huo_14",
   "size-micro": "_size-micro_a6huo_28",
   "size-mini": "_size-mini_a6huo_33",
@@ -163,42 +153,44 @@ const b = {
   "size-huge": "_size-huge_a6huo_48",
   "size-enormous": "_size-enormous_a6huo_53",
   "paciu-ui-blink-animation": "_paciu-ui-blink-animation_a6huo_1"
-}, B = c.forwardRef((s, r) => {
-  const { children: i, className: e, size: o, ..._ } = s;
-  return /* @__PURE__ */ d("div", { ref: r, className: m(b["paciu-ui-card"], o && b[`size-${o}`], e), ..._, children: i });
+}, F = c.forwardRef((i, e) => {
+  const { children: s, className: o, size: r, ..._ } = i;
+  return /* @__PURE__ */ u("div", { ref: e, className: m(j["paciu-ui-card"], r && j[`size-${r}`], o), ..._, children: s });
 });
-B.displayName = "Card";
-const O = (s) => {
-  y(() => {
-    const r = (i) => {
-      i.key === "Escape" && (i.preventDefault(), i.stopPropagation(), i.stopImmediatePropagation(), s());
+F.displayName = "Card";
+const A = (i) => {
+  g(() => {
+    const e = (s) => {
+      s.key === "Escape" && (s.preventDefault(), s.stopPropagation(), s.stopImmediatePropagation(), i());
     };
-    return document.addEventListener("keydown", r, !0), () => document.removeEventListener("keydown", r, !0);
-  }, [s]);
-}, Y = (s, r = [], i) => {
-  const e = P(i?.count || 1);
-  y(() => {
-    if (e.current > 0) {
-      e.current--;
+    return document.addEventListener("keydown", e, !0), () => document.removeEventListener("keydown", e, !0);
+  }, [i]);
+}, G = (i, e = [], s) => {
+  const o = I(s?.count || 1);
+  g(() => {
+    if (o.current > 0) {
+      o.current--;
       return;
     }
-    return s();
-  }, r);
-}, G = () => {
-  const [s, r] = j(!1);
-  return y(() => {
-    const i = () => r(window.scrollY > 0);
-    return i(), document.addEventListener("scroll", i), () => {
-      document.removeEventListener("scroll", i);
+    return i();
+  }, e);
+}, H = () => {
+  const [i, e] = N(!1);
+  return g(() => {
+    const s = () => e(window.scrollY > 0);
+    return s(), document.addEventListener("scroll", s), () => {
+      document.removeEventListener("scroll", s);
     };
-  }, []), { isScrolled: s };
+  }, []), { isScrolled: i };
 };
 export {
   L as Button,
-  B as Card,
-  A as Flex,
-  C as Row,
-  O as useEscape,
-  G as useScroll,
-  Y as useSkipEffect
+  F as Card,
+  M as DialogPosition,
+  T as DialogQueueItemStatus,
+  B as Flex,
+  S as Row,
+  A as useEscape,
+  H as useScroll,
+  G as useSkipEffect
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@paciu/ui",
-  "version": "0.0.47",
+  "version": "0.0.49",
   "type": "module",
   "main": "./dist/index.umd.js",
   "module": "./dist/index.es.js",
@@ -13,6 +13,10 @@
     "./theme": {
       "types": "./dist/theme.d.ts",
       "import": "./dist/theme.es.js"
+    },
+    "./dialog": {
+      "types": "./dist/dialog.d.ts",
+      "import": "./dist/dialog.es.js"
     }
   },
   "files": [

package/readme.md

@@ -2,9 +2,4 @@
 
 ```
 $ npm i @paciu/ui
-```
-
-```typescript
-import { Button, Row, useEscape } from '@paciu/ui'
-import type { ColorType } from '@paciu/ui'
 ```