asterui 0.12.0 → 0.12.1
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/README.md +1 -1
- package/dist/components/Form.d.ts +27 -2
- package/dist/components/Radio.d.ts +7 -1
- package/dist/components/Status.d.ts +18 -0
- package/dist/index.d.ts +4 -2
- package/dist/index.js +61 -59
- package/dist/index.js.map +1 -1
- package/dist/index100.js +7 -12
- package/dist/index100.js.map +1 -1
- package/dist/index101.js +11 -29
- package/dist/index101.js.map +1 -1
- package/dist/index102.js +29 -16
- package/dist/index102.js.map +1 -1
- package/dist/index103.js +17 -10792
- package/dist/index103.js.map +1 -1
- package/dist/index104.js +10793 -5
- package/dist/index104.js.map +1 -1
- package/dist/index105.js +5 -42
- package/dist/index105.js.map +1 -1
- package/dist/index106.js +42 -2
- package/dist/index106.js.map +1 -1
- package/dist/index107.js +2 -7
- package/dist/index107.js.map +1 -1
- package/dist/index108.js +6 -151
- package/dist/index108.js.map +1 -1
- package/dist/index109.js +147 -25
- package/dist/index109.js.map +1 -1
- package/dist/index110.js +28 -28
- package/dist/index110.js.map +1 -1
- package/dist/index111.js +30 -2
- package/dist/index111.js.map +1 -1
- package/dist/index112.js +2 -72
- package/dist/index112.js.map +1 -1
- package/dist/index113.js +71 -38
- package/dist/index113.js.map +1 -1
- package/dist/index114.js +37 -24
- package/dist/index114.js.map +1 -1
- package/dist/index115.js +24 -19
- package/dist/index115.js.map +1 -1
- package/dist/index116.js +20 -23
- package/dist/index116.js.map +1 -1
- package/dist/index117.js +23 -19
- package/dist/index117.js.map +1 -1
- package/dist/index118.js +19 -99
- package/dist/index118.js.map +1 -1
- package/dist/index119.js +98 -358
- package/dist/index119.js.map +1 -1
- package/dist/index120.js +358 -23
- package/dist/index120.js.map +1 -1
- package/dist/index121.js +23 -71
- package/dist/index121.js.map +1 -1
- package/dist/index122.js +72 -15
- package/dist/index122.js.map +1 -1
- package/dist/index123.js +15 -65
- package/dist/index123.js.map +1 -1
- package/dist/index124.js +61 -139
- package/dist/index124.js.map +1 -1
- package/dist/index125.js +144 -2
- package/dist/index125.js.map +1 -1
- package/dist/index126.js +2 -56
- package/dist/index126.js.map +1 -1
- package/dist/index127.js +56 -2
- package/dist/index127.js.map +1 -1
- package/dist/index128.js +2 -2
- package/dist/index131.js +2 -2
- package/dist/index132.js +2 -2
- package/dist/index133.js +2 -2
- package/dist/index134.js +2 -2
- package/dist/index135.js +2 -32
- package/dist/index135.js.map +1 -1
- package/dist/index136.js +32 -2
- package/dist/index136.js.map +1 -1
- package/dist/index137.js +2 -8
- package/dist/index137.js.map +1 -1
- package/dist/index138.js +8 -2
- package/dist/index138.js.map +1 -1
- package/dist/index139.js +2 -2
- package/dist/index140.js +2 -21
- package/dist/index140.js.map +1 -1
- package/dist/index141.js +21 -2
- package/dist/index141.js.map +1 -1
- package/dist/index142.js +2 -24
- package/dist/index142.js.map +1 -1
- package/dist/index143.js +17 -64
- package/dist/index143.js.map +1 -1
- package/dist/index144.js +68 -18
- package/dist/index144.js.map +1 -1
- package/dist/index145.js +18 -31
- package/dist/index145.js.map +1 -1
- package/dist/index146.js +32 -68
- package/dist/index146.js.map +1 -1
- package/dist/index147.js +70 -2
- package/dist/index147.js.map +1 -1
- package/dist/index148.js +2 -22
- package/dist/index148.js.map +1 -1
- package/dist/index149.js +22 -2
- package/dist/index149.js.map +1 -1
- package/dist/index15.js +1 -1
- package/dist/index151.js +2 -2
- package/dist/index152.js +2 -2
- package/dist/index153.js +2 -4
- package/dist/index153.js.map +1 -1
- package/dist/index154.js +7 -0
- package/dist/index154.js.map +1 -0
- package/dist/index31.js +175 -116
- package/dist/index31.js.map +1 -1
- package/dist/index62.js +1 -1
- package/dist/index63.js +24 -24
- package/dist/index63.js.map +1 -1
- package/dist/index75.js +31 -22
- package/dist/index75.js.map +1 -1
- package/dist/index76.js +20 -327
- package/dist/index76.js.map +1 -1
- package/dist/index77.js +323 -50
- package/dist/index77.js.map +1 -1
- package/dist/index78.js +56 -40
- package/dist/index78.js.map +1 -1
- package/dist/index79.js +40 -23
- package/dist/index79.js.map +1 -1
- package/dist/index80.js +21 -93
- package/dist/index80.js.map +1 -1
- package/dist/index81.js +88 -123
- package/dist/index81.js.map +1 -1
- package/dist/index82.js +123 -154
- package/dist/index82.js.map +1 -1
- package/dist/index83.js +159 -63
- package/dist/index83.js.map +1 -1
- package/dist/index84.js +65 -35
- package/dist/index84.js.map +1 -1
- package/dist/index85.js +35 -234
- package/dist/index85.js.map +1 -1
- package/dist/index86.js +231 -31
- package/dist/index86.js.map +1 -1
- package/dist/index87.js +34 -210
- package/dist/index87.js.map +1 -1
- package/dist/index88.js +195 -198
- package/dist/index88.js.map +1 -1
- package/dist/index89.js +159 -241
- package/dist/index89.js.map +1 -1
- package/dist/index90.js +283 -166
- package/dist/index90.js.map +1 -1
- package/dist/index91.js +173 -253
- package/dist/index91.js.map +1 -1
- package/dist/index92.js +258 -14
- package/dist/index92.js.map +1 -1
- package/dist/index93.js +12 -31
- package/dist/index93.js.map +1 -1
- package/dist/index94.js +32 -5
- package/dist/index94.js.map +1 -1
- package/dist/index95.js +5 -13
- package/dist/index95.js.map +1 -1
- package/dist/index96.js +11 -43
- package/dist/index96.js.map +1 -1
- package/dist/index97.js +44 -11
- package/dist/index97.js.map +1 -1
- package/dist/index98.js +10 -12
- package/dist/index98.js.map +1 -1
- package/dist/index99.js +14 -7
- package/dist/index99.js.map +1 -1
- package/package.json +1 -1
package/dist/index82.js
CHANGED
|
@@ -1,164 +1,133 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { useState as
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
const
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
size: x = "md",
|
|
24
|
-
showSeconds: $ = !1,
|
|
25
|
-
...E
|
|
26
|
-
}) => {
|
|
27
|
-
const [o, O] = a(
|
|
28
|
-
t || N || null
|
|
29
|
-
), [u, C] = a(!1), [l, M] = a(o ? o.getHours() : 0), [S, v] = a(o ? o.getMinutes() : 0), [y, H] = a(o ? o.getSeconds() : 0), [P, k] = a(
|
|
30
|
-
o && o.getHours() >= 12 ? "PM" : "AM"
|
|
31
|
-
), A = Y(null);
|
|
32
|
-
j(() => {
|
|
33
|
-
t !== void 0 && (O(t), t && (M(t.getHours()), v(t.getMinutes()), H(t.getSeconds()), k(t.getHours() >= 12 ? "PM" : "AM")));
|
|
34
|
-
}, [t]), j(() => {
|
|
35
|
-
function e(s) {
|
|
36
|
-
A.current && !A.current.contains(s.target) && C(!1);
|
|
1
|
+
import { jsxs as w, jsx as a } from "react/jsx-runtime";
|
|
2
|
+
import { useState as i, useEffect as h } from "react";
|
|
3
|
+
function p({
|
|
4
|
+
lightTheme: t = "light",
|
|
5
|
+
darkTheme: n = "dark",
|
|
6
|
+
initialTheme: o,
|
|
7
|
+
onChange: u,
|
|
8
|
+
className: m = ""
|
|
9
|
+
}) {
|
|
10
|
+
const [s, l] = i(() => {
|
|
11
|
+
const r = document.documentElement.getAttribute("data-theme");
|
|
12
|
+
return o ? o === n : r ? r === n : !!(window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches);
|
|
13
|
+
});
|
|
14
|
+
h(() => {
|
|
15
|
+
const r = document.documentElement.getAttribute("data-theme");
|
|
16
|
+
if (o)
|
|
17
|
+
l(o === n), document.documentElement.setAttribute("data-theme", o);
|
|
18
|
+
else if (r)
|
|
19
|
+
l(r === n);
|
|
20
|
+
else {
|
|
21
|
+
const c = window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches, d = c ? n : t;
|
|
22
|
+
l(c), document.documentElement.setAttribute("data-theme", d);
|
|
37
23
|
}
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
const
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
w
|
|
49
|
-
);
|
|
50
|
-
O(b), p?.(b);
|
|
51
|
-
}, I = (e) => {
|
|
52
|
-
let s = e;
|
|
53
|
-
n === "12" && (s = P === "PM" ? e % 12 + 12 : e % 12), M(s), m(s, S, y);
|
|
54
|
-
}, L = (e) => {
|
|
55
|
-
v(e), m(l, e, y);
|
|
56
|
-
}, R = (e) => {
|
|
57
|
-
H(e), m(l, S, e);
|
|
58
|
-
}, D = (e) => {
|
|
59
|
-
k(e);
|
|
60
|
-
const s = e === "PM" ? l % 12 + 12 : l % 12;
|
|
61
|
-
M(s), m(s, S, y);
|
|
62
|
-
}, T = (e, s, w, g, b = 0) => {
|
|
63
|
-
const F = Array.from({ length: s - b + 1 }, (f, K) => b + K);
|
|
64
|
-
return /* @__PURE__ */ c("div", { className: "flex flex-col", children: [
|
|
65
|
-
/* @__PURE__ */ r("div", { className: "text-xs font-semibold text-center text-base-content/60 py-2", children: e }),
|
|
66
|
-
/* @__PURE__ */ r("div", { className: "flex-1 overflow-y-auto max-h-48", children: F.map((f) => /* @__PURE__ */ r(
|
|
67
|
-
"button",
|
|
68
|
-
{
|
|
69
|
-
type: "button",
|
|
70
|
-
onClick: () => g(f),
|
|
71
|
-
className: `
|
|
72
|
-
w-full px-4 py-2 text-center hover:bg-base-200 transition-colors
|
|
73
|
-
${w === f ? "bg-primary text-primary-content" : ""}
|
|
74
|
-
`,
|
|
75
|
-
children: String(f).padStart(2, "0")
|
|
76
|
-
},
|
|
77
|
-
f
|
|
78
|
-
)) })
|
|
79
|
-
] });
|
|
80
|
-
}, z = n === "12" ? l % 12 || 12 : l;
|
|
81
|
-
return /* @__PURE__ */ c("div", { ref: A, className: `relative ${h}`, "data-state": u ? "open" : "closed", ...E, children: [
|
|
82
|
-
/* @__PURE__ */ r(
|
|
83
|
-
_,
|
|
24
|
+
}, [o, n, t]);
|
|
25
|
+
const e = (r) => {
|
|
26
|
+
const c = r.target.checked;
|
|
27
|
+
l(c);
|
|
28
|
+
const d = c ? n : t;
|
|
29
|
+
document.documentElement.setAttribute("data-theme", d), u?.(d);
|
|
30
|
+
};
|
|
31
|
+
return /* @__PURE__ */ w("label", { className: `swap swap-rotate ${m}`, children: [
|
|
32
|
+
/* @__PURE__ */ a(
|
|
33
|
+
"input",
|
|
84
34
|
{
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
onClick: () => !d && C(!u),
|
|
91
|
-
className: "cursor-pointer"
|
|
35
|
+
type: "checkbox",
|
|
36
|
+
className: "theme-controller",
|
|
37
|
+
value: n,
|
|
38
|
+
checked: s,
|
|
39
|
+
onChange: e
|
|
92
40
|
}
|
|
93
41
|
),
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
"
|
|
42
|
+
/* @__PURE__ */ a(
|
|
43
|
+
"svg",
|
|
44
|
+
{
|
|
45
|
+
className: "swap-off h-8 w-8 fill-current",
|
|
46
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
47
|
+
viewBox: "0 0 24 24",
|
|
48
|
+
children: /* @__PURE__ */ a("path", { d: "M5.64,17l-.71.71a1,1,0,0,0,0,1.41,1,1,0,0,0,1.41,0l.71-.71A1,1,0,0,0,5.64,17ZM5,12a1,1,0,0,0-1-1H3a1,1,0,0,0,0,2H4A1,1,0,0,0,5,12Zm7-7a1,1,0,0,0,1-1V3a1,1,0,0,0-2,0V4A1,1,0,0,0,12,5ZM5.64,7.05a1,1,0,0,0,.7.29,1,1,0,0,0,.71-.29,1,1,0,0,0,0-1.41l-.71-.71A1,1,0,0,0,4.93,6.34Zm12,.29a1,1,0,0,0,.7-.29l.71-.71a1,1,0,1,0-1.41-1.41L17,5.64a1,1,0,0,0,0,1.41A1,1,0,0,0,17.66,7.34ZM21,11H20a1,1,0,0,0,0,2h1a1,1,0,0,0,0-2Zm-9,8a1,1,0,0,0-1,1v1a1,1,0,0,0,2,0V20A1,1,0,0,0,12,19ZM18.36,17A1,1,0,0,0,17,18.36l.71.71a1,1,0,0,0,1.41,0,1,1,0,0,0,0-1.41ZM12,6.5A5.5,5.5,0,1,0,17.5,12,5.51,5.51,0,0,0,12,6.5Zm0,9A3.5,3.5,0,1,1,15.5,12,3.5,3.5,0,0,1,12,15.5Z" })
|
|
49
|
+
}
|
|
50
|
+
),
|
|
51
|
+
/* @__PURE__ */ a(
|
|
52
|
+
"svg",
|
|
53
|
+
{
|
|
54
|
+
className: "swap-on h-8 w-8 fill-current",
|
|
55
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
56
|
+
viewBox: "0 0 24 24",
|
|
57
|
+
children: /* @__PURE__ */ a("path", { d: "M21.64,13a1,1,0,0,0-1.05-.14,8.05,8.05,0,0,1-3.37.73A8.15,8.15,0,0,1,9.08,5.49a8.59,8.59,0,0,1,.25-2A1,1,0,0,0,8,2.36,10.14,10.14,0,1,0,22,14.05,1,1,0,0,0,21.64,13Zm-9.5,6.69A8.14,8.14,0,0,1,7.08,5.22v.27A10.15,10.15,0,0,0,17.22,15.63a9.79,9.79,0,0,0,2.1-.22A8.11,8.11,0,0,1,12.14,19.73Z" })
|
|
58
|
+
}
|
|
59
|
+
)
|
|
60
|
+
] });
|
|
61
|
+
}
|
|
62
|
+
function f({
|
|
63
|
+
themes: t,
|
|
64
|
+
initialTheme: n,
|
|
65
|
+
onChange: o,
|
|
66
|
+
className: u = ""
|
|
67
|
+
}) {
|
|
68
|
+
const [m, s] = i(() => {
|
|
69
|
+
if (n) return n;
|
|
70
|
+
const e = document.documentElement.getAttribute("data-theme");
|
|
71
|
+
return e && t.includes(e) ? e : window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches ? t.find((r) => r === "dark") || t[0] || "light" : t.find((r) => r === "light") || t[0] || "light";
|
|
72
|
+
});
|
|
73
|
+
h(() => {
|
|
74
|
+
const e = document.documentElement.getAttribute("data-theme");
|
|
75
|
+
if (n)
|
|
76
|
+
s(n), document.documentElement.setAttribute("data-theme", n);
|
|
77
|
+
else if (e && t.includes(e))
|
|
78
|
+
s(e);
|
|
79
|
+
else if (!e && t.length > 0) {
|
|
80
|
+
const c = window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches ? t.find((d) => d === "dark") || t[0] : t.find((d) => d === "light") || t[0];
|
|
81
|
+
s(c), document.documentElement.setAttribute("data-theme", c);
|
|
82
|
+
}
|
|
83
|
+
}, [n, t]);
|
|
84
|
+
const l = (e) => {
|
|
85
|
+
s(e), document.documentElement.setAttribute("data-theme", e), o?.(e);
|
|
86
|
+
};
|
|
87
|
+
return /* @__PURE__ */ w("div", { className: `dropdown dropdown-end ${u}`, children: [
|
|
88
|
+
/* @__PURE__ */ w("div", { tabIndex: 0, role: "button", className: "btn", children: [
|
|
89
|
+
"Theme",
|
|
90
|
+
/* @__PURE__ */ a(
|
|
91
|
+
"svg",
|
|
92
|
+
{
|
|
93
|
+
width: "12px",
|
|
94
|
+
height: "12px",
|
|
95
|
+
className: "inline-block h-2 w-2 fill-current opacity-60",
|
|
96
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
97
|
+
viewBox: "0 0 2048 2048",
|
|
98
|
+
children: /* @__PURE__ */ a("path", { d: "M1799 349l242 241-1017 1017L7 590l242-241 775 775 775-775z" })
|
|
99
|
+
}
|
|
100
|
+
)
|
|
101
|
+
] }),
|
|
102
|
+
/* @__PURE__ */ a(
|
|
103
|
+
"ul",
|
|
104
|
+
{
|
|
105
|
+
tabIndex: 0,
|
|
106
|
+
className: "dropdown-content bg-base-300 rounded-box z-[1] w-28 p-2 shadow-2xl max-h-96 overflow-y-auto",
|
|
107
|
+
children: t.map((e) => /* @__PURE__ */ a("li", { children: /* @__PURE__ */ a(
|
|
108
|
+
"input",
|
|
150
109
|
{
|
|
151
|
-
type: "
|
|
152
|
-
|
|
153
|
-
className: "btn btn-
|
|
154
|
-
|
|
110
|
+
type: "radio",
|
|
111
|
+
name: "theme-dropdown",
|
|
112
|
+
className: "theme-controller btn btn-sm btn-block btn-ghost justify-start",
|
|
113
|
+
"aria-label": e,
|
|
114
|
+
value: e,
|
|
115
|
+
checked: m === e,
|
|
116
|
+
onChange: () => l(e)
|
|
155
117
|
}
|
|
156
|
-
)
|
|
157
|
-
|
|
158
|
-
|
|
118
|
+
) }, e))
|
|
119
|
+
}
|
|
120
|
+
)
|
|
159
121
|
] });
|
|
160
|
-
}
|
|
122
|
+
}
|
|
123
|
+
const A = Object.assign(
|
|
124
|
+
{},
|
|
125
|
+
{
|
|
126
|
+
Swap: p,
|
|
127
|
+
Dropdown: f
|
|
128
|
+
}
|
|
129
|
+
);
|
|
161
130
|
export {
|
|
162
|
-
|
|
131
|
+
A as ThemeController
|
|
163
132
|
};
|
|
164
133
|
//# sourceMappingURL=index82.js.map
|
package/dist/index82.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index82.js","sources":["../src/components/TimePicker.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react'\nimport { Input } from './Input'\n\nexport interface TimePickerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'> {\n value?: Date | null\n defaultValue?: Date | null\n onChange?: (date: Date | null) => void\n format?: '12' | '24'\n placeholder?: string\n disabled?: boolean\n size?: 'xs' | 'sm' | 'md' | 'lg'\n showSeconds?: boolean\n}\n\nfunction formatTime(date: Date | null, format: '12' | '24' = '24', showSeconds: boolean = false): string {\n if (!date) return ''\n\n let hours = date.getHours()\n const minutes = String(date.getMinutes()).padStart(2, '0')\n const seconds = String(date.getSeconds()).padStart(2, '0')\n\n if (format === '12') {\n const period = hours >= 12 ? 'PM' : 'AM'\n hours = hours % 12 || 12\n const timeStr = showSeconds\n ? `${hours}:${minutes}:${seconds} ${period}`\n : `${hours}:${minutes} ${period}`\n return timeStr\n }\n\n const hoursStr = String(hours).padStart(2, '0')\n return showSeconds ? `${hoursStr}:${minutes}:${seconds}` : `${hoursStr}:${minutes}`\n}\n\nexport const TimePicker: React.FC<TimePickerProps> = ({\n value,\n defaultValue,\n onChange,\n format = '24',\n placeholder = 'Select time',\n disabled = false,\n className = '',\n size = 'md',\n showSeconds = false,\n ...rest\n}) => {\n const [selectedTime, setSelectedTime] = useState<Date | null>(\n value || defaultValue || null\n )\n const [isOpen, setIsOpen] = useState(false)\n const [hours, setHours] = useState(selectedTime ? selectedTime.getHours() : 0)\n const [minutes, setMinutes] = useState(selectedTime ? selectedTime.getMinutes() : 0)\n const [seconds, setSeconds] = useState(selectedTime ? selectedTime.getSeconds() : 0)\n const [period, setPeriod] = useState<'AM' | 'PM'>(\n selectedTime && selectedTime.getHours() >= 12 ? 'PM' : 'AM'\n )\n\n const containerRef = useRef<HTMLDivElement>(null)\n\n useEffect(() => {\n if (value !== undefined) {\n setSelectedTime(value)\n if (value) {\n setHours(value.getHours())\n setMinutes(value.getMinutes())\n setSeconds(value.getSeconds())\n setPeriod(value.getHours() >= 12 ? 'PM' : 'AM')\n }\n }\n }, [value])\n\n useEffect(() => {\n function handleClickOutside(event: MouseEvent) {\n if (containerRef.current && !containerRef.current.contains(event.target as Node)) {\n setIsOpen(false)\n }\n }\n\n if (isOpen) {\n document.addEventListener('mousedown', handleClickOutside)\n return () => document.removeEventListener('mousedown', handleClickOutside)\n }\n }, [isOpen])\n\n const handleTimeChange = (newHours: number, newMinutes: number, newSeconds: number) => {\n const now = new Date()\n const newTime = new Date(\n now.getFullYear(),\n now.getMonth(),\n now.getDate(),\n newHours,\n newMinutes,\n newSeconds\n )\n setSelectedTime(newTime)\n onChange?.(newTime)\n }\n\n const handleHourChange = (newHour: number) => {\n let actualHour = newHour\n if (format === '12') {\n actualHour = period === 'PM' ? (newHour % 12) + 12 : newHour % 12\n }\n setHours(actualHour)\n handleTimeChange(actualHour, minutes, seconds)\n }\n\n const handleMinuteChange = (newMinute: number) => {\n setMinutes(newMinute)\n handleTimeChange(hours, newMinute, seconds)\n }\n\n const handleSecondChange = (newSecond: number) => {\n setSeconds(newSecond)\n handleTimeChange(hours, minutes, newSecond)\n }\n\n const handlePeriodChange = (newPeriod: 'AM' | 'PM') => {\n setPeriod(newPeriod)\n const newHours = newPeriod === 'PM'\n ? (hours % 12) + 12\n : hours % 12\n setHours(newHours)\n handleTimeChange(newHours, minutes, seconds)\n }\n\n const renderTimeColumn = (\n label: string,\n maxValue: number,\n currentValue: number,\n onChange: (value: number) => void,\n start: number = 0\n ) => {\n const items = Array.from({ length: maxValue - start + 1 }, (_, i) => start + i)\n\n return (\n <div className=\"flex flex-col\">\n <div className=\"text-xs font-semibold text-center text-base-content/60 py-2\">\n {label}\n </div>\n <div className=\"flex-1 overflow-y-auto max-h-48\">\n {items.map((item) => (\n <button\n key={item}\n type=\"button\"\n onClick={() => onChange(item)}\n className={`\n w-full px-4 py-2 text-center hover:bg-base-200 transition-colors\n ${currentValue === item ? 'bg-primary text-primary-content' : ''}\n `}\n >\n {String(item).padStart(2, '0')}\n </button>\n ))}\n </div>\n </div>\n )\n }\n\n const displayHours = format === '12' ? (hours % 12 || 12) : hours\n\n return (\n <div ref={containerRef} className={`relative ${className}`} data-state={isOpen ? 'open' : 'closed'} {...rest}>\n <Input\n value={formatTime(selectedTime, format, showSeconds)}\n placeholder={placeholder}\n disabled={disabled}\n size={size}\n readOnly\n onClick={() => !disabled && setIsOpen(!isOpen)}\n className=\"cursor-pointer\"\n />\n\n {isOpen && (\n <div className=\"absolute top-full left-0 mt-2 bg-base-100 border border-base-300 rounded-lg shadow-lg z-50\">\n <div className=\"flex divide-x divide-base-300\">\n {renderTimeColumn(\n 'Hour',\n format === '12' ? 12 : 23,\n displayHours,\n handleHourChange,\n format === '12' ? 1 : 0\n )}\n\n {renderTimeColumn('Min', 59, minutes, handleMinuteChange)}\n\n {showSeconds && renderTimeColumn('Sec', 59, seconds, handleSecondChange)}\n\n {format === '12' && (\n <div className=\"flex flex-col\">\n <div className=\"text-xs font-semibold text-center text-base-content/60 py-2\">\n Period\n </div>\n <div className=\"flex-1 flex flex-col p-2 gap-2\">\n <button\n type=\"button\"\n onClick={() => handlePeriodChange('AM')}\n className={`\n btn btn-sm\n ${period === 'AM' ? 'btn-primary' : 'btn-ghost'}\n `}\n >\n AM\n </button>\n <button\n type=\"button\"\n onClick={() => handlePeriodChange('PM')}\n className={`\n btn btn-sm\n ${period === 'PM' ? 'btn-primary' : 'btn-ghost'}\n `}\n >\n PM\n </button>\n </div>\n </div>\n )}\n </div>\n\n {/* Action buttons */}\n <div className=\"flex justify-end gap-2 p-3 border-t border-base-300\">\n <button\n type=\"button\"\n onClick={() => {\n const now = new Date()\n setHours(now.getHours())\n setMinutes(now.getMinutes())\n setSeconds(now.getSeconds())\n setPeriod(now.getHours() >= 12 ? 'PM' : 'AM')\n handleTimeChange(now.getHours(), now.getMinutes(), now.getSeconds())\n }}\n className=\"btn btn-ghost btn-sm\"\n >\n Now\n </button>\n <button\n type=\"button\"\n onClick={() => setIsOpen(false)}\n className=\"btn btn-primary btn-sm\"\n >\n OK\n </button>\n </div>\n </div>\n )}\n </div>\n )\n}\n"],"names":["formatTime","date","format","showSeconds","hours","minutes","seconds","period","hoursStr","TimePicker","value","defaultValue","onChange","placeholder","disabled","className","size","rest","selectedTime","setSelectedTime","useState","isOpen","setIsOpen","setHours","setMinutes","setSeconds","setPeriod","containerRef","useRef","useEffect","handleClickOutside","event","handleTimeChange","newHours","newMinutes","newSeconds","now","newTime","handleHourChange","newHour","actualHour","handleMinuteChange","newMinute","handleSecondChange","newSecond","handlePeriodChange","newPeriod","renderTimeColumn","label","maxValue","currentValue","start","items","_","i","jsxs","jsx","item","displayHours","Input"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index82.js","sources":["../src/components/ThemeController.tsx"],"sourcesContent":["import React, { useState, useEffect } from 'react'\n\nexport interface ThemeControllerSwapProps {\n lightTheme?: string\n darkTheme?: string\n initialTheme?: string\n onChange?: (theme: string) => void\n className?: string\n}\n\nexport interface ThemeControllerDropdownProps {\n themes: string[]\n initialTheme?: string\n onChange?: (theme: string) => void\n className?: string\n}\n\nfunction ThemeControllerSwap({\n lightTheme = 'light',\n darkTheme = 'dark',\n initialTheme,\n onChange,\n className = '',\n}: ThemeControllerSwapProps) {\n const [isDark, setIsDark] = useState(() => {\n const currentTheme = document.documentElement.getAttribute('data-theme')\n if (initialTheme) {\n return initialTheme === darkTheme\n }\n if (currentTheme) {\n return currentTheme === darkTheme\n }\n // Detect system theme preference\n if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {\n return true\n }\n return false\n })\n\n useEffect(() => {\n const currentTheme = document.documentElement.getAttribute('data-theme')\n if (initialTheme) {\n setIsDark(initialTheme === darkTheme)\n document.documentElement.setAttribute('data-theme', initialTheme)\n } else if (currentTheme) {\n setIsDark(currentTheme === darkTheme)\n } else {\n // Apply system theme preference\n const prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches\n const theme = prefersDark ? darkTheme : lightTheme\n setIsDark(prefersDark)\n document.documentElement.setAttribute('data-theme', theme)\n }\n }, [initialTheme, darkTheme, lightTheme])\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const checked = e.target.checked\n setIsDark(checked)\n const newTheme = checked ? darkTheme : lightTheme\n document.documentElement.setAttribute('data-theme', newTheme)\n onChange?.(newTheme)\n }\n\n return (\n <label className={`swap swap-rotate ${className}`}>\n <input\n type=\"checkbox\"\n className=\"theme-controller\"\n value={darkTheme}\n checked={isDark}\n onChange={handleChange}\n />\n {/* sun icon */}\n <svg\n className=\"swap-off h-8 w-8 fill-current\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n >\n <path d=\"M5.64,17l-.71.71a1,1,0,0,0,0,1.41,1,1,0,0,0,1.41,0l.71-.71A1,1,0,0,0,5.64,17ZM5,12a1,1,0,0,0-1-1H3a1,1,0,0,0,0,2H4A1,1,0,0,0,5,12Zm7-7a1,1,0,0,0,1-1V3a1,1,0,0,0-2,0V4A1,1,0,0,0,12,5ZM5.64,7.05a1,1,0,0,0,.7.29,1,1,0,0,0,.71-.29,1,1,0,0,0,0-1.41l-.71-.71A1,1,0,0,0,4.93,6.34Zm12,.29a1,1,0,0,0,.7-.29l.71-.71a1,1,0,1,0-1.41-1.41L17,5.64a1,1,0,0,0,0,1.41A1,1,0,0,0,17.66,7.34ZM21,11H20a1,1,0,0,0,0,2h1a1,1,0,0,0,0-2Zm-9,8a1,1,0,0,0-1,1v1a1,1,0,0,0,2,0V20A1,1,0,0,0,12,19ZM18.36,17A1,1,0,0,0,17,18.36l.71.71a1,1,0,0,0,1.41,0,1,1,0,0,0,0-1.41ZM12,6.5A5.5,5.5,0,1,0,17.5,12,5.51,5.51,0,0,0,12,6.5Zm0,9A3.5,3.5,0,1,1,15.5,12,3.5,3.5,0,0,1,12,15.5Z\" />\n </svg>\n {/* moon icon */}\n <svg\n className=\"swap-on h-8 w-8 fill-current\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n >\n <path d=\"M21.64,13a1,1,0,0,0-1.05-.14,8.05,8.05,0,0,1-3.37.73A8.15,8.15,0,0,1,9.08,5.49a8.59,8.59,0,0,1,.25-2A1,1,0,0,0,8,2.36,10.14,10.14,0,1,0,22,14.05,1,1,0,0,0,21.64,13Zm-9.5,6.69A8.14,8.14,0,0,1,7.08,5.22v.27A10.15,10.15,0,0,0,17.22,15.63a9.79,9.79,0,0,0,2.1-.22A8.11,8.11,0,0,1,12.14,19.73Z\" />\n </svg>\n </label>\n )\n}\n\nfunction ThemeControllerDropdown({\n themes,\n initialTheme,\n onChange,\n className = '',\n}: ThemeControllerDropdownProps) {\n const [selectedTheme, setSelectedTheme] = useState(() => {\n if (initialTheme) return initialTheme\n const currentTheme = document.documentElement.getAttribute('data-theme')\n if (currentTheme && themes.includes(currentTheme)) return currentTheme\n // Detect system theme preference\n if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {\n return themes.find(t => t === 'dark') || themes[0] || 'light'\n }\n return themes.find(t => t === 'light') || themes[0] || 'light'\n })\n\n useEffect(() => {\n const currentTheme = document.documentElement.getAttribute('data-theme')\n if (initialTheme) {\n setSelectedTheme(initialTheme)\n document.documentElement.setAttribute('data-theme', initialTheme)\n } else if (currentTheme && themes.includes(currentTheme)) {\n setSelectedTheme(currentTheme)\n } else if (!currentTheme && themes.length > 0) {\n // Apply system theme preference\n const prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches\n const theme = prefersDark\n ? themes.find(t => t === 'dark') || themes[0]\n : themes.find(t => t === 'light') || themes[0]\n setSelectedTheme(theme)\n document.documentElement.setAttribute('data-theme', theme)\n }\n }, [initialTheme, themes])\n\n const handleThemeChange = (theme: string) => {\n setSelectedTheme(theme)\n document.documentElement.setAttribute('data-theme', theme)\n onChange?.(theme)\n }\n\n return (\n <div className={`dropdown dropdown-end ${className}`}>\n <div tabIndex={0} role=\"button\" className=\"btn\">\n Theme\n <svg\n width=\"12px\"\n height=\"12px\"\n className=\"inline-block h-2 w-2 fill-current opacity-60\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 2048 2048\"\n >\n <path d=\"M1799 349l242 241-1017 1017L7 590l242-241 775 775 775-775z\"></path>\n </svg>\n </div>\n <ul\n tabIndex={0}\n className=\"dropdown-content bg-base-300 rounded-box z-[1] w-28 p-2 shadow-2xl max-h-96 overflow-y-auto\"\n >\n {themes.map((theme) => (\n <li key={theme}>\n <input\n type=\"radio\"\n name=\"theme-dropdown\"\n className=\"theme-controller btn btn-sm btn-block btn-ghost justify-start\"\n aria-label={theme}\n value={theme}\n checked={selectedTheme === theme}\n onChange={() => handleThemeChange(theme)}\n />\n </li>\n ))}\n </ul>\n </div>\n )\n}\n\nexport const ThemeController = Object.assign(\n {},\n {\n Swap: ThemeControllerSwap,\n Dropdown: ThemeControllerDropdown,\n }\n)\n"],"names":["ThemeControllerSwap","lightTheme","darkTheme","initialTheme","onChange","className","isDark","setIsDark","useState","currentTheme","useEffect","prefersDark","theme","handleChange","e","checked","newTheme","jsxs","jsx","ThemeControllerDropdown","themes","selectedTheme","setSelectedTheme","t","handleThemeChange","ThemeController"],"mappings":"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"}
|
package/dist/index83.js
CHANGED
|
@@ -1,68 +1,164 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
}
|
|
12
|
-
const h =
|
|
13
|
-
|
|
14
|
-
i && "timeline-vertical",
|
|
15
|
-
o && "timeline-horizontal",
|
|
16
|
-
a && "timeline-compact",
|
|
17
|
-
r && "timeline-snap-icon",
|
|
18
|
-
l
|
|
19
|
-
].filter(Boolean).join(" "), f = v.Children.map(n, (s, m) => v.isValidElement(s) ? v.cloneElement(s, {
|
|
20
|
-
_index: m,
|
|
21
|
-
_compact: a,
|
|
22
|
-
_vertical: i
|
|
23
|
-
}) : s);
|
|
24
|
-
return /* @__PURE__ */ e("ul", { className: h, ...t, children: f });
|
|
1
|
+
import { jsxs as c, jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { useState as a, useRef as Y, useEffect as j } from "react";
|
|
3
|
+
import { Input as _ } from "./index38.js";
|
|
4
|
+
function q(t, N = "24", p = !1) {
|
|
5
|
+
if (!t) return "";
|
|
6
|
+
let n = t.getHours();
|
|
7
|
+
const i = String(t.getMinutes()).padStart(2, "0"), d = String(t.getSeconds()).padStart(2, "0");
|
|
8
|
+
if (N === "12") {
|
|
9
|
+
const x = n >= 12 ? "PM" : "AM";
|
|
10
|
+
return n = n % 12 || 12, p ? `${n}:${i}:${d} ${x}` : `${n}:${i} ${x}`;
|
|
11
|
+
}
|
|
12
|
+
const h = String(n).padStart(2, "0");
|
|
13
|
+
return p ? `${h}:${i}:${d}` : `${h}:${i}`;
|
|
25
14
|
}
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
...
|
|
37
|
-
}) {
|
|
38
|
-
const
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
15
|
+
const Q = ({
|
|
16
|
+
value: t,
|
|
17
|
+
defaultValue: N,
|
|
18
|
+
onChange: p,
|
|
19
|
+
format: n = "24",
|
|
20
|
+
placeholder: i = "Select time",
|
|
21
|
+
disabled: d = !1,
|
|
22
|
+
className: h = "",
|
|
23
|
+
size: x = "md",
|
|
24
|
+
showSeconds: $ = !1,
|
|
25
|
+
...E
|
|
26
|
+
}) => {
|
|
27
|
+
const [o, O] = a(
|
|
28
|
+
t || N || null
|
|
29
|
+
), [u, C] = a(!1), [l, M] = a(o ? o.getHours() : 0), [S, v] = a(o ? o.getMinutes() : 0), [y, H] = a(o ? o.getSeconds() : 0), [P, k] = a(
|
|
30
|
+
o && o.getHours() >= 12 ? "PM" : "AM"
|
|
31
|
+
), A = Y(null);
|
|
32
|
+
j(() => {
|
|
33
|
+
t !== void 0 && (O(t), t && (M(t.getHours()), v(t.getMinutes()), H(t.getSeconds()), k(t.getHours() >= 12 ? "PM" : "AM")));
|
|
34
|
+
}, [t]), j(() => {
|
|
35
|
+
function e(s) {
|
|
36
|
+
A.current && !A.current.contains(s.target) && C(!1);
|
|
37
|
+
}
|
|
38
|
+
if (u)
|
|
39
|
+
return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
|
|
40
|
+
}, [u]);
|
|
41
|
+
const m = (e, s, w) => {
|
|
42
|
+
const g = /* @__PURE__ */ new Date(), b = new Date(
|
|
43
|
+
g.getFullYear(),
|
|
44
|
+
g.getMonth(),
|
|
45
|
+
g.getDate(),
|
|
46
|
+
e,
|
|
47
|
+
s,
|
|
48
|
+
w
|
|
49
|
+
);
|
|
50
|
+
O(b), p?.(b);
|
|
51
|
+
}, I = (e) => {
|
|
52
|
+
let s = e;
|
|
53
|
+
n === "12" && (s = P === "PM" ? e % 12 + 12 : e % 12), M(s), m(s, S, y);
|
|
54
|
+
}, L = (e) => {
|
|
55
|
+
v(e), m(l, e, y);
|
|
56
|
+
}, R = (e) => {
|
|
57
|
+
H(e), m(l, S, e);
|
|
58
|
+
}, D = (e) => {
|
|
59
|
+
k(e);
|
|
60
|
+
const s = e === "PM" ? l % 12 + 12 : l % 12;
|
|
61
|
+
M(s), m(s, S, y);
|
|
62
|
+
}, T = (e, s, w, g, b = 0) => {
|
|
63
|
+
const F = Array.from({ length: s - b + 1 }, (f, K) => b + K);
|
|
64
|
+
return /* @__PURE__ */ c("div", { className: "flex flex-col", children: [
|
|
65
|
+
/* @__PURE__ */ r("div", { className: "text-xs font-semibold text-center text-base-content/60 py-2", children: e }),
|
|
66
|
+
/* @__PURE__ */ r("div", { className: "flex-1 overflow-y-auto max-h-48", children: F.map((f) => /* @__PURE__ */ r(
|
|
67
|
+
"button",
|
|
68
|
+
{
|
|
69
|
+
type: "button",
|
|
70
|
+
onClick: () => g(f),
|
|
71
|
+
className: `
|
|
72
|
+
w-full px-4 py-2 text-center hover:bg-base-200 transition-colors
|
|
73
|
+
${w === f ? "bg-primary text-primary-content" : ""}
|
|
74
|
+
`,
|
|
75
|
+
children: String(f).padStart(2, "0")
|
|
76
|
+
},
|
|
77
|
+
f
|
|
78
|
+
)) })
|
|
79
|
+
] });
|
|
80
|
+
}, z = n === "12" ? l % 12 || 12 : l;
|
|
81
|
+
return /* @__PURE__ */ c("div", { ref: A, className: `relative ${h}`, "data-state": u ? "open" : "closed", ...E, children: [
|
|
82
|
+
/* @__PURE__ */ r(
|
|
83
|
+
_,
|
|
84
|
+
{
|
|
85
|
+
value: q(o, n, $),
|
|
86
|
+
placeholder: i,
|
|
87
|
+
disabled: d,
|
|
88
|
+
size: x,
|
|
89
|
+
readOnly: !0,
|
|
90
|
+
onClick: () => !d && C(!u),
|
|
91
|
+
className: "cursor-pointer"
|
|
92
|
+
}
|
|
93
|
+
),
|
|
94
|
+
u && /* @__PURE__ */ c("div", { className: "absolute top-full left-0 mt-2 bg-base-100 border border-base-300 rounded-lg shadow-lg z-50", children: [
|
|
95
|
+
/* @__PURE__ */ c("div", { className: "flex divide-x divide-base-300", children: [
|
|
96
|
+
T(
|
|
97
|
+
"Hour",
|
|
98
|
+
n === "12" ? 12 : 23,
|
|
99
|
+
z,
|
|
100
|
+
I,
|
|
101
|
+
n === "12" ? 1 : 0
|
|
102
|
+
),
|
|
103
|
+
T("Min", 59, S, L),
|
|
104
|
+
$ && T("Sec", 59, y, R),
|
|
105
|
+
n === "12" && /* @__PURE__ */ c("div", { className: "flex flex-col", children: [
|
|
106
|
+
/* @__PURE__ */ r("div", { className: "text-xs font-semibold text-center text-base-content/60 py-2", children: "Period" }),
|
|
107
|
+
/* @__PURE__ */ c("div", { className: "flex-1 flex flex-col p-2 gap-2", children: [
|
|
108
|
+
/* @__PURE__ */ r(
|
|
109
|
+
"button",
|
|
110
|
+
{
|
|
111
|
+
type: "button",
|
|
112
|
+
onClick: () => D("AM"),
|
|
113
|
+
className: `
|
|
114
|
+
btn btn-sm
|
|
115
|
+
${P === "AM" ? "btn-primary" : "btn-ghost"}
|
|
116
|
+
`,
|
|
117
|
+
children: "AM"
|
|
118
|
+
}
|
|
119
|
+
),
|
|
120
|
+
/* @__PURE__ */ r(
|
|
121
|
+
"button",
|
|
122
|
+
{
|
|
123
|
+
type: "button",
|
|
124
|
+
onClick: () => D("PM"),
|
|
125
|
+
className: `
|
|
126
|
+
btn btn-sm
|
|
127
|
+
${P === "PM" ? "btn-primary" : "btn-ghost"}
|
|
128
|
+
`,
|
|
129
|
+
children: "PM"
|
|
130
|
+
}
|
|
131
|
+
)
|
|
132
|
+
] })
|
|
133
|
+
] })
|
|
134
|
+
] }),
|
|
135
|
+
/* @__PURE__ */ c("div", { className: "flex justify-end gap-2 p-3 border-t border-base-300", children: [
|
|
136
|
+
/* @__PURE__ */ r(
|
|
137
|
+
"button",
|
|
138
|
+
{
|
|
139
|
+
type: "button",
|
|
140
|
+
onClick: () => {
|
|
141
|
+
const e = /* @__PURE__ */ new Date();
|
|
142
|
+
M(e.getHours()), v(e.getMinutes()), H(e.getSeconds()), k(e.getHours() >= 12 ? "PM" : "AM"), m(e.getHours(), e.getMinutes(), e.getSeconds());
|
|
143
|
+
},
|
|
144
|
+
className: "btn btn-ghost btn-sm",
|
|
145
|
+
children: "Now"
|
|
146
|
+
}
|
|
147
|
+
),
|
|
148
|
+
/* @__PURE__ */ r(
|
|
149
|
+
"button",
|
|
150
|
+
{
|
|
151
|
+
type: "button",
|
|
152
|
+
onClick: () => C(!1),
|
|
153
|
+
className: "btn btn-primary btn-sm",
|
|
154
|
+
children: "OK"
|
|
155
|
+
}
|
|
156
|
+
)
|
|
157
|
+
] })
|
|
158
|
+
] })
|
|
60
159
|
] });
|
|
61
|
-
}
|
|
62
|
-
const b = Object.assign(N, {
|
|
63
|
-
Item: p
|
|
64
|
-
});
|
|
160
|
+
};
|
|
65
161
|
export {
|
|
66
|
-
|
|
162
|
+
Q as TimePicker
|
|
67
163
|
};
|
|
68
164
|
//# sourceMappingURL=index83.js.map
|
package/dist/index83.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index83.js","sources":["../src/components/Timeline.tsx"],"sourcesContent":["import React from 'react'\n\nexport interface TimelineProps extends React.HTMLAttributes<HTMLUListElement> {\n children: React.ReactNode\n vertical?: boolean\n horizontal?: boolean\n compact?: boolean\n snapIcon?: boolean\n}\n\nexport interface TimelineItemProps extends React.LiHTMLAttributes<HTMLLIElement> {\n start?: React.ReactNode\n end?: React.ReactNode\n icon?: React.ReactNode\n startBox?: boolean\n endBox?: boolean\n // Internal props injected by Timeline container\n _index?: number\n _compact?: boolean\n _vertical?: boolean\n}\n\nfunction TimelineRoot({\n children,\n className = '',\n vertical = false,\n horizontal = false,\n compact = false,\n snapIcon = false,\n ...rest\n}: TimelineProps) {\n const classes = [\n 'timeline',\n vertical && 'timeline-vertical',\n horizontal && 'timeline-horizontal',\n compact && 'timeline-compact',\n snapIcon && 'timeline-snap-icon',\n className,\n ]\n .filter(Boolean)\n .join(' ')\n\n // Inject index and layout props into each Timeline.Item\n const childrenWithProps = React.Children.map(children, (child, index) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n _index: index,\n _compact: compact,\n _vertical: vertical,\n } as any)\n }\n return child\n })\n\n return <ul className={classes} {...rest}>{childrenWithProps}</ul>\n}\n\nfunction TimelineItem({\n start,\n end,\n icon,\n startBox = false,\n endBox = false,\n className = '',\n _index = 0,\n _compact = false,\n _vertical = false,\n ...rest\n}: TimelineItemProps) {\n const startClasses = ['timeline-start', startBox && 'timeline-box'].filter(Boolean).join(' ')\n const endClasses = ['timeline-end', endBox && 'timeline-box'].filter(Boolean).join(' ')\n\n // Determine if this is an even item (for alternating horizontal layout)\n const isEven = _index % 2 === 0\n\n // Render connectors and content based on layout\n if (_compact) {\n // Compact layout: connector, icon, end content, connector\n return (\n <li className={className} {...rest}>\n <hr />\n {icon && <div className=\"timeline-middle\">{icon}</div>}\n {end && <div className={endClasses}>{end}</div>}\n {_index !== undefined && <hr />}\n </li>\n )\n } else if (_vertical) {\n // Vertical layout: connector, start, icon, end, connector\n return (\n <li className={className} {...rest}>\n <hr />\n {start && <div className={startClasses}>{start}</div>}\n {icon && <div className=\"timeline-middle\">{icon}</div>}\n {end && <div className={endClasses}>{end}</div>}\n <hr />\n </li>\n )\n } else {\n // Horizontal alternating layout\n if (isEven) {\n // Even items: start, icon, end, connector\n return (\n <li className={className} {...rest}>\n {start && <div className={startClasses}>{start}</div>}\n {icon && <div className=\"timeline-middle\">{icon}</div>}\n {end && <div className={endClasses}>{end}</div>}\n <hr />\n </li>\n )\n } else {\n // Odd items: connector, icon, start, end\n return (\n <li className={className} {...rest}>\n <hr />\n {icon && <div className=\"timeline-middle\">{icon}</div>}\n {start && <div className={startClasses}>{start}</div>}\n {end && <div className={endClasses}>{end}</div>}\n </li>\n )\n }\n }\n}\n\nexport const Timeline = Object.assign(TimelineRoot, {\n Item: TimelineItem,\n})\n"],"names":["TimelineRoot","children","className","vertical","horizontal","compact","snapIcon","rest","classes","childrenWithProps","React","child","index","TimelineItem","start","end","icon","startBox","endBox","_index","_compact","_vertical","startClasses","endClasses","isEven","jsxs","jsx","Timeline"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index83.js","sources":["../src/components/TimePicker.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react'\nimport { Input } from './Input'\n\nexport interface TimePickerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'> {\n value?: Date | null\n defaultValue?: Date | null\n onChange?: (date: Date | null) => void\n format?: '12' | '24'\n placeholder?: string\n disabled?: boolean\n size?: 'xs' | 'sm' | 'md' | 'lg'\n showSeconds?: boolean\n}\n\nfunction formatTime(date: Date | null, format: '12' | '24' = '24', showSeconds: boolean = false): string {\n if (!date) return ''\n\n let hours = date.getHours()\n const minutes = String(date.getMinutes()).padStart(2, '0')\n const seconds = String(date.getSeconds()).padStart(2, '0')\n\n if (format === '12') {\n const period = hours >= 12 ? 'PM' : 'AM'\n hours = hours % 12 || 12\n const timeStr = showSeconds\n ? `${hours}:${minutes}:${seconds} ${period}`\n : `${hours}:${minutes} ${period}`\n return timeStr\n }\n\n const hoursStr = String(hours).padStart(2, '0')\n return showSeconds ? `${hoursStr}:${minutes}:${seconds}` : `${hoursStr}:${minutes}`\n}\n\nexport const TimePicker: React.FC<TimePickerProps> = ({\n value,\n defaultValue,\n onChange,\n format = '24',\n placeholder = 'Select time',\n disabled = false,\n className = '',\n size = 'md',\n showSeconds = false,\n ...rest\n}) => {\n const [selectedTime, setSelectedTime] = useState<Date | null>(\n value || defaultValue || null\n )\n const [isOpen, setIsOpen] = useState(false)\n const [hours, setHours] = useState(selectedTime ? selectedTime.getHours() : 0)\n const [minutes, setMinutes] = useState(selectedTime ? selectedTime.getMinutes() : 0)\n const [seconds, setSeconds] = useState(selectedTime ? selectedTime.getSeconds() : 0)\n const [period, setPeriod] = useState<'AM' | 'PM'>(\n selectedTime && selectedTime.getHours() >= 12 ? 'PM' : 'AM'\n )\n\n const containerRef = useRef<HTMLDivElement>(null)\n\n useEffect(() => {\n if (value !== undefined) {\n setSelectedTime(value)\n if (value) {\n setHours(value.getHours())\n setMinutes(value.getMinutes())\n setSeconds(value.getSeconds())\n setPeriod(value.getHours() >= 12 ? 'PM' : 'AM')\n }\n }\n }, [value])\n\n useEffect(() => {\n function handleClickOutside(event: MouseEvent) {\n if (containerRef.current && !containerRef.current.contains(event.target as Node)) {\n setIsOpen(false)\n }\n }\n\n if (isOpen) {\n document.addEventListener('mousedown', handleClickOutside)\n return () => document.removeEventListener('mousedown', handleClickOutside)\n }\n }, [isOpen])\n\n const handleTimeChange = (newHours: number, newMinutes: number, newSeconds: number) => {\n const now = new Date()\n const newTime = new Date(\n now.getFullYear(),\n now.getMonth(),\n now.getDate(),\n newHours,\n newMinutes,\n newSeconds\n )\n setSelectedTime(newTime)\n onChange?.(newTime)\n }\n\n const handleHourChange = (newHour: number) => {\n let actualHour = newHour\n if (format === '12') {\n actualHour = period === 'PM' ? (newHour % 12) + 12 : newHour % 12\n }\n setHours(actualHour)\n handleTimeChange(actualHour, minutes, seconds)\n }\n\n const handleMinuteChange = (newMinute: number) => {\n setMinutes(newMinute)\n handleTimeChange(hours, newMinute, seconds)\n }\n\n const handleSecondChange = (newSecond: number) => {\n setSeconds(newSecond)\n handleTimeChange(hours, minutes, newSecond)\n }\n\n const handlePeriodChange = (newPeriod: 'AM' | 'PM') => {\n setPeriod(newPeriod)\n const newHours = newPeriod === 'PM'\n ? (hours % 12) + 12\n : hours % 12\n setHours(newHours)\n handleTimeChange(newHours, minutes, seconds)\n }\n\n const renderTimeColumn = (\n label: string,\n maxValue: number,\n currentValue: number,\n onChange: (value: number) => void,\n start: number = 0\n ) => {\n const items = Array.from({ length: maxValue - start + 1 }, (_, i) => start + i)\n\n return (\n <div className=\"flex flex-col\">\n <div className=\"text-xs font-semibold text-center text-base-content/60 py-2\">\n {label}\n </div>\n <div className=\"flex-1 overflow-y-auto max-h-48\">\n {items.map((item) => (\n <button\n key={item}\n type=\"button\"\n onClick={() => onChange(item)}\n className={`\n w-full px-4 py-2 text-center hover:bg-base-200 transition-colors\n ${currentValue === item ? 'bg-primary text-primary-content' : ''}\n `}\n >\n {String(item).padStart(2, '0')}\n </button>\n ))}\n </div>\n </div>\n )\n }\n\n const displayHours = format === '12' ? (hours % 12 || 12) : hours\n\n return (\n <div ref={containerRef} className={`relative ${className}`} data-state={isOpen ? 'open' : 'closed'} {...rest}>\n <Input\n value={formatTime(selectedTime, format, showSeconds)}\n placeholder={placeholder}\n disabled={disabled}\n size={size}\n readOnly\n onClick={() => !disabled && setIsOpen(!isOpen)}\n className=\"cursor-pointer\"\n />\n\n {isOpen && (\n <div className=\"absolute top-full left-0 mt-2 bg-base-100 border border-base-300 rounded-lg shadow-lg z-50\">\n <div className=\"flex divide-x divide-base-300\">\n {renderTimeColumn(\n 'Hour',\n format === '12' ? 12 : 23,\n displayHours,\n handleHourChange,\n format === '12' ? 1 : 0\n )}\n\n {renderTimeColumn('Min', 59, minutes, handleMinuteChange)}\n\n {showSeconds && renderTimeColumn('Sec', 59, seconds, handleSecondChange)}\n\n {format === '12' && (\n <div className=\"flex flex-col\">\n <div className=\"text-xs font-semibold text-center text-base-content/60 py-2\">\n Period\n </div>\n <div className=\"flex-1 flex flex-col p-2 gap-2\">\n <button\n type=\"button\"\n onClick={() => handlePeriodChange('AM')}\n className={`\n btn btn-sm\n ${period === 'AM' ? 'btn-primary' : 'btn-ghost'}\n `}\n >\n AM\n </button>\n <button\n type=\"button\"\n onClick={() => handlePeriodChange('PM')}\n className={`\n btn btn-sm\n ${period === 'PM' ? 'btn-primary' : 'btn-ghost'}\n `}\n >\n PM\n </button>\n </div>\n </div>\n )}\n </div>\n\n {/* Action buttons */}\n <div className=\"flex justify-end gap-2 p-3 border-t border-base-300\">\n <button\n type=\"button\"\n onClick={() => {\n const now = new Date()\n setHours(now.getHours())\n setMinutes(now.getMinutes())\n setSeconds(now.getSeconds())\n setPeriod(now.getHours() >= 12 ? 'PM' : 'AM')\n handleTimeChange(now.getHours(), now.getMinutes(), now.getSeconds())\n }}\n className=\"btn btn-ghost btn-sm\"\n >\n Now\n </button>\n <button\n type=\"button\"\n onClick={() => setIsOpen(false)}\n className=\"btn btn-primary btn-sm\"\n >\n OK\n </button>\n </div>\n </div>\n )}\n </div>\n )\n}\n"],"names":["formatTime","date","format","showSeconds","hours","minutes","seconds","period","hoursStr","TimePicker","value","defaultValue","onChange","placeholder","disabled","className","size","rest","selectedTime","setSelectedTime","useState","isOpen","setIsOpen","setHours","setMinutes","setSeconds","setPeriod","containerRef","useRef","useEffect","handleClickOutside","event","handleTimeChange","newHours","newMinutes","newSeconds","now","newTime","handleHourChange","newHour","actualHour","handleMinuteChange","newMinute","handleSecondChange","newSecond","handlePeriodChange","newPeriod","renderTimeColumn","label","maxValue","currentValue","start","items","_","i","jsxs","jsx","item","displayHours","Input"],"mappings":"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"}
|