dhx-react-suite 1.0.3 → 1.0.4
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/dhx-react-suite.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { useEffect as
|
|
3
|
-
import { Tooltip as
|
|
1
|
+
import { jsxs as x, jsx as t, Fragment as ee } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect as R, useState as I, useMemo as K, useRef as H, useCallback as B, createContext as oe, useContext as ie } from "react";
|
|
3
|
+
import { Tooltip as le, Legend as ae, CartesianGrid as se, XAxis as F, YAxis as V, BarChart as de, Bar as ce, LineChart as pe, Line as he, AreaChart as ue, Area as xe, PieChart as ge, Pie as fe, Cell as ye, RadarChart as be, PolarGrid as me, PolarAngleAxis as ve, Radar as ke, ScatterChart as Se, Scatter as we, ResponsiveContainer as Me } from "recharts";
|
|
4
4
|
const e = {
|
|
5
5
|
primary: "#0288d1",
|
|
6
6
|
primaryDk: "#01579b",
|
|
@@ -20,11 +20,11 @@ const e = {
|
|
|
20
20
|
r: "4px",
|
|
21
21
|
rMd: "8px",
|
|
22
22
|
font: "'Segoe UI', system-ui, -apple-system, sans-serif"
|
|
23
|
-
},
|
|
24
|
-
function
|
|
25
|
-
if (typeof document > "u" || document.getElementById(
|
|
23
|
+
}, X = "dhx-react-styles";
|
|
24
|
+
function A() {
|
|
25
|
+
if (typeof document > "u" || document.getElementById(X)) return;
|
|
26
26
|
const n = document.createElement("style");
|
|
27
|
-
n.id =
|
|
27
|
+
n.id = X, n.textContent = `
|
|
28
28
|
*,*::before,*::after{box-sizing:border-box}
|
|
29
29
|
.dhx{font-family:${e.font};font-size:14px;color:${e.text}}
|
|
30
30
|
.dhx *{box-sizing:border-box}
|
|
@@ -66,136 +66,136 @@ function W() {
|
|
|
66
66
|
.dhx-tag-warning{background:#fff3e0;color:#e65100}
|
|
67
67
|
`, document.head.appendChild(n);
|
|
68
68
|
}
|
|
69
|
-
const
|
|
69
|
+
const $e = {
|
|
70
70
|
sm: { height: 24, padding: "0 8px", fontSize: 12 },
|
|
71
71
|
md: {},
|
|
72
72
|
lg: { height: 38, padding: "0 18px", fontSize: 14 }
|
|
73
73
|
};
|
|
74
|
-
function
|
|
74
|
+
function Be({
|
|
75
75
|
children: n,
|
|
76
|
-
variant:
|
|
76
|
+
variant: d = "primary",
|
|
77
77
|
size: u = "md",
|
|
78
|
-
icon:
|
|
79
|
-
disabled:
|
|
78
|
+
icon: l,
|
|
79
|
+
disabled: f,
|
|
80
80
|
onClick: h,
|
|
81
|
-
style:
|
|
81
|
+
style: g,
|
|
82
82
|
className: r = ""
|
|
83
83
|
}) {
|
|
84
|
-
return
|
|
84
|
+
return R(A, []), /* @__PURE__ */ x(
|
|
85
85
|
"button",
|
|
86
86
|
{
|
|
87
|
-
className: `dhx dhx-btn dhx-btn-${
|
|
88
|
-
style: {
|
|
89
|
-
disabled:
|
|
87
|
+
className: `dhx dhx-btn dhx-btn-${d} ${r}`,
|
|
88
|
+
style: { ...$e[u], ...g },
|
|
89
|
+
disabled: f,
|
|
90
90
|
onClick: h,
|
|
91
91
|
children: [
|
|
92
|
-
|
|
92
|
+
l && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: l }),
|
|
93
93
|
n
|
|
94
94
|
]
|
|
95
95
|
}
|
|
96
96
|
);
|
|
97
97
|
}
|
|
98
|
-
function
|
|
99
|
-
|
|
100
|
-
const u = (
|
|
101
|
-
var
|
|
102
|
-
if (
|
|
103
|
-
return /* @__PURE__ */ t("div", { style: { width: 1, background: e.border, margin: "6px 4px", alignSelf: "stretch" } },
|
|
104
|
-
if (
|
|
105
|
-
return /* @__PURE__ */ t("div", { style: { flex: 1 } },
|
|
106
|
-
if (
|
|
107
|
-
return /* @__PURE__ */
|
|
108
|
-
|
|
98
|
+
function je({ items: n = [], style: d }) {
|
|
99
|
+
R(A, []);
|
|
100
|
+
const u = (l, f) => {
|
|
101
|
+
var g;
|
|
102
|
+
if (l.type === "separator")
|
|
103
|
+
return /* @__PURE__ */ t("div", { style: { width: 1, background: e.border, margin: "6px 4px", alignSelf: "stretch" } }, f);
|
|
104
|
+
if (l.type === "spacer")
|
|
105
|
+
return /* @__PURE__ */ t("div", { style: { flex: 1 } }, f);
|
|
106
|
+
if (l.type === "input")
|
|
107
|
+
return /* @__PURE__ */ x("div", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
|
|
108
|
+
l.label && /* @__PURE__ */ t("span", { style: { fontSize: 12, color: e.textSec, fontWeight: 500 }, children: l.label }),
|
|
109
109
|
/* @__PURE__ */ t(
|
|
110
110
|
"input",
|
|
111
111
|
{
|
|
112
112
|
className: "dhx dhx-input",
|
|
113
|
-
style: { width:
|
|
114
|
-
placeholder:
|
|
115
|
-
defaultValue:
|
|
113
|
+
style: { width: l.width || 140, height: 28 },
|
|
114
|
+
placeholder: l.placeholder,
|
|
115
|
+
defaultValue: l.value,
|
|
116
116
|
onChange: (r) => {
|
|
117
|
-
var
|
|
118
|
-
return (
|
|
117
|
+
var p;
|
|
118
|
+
return (p = l.onChange) == null ? void 0 : p.call(l, r.target.value);
|
|
119
119
|
}
|
|
120
120
|
}
|
|
121
121
|
)
|
|
122
|
-
] },
|
|
123
|
-
if (
|
|
122
|
+
] }, f);
|
|
123
|
+
if (l.type === "select")
|
|
124
124
|
return /* @__PURE__ */ t(
|
|
125
125
|
"select",
|
|
126
126
|
{
|
|
127
127
|
className: "dhx dhx-input",
|
|
128
|
-
style: { width:
|
|
129
|
-
defaultValue:
|
|
128
|
+
style: { width: l.width || 100, height: 28, cursor: "pointer" },
|
|
129
|
+
defaultValue: l.value,
|
|
130
130
|
onChange: (r) => {
|
|
131
|
-
var
|
|
132
|
-
return (
|
|
131
|
+
var p;
|
|
132
|
+
return (p = l.onChange) == null ? void 0 : p.call(l, r.target.value);
|
|
133
133
|
},
|
|
134
|
-
children: (
|
|
134
|
+
children: (g = l.options) == null ? void 0 : g.map((r) => /* @__PURE__ */ t("option", { value: r.value, children: r.label }, r.value))
|
|
135
135
|
},
|
|
136
|
-
|
|
136
|
+
f
|
|
137
137
|
);
|
|
138
|
-
const h =
|
|
139
|
-
return /* @__PURE__ */
|
|
138
|
+
const h = l.active;
|
|
139
|
+
return /* @__PURE__ */ x(
|
|
140
140
|
"button",
|
|
141
141
|
{
|
|
142
142
|
className: `dhx dhx-btn ${h ? "dhx-btn-primary" : "dhx-btn-ghost"}`,
|
|
143
|
-
style: { height: 32, gap: 4, ...
|
|
144
|
-
disabled:
|
|
143
|
+
style: { height: 32, gap: 4, ...l.twoState && h ? { background: e.primaryLt, color: e.primary, borderColor: `${e.primary}66` } : {} },
|
|
144
|
+
disabled: l.disabled,
|
|
145
145
|
onClick: () => {
|
|
146
146
|
var r;
|
|
147
|
-
return (r =
|
|
147
|
+
return (r = l.onClick) == null ? void 0 : r.call(l, l);
|
|
148
148
|
},
|
|
149
149
|
children: [
|
|
150
|
-
|
|
151
|
-
|
|
150
|
+
l.icon && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: l.icon }),
|
|
151
|
+
l.text && /* @__PURE__ */ t("span", { children: l.text })
|
|
152
152
|
]
|
|
153
153
|
},
|
|
154
|
-
|
|
154
|
+
f
|
|
155
155
|
);
|
|
156
156
|
};
|
|
157
|
-
return /* @__PURE__ */ t("div", { className: "dhx", style: { display: "flex", alignItems: "center", gap: 2, padding: "4px 8px", background: e.surface, borderBottom: `1px solid ${e.border}`, minHeight: 44, flexWrap: "wrap", ...
|
|
157
|
+
return /* @__PURE__ */ t("div", { className: "dhx", style: { display: "flex", alignItems: "center", gap: 2, padding: "4px 8px", background: e.surface, borderBottom: `1px solid ${e.border}`, minHeight: 44, flexWrap: "wrap", ...d }, children: n.map(u) });
|
|
158
158
|
}
|
|
159
|
-
function
|
|
160
|
-
const [r,
|
|
161
|
-
|
|
162
|
-
const
|
|
163
|
-
|
|
164
|
-
},
|
|
165
|
-
var
|
|
159
|
+
function Pe({ items: n = [], width: d = 240, collapsed: u, onSelect: l, header: f, footer: h, style: g }) {
|
|
160
|
+
const [r, p] = I(u ?? !1), [y, c] = I(null), [k, $] = I({});
|
|
161
|
+
R(A, []);
|
|
162
|
+
const m = r ? 56 : d, o = (S) => {
|
|
163
|
+
c(S.id), l == null || l(S);
|
|
164
|
+
}, v = (S, N = 0) => {
|
|
165
|
+
var b;
|
|
166
166
|
if (S.type === "separator") return /* @__PURE__ */ t("div", { style: { height: 1, background: e.border, margin: "6px 8px" } }, S.id);
|
|
167
167
|
if (S.type === "customHTML") return /* @__PURE__ */ t("div", { style: { padding: "8px 12px" }, dangerouslySetInnerHTML: { __html: S.html || "" } }, S.id);
|
|
168
|
-
const
|
|
169
|
-
return /* @__PURE__ */
|
|
170
|
-
/* @__PURE__ */
|
|
168
|
+
const z = (((b = S.items) == null ? void 0 : b.length) ?? 0) > 0, w = k[S.id], s = y === S.id;
|
|
169
|
+
return /* @__PURE__ */ x("div", { children: [
|
|
170
|
+
/* @__PURE__ */ x(
|
|
171
171
|
"div",
|
|
172
172
|
{
|
|
173
173
|
onClick: () => {
|
|
174
|
-
|
|
174
|
+
z && $((T) => ({ ...T, [S.id]: !T[S.id] })), o(S);
|
|
175
175
|
},
|
|
176
|
-
style: { display: "flex", alignItems: "center", gap: 10, padding: `8px ${r ? "0px" : `${12 +
|
|
177
|
-
onMouseEnter: (
|
|
178
|
-
onMouseLeave: (
|
|
176
|
+
style: { display: "flex", alignItems: "center", gap: 10, padding: `8px ${r ? "0px" : `${12 + N * 16}px`}`, cursor: "pointer", borderRadius: e.r, margin: "1px 6px", justifyContent: r ? "center" : "flex-start", transition: "all .15s", background: s ? e.primaryLt : "transparent", color: s ? e.primary : e.text, userSelect: "none" },
|
|
177
|
+
onMouseEnter: (T) => !s && (T.currentTarget.style.background = e.bg),
|
|
178
|
+
onMouseLeave: (T) => !s && (T.currentTarget.style.background = "transparent"),
|
|
179
179
|
children: [
|
|
180
180
|
S.icon && /* @__PURE__ */ t("span", { style: { fontSize: 18, minWidth: 22, textAlign: "center" }, children: S.icon }),
|
|
181
|
-
!r && /* @__PURE__ */ t("span", { style: { flex: 1, fontSize: 13, fontWeight:
|
|
181
|
+
!r && /* @__PURE__ */ t("span", { style: { flex: 1, fontSize: 13, fontWeight: s ? 600 : 400 }, children: S.value }),
|
|
182
182
|
!r && S.count !== void 0 && /* @__PURE__ */ t("span", { style: { background: e.primary, color: "#fff", borderRadius: 10, padding: "1px 6px", fontSize: 11, fontWeight: 700 }, children: S.count }),
|
|
183
|
-
!r &&
|
|
183
|
+
!r && z && /* @__PURE__ */ t("span", { style: { fontSize: 12, color: e.textMut, transition: "transform .15s", transform: w ? "rotate(90deg)" : "rotate(0deg)" }, children: "▶" })
|
|
184
184
|
]
|
|
185
185
|
}
|
|
186
186
|
),
|
|
187
|
-
|
|
187
|
+
z && w && !r && S.items.map((T) => v(T, N + 1))
|
|
188
188
|
] }, S.id);
|
|
189
189
|
};
|
|
190
|
-
return /* @__PURE__ */
|
|
191
|
-
|
|
192
|
-
/* @__PURE__ */ t("button", { onClick: () =>
|
|
193
|
-
/* @__PURE__ */ t("div", { className: "dhx-scroll", style: { flex: 1, overflowY: "auto", overflowX: "hidden" }, children: n.map((S) =>
|
|
190
|
+
return /* @__PURE__ */ x("div", { className: "dhx", style: { width: m, minWidth: m, background: e.surface, borderRight: `1px solid ${e.border}`, display: "flex", flexDirection: "column", transition: "width .2s ease", overflow: "hidden", ...g }, children: [
|
|
191
|
+
f && !r && /* @__PURE__ */ t("div", { style: { padding: "12px 14px", borderBottom: `1px solid ${e.border}`, fontWeight: 700, fontSize: 15 }, children: f }),
|
|
192
|
+
/* @__PURE__ */ t("button", { onClick: () => p((S) => !S), style: { margin: "8px 6px", background: "transparent", border: "none", cursor: "pointer", display: "flex", alignItems: "center", justifyContent: r ? "center" : "flex-end", padding: "4px 6px", borderRadius: e.r, color: e.textSec }, children: /* @__PURE__ */ t("span", { style: { fontSize: 18 }, children: r ? "☰" : "✕" }) }),
|
|
193
|
+
/* @__PURE__ */ t("div", { className: "dhx-scroll", style: { flex: 1, overflowY: "auto", overflowX: "hidden" }, children: n.map((S) => v(S)) }),
|
|
194
194
|
h && !r && /* @__PURE__ */ t("div", { style: { padding: "10px 14px", borderTop: `1px solid ${e.border}` }, children: h })
|
|
195
195
|
] });
|
|
196
196
|
}
|
|
197
|
-
function
|
|
198
|
-
const [
|
|
197
|
+
function ze({ config: n }) {
|
|
198
|
+
const [d, u] = I(!1), l = {
|
|
199
199
|
position: "relative",
|
|
200
200
|
background: e.surface,
|
|
201
201
|
border: `1px solid ${e.border}`,
|
|
@@ -203,505 +203,610 @@ function Se({ config: n }) {
|
|
|
203
203
|
overflow: "hidden",
|
|
204
204
|
...n.width ? { width: n.width, minWidth: n.width } : { flex: 1 },
|
|
205
205
|
...n.height ? { height: n.height, minHeight: n.height } : { minHeight: 40 },
|
|
206
|
-
...
|
|
206
|
+
...d ? { flex: "0 0 auto" } : {}
|
|
207
207
|
};
|
|
208
|
-
return /* @__PURE__ */
|
|
209
|
-
n.header && /* @__PURE__ */
|
|
208
|
+
return /* @__PURE__ */ x("div", { style: l, children: [
|
|
209
|
+
n.header && /* @__PURE__ */ x("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", padding: "6px 12px", background: e.bg, borderBottom: `1px solid ${e.border}`, fontSize: 12, fontWeight: 600, color: e.textSec, userSelect: "none" }, children: [
|
|
210
210
|
/* @__PURE__ */ t("span", { children: n.header }),
|
|
211
|
-
n.collapsable && /* @__PURE__ */ t("button", { onClick: () => u((
|
|
211
|
+
n.collapsable && /* @__PURE__ */ t("button", { onClick: () => u((f) => !f), style: { background: "none", border: "none", cursor: "pointer", color: e.textMut, fontSize: 16, lineHeight: 1 }, children: d ? "▼" : "▲" })
|
|
212
212
|
] }),
|
|
213
|
-
!
|
|
213
|
+
!d && /* @__PURE__ */ x("div", { style: { padding: n.padding || 0, height: n.header ? "calc(100% - 33px)" : "100%", overflow: "auto" }, children: [
|
|
214
214
|
n.html ? /* @__PURE__ */ t("div", { dangerouslySetInnerHTML: { __html: n.html } }) : n.content,
|
|
215
|
-
(n.rows || n.cols) && /* @__PURE__ */ t(
|
|
215
|
+
(n.rows || n.cols) && /* @__PURE__ */ t(Ce, { rows: n.rows, cols: n.cols, style: { height: "100%" } })
|
|
216
216
|
] })
|
|
217
217
|
] });
|
|
218
218
|
}
|
|
219
|
-
function
|
|
220
|
-
|
|
221
|
-
const h = u === "space" ? 12 : u === "wide" ? 8 : 1,
|
|
222
|
-
return
|
|
219
|
+
function Ce({ rows: n, cols: d, type: u = "line", style: l, children: f }) {
|
|
220
|
+
R(A, []);
|
|
221
|
+
const h = u === "space" ? 12 : u === "wide" ? 8 : 1, g = n || d, r = !!n;
|
|
222
|
+
return g ? /* @__PURE__ */ t("div", { className: "dhx", style: { display: "flex", flexDirection: r ? "column" : "row", gap: h, width: "100%", height: "100%", ...l }, children: g.map((p, y) => /* @__PURE__ */ t(ze, { config: p }, p.id || y)) }) : /* @__PURE__ */ t("div", { className: "dhx", style: { width: "100%", height: "100%", ...l }, children: f });
|
|
223
223
|
}
|
|
224
|
-
function
|
|
225
|
-
var
|
|
226
|
-
const [y,
|
|
227
|
-
|
|
228
|
-
const
|
|
229
|
-
|
|
230
|
-
},
|
|
231
|
-
|
|
232
|
-
},
|
|
233
|
-
const
|
|
234
|
-
return /* @__PURE__ */
|
|
224
|
+
function Oe({ views: n = [], mode: d = "top", tabAlign: u = "left", closable: l = [], disabled: f = [], defaultActive: h, onBeforeChange: g, onChange: r, style: p }) {
|
|
225
|
+
var s;
|
|
226
|
+
const [y, c] = I(h || ((s = n[0]) == null ? void 0 : s.id)), [k, $] = I(n.map((b) => b.id));
|
|
227
|
+
R(A, []);
|
|
228
|
+
const m = (b, T) => {
|
|
229
|
+
b.stopPropagation(), $((a) => a.filter((M) => M !== T)), y === T && c(k.find((a) => a !== T) ?? "");
|
|
230
|
+
}, o = (b) => {
|
|
231
|
+
f.includes(b) || g && g(b) === !1 || (c(b), r == null || r(b));
|
|
232
|
+
}, v = d === "left" || d === "right", S = n.filter((b) => k.includes(b.id)), N = /* @__PURE__ */ t("div", { style: { display: "flex", flexDirection: v ? "column" : "row", justifyContent: u === "center" ? "center" : u === "right" ? "flex-end" : "flex-start", background: e.surface, borderBottom: !v && d !== "bottom" ? `2px solid ${e.border}` : "none", borderTop: d === "bottom" ? `2px solid ${e.border}` : "none", borderRight: d === "left" ? `2px solid ${e.border}` : "none", borderLeft: d === "right" ? `2px solid ${e.border}` : "none", overflowX: "auto", flexShrink: 0 }, children: S.map((b) => {
|
|
233
|
+
const T = y === b.id, a = f.includes(b.id), M = d === "bottom" ? { borderTop: `2px solid ${e.primary}`, color: e.primary, fontWeight: 600 } : v ? { color: e.primary, fontWeight: 600, background: e.primaryLt, [d === "left" ? "borderRight" : "borderLeft"]: `2px solid ${e.primary}` } : { borderBottom: `2px solid ${e.primary}`, color: e.primary, fontWeight: 600 };
|
|
234
|
+
return /* @__PURE__ */ x(
|
|
235
235
|
"div",
|
|
236
236
|
{
|
|
237
|
-
onClick: () =>
|
|
238
|
-
style: { display: "flex", alignItems: "center", gap: 6, padding: "10px 16px", cursor:
|
|
237
|
+
onClick: () => o(b.id),
|
|
238
|
+
style: { display: "flex", alignItems: "center", gap: 6, padding: "10px 16px", cursor: a ? "not-allowed" : "pointer", whiteSpace: "nowrap", fontSize: 13, transition: "color .15s", userSelect: "none", minWidth: v ? 120 : "auto", ...T ? M : { color: a ? e.textMut : e.textSec } },
|
|
239
239
|
children: [
|
|
240
|
-
|
|
241
|
-
/* @__PURE__ */ t("span", { children:
|
|
242
|
-
|
|
240
|
+
b.icon && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: b.icon }),
|
|
241
|
+
/* @__PURE__ */ t("span", { children: b.tab }),
|
|
242
|
+
l.includes(b.id) && /* @__PURE__ */ t("span", { onClick: (i) => m(i, b.id), style: { marginLeft: 4, opacity: 0.6, fontSize: 12, cursor: "pointer" }, children: "✕" })
|
|
243
243
|
]
|
|
244
244
|
},
|
|
245
|
-
|
|
245
|
+
b.id
|
|
246
246
|
);
|
|
247
|
-
}) }),
|
|
248
|
-
|
|
249
|
-
(
|
|
247
|
+
}) }), z = S.find((b) => b.id === y), w = /* @__PURE__ */ x("div", { className: "dhx-scroll", style: { flex: 1, overflow: "auto" }, children: [
|
|
248
|
+
z == null ? void 0 : z.content,
|
|
249
|
+
(z == null ? void 0 : z.html) && /* @__PURE__ */ t("div", { dangerouslySetInnerHTML: { __html: z.html }, style: { padding: 16 } })
|
|
250
250
|
] });
|
|
251
|
-
return /* @__PURE__ */
|
|
252
|
-
|
|
253
|
-
|
|
251
|
+
return /* @__PURE__ */ x("div", { className: "dhx", style: { display: "flex", flexDirection: d === "top" ? "column" : d === "bottom" ? "column-reverse" : d === "left" ? "row" : "row-reverse", width: "100%", height: "100%", background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.r, overflow: "hidden", ...p }, children: [
|
|
252
|
+
N,
|
|
253
|
+
w
|
|
254
254
|
] });
|
|
255
255
|
}
|
|
256
|
-
function
|
|
257
|
-
const [
|
|
258
|
-
|
|
259
|
-
const
|
|
260
|
-
let
|
|
261
|
-
(
|
|
256
|
+
function Ye({ columns: n, data: d = [], height: u = 400, rowHeight: l = 40, sortable: f = !0, resizable: h = !0, selection: g, multiselect: r, onSelect: p, style: y }) {
|
|
257
|
+
const [c, k] = I(null), [$, m] = I("asc"), [o, v] = I({}), [S, N] = I(/* @__PURE__ */ new Set()), [z, w] = I(n.map((i) => i.width || i.minWidth || 140));
|
|
258
|
+
R(A, []);
|
|
259
|
+
const s = K(() => {
|
|
260
|
+
let i = d.filter(
|
|
261
|
+
(C) => Object.entries(o).every(([W, L]) => !L || String(C[W] ?? "").toLowerCase().includes(L.toLowerCase()))
|
|
262
262
|
);
|
|
263
|
-
return
|
|
264
|
-
const
|
|
265
|
-
return
|
|
266
|
-
})),
|
|
267
|
-
}, [
|
|
268
|
-
!
|
|
269
|
-
},
|
|
270
|
-
if (!
|
|
271
|
-
const
|
|
272
|
-
|
|
273
|
-
const
|
|
274
|
-
return
|
|
275
|
-
}),
|
|
276
|
-
},
|
|
277
|
-
const
|
|
278
|
-
const _ = [...
|
|
279
|
-
return _[
|
|
263
|
+
return c && (i = [...i].sort((C, W) => {
|
|
264
|
+
const L = C[c], D = W[c];
|
|
265
|
+
return L == null ? 1 : D == null ? -1 : $ === "asc" ? L < D ? -1 : L > D ? 1 : 0 : L > D ? -1 : L < D ? 1 : 0;
|
|
266
|
+
})), i;
|
|
267
|
+
}, [d, c, $, o]), b = (i) => {
|
|
268
|
+
!f || i.sortable === !1 || (m((C) => c === i.id && C === "asc" ? "desc" : "asc"), k(i.id));
|
|
269
|
+
}, T = (i, C) => {
|
|
270
|
+
if (!g) return;
|
|
271
|
+
const W = i.id ?? C;
|
|
272
|
+
N((L) => {
|
|
273
|
+
const D = r ? new Set(L) : /* @__PURE__ */ new Set();
|
|
274
|
+
return D.has(W) ? D.delete(W) : D.add(W), D;
|
|
275
|
+
}), p == null || p(i);
|
|
276
|
+
}, a = (i, C) => {
|
|
277
|
+
const W = i.clientX, L = z[C], D = (re) => w((ne) => {
|
|
278
|
+
const _ = [...ne];
|
|
279
|
+
return _[C] = Math.max(60, L + re.clientX - W), _;
|
|
280
280
|
}), j = () => {
|
|
281
|
-
document.removeEventListener("mousemove",
|
|
281
|
+
document.removeEventListener("mousemove", D), document.removeEventListener("mouseup", j);
|
|
282
282
|
};
|
|
283
|
-
document.addEventListener("mousemove",
|
|
284
|
-
},
|
|
285
|
-
return /* @__PURE__ */ t("div", { className: "dhx", style: { width: "100%", height: u, display: "flex", flexDirection: "column", border: `1px solid ${e.border}`, borderRadius: e.r, overflow: "hidden", ...y }, children: /* @__PURE__ */ t("div", { style: { overflowX: "auto", flex: 1, display: "flex", flexDirection: "column" }, children: /* @__PURE__ */
|
|
286
|
-
/* @__PURE__ */ t("div", { style: { display: "flex", background: e.bg, borderBottom: `1px solid ${e.border}`, position: "sticky", top: 0, zIndex: 2 }, children: n.map((
|
|
287
|
-
var
|
|
288
|
-
return /* @__PURE__ */
|
|
283
|
+
document.addEventListener("mousemove", D), document.addEventListener("mouseup", j), i.preventDefault();
|
|
284
|
+
}, M = n.some((i) => i.filterable !== !1);
|
|
285
|
+
return /* @__PURE__ */ t("div", { className: "dhx", style: { width: "100%", height: u, display: "flex", flexDirection: "column", border: `1px solid ${e.border}`, borderRadius: e.r, overflow: "hidden", ...y }, children: /* @__PURE__ */ t("div", { style: { overflowX: "auto", flex: 1, display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ x("div", { style: { minWidth: z.reduce((i, C) => i + C, 0) + "px", display: "flex", flexDirection: "column", height: "100%" }, children: [
|
|
286
|
+
/* @__PURE__ */ t("div", { style: { display: "flex", background: e.bg, borderBottom: `1px solid ${e.border}`, position: "sticky", top: 0, zIndex: 2 }, children: n.map((i, C) => {
|
|
287
|
+
var W;
|
|
288
|
+
return /* @__PURE__ */ x(
|
|
289
289
|
"div",
|
|
290
290
|
{
|
|
291
|
-
style: { width:
|
|
292
|
-
onClick: () =>
|
|
291
|
+
style: { width: z[C], minWidth: z[C], position: "relative", padding: "0 10px", height: 40, display: "flex", alignItems: "center", fontSize: 12, fontWeight: 600, color: e.textSec, cursor: f && i.sortable !== !1 ? "pointer" : "default", userSelect: "none", gap: 4 },
|
|
292
|
+
onClick: () => b(i),
|
|
293
293
|
children: [
|
|
294
|
-
/* @__PURE__ */ t("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: Array.isArray(
|
|
295
|
-
|
|
296
|
-
h &&
|
|
294
|
+
/* @__PURE__ */ t("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: Array.isArray(i.header) ? (W = i.header[0]) == null ? void 0 : W.text : i.header || i.id }),
|
|
295
|
+
f && i.sortable !== !1 && /* @__PURE__ */ t("span", { style: { opacity: c === i.id ? 1 : 0.25, fontSize: 10 }, children: c === i.id ? $ === "asc" ? "▲" : "▼" : "⇅" }),
|
|
296
|
+
h && C < n.length - 1 && /* @__PURE__ */ t(
|
|
297
297
|
"div",
|
|
298
298
|
{
|
|
299
|
-
onMouseDown: (
|
|
299
|
+
onMouseDown: (L) => a(L, C),
|
|
300
300
|
style: { position: "absolute", right: 0, top: 4, bottom: 4, width: 4, cursor: "col-resize", background: "transparent" },
|
|
301
|
-
onMouseEnter: (
|
|
302
|
-
onMouseLeave: (
|
|
301
|
+
onMouseEnter: (L) => L.currentTarget.style.background = e.border,
|
|
302
|
+
onMouseLeave: (L) => L.currentTarget.style.background = "transparent"
|
|
303
303
|
}
|
|
304
304
|
)
|
|
305
305
|
]
|
|
306
306
|
},
|
|
307
|
-
|
|
307
|
+
i.id
|
|
308
308
|
);
|
|
309
309
|
}) }),
|
|
310
|
-
|
|
311
|
-
/* @__PURE__ */
|
|
312
|
-
|
|
313
|
-
const
|
|
310
|
+
M && /* @__PURE__ */ t("div", { style: { display: "flex", borderBottom: `1px solid ${e.border}`, background: e.surface }, children: n.map((i, C) => /* @__PURE__ */ t("div", { style: { width: z[C], minWidth: z[C], padding: "4px 6px" }, children: i.filterable !== !1 && /* @__PURE__ */ t("input", { className: "dhx dhx-input", style: { height: 24, fontSize: 12 }, placeholder: "🔍", value: o[i.id] || "", onChange: (W) => v((L) => ({ ...L, [i.id]: W.target.value })) }) }, i.id)) }),
|
|
311
|
+
/* @__PURE__ */ x("div", { className: "dhx-scroll", style: { flex: 1, overflowY: "auto" }, children: [
|
|
312
|
+
s.map((i, C) => {
|
|
313
|
+
const W = i.id ?? C, L = S.has(W);
|
|
314
314
|
return /* @__PURE__ */ t(
|
|
315
315
|
"div",
|
|
316
316
|
{
|
|
317
|
-
onClick: () =>
|
|
318
|
-
style: { display: "flex", height:
|
|
319
|
-
onMouseEnter: (
|
|
320
|
-
onMouseLeave: (
|
|
321
|
-
children: n.map((
|
|
317
|
+
onClick: () => T(i, C),
|
|
318
|
+
style: { display: "flex", height: l, alignItems: "center", borderBottom: `1px solid ${e.border}`, cursor: g ? "pointer" : "default", background: L ? e.primaryLt : C % 2 === 0 ? e.surface : e.bg, transition: "background .1s" },
|
|
319
|
+
onMouseEnter: (D) => !L && (D.currentTarget.style.background = "#f0f8ff"),
|
|
320
|
+
onMouseLeave: (D) => !L && (D.currentTarget.style.background = C % 2 === 0 ? e.surface : e.bg),
|
|
321
|
+
children: n.map((D, j) => /* @__PURE__ */ t("div", { style: { width: z[j], minWidth: z[j], padding: "0 10px", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", fontSize: 13, textAlign: D.align || "left" }, children: D.template ? D.template(i[D.id], i) : String(i[D.id] ?? "") }, D.id))
|
|
322
322
|
},
|
|
323
|
-
String(
|
|
323
|
+
String(W)
|
|
324
324
|
);
|
|
325
325
|
}),
|
|
326
|
-
|
|
326
|
+
s.length === 0 && /* @__PURE__ */ t("div", { style: { textAlign: "center", padding: 40, color: e.textMut }, children: "No data" })
|
|
327
327
|
] })
|
|
328
328
|
] }) }) });
|
|
329
329
|
}
|
|
330
330
|
const E = ["#0288d1", "#43a047", "#f57c00", "#e53935", "#8e24aa", "#00838f", "#ef6c00", "#2e7d32"];
|
|
331
|
-
function
|
|
332
|
-
var
|
|
333
|
-
|
|
334
|
-
const r = ((
|
|
335
|
-
let
|
|
331
|
+
function Ke({ type: n = "bar", data: d = [], series: u = [], scales: l = {}, legend: f, height: h = 280, style: g }) {
|
|
332
|
+
var v, S, N, z, w;
|
|
333
|
+
R(A, []);
|
|
334
|
+
const r = ((v = l.bottom) == null ? void 0 : v.text) || d[0] && Object.keys(d[0])[0] || "x", p = /* @__PURE__ */ t(le, { contentStyle: { fontSize: 12, borderRadius: e.r, border: `1px solid ${e.border}` } }), y = f ? /* @__PURE__ */ t(ae, { iconSize: 10, wrapperStyle: { fontSize: 12 }, verticalAlign: f.valign, align: f.halign }) : null, c = /* @__PURE__ */ t(se, { strokeDasharray: "3 3", stroke: e.border }), k = /* @__PURE__ */ t(F, { dataKey: r, tick: { fontSize: 11, fill: e.textSec }, axisLine: { stroke: e.border }, tickLine: !1 }), $ = /* @__PURE__ */ t(V, { tick: { fontSize: 11, fill: e.textSec }, axisLine: !1, tickLine: !1, domain: [((S = l.left) == null ? void 0 : S.min) ?? "auto", ((N = l.left) == null ? void 0 : N.max) ?? "auto"] }), m = { data: d, margin: { top: 10, right: 20, left: 0, bottom: 0 } };
|
|
335
|
+
let o;
|
|
336
336
|
if (n === "bar")
|
|
337
|
-
|
|
338
|
-
|
|
337
|
+
o = /* @__PURE__ */ x(de, { ...m, children: [
|
|
338
|
+
c,
|
|
339
339
|
k,
|
|
340
|
-
|
|
341
|
-
|
|
340
|
+
$,
|
|
341
|
+
p,
|
|
342
342
|
y,
|
|
343
|
-
u.map((
|
|
343
|
+
u.map((s, b) => /* @__PURE__ */ t(ce, { dataKey: s.value || s.id, name: s.label || s.id, fill: s.fill || E[b % E.length], radius: [3, 3, 0, 0] }, s.id))
|
|
344
344
|
] });
|
|
345
345
|
else if (n === "line")
|
|
346
|
-
|
|
347
|
-
|
|
346
|
+
o = /* @__PURE__ */ x(pe, { ...m, children: [
|
|
347
|
+
c,
|
|
348
348
|
k,
|
|
349
|
-
|
|
350
|
-
|
|
349
|
+
$,
|
|
350
|
+
p,
|
|
351
351
|
y,
|
|
352
|
-
u.map((
|
|
352
|
+
u.map((s, b) => /* @__PURE__ */ t(he, { type: "monotone", dataKey: s.value || s.id, name: s.label || s.id, stroke: s.color || E[b % E.length], strokeWidth: 2, dot: { r: 3, fill: s.color || E[b % E.length] } }, s.id))
|
|
353
353
|
] });
|
|
354
354
|
else if (n === "area")
|
|
355
|
-
|
|
356
|
-
|
|
355
|
+
o = /* @__PURE__ */ x(ue, { ...m, children: [
|
|
356
|
+
c,
|
|
357
357
|
k,
|
|
358
|
-
|
|
359
|
-
|
|
358
|
+
$,
|
|
359
|
+
p,
|
|
360
360
|
y,
|
|
361
|
-
u.map((
|
|
361
|
+
u.map((s, b) => /* @__PURE__ */ t(xe, { type: "monotone", dataKey: s.value || s.id, name: s.label || s.id, stroke: s.color || E[b % E.length], fill: (s.fill || E[b % E.length]) + "33", strokeWidth: 2 }, s.id))
|
|
362
362
|
] });
|
|
363
363
|
else if (n === "pie" || n === "donut") {
|
|
364
|
-
const
|
|
365
|
-
|
|
364
|
+
const s = d[0] || {}, b = Object.keys(s).find((a) => typeof s[a] == "number") || "value", T = Object.keys(s).find((a) => typeof s[a] == "string") || "x";
|
|
365
|
+
o = /* @__PURE__ */ x(ge, { children: [
|
|
366
366
|
/* @__PURE__ */ t(
|
|
367
|
-
|
|
367
|
+
fe,
|
|
368
368
|
{
|
|
369
|
-
data:
|
|
369
|
+
data: d,
|
|
370
370
|
cx: "50%",
|
|
371
371
|
cy: "50%",
|
|
372
372
|
outerRadius: n === "donut" ? "70%" : "80%",
|
|
373
373
|
innerRadius: n === "donut" ? "40%" : 0,
|
|
374
|
-
dataKey:
|
|
375
|
-
nameKey:
|
|
376
|
-
label: ({ name:
|
|
374
|
+
dataKey: b,
|
|
375
|
+
nameKey: T,
|
|
376
|
+
label: ({ name: a, percent: M }) => `${a ?? ""} ${((M ?? 0) * 100).toFixed(0)}%`,
|
|
377
377
|
labelLine: !0,
|
|
378
378
|
paddingAngle: 2,
|
|
379
|
-
children:
|
|
379
|
+
children: d.map((a, M) => /* @__PURE__ */ t(ye, { fill: E[M % E.length] }, M))
|
|
380
380
|
}
|
|
381
381
|
),
|
|
382
|
-
|
|
382
|
+
p,
|
|
383
383
|
y
|
|
384
384
|
] });
|
|
385
|
-
} else n === "radar" ?
|
|
386
|
-
/* @__PURE__ */ t(
|
|
387
|
-
/* @__PURE__ */ t(
|
|
388
|
-
u.map((
|
|
389
|
-
|
|
385
|
+
} else n === "radar" ? o = /* @__PURE__ */ x(be, { ...m, cx: "50%", cy: "50%", children: [
|
|
386
|
+
/* @__PURE__ */ t(me, {}),
|
|
387
|
+
/* @__PURE__ */ t(ve, { dataKey: r, tick: { fontSize: 11 } }),
|
|
388
|
+
u.map((s, b) => /* @__PURE__ */ t(ke, { dataKey: s.value || s.id, name: s.label || s.id, stroke: s.color || E[b], fill: (s.fill || E[b]) + "44" }, s.id)),
|
|
389
|
+
p,
|
|
390
390
|
y
|
|
391
|
-
] }) : n === "scatter" && (
|
|
392
|
-
|
|
393
|
-
/* @__PURE__ */ t(F, { dataKey: ((
|
|
394
|
-
/* @__PURE__ */ t(
|
|
395
|
-
|
|
396
|
-
u.map((
|
|
391
|
+
] }) : n === "scatter" && (o = /* @__PURE__ */ x(Se, { ...m, children: [
|
|
392
|
+
c,
|
|
393
|
+
/* @__PURE__ */ t(F, { dataKey: ((z = u[0]) == null ? void 0 : z.xValue) || "x", type: "number", tick: { fontSize: 11, fill: e.textSec } }),
|
|
394
|
+
/* @__PURE__ */ t(V, { dataKey: ((w = u[0]) == null ? void 0 : w.yValue) || "y", tick: { fontSize: 11, fill: e.textSec } }),
|
|
395
|
+
p,
|
|
396
|
+
u.map((s, b) => /* @__PURE__ */ t(we, { data: s.data || d, name: s.label || s.id, fill: s.color || E[b] }, s.id))
|
|
397
397
|
] }));
|
|
398
|
-
return /* @__PURE__ */ t("div", { className: "dhx", style: { width: "100%", height: h, padding: 12, background: e.surface, borderRadius: e.rMd, ...
|
|
398
|
+
return /* @__PURE__ */ t("div", { className: "dhx", style: { width: "100%", height: h, padding: 12, background: e.surface, borderRadius: e.rMd, ...g }, children: /* @__PURE__ */ t(Me, { width: "100%", height: "100%", children: o }) });
|
|
399
399
|
}
|
|
400
|
-
const
|
|
401
|
-
function
|
|
402
|
-
const h = /* @__PURE__ */ new Date(),
|
|
403
|
-
|
|
404
|
-
const
|
|
405
|
-
for (let
|
|
406
|
-
for (let
|
|
407
|
-
const
|
|
400
|
+
const Ne = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"], Ie = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
|
|
401
|
+
function _e({ value: n, range: d = !1, timepicker: u = !1, onChange: l, style: f }) {
|
|
402
|
+
const h = /* @__PURE__ */ new Date(), g = n ? new Date(Array.isArray(n) ? n[0] : n) : h, [r, p] = I(g), [y, c] = I(n ?? (d ? [null, null] : null)), [k, $] = I(null), [m, o] = I({ h: 0, m: 0 });
|
|
403
|
+
R(A, []);
|
|
404
|
+
const v = r.getFullYear(), S = r.getMonth(), N = new Date(v, S, 1).getDay(), z = new Date(v, S + 1, 0).getDate(), w = [];
|
|
405
|
+
for (let a = 0; a < N; a++) w.push(null);
|
|
406
|
+
for (let a = 1; a <= z; a++) w.push(new Date(v, S, a));
|
|
407
|
+
const s = (a) => a.toDateString() === h.toDateString(), b = (a) => {
|
|
408
408
|
if (!y) return !1;
|
|
409
|
-
if (
|
|
410
|
-
const [
|
|
411
|
-
if (!
|
|
412
|
-
const
|
|
413
|
-
return
|
|
409
|
+
if (d && Array.isArray(y)) {
|
|
410
|
+
const [M, i] = y;
|
|
411
|
+
if (!M) return !1;
|
|
412
|
+
const C = a.getTime();
|
|
413
|
+
return i ? C >= M.getTime() && C <= i.getTime() : a.toDateString() === M.toDateString();
|
|
414
414
|
}
|
|
415
|
-
return
|
|
416
|
-
},
|
|
417
|
-
if (
|
|
418
|
-
const [
|
|
419
|
-
if (!
|
|
420
|
-
|
|
415
|
+
return a.toDateString() === y.toDateString();
|
|
416
|
+
}, T = (a) => {
|
|
417
|
+
if (d) {
|
|
418
|
+
const [M, i] = Array.isArray(y) ? y : [null, null];
|
|
419
|
+
if (!M || i)
|
|
420
|
+
c([a, null]);
|
|
421
421
|
else {
|
|
422
|
-
const
|
|
423
|
-
|
|
422
|
+
const C = a < M ? [a, M] : [M, a];
|
|
423
|
+
c(C), l == null || l(C);
|
|
424
424
|
}
|
|
425
425
|
} else
|
|
426
|
-
|
|
426
|
+
c(a), l == null || l(a);
|
|
427
427
|
};
|
|
428
|
-
return /* @__PURE__ */
|
|
429
|
-
/* @__PURE__ */
|
|
430
|
-
/* @__PURE__ */ t("button", { onClick: () =>
|
|
431
|
-
/* @__PURE__ */
|
|
432
|
-
|
|
428
|
+
return /* @__PURE__ */ x("div", { className: "dhx", style: { background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.rMd, padding: 16, display: "inline-block", boxShadow: e.shadow, ...f }, children: [
|
|
429
|
+
/* @__PURE__ */ x("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", marginBottom: 12 }, children: [
|
|
430
|
+
/* @__PURE__ */ t("button", { onClick: () => p((a) => new Date(a.getFullYear(), a.getMonth() - 1, 1)), className: "dhx dhx-btn dhx-btn-ghost", style: { height: 28, padding: "0 8px", fontSize: 16 }, children: "‹" }),
|
|
431
|
+
/* @__PURE__ */ x("div", { style: { fontWeight: 700, fontSize: 14 }, children: [
|
|
432
|
+
Ne[S],
|
|
433
433
|
" ",
|
|
434
|
-
|
|
434
|
+
v
|
|
435
435
|
] }),
|
|
436
|
-
/* @__PURE__ */ t("button", { onClick: () =>
|
|
436
|
+
/* @__PURE__ */ t("button", { onClick: () => p((a) => new Date(a.getFullYear(), a.getMonth() + 1, 1)), className: "dhx dhx-btn dhx-btn-ghost", style: { height: 28, padding: "0 8px", fontSize: 16 }, children: "›" })
|
|
437
437
|
] }),
|
|
438
|
-
/* @__PURE__ */
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
const
|
|
438
|
+
/* @__PURE__ */ x("div", { style: { display: "grid", gridTemplateColumns: "repeat(7, 32px)", gap: 2 }, children: [
|
|
439
|
+
Ie.map((a) => /* @__PURE__ */ t("div", { style: { textAlign: "center", fontSize: 11, fontWeight: 600, color: e.textMut, paddingBottom: 4 }, children: a }, a)),
|
|
440
|
+
w.map((a, M) => {
|
|
441
|
+
const i = a ? b(a) : !1, C = a && k && a.toDateString() === k.toDateString();
|
|
442
442
|
return /* @__PURE__ */ t(
|
|
443
443
|
"div",
|
|
444
444
|
{
|
|
445
|
-
onClick: () =>
|
|
446
|
-
onMouseEnter: () =>
|
|
447
|
-
onMouseLeave: () =>
|
|
448
|
-
style: { width: 32, height: 32, display: "flex", alignItems: "center", justifyContent: "center", borderRadius: e.r, cursor:
|
|
449
|
-
children:
|
|
445
|
+
onClick: () => a && T(a),
|
|
446
|
+
onMouseEnter: () => a && $(a),
|
|
447
|
+
onMouseLeave: () => $(null),
|
|
448
|
+
style: { width: 32, height: 32, display: "flex", alignItems: "center", justifyContent: "center", borderRadius: e.r, cursor: a ? "pointer" : "default", fontSize: 12, fontWeight: a && s(a) ? 700 : 400, background: i ? e.primary : C ? e.bg : "transparent", color: i ? "#fff" : a && s(a) ? e.primary : a ? e.text : "transparent", border: a && s(a) && !i ? `1px solid ${e.primary}` : "1px solid transparent", transition: "all .1s" },
|
|
449
|
+
children: a == null ? void 0 : a.getDate()
|
|
450
450
|
},
|
|
451
|
-
|
|
451
|
+
M
|
|
452
452
|
);
|
|
453
453
|
})
|
|
454
454
|
] }),
|
|
455
|
-
u && /* @__PURE__ */
|
|
456
|
-
/* @__PURE__ */ t("input", { type: "number", min: 0, max: 23, value:
|
|
455
|
+
u && /* @__PURE__ */ x("div", { style: { borderTop: `1px solid ${e.border}`, marginTop: 12, paddingTop: 12, display: "flex", alignItems: "center", justifyContent: "center", gap: 8 }, children: [
|
|
456
|
+
/* @__PURE__ */ t("input", { type: "number", min: 0, max: 23, value: m.h, onChange: (a) => o((M) => ({ ...M, h: +a.target.value })), className: "dhx dhx-input", style: { width: 50, textAlign: "center" } }),
|
|
457
457
|
/* @__PURE__ */ t("span", { style: { fontWeight: 700, color: e.textSec }, children: ":" }),
|
|
458
|
-
/* @__PURE__ */ t("input", { type: "number", min: 0, max: 59, value:
|
|
458
|
+
/* @__PURE__ */ t("input", { type: "number", min: 0, max: 59, value: m.m, onChange: (a) => o((M) => ({ ...M, m: +a.target.value })), className: "dhx dhx-input", style: { width: 50, textAlign: "center" } })
|
|
459
459
|
] })
|
|
460
460
|
] });
|
|
461
461
|
}
|
|
462
|
-
function
|
|
463
|
-
const [
|
|
464
|
-
|
|
465
|
-
const
|
|
466
|
-
const
|
|
467
|
-
|
|
468
|
-
},
|
|
469
|
-
|
|
470
|
-
},
|
|
462
|
+
function Te({ value: n, onChange: d, timeFormat: u = 12, controls: l = !1, minuteStep: f = 5, style: h }) {
|
|
463
|
+
const [g, r] = I((n == null ? void 0 : n.h) ?? (u === 24 ? 0 : 12)), [p, y] = I((n == null ? void 0 : n.m) ?? 0), [c, k] = I((n == null ? void 0 : n.ampm) ?? "AM"), [$, m] = I(null);
|
|
464
|
+
R(A, []);
|
|
465
|
+
const o = u === 24 ? Array.from({ length: 24 }, (s, b) => b) : Array.from({ length: 12 }, (s, b) => b + 1), v = Array.from({ length: Math.ceil(60 / f) }, (s, b) => b * f), S = (s, b, T) => {
|
|
466
|
+
const a = u === 24 ? { h: s, m: b } : { h: s, m: b, ampm: T };
|
|
467
|
+
l ? m(a) : d == null || d(a);
|
|
468
|
+
}, N = () => {
|
|
469
|
+
m(null), r((n == null ? void 0 : n.h) ?? (u === 24 ? 0 : 12)), y((n == null ? void 0 : n.m) ?? 0), k((n == null ? void 0 : n.ampm) ?? "AM");
|
|
470
|
+
}, z = { display: "flex", flexDirection: "column", alignItems: "center", gap: 4 }, w = (s) => ({
|
|
471
471
|
height: 32,
|
|
472
472
|
display: "flex",
|
|
473
473
|
alignItems: "center",
|
|
474
474
|
justifyContent: "center",
|
|
475
475
|
cursor: "pointer",
|
|
476
476
|
fontSize: 13,
|
|
477
|
-
fontWeight:
|
|
478
|
-
background:
|
|
479
|
-
color:
|
|
477
|
+
fontWeight: s ? 700 : 400,
|
|
478
|
+
background: s ? e.primaryLt : "transparent",
|
|
479
|
+
color: s ? e.primary : e.text
|
|
480
480
|
});
|
|
481
|
-
return /* @__PURE__ */
|
|
482
|
-
/* @__PURE__ */
|
|
483
|
-
/* @__PURE__ */
|
|
481
|
+
return /* @__PURE__ */ x("div", { className: "dhx", style: { background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.rMd, padding: 16, display: "inline-block", boxShadow: e.shadow, ...h }, children: [
|
|
482
|
+
/* @__PURE__ */ x("div", { style: { display: "flex", gap: 8, alignItems: "stretch" }, children: [
|
|
483
|
+
/* @__PURE__ */ x("div", { style: z, children: [
|
|
484
484
|
/* @__PURE__ */ t("span", { style: { fontSize: 11, fontWeight: 600, color: e.textMut }, children: "Hours" }),
|
|
485
|
-
/* @__PURE__ */ t("div", { className: "dhx-scroll", style: { height: 160, overflowY: "auto", width: 48, border: `1px solid ${e.border}`, borderRadius: e.r }, children:
|
|
485
|
+
/* @__PURE__ */ t("div", { className: "dhx-scroll", style: { height: 160, overflowY: "auto", width: 48, border: `1px solid ${e.border}`, borderRadius: e.r }, children: o.map((s) => /* @__PURE__ */ t(
|
|
486
486
|
"div",
|
|
487
487
|
{
|
|
488
488
|
onClick: () => {
|
|
489
|
-
r(
|
|
489
|
+
r(s), S(s, p, c);
|
|
490
490
|
},
|
|
491
|
-
style:
|
|
492
|
-
onMouseEnter: (
|
|
493
|
-
onMouseLeave: (
|
|
494
|
-
children: String(
|
|
491
|
+
style: w(g === s),
|
|
492
|
+
onMouseEnter: (b) => g !== s && (b.currentTarget.style.background = e.bg),
|
|
493
|
+
onMouseLeave: (b) => g !== s && (b.currentTarget.style.background = "transparent"),
|
|
494
|
+
children: String(s).padStart(2, "0")
|
|
495
495
|
},
|
|
496
|
-
|
|
496
|
+
s
|
|
497
497
|
)) })
|
|
498
498
|
] }),
|
|
499
|
-
/* @__PURE__ */
|
|
499
|
+
/* @__PURE__ */ x("div", { style: z, children: [
|
|
500
500
|
/* @__PURE__ */ t("span", { style: { fontSize: 11, fontWeight: 600, color: e.textMut }, children: "Minutes" }),
|
|
501
|
-
/* @__PURE__ */ t("div", { className: "dhx-scroll", style: { height: 160, overflowY: "auto", width: 48, border: `1px solid ${e.border}`, borderRadius: e.r }, children:
|
|
501
|
+
/* @__PURE__ */ t("div", { className: "dhx-scroll", style: { height: 160, overflowY: "auto", width: 48, border: `1px solid ${e.border}`, borderRadius: e.r }, children: v.map((s) => /* @__PURE__ */ t(
|
|
502
502
|
"div",
|
|
503
503
|
{
|
|
504
504
|
onClick: () => {
|
|
505
|
-
y(
|
|
505
|
+
y(s), S(g, s, c);
|
|
506
506
|
},
|
|
507
|
-
style: p
|
|
508
|
-
onMouseEnter: (
|
|
509
|
-
onMouseLeave: (
|
|
510
|
-
children: String(
|
|
507
|
+
style: w(p === s),
|
|
508
|
+
onMouseEnter: (b) => p !== s && (b.currentTarget.style.background = e.bg),
|
|
509
|
+
onMouseLeave: (b) => p !== s && (b.currentTarget.style.background = "transparent"),
|
|
510
|
+
children: String(s).padStart(2, "0")
|
|
511
511
|
},
|
|
512
|
-
|
|
512
|
+
s
|
|
513
513
|
)) })
|
|
514
514
|
] }),
|
|
515
|
-
u === 12 && /* @__PURE__ */
|
|
515
|
+
u === 12 && /* @__PURE__ */ x("div", { style: z, children: [
|
|
516
516
|
/* @__PURE__ */ t("span", { style: { fontSize: 11, fontWeight: 600, color: e.textMut }, children: "AM/PM" }),
|
|
517
|
-
/* @__PURE__ */ t("div", { style: { display: "flex", flexDirection: "column", border: `1px solid ${e.border}`, borderRadius: e.r, overflow: "hidden" }, children: ["AM", "PM"].map((
|
|
517
|
+
/* @__PURE__ */ t("div", { style: { display: "flex", flexDirection: "column", border: `1px solid ${e.border}`, borderRadius: e.r, overflow: "hidden" }, children: ["AM", "PM"].map((s) => /* @__PURE__ */ t(
|
|
518
518
|
"div",
|
|
519
519
|
{
|
|
520
520
|
onClick: () => {
|
|
521
|
-
k(
|
|
521
|
+
k(s), S(g, p, s);
|
|
522
522
|
},
|
|
523
|
-
style: { height: 40, display: "flex", alignItems: "center", justifyContent: "center", cursor: "pointer", padding: "0 12px", fontSize: 13, fontWeight:
|
|
524
|
-
children:
|
|
523
|
+
style: { height: 40, display: "flex", alignItems: "center", justifyContent: "center", cursor: "pointer", padding: "0 12px", fontSize: 13, fontWeight: c === s ? 700 : 400, background: c === s ? e.primary : e.surface, color: c === s ? "#fff" : e.text },
|
|
524
|
+
children: s
|
|
525
525
|
},
|
|
526
|
-
|
|
526
|
+
s
|
|
527
527
|
)) })
|
|
528
528
|
] })
|
|
529
529
|
] }),
|
|
530
|
-
/* @__PURE__ */
|
|
531
|
-
String(
|
|
530
|
+
/* @__PURE__ */ x("div", { style: { textAlign: "center", marginTop: 12, fontSize: 22, fontWeight: 700, color: e.primary, letterSpacing: 2 }, children: [
|
|
531
|
+
String(g).padStart(2, "0"),
|
|
532
532
|
":",
|
|
533
|
-
String(
|
|
534
|
-
u === 12 ? ` ${
|
|
533
|
+
String(p).padStart(2, "0"),
|
|
534
|
+
u === 12 ? ` ${c}` : ""
|
|
535
535
|
] }),
|
|
536
|
-
|
|
537
|
-
/* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-secondary", onClick:
|
|
538
|
-
/* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-primary", onClick: () =>
|
|
536
|
+
l && /* @__PURE__ */ x("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end", marginTop: 12 }, children: [
|
|
537
|
+
/* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-secondary", onClick: N, children: "Cancel" }),
|
|
538
|
+
/* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-primary", onClick: () => $ && (d == null ? void 0 : d($)), children: "Apply" })
|
|
539
539
|
] })
|
|
540
540
|
] });
|
|
541
541
|
}
|
|
542
|
-
function
|
|
543
|
-
|
|
544
|
-
const u = (
|
|
545
|
-
n.current && !n.current.contains(
|
|
542
|
+
function P(n, d) {
|
|
543
|
+
R(() => {
|
|
544
|
+
const u = (l) => {
|
|
545
|
+
n.current && !n.current.contains(l.target) && d(l);
|
|
546
546
|
};
|
|
547
547
|
return document.addEventListener("mousedown", u), () => document.removeEventListener("mousedown", u);
|
|
548
|
-
}, [n,
|
|
548
|
+
}, [n, d]);
|
|
549
549
|
}
|
|
550
|
-
function
|
|
551
|
-
const
|
|
550
|
+
function Le(n) {
|
|
551
|
+
const d = H(!1), u = H({ x: 0, y: 0, ox: 0, oy: 0 });
|
|
552
552
|
return B(
|
|
553
|
-
(
|
|
554
|
-
|
|
555
|
-
const
|
|
556
|
-
if (!
|
|
557
|
-
const { x: y, y:
|
|
558
|
-
n(k +
|
|
553
|
+
(l, f = 0, h = 0) => {
|
|
554
|
+
d.current = !0, u.current = { x: l.clientX, y: l.clientY, ox: f, oy: h };
|
|
555
|
+
const g = (p) => {
|
|
556
|
+
if (!d.current) return;
|
|
557
|
+
const { x: y, y: c, ox: k, oy: $ } = u.current;
|
|
558
|
+
n(k + p.clientX - y, $ + p.clientY - c);
|
|
559
559
|
}, r = () => {
|
|
560
|
-
|
|
560
|
+
d.current = !1, document.removeEventListener("mousemove", g), document.removeEventListener("mouseup", r);
|
|
561
561
|
};
|
|
562
|
-
document.addEventListener("mousemove",
|
|
562
|
+
document.addEventListener("mousemove", g), document.addEventListener("mouseup", r), l.preventDefault();
|
|
563
563
|
},
|
|
564
564
|
[n]
|
|
565
565
|
);
|
|
566
566
|
}
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
567
|
+
const De = ({ open: n }) => /* @__PURE__ */ t("svg", { width: "12", height: "12", viewBox: "0 0 12 12", style: { flexShrink: 0, transition: "transform .15s", transform: n ? "rotate(180deg)" : "rotate(0deg)" }, children: /* @__PURE__ */ t("path", { d: "M2 4l4 4 4-4", stroke: e.textMut, strokeWidth: "1.5", fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
568
|
+
function q({ data: n = [], value: d, placeholder: u = "Select or type...", multiselection: l = !1, label: f, onChange: h, style: g }) {
|
|
569
|
+
var T;
|
|
570
|
+
const [r, p] = I(!1), [y, c] = I(""), [k, $] = I(
|
|
571
|
+
l ? d ? [].concat(d) : [] : d || null
|
|
572
|
+
), m = H(null), o = H(null);
|
|
573
|
+
R(A, []), P(m, B(() => {
|
|
574
|
+
p(!1), c("");
|
|
575
|
+
}, []));
|
|
576
|
+
const v = K(
|
|
577
|
+
() => n.filter((a) => !y || a.value.toLowerCase().includes(y.toLowerCase())),
|
|
578
|
+
[n, y]
|
|
579
|
+
), S = (a) => l ? (k || []).includes(a) : k === a, N = (a) => {
|
|
580
|
+
const M = a.id || a.value;
|
|
581
|
+
if (l) {
|
|
582
|
+
const i = S(M) ? k.filter((C) => C !== M) : [...k || [], M];
|
|
583
|
+
$(i), h == null || h(i);
|
|
576
584
|
} else
|
|
577
|
-
|
|
578
|
-
},
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
585
|
+
$(M), c(""), p(!1), h == null || h(M);
|
|
586
|
+
}, z = (a) => {
|
|
587
|
+
const M = k.filter((i) => i !== a);
|
|
588
|
+
$(M), h == null || h(M);
|
|
589
|
+
}, w = () => {
|
|
590
|
+
p(!0), setTimeout(() => {
|
|
591
|
+
var a;
|
|
592
|
+
return (a = o.current) == null ? void 0 : a.focus();
|
|
593
|
+
}, 0);
|
|
594
|
+
}, s = ((T = n.find((a) => (a.id || a.value) === k)) == null ? void 0 : T.value) || "", b = l ? k || [] : [];
|
|
595
|
+
return /* @__PURE__ */ x("div", { ref: m, className: "dhx", style: { position: "relative", ...g }, children: [
|
|
596
|
+
f && /* @__PURE__ */ t("label", { className: "dhx dhx-label", children: f }),
|
|
597
|
+
/* @__PURE__ */ x(
|
|
598
|
+
"div",
|
|
599
|
+
{
|
|
600
|
+
onClick: w,
|
|
601
|
+
style: {
|
|
602
|
+
display: "flex",
|
|
603
|
+
alignItems: "center",
|
|
604
|
+
flexWrap: l ? "wrap" : "nowrap",
|
|
605
|
+
border: `1px solid ${r ? e.primary : e.border}`,
|
|
606
|
+
borderRadius: e.r,
|
|
607
|
+
minHeight: 34,
|
|
608
|
+
padding: "4px 8px",
|
|
609
|
+
cursor: "text",
|
|
610
|
+
background: e.surface,
|
|
611
|
+
gap: 4,
|
|
612
|
+
transition: "border-color .15s",
|
|
613
|
+
boxShadow: r ? `0 0 0 3px ${e.primary}22` : "none"
|
|
614
|
+
},
|
|
615
|
+
children: [
|
|
616
|
+
l && /* @__PURE__ */ x(ee, { children: [
|
|
617
|
+
b.map((a) => {
|
|
618
|
+
var M;
|
|
619
|
+
return /* @__PURE__ */ x("span", { style: {
|
|
620
|
+
display: "inline-flex",
|
|
621
|
+
alignItems: "center",
|
|
622
|
+
gap: 3,
|
|
623
|
+
background: e.primaryLt,
|
|
624
|
+
color: e.primary,
|
|
625
|
+
borderRadius: 3,
|
|
626
|
+
padding: "2px 6px",
|
|
627
|
+
fontSize: 12,
|
|
628
|
+
lineHeight: 1.4
|
|
629
|
+
}, children: [
|
|
630
|
+
((M = n.find((i) => (i.id || i.value) === a)) == null ? void 0 : M.value) || a,
|
|
631
|
+
/* @__PURE__ */ t(
|
|
632
|
+
"span",
|
|
633
|
+
{
|
|
634
|
+
onClick: (i) => {
|
|
635
|
+
i.stopPropagation(), z(a);
|
|
636
|
+
},
|
|
637
|
+
style: { cursor: "pointer", fontSize: 14, lineHeight: 1, opacity: 0.7 },
|
|
638
|
+
children: "×"
|
|
639
|
+
}
|
|
640
|
+
)
|
|
641
|
+
] }, a);
|
|
642
|
+
}),
|
|
643
|
+
/* @__PURE__ */ t(
|
|
644
|
+
"input",
|
|
645
|
+
{
|
|
646
|
+
ref: o,
|
|
647
|
+
value: y,
|
|
648
|
+
onChange: (a) => {
|
|
649
|
+
c(a.target.value), p(!0);
|
|
650
|
+
},
|
|
651
|
+
onFocus: () => p(!0),
|
|
652
|
+
onClick: (a) => a.stopPropagation(),
|
|
653
|
+
placeholder: b.length ? "" : u,
|
|
654
|
+
style: { flex: 1, minWidth: 60, border: "none", outline: "none", fontSize: 13, background: "transparent", color: e.text, padding: 0 }
|
|
655
|
+
}
|
|
656
|
+
)
|
|
657
|
+
] }),
|
|
658
|
+
!l && /* @__PURE__ */ t(
|
|
659
|
+
"input",
|
|
660
|
+
{
|
|
661
|
+
ref: o,
|
|
662
|
+
value: r ? y : s,
|
|
663
|
+
onChange: (a) => {
|
|
664
|
+
c(a.target.value), p(!0);
|
|
665
|
+
},
|
|
666
|
+
onFocus: () => {
|
|
667
|
+
p(!0), c("");
|
|
668
|
+
},
|
|
669
|
+
onClick: (a) => a.stopPropagation(),
|
|
670
|
+
placeholder: u,
|
|
671
|
+
style: { flex: 1, border: "none", outline: "none", fontSize: 13, background: "transparent", color: e.text, padding: 0 }
|
|
672
|
+
}
|
|
673
|
+
),
|
|
674
|
+
/* @__PURE__ */ t(De, { open: r })
|
|
675
|
+
]
|
|
676
|
+
}
|
|
677
|
+
),
|
|
678
|
+
r && /* @__PURE__ */ t("div", { className: "dhx dhx-anim-fade", style: {
|
|
679
|
+
position: "absolute",
|
|
680
|
+
top: "calc(100% + 4px)",
|
|
681
|
+
left: 0,
|
|
682
|
+
right: 0,
|
|
683
|
+
background: e.surface,
|
|
684
|
+
border: `1px solid ${e.border}`,
|
|
685
|
+
borderRadius: e.r,
|
|
686
|
+
boxShadow: e.shadowLg,
|
|
687
|
+
zIndex: 100
|
|
688
|
+
}, children: /* @__PURE__ */ x("div", { className: "dhx-scroll", style: { maxHeight: 220, overflowY: "auto" }, children: [
|
|
689
|
+
v.map((a) => {
|
|
690
|
+
const M = a.id || a.value, i = S(M);
|
|
691
|
+
return /* @__PURE__ */ x(
|
|
607
692
|
"div",
|
|
608
693
|
{
|
|
609
|
-
onClick: () =>
|
|
610
|
-
style: {
|
|
611
|
-
|
|
612
|
-
|
|
694
|
+
onClick: () => N(a),
|
|
695
|
+
style: {
|
|
696
|
+
padding: "8px 12px",
|
|
697
|
+
cursor: "pointer",
|
|
698
|
+
display: "flex",
|
|
699
|
+
alignItems: "center",
|
|
700
|
+
gap: 8,
|
|
701
|
+
fontSize: 13,
|
|
702
|
+
background: i ? e.primaryLt : "transparent",
|
|
703
|
+
color: i ? e.primary : e.text
|
|
704
|
+
},
|
|
705
|
+
onMouseEnter: (C) => !i && (C.currentTarget.style.background = e.bg),
|
|
706
|
+
onMouseLeave: (C) => !i && (C.currentTarget.style.background = "transparent"),
|
|
613
707
|
children: [
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
708
|
+
l && /* @__PURE__ */ t("span", { style: {
|
|
709
|
+
width: 14,
|
|
710
|
+
height: 14,
|
|
711
|
+
flexShrink: 0,
|
|
712
|
+
border: `2px solid ${i ? e.primary : e.borderDk}`,
|
|
713
|
+
borderRadius: 3,
|
|
714
|
+
display: "flex",
|
|
715
|
+
alignItems: "center",
|
|
716
|
+
justifyContent: "center",
|
|
717
|
+
background: i ? e.primary : "transparent"
|
|
718
|
+
}, children: i && /* @__PURE__ */ t("span", { style: { color: "#fff", fontSize: 9, lineHeight: 1 }, children: "✓" }) }),
|
|
719
|
+
/* @__PURE__ */ t("span", { style: { flex: 1 }, children: a.value }),
|
|
720
|
+
!l && i && /* @__PURE__ */ t("span", { style: { color: e.primary, fontSize: 12, fontWeight: 700 }, children: "✓" }),
|
|
721
|
+
a.count !== void 0 && /* @__PURE__ */ x("span", { style: { fontSize: 11, color: e.textMut }, children: [
|
|
617
722
|
"(",
|
|
618
|
-
|
|
723
|
+
a.count,
|
|
619
724
|
")"
|
|
620
725
|
] })
|
|
621
726
|
]
|
|
622
727
|
},
|
|
623
|
-
|
|
624
|
-
)
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
] })
|
|
728
|
+
M
|
|
729
|
+
);
|
|
730
|
+
}),
|
|
731
|
+
v.length === 0 && /* @__PURE__ */ t("div", { style: { padding: 16, textAlign: "center", color: e.textMut, fontSize: 13 }, children: "No matches" })
|
|
732
|
+
] }) })
|
|
628
733
|
] });
|
|
629
734
|
}
|
|
630
|
-
function
|
|
631
|
-
const [
|
|
632
|
-
|
|
633
|
-
const
|
|
735
|
+
function G({ min: n = 0, max: d = 100, step: u = 1, value: l, range: f = !1, label: h, tick: g, disabled: r = !1, onChange: p, style: y }) {
|
|
736
|
+
const [c, k] = I(l ?? (f ? [n, d] : n));
|
|
737
|
+
R(A, []);
|
|
738
|
+
const $ = (N, z) => {
|
|
634
739
|
if (!r)
|
|
635
|
-
if (
|
|
636
|
-
const
|
|
637
|
-
|
|
740
|
+
if (f) {
|
|
741
|
+
const w = [...c];
|
|
742
|
+
w[N] = z, k(w), p == null || p(w);
|
|
638
743
|
} else
|
|
639
|
-
k(
|
|
640
|
-
},
|
|
641
|
-
return /* @__PURE__ */
|
|
744
|
+
k(z), p == null || p(z);
|
|
745
|
+
}, m = (N) => (N - n) / (d - n) * 100, o = f ? c : [c], v = f ? { left: `${m(o[0])}%`, width: `${m(o[1]) - m(o[0])}%` } : { left: 0, width: `${m(o[0])}%` }, S = r ? e.border : e.primary;
|
|
746
|
+
return /* @__PURE__ */ x("div", { className: "dhx", style: { width: "100%", opacity: r ? 0.5 : 1, ...y }, children: [
|
|
642
747
|
h && /* @__PURE__ */ t("label", { className: "dhx dhx-label", children: h }),
|
|
643
|
-
/* @__PURE__ */ t("div", { style: { position: "relative", height: 36, display: "flex", alignItems: "center" }, children: /* @__PURE__ */
|
|
644
|
-
/* @__PURE__ */ t("div", { style: { position: "absolute",
|
|
645
|
-
|
|
748
|
+
/* @__PURE__ */ t("div", { style: { position: "relative", height: 36, display: "flex", alignItems: "center" }, children: /* @__PURE__ */ x("div", { style: { position: "relative", flex: 1, height: 4, background: e.border, borderRadius: 2 }, children: [
|
|
749
|
+
/* @__PURE__ */ t("div", { style: { position: "absolute", ...v, height: "100%", background: S, borderRadius: 2 } }),
|
|
750
|
+
o.map((N, z) => /* @__PURE__ */ t(
|
|
646
751
|
"input",
|
|
647
752
|
{
|
|
648
753
|
type: "range",
|
|
649
754
|
min: n,
|
|
650
|
-
max:
|
|
755
|
+
max: d,
|
|
651
756
|
step: u,
|
|
652
|
-
value:
|
|
757
|
+
value: N,
|
|
653
758
|
disabled: r,
|
|
654
|
-
onChange: (
|
|
655
|
-
const
|
|
656
|
-
|
|
759
|
+
onChange: (w) => {
|
|
760
|
+
const s = +w.target.value;
|
|
761
|
+
f && z === 0 && s >= c[1] || f && z === 1 && s <= c[0] || $(z, s);
|
|
657
762
|
},
|
|
658
763
|
style: { position: "absolute", width: "100%", height: "100%", opacity: 0, cursor: r ? "not-allowed" : "pointer", top: 0, left: 0, margin: 0 }
|
|
659
764
|
},
|
|
660
|
-
|
|
765
|
+
z
|
|
661
766
|
)),
|
|
662
|
-
|
|
767
|
+
o.map((N, z) => /* @__PURE__ */ t("div", { style: { position: "absolute", left: `${m(N)}%`, top: "50%", transform: "translate(-50%, -50%)", width: 16, height: 16, borderRadius: "50%", background: e.surface, border: `2px solid ${S}`, boxShadow: "0 1px 4px rgba(0,0,0,.2)", pointerEvents: "none" }, children: /* @__PURE__ */ t("div", { style: { position: "absolute", bottom: "calc(100% + 6px)", left: "50%", transform: "translateX(-50%)", background: r ? e.textMut : e.primaryDk, color: "#fff", padding: "2px 6px", borderRadius: e.r, fontSize: 11, fontWeight: 700, whiteSpace: "nowrap" }, children: N }) }, z))
|
|
663
768
|
] }) }),
|
|
664
|
-
|
|
769
|
+
g && /* @__PURE__ */ t("div", { style: { display: "flex", justifyContent: "space-between", marginTop: 2 }, children: [n, Math.round((d + n) / 2), d].map((N) => /* @__PURE__ */ t("span", { style: { fontSize: 10, color: e.textMut }, children: N }, N)) })
|
|
665
770
|
] });
|
|
666
771
|
}
|
|
667
|
-
const
|
|
668
|
-
function
|
|
669
|
-
const
|
|
670
|
-
let
|
|
671
|
-
const
|
|
672
|
-
if (
|
|
673
|
-
const y =
|
|
674
|
-
r =
|
|
772
|
+
const Re = ["#f44336", "#e91e63", "#9c27b0", "#673ab7", "#3f51b5", "#2196f3", "#03a9f4", "#00bcd4", "#009688", "#4caf50", "#8bc34a", "#cddc39", "#ffeb3b", "#ffc107", "#ff9800", "#ff5722", "#795548", "#607d8b", "#9e9e9e", "#000000", "#ffffff", "#0288d1", "#01579b", "#43a047", "#e53935", "#f57c00"];
|
|
773
|
+
function Y(n) {
|
|
774
|
+
const d = parseInt(n.slice(1, 3), 16) / 255, u = parseInt(n.slice(3, 5), 16) / 255, l = parseInt(n.slice(5, 7), 16) / 255, f = Math.max(d, u, l), h = Math.min(d, u, l);
|
|
775
|
+
let g = 0, r = 0;
|
|
776
|
+
const p = (f + h) / 2;
|
|
777
|
+
if (f !== h) {
|
|
778
|
+
const y = f - h;
|
|
779
|
+
r = p > 0.5 ? y / (2 - f - h) : y / (f + h), g = f === d ? ((u - l) / y + (u < l ? 6 : 0)) / 6 : f === u ? ((l - d) / y + 2) / 6 : ((d - u) / y + 4) / 6;
|
|
675
780
|
}
|
|
676
|
-
return [Math.round(
|
|
781
|
+
return [Math.round(g * 360), Math.round(r * 100), Math.round(p * 100)];
|
|
677
782
|
}
|
|
678
|
-
function
|
|
679
|
-
|
|
680
|
-
const
|
|
681
|
-
const
|
|
783
|
+
function J(n, d, u) {
|
|
784
|
+
d /= 100, u /= 100;
|
|
785
|
+
const l = d * Math.min(u, 1 - u), f = (h) => {
|
|
786
|
+
const g = (h + n / 30) % 12, r = u - l * Math.max(Math.min(g - 3, 9 - g, 1), -1);
|
|
682
787
|
return Math.round(255 * r).toString(16).padStart(2, "0");
|
|
683
788
|
};
|
|
684
|
-
return "#" +
|
|
789
|
+
return "#" + f(0) + f(8) + f(4);
|
|
685
790
|
}
|
|
686
|
-
function
|
|
687
|
-
const [
|
|
688
|
-
|
|
689
|
-
const
|
|
690
|
-
|
|
791
|
+
function Fe({ value: n = "#0288d1", onChange: d, style: u }) {
|
|
792
|
+
const [l, f] = I(() => Y(n)), h = J(...l);
|
|
793
|
+
R(A, []);
|
|
794
|
+
const g = (r) => {
|
|
795
|
+
f(r), d == null || d(J(...r));
|
|
691
796
|
};
|
|
692
|
-
return /* @__PURE__ */
|
|
693
|
-
/* @__PURE__ */ t("div", { style: { width: 200, height: 120, borderRadius: e.r, marginBottom: 12, background: `linear-gradient(to bottom, transparent, black), linear-gradient(to right, white, hsl(${
|
|
694
|
-
[["Hue", 0, 360,
|
|
695
|
-
/* @__PURE__ */
|
|
797
|
+
return /* @__PURE__ */ x("div", { className: "dhx", style: { background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.rMd, padding: 16, display: "inline-block", boxShadow: e.shadow, ...u }, children: [
|
|
798
|
+
/* @__PURE__ */ t("div", { style: { width: 200, height: 120, borderRadius: e.r, marginBottom: 12, background: `linear-gradient(to bottom, transparent, black), linear-gradient(to right, white, hsl(${l[0]},100%,50%))`, cursor: "crosshair" } }),
|
|
799
|
+
[["Hue", 0, 360, l[0]], ["Saturation", 0, 100, l[1]], ["Lightness", 0, 100, l[2]]].map(([r, p, y, c], k) => /* @__PURE__ */ x("div", { style: { marginBottom: k < 2 ? 8 : 12 }, children: [
|
|
800
|
+
/* @__PURE__ */ x("div", { className: "dhx dhx-label", children: [
|
|
696
801
|
r,
|
|
697
|
-
k > 0 ? ` (${
|
|
802
|
+
k > 0 ? ` (${c}%)` : ""
|
|
698
803
|
] }),
|
|
699
|
-
/* @__PURE__ */ t("input", { type: "range", min:
|
|
700
|
-
const
|
|
701
|
-
|
|
804
|
+
/* @__PURE__ */ t("input", { type: "range", min: p, max: y, value: c, onChange: ($) => {
|
|
805
|
+
const m = [...l];
|
|
806
|
+
m[k] = +$.target.value, g(m);
|
|
702
807
|
}, style: { width: "100%", accentColor: e.primary } })
|
|
703
808
|
] }, r)),
|
|
704
|
-
/* @__PURE__ */
|
|
809
|
+
/* @__PURE__ */ x("div", { style: { display: "flex", alignItems: "center", gap: 8, marginBottom: 12 }, children: [
|
|
705
810
|
/* @__PURE__ */ t("div", { style: { width: 36, height: 36, borderRadius: e.r, background: h, border: `1px solid ${e.border}`, flexShrink: 0 } }),
|
|
706
811
|
/* @__PURE__ */ t(
|
|
707
812
|
"input",
|
|
@@ -711,211 +816,211 @@ function Ke({ value: n = "#0288d1", onChange: s, style: u }) {
|
|
|
711
816
|
value: h,
|
|
712
817
|
onChange: (r) => {
|
|
713
818
|
try {
|
|
714
|
-
|
|
819
|
+
g(Y(r.target.value)), d == null || d(r.target.value);
|
|
715
820
|
} catch {
|
|
716
821
|
}
|
|
717
822
|
}
|
|
718
823
|
}
|
|
719
824
|
)
|
|
720
825
|
] }),
|
|
721
|
-
/* @__PURE__ */ t("div", { style: { display: "grid", gridTemplateColumns: "repeat(13, 1fr)", gap: 3 }, children:
|
|
826
|
+
/* @__PURE__ */ t("div", { style: { display: "grid", gridTemplateColumns: "repeat(13, 1fr)", gap: 3 }, children: Re.map((r) => /* @__PURE__ */ t(
|
|
722
827
|
"div",
|
|
723
828
|
{
|
|
724
829
|
onClick: () => {
|
|
725
|
-
|
|
830
|
+
f(Y(r)), d == null || d(r);
|
|
726
831
|
},
|
|
727
832
|
style: { width: 14, height: 14, borderRadius: 2, background: r, cursor: "pointer", border: h === r ? `2px solid ${e.text}` : "1px solid rgba(0,0,0,.15)", transition: "transform .1s" },
|
|
728
|
-
onMouseEnter: (
|
|
729
|
-
onMouseLeave: (
|
|
833
|
+
onMouseEnter: (p) => p.currentTarget.style.transform = "scale(1.3)",
|
|
834
|
+
onMouseLeave: (p) => p.currentTarget.style.transform = "scale(1)"
|
|
730
835
|
},
|
|
731
836
|
r
|
|
732
837
|
)) })
|
|
733
838
|
] });
|
|
734
839
|
}
|
|
735
|
-
function
|
|
736
|
-
const [
|
|
737
|
-
return /* @__PURE__ */ t("div", { className: "dhx dhx-anim-fade", style: { position: "absolute", top: "calc(100% + 4px)", left: 0, minWidth: 180, background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.r, boxShadow: e.shadowLg, zIndex: 200, padding: "4px 0", ...u }, children: n.map((h,
|
|
738
|
-
var
|
|
739
|
-
if (h.type === "separator") return /* @__PURE__ */ t("div", { style: { height: 1, background: e.border, margin: "4px 0" } },
|
|
740
|
-
const r =
|
|
741
|
-
return /* @__PURE__ */
|
|
742
|
-
/* @__PURE__ */
|
|
840
|
+
function O({ items: n, onSelect: d, style: u }) {
|
|
841
|
+
const [l, f] = I(null);
|
|
842
|
+
return /* @__PURE__ */ t("div", { className: "dhx dhx-anim-fade", style: { position: "absolute", top: "calc(100% + 4px)", left: 0, minWidth: 180, background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.r, boxShadow: e.shadowLg, zIndex: 200, padding: "4px 0", ...u }, children: n.map((h, g) => {
|
|
843
|
+
var p, y;
|
|
844
|
+
if (h.type === "separator") return /* @__PURE__ */ t("div", { style: { height: 1, background: e.border, margin: "4px 0" } }, g);
|
|
845
|
+
const r = l === g;
|
|
846
|
+
return /* @__PURE__ */ x("div", { style: { position: "relative" }, onMouseEnter: () => f(g), onMouseLeave: () => f(null), children: [
|
|
847
|
+
/* @__PURE__ */ x(
|
|
743
848
|
"div",
|
|
744
849
|
{
|
|
745
850
|
onClick: () => {
|
|
746
|
-
var
|
|
747
|
-
return !h.disabled && !((
|
|
851
|
+
var c;
|
|
852
|
+
return !h.disabled && !((c = h.items) != null && c.length) && d(h);
|
|
748
853
|
},
|
|
749
854
|
style: { display: "flex", alignItems: "center", gap: 8, padding: "8px 14px", cursor: h.disabled ? "not-allowed" : "pointer", fontSize: 13, color: h.disabled ? e.textMut : e.text, background: r && !h.disabled ? e.bg : "transparent", opacity: h.disabled ? 0.5 : 1 },
|
|
750
855
|
children: [
|
|
751
856
|
h.icon && /* @__PURE__ */ t("span", { style: { fontSize: 15, width: 18, textAlign: "center" }, children: h.icon }),
|
|
752
857
|
/* @__PURE__ */ t("span", { style: { flex: 1 }, children: h.value || h.id }),
|
|
753
858
|
h.hotkey && /* @__PURE__ */ t("span", { style: { fontSize: 11, color: e.textMut }, children: h.hotkey }),
|
|
754
|
-
(
|
|
859
|
+
(p = h.items) != null && p.length ? /* @__PURE__ */ t("span", { style: { fontSize: 10, color: e.textMut }, children: "▶" }) : null
|
|
755
860
|
]
|
|
756
861
|
}
|
|
757
862
|
),
|
|
758
|
-
r && ((y = h.items) != null && y.length) ? /* @__PURE__ */ t(
|
|
759
|
-
] }, h.id ||
|
|
863
|
+
r && ((y = h.items) != null && y.length) ? /* @__PURE__ */ t(O, { items: h.items, onSelect: d, style: { position: "absolute", left: "100%", top: -4 } }) : null
|
|
864
|
+
] }, h.id || g);
|
|
760
865
|
}) });
|
|
761
866
|
}
|
|
762
|
-
function
|
|
763
|
-
const [
|
|
764
|
-
return
|
|
765
|
-
/* @__PURE__ */
|
|
766
|
-
|
|
867
|
+
function Ve({ items: n = [], label: d = "Menu", onSelect: u, style: l }) {
|
|
868
|
+
const [f, h] = I(!1), g = H(null);
|
|
869
|
+
return R(A, []), P(g, B(() => h(!1), [])), /* @__PURE__ */ x("div", { ref: g, className: "dhx", style: { position: "relative", display: "inline-block", ...l }, children: [
|
|
870
|
+
/* @__PURE__ */ x("button", { className: "dhx dhx-btn dhx-btn-secondary", onClick: () => h((r) => !r), children: [
|
|
871
|
+
d,
|
|
767
872
|
" ",
|
|
768
|
-
/* @__PURE__ */ t("span", { style: { fontSize: 10 }, children:
|
|
873
|
+
/* @__PURE__ */ t("span", { style: { fontSize: 10 }, children: f ? "▲" : "▼" })
|
|
769
874
|
] }),
|
|
770
|
-
|
|
875
|
+
f && /* @__PURE__ */ t(O, { items: n, onSelect: (r) => {
|
|
771
876
|
u == null || u(r), h(!1);
|
|
772
877
|
} })
|
|
773
878
|
] });
|
|
774
879
|
}
|
|
775
|
-
function
|
|
776
|
-
const [
|
|
777
|
-
return
|
|
778
|
-
r.preventDefault(),
|
|
880
|
+
function Xe({ items: n = [], onSelect: d, children: u }) {
|
|
881
|
+
const [l, f] = I(null), h = H(null);
|
|
882
|
+
return R(A, []), P(h, B(() => f(null), [])), /* @__PURE__ */ x("div", { ref: h, onContextMenu: (r) => {
|
|
883
|
+
r.preventDefault(), f({ x: r.clientX, y: r.clientY });
|
|
779
884
|
}, style: { position: "relative", display: "contents" }, children: [
|
|
780
885
|
u,
|
|
781
|
-
|
|
782
|
-
|
|
886
|
+
l && /* @__PURE__ */ t("div", { style: { position: "fixed", left: l.x, top: l.y, zIndex: 9999 }, children: /* @__PURE__ */ t(O, { items: n, onSelect: (r) => {
|
|
887
|
+
d == null || d(r), f(null);
|
|
783
888
|
} }) })
|
|
784
889
|
] });
|
|
785
890
|
}
|
|
786
|
-
function
|
|
787
|
-
const [
|
|
788
|
-
return
|
|
891
|
+
function qe({ trigger: n, children: d, placement: u = "bottom-start", style: l }) {
|
|
892
|
+
const [f, h] = I(!1), [g, r] = I({ top: "100%", left: 0 }), p = H(null), y = H(null);
|
|
893
|
+
return R(A, []), P(p, B(() => h(!1), [])), /* @__PURE__ */ x("div", { ref: p, className: "dhx", style: { position: "relative", display: "inline-block" }, children: [
|
|
789
894
|
/* @__PURE__ */ t("div", { ref: y, onClick: () => {
|
|
790
895
|
h((k) => {
|
|
791
896
|
if (!k && y.current) {
|
|
792
|
-
const
|
|
793
|
-
"bottom-start": { top:
|
|
794
|
-
"bottom-end": { top:
|
|
795
|
-
"top-start": { bottom:
|
|
897
|
+
const $ = y.current.getBoundingClientRect(), m = {
|
|
898
|
+
"bottom-start": { top: $.height + 4, left: 0 },
|
|
899
|
+
"bottom-end": { top: $.height + 4, right: 0, left: "auto" },
|
|
900
|
+
"top-start": { bottom: $.height + 4, top: "auto", left: 0 }
|
|
796
901
|
};
|
|
797
|
-
r(
|
|
902
|
+
r(m[u] || m["bottom-start"]);
|
|
798
903
|
}
|
|
799
904
|
return !k;
|
|
800
905
|
});
|
|
801
906
|
}, children: n }),
|
|
802
|
-
|
|
907
|
+
f && /* @__PURE__ */ t("div", { className: "dhx dhx-anim-fade", style: { position: "absolute", ...g, zIndex: 200, background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.rMd, boxShadow: e.shadowLg, ...l }, children: d })
|
|
803
908
|
] });
|
|
804
909
|
}
|
|
805
|
-
function
|
|
806
|
-
const [k,
|
|
807
|
-
|
|
808
|
-
const
|
|
809
|
-
|
|
910
|
+
function Ge({ title: n, children: d, width: u = 480, height: l, closable: f = !0, movable: h = !0, modal: g = !1, defaultOpen: r = !0, footer: p, onClose: y, style: c }) {
|
|
911
|
+
const [k, $] = I(r), [m, o] = I({ x: 0, y: 0 });
|
|
912
|
+
R(A, []);
|
|
913
|
+
const v = Le(B((N, z) => h && o({ x: N, y: z }), [h])), S = () => {
|
|
914
|
+
$(!1), y == null || y();
|
|
810
915
|
};
|
|
811
|
-
return k ? /* @__PURE__ */
|
|
812
|
-
|
|
813
|
-
/* @__PURE__ */
|
|
814
|
-
/* @__PURE__ */
|
|
916
|
+
return k ? /* @__PURE__ */ x(ee, { children: [
|
|
917
|
+
g && /* @__PURE__ */ t("div", { style: { position: "fixed", inset: 0, background: "rgba(0,0,0,.45)", zIndex: 900 }, onClick: f ? S : void 0 }),
|
|
918
|
+
/* @__PURE__ */ x("div", { className: "dhx", style: { position: g ? "fixed" : "absolute", left: g ? "50%" : `calc(50% + ${m.x}px)`, top: g ? "50%" : `calc(50% + ${m.y}px)`, transform: `translate(calc(-50% + ${m.x}px), calc(-50% + ${m.y}px))`, width: u, ...l ? { height: l } : {}, background: e.surface, borderRadius: e.rMd, boxShadow: e.shadowLg, zIndex: 901, display: "flex", flexDirection: "column", overflow: "hidden", ...c }, children: [
|
|
919
|
+
/* @__PURE__ */ x("div", { onMouseDown: (N) => v(N, m.x, m.y), style: { display: "flex", alignItems: "center", padding: "12px 16px", borderBottom: `1px solid ${e.border}`, cursor: h ? "grab" : "default", background: e.bg, gap: 8, userSelect: "none" }, children: [
|
|
815
920
|
/* @__PURE__ */ t("span", { style: { flex: 1, fontWeight: 700, fontSize: 15 }, children: n }),
|
|
816
|
-
|
|
921
|
+
f && /* @__PURE__ */ t(
|
|
817
922
|
"button",
|
|
818
923
|
{
|
|
819
924
|
onClick: S,
|
|
820
925
|
style: { background: "none", border: "none", cursor: "pointer", width: 28, height: 28, borderRadius: e.r, display: "flex", alignItems: "center", justifyContent: "center", fontSize: 18, color: e.textSec },
|
|
821
|
-
onMouseEnter: (
|
|
822
|
-
onMouseLeave: (
|
|
926
|
+
onMouseEnter: (N) => N.currentTarget.style.background = e.border,
|
|
927
|
+
onMouseLeave: (N) => N.currentTarget.style.background = "none",
|
|
823
928
|
children: "×"
|
|
824
929
|
}
|
|
825
930
|
)
|
|
826
931
|
] }),
|
|
827
|
-
/* @__PURE__ */ t("div", { className: "dhx-scroll", style: { flex: 1, minHeight: 0, padding: 20, overflowY: "auto" }, children:
|
|
828
|
-
|
|
932
|
+
/* @__PURE__ */ t("div", { className: "dhx-scroll", style: { flex: 1, minHeight: 0, padding: 20, overflowY: "auto" }, children: d }),
|
|
933
|
+
p && /* @__PURE__ */ t("div", { style: { padding: "12px 16px", borderTop: `1px solid ${e.border}`, display: "flex", justifyContent: "flex-end", gap: 8, background: e.bg }, children: p })
|
|
829
934
|
] })
|
|
830
935
|
] }) : null;
|
|
831
936
|
}
|
|
832
|
-
const
|
|
833
|
-
function
|
|
834
|
-
const [
|
|
835
|
-
|
|
836
|
-
const
|
|
937
|
+
const te = oe(null), We = { success: "✓", error: "✕", warning: "⚠", info: "ℹ" }, U = { success: e.success, error: e.danger, warning: e.warning, info: e.primary };
|
|
938
|
+
function Je({ children: n }) {
|
|
939
|
+
const [d, u] = I([]);
|
|
940
|
+
R(A, []);
|
|
941
|
+
const l = B((g) => u((r) => r.filter((p) => p.id !== g)), []), f = B((g) => {
|
|
837
942
|
const r = Date.now();
|
|
838
|
-
return u((
|
|
839
|
-
}, [
|
|
840
|
-
message:
|
|
841
|
-
alert: (
|
|
842
|
-
confirm: (
|
|
943
|
+
return u((p) => [...p, { id: r, ...g }]), g.duration !== 0 && setTimeout(() => l(r), g.duration || 4e3), r;
|
|
944
|
+
}, [l]), h = {
|
|
945
|
+
message: f,
|
|
946
|
+
alert: (g, r) => f({ type: "info", title: g, ...r }),
|
|
947
|
+
confirm: (g, r, p) => f({ type: "warning", title: g, confirm: r, ...p })
|
|
843
948
|
};
|
|
844
|
-
return /* @__PURE__ */
|
|
949
|
+
return /* @__PURE__ */ x(te.Provider, { value: h, children: [
|
|
845
950
|
n,
|
|
846
|
-
/* @__PURE__ */ t("div", { style: { position: "fixed", top: 20, right: 20, zIndex: 9999, display: "flex", flexDirection: "column", gap: 8, pointerEvents: "none" }, children:
|
|
847
|
-
const r =
|
|
848
|
-
return /* @__PURE__ */
|
|
849
|
-
/* @__PURE__ */ t("span", { style: { fontSize: 18, color:
|
|
850
|
-
/* @__PURE__ */
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
951
|
+
/* @__PURE__ */ t("div", { style: { position: "fixed", top: 20, right: 20, zIndex: 9999, display: "flex", flexDirection: "column", gap: 8, pointerEvents: "none" }, children: d.map((g) => {
|
|
952
|
+
const r = g.type || "info";
|
|
953
|
+
return /* @__PURE__ */ x("div", { style: { background: e.surface, border: `1px solid ${e.border}`, borderLeft: `4px solid ${U[r]}`, borderRadius: e.r, boxShadow: e.shadowLg, padding: "12px 16px", minWidth: 280, maxWidth: 380, pointerEvents: "all", display: "flex", gap: 10, alignItems: "flex-start", animation: "dhx-toast .3s ease" }, children: [
|
|
954
|
+
/* @__PURE__ */ t("span", { style: { fontSize: 18, color: U[r], lineHeight: 1 }, children: We[r] }),
|
|
955
|
+
/* @__PURE__ */ x("div", { style: { flex: 1 }, children: [
|
|
956
|
+
g.title && /* @__PURE__ */ t("div", { style: { fontWeight: 600, fontSize: 13, marginBottom: g.text ? 3 : 0 }, children: g.title }),
|
|
957
|
+
g.text && /* @__PURE__ */ t("div", { style: { fontSize: 12, color: e.textSec, lineHeight: 1.5 }, children: g.text }),
|
|
958
|
+
g.confirm && /* @__PURE__ */ x("div", { style: { display: "flex", gap: 6, marginTop: 8 }, children: [
|
|
854
959
|
/* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-primary", style: { height: 26, fontSize: 12 }, onClick: () => {
|
|
855
|
-
|
|
960
|
+
g.confirm(!0), l(g.id);
|
|
856
961
|
}, children: "Confirm" }),
|
|
857
962
|
/* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-secondary", style: { height: 26, fontSize: 12 }, onClick: () => {
|
|
858
|
-
|
|
963
|
+
g.confirm(!1), l(g.id);
|
|
859
964
|
}, children: "Cancel" })
|
|
860
965
|
] })
|
|
861
966
|
] }),
|
|
862
|
-
/* @__PURE__ */ t("button", { onClick: () =>
|
|
863
|
-
] },
|
|
967
|
+
/* @__PURE__ */ t("button", { onClick: () => l(g.id), style: { background: "none", border: "none", cursor: "pointer", color: e.textMut, fontSize: 14, lineHeight: 1, padding: 0 }, children: "×" })
|
|
968
|
+
] }, g.id);
|
|
864
969
|
}) })
|
|
865
970
|
] });
|
|
866
971
|
}
|
|
867
|
-
function
|
|
868
|
-
const n =
|
|
972
|
+
function Ue() {
|
|
973
|
+
const n = ie(te);
|
|
869
974
|
if (!n) throw new Error("useMessage must be used inside <MessageProvider>");
|
|
870
975
|
return n;
|
|
871
976
|
}
|
|
872
|
-
function
|
|
873
|
-
const [y,
|
|
874
|
-
|
|
875
|
-
const
|
|
876
|
-
const
|
|
877
|
-
|
|
878
|
-
const
|
|
879
|
-
return
|
|
880
|
-
}), S(
|
|
881
|
-
},
|
|
882
|
-
r == null || r({ ...
|
|
977
|
+
function Qe({ data: n = [], template: d, keyNavigation: u = !0, multiselection: l = !1, editable: f = !1, height: h = 400, onSelect: g, onEdit: r, style: p }) {
|
|
978
|
+
const [y, c] = I(/* @__PURE__ */ new Set()), [k, $] = I(null), [m, o] = I(""), [v, S] = I(null);
|
|
979
|
+
R(A, []);
|
|
980
|
+
const N = (w, s) => {
|
|
981
|
+
const b = w.id ?? s;
|
|
982
|
+
c((T) => {
|
|
983
|
+
const a = l ? new Set(T) : /* @__PURE__ */ new Set();
|
|
984
|
+
return a.has(b) ? a.delete(b) : a.add(b), a;
|
|
985
|
+
}), S(s), g == null || g(w);
|
|
986
|
+
}, z = (w, s) => {
|
|
987
|
+
r == null || r({ ...w, value: m }, s), $(null);
|
|
883
988
|
};
|
|
884
|
-
return /* @__PURE__ */
|
|
989
|
+
return /* @__PURE__ */ x(
|
|
885
990
|
"div",
|
|
886
991
|
{
|
|
887
992
|
className: "dhx dhx-scroll",
|
|
888
|
-
style: { height: h, overflowY: "auto", border: `1px solid ${e.border}`, borderRadius: e.r, background: e.surface, ...
|
|
993
|
+
style: { height: h, overflowY: "auto", border: `1px solid ${e.border}`, borderRadius: e.r, background: e.surface, ...p },
|
|
889
994
|
tabIndex: 0,
|
|
890
|
-
onKeyDown: (
|
|
891
|
-
u && (
|
|
995
|
+
onKeyDown: (w) => {
|
|
996
|
+
u && (w.key === "ArrowDown" && S((s) => Math.min((s ?? -1) + 1, n.length - 1)), w.key === "ArrowUp" && S((s) => Math.max((s ?? 1) - 1, 0)));
|
|
892
997
|
},
|
|
893
998
|
children: [
|
|
894
|
-
n.map((
|
|
895
|
-
const
|
|
999
|
+
n.map((w, s) => {
|
|
1000
|
+
const b = w.id ?? s, T = y.has(b), a = v === s;
|
|
896
1001
|
return /* @__PURE__ */ t(
|
|
897
1002
|
"div",
|
|
898
1003
|
{
|
|
899
|
-
onClick: () =>
|
|
900
|
-
onDoubleClick: () =>
|
|
901
|
-
style: { display: "flex", alignItems: "center", padding: "0 12px", height: 40, cursor: "pointer", fontSize: 13, borderBottom: `1px solid ${e.border}`, background:
|
|
902
|
-
children: k ===
|
|
1004
|
+
onClick: () => N(w, s),
|
|
1005
|
+
onDoubleClick: () => f && ($(s), o(String(w.value || ""))),
|
|
1006
|
+
style: { display: "flex", alignItems: "center", padding: "0 12px", height: 40, cursor: "pointer", fontSize: 13, borderBottom: `1px solid ${e.border}`, background: T ? e.primaryLt : a ? e.bg : e.surface, color: T ? e.primary : e.text, outline: a ? `2px solid ${e.primary}44` : "none", transition: "background .1s" },
|
|
1007
|
+
children: k === s ? /* @__PURE__ */ t(
|
|
903
1008
|
"input",
|
|
904
1009
|
{
|
|
905
1010
|
autoFocus: !0,
|
|
906
1011
|
className: "dhx dhx-input",
|
|
907
1012
|
style: { height: 28, flex: 1 },
|
|
908
|
-
value:
|
|
909
|
-
onChange: (
|
|
910
|
-
onBlur: () =>
|
|
911
|
-
onKeyDown: (
|
|
912
|
-
|
|
1013
|
+
value: m,
|
|
1014
|
+
onChange: (M) => o(M.target.value),
|
|
1015
|
+
onBlur: () => z(w, s),
|
|
1016
|
+
onKeyDown: (M) => {
|
|
1017
|
+
M.key === "Enter" && z(w, s), M.key === "Escape" && $(null);
|
|
913
1018
|
},
|
|
914
|
-
onClick: (
|
|
1019
|
+
onClick: (M) => M.stopPropagation()
|
|
915
1020
|
}
|
|
916
|
-
) :
|
|
1021
|
+
) : d ? /* @__PURE__ */ t("div", { dangerouslySetInnerHTML: { __html: d(w) }, style: { flex: 1 } }) : /* @__PURE__ */ t("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: String(w.value ?? "") })
|
|
917
1022
|
},
|
|
918
|
-
String(
|
|
1023
|
+
String(b)
|
|
919
1024
|
);
|
|
920
1025
|
}),
|
|
921
1026
|
n.length === 0 && /* @__PURE__ */ t("div", { style: { padding: 24, textAlign: "center", color: e.textMut }, children: "No items" })
|
|
@@ -923,262 +1028,407 @@ function Je({ data: n = [], template: s, keyNavigation: u = !0, multiselection:
|
|
|
923
1028
|
}
|
|
924
1029
|
);
|
|
925
1030
|
}
|
|
926
|
-
function
|
|
927
|
-
const [r,
|
|
928
|
-
|
|
929
|
-
const y = (
|
|
930
|
-
const k =
|
|
931
|
-
|
|
932
|
-
const
|
|
933
|
-
return
|
|
934
|
-
}), h == null || h(
|
|
1031
|
+
function Ze({ data: n = [], template: d, itemsInRow: u = 3, gap: l = 12, multiselection: f = !1, onSelect: h, style: g }) {
|
|
1032
|
+
const [r, p] = I(/* @__PURE__ */ new Set());
|
|
1033
|
+
R(A, []);
|
|
1034
|
+
const y = (c) => {
|
|
1035
|
+
const k = c.id ?? String(c.title);
|
|
1036
|
+
p(($) => {
|
|
1037
|
+
const m = f ? new Set($) : /* @__PURE__ */ new Set();
|
|
1038
|
+
return m.has(k) ? m.delete(k) : m.add(k), m;
|
|
1039
|
+
}), h == null || h(c);
|
|
935
1040
|
};
|
|
936
|
-
return /* @__PURE__ */ t("div", { className: "dhx", style: { display: "grid", gridTemplateColumns: `repeat(${u}, 1fr)`, gap:
|
|
937
|
-
const
|
|
1041
|
+
return /* @__PURE__ */ t("div", { className: "dhx", style: { display: "grid", gridTemplateColumns: `repeat(${u}, 1fr)`, gap: l, padding: l, ...g }, children: n.map((c, k) => {
|
|
1042
|
+
const $ = c.id ?? k, m = r.has($);
|
|
938
1043
|
return /* @__PURE__ */ t(
|
|
939
1044
|
"div",
|
|
940
1045
|
{
|
|
941
|
-
onClick: () => y(
|
|
942
|
-
style: { background: e.surface, border: `2px solid ${
|
|
943
|
-
onMouseEnter: (
|
|
944
|
-
|
|
1046
|
+
onClick: () => y(c),
|
|
1047
|
+
style: { background: e.surface, border: `2px solid ${m ? e.primary : e.border}`, borderRadius: e.rMd, overflow: "hidden", cursor: "pointer", transition: "all .15s", boxShadow: m ? `0 0 0 3px ${e.primary}33` : e.shadow, transform: m ? "translateY(-2px)" : "none" },
|
|
1048
|
+
onMouseEnter: (o) => {
|
|
1049
|
+
o.currentTarget.style.boxShadow = e.shadowLg, o.currentTarget.style.transform = "translateY(-2px)";
|
|
945
1050
|
},
|
|
946
|
-
onMouseLeave: (
|
|
947
|
-
|
|
1051
|
+
onMouseLeave: (o) => {
|
|
1052
|
+
o.currentTarget.style.boxShadow = m ? `0 0 0 3px ${e.primary}33` : e.shadow, o.currentTarget.style.transform = m ? "translateY(-2px)" : "none";
|
|
948
1053
|
},
|
|
949
|
-
children:
|
|
950
|
-
|
|
951
|
-
/* @__PURE__ */ t("div", { style: { fontWeight: 600, fontSize: 14, marginBottom: 4 }, children:
|
|
952
|
-
|
|
1054
|
+
children: d ? /* @__PURE__ */ t("div", { dangerouslySetInnerHTML: { __html: d(c) } }) : /* @__PURE__ */ x("div", { style: { padding: 16 }, children: [
|
|
1055
|
+
c.img && /* @__PURE__ */ t("img", { src: c.img, alt: c.title || "", style: { width: "100%", borderRadius: e.r, marginBottom: 8, display: "block" } }),
|
|
1056
|
+
/* @__PURE__ */ t("div", { style: { fontWeight: 600, fontSize: 14, marginBottom: 4 }, children: c.title || c.value }),
|
|
1057
|
+
c.subtitle && /* @__PURE__ */ t("div", { style: { fontSize: 12, color: e.textSec }, children: c.subtitle })
|
|
953
1058
|
] })
|
|
954
1059
|
},
|
|
955
|
-
String(
|
|
1060
|
+
String($)
|
|
956
1061
|
);
|
|
957
1062
|
}) });
|
|
958
1063
|
}
|
|
959
|
-
function
|
|
960
|
-
const [
|
|
961
|
-
|
|
962
|
-
const S = (
|
|
963
|
-
k((
|
|
964
|
-
},
|
|
965
|
-
var
|
|
966
|
-
const
|
|
967
|
-
return /* @__PURE__ */
|
|
968
|
-
/* @__PURE__ */
|
|
1064
|
+
function et({ data: n = [], checkbox: d = !1, editable: u = !1, onSelect: l, onCheck: f, style: h }) {
|
|
1065
|
+
const [g, r] = I({}), [p, y] = I(null), [c, k] = I({}), [$, m] = I(null), [o, v] = I("");
|
|
1066
|
+
R(A, []);
|
|
1067
|
+
const S = (w) => r((s) => ({ ...s, [w]: !s[w] })), N = (w, s) => {
|
|
1068
|
+
k((b) => ({ ...b, [w]: s })), f == null || f(w, s);
|
|
1069
|
+
}, z = (w, s = 0) => {
|
|
1070
|
+
var M;
|
|
1071
|
+
const b = (((M = w.items) == null ? void 0 : M.length) ?? 0) > 0, T = g[w.id], a = p === w.id;
|
|
1072
|
+
return /* @__PURE__ */ x("div", { children: [
|
|
1073
|
+
/* @__PURE__ */ x(
|
|
969
1074
|
"div",
|
|
970
1075
|
{
|
|
971
1076
|
onClick: () => {
|
|
972
|
-
y(
|
|
1077
|
+
y(w.id), l == null || l(w), b && S(w.id);
|
|
973
1078
|
},
|
|
974
1079
|
onDoubleClick: () => {
|
|
975
|
-
u && (
|
|
1080
|
+
u && (m(w.id), v(w.value || ""));
|
|
976
1081
|
},
|
|
977
|
-
style: { display: "flex", alignItems: "center", gap: 4, padding: `5px 8px 5px ${12 +
|
|
978
|
-
onMouseEnter: (
|
|
979
|
-
onMouseLeave: (
|
|
1082
|
+
style: { display: "flex", alignItems: "center", gap: 4, padding: `5px 8px 5px ${12 + s * 18}px`, cursor: "pointer", borderRadius: e.r, margin: "1px 4px", background: a ? e.primaryLt : "transparent", color: a ? e.primary : e.text, userSelect: "none", fontSize: 13 },
|
|
1083
|
+
onMouseEnter: (i) => !a && (i.currentTarget.style.background = e.bg),
|
|
1084
|
+
onMouseLeave: (i) => !a && (i.currentTarget.style.background = "transparent"),
|
|
980
1085
|
children: [
|
|
981
|
-
/* @__PURE__ */ t("span", { style: { width: 16, textAlign: "center", fontSize: 11, color: e.textMut, flexShrink: 0 }, children:
|
|
982
|
-
/* @__PURE__ */ t("span", { style: { fontSize: 15, flexShrink: 0 }, children:
|
|
983
|
-
|
|
984
|
-
|
|
985
|
-
}, style: { cursor: "pointer", accentColor: e.primary }, onClick: (
|
|
986
|
-
|
|
987
|
-
|
|
1086
|
+
/* @__PURE__ */ t("span", { style: { width: 16, textAlign: "center", fontSize: 11, color: e.textMut, flexShrink: 0 }, children: b ? T ? "▾" : "▸" : "" }),
|
|
1087
|
+
/* @__PURE__ */ t("span", { style: { fontSize: 15, flexShrink: 0 }, children: b ? T ? "📂" : "📁" : "📄" }),
|
|
1088
|
+
d && /* @__PURE__ */ t("input", { type: "checkbox", checked: !!c[w.id], onChange: (i) => {
|
|
1089
|
+
i.stopPropagation(), N(w.id, i.target.checked);
|
|
1090
|
+
}, style: { cursor: "pointer", accentColor: e.primary }, onClick: (i) => i.stopPropagation() }),
|
|
1091
|
+
$ === w.id ? /* @__PURE__ */ t("input", { autoFocus: !0, className: "dhx dhx-input", style: { height: 24, fontSize: 12, flex: 1 }, value: o, onChange: (i) => v(i.target.value), onBlur: () => m(null), onKeyDown: (i) => i.key === "Enter" && m(null), onClick: (i) => i.stopPropagation() }) : /* @__PURE__ */ t("span", { style: { flex: 1 }, children: w.value }),
|
|
1092
|
+
w.count !== void 0 && /* @__PURE__ */ x("span", { style: { fontSize: 11, color: e.textMut }, children: [
|
|
988
1093
|
"(",
|
|
989
|
-
|
|
1094
|
+
w.count,
|
|
990
1095
|
")"
|
|
991
1096
|
] })
|
|
992
1097
|
]
|
|
993
1098
|
}
|
|
994
1099
|
),
|
|
995
|
-
|
|
996
|
-
] },
|
|
1100
|
+
b && T && /* @__PURE__ */ t("div", { children: w.items.map((i) => z(i, s + 1)) })
|
|
1101
|
+
] }, w.id);
|
|
997
1102
|
};
|
|
998
|
-
return /* @__PURE__ */ t("div", { className: "dhx dhx-scroll", style: { overflowY: "auto", ...h }, children: n.map((
|
|
1103
|
+
return /* @__PURE__ */ t("div", { className: "dhx dhx-scroll", style: { overflowY: "auto", ...h }, children: n.map((w) => z(w)) });
|
|
999
1104
|
}
|
|
1000
|
-
function
|
|
1001
|
-
const [h,
|
|
1002
|
-
|
|
1003
|
-
const
|
|
1004
|
-
const k = Math.min(Math.max(1,
|
|
1005
|
-
|
|
1105
|
+
function tt({ total: n, pageSize: d = 10, page: u, onChange: l, style: f }) {
|
|
1106
|
+
const [h, g] = I(u || 1), r = Math.ceil(n / d);
|
|
1107
|
+
R(A, []);
|
|
1108
|
+
const p = (c) => {
|
|
1109
|
+
const k = Math.min(Math.max(1, c), r);
|
|
1110
|
+
g(k), l == null || l(k);
|
|
1006
1111
|
}, y = K(() => {
|
|
1007
|
-
const
|
|
1008
|
-
for (let
|
|
1009
|
-
return
|
|
1112
|
+
const c = [];
|
|
1113
|
+
for (let $ = Math.max(1, h - 2); $ <= Math.min(r, h + 2); $++) c.push($);
|
|
1114
|
+
return c[0] > 1 && (c[0] > 2 && c.unshift("..."), c.unshift(1)), c[c.length - 1] < r && (c[c.length - 1] < r - 1 && c.push("..."), c.push(r)), c;
|
|
1010
1115
|
}, [h, r]);
|
|
1011
|
-
return /* @__PURE__ */
|
|
1012
|
-
/* @__PURE__ */
|
|
1013
|
-
(h - 1) *
|
|
1116
|
+
return /* @__PURE__ */ x("div", { className: "dhx", style: { display: "flex", alignItems: "center", gap: 4, padding: "8px 12px", ...f }, children: [
|
|
1117
|
+
/* @__PURE__ */ x("span", { style: { fontSize: 12, color: e.textSec, marginRight: 8 }, children: [
|
|
1118
|
+
(h - 1) * d + 1,
|
|
1014
1119
|
"–",
|
|
1015
|
-
Math.min(h *
|
|
1120
|
+
Math.min(h * d, n),
|
|
1016
1121
|
" of ",
|
|
1017
1122
|
n
|
|
1018
1123
|
] }),
|
|
1019
|
-
[["«", 1], ["‹", h - 1]].map(([
|
|
1020
|
-
y.map((
|
|
1021
|
-
[["›", h + 1], ["»", r]].map(([
|
|
1124
|
+
[["«", 1], ["‹", h - 1]].map(([c, k]) => /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-ghost", style: { height: 30, padding: "0 8px", fontSize: 14 }, disabled: h === 1, onClick: () => p(k), children: c }, c)),
|
|
1125
|
+
y.map((c, k) => /* @__PURE__ */ t("button", { onClick: () => typeof c == "number" && p(c), className: `dhx dhx-btn ${c === h ? "dhx-btn-primary" : "dhx-btn-ghost"}`, style: { height: 30, minWidth: 30, padding: "0 8px", fontSize: 13 }, disabled: c === "...", children: c }, k)),
|
|
1126
|
+
[["›", h + 1], ["»", r]].map(([c, k]) => /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-ghost", style: { height: 30, padding: "0 8px", fontSize: 14 }, disabled: h === r, onClick: () => p(k), children: c }, c))
|
|
1022
1127
|
] });
|
|
1023
1128
|
}
|
|
1024
|
-
function
|
|
1025
|
-
const [
|
|
1026
|
-
|
|
1027
|
-
const
|
|
1028
|
-
h((
|
|
1029
|
-
},
|
|
1030
|
-
const
|
|
1031
|
-
return (n.rows || []).flat().forEach((
|
|
1032
|
-
|
|
1033
|
-
}), r(
|
|
1034
|
-
},
|
|
1035
|
-
const
|
|
1036
|
-
if (
|
|
1037
|
-
/* @__PURE__ */ t("legend", { style: { fontSize: 12, fontWeight: 700, color: e.textSec, padding: "0 6px" }, children:
|
|
1038
|
-
(
|
|
1039
|
-
] },
|
|
1040
|
-
|
|
1041
|
-
|
|
1042
|
-
|
|
1043
|
-
|
|
1044
|
-
|
|
1045
|
-
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
|
|
1049
|
-
|
|
1050
|
-
|
|
1051
|
-
|
|
1052
|
-
|
|
1053
|
-
] })
|
|
1054
|
-
|
|
1055
|
-
|
|
1056
|
-
|
|
1057
|
-
|
|
1058
|
-
|
|
1059
|
-
] })
|
|
1060
|
-
|
|
1061
|
-
/* @__PURE__ */
|
|
1129
|
+
function rt({ config: n = {}, defaultValues: d = {}, onSubmit: u, style: l }) {
|
|
1130
|
+
const [f, h] = I(d), [g, r] = I({}), [p, y] = I(null);
|
|
1131
|
+
R(A, []);
|
|
1132
|
+
const c = (o, v) => {
|
|
1133
|
+
h((S) => ({ ...S, [o]: v })), r((S) => ({ ...S, [o]: null }));
|
|
1134
|
+
}, k = () => {
|
|
1135
|
+
const o = {};
|
|
1136
|
+
return (n.rows || []).flat().forEach((v) => {
|
|
1137
|
+
v && typeof v == "object" && "name" in v && v.required && !f[v.name] && (o[v.name] = `${v.label || v.name} is required`);
|
|
1138
|
+
}), r(o), Object.keys(o).length === 0;
|
|
1139
|
+
}, $ = (o) => {
|
|
1140
|
+
const v = f[o.name] ?? o.value ?? "", S = g[o.name], N = o.labelWidth ?? n.labelWidth, z = N !== void 0 || o.labelPosition === "left";
|
|
1141
|
+
if (o.type === "fieldset") return /* @__PURE__ */ x("fieldset", { style: { border: `1px solid ${e.border}`, borderRadius: e.r, padding: "12px 16px", marginBottom: 14 }, children: [
|
|
1142
|
+
/* @__PURE__ */ t("legend", { style: { fontSize: 12, fontWeight: 700, color: e.textSec, padding: "0 6px" }, children: o.label }),
|
|
1143
|
+
(o.rows || []).map((i) => $(i))
|
|
1144
|
+
] }, o.name);
|
|
1145
|
+
if (o.type === "spacer") return /* @__PURE__ */ t("div", { style: { height: o.height || 16 } }, o.name);
|
|
1146
|
+
const w = N ? { minWidth: N, width: N, flexShrink: 0, paddingTop: 8, boxSizing: "border-box" } : {}, s = o.label ? /* @__PURE__ */ x("label", { className: "dhx dhx-label", style: { display: "flex", gap: 4, ...w }, children: [
|
|
1147
|
+
o.label,
|
|
1148
|
+
o.required && /* @__PURE__ */ t("span", { style: { color: e.danger }, children: "*" })
|
|
1149
|
+
] }, "lbl") : null, b = S ? /* @__PURE__ */ t("div", { style: { fontSize: 11, color: e.danger, marginTop: 3 }, children: S }) : null, T = o.helpMessage ? /* @__PURE__ */ x("div", { style: { fontSize: 11, color: e.textMut, marginTop: 3 }, children: [
|
|
1150
|
+
"ⓘ ",
|
|
1151
|
+
o.helpMessage
|
|
1152
|
+
] }) : null, a = { key: o.name, className: "dhx-form-group" }, M = (i) => z ? /* @__PURE__ */ x("div", { ...a, style: { display: "flex", alignItems: "flex-start", gap: 8 }, children: [
|
|
1153
|
+
s,
|
|
1154
|
+
/* @__PURE__ */ x("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
1155
|
+
i,
|
|
1156
|
+
b,
|
|
1157
|
+
T
|
|
1158
|
+
] })
|
|
1159
|
+
] }) : /* @__PURE__ */ x("div", { ...a, children: [
|
|
1160
|
+
s,
|
|
1161
|
+
i,
|
|
1162
|
+
b,
|
|
1163
|
+
T
|
|
1164
|
+
] });
|
|
1165
|
+
if (!o.type || o.type === "input") return M(
|
|
1166
|
+
/* @__PURE__ */ x("div", { className: "dhx-input-wrap", children: [
|
|
1167
|
+
o.icon && /* @__PURE__ */ t("span", { className: "dhx-input-icon", children: o.icon }),
|
|
1168
|
+
/* @__PURE__ */ t(
|
|
1169
|
+
"input",
|
|
1170
|
+
{
|
|
1171
|
+
className: `dhx dhx-input${o.icon ? " dhx-input--with-icon" : ""}`,
|
|
1172
|
+
style: { borderColor: S ? e.danger : void 0 },
|
|
1173
|
+
type: o.inputType || "text",
|
|
1174
|
+
placeholder: o.placeholder,
|
|
1175
|
+
value: v,
|
|
1176
|
+
onChange: (i) => c(o.name, i.target.value),
|
|
1177
|
+
disabled: o.disabled
|
|
1178
|
+
}
|
|
1179
|
+
)
|
|
1180
|
+
] })
|
|
1181
|
+
);
|
|
1182
|
+
if (o.type === "textarea") return M(
|
|
1183
|
+
/* @__PURE__ */ t(
|
|
1184
|
+
"textarea",
|
|
1185
|
+
{
|
|
1186
|
+
className: "dhx dhx-input",
|
|
1187
|
+
style: { height: 80, resize: "vertical", padding: "8px 10px" },
|
|
1188
|
+
placeholder: o.placeholder,
|
|
1189
|
+
value: v,
|
|
1190
|
+
onChange: (i) => c(o.name, i.target.value)
|
|
1191
|
+
}
|
|
1192
|
+
)
|
|
1193
|
+
);
|
|
1194
|
+
if (o.type === "select") return M(
|
|
1195
|
+
/* @__PURE__ */ x("select", { className: "dhx dhx-input", value: v, onChange: (i) => c(o.name, i.target.value), style: { cursor: "pointer" }, children: [
|
|
1062
1196
|
/* @__PURE__ */ t("option", { value: "", children: "— Select —" }),
|
|
1063
|
-
(
|
|
1064
|
-
] })
|
|
1065
|
-
|
|
1066
|
-
|
|
1067
|
-
/* @__PURE__ */ t("input", { type: "
|
|
1068
|
-
|
|
1069
|
-
|
|
1070
|
-
|
|
1071
|
-
|
|
1072
|
-
|
|
1073
|
-
|
|
1074
|
-
|
|
1075
|
-
|
|
1076
|
-
|
|
1077
|
-
|
|
1078
|
-
|
|
1079
|
-
|
|
1080
|
-
|
|
1081
|
-
|
|
1082
|
-
|
|
1083
|
-
|
|
1084
|
-
|
|
1085
|
-
|
|
1086
|
-
|
|
1087
|
-
|
|
1088
|
-
|
|
1089
|
-
|
|
1090
|
-
|
|
1091
|
-
/* @__PURE__ */ t("div", { style: { position: "absolute", top: 3, left: c ? 21 : 3, width: 16, height: 16, borderRadius: "50%", background: "#fff", transition: "left 0.2s", boxShadow: "0 1px 3px rgba(0,0,0,.3)" } })
|
|
1092
|
-
] }),
|
|
1093
|
-
a.label && /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: a.label })
|
|
1094
|
-
] }) }) : a.type === "colorpicker" ? /* @__PURE__ */ f("div", { ...$, children: [
|
|
1095
|
-
S,
|
|
1096
|
-
/* @__PURE__ */ f("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
|
|
1197
|
+
(o.options || []).map((i) => /* @__PURE__ */ t("option", { value: i.value, children: i.label || i.value }, i.value))
|
|
1198
|
+
] })
|
|
1199
|
+
);
|
|
1200
|
+
if (o.type === "datepicker") return M(
|
|
1201
|
+
/* @__PURE__ */ t("input", { type: "date", className: "dhx dhx-input", value: v, onChange: (i) => c(o.name, i.target.value) })
|
|
1202
|
+
);
|
|
1203
|
+
if (o.type === "timepicker") {
|
|
1204
|
+
const i = f[o.name] ?? { h: 12, m: 0, ampm: "AM" }, C = !!f[o.name], W = C ? `${String(i.h).padStart(2, "0")}:${String(i.m).padStart(2, "0")}${i.ampm ? " " + i.ampm : ""}` : o.placeholder || "Click to select", L = /* @__PURE__ */ x("div", { style: { position: "relative" }, children: [
|
|
1205
|
+
/* @__PURE__ */ x(
|
|
1206
|
+
"div",
|
|
1207
|
+
{
|
|
1208
|
+
className: "dhx dhx-input",
|
|
1209
|
+
style: { cursor: "pointer", display: "flex", alignItems: "center", justifyContent: "space-between" },
|
|
1210
|
+
onClick: () => y(p === o.name ? null : o.name),
|
|
1211
|
+
children: [
|
|
1212
|
+
/* @__PURE__ */ t("span", { style: { color: C ? e.text : e.textMut }, children: W }),
|
|
1213
|
+
/* @__PURE__ */ t("span", { style: { fontSize: 13, color: e.textSec }, children: "🕐" })
|
|
1214
|
+
]
|
|
1215
|
+
}
|
|
1216
|
+
),
|
|
1217
|
+
p === o.name && /* @__PURE__ */ t("div", { style: { position: "absolute", zIndex: 100, top: "calc(100% + 4px)", left: 0 }, children: /* @__PURE__ */ t(Te, { value: i, controls: !0, onChange: (D) => {
|
|
1218
|
+
c(o.name, D), y(null);
|
|
1219
|
+
} }) })
|
|
1220
|
+
] });
|
|
1221
|
+
return M(L);
|
|
1222
|
+
}
|
|
1223
|
+
if (o.type === "colorpicker") return M(
|
|
1224
|
+
/* @__PURE__ */ x("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
|
|
1097
1225
|
/* @__PURE__ */ t(
|
|
1098
1226
|
"input",
|
|
1099
1227
|
{
|
|
1100
1228
|
type: "color",
|
|
1101
|
-
value:
|
|
1102
|
-
onChange: (
|
|
1229
|
+
value: v || "#000000",
|
|
1230
|
+
onChange: (i) => c(o.name, i.target.value),
|
|
1103
1231
|
style: { width: 36, height: 36, padding: 2, border: `1px solid ${e.border}`, borderRadius: e.r, cursor: "pointer", background: "none" }
|
|
1104
1232
|
}
|
|
1105
1233
|
),
|
|
1106
|
-
/* @__PURE__ */ t("span", { style: { fontSize: 12, color: e.textSec, fontFamily: "monospace" }, children:
|
|
1234
|
+
/* @__PURE__ */ t("span", { style: { fontSize: 12, color: e.textSec, fontFamily: "monospace" }, children: v || "#000000" })
|
|
1235
|
+
] })
|
|
1236
|
+
);
|
|
1237
|
+
if (o.type === "text") return M(
|
|
1238
|
+
/* @__PURE__ */ t("p", { style: { margin: "6px 0", fontSize: 13, color: e.text }, children: o.value })
|
|
1239
|
+
);
|
|
1240
|
+
if (o.type === "checkbox") return /* @__PURE__ */ x("div", { ...a, children: [
|
|
1241
|
+
z ? /* @__PURE__ */ x("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
|
|
1242
|
+
N && /* @__PURE__ */ t("div", { style: { width: N, flexShrink: 0 } }),
|
|
1243
|
+
/* @__PURE__ */ x("label", { style: { display: "flex", alignItems: "center", gap: 8, cursor: "pointer" }, children: [
|
|
1244
|
+
/* @__PURE__ */ t("input", { type: "checkbox", checked: !!v, onChange: (i) => c(o.name, i.target.checked), style: { width: 16, height: 16, accentColor: e.primary, cursor: "pointer" } }),
|
|
1245
|
+
/* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: o.label })
|
|
1246
|
+
] })
|
|
1247
|
+
] }) : /* @__PURE__ */ x("label", { style: { display: "flex", alignItems: "center", gap: 8, cursor: "pointer" }, children: [
|
|
1248
|
+
/* @__PURE__ */ t("input", { type: "checkbox", checked: !!v, onChange: (i) => c(o.name, i.target.checked), style: { width: 16, height: 16, accentColor: e.primary, cursor: "pointer" } }),
|
|
1249
|
+
/* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: o.label })
|
|
1107
1250
|
] }),
|
|
1108
|
-
|
|
1109
|
-
] })
|
|
1110
|
-
|
|
1111
|
-
|
|
1251
|
+
T
|
|
1252
|
+
] });
|
|
1253
|
+
if (o.type === "radio") {
|
|
1254
|
+
const i = (o.options || []).map((C) => /* @__PURE__ */ x("label", { style: { display: "flex", alignItems: "center", gap: 6, cursor: "pointer", fontSize: 13 }, children: [
|
|
1255
|
+
/* @__PURE__ */ t(
|
|
1256
|
+
"input",
|
|
1257
|
+
{
|
|
1258
|
+
type: "radio",
|
|
1259
|
+
name: o.name,
|
|
1260
|
+
value: C.value,
|
|
1261
|
+
checked: v === C.value,
|
|
1262
|
+
onChange: () => c(o.name, C.value),
|
|
1263
|
+
style: { accentColor: e.primary, cursor: "pointer" }
|
|
1264
|
+
}
|
|
1265
|
+
),
|
|
1266
|
+
C.label || C.value
|
|
1267
|
+
] }, C.value));
|
|
1268
|
+
return M(
|
|
1269
|
+
/* @__PURE__ */ t("div", { style: { display: "flex", gap: 16, flexWrap: "wrap", paddingTop: 8 }, children: i })
|
|
1270
|
+
);
|
|
1271
|
+
}
|
|
1272
|
+
if (o.type === "slider") return z ? /* @__PURE__ */ x("div", { ...a, style: { display: "flex", alignItems: "flex-start", gap: 8 }, children: [
|
|
1273
|
+
s,
|
|
1274
|
+
/* @__PURE__ */ x("div", { style: { flex: 1 }, children: [
|
|
1275
|
+
/* @__PURE__ */ t(
|
|
1276
|
+
G,
|
|
1277
|
+
{
|
|
1278
|
+
min: o.min,
|
|
1279
|
+
max: o.max,
|
|
1280
|
+
step: o.step,
|
|
1281
|
+
value: v || o.min,
|
|
1282
|
+
range: o.range,
|
|
1283
|
+
onChange: (i) => c(o.name, i)
|
|
1284
|
+
}
|
|
1285
|
+
),
|
|
1286
|
+
T
|
|
1287
|
+
] })
|
|
1288
|
+
] }) : /* @__PURE__ */ x("div", { ...a, children: [
|
|
1289
|
+
/* @__PURE__ */ t(
|
|
1290
|
+
G,
|
|
1291
|
+
{
|
|
1292
|
+
label: o.label,
|
|
1293
|
+
min: o.min,
|
|
1294
|
+
max: o.max,
|
|
1295
|
+
step: o.step,
|
|
1296
|
+
value: v || o.min,
|
|
1297
|
+
range: o.range,
|
|
1298
|
+
onChange: (i) => c(o.name, i)
|
|
1299
|
+
}
|
|
1300
|
+
),
|
|
1301
|
+
T
|
|
1302
|
+
] });
|
|
1303
|
+
if (o.type === "combo") return z ? /* @__PURE__ */ x("div", { ...a, style: { display: "flex", alignItems: "flex-start", gap: 8 }, children: [
|
|
1304
|
+
s,
|
|
1305
|
+
/* @__PURE__ */ x("div", { style: { flex: 1 }, children: [
|
|
1306
|
+
/* @__PURE__ */ t(
|
|
1307
|
+
q,
|
|
1308
|
+
{
|
|
1309
|
+
data: o.data || [],
|
|
1310
|
+
multiselection: o.multiselection,
|
|
1311
|
+
placeholder: o.placeholder || "Select...",
|
|
1312
|
+
value: v || (o.multiselection ? [] : null),
|
|
1313
|
+
onChange: (i) => c(o.name, i)
|
|
1314
|
+
}
|
|
1315
|
+
),
|
|
1316
|
+
b,
|
|
1317
|
+
T
|
|
1318
|
+
] })
|
|
1319
|
+
] }) : /* @__PURE__ */ x("div", { ...a, children: [
|
|
1320
|
+
/* @__PURE__ */ t(
|
|
1321
|
+
q,
|
|
1322
|
+
{
|
|
1323
|
+
label: o.label,
|
|
1324
|
+
data: o.data || [],
|
|
1325
|
+
multiselection: o.multiselection,
|
|
1326
|
+
placeholder: o.placeholder || "Select...",
|
|
1327
|
+
value: v || (o.multiselection ? [] : null),
|
|
1328
|
+
onChange: (i) => c(o.name, i)
|
|
1329
|
+
}
|
|
1330
|
+
),
|
|
1331
|
+
b,
|
|
1332
|
+
T
|
|
1333
|
+
] });
|
|
1334
|
+
if (o.type === "toggle") {
|
|
1335
|
+
const i = !!v, C = i ? o.icon : o.offIcon || o.icon, W = i ? o.text || o.label : o.offText || o.text || o.label;
|
|
1336
|
+
return /* @__PURE__ */ x("div", { ...a, children: [
|
|
1337
|
+
z && N && /* @__PURE__ */ x("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
|
|
1338
|
+
/* @__PURE__ */ t("div", { style: { width: N, flexShrink: 0 } }),
|
|
1339
|
+
/* @__PURE__ */ x("label", { style: { display: "flex", alignItems: "center", gap: 8, cursor: "pointer" }, children: [
|
|
1340
|
+
/* @__PURE__ */ t(Q, { on: i, onClick: () => c(o.name, !v) }),
|
|
1341
|
+
C && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: C }),
|
|
1342
|
+
W && /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: W })
|
|
1343
|
+
] })
|
|
1344
|
+
] }),
|
|
1345
|
+
!z && /* @__PURE__ */ x("label", { style: { display: "flex", alignItems: "center", gap: 10, cursor: "pointer" }, children: [
|
|
1346
|
+
/* @__PURE__ */ t(Q, { on: i, onClick: () => c(o.name, !v) }),
|
|
1347
|
+
C && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: C }),
|
|
1348
|
+
W && /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: W })
|
|
1349
|
+
] }),
|
|
1350
|
+
T
|
|
1351
|
+
] });
|
|
1352
|
+
}
|
|
1353
|
+
return null;
|
|
1354
|
+
}, m = (o) => o.map(
|
|
1355
|
+
(v, S) => Array.isArray(v) ? /* @__PURE__ */ t("div", { style: { display: "flex", gap: 12, alignItems: "flex-start" }, children: v.map($) }, S) : $(v)
|
|
1112
1356
|
);
|
|
1113
|
-
return /* @__PURE__ */
|
|
1114
|
-
|
|
1115
|
-
(n.buttons || u) && /* @__PURE__ */
|
|
1116
|
-
/* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-primary", onClick: () =>
|
|
1357
|
+
return /* @__PURE__ */ x("div", { className: "dhx", style: { padding: n.padding || 0, width: n.width || "100%", ...l }, children: [
|
|
1358
|
+
m(n.rows || []),
|
|
1359
|
+
(n.buttons || u) && /* @__PURE__ */ x("div", { style: { display: "flex", gap: 8, justifyContent: n.buttonAlign || "flex-start", marginTop: 8 }, children: [
|
|
1360
|
+
/* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-primary", onClick: () => k() && (u == null ? void 0 : u(f)), children: n.submitText || "Submit" }),
|
|
1117
1361
|
n.resetButton !== !1 && /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-secondary", onClick: () => {
|
|
1118
|
-
h(
|
|
1362
|
+
h(d), r({});
|
|
1119
1363
|
}, children: n.resetText || "Reset" })
|
|
1120
1364
|
] })
|
|
1121
1365
|
] });
|
|
1122
1366
|
}
|
|
1123
|
-
function
|
|
1124
|
-
|
|
1367
|
+
function Q({ on: n, onClick: d }) {
|
|
1368
|
+
return /* @__PURE__ */ x("div", { style: { position: "relative", width: 40, height: 22, flexShrink: 0 }, onClick: d, children: [
|
|
1369
|
+
/* @__PURE__ */ t("div", { style: { width: 40, height: 22, borderRadius: 11, background: n ? e.primary : e.border, transition: "background 0.2s" } }),
|
|
1370
|
+
/* @__PURE__ */ t("div", { style: { position: "absolute", top: 3, left: n ? 21 : 3, width: 16, height: 16, borderRadius: "50%", background: "#fff", transition: "left 0.2s", boxShadow: "0 1px 3px rgba(0,0,0,.3)" } })
|
|
1371
|
+
] });
|
|
1372
|
+
}
|
|
1373
|
+
function Z(n) {
|
|
1374
|
+
const d = [];
|
|
1125
1375
|
for (const u of n)
|
|
1126
|
-
"type" in u && u.type === "block" ?
|
|
1127
|
-
return
|
|
1376
|
+
"type" in u && u.type === "block" ? d.push(...u.items || []) : d.push(u);
|
|
1377
|
+
return d;
|
|
1128
1378
|
}
|
|
1129
|
-
function
|
|
1130
|
-
|
|
1131
|
-
const [
|
|
1379
|
+
function nt({ items: n = [], onAction: d, style: u }) {
|
|
1380
|
+
R(A, []);
|
|
1381
|
+
const [l, f] = I(() => {
|
|
1132
1382
|
const r = {};
|
|
1133
|
-
for (const
|
|
1134
|
-
|
|
1383
|
+
for (const p of Z(n))
|
|
1384
|
+
p.id && (r[p.id] = !!p.active);
|
|
1135
1385
|
return r;
|
|
1136
1386
|
}), h = (r) => {
|
|
1137
|
-
var
|
|
1387
|
+
var p;
|
|
1138
1388
|
if (r.id)
|
|
1139
1389
|
if (r.group) {
|
|
1140
|
-
const y =
|
|
1141
|
-
|
|
1142
|
-
const k = { ...
|
|
1143
|
-
for (const
|
|
1390
|
+
const y = Z(n).filter((c) => c.group === r.group && c.id);
|
|
1391
|
+
f((c) => {
|
|
1392
|
+
const k = { ...c };
|
|
1393
|
+
for (const $ of y) k[$.id] = !1;
|
|
1144
1394
|
return k[r.id] = !0, k;
|
|
1145
1395
|
});
|
|
1146
|
-
} else r.twoState &&
|
|
1147
|
-
(
|
|
1148
|
-
},
|
|
1149
|
-
var k,
|
|
1396
|
+
} else r.twoState && f((y) => ({ ...y, [r.id]: !y[r.id] }));
|
|
1397
|
+
(p = r.onClick) == null || p.call(r, r), r.id && (d == null || d(r.id, r));
|
|
1398
|
+
}, g = (r, p) => {
|
|
1399
|
+
var k, $;
|
|
1150
1400
|
if ("type" in r && (r.type === "separator" || r.type === "sep"))
|
|
1151
|
-
return /* @__PURE__ */ t("div", { style: { width: 1, background: e.border, margin: "8px 4px", alignSelf: "stretch" } },
|
|
1401
|
+
return /* @__PURE__ */ t("div", { style: { width: 1, background: e.border, margin: "8px 4px", alignSelf: "stretch" } }, p);
|
|
1152
1402
|
if ("type" in r && r.type === "input") {
|
|
1153
|
-
const
|
|
1154
|
-
return /* @__PURE__ */
|
|
1155
|
-
|
|
1156
|
-
/* @__PURE__ */ t("input", { className: "dhx dhx-input", style: { width:
|
|
1157
|
-
var
|
|
1158
|
-
return (
|
|
1403
|
+
const m = r;
|
|
1404
|
+
return /* @__PURE__ */ x("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", padding: "4px 6px", gap: 4 }, children: [
|
|
1405
|
+
m.label && /* @__PURE__ */ t("span", { style: { fontSize: 10, color: e.textMut }, children: m.label }),
|
|
1406
|
+
/* @__PURE__ */ t("input", { className: "dhx dhx-input", style: { width: m.width || 110, height: 26, fontSize: 12 }, placeholder: m.placeholder, defaultValue: m.value, onChange: (o) => {
|
|
1407
|
+
var v;
|
|
1408
|
+
return (v = m.onChange) == null ? void 0 : v.call(m, o.target.value);
|
|
1159
1409
|
} })
|
|
1160
|
-
] },
|
|
1410
|
+
] }, p);
|
|
1161
1411
|
}
|
|
1162
1412
|
if ("type" in r && r.type === "block") {
|
|
1163
|
-
const
|
|
1164
|
-
return /* @__PURE__ */
|
|
1165
|
-
/* @__PURE__ */ t("div", { style: { display: "flex", gap: 2 }, children: (k =
|
|
1166
|
-
|
|
1167
|
-
] },
|
|
1413
|
+
const m = r;
|
|
1414
|
+
return /* @__PURE__ */ x("div", { style: { display: "flex", flexDirection: m.direction === "col" ? "column" : "row", alignItems: "center", gap: 4, padding: "4px 8px", borderRight: `1px solid ${e.border}`, minHeight: 64 }, children: [
|
|
1415
|
+
/* @__PURE__ */ t("div", { style: { display: "flex", gap: 2 }, children: (k = m.items) == null ? void 0 : k.map((o, v) => g(o, v)) }),
|
|
1416
|
+
m.label && /* @__PURE__ */ t("span", { style: { fontSize: 10, color: e.textMut, marginTop: 2 }, children: m.label })
|
|
1417
|
+
] }, p);
|
|
1168
1418
|
}
|
|
1169
1419
|
if ("type" in r && r.type === "selectButton") {
|
|
1170
|
-
const
|
|
1171
|
-
return /* @__PURE__ */ t("select", { className: "dhx dhx-input", style: { height: 28, fontSize: 12, cursor: "pointer", margin: 2 }, defaultValue:
|
|
1172
|
-
var
|
|
1173
|
-
return (
|
|
1174
|
-
}, children: (
|
|
1420
|
+
const m = r;
|
|
1421
|
+
return /* @__PURE__ */ t("select", { className: "dhx dhx-input", style: { height: 28, fontSize: 12, cursor: "pointer", margin: 2 }, defaultValue: m.value, onChange: (o) => {
|
|
1422
|
+
var v;
|
|
1423
|
+
return (v = m.onChange) == null ? void 0 : v.call(m, o.target.value);
|
|
1424
|
+
}, children: ($ = m.items) == null ? void 0 : $.map((o) => /* @__PURE__ */ t("option", { value: o.value, children: o.value }, o.value)) }, p);
|
|
1175
1425
|
}
|
|
1176
|
-
const y = r,
|
|
1177
|
-
return /* @__PURE__ */
|
|
1426
|
+
const y = r, c = y.id !== void 0 ? l[y.id] ?? !!y.active : !!y.active;
|
|
1427
|
+
return /* @__PURE__ */ x(
|
|
1178
1428
|
"button",
|
|
1179
1429
|
{
|
|
1180
1430
|
title: y.tooltip,
|
|
1181
|
-
className: `dhx dhx-btn ${
|
|
1431
|
+
className: `dhx dhx-btn ${c ? "dhx-btn-primary" : "dhx-btn-ghost"}`,
|
|
1182
1432
|
style: { flexDirection: "column", minHeight: 48, padding: "4px 8px", gap: 4, fontSize: 12 },
|
|
1183
1433
|
disabled: y.disabled,
|
|
1184
1434
|
onClick: () => h(y),
|
|
@@ -1187,67 +1437,67 @@ function tt({ items: n = [], onAction: s, style: u }) {
|
|
|
1187
1437
|
y.text && /* @__PURE__ */ t("span", { style: { fontSize: 10, maxWidth: 60, textAlign: "center", lineHeight: 1.2, whiteSpace: "normal" }, children: y.text })
|
|
1188
1438
|
]
|
|
1189
1439
|
},
|
|
1190
|
-
|
|
1440
|
+
p
|
|
1191
1441
|
);
|
|
1192
1442
|
};
|
|
1193
|
-
return /* @__PURE__ */ t("div", { className: "dhx", style: { display: "flex", alignItems: "stretch", background: e.bg, borderBottom: `1px solid ${e.border}`, padding: "4px 0", overflowX: "auto", gap: 0, ...u }, children: n.map(
|
|
1443
|
+
return /* @__PURE__ */ t("div", { className: "dhx", style: { display: "flex", alignItems: "stretch", background: e.bg, borderBottom: `1px solid ${e.border}`, padding: "4px 0", overflowX: "auto", gap: 0, ...u }, children: n.map(g) });
|
|
1194
1444
|
}
|
|
1195
|
-
function
|
|
1196
|
-
const [
|
|
1197
|
-
|
|
1198
|
-
const r = (
|
|
1199
|
-
var
|
|
1200
|
-
return
|
|
1201
|
-
/* @__PURE__ */
|
|
1202
|
-
|
|
1203
|
-
|
|
1445
|
+
function ot({ logo: n, items: d = [], vertical: u = !1, style: l }) {
|
|
1446
|
+
const [f, h] = I(null), g = H(null);
|
|
1447
|
+
R(A, []), P(g, B(() => h(null), []));
|
|
1448
|
+
const r = (p, y) => {
|
|
1449
|
+
var c;
|
|
1450
|
+
return p.type === "separator" ? /* @__PURE__ */ t("div", { style: { [u ? "height" : "width"]: 1, background: e.border, margin: u ? "4px 8px" : "0 6px", alignSelf: "stretch" } }, y) : p.type === "spacer" ? /* @__PURE__ */ t("div", { style: { flex: 1 } }, y) : p.type === "input" ? /* @__PURE__ */ t("input", { className: "dhx dhx-input", style: { width: p.width || 200, height: 28, margin: "0 4px" }, placeholder: p.placeholder }, y) : p.type === "menuItem" && ((c = p.items) != null && c.length) ? /* @__PURE__ */ x("div", { style: { position: "relative" }, children: [
|
|
1451
|
+
/* @__PURE__ */ x("button", { className: "dhx dhx-btn dhx-btn-ghost", style: { height: 36, color: e.text }, onClick: () => h(f === y ? null : y), children: [
|
|
1452
|
+
p.icon && /* @__PURE__ */ t("span", { children: p.icon }),
|
|
1453
|
+
p.value,
|
|
1204
1454
|
" ",
|
|
1205
1455
|
/* @__PURE__ */ t("span", { style: { fontSize: 9 }, children: "▼" })
|
|
1206
1456
|
] }),
|
|
1207
|
-
|
|
1208
|
-
] }, y) : /* @__PURE__ */
|
|
1457
|
+
f === y && /* @__PURE__ */ t(O, { items: p.items, onSelect: () => h(null), style: { top: "100%" } })
|
|
1458
|
+
] }, y) : /* @__PURE__ */ x("button", { className: "dhx dhx-btn dhx-btn-ghost", style: { height: 36, gap: 6, color: e.text }, onClick: () => {
|
|
1209
1459
|
var k;
|
|
1210
|
-
return (k =
|
|
1460
|
+
return (k = p.onClick) == null ? void 0 : k.call(p);
|
|
1211
1461
|
}, children: [
|
|
1212
|
-
|
|
1213
|
-
|
|
1462
|
+
p.icon && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: p.icon }),
|
|
1463
|
+
p.value && /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: p.value })
|
|
1214
1464
|
] }, y);
|
|
1215
1465
|
};
|
|
1216
|
-
return /* @__PURE__ */
|
|
1466
|
+
return /* @__PURE__ */ x("nav", { ref: g, className: "dhx", style: { display: "flex", flexDirection: u ? "column" : "row", alignItems: u ? "stretch" : "center", background: e.surface, borderBottom: u ? "none" : `1px solid ${e.border}`, borderRight: u ? `1px solid ${e.border}` : "none", padding: u ? "12px 0" : "0 12px", minHeight: u ? void 0 : 48, gap: 2, ...l }, children: [
|
|
1217
1467
|
n && /* @__PURE__ */ t("div", { style: { color: e.text, fontWeight: 800, fontSize: 16, padding: u ? "8px 16px" : "0 12px 0 4px", borderRight: u ? "none" : `1px solid ${e.border}`, marginRight: u ? 0 : 8 }, children: n }),
|
|
1218
|
-
|
|
1468
|
+
d.map(r)
|
|
1219
1469
|
] });
|
|
1220
1470
|
}
|
|
1221
1471
|
export {
|
|
1222
|
-
|
|
1223
|
-
|
|
1224
|
-
|
|
1225
|
-
|
|
1226
|
-
|
|
1227
|
-
|
|
1228
|
-
|
|
1229
|
-
|
|
1230
|
-
|
|
1231
|
-
|
|
1232
|
-
|
|
1233
|
-
|
|
1234
|
-
|
|
1235
|
-
|
|
1236
|
-
|
|
1237
|
-
|
|
1238
|
-
|
|
1239
|
-
|
|
1240
|
-
|
|
1241
|
-
|
|
1242
|
-
|
|
1243
|
-
|
|
1244
|
-
|
|
1245
|
-
|
|
1246
|
-
|
|
1247
|
-
|
|
1472
|
+
Be as Button,
|
|
1473
|
+
_e as Calendar,
|
|
1474
|
+
Ke as Chart,
|
|
1475
|
+
Fe as Colorpicker,
|
|
1476
|
+
q as Combobox,
|
|
1477
|
+
Xe as ContextMenu,
|
|
1478
|
+
Ze as DataView,
|
|
1479
|
+
rt as Form,
|
|
1480
|
+
Ye as Grid,
|
|
1481
|
+
Ce as Layout,
|
|
1482
|
+
Qe as List,
|
|
1483
|
+
Ve as Menu,
|
|
1484
|
+
O as MenuDropdown,
|
|
1485
|
+
te as MessageContext,
|
|
1486
|
+
Je as MessageProvider,
|
|
1487
|
+
ot as Navbar,
|
|
1488
|
+
tt as Pagination,
|
|
1489
|
+
qe as Popup,
|
|
1490
|
+
nt as Ribbon,
|
|
1491
|
+
Pe as Sidebar,
|
|
1492
|
+
G as Slider,
|
|
1493
|
+
Oe as Tabbar,
|
|
1494
|
+
Te as Timepicker,
|
|
1495
|
+
je as Toolbar,
|
|
1496
|
+
et as Tree,
|
|
1497
|
+
Ge as Window,
|
|
1248
1498
|
e as tokens,
|
|
1249
|
-
|
|
1250
|
-
|
|
1251
|
-
|
|
1499
|
+
P as useClickOutside,
|
|
1500
|
+
Le as useDrag,
|
|
1501
|
+
Ue as useMessage
|
|
1252
1502
|
};
|
|
1253
1503
|
//# sourceMappingURL=dhx-react-suite.js.map
|