tekivex-ui 2.5.6 → 2.5.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +5 -5
- package/dist/TkxForm-2tGLCPH6.js +326 -0
- package/dist/TkxForm-C2VqR2wC.cjs +12 -0
- package/dist/charts.cjs +1 -1
- package/dist/charts.js +264 -251
- package/dist/headless.cjs +1 -1
- package/dist/headless.js +21 -20
- package/dist/index-BgHMZe4Z.js +66 -0
- package/dist/index-Bt5y50Qa.cjs +1 -0
- package/dist/index-DnqXtpwV.cjs +2 -0
- package/dist/{index-eT_U4qB2.js → index-iUUHRxqJ.js} +70 -67
- package/dist/index.cjs +21 -21
- package/dist/index.js +1076 -1074
- package/dist/quantum.cjs +2 -2
- package/dist/quantum.js +4 -4
- package/dist/realtime.cjs +8 -4
- package/dist/realtime.js +391 -377
- package/dist/{security-CzAmaMqa.js → security-C-ZPGoyG.js} +1 -1
- package/dist/{security-C369oOWH.cjs → security-Uf0mjv8o.cjs} +1 -1
- package/dist/src/charts/TkxDonutChart.d.ts.map +1 -1
- package/dist/src/charts/TkxPieChart.d.ts.map +1 -1
- package/dist/src/components/TkxAlert.d.ts.map +1 -1
- package/dist/src/components/TkxForm.d.ts +17 -16
- package/dist/src/components/TkxForm.d.ts.map +1 -1
- package/dist/src/components/TkxLiveMetrics.d.ts.map +1 -1
- package/dist/src/components/TkxPlayground.d.ts.map +1 -1
- package/dist/src/components/TkxProgress.d.ts.map +1 -1
- package/dist/src/components/TkxToast.d.ts +2 -1
- package/dist/src/components/TkxToast.d.ts.map +1 -1
- package/dist/src/engine/wcag.d.ts.map +1 -1
- package/dist/src/themes/index.d.ts.map +1 -1
- package/dist/{tkx-BJ10JtMv.js → tkx-BtHzWKTl.js} +1 -1
- package/dist/{tkx-BeNyC0w7.cjs → tkx-C7GvVUE9.cjs} +1 -1
- package/package.json +6 -6
- package/src/charts/TkxDonutChart.tsx +6 -2
- package/src/charts/TkxPieChart.tsx +7 -3
- package/src/charts/shared.ts +4 -4
- package/src/components/TkxAlert.tsx +2 -1
- package/src/components/TkxBadge.tsx +2 -2
- package/src/components/TkxForm.tsx +35 -32
- package/src/components/TkxLiveMetrics.tsx +24 -2
- package/src/components/TkxPlayground.tsx +40 -5
- package/src/components/TkxProgress.tsx +0 -2
- package/src/components/TkxToast.tsx +5 -4
- package/src/engine/wcag.ts +2 -1
- package/src/themes/index.ts +8 -1
- package/dist/TkxForm-DSMDo2Ol.js +0 -388
- package/dist/TkxForm-DwV_n-eE.cjs +0 -12
- package/dist/index-BINBzXuY.cjs +0 -2
package/dist/TkxForm-DSMDo2Ol.js
DELETED
|
@@ -1,388 +0,0 @@
|
|
|
1
|
-
import { useRef as f, useEffect as j, useCallback as d, useState as K, useMemo as A, cloneElement as X, useContext as O, createContext as Z } from "react";
|
|
2
|
-
import { G as ee, i as te, w as re, x as ne, u as Q } from "./index-eT_U4qB2.js";
|
|
3
|
-
import { jsx as N, jsxs as T, Fragment as se } from "react/jsx-runtime";
|
|
4
|
-
import { s as G } from "./security-CzAmaMqa.js";
|
|
5
|
-
import { t as g, c as S } from "./tkx-BJ10JtMv.js";
|
|
6
|
-
function pe() {
|
|
7
|
-
const [e, r] = K(() => typeof window > "u" ? !1 : ne());
|
|
8
|
-
return j(() => {
|
|
9
|
-
if (typeof window > "u") return;
|
|
10
|
-
const t = window.matchMedia("(prefers-reduced-motion: reduce)"), s = (i) => r(i.matches);
|
|
11
|
-
return t.addEventListener("change", s), () => t.removeEventListener("change", s);
|
|
12
|
-
}, []), e;
|
|
13
|
-
}
|
|
14
|
-
function Fe() {
|
|
15
|
-
const [e, r] = K(() => typeof window > "u" ? !1 : re());
|
|
16
|
-
return j(() => {
|
|
17
|
-
if (typeof window > "u") return;
|
|
18
|
-
const t = window.matchMedia("(forced-colors: active)"), s = (i) => r(i.matches);
|
|
19
|
-
return t.addEventListener("change", s), () => t.removeEventListener("change", s);
|
|
20
|
-
}, []), e;
|
|
21
|
-
}
|
|
22
|
-
function ge(e) {
|
|
23
|
-
const r = f(null);
|
|
24
|
-
return j(() => {
|
|
25
|
-
if (!e || !r.current) return;
|
|
26
|
-
const t = te(r.current);
|
|
27
|
-
return t.activate(), () => t.deactivate();
|
|
28
|
-
}, [e]), r;
|
|
29
|
-
}
|
|
30
|
-
function ye() {
|
|
31
|
-
const e = f(null);
|
|
32
|
-
return j(() => {
|
|
33
|
-
if (!(typeof document > "u"))
|
|
34
|
-
return e.current = ee(), () => {
|
|
35
|
-
var r;
|
|
36
|
-
(r = e.current) == null || r.destroy();
|
|
37
|
-
};
|
|
38
|
-
}, []), d((r, t = "polite") => {
|
|
39
|
-
var s;
|
|
40
|
-
(s = e.current) == null || s.announce(r, t);
|
|
41
|
-
}, []);
|
|
42
|
-
}
|
|
43
|
-
function ve(e, r = !0) {
|
|
44
|
-
const t = f(e);
|
|
45
|
-
t.current = e, j(() => {
|
|
46
|
-
if (!r || typeof document > "u") return;
|
|
47
|
-
const s = (i) => {
|
|
48
|
-
i.key === "Escape" && t.current();
|
|
49
|
-
};
|
|
50
|
-
return document.addEventListener("keydown", s), () => document.removeEventListener("keydown", s);
|
|
51
|
-
}, [r]);
|
|
52
|
-
}
|
|
53
|
-
function we(e, r) {
|
|
54
|
-
const t = f(r);
|
|
55
|
-
t.current = r, j(() => {
|
|
56
|
-
const s = (i) => {
|
|
57
|
-
!e.current || e.current.contains(i.target) || t.current();
|
|
58
|
-
};
|
|
59
|
-
return document.addEventListener("pointerdown", s), () => document.removeEventListener("pointerdown", s);
|
|
60
|
-
}, [e]);
|
|
61
|
-
}
|
|
62
|
-
const W = Z(null);
|
|
63
|
-
function oe() {
|
|
64
|
-
const e = O(W);
|
|
65
|
-
if (!e)
|
|
66
|
-
throw new Error("TkxFormField must be used inside a <TkxForm>. Wrap your fields in a TkxForm component.");
|
|
67
|
-
return e;
|
|
68
|
-
}
|
|
69
|
-
async function _(e, r) {
|
|
70
|
-
for (const t of r) {
|
|
71
|
-
if (t.required && (e == null || e === "" || Array.isArray(e) && e.length === 0))
|
|
72
|
-
return t.message ?? "This field is required";
|
|
73
|
-
if (!(e == null || e === "")) {
|
|
74
|
-
if (t.min !== void 0) {
|
|
75
|
-
if (typeof e == "string" && e.length < t.min)
|
|
76
|
-
return t.message ?? `Must be at least ${t.min} characters`;
|
|
77
|
-
if (typeof e == "number" && e < t.min)
|
|
78
|
-
return t.message ?? `Must be at least ${t.min}`;
|
|
79
|
-
}
|
|
80
|
-
if (t.max !== void 0) {
|
|
81
|
-
if (typeof e == "string" && e.length > t.max)
|
|
82
|
-
return t.message ?? `Must be no more than ${t.max} characters`;
|
|
83
|
-
if (typeof e == "number" && e > t.max)
|
|
84
|
-
return t.message ?? `Must be no more than ${t.max}`;
|
|
85
|
-
}
|
|
86
|
-
if (t.pattern && typeof e == "string" && !t.pattern.test(e))
|
|
87
|
-
return t.message ?? "Invalid format";
|
|
88
|
-
if (t.validator) {
|
|
89
|
-
const s = await t.validator(e);
|
|
90
|
-
if (s)
|
|
91
|
-
return s;
|
|
92
|
-
}
|
|
93
|
-
}
|
|
94
|
-
}
|
|
95
|
-
return null;
|
|
96
|
-
}
|
|
97
|
-
function ce(e, r) {
|
|
98
|
-
const t = e ? [...e] : [];
|
|
99
|
-
return r && !t.some((s) => s.required) && t.unshift({ required: !0, message: "This field is required" }), t;
|
|
100
|
-
}
|
|
101
|
-
function ie(e) {
|
|
102
|
-
return e.some((r) => r.required);
|
|
103
|
-
}
|
|
104
|
-
function Ee() {
|
|
105
|
-
const e = O(W), r = f({}), t = f({}), s = f({}), i = A(() => ({
|
|
106
|
-
getFieldValue: (u) => r.current[u],
|
|
107
|
-
setFieldValue: (u, E) => {
|
|
108
|
-
r.current[u] = E;
|
|
109
|
-
},
|
|
110
|
-
getFieldsValue: () => ({ ...r.current }),
|
|
111
|
-
setFieldsValue: (u) => {
|
|
112
|
-
Object.assign(r.current, u);
|
|
113
|
-
},
|
|
114
|
-
validateFields: () => Promise.resolve({ ...r.current }),
|
|
115
|
-
validateField: (u) => Promise.resolve(!0),
|
|
116
|
-
resetFields: () => {
|
|
117
|
-
r.current = {}, t.current = {}, s.current = {};
|
|
118
|
-
},
|
|
119
|
-
getFieldError: (u) => t.current[u] ?? null,
|
|
120
|
-
isFieldTouched: (u) => s.current[u] ?? !1
|
|
121
|
-
}), []);
|
|
122
|
-
return e ? e.instance : i;
|
|
123
|
-
}
|
|
124
|
-
function ue({
|
|
125
|
-
onSubmit: e,
|
|
126
|
-
onValuesChange: r,
|
|
127
|
-
initialValues: t = {},
|
|
128
|
-
layout: s = "vertical",
|
|
129
|
-
disabled: i = !1,
|
|
130
|
-
children: u,
|
|
131
|
-
className: E,
|
|
132
|
-
style: L,
|
|
133
|
-
form: b
|
|
134
|
-
}) {
|
|
135
|
-
const m = Q(), [v, p] = K({
|
|
136
|
-
values: { ...t },
|
|
137
|
-
errors: {},
|
|
138
|
-
touched: {}
|
|
139
|
-
}), H = f(t), h = f({}), x = f(v);
|
|
140
|
-
x.current = v;
|
|
141
|
-
const M = d((n, o) => {
|
|
142
|
-
h.current[n] = o;
|
|
143
|
-
}, []), I = d((n) => {
|
|
144
|
-
delete h.current[n];
|
|
145
|
-
}, []), q = d((n, o) => {
|
|
146
|
-
p((c) => {
|
|
147
|
-
const a = {
|
|
148
|
-
...c,
|
|
149
|
-
values: { ...c.values, [n]: o }
|
|
150
|
-
};
|
|
151
|
-
return r == null || r({ [n]: o }, a.values), a;
|
|
152
|
-
});
|
|
153
|
-
}, [r]), z = d((n, o) => {
|
|
154
|
-
p((c) => ({
|
|
155
|
-
...c,
|
|
156
|
-
errors: { ...c.errors, [n]: o }
|
|
157
|
-
}));
|
|
158
|
-
}, []), w = d((n) => {
|
|
159
|
-
p((o) => ({
|
|
160
|
-
...o,
|
|
161
|
-
touched: { ...o.touched, [n]: !0 }
|
|
162
|
-
}));
|
|
163
|
-
}, []), R = d(async (n) => {
|
|
164
|
-
const o = h.current[n];
|
|
165
|
-
if (!o) return !0;
|
|
166
|
-
const c = x.current.values[n], a = await _(c, o.rules);
|
|
167
|
-
return p((F) => ({
|
|
168
|
-
...F,
|
|
169
|
-
errors: { ...F.errors, [n]: a },
|
|
170
|
-
touched: { ...F.touched, [n]: !0 }
|
|
171
|
-
})), a === null;
|
|
172
|
-
}, []), k = d(async () => {
|
|
173
|
-
const n = Object.keys(h.current), o = await Promise.all(
|
|
174
|
-
n.map(async (l) => {
|
|
175
|
-
const y = h.current[l], U = x.current.values[l], V = await _(U, y.rules);
|
|
176
|
-
return { name: l, error: V };
|
|
177
|
-
})
|
|
178
|
-
), c = {}, a = {};
|
|
179
|
-
let F = !1;
|
|
180
|
-
for (const { name: l, error: y } of o)
|
|
181
|
-
c[l] = y, a[l] = !0, y && (F = !0);
|
|
182
|
-
if (p((l) => ({
|
|
183
|
-
...l,
|
|
184
|
-
errors: { ...l.errors, ...c },
|
|
185
|
-
touched: { ...l.touched, ...a }
|
|
186
|
-
})), F) {
|
|
187
|
-
const l = Object.fromEntries(
|
|
188
|
-
o.filter((y) => y.error).map((y) => [y.name, y.error])
|
|
189
|
-
);
|
|
190
|
-
return Promise.reject(l);
|
|
191
|
-
}
|
|
192
|
-
return { ...x.current.values };
|
|
193
|
-
}, []), P = d(() => {
|
|
194
|
-
p({
|
|
195
|
-
values: { ...H.current },
|
|
196
|
-
errors: {},
|
|
197
|
-
touched: {}
|
|
198
|
-
});
|
|
199
|
-
}, []), Y = A(() => ({
|
|
200
|
-
getFieldValue: (n) => x.current.values[n],
|
|
201
|
-
setFieldValue: q,
|
|
202
|
-
getFieldsValue: () => ({ ...x.current.values }),
|
|
203
|
-
setFieldsValue: (n) => {
|
|
204
|
-
p((o) => {
|
|
205
|
-
const c = { ...o.values, ...n };
|
|
206
|
-
return r == null || r(n, c), { ...o, values: c };
|
|
207
|
-
});
|
|
208
|
-
},
|
|
209
|
-
validateFields: k,
|
|
210
|
-
validateField: R,
|
|
211
|
-
resetFields: P,
|
|
212
|
-
getFieldError: (n) => x.current.errors[n] ?? null,
|
|
213
|
-
isFieldTouched: (n) => !!x.current.touched[n]
|
|
214
|
-
}), [q, k, R, P, r]), C = d(async (n) => {
|
|
215
|
-
n.preventDefault();
|
|
216
|
-
try {
|
|
217
|
-
const o = await k();
|
|
218
|
-
await (e == null ? void 0 : e(o));
|
|
219
|
-
} catch {
|
|
220
|
-
}
|
|
221
|
-
}, [k, e]), $ = s === "inline" ? g("flex flex-row flex-wrap items-end gap-4") : g("flex flex-col gap-5"), B = b ?? Y, D = A(() => ({
|
|
222
|
-
state: v,
|
|
223
|
-
initialValues: H.current,
|
|
224
|
-
layout: s,
|
|
225
|
-
disabled: i,
|
|
226
|
-
fieldMeta: h,
|
|
227
|
-
setFieldValue: q,
|
|
228
|
-
setFieldError: z,
|
|
229
|
-
setFieldTouched: w,
|
|
230
|
-
registerField: M,
|
|
231
|
-
unregisterField: I,
|
|
232
|
-
validateField: R,
|
|
233
|
-
instance: B
|
|
234
|
-
}), [v, s, i, q, z, w, M, I, R, B]);
|
|
235
|
-
return /* @__PURE__ */ N(W.Provider, { value: D, children: /* @__PURE__ */ N(
|
|
236
|
-
"form",
|
|
237
|
-
{
|
|
238
|
-
noValidate: !0,
|
|
239
|
-
role: "form",
|
|
240
|
-
"aria-label": "Form",
|
|
241
|
-
onSubmit: C,
|
|
242
|
-
className: S($, E),
|
|
243
|
-
style: {
|
|
244
|
-
color: m.text,
|
|
245
|
-
...L
|
|
246
|
-
},
|
|
247
|
-
children: u
|
|
248
|
-
}
|
|
249
|
-
) });
|
|
250
|
-
}
|
|
251
|
-
ue.displayName = "TkxForm";
|
|
252
|
-
function ae({
|
|
253
|
-
name: e,
|
|
254
|
-
label: r,
|
|
255
|
-
rules: t,
|
|
256
|
-
help: s,
|
|
257
|
-
required: i,
|
|
258
|
-
children: u,
|
|
259
|
-
className: E,
|
|
260
|
-
style: L
|
|
261
|
-
}) {
|
|
262
|
-
const b = Q(), m = oe(), { state: v, layout: p, disabled: H } = m, h = A(() => ce(t, i), [t, i]), x = ie(h), M = f({ rules: h });
|
|
263
|
-
M.current.rules = h;
|
|
264
|
-
const I = f(!1);
|
|
265
|
-
I.current || (m.registerField(e, M.current), I.current = !0), A(() => {
|
|
266
|
-
m.registerField(e, M.current);
|
|
267
|
-
}, [h, e, m]);
|
|
268
|
-
const q = v.values[e], z = v.touched[e] ? v.errors[e] ?? null : null, w = z ? G(z) : null, R = r ? G(r) : void 0, k = s ? G(s) : void 0, P = d(
|
|
269
|
-
(c) => {
|
|
270
|
-
let a;
|
|
271
|
-
if (c !== null && typeof c == "object" && "target" in c) {
|
|
272
|
-
const F = c.target;
|
|
273
|
-
a = F.type === "checkbox" ? F.checked : F.value;
|
|
274
|
-
} else
|
|
275
|
-
a = c;
|
|
276
|
-
m.setFieldValue(e, a);
|
|
277
|
-
},
|
|
278
|
-
[m, e]
|
|
279
|
-
), Y = d(() => {
|
|
280
|
-
m.setFieldTouched(e), m.validateField(e);
|
|
281
|
-
}, [m, e]), C = X(u, {
|
|
282
|
-
value: q ?? "",
|
|
283
|
-
onChange: P,
|
|
284
|
-
onBlur: Y,
|
|
285
|
-
error: w ?? void 0,
|
|
286
|
-
isInvalid: !!w,
|
|
287
|
-
isRequired: x,
|
|
288
|
-
disabled: H || u.props.disabled,
|
|
289
|
-
name: e
|
|
290
|
-
}), $ = p === "horizontal", B = p === "inline", D = /* @__PURE__ */ N("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ N("path", { d: "M12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z" }) }), n = R ? /* @__PURE__ */ T(
|
|
291
|
-
"label",
|
|
292
|
-
{
|
|
293
|
-
className: g(
|
|
294
|
-
"text-sm font-medium font-sans",
|
|
295
|
-
$ ? "min-w-[140px] pt-2.5" : ""
|
|
296
|
-
),
|
|
297
|
-
style: { color: b.text },
|
|
298
|
-
children: [
|
|
299
|
-
R,
|
|
300
|
-
x && /* @__PURE__ */ N("span", { "aria-hidden": "true", className: g("ml-1"), style: { color: b.danger }, children: "*" })
|
|
301
|
-
]
|
|
302
|
-
}
|
|
303
|
-
) : null, o = /* @__PURE__ */ T(se, { children: [
|
|
304
|
-
k && !w && /* @__PURE__ */ N("span", { className: g("text-xs mt-0.5"), style: { color: b.textMuted }, children: k }),
|
|
305
|
-
w && /* @__PURE__ */ T(
|
|
306
|
-
"span",
|
|
307
|
-
{
|
|
308
|
-
role: "alert",
|
|
309
|
-
className: g("text-xs flex items-center gap-1 mt-0.5"),
|
|
310
|
-
style: {
|
|
311
|
-
color: b.danger,
|
|
312
|
-
animation: "tkxFormErrorReveal 200ms ease-out"
|
|
313
|
-
},
|
|
314
|
-
children: [
|
|
315
|
-
D,
|
|
316
|
-
w
|
|
317
|
-
]
|
|
318
|
-
}
|
|
319
|
-
)
|
|
320
|
-
] });
|
|
321
|
-
return B ? /* @__PURE__ */ T(
|
|
322
|
-
"div",
|
|
323
|
-
{
|
|
324
|
-
className: S(g("flex flex-col gap-1"), E),
|
|
325
|
-
style: L,
|
|
326
|
-
children: [
|
|
327
|
-
n,
|
|
328
|
-
C,
|
|
329
|
-
o
|
|
330
|
-
]
|
|
331
|
-
}
|
|
332
|
-
) : $ ? /* @__PURE__ */ T(
|
|
333
|
-
"div",
|
|
334
|
-
{
|
|
335
|
-
className: S(g("flex flex-row gap-4 items-start"), E),
|
|
336
|
-
style: L,
|
|
337
|
-
children: [
|
|
338
|
-
n,
|
|
339
|
-
/* @__PURE__ */ T("div", { className: g("flex flex-col gap-1 flex-1 min-w-0"), children: [
|
|
340
|
-
C,
|
|
341
|
-
o
|
|
342
|
-
] })
|
|
343
|
-
]
|
|
344
|
-
}
|
|
345
|
-
) : /* @__PURE__ */ T(
|
|
346
|
-
"div",
|
|
347
|
-
{
|
|
348
|
-
className: S(g("flex flex-col gap-1"), E),
|
|
349
|
-
style: L,
|
|
350
|
-
children: [
|
|
351
|
-
n,
|
|
352
|
-
C,
|
|
353
|
-
o
|
|
354
|
-
]
|
|
355
|
-
}
|
|
356
|
-
);
|
|
357
|
-
}
|
|
358
|
-
ae.displayName = "TkxFormField";
|
|
359
|
-
let J = !1;
|
|
360
|
-
function le() {
|
|
361
|
-
if (J || typeof document > "u") return;
|
|
362
|
-
J = !0;
|
|
363
|
-
const e = document.createElement("style");
|
|
364
|
-
e.setAttribute("data-tkx-form", ""), e.textContent = `
|
|
365
|
-
@keyframes tkxFormErrorReveal {
|
|
366
|
-
from {
|
|
367
|
-
opacity: 0;
|
|
368
|
-
transform: translateY(-4px);
|
|
369
|
-
}
|
|
370
|
-
to {
|
|
371
|
-
opacity: 1;
|
|
372
|
-
transform: translateY(0);
|
|
373
|
-
}
|
|
374
|
-
}
|
|
375
|
-
`, document.head.appendChild(e);
|
|
376
|
-
}
|
|
377
|
-
le();
|
|
378
|
-
export {
|
|
379
|
-
ue as T,
|
|
380
|
-
ye as a,
|
|
381
|
-
ge as b,
|
|
382
|
-
ve as c,
|
|
383
|
-
we as d,
|
|
384
|
-
ae as e,
|
|
385
|
-
Fe as f,
|
|
386
|
-
Ee as g,
|
|
387
|
-
pe as u
|
|
388
|
-
};
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
"use strict";const n=require("react"),C=require("./index-BINBzXuY.cjs"),l=require("react/jsx-runtime"),$=require("./security-C369oOWH.cjs"),d=require("./tkx-BeNyC0w7.cjs");function G(){const[e,r]=n.useState(()=>typeof window>"u"?!1:C.prefersReducedMotion());return n.useEffect(()=>{if(typeof window>"u")return;const t=window.matchMedia("(prefers-reduced-motion: reduce)"),o=i=>r(i.matches);return t.addEventListener("change",o),()=>t.removeEventListener("change",o)},[]),e}function J(){const[e,r]=n.useState(()=>typeof window>"u"?!1:C.prefersHighContrast());return n.useEffect(()=>{if(typeof window>"u")return;const t=window.matchMedia("(forced-colors: active)"),o=i=>r(i.matches);return t.addEventListener("change",o),()=>t.removeEventListener("change",o)},[]),e}function Q(e){const r=n.useRef(null);return n.useEffect(()=>{if(!e||!r.current)return;const t=C.createFocusTrap(r.current);return t.activate(),()=>t.deactivate()},[e]),r}function U(){const e=n.useRef(null);return n.useEffect(()=>{if(!(typeof document>"u"))return e.current=C.createAnnouncer(),()=>{var r;(r=e.current)==null||r.destroy()}},[]),n.useCallback((r,t="polite")=>{var o;(o=e.current)==null||o.announce(r,t)},[])}function V(e,r=!0){const t=n.useRef(e);t.current=e,n.useEffect(()=>{if(!r||typeof document>"u")return;const o=i=>{i.key==="Escape"&&t.current()};return document.addEventListener("keydown",o),()=>document.removeEventListener("keydown",o)},[r])}function X(e,r){const t=n.useRef(r);t.current=r,n.useEffect(()=>{const o=i=>{!e.current||e.current.contains(i.target)||t.current()};return document.addEventListener("pointerdown",o),()=>document.removeEventListener("pointerdown",o)},[e])}const B=n.createContext(null);function Z(){const e=n.useContext(B);if(!e)throw new Error("TkxFormField must be used inside a <TkxForm>. Wrap your fields in a TkxForm component.");return e}async function K(e,r){for(const t of r){if(t.required&&(e==null||e===""||Array.isArray(e)&&e.length===0))return t.message??"This field is required";if(!(e==null||e==="")){if(t.min!==void 0){if(typeof e=="string"&&e.length<t.min)return t.message??`Must be at least ${t.min} characters`;if(typeof e=="number"&&e<t.min)return t.message??`Must be at least ${t.min}`}if(t.max!==void 0){if(typeof e=="string"&&e.length>t.max)return t.message??`Must be no more than ${t.max} characters`;if(typeof e=="number"&&e>t.max)return t.message??`Must be no more than ${t.max}`}if(t.pattern&&typeof e=="string"&&!t.pattern.test(e))return t.message??"Invalid format";if(t.validator){const o=await t.validator(e);if(o)return o}}}return null}function ee(e,r){const t=e?[...e]:[];return r&&!t.some(o=>o.required)&&t.unshift({required:!0,message:"This field is required"}),t}function te(e){return e.some(r=>r.required)}function re(){const e=n.useContext(B),r=n.useRef({}),t=n.useRef({}),o=n.useRef({}),i=n.useMemo(()=>({getFieldValue:a=>r.current[a],setFieldValue:(a,v)=>{r.current[a]=v},getFieldsValue:()=>({...r.current}),setFieldsValue:a=>{Object.assign(r.current,a)},validateFields:()=>Promise.resolve({...r.current}),validateField:a=>Promise.resolve(!0),resetFields:()=>{r.current={},t.current={},o.current={}},getFieldError:a=>t.current[a]??null,isFieldTouched:a=>o.current[a]??!1}),[]);return e?e.instance:i}function D({onSubmit:e,onValuesChange:r,initialValues:t={},layout:o="vertical",disabled:i=!1,children:a,className:v,style:M,form:b}){const x=C.useTheme(),[y,p]=n.useState({values:{...t},errors:{},touched:{}}),z=n.useRef(t),h=n.useRef({}),F=n.useRef(y);F.current=y;const T=n.useCallback((s,c)=>{h.current[s]=c},[]),q=n.useCallback(s=>{delete h.current[s]},[]),j=n.useCallback((s,c)=>{p(u=>{const f={...u,values:{...u.values,[s]:c}};return r==null||r({[s]:c},f.values),f})},[r]),N=n.useCallback((s,c)=>{p(u=>({...u,errors:{...u.errors,[s]:c}}))},[]),R=n.useCallback(s=>{p(c=>({...c,touched:{...c.touched,[s]:!0}}))},[]),w=n.useCallback(async s=>{const c=h.current[s];if(!c)return!0;const u=F.current.values[s],f=await K(u,c.rules);return p(g=>({...g,errors:{...g.errors,[s]:f},touched:{...g.touched,[s]:!0}})),f===null},[]),E=n.useCallback(async()=>{const s=Object.keys(h.current),c=await Promise.all(s.map(async m=>{const k=h.current[m],W=F.current.values[m],_=await K(W,k.rules);return{name:m,error:_}})),u={},f={};let g=!1;for(const{name:m,error:k}of c)u[m]=k,f[m]=!0,k&&(g=!0);if(p(m=>({...m,errors:{...m.errors,...u},touched:{...m.touched,...f}})),g){const m=Object.fromEntries(c.filter(k=>k.error).map(k=>[k.name,k.error]));return Promise.reject(m)}return{...F.current.values}},[]),I=n.useCallback(()=>{p({values:{...z.current},errors:{},touched:{}})},[]),S=n.useMemo(()=>({getFieldValue:s=>F.current.values[s],setFieldValue:j,getFieldsValue:()=>({...F.current.values}),setFieldsValue:s=>{p(c=>{const u={...c.values,...s};return r==null||r(s,u),{...c,values:u}})},validateFields:E,validateField:w,resetFields:I,getFieldError:s=>F.current.errors[s]??null,isFieldTouched:s=>!!F.current.touched[s]}),[j,E,w,I,r]),L=n.useCallback(async s=>{s.preventDefault();try{const c=await E();await(e==null?void 0:e(c))}catch{}},[E,e]),A=o==="inline"?d.tkx("flex flex-row flex-wrap items-end gap-4"):d.tkx("flex flex-col gap-5"),H=b??S,P=n.useMemo(()=>({state:y,initialValues:z.current,layout:o,disabled:i,fieldMeta:h,setFieldValue:j,setFieldError:N,setFieldTouched:R,registerField:T,unregisterField:q,validateField:w,instance:H}),[y,o,i,j,N,R,T,q,w,H]);return l.jsx(B.Provider,{value:P,children:l.jsx("form",{noValidate:!0,role:"form","aria-label":"Form",onSubmit:L,className:d.cx(A,v),style:{color:x.text,...M},children:a})})}D.displayName="TkxForm";function O({name:e,label:r,rules:t,help:o,required:i,children:a,className:v,style:M}){const b=C.useTheme(),x=Z(),{state:y,layout:p,disabled:z}=x,h=n.useMemo(()=>ee(t,i),[t,i]),F=te(h),T=n.useRef({rules:h});T.current.rules=h;const q=n.useRef(!1);q.current||(x.registerField(e,T.current),q.current=!0),n.useMemo(()=>{x.registerField(e,T.current)},[h,e,x]);const j=y.values[e],N=y.touched[e]?y.errors[e]??null:null,R=N?$.sanitizeString(N):null,w=r?$.sanitizeString(r):void 0,E=o?$.sanitizeString(o):void 0,I=n.useCallback(u=>{let f;if(u!==null&&typeof u=="object"&&"target"in u){const g=u.target;f=g.type==="checkbox"?g.checked:g.value}else f=u;x.setFieldValue(e,f)},[x,e]),S=n.useCallback(()=>{x.setFieldTouched(e),x.validateField(e)},[x,e]),L=n.cloneElement(a,{value:j??"",onChange:I,onBlur:S,error:R??void 0,isInvalid:!!R,isRequired:F,disabled:z||a.props.disabled,name:e}),A=p==="horizontal",H=p==="inline",P=l.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor","aria-hidden":"true",children:l.jsx("path",{d:"M12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"})}),s=w?l.jsxs("label",{className:d.tkx("text-sm font-medium font-sans",A?"min-w-[140px] pt-2.5":""),style:{color:b.text},children:[w,F&&l.jsx("span",{"aria-hidden":"true",className:d.tkx("ml-1"),style:{color:b.danger},children:"*"})]}):null,c=l.jsxs(l.Fragment,{children:[E&&!R&&l.jsx("span",{className:d.tkx("text-xs mt-0.5"),style:{color:b.textMuted},children:E}),R&&l.jsxs("span",{role:"alert",className:d.tkx("text-xs flex items-center gap-1 mt-0.5"),style:{color:b.danger,animation:"tkxFormErrorReveal 200ms ease-out"},children:[P,R]})]});return H?l.jsxs("div",{className:d.cx(d.tkx("flex flex-col gap-1"),v),style:M,children:[s,L,c]}):A?l.jsxs("div",{className:d.cx(d.tkx("flex flex-row gap-4 items-start"),v),style:M,children:[s,l.jsxs("div",{className:d.tkx("flex flex-col gap-1 flex-1 min-w-0"),children:[L,c]})]}):l.jsxs("div",{className:d.cx(d.tkx("flex flex-col gap-1"),v),style:M,children:[s,L,c]})}O.displayName="TkxFormField";let Y=!1;function ne(){if(Y||typeof document>"u")return;Y=!0;const e=document.createElement("style");e.setAttribute("data-tkx-form",""),e.textContent=`
|
|
2
|
-
@keyframes tkxFormErrorReveal {
|
|
3
|
-
from {
|
|
4
|
-
opacity: 0;
|
|
5
|
-
transform: translateY(-4px);
|
|
6
|
-
}
|
|
7
|
-
to {
|
|
8
|
-
opacity: 1;
|
|
9
|
-
transform: translateY(0);
|
|
10
|
-
}
|
|
11
|
-
}
|
|
12
|
-
`,document.head.appendChild(e)}ne();exports.TkxForm=D;exports.TkxFormField=O;exports.useAnnounce=U;exports.useClickOutside=X;exports.useEscapeKey=V;exports.useFocusTrap=Q;exports.useHighContrast=J;exports.useReducedMotion=G;exports.useTkxForm=re;
|
package/dist/index-BINBzXuY.cjs
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
"use strict";const u=require("react"),G=2166136261,W=16777619;function v(n){let e=G;for(let t=0;t<n.length;t++)e^=n.charCodeAt(t),e=Math.imul(e,W)>>>0;return e.toString(16).padStart(8,"0")}class M{constructor(e=512){this.cache=new Map,this.hits=0,this.misses=0,this.ceiling=Math.min(e,512)}get(e){if(!this.cache.has(e)){this.misses++;return}this.hits++;const t=this.cache.get(e);return this.cache.delete(e),this.cache.set(e,t),t}set(e,t){this.cache.has(e)?this.cache.delete(e):this.cache.size>=this.ceiling&&this.cache.delete(this.cache.keys().next().value),this.cache.set(e,t)}has(e){return this.cache.has(e)}invalidate(e){e!==void 0?this.cache.delete(e):this.cache.clear()}get size(){return this.cache.size}get cacheHitRate(){const e=this.hits+this.misses;return e===0?0:this.hits/e*100}}const f=new M(512);function $(n,e){const t=f.get(n);if(t!==void 0)return t;const s=e();return f.set(n,s),s}const C=[];let b=!1;const m=[];let y=0,l=0;function _(){const n=C.splice(0),e=performance.now();for(const s of n)try{s()}catch{}const t=performance.now()-e;y+=t,l++,m.push({duration:t,timestamp:Date.now()}),m.length>100&&m.shift()}function H(n){C.push(n),b||(b=!0,queueMicrotask(()=>{_(),b=!1}))}function X(n){const e=n!==void 0?m.slice(-n):m.slice();return{avgRenderTime:l===0?0:y/l,cacheHitRate:f.cacheHitRate,renderCount:l,recent:e}}function Q(n){n!==void 0?f.invalidate(n):f.invalidate()}const Z={hash:v,memoize:$,batchUpdate:H,invalidate:Q,get avgRenderTime(){return l===0?0:y/l},get cacheHitRate(){return f.cacheHitRate},getMetrics:X},x=new Map;function R(n){return n.replace(/([A-Z])/g,"-$1").toLowerCase()}function J(n){return"tkx-"+v(n)}function j(n){const e=J(n);return x.has(e)||x.set(e,n),e}function D(n,...e){const t=n.reduce((r,a,i)=>r+a+(e[i]!==void 0?String(e[i]):""),"");return{className:j(t.trim()),styles:t.trim()}}function z(n){const e=Object.entries(n).map(([s,r])=>`${R(s)}: ${r};`).join(" ");return{className:j(e),styles:e}}const Y={xs:"480px",sm:"640px",md:"768px",lg:"1024px",xl:"1280px","2xl":"1536px"};function L(n,e){return`@media (min-width: ${Y[n]}) { ${e} }`}function F(n,e){const t=Object.entries(e).map(([s,r])=>{const a=Object.entries(r).map(([i,o])=>`${R(i)}: ${o};`).join(" ");return`${s} { ${a} }`}).join(" ");return`@keyframes ${n} { ${t} }`}function w(n,e){return e!==void 0?`--tkx-${n}: ${e};`:`var(--tkx-${n})`}function A(){return Array.from(x.entries()).map(([n,e])=>`.${n} { ${e} }`).join(`
|
|
2
|
-
`)}function O(){x.clear()}function N(){if(typeof document>"u")return;let n=document.getElementById("tkx-styles");n||(n=document.createElement("style"),n.id="tkx-styles",document.head.appendChild(n)),n.textContent=A()}const ee={css:D,fromObject:z,responsive:L,keyframes:F,cssVar:w,extractCSS:A,injectStyles:N,resetStyles:O};function te(n){const e=n.replace("#",""),t=e.length===3?e.split("").map(i=>i+i).join(""):e,s=parseInt(t.slice(0,2),16),r=parseInt(t.slice(2,4),16),a=parseInt(t.slice(4,6),16);return[s,r,a]}function S(n){const[e,t,s]=te(n).map(r=>{const a=r/255;return a<=.03928?a/12.92:((a+.055)/1.055)**2.4});return .2126*e+.7152*t+.0722*s}function d(n,e){const t=S(n),s=S(e),r=Math.max(t,s),a=Math.min(t,s);return(r+.05)/(a+.05)}function g(n,e,t=!1){return d(n,e)>=(t?3:4.5)}function B(n,e,t=!1){return d(n,e)>=(t?4.5:7)}function P(n,e){const s=e??["#ffffff","#000000"];return s.reduce((r,a)=>d(a,n)>d(r,n)?a:r,s[0])}function K(){const n=document.createElement("div"),e=document.createElement("div");for(const t of[n,e])t.setAttribute("aria-atomic","true"),t.style.cssText="position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;",document.body.appendChild(t);return n.setAttribute("aria-live","polite"),e.setAttribute("aria-live","assertive"),{announce(t,s="polite"){const r=s==="assertive"?e:n;r.textContent="",setTimeout(()=>{r.textContent=t},0)},destroy(){n.remove(),e.remove()}}}const ne=["a[href]","button:not([disabled])","input:not([disabled])","select:not([disabled])","textarea:not([disabled])",'[tabindex]:not([tabindex="-1"])',"details > summary"].join(", ");function U(n){let e=null,t=null;function s(){return Array.from(n.querySelectorAll(ne)).filter(r=>!r.closest("[hidden]")&&!r.closest('[aria-hidden="true"]'))}return{activate(){e=document.activeElement;const r=s();r.length>0&&r[0].focus(),t=a=>{if(a.key!=="Tab")return;const i=s();if(i.length===0)return;const o=i[0],h=i[i.length-1];a.shiftKey?document.activeElement===o&&(a.preventDefault(),h.focus()):document.activeElement===h&&(a.preventDefault(),o.focus())},n.addEventListener("keydown",t)},deactivate(){t&&n.removeEventListener("keydown",t),e instanceof HTMLElement&&e.focus(),e=null,t=null}}}function V(n,e,t,s){let r=e;switch(n.key){case"ArrowLeft":case"ArrowUp":n.preventDefault(),r=e===0?t-1:e-1;break;case"ArrowRight":case"ArrowDown":n.preventDefault(),r=e===t-1?0:e+1;break;case"Home":n.preventDefault(),r=0;break;case"End":n.preventDefault(),r=t-1;break;case"Enter":case" ":n.preventDefault(),s(e);return;default:return}s(r)}function re(n,e,t,s,r){let a=e;switch(n.key){case"ArrowUp":n.preventDefault(),a=e===0?t-1:e-1;break;case"ArrowDown":n.preventDefault(),a=e===t-1?0:e+1;break;case"Home":n.preventDefault(),a=0;break;case"End":n.preventDefault(),a=t-1;break;case"Enter":case" ":n.preventDefault(),s(e);return;case"Escape":n.preventDefault(),r==null||r();return;default:return}s(a)}function q(){return typeof window>"u"?!1:window.matchMedia("(prefers-reduced-motion: reduce)").matches}function I(){return typeof window>"u"?!1:window.matchMedia("(forced-colors: active)").matches}function se(n,e="polite"){if(typeof document>"u")return;let t=document.getElementById("tkx-live-region");t||(t=document.createElement("div"),t.id="tkx-live-region",t.setAttribute("aria-live",e),t.setAttribute("aria-atomic","true"),t.style.cssText="position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;",document.body.appendChild(t)),t.textContent="",setTimeout(()=>{t&&(t.textContent=n)},0)}const ae={contrastRatio:d,meetsAA:g,meetsAAA:B,getAccessibleForeground:P,createAnnouncer:K,createFocusTrap:U,handleTabsKeyboard:V,handleMenuKeyboard:re,prefersReducedMotion:q,prefersHighContrast:I,announce:se},ie=typeof window<"u"?u.useLayoutEffect:u.useEffect,E={bg:"#0a0a0f",surface:"#12121a",surfaceAlt:"#1a1a2e",border:"#2a2a3e",text:"#e8e8f4",textMuted:"#8888aa",primary:"#00f5d4",secondary:"#7b2ff7",danger:"#f72585",warning:"#ffbe0b",success:"#06d6a0",info:"#3a86ff"},oe={bg:"#f8f6f1",surface:"#ffffff",surfaceAlt:"#f0ede6",border:"#ddd8cc",text:"#1a1815",textMuted:"#6b6560",primary:"#0d7c5f",secondary:"#6930c3",danger:"#c1121f",warning:"#d4a017",success:"#0d7c5f",info:"#1d4ed8"},ce=/^#[0-9a-fA-F]{3,8}$/;function le(n,e){const t={...n,...e};for(const[s,r]of Object.entries(t))if(!ce.test(r))throw new Error(`Invalid hex color for theme token '${s}': ${r}`);return g(t.text,t.bg)||console.warn(`[TekiVex] Theme contrast warning: text (${t.text}) vs bg (${t.bg}) does not meet WCAG AA minimum (4.5:1)`),g(t.primary,t.bg)||console.warn(`[TekiVex] Theme contrast warning: primary (${t.primary}) vs bg (${t.bg}) does not meet WCAG AA minimum`),t}const k=u.createContext(E);function ue({theme:n=E,children:e}){ie(()=>{const s=Object.entries(n).map(([a,i])=>w(a,i)).join(" ");let r=document.getElementById("tkx-theme");if(!r){r=document.createElement("style"),r.id="tkx-theme";const a=document.head.querySelector("style");a?document.head.insertBefore(r,a):document.head.appendChild(r)}r.textContent=`:root { ${s} }`},[n]);const t=Object.fromEntries(Object.entries(n).map(([s,r])=>[`--tkx-${s}`,r]));return u.createElement(k.Provider,{value:n},u.createElement("div",{style:{display:"contents",...t}},e))}function fe(){return u.useContext(k)}function de(n){const e=n.replace("#",""),t=parseInt(e.slice(0,2),16)/255,s=parseInt(e.slice(2,4),16)/255,r=parseInt(e.slice(4,6),16)/255,a=Math.max(t,s,r),i=Math.min(t,s,r);let o=0,h=0;const T=(a+i)/2;if(a!==i){const p=a-i;switch(h=T>.5?p/(2-a-i):p/(a+i),a){case t:o=((s-r)/p+(s<r?6:0))/6;break;case s:o=((r-t)/p+2)/6;break;case r:o=((t-s)/p+4)/6;break}}return[Math.round(o*360),Math.round(h*100),Math.round(T*100)]}function c(n,e,t){e/=100,t/=100;const s=e*Math.min(t,1-t),r=a=>{const i=(a+n/30)%12,o=t-s*Math.max(Math.min(i-3,9-i,1),-1);return Math.round(255*o).toString(16).padStart(2,"0")};return`#${r(0)}${r(8)}${r(4)}`}function he(n){const[e,t]=de(n);return{50:c(e,Math.min(t,30),96),100:c(e,Math.min(t,40),90),200:c(e,Math.min(t,50),80),300:c(e,t,70),400:c(e,t,60),500:n,600:c(e,t,45),700:c(e,t,35),800:c(e,t,25),900:c(e,t,15)}}const pe={xs:{fontSize:"0.75rem",lineHeight:"1rem"},sm:{fontSize:"0.875rem",lineHeight:"1.25rem"},base:{fontSize:"1rem",lineHeight:"1.5rem"},lg:{fontSize:"1.125rem",lineHeight:"1.75rem"},xl:{fontSize:"1.25rem",lineHeight:"1.75rem"},"2xl":{fontSize:"1.5rem",lineHeight:"2rem"},"3xl":{fontSize:"1.875rem",lineHeight:"2.25rem"},"4xl":{fontSize:"2.25rem",lineHeight:"2.5rem"},"5xl":{fontSize:"3rem",lineHeight:"1.15"}},me={0:"0px",.5:"2px",1:"4px",1.5:"6px",2:"8px",2.5:"10px",3:"12px",4:"16px",5:"20px",6:"24px",8:"32px",10:"40px",12:"48px",16:"64px",20:"80px",24:"96px"},xe={sm:640,md:768,lg:1024,xl:1280,"2xl":1536},ge={none:"none",xs:"0 1px 2px 0 rgba(0,0,0,0.05)",sm:"0 1px 3px 0 rgba(0,0,0,0.1), 0 1px 2px -1px rgba(0,0,0,0.1)",md:"0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1)",lg:"0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1)",xl:"0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1)","2xl":"0 25px 50px -12px rgba(0,0,0,0.25)",inner:"inset 0 2px 4px 0 rgba(0,0,0,0.06)"},be={hide:-1,base:0,dropdown:1e3,sticky:1100,fixed:1200,overlay:1300,modal:1400,popover:1500,tooltip:1600,toast:1700,max:9999},ve={none:"0",sm:"4px",md:"6px",lg:"8px",xl:"12px","2xl":"16px",full:"9999px"};exports.LRUCache=M;exports.Quantum=Z;exports.TKX=ee;exports.ThemeContext=k;exports.ThemeProvider=ue;exports.WCAGEngine=ae;exports.auroraLight=oe;exports.batchUpdate=H;exports.breakpoints=xe;exports.contrastRatio=d;exports.createAnnouncer=K;exports.createFocusTrap=U;exports.createTheme=le;exports.css=D;exports.cssVar=w;exports.extractCSS=A;exports.fnv1aHash=v;exports.fromObject=z;exports.generatePalette=he;exports.getAccessibleForeground=P;exports.handleTabsKeyboard=V;exports.injectStyles=N;exports.keyframes=F;exports.meetsAA=g;exports.meetsAAA=B;exports.memoize=$;exports.prefersHighContrast=I;exports.prefersReducedMotion=q;exports.quantumDark=E;exports.radii=ve;exports.resetStyles=O;exports.responsive=L;exports.shadows=ge;exports.spacing=me;exports.typography=pe;exports.useTheme=fe;exports.zIndex=be;
|