@paciu/ui 0.0.59 → 0.0.61
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chunks/index.es.js +45 -45
- package/dist/index2.css +1 -1
- package/dist/provider.es.js +40 -40
- package/package.json +1 -1
package/dist/chunks/index.es.js
CHANGED
|
@@ -1,51 +1,51 @@
|
|
|
1
|
-
import '../index2.css';function
|
|
2
|
-
var n, i,
|
|
3
|
-
if (typeof
|
|
4
|
-
else if (typeof
|
|
5
|
-
var e =
|
|
6
|
-
for (n = 0; n < e; n++)
|
|
7
|
-
} else for (i in
|
|
8
|
-
return
|
|
1
|
+
import '../index2.css';function _(o) {
|
|
2
|
+
var n, i, t = "";
|
|
3
|
+
if (typeof o == "string" || typeof o == "number") t += o;
|
|
4
|
+
else if (typeof o == "object") if (Array.isArray(o)) {
|
|
5
|
+
var e = o.length;
|
|
6
|
+
for (n = 0; n < e; n++) o[n] && (i = _(o[n])) && (t && (t += " "), t += i);
|
|
7
|
+
} else for (i in o) o[i] && (t && (t += " "), t += i);
|
|
8
|
+
return t;
|
|
9
9
|
}
|
|
10
|
-
function
|
|
11
|
-
for (var
|
|
12
|
-
return
|
|
10
|
+
function s() {
|
|
11
|
+
for (var o, n, i = 0, t = "", e = arguments.length; i < e; i++) (o = arguments[i]) && (n = _(o)) && (t && (t += " "), t += n);
|
|
12
|
+
return t;
|
|
13
13
|
}
|
|
14
|
-
const
|
|
15
|
-
"dialog-overlay": "_dialog-
|
|
16
|
-
"dialog-compose": "_dialog-
|
|
17
|
-
"dialog-close": "_dialog-
|
|
18
|
-
"dialog-close-cross": "_dialog-close-
|
|
19
|
-
"dialog-window": "_dialog-
|
|
20
|
-
"dialog-window-header": "_dialog-window-
|
|
21
|
-
"dialog-window-body": "_dialog-window-
|
|
22
|
-
"dialog-window-footer": "_dialog-window-
|
|
23
|
-
"full-height": "_full-
|
|
24
|
-
"full-width": "_full-
|
|
25
|
-
"un-closable": "_un-
|
|
26
|
-
active:
|
|
27
|
-
"position-top-center": "_position-top-
|
|
28
|
-
"position-center": "_position-
|
|
29
|
-
"position-bottom-center": "_position-bottom-
|
|
30
|
-
"position-left-top": "_position-left-
|
|
31
|
-
"position-left-center": "_position-left-
|
|
32
|
-
"position-left-bottom": "_position-left-
|
|
33
|
-
"position-right-top": "_position-right-
|
|
34
|
-
"position-right-center": "_position-right-
|
|
35
|
-
"position-right-bottom": "_position-right-
|
|
36
|
-
"animated-opening": "_animated-
|
|
37
|
-
"animated-opening-opacity": "_animated-opening-
|
|
38
|
-
"animated-opening-translate": "_animated-opening-
|
|
39
|
-
"animated-closing": "_animated-
|
|
40
|
-
"animated-closing-opacity": "_animated-closing-
|
|
41
|
-
"animated-closing-translate": "_animated-closing-
|
|
42
|
-
"paciu-ui-blink-animation": "_paciu-ui-blink-
|
|
14
|
+
const d = "_active_od012_164", p = {
|
|
15
|
+
"dialog-overlay": "_dialog-overlay_od012_45",
|
|
16
|
+
"dialog-compose": "_dialog-compose_od012_62",
|
|
17
|
+
"dialog-close": "_dialog-close_od012_68",
|
|
18
|
+
"dialog-close-cross": "_dialog-close-cross_od012_85",
|
|
19
|
+
"dialog-window": "_dialog-window_od012_109",
|
|
20
|
+
"dialog-window-header": "_dialog-window-header_od012_123",
|
|
21
|
+
"dialog-window-body": "_dialog-window-body_od012_136",
|
|
22
|
+
"dialog-window-footer": "_dialog-window-footer_od012_142",
|
|
23
|
+
"full-height": "_full-height_od012_155",
|
|
24
|
+
"full-width": "_full-width_od012_158",
|
|
25
|
+
"un-closable": "_un-closable_od012_161",
|
|
26
|
+
active: d,
|
|
27
|
+
"position-top-center": "_position-top-center_od012_170",
|
|
28
|
+
"position-center": "_position-center_od012_176",
|
|
29
|
+
"position-bottom-center": "_position-bottom-center_od012_180",
|
|
30
|
+
"position-left-top": "_position-left-top_od012_186",
|
|
31
|
+
"position-left-center": "_position-left-center_od012_192",
|
|
32
|
+
"position-left-bottom": "_position-left-bottom_od012_198",
|
|
33
|
+
"position-right-top": "_position-right-top_od012_204",
|
|
34
|
+
"position-right-center": "_position-right-center_od012_210",
|
|
35
|
+
"position-right-bottom": "_position-right-bottom_od012_216",
|
|
36
|
+
"animated-opening": "_animated-opening_od012_222",
|
|
37
|
+
"animated-opening-opacity": "_animated-opening-opacity_od012_1",
|
|
38
|
+
"animated-opening-translate": "_animated-opening-translate_od012_1",
|
|
39
|
+
"animated-closing": "_animated-closing_od012_228",
|
|
40
|
+
"animated-closing-opacity": "_animated-closing-opacity_od012_1",
|
|
41
|
+
"animated-closing-translate": "_animated-closing-translate_od012_1",
|
|
42
|
+
"paciu-ui-blink-animation": "_paciu-ui-blink-animation_od012_1"
|
|
43
43
|
};
|
|
44
|
-
var
|
|
44
|
+
var r = /* @__PURE__ */ ((o) => (o.Light = "light", o.Dark = "dark", o.System = "system", o))(r || {}), a = /* @__PURE__ */ ((o) => (o.Opening = "opening", o.Opened = "opened", o.Closing = "closing", o.Closed = "closed", o))(a || {}), l = /* @__PURE__ */ ((o) => (o.TopCenter = "top-center", o.Center = "center", o.BottomCenter = "bottom-center", o.LeftTop = "left-top", o.LeftCenter = "left-center", o.LeftBottom = "left-bottom", o.RightTop = "right-top", o.RightCenter = "right-center", o.RightBottom = "right-bottom", o))(l || {});
|
|
45
45
|
export {
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
46
|
+
l as D,
|
|
47
|
+
r as T,
|
|
48
|
+
a,
|
|
49
|
+
s as c,
|
|
50
50
|
p as s
|
|
51
51
|
};
|
package/dist/index2.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@keyframes _paciu-ui-blink-
|
|
1
|
+
@keyframes _paciu-ui-blink-animation_od012_1{0%{opacity:1}50%{opacity:.32}to{opacity:1}}@keyframes _animated-opening-translate_od012_1{0%{transform:translate(var(--animated-from-x, 0),var(--animated-from-y, 0))}to{transform:translate(0)}}@keyframes _animated-opening-opacity_od012_1{0%{opacity:0}to{opacity:1}}@keyframes _animated-closing-translate_od012_1{0%{transform:translate(0)}to{transform:translate(var(--animated-from-x, 0),var(--animated-from-y, 0))}}@keyframes _animated-closing-opacity_od012_1{0%{opacity:1}to{opacity:0}}._dialog-overlay_od012_45{--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_od012_45 ._dialog-compose_od012_62{position:relative;max-height:100%;width:100%;max-width:var(--window-width)}._dialog-overlay_od012_45 ._dialog-compose_od012_62 ._dialog-close_od012_68{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_od012_45 ._dialog-compose_od012_62 ._dialog-close_od012_68 ._dialog-close-cross_od012_85{position:relative;width:16px;height:16px;cursor:pointer}._dialog-overlay_od012_45 ._dialog-compose_od012_62 ._dialog-close_od012_68 ._dialog-close-cross_od012_85:before,._dialog-overlay_od012_45 ._dialog-compose_od012_62 ._dialog-close_od012_68 ._dialog-close-cross_od012_85: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_od012_45 ._dialog-compose_od012_62 ._dialog-close_od012_68 ._dialog-close-cross_od012_85:before{transform:translateY(-50%) rotate(45deg)}._dialog-overlay_od012_45 ._dialog-compose_od012_62 ._dialog-close_od012_68 ._dialog-close-cross_od012_85:after{transform:translateY(-50%) rotate(-45deg)}._dialog-overlay_od012_45 ._dialog-compose_od012_62 ._dialog-window_od012_109{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_od012_45 ._dialog-compose_od012_62 ._dialog-window_od012_109 ._dialog-window-header_od012_123{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_od012_45 ._dialog-compose_od012_62 ._dialog-window_od012_109 ._dialog-window-body_od012_136{flex-grow:1;padding:12px;position:relative;z-index:0}._dialog-overlay_od012_45 ._dialog-compose_od012_62 ._dialog-window_od012_109 ._dialog-window-footer_od012_142{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_od012_45._full-height_od012_155 ._dialog-compose_od012_62{height:100%}._dialog-overlay_od012_45._full-width_od012_158 ._dialog-compose_od012_62{max-width:unset}._dialog-overlay_od012_45._un-closable_od012_161 ._dialog-compose_od012_62 ._dialog-close_od012_68{display:none}._dialog-overlay_od012_45._active_od012_164 ._dialog-compose_od012_62 ._dialog-close_od012_68{opacity:1}._dialog-overlay_od012_45._active_od012_164 ._dialog-compose_od012_62 ._dialog-window_od012_109{filter:unset}._dialog-overlay_od012_45._position-top-center_od012_170{--animated-from-x: 0;--animated-from-y: -24px;justify-content:start;align-items:center}._dialog-overlay_od012_45._position-center_od012_176{justify-content:center;align-items:center}._dialog-overlay_od012_45._position-bottom-center_od012_180{--animated-from-x: 0;--animated-from-y: 24px;justify-content:end;align-items:center}._dialog-overlay_od012_45._position-left-top_od012_186{--animated-from-x: -24px;--animated-from-y: -24px;justify-content:start;align-items:start}._dialog-overlay_od012_45._position-left-center_od012_192{--animated-from-x: -24px;--animated-from-y: 0;justify-content:center;align-items:start}._dialog-overlay_od012_45._position-left-bottom_od012_198{--animated-from-x: -24px;--animated-from-y: 24px;justify-content:end;align-items:start}._dialog-overlay_od012_45._position-right-top_od012_204{--animated-from-x: 24px;--animated-from-y: -24px;justify-content:start;align-items:end}._dialog-overlay_od012_45._position-right-center_od012_210{--animated-from-x: 24px;--animated-from-y: 0;justify-content:center;align-items:end}._dialog-overlay_od012_45._position-right-bottom_od012_216{--animated-from-x: 24px;--animated-from-y: 24px;justify-content:end;align-items:end}._dialog-overlay_od012_45._animated-opening_od012_222{animation:_animated-opening-opacity_od012_1 .24s linear forwards}._dialog-overlay_od012_45._animated-opening_od012_222 ._dialog-compose_od012_62{animation:_animated-opening-translate_od012_1 .24s linear forwards}._dialog-overlay_od012_45._animated-closing_od012_228{animation:_animated-closing-opacity_od012_1 .24s linear forwards}._dialog-overlay_od012_45._animated-closing_od012_228 ._dialog-compose_od012_62{animation:_animated-closing-translate_od012_1 .24s linear forwards}
|
package/dist/provider.es.js
CHANGED
|
@@ -1,54 +1,54 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsxs as S, jsx as x } from "react/jsx-runtime";
|
|
3
|
-
import { createContext as M, useState as m, useRef as j, useCallback as p, useMemo as
|
|
3
|
+
import { createContext as M, useState as m, useRef as j, useCallback as p, useMemo as O, useEffect as u, useContext as Q } from "react";
|
|
4
4
|
import { createPortal as $ } from "react-dom";
|
|
5
|
-
import { a as
|
|
6
|
-
const
|
|
7
|
-
const [T, D] = m(!1), [r, L] = m(f || null), [d, k] = m(f || null), [
|
|
5
|
+
import { a as o, T as a, D as z, c as B, s as l } from "./chunks/index.es.js";
|
|
6
|
+
const v = M(void 0), H = () => Q(v), Y = ({ children: c, initialTheme: f, defaultDialogPosition: w }) => {
|
|
7
|
+
const [T, D] = m(!1), [r, L] = m(f || null), [d, k] = m(f || null), [s, g] = m([]), E = j(0), C = p((e) => {
|
|
8
8
|
document.documentElement.dataset.theme = e || void 0, L(e);
|
|
9
9
|
}, []), y = p((e, n) => {
|
|
10
10
|
g((t) => {
|
|
11
11
|
if (t.length > 0) {
|
|
12
12
|
const i = [...t], I = i.length - 1;
|
|
13
|
-
if (i[I].status
|
|
13
|
+
if ([o.Closing, o.Opening].includes(i[I].status))
|
|
14
14
|
return t;
|
|
15
15
|
}
|
|
16
|
-
return [...t, { id: ++E.current, status:
|
|
16
|
+
return [...t, { id: ++E.current, status: o.Opening, node: e, options: n }];
|
|
17
17
|
});
|
|
18
18
|
}, []), h = p((e) => {
|
|
19
19
|
g((n) => {
|
|
20
20
|
if (n.length === 0)
|
|
21
21
|
return n;
|
|
22
22
|
const t = [...n], i = t.length - 1;
|
|
23
|
-
return t[i].status
|
|
23
|
+
return [o.Closing, o.Opening].includes(t[i].status) || (e?.esc || e?.outside) && t[i]?.options?.unClosable ? n : (t[i] = { ...t[i], status: o.Closing }, t);
|
|
24
24
|
});
|
|
25
|
-
}, []), P =
|
|
25
|
+
}, []), P = O(() => {
|
|
26
26
|
const e = r || d;
|
|
27
|
-
return e ? e ===
|
|
28
|
-
}, [r, d]), b =
|
|
29
|
-
() => ({ theme: r, nextTheme: P, systemTheme: d, toggleTheme: C, openDialog: y, closeDialog: h, dialogsQueue:
|
|
30
|
-
[r, P, d, C, y, h,
|
|
27
|
+
return e ? e === a.Light ? a.Dark : a.Light : null;
|
|
28
|
+
}, [r, d]), b = O(
|
|
29
|
+
() => ({ theme: r, nextTheme: P, systemTheme: d, toggleTheme: C, openDialog: y, closeDialog: h, dialogsQueue: s }),
|
|
30
|
+
[r, P, d, C, y, h, s]
|
|
31
31
|
);
|
|
32
|
-
return
|
|
33
|
-
if (
|
|
34
|
-
const e =
|
|
35
|
-
e.status ===
|
|
32
|
+
return u(() => {
|
|
33
|
+
if (s.length) {
|
|
34
|
+
const e = s[s.length - 1];
|
|
35
|
+
e.status === o.Opening && (e?.options?.onOpen && e.options.onOpen(), setTimeout(() => {
|
|
36
36
|
g((n) => {
|
|
37
37
|
const t = [...n];
|
|
38
|
-
return t[t.length - 1].status =
|
|
38
|
+
return t[t.length - 1].status = o.Opened, t;
|
|
39
39
|
}), e?.options?.onOpened && e.options.onOpened();
|
|
40
|
-
}, 240)), e.status ===
|
|
40
|
+
}, 240)), e.status === o.Closing && (e?.options?.onClose && e.options.onClose(), setTimeout(() => {
|
|
41
41
|
g((n) => n.slice(0, -1)), e?.options?.onClosed && e.options.onClosed();
|
|
42
42
|
}, 240));
|
|
43
43
|
}
|
|
44
|
-
}, [
|
|
44
|
+
}, [s]), u(() => {
|
|
45
45
|
const e = window.matchMedia("(prefers-color-scheme: dark)"), n = (t) => {
|
|
46
|
-
k(t.matches ?
|
|
46
|
+
k(t.matches ? a.Dark : a.Light);
|
|
47
47
|
};
|
|
48
48
|
return n(e), e.addEventListener("change", n), () => e.removeEventListener("change", n);
|
|
49
|
-
}, []),
|
|
50
|
-
document.body.style.overflowY =
|
|
51
|
-
}, [
|
|
49
|
+
}, []), u(() => {
|
|
50
|
+
document.body.style.overflowY = s.length ? "hidden" : "";
|
|
51
|
+
}, [s]), u(() => {
|
|
52
52
|
const e = (i) => {
|
|
53
53
|
i.key === "Escape" && (i.stopPropagation(), h({ esc: !0 }));
|
|
54
54
|
}, n = () => {
|
|
@@ -59,35 +59,35 @@ const w = M(void 0), H = () => Q(w), Y = ({ children: c, initialTheme: f, defaul
|
|
|
59
59
|
return n(), () => {
|
|
60
60
|
t();
|
|
61
61
|
};
|
|
62
|
-
}, []),
|
|
62
|
+
}, []), u(() => {
|
|
63
63
|
D(!0);
|
|
64
|
-
}), /* @__PURE__ */ S(
|
|
64
|
+
}), /* @__PURE__ */ S(v.Provider, { value: b, children: [
|
|
65
65
|
c,
|
|
66
66
|
T && $(
|
|
67
|
-
/* @__PURE__ */ x("div", { id: "paciu-ui-dialogs", children:
|
|
68
|
-
const t = e?.options?.position ||
|
|
67
|
+
/* @__PURE__ */ x("div", { id: "paciu-ui-dialogs", children: s.map((e, n) => {
|
|
68
|
+
const t = e?.options?.position || w || z.Center;
|
|
69
69
|
return /* @__PURE__ */ x(
|
|
70
70
|
"div",
|
|
71
71
|
{
|
|
72
|
-
className: B(
|
|
73
|
-
[
|
|
74
|
-
|
|
75
|
-
|
|
72
|
+
className: B(l["dialog-overlay"], {
|
|
73
|
+
[l["animated-opening"]]: [
|
|
74
|
+
o.Opening,
|
|
75
|
+
o.Opened
|
|
76
76
|
].includes(e.status),
|
|
77
|
-
[
|
|
78
|
-
|
|
79
|
-
|
|
77
|
+
[l["animated-closing"]]: [
|
|
78
|
+
o.Closing,
|
|
79
|
+
o.Closed
|
|
80
80
|
].includes(e.status),
|
|
81
|
-
[
|
|
82
|
-
[
|
|
83
|
-
[
|
|
84
|
-
[
|
|
85
|
-
[
|
|
81
|
+
[l.active]: n === s.length - 1,
|
|
82
|
+
[l["full-height"]]: e?.options?.fullHeight,
|
|
83
|
+
[l["full-width"]]: e?.options?.fullWidth,
|
|
84
|
+
[l["un-closable"]]: e?.options?.unClosable,
|
|
85
|
+
[l[`position-${t}`]]: !!t
|
|
86
86
|
}),
|
|
87
87
|
onClick: () => h({ outside: !0 }),
|
|
88
88
|
style: {
|
|
89
89
|
zIndex: n + 1e3,
|
|
90
|
-
transform: `scale(calc(1 - ${(
|
|
90
|
+
transform: `scale(calc(1 - ${(s.length - n - 1) * 0.02}))`
|
|
91
91
|
},
|
|
92
92
|
children: e.node()
|
|
93
93
|
},
|