@wakastellar/ui 0.6.0 → 1.0.0

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.
Files changed (62) hide show
  1. package/dist/blocks/index.d.ts +0 -39
  2. package/dist/components/DataTable/DataTable.d.ts +1 -1
  3. package/dist/components/DataTable/DataTableAdvanced.d.ts +1 -1
  4. package/dist/components/DataTable/DataTableFilters.d.ts +3 -3
  5. package/dist/components/DataTable/DataTableSelection.d.ts +12 -17
  6. package/dist/components/DataTable/hooks/useDataTable.d.ts +1 -1
  7. package/dist/components/DataTable/hooks/useDataTableAdvanced.d.ts +6 -6
  8. package/dist/components/DataTable/hooks/useDataTableExport.d.ts +4 -15
  9. package/dist/components/DataTable/hooks/useDataTableImport.d.ts +2 -16
  10. package/dist/components/DataTable/hooks/useDataTableVirtualization.d.ts +1 -1
  11. package/dist/components/DataTable/index.d.ts +2 -48
  12. package/dist/components/DataTable/types.d.ts +25 -417
  13. package/dist/components/command/index.d.ts +2 -6
  14. package/dist/components/index.d.ts +0 -26
  15. package/dist/components/language-selector/index.d.ts +1 -19
  16. package/dist/components/theme-selector/index.d.ts +0 -10
  17. package/dist/components/typography/index.d.ts +1 -1
  18. package/dist/components/waka-spinner/index.d.ts +21 -57
  19. package/dist/components/waka-theme-creator/index.d.ts +22 -73
  20. package/dist/components/waka-theme-manager/index.d.ts +1 -14
  21. package/dist/context/admincrumb-context.d.ts +1 -118
  22. package/dist/context/index.d.ts +2 -2
  23. package/dist/context/language-context.d.ts +23 -177
  24. package/dist/context/theme-context.d.ts +3 -4
  25. package/dist/context/theme-provider.d.ts +19 -57
  26. package/dist/context/waka-provider.d.ts +7 -50
  27. package/dist/hooks/use-toast.d.ts +0 -116
  28. package/dist/hooks/use-translation.d.ts +1 -24
  29. package/dist/hooks/useToast.d.ts +0 -82
  30. package/dist/index.cjs.js +36 -61
  31. package/dist/index.d.ts +3 -35
  32. package/dist/index.es.js +7873 -23890
  33. package/dist/types/provider.d.ts +17 -48
  34. package/dist/ui.css +1 -1
  35. package/dist/utils/cn.d.ts +1 -15
  36. package/dist/utils/datetime-helpers.d.ts +33 -241
  37. package/dist/utils/index.d.ts +0 -4
  38. package/dist/utils/theme-loader.d.ts +30 -140
  39. package/dist/utils/tweak.d.ts +1 -14
  40. package/package.json +40 -107
  41. package/src/styles/datepicker.css +2 -9
  42. package/src/styles/globals.css +4 -4
  43. package/dist/charts.cjs.js +0 -1
  44. package/dist/charts.es.js +0 -16
  45. package/dist/cn-CAc3sAGM.js +0 -21
  46. package/dist/cn-zrNBeCrC.js +0 -1
  47. package/dist/components/DataTable/DataTableGroupRow.d.ts +0 -35
  48. package/dist/components/DataTable/DataTableRow.d.ts +0 -30
  49. package/dist/components/WakaKeycloakLogin/WakaKeycloakLogin.d.ts +0 -3
  50. package/dist/components/WakaKeycloakLogin/index.d.ts +0 -2
  51. package/dist/components/WakaKeycloakLogin/types.d.ts +0 -56
  52. package/dist/export.cjs.js +0 -1
  53. package/dist/export.es.js +0 -5
  54. package/dist/index-CENPre_9.js +0 -466
  55. package/dist/index-CHLjUBPo.js +0 -1
  56. package/dist/rich-text.cjs.js +0 -1
  57. package/dist/rich-text.es.js +0 -4
  58. package/dist/types-Bjy1Hy76.js +0 -1111
  59. package/dist/types-CHv7a1SP.js +0 -1
  60. package/dist/useDataTableImport-DqeEL4GC.js +0 -124
  61. package/dist/useDataTableImport-sQwBFAJ_.js +0 -775
  62. package/dist/utils/logger.d.ts +0 -60
@@ -1,1111 +0,0 @@
1
- import { jsx as t, jsxs as S } from "react/jsx-runtime";
2
- import * as v from "react";
3
- import { useState as oe, useEffect as se, useMemo as re } from "react";
4
- import { c as _ } from "./cn-CAc3sAGM.js";
5
- import { Minus as ae, TrendingUp as ce, TrendingDown as ue } from "lucide-react";
6
- function de({
7
- className: e,
8
- ...n
9
- }) {
10
- return /* @__PURE__ */ t(
11
- "div",
12
- {
13
- className: _("animate-pulse rounded-md bg-muted", e),
14
- ...n
15
- }
16
- );
17
- }
18
- function ie() {
19
- const [e, n] = oe(null), [r, c] = oe(!0), [s, k] = oe(null);
20
- return se(() => {
21
- let f = !0;
22
- return (async () => {
23
- try {
24
- const a = await import("recharts");
25
- f && (n({
26
- ResponsiveContainer: a.ResponsiveContainer,
27
- BarChart: a.BarChart,
28
- LineChart: a.LineChart,
29
- AreaChart: a.AreaChart,
30
- PieChart: a.PieChart,
31
- Bar: a.Bar,
32
- Line: a.Line,
33
- Area: a.Area,
34
- Pie: a.Pie,
35
- Cell: a.Cell,
36
- XAxis: a.XAxis,
37
- YAxis: a.YAxis,
38
- CartesianGrid: a.CartesianGrid,
39
- Tooltip: a.Tooltip,
40
- Legend: a.Legend,
41
- // SVG elements from React, not Recharts
42
- defs: "defs",
43
- linearGradient: "linearGradient",
44
- stop: "stop"
45
- }), c(!1));
46
- } catch (a) {
47
- f && (k(a instanceof Error ? a : new Error("Failed to load Recharts")), c(!1));
48
- }
49
- })(), () => {
50
- f = !1;
51
- };
52
- }, []), {
53
- components: e,
54
- loading: r,
55
- error: s,
56
- isAvailable: !r && !s && e !== null
57
- };
58
- }
59
- const fe = [
60
- "hsl(var(--chart-1, 220 70% 50%))",
61
- "hsl(var(--chart-2, 160 60% 45%))",
62
- "hsl(var(--chart-3, 30 80% 55%))",
63
- "hsl(var(--chart-4, 280 65% 60%))",
64
- "hsl(var(--chart-5, 340 75% 55%))"
65
- ], J = {
66
- colors: fe,
67
- gridColor: "hsl(var(--border, 220 13% 91%))",
68
- axisColor: "hsl(var(--muted-foreground, 220 9% 46%))",
69
- textColor: "hsl(var(--foreground, 224 71% 4%))",
70
- tooltipBackground: "hsl(var(--popover, 0 0% 100%))",
71
- tooltipText: "hsl(var(--popover-foreground, 224 71% 4%))",
72
- tooltipBorder: "hsl(var(--border, 220 13% 91%))",
73
- fontFamily: "inherit"
74
- };
75
- function Q(e, n = "default") {
76
- const r = re(() => ({
77
- colors: e?.colors ?? J.colors,
78
- gridColor: e?.gridColor ?? J.gridColor,
79
- axisColor: e?.axisColor ?? J.axisColor,
80
- textColor: e?.textColor ?? J.textColor,
81
- tooltipBackground: e?.tooltipBackground ?? J.tooltipBackground,
82
- tooltipText: e?.tooltipText ?? J.tooltipText,
83
- tooltipBorder: e?.tooltipBorder ?? J.tooltipBorder,
84
- fontFamily: e?.fontFamily ?? J.fontFamily
85
- }), [e]), c = re(() => (f) => r.colors[f % r.colors.length], [r.colors]), s = re(() => ({
86
- contentStyle: {
87
- backgroundColor: r.tooltipBackground,
88
- color: r.tooltipText,
89
- border: `1px solid ${r.tooltipBorder}`,
90
- borderRadius: "var(--radius, 0.5rem)",
91
- padding: "8px 12px",
92
- boxShadow: "0 2px 4px rgba(0,0,0,0.1)",
93
- fontFamily: r.fontFamily
94
- },
95
- wrapperStyle: {
96
- outline: "none"
97
- },
98
- itemStyle: {
99
- color: r.tooltipText,
100
- padding: "2px 0"
101
- },
102
- labelStyle: {
103
- color: r.textColor,
104
- fontWeight: 600,
105
- marginBottom: "4px"
106
- }
107
- }), [r]), k = re(() => {
108
- const f = "relative";
109
- switch (n) {
110
- case "gradient":
111
- return `${f} bg-gradient-to-br from-background to-muted/20`;
112
- case "outline":
113
- return `${f} border border-border rounded-lg p-4`;
114
- case "glass":
115
- return `${f} bg-background/50 backdrop-blur-sm border border-border/50 rounded-lg p-4`;
116
- default:
117
- return f;
118
- }
119
- }, [n]);
120
- return {
121
- theme: r,
122
- getColor: c,
123
- tooltipStyles: s,
124
- containerClasses: k
125
- };
126
- }
127
- const he = {
128
- sm: { width: "100%", height: 150 },
129
- md: { width: "100%", height: 250 },
130
- lg: { width: "100%", height: 350 },
131
- xl: { width: "100%", height: 450 },
132
- auto: { width: "100%", height: 300 }
133
- }, ee = v.forwardRef(
134
- ({
135
- children: e,
136
- variant: n = "default",
137
- size: r = "md",
138
- height: c,
139
- width: s,
140
- theme: k,
141
- className: f,
142
- style: x,
143
- title: a,
144
- description: h,
145
- loading: o,
146
- error: u,
147
- responsive: l = !0
148
- }, b) => {
149
- const { components: g, loading: m, error: A, isAvailable: N } = ie(), { containerClasses: $ } = Q(k, n), V = o || m, H = u || (A ? "Recharts non disponible. Installez recharts pour utiliser les graphiques." : null), I = he[r], j = s ?? I.width, D = c ?? I.height;
150
- if (V)
151
- return /* @__PURE__ */ S("div", { ref: b, className: _($, f), style: x, children: [
152
- a && /* @__PURE__ */ t(ne, { title: a, description: h }),
153
- /* @__PURE__ */ t(de, { className: "w-full", style: { height: D } })
154
- ] });
155
- if (H || !N)
156
- return /* @__PURE__ */ S("div", { ref: b, className: _($, f), style: x, children: [
157
- a && /* @__PURE__ */ t(ne, { title: a, description: h }),
158
- /* @__PURE__ */ t(
159
- "div",
160
- {
161
- className: "flex items-center justify-center text-muted-foreground text-sm border border-dashed border-border rounded-lg",
162
- style: { height: D },
163
- children: /* @__PURE__ */ S("div", { className: "text-center p-4", children: [
164
- /* @__PURE__ */ t("p", { children: H || "Graphique non disponible" }),
165
- /* @__PURE__ */ t("p", { className: "text-xs mt-1", children: "Installez recharts: pnpm add recharts" })
166
- ] })
167
- }
168
- )
169
- ] });
170
- const { ResponsiveContainer: E } = g;
171
- return /* @__PURE__ */ S("div", { ref: b, className: _($, f), style: x, children: [
172
- a && /* @__PURE__ */ t(ne, { title: a, description: h }),
173
- l ? /* @__PURE__ */ t(E, { width: j, height: D, children: e(g) }) : /* @__PURE__ */ t("div", { style: { width: j, height: D }, children: e(g) })
174
- ] });
175
- }
176
- );
177
- ee.displayName = "WakaChart";
178
- function ne({ title: e, description: n }) {
179
- return /* @__PURE__ */ S("div", { className: "mb-4", children: [
180
- /* @__PURE__ */ t("h3", { className: "text-lg font-semibold", children: e }),
181
- n && /* @__PURE__ */ t("p", { className: "text-sm text-muted-foreground", children: n })
182
- ] });
183
- }
184
- const me = v.forwardRef(
185
- ({
186
- data: e,
187
- dataKeys: n,
188
- series: r,
189
- variant: c = "default",
190
- size: s = "md",
191
- height: k,
192
- width: f,
193
- animation: x = !0,
194
- animationDuration: a = 500,
195
- grid: h = !0,
196
- tooltip: o = !0,
197
- legend: u,
198
- axis: l,
199
- theme: b,
200
- className: g,
201
- style: m,
202
- title: A,
203
- description: N,
204
- loading: $,
205
- error: V,
206
- onClick: H,
207
- responsive: I = !0,
208
- // Bar specific
209
- layout: j = "vertical",
210
- stacked: D = !1,
211
- radius: E = 4,
212
- barSize: P,
213
- barGap: y = 4,
214
- barCategoryGap: G = "20%"
215
- }, F) => {
216
- const { theme: w, getColor: X, tooltipStyles: R } = Q(b, c), C = v.useMemo(() => {
217
- if (r && r.length > 0) return r;
218
- if (n && n.length > 0)
219
- return n.map((d, M) => ({
220
- dataKey: d,
221
- label: d,
222
- color: X(M)
223
- }));
224
- if (e.length > 0 && "value" in e[0])
225
- return [{ dataKey: "value", label: "Value", color: X(0) }];
226
- const p = e[0];
227
- return p ? Object.keys(p).filter((d) => d !== "name" && typeof p[d] == "number").map((d, M) => ({
228
- dataKey: d,
229
- label: d,
230
- color: X(M)
231
- })) : [];
232
- }, [r, n, e, X]), L = v.useMemo(() => u ? typeof u == "boolean" ? { enabled: u, position: "bottom", align: "center" } : u : null, [u]), i = v.useMemo(() => o ? typeof o == "boolean" ? { enabled: o } : o : null, [o]);
233
- return /* @__PURE__ */ t(
234
- ee,
235
- {
236
- ref: F,
237
- variant: c,
238
- size: s,
239
- height: k,
240
- width: f,
241
- theme: b,
242
- className: g,
243
- style: m,
244
- title: A,
245
- description: N,
246
- loading: $,
247
- error: V,
248
- responsive: I,
249
- children: (p) => {
250
- if (!p) return null;
251
- const {
252
- BarChart: d,
253
- Bar: M,
254
- XAxis: z,
255
- YAxis: W,
256
- CartesianGrid: Y,
257
- Tooltip: O,
258
- Legend: B
259
- } = p;
260
- return /* @__PURE__ */ S(
261
- d,
262
- {
263
- data: e,
264
- layout: j === "horizontal" ? "vertical" : "horizontal",
265
- barGap: y,
266
- barCategoryGap: G,
267
- children: [
268
- h && /* @__PURE__ */ t(
269
- Y,
270
- {
271
- strokeDasharray: "3 3",
272
- stroke: w.gridColor,
273
- horizontal: !0,
274
- vertical: !1
275
- }
276
- ),
277
- l?.showXAxis !== !1 && /* @__PURE__ */ t(
278
- z,
279
- {
280
- dataKey: "name",
281
- axisLine: { stroke: w.axisColor },
282
- tickLine: { stroke: w.axisColor },
283
- tick: { fill: w.textColor, fontSize: 12 },
284
- tickFormatter: l?.xAxisFormatter
285
- }
286
- ),
287
- l?.showYAxis !== !1 && /* @__PURE__ */ t(
288
- W,
289
- {
290
- axisLine: { stroke: w.axisColor },
291
- tickLine: { stroke: w.axisColor },
292
- tick: { fill: w.textColor, fontSize: 12 },
293
- tickFormatter: l?.yAxisFormatter,
294
- domain: l?.yAxisDomain,
295
- unit: l?.yAxisUnit
296
- }
297
- ),
298
- i?.enabled !== !1 && o && /* @__PURE__ */ t(
299
- O,
300
- {
301
- ...R,
302
- formatter: i && typeof i != "boolean" && i.formatter ? (K, U) => i.formatter(
303
- K,
304
- U,
305
- e[0]
306
- ) : (K) => {
307
- const U = i && typeof i != "boolean" && i.valuePrefix || "", T = i && typeof i != "boolean" && i.valueSuffix || "";
308
- return `${U}${K}${T}`;
309
- }
310
- }
311
- ),
312
- L?.enabled && /* @__PURE__ */ t(
313
- B,
314
- {
315
- align: L.align,
316
- verticalAlign: L.position === "top" ? "top" : "bottom",
317
- wrapperStyle: { paddingTop: L.position === "bottom" ? 16 : 0 }
318
- }
319
- ),
320
- C.map((K, U) => /* @__PURE__ */ t(
321
- M,
322
- {
323
- dataKey: K.dataKey,
324
- name: K.label,
325
- fill: K.color || X(U),
326
- radius: E,
327
- stackId: D ? "stack" : void 0,
328
- barSize: P,
329
- animationDuration: a,
330
- isAnimationActive: x
331
- },
332
- K.dataKey
333
- ))
334
- ]
335
- }
336
- );
337
- }
338
- }
339
- );
340
- }
341
- );
342
- me.displayName = "WakaBarChart";
343
- const pe = v.forwardRef(
344
- ({
345
- data: e,
346
- dataKeys: n,
347
- series: r,
348
- variant: c = "default",
349
- size: s = "md",
350
- height: k,
351
- width: f,
352
- animation: x = !0,
353
- animationDuration: a = 500,
354
- grid: h = !0,
355
- tooltip: o = !0,
356
- legend: u,
357
- axis: l,
358
- theme: b,
359
- className: g,
360
- style: m,
361
- title: A,
362
- description: N,
363
- loading: $,
364
- error: V,
365
- onClick: H,
366
- responsive: I = !0,
367
- // Line specific
368
- curve: j = "monotone",
369
- dots: D = !0,
370
- dotSize: E = 4,
371
- activeDot: P = !0,
372
- strokeWidth: y = 2
373
- }, G) => {
374
- const { theme: F, getColor: w, tooltipStyles: X } = Q(b, c), R = v.useMemo(() => {
375
- if (r && r.length > 0) return r;
376
- if (n && n.length > 0)
377
- return n.map((p, d) => ({
378
- dataKey: p,
379
- label: p,
380
- color: w(d),
381
- strokeWidth: y
382
- }));
383
- if (e.length > 0 && "value" in e[0])
384
- return [{ dataKey: "value", label: "Value", color: w(0), strokeWidth: y }];
385
- const i = e[0];
386
- return i ? Object.keys(i).filter((p) => p !== "name" && typeof i[p] == "number").map((p, d) => ({
387
- dataKey: p,
388
- label: p,
389
- color: w(d),
390
- strokeWidth: y
391
- })) : [];
392
- }, [r, n, e, w, y]), C = v.useMemo(() => u ? typeof u == "boolean" ? { enabled: u, position: "bottom", align: "center" } : u : null, [u]), L = v.useMemo(() => o ? typeof o == "boolean" ? { enabled: o } : o : null, [o]);
393
- return /* @__PURE__ */ t(
394
- ee,
395
- {
396
- ref: G,
397
- variant: c,
398
- size: s,
399
- height: k,
400
- width: f,
401
- theme: b,
402
- className: g,
403
- style: m,
404
- title: A,
405
- description: N,
406
- loading: $,
407
- error: V,
408
- responsive: I,
409
- children: (i) => {
410
- if (!i) return null;
411
- const {
412
- LineChart: p,
413
- Line: d,
414
- XAxis: M,
415
- YAxis: z,
416
- CartesianGrid: W,
417
- Tooltip: Y,
418
- Legend: O
419
- } = i;
420
- return /* @__PURE__ */ S(p, { data: e, children: [
421
- h && /* @__PURE__ */ t(
422
- W,
423
- {
424
- strokeDasharray: "3 3",
425
- stroke: F.gridColor,
426
- horizontal: !0,
427
- vertical: !1
428
- }
429
- ),
430
- l?.showXAxis !== !1 && /* @__PURE__ */ t(
431
- M,
432
- {
433
- dataKey: "name",
434
- axisLine: { stroke: F.axisColor },
435
- tickLine: { stroke: F.axisColor },
436
- tick: { fill: F.textColor, fontSize: 12 },
437
- tickFormatter: l?.xAxisFormatter
438
- }
439
- ),
440
- l?.showYAxis !== !1 && /* @__PURE__ */ t(
441
- z,
442
- {
443
- axisLine: { stroke: F.axisColor },
444
- tickLine: { stroke: F.axisColor },
445
- tick: { fill: F.textColor, fontSize: 12 },
446
- tickFormatter: l?.yAxisFormatter,
447
- domain: l?.yAxisDomain,
448
- unit: l?.yAxisUnit
449
- }
450
- ),
451
- L?.enabled !== !1 && o && /* @__PURE__ */ t(
452
- Y,
453
- {
454
- ...X,
455
- formatter: L && typeof L != "boolean" && L.formatter ? (B, K) => L.formatter(
456
- B,
457
- K,
458
- e[0]
459
- ) : (B) => {
460
- const K = L && typeof L != "boolean" && L.valuePrefix || "", U = L && typeof L != "boolean" && L.valueSuffix || "";
461
- return `${K}${B}${U}`;
462
- }
463
- }
464
- ),
465
- C?.enabled && /* @__PURE__ */ t(
466
- O,
467
- {
468
- align: C.align,
469
- verticalAlign: C.position === "top" ? "top" : "bottom",
470
- wrapperStyle: { paddingTop: C.position === "bottom" ? 16 : 0 }
471
- }
472
- ),
473
- R.map((B, K) => /* @__PURE__ */ t(
474
- d,
475
- {
476
- dataKey: B.dataKey,
477
- name: B.label,
478
- stroke: B.color || w(K),
479
- strokeWidth: B.strokeWidth || y,
480
- strokeDasharray: B.strokeDasharray,
481
- type: j,
482
- dot: D ? { r: E, fill: B.color || w(K) } : !1,
483
- activeDot: P ? { r: E + 2 } : !1,
484
- animationDuration: a,
485
- isAnimationActive: x
486
- },
487
- B.dataKey
488
- ))
489
- ] });
490
- }
491
- }
492
- );
493
- }
494
- );
495
- pe.displayName = "WakaLineChart";
496
- const ge = v.forwardRef(
497
- ({
498
- data: e,
499
- dataKeys: n,
500
- series: r,
501
- variant: c = "default",
502
- size: s = "md",
503
- height: k,
504
- width: f,
505
- animation: x = !0,
506
- animationDuration: a = 500,
507
- grid: h = !0,
508
- tooltip: o = !0,
509
- legend: u,
510
- axis: l,
511
- theme: b,
512
- className: g,
513
- style: m,
514
- title: A,
515
- description: N,
516
- loading: $,
517
- error: V,
518
- onClick: H,
519
- responsive: I = !0,
520
- // Line/Area specific
521
- curve: j = "monotone",
522
- dots: D = !1,
523
- dotSize: E = 4,
524
- activeDot: P = !0,
525
- strokeWidth: y = 2,
526
- // Area specific
527
- stacked: G = !1,
528
- fillOpacity: F = 0.3,
529
- gradientDirection: w = "vertical"
530
- }, X) => {
531
- const { theme: R, getColor: C, tooltipStyles: L } = Q(b, c), i = v.useMemo(() => {
532
- if (r && r.length > 0) return r;
533
- if (n && n.length > 0)
534
- return n.map((z, W) => ({
535
- dataKey: z,
536
- label: z,
537
- color: C(W),
538
- strokeWidth: y,
539
- fillOpacity: F
540
- }));
541
- if (e.length > 0 && "value" in e[0])
542
- return [{ dataKey: "value", label: "Value", color: C(0), strokeWidth: y, fillOpacity: F }];
543
- const M = e[0];
544
- return M ? Object.keys(M).filter((z) => z !== "name" && typeof M[z] == "number").map((z, W) => ({
545
- dataKey: z,
546
- label: z,
547
- color: C(W),
548
- strokeWidth: y,
549
- fillOpacity: F
550
- })) : [];
551
- }, [r, n, e, C, y, F]), p = v.useMemo(() => u ? typeof u == "boolean" ? { enabled: u, position: "bottom", align: "center" } : u : null, [u]), d = v.useMemo(() => o ? typeof o == "boolean" ? { enabled: o } : o : null, [o]);
552
- return /* @__PURE__ */ t(
553
- ee,
554
- {
555
- ref: X,
556
- variant: c,
557
- size: s,
558
- height: k,
559
- width: f,
560
- theme: b,
561
- className: g,
562
- style: m,
563
- title: A,
564
- description: N,
565
- loading: $,
566
- error: V,
567
- responsive: I,
568
- children: (M) => {
569
- if (!M) return null;
570
- const {
571
- AreaChart: z,
572
- Area: W,
573
- XAxis: Y,
574
- YAxis: O,
575
- CartesianGrid: B,
576
- Tooltip: K,
577
- Legend: U
578
- } = M;
579
- return /* @__PURE__ */ S(z, { data: e, children: [
580
- /* @__PURE__ */ t("defs", { children: i.map((T, Z) => {
581
- const q = T.color || C(Z), te = `gradient-${T.dataKey}-${Z}`;
582
- return /* @__PURE__ */ S(
583
- "linearGradient",
584
- {
585
- id: te,
586
- x1: "0",
587
- y1: "0",
588
- x2: w === "horizontal" ? "1" : "0",
589
- y2: w === "horizontal" ? "0" : "1",
590
- children: [
591
- /* @__PURE__ */ t("stop", { offset: "5%", stopColor: q, stopOpacity: 0.8 }),
592
- /* @__PURE__ */ t("stop", { offset: "95%", stopColor: q, stopOpacity: 0.1 })
593
- ]
594
- },
595
- te
596
- );
597
- }) }),
598
- h && /* @__PURE__ */ t(
599
- B,
600
- {
601
- strokeDasharray: "3 3",
602
- stroke: R.gridColor,
603
- horizontal: !0,
604
- vertical: !1
605
- }
606
- ),
607
- l?.showXAxis !== !1 && /* @__PURE__ */ t(
608
- Y,
609
- {
610
- dataKey: "name",
611
- axisLine: { stroke: R.axisColor },
612
- tickLine: { stroke: R.axisColor },
613
- tick: { fill: R.textColor, fontSize: 12 },
614
- tickFormatter: l?.xAxisFormatter
615
- }
616
- ),
617
- l?.showYAxis !== !1 && /* @__PURE__ */ t(
618
- O,
619
- {
620
- axisLine: { stroke: R.axisColor },
621
- tickLine: { stroke: R.axisColor },
622
- tick: { fill: R.textColor, fontSize: 12 },
623
- tickFormatter: l?.yAxisFormatter,
624
- domain: l?.yAxisDomain,
625
- unit: l?.yAxisUnit
626
- }
627
- ),
628
- d?.enabled !== !1 && o && /* @__PURE__ */ t(
629
- K,
630
- {
631
- ...L,
632
- formatter: d && typeof d != "boolean" && d.formatter ? (T, Z) => d.formatter(
633
- T,
634
- Z,
635
- e[0]
636
- ) : (T) => {
637
- const Z = d && typeof d != "boolean" && d.valuePrefix || "", q = d && typeof d != "boolean" && d.valueSuffix || "";
638
- return `${Z}${T}${q}`;
639
- }
640
- }
641
- ),
642
- p?.enabled && /* @__PURE__ */ t(
643
- U,
644
- {
645
- align: p.align,
646
- verticalAlign: p.position === "top" ? "top" : "bottom",
647
- wrapperStyle: { paddingTop: p.position === "bottom" ? 16 : 0 }
648
- }
649
- ),
650
- i.map((T, Z) => {
651
- const q = T.color || C(Z), te = `gradient-${T.dataKey}-${Z}`;
652
- return /* @__PURE__ */ t(
653
- W,
654
- {
655
- dataKey: T.dataKey,
656
- name: T.label,
657
- stroke: q,
658
- strokeWidth: T.strokeWidth || y,
659
- fill: `url(#${te})`,
660
- fillOpacity: T.fillOpacity ?? F,
661
- type: j,
662
- dot: D ? { r: E, fill: q } : !1,
663
- stackId: G ? "stack" : void 0,
664
- animationDuration: a,
665
- isAnimationActive: x
666
- },
667
- T.dataKey
668
- );
669
- })
670
- ] });
671
- }
672
- }
673
- );
674
- }
675
- );
676
- ge.displayName = "WakaAreaChart";
677
- const xe = v.forwardRef(
678
- ({
679
- data: e,
680
- variant: n = "default",
681
- size: r = "md",
682
- height: c,
683
- width: s,
684
- animation: k = !0,
685
- animationDuration: f = 500,
686
- tooltip: x = !0,
687
- legend: a = !0,
688
- theme: h,
689
- className: o,
690
- style: u,
691
- title: l,
692
- description: b,
693
- loading: g,
694
- error: m,
695
- onClick: A,
696
- responsive: N = !0,
697
- // Pie specific
698
- dataKey: $ = "value",
699
- nameKey: V = "name",
700
- innerRadius: H = 0,
701
- outerRadius: I = "80%",
702
- startAngle: j = 90,
703
- endAngle: D = -270,
704
- paddingAngle: E = 2,
705
- label: P = !1,
706
- labelPosition: y = "outside"
707
- }, G) => {
708
- const { theme: F, getColor: w, tooltipStyles: X } = Q(h, n), R = v.useMemo(() => a ? typeof a == "boolean" ? { enabled: a, position: "bottom", align: "center" } : a : null, [a]), C = v.useMemo(() => x ? typeof x == "boolean" ? { enabled: x } : x : null, [x]), L = v.useCallback(
709
- (i) => {
710
- if (!P) return null;
711
- const p = Math.PI / 180, d = y === "inside" ? i.innerRadius + (i.outerRadius - i.innerRadius) * 0.5 : i.outerRadius * 1.1, M = i.cx + d * Math.cos(-i.midAngle * p), z = i.cy + d * Math.sin(-i.midAngle * p);
712
- let W = "";
713
- return P === "percent" ? W = `${(i.percent * 100).toFixed(0)}%` : P === "value" ? W = String(i.value) : P === "name" ? W = i.name : W = `${(i.percent * 100).toFixed(0)}%`, /* @__PURE__ */ t(
714
- "text",
715
- {
716
- x: M,
717
- y: z,
718
- fill: y === "inside" ? "#fff" : F.textColor,
719
- textAnchor: M > i.cx ? "start" : "end",
720
- dominantBaseline: "central",
721
- fontSize: 12,
722
- children: W
723
- }
724
- );
725
- },
726
- [P, y, F.textColor]
727
- );
728
- return /* @__PURE__ */ t(
729
- ee,
730
- {
731
- ref: G,
732
- variant: n,
733
- size: r,
734
- height: c,
735
- width: s,
736
- theme: h,
737
- className: o,
738
- style: u,
739
- title: l,
740
- description: b,
741
- loading: g,
742
- error: m,
743
- responsive: N,
744
- children: (i) => {
745
- if (!i) return null;
746
- const {
747
- PieChart: p,
748
- Pie: d,
749
- Cell: M,
750
- Tooltip: z,
751
- Legend: W
752
- } = i;
753
- return /* @__PURE__ */ S(p, { children: [
754
- C?.enabled !== !1 && x && /* @__PURE__ */ t(
755
- z,
756
- {
757
- ...X,
758
- formatter: C && typeof C != "boolean" && C.formatter ? (Y, O) => C.formatter(
759
- Y,
760
- O,
761
- e[0]
762
- ) : (Y) => {
763
- const O = C && typeof C != "boolean" && C.valuePrefix || "", B = C && typeof C != "boolean" && C.valueSuffix || "";
764
- return `${O}${Y}${B}`;
765
- }
766
- }
767
- ),
768
- R?.enabled && /* @__PURE__ */ t(
769
- W,
770
- {
771
- align: R.align,
772
- verticalAlign: R.position === "top" ? "top" : "bottom",
773
- layout: R.position === "left" || R.position === "right" ? "vertical" : "horizontal",
774
- wrapperStyle: { paddingTop: R.position === "bottom" ? 16 : 0 }
775
- }
776
- ),
777
- /* @__PURE__ */ t(
778
- d,
779
- {
780
- data: e,
781
- dataKey: $,
782
- nameKey: V,
783
- cx: "50%",
784
- cy: "50%",
785
- innerRadius: H,
786
- outerRadius: I,
787
- startAngle: j,
788
- endAngle: D,
789
- paddingAngle: E,
790
- animationDuration: f,
791
- isAnimationActive: k,
792
- label: P ? L : !1,
793
- labelLine: P && y === "outside",
794
- children: e.map((Y, O) => /* @__PURE__ */ t(
795
- M,
796
- {
797
- fill: w(O),
798
- stroke: "transparent"
799
- },
800
- `cell-${O}`
801
- ))
802
- }
803
- )
804
- ] });
805
- }
806
- }
807
- );
808
- }
809
- );
810
- xe.displayName = "WakaPieChart";
811
- const le = v.forwardRef(
812
- ({
813
- data: e,
814
- type: n = "line",
815
- width: r = 100,
816
- height: c = 30,
817
- color: s = "hsl(var(--chart-1))",
818
- fillColor: k,
819
- fillOpacity: f = 0.3,
820
- showMinMax: x = !1,
821
- showValue: a = !1,
822
- className: h,
823
- animation: o = !0
824
- }, u) => {
825
- const { components: l, loading: b, isAvailable: g } = ie(), m = v.useMemo(
826
- () => e.map((y, G) => ({ index: G, value: y })),
827
- [e]
828
- ), { min: A, max: N, current: $ } = v.useMemo(() => {
829
- const y = e.filter((G) => typeof G == "number" && !isNaN(G));
830
- return {
831
- min: Math.min(...y),
832
- max: Math.max(...y),
833
- current: y[y.length - 1]
834
- };
835
- }, [e]);
836
- if (b)
837
- return /* @__PURE__ */ t("div", { ref: u, className: _("inline-flex items-center gap-2", h), children: /* @__PURE__ */ t(
838
- "div",
839
- {
840
- className: "bg-muted animate-pulse rounded",
841
- style: { width: r, height: c }
842
- }
843
- ) });
844
- if (!g || !l)
845
- return /* @__PURE__ */ S("div", { ref: u, className: _("inline-flex items-center gap-2", h), children: [
846
- /* @__PURE__ */ t(
847
- be,
848
- {
849
- data: e,
850
- width: r,
851
- height: c,
852
- color: s,
853
- type: n,
854
- fillColor: k,
855
- fillOpacity: f
856
- }
857
- ),
858
- a && /* @__PURE__ */ t("span", { className: "text-sm font-medium", children: $ })
859
- ] });
860
- const {
861
- ResponsiveContainer: V,
862
- LineChart: H,
863
- BarChart: I,
864
- AreaChart: j,
865
- Line: D,
866
- Bar: E,
867
- Area: P
868
- } = l;
869
- return /* @__PURE__ */ S("div", { ref: u, className: _("inline-flex items-center gap-2", h), children: [
870
- /* @__PURE__ */ t("div", { style: { width: r, height: c }, children: /* @__PURE__ */ t(V, { width: "100%", height: "100%", children: n === "bar" ? /* @__PURE__ */ t(I, { data: m, children: /* @__PURE__ */ t(
871
- E,
872
- {
873
- dataKey: "value",
874
- fill: s,
875
- radius: 1,
876
- isAnimationActive: o
877
- }
878
- ) }) : n === "area" ? /* @__PURE__ */ S(j, { data: m, children: [
879
- /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ S("linearGradient", { id: `sparkline-gradient-${s.replace(/[^a-z0-9]/gi, "")}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
880
- /* @__PURE__ */ t("stop", { offset: "5%", stopColor: k || s, stopOpacity: 0.8 }),
881
- /* @__PURE__ */ t("stop", { offset: "95%", stopColor: k || s, stopOpacity: 0.1 })
882
- ] }) }),
883
- /* @__PURE__ */ t(
884
- P,
885
- {
886
- type: "monotone",
887
- dataKey: "value",
888
- stroke: s,
889
- fill: `url(#sparkline-gradient-${s.replace(/[^a-z0-9]/gi, "")})`,
890
- fillOpacity: f,
891
- strokeWidth: 1.5,
892
- dot: !1,
893
- isAnimationActive: o
894
- }
895
- )
896
- ] }) : /* @__PURE__ */ t(H, { data: m, children: /* @__PURE__ */ t(
897
- D,
898
- {
899
- type: "monotone",
900
- dataKey: "value",
901
- stroke: s,
902
- strokeWidth: 1.5,
903
- dot: !1,
904
- isAnimationActive: o
905
- }
906
- ) }) }) }),
907
- x && /* @__PURE__ */ S("div", { className: "flex flex-col text-xs text-muted-foreground", children: [
908
- /* @__PURE__ */ S("span", { children: [
909
- "↑ ",
910
- N
911
- ] }),
912
- /* @__PURE__ */ S("span", { children: [
913
- "↓ ",
914
- A
915
- ] })
916
- ] }),
917
- a && /* @__PURE__ */ t("span", { className: "text-sm font-medium", children: $ })
918
- ] });
919
- }
920
- );
921
- le.displayName = "WakaSparkline";
922
- function be({
923
- data: e,
924
- width: n,
925
- height: r,
926
- color: c,
927
- type: s,
928
- fillColor: k,
929
- fillOpacity: f
930
- }) {
931
- const a = n - 4, h = r - 4, o = Math.min(...e), l = Math.max(...e) - o || 1, b = e.map((m, A) => {
932
- const N = 2 + A / (e.length - 1 || 1) * a, $ = 2 + h - (m - o) / l * h;
933
- return { x: N, y: $, value: m };
934
- });
935
- if (s === "bar") {
936
- const m = a / e.length - 1;
937
- return /* @__PURE__ */ t("svg", { width: n, height: r, children: e.map((A, N) => {
938
- const $ = (A - o) / l * h;
939
- return /* @__PURE__ */ t(
940
- "rect",
941
- {
942
- x: 2 + N * (m + 1),
943
- y: 2 + h - $,
944
- width: m,
945
- height: $,
946
- fill: c,
947
- rx: 1
948
- },
949
- N
950
- );
951
- }) });
952
- }
953
- const g = b.map((m, A) => `${A === 0 ? "M" : "L"} ${m.x} ${m.y}`).join(" ");
954
- if (s === "area") {
955
- const m = `${g} L ${b[b.length - 1].x} ${r - 2} L 2 ${r - 2} Z`;
956
- return /* @__PURE__ */ S("svg", { width: n, height: r, children: [
957
- /* @__PURE__ */ t("path", { d: m, fill: k || c, fillOpacity: f }),
958
- /* @__PURE__ */ t("path", { d: g, fill: "none", stroke: c, strokeWidth: 1.5 })
959
- ] });
960
- }
961
- return /* @__PURE__ */ t("svg", { width: n, height: r, children: /* @__PURE__ */ t("path", { d: g, fill: "none", stroke: c, strokeWidth: 1.5 }) });
962
- }
963
- const ye = v.forwardRef(
964
- ({
965
- data: e,
966
- type: n = "sparkline",
967
- width: r = 80,
968
- height: c = 24,
969
- color: s,
970
- showTrend: k = !0,
971
- valueFormatter: f,
972
- className: x
973
- }, a) => {
974
- const h = v.useMemo(() => !e || e.length === 0 ? [] : typeof e[0] == "number" ? e : e.map((g) => {
975
- const m = g.value ?? Object.values(g).find((A) => typeof A == "number");
976
- return typeof m == "number" ? m : 0;
977
- }), [e]), { trend: o, trendPercent: u, currentValue: l } = v.useMemo(() => {
978
- if (h.length < 2)
979
- return {
980
- trend: "neutral",
981
- trendPercent: 0,
982
- currentValue: h[0] ?? 0
983
- };
984
- const g = h[0], m = h[h.length - 1], A = m - g, N = g !== 0 ? A / g * 100 : 0;
985
- return {
986
- trend: A > 0 ? "up" : A < 0 ? "down" : "neutral",
987
- trendPercent: N,
988
- currentValue: m
989
- };
990
- }, [h]), b = v.useMemo(() => s || (o === "up" ? "hsl(var(--chart-2, 142 76% 36%))" : o === "down" ? "hsl(var(--destructive, 0 84% 60%))" : "hsl(var(--muted-foreground, 220 9% 46%))"), [s, o]);
991
- return h.length === 0 ? /* @__PURE__ */ t("div", { ref: a, className: _("flex items-center gap-1 text-muted-foreground", x), children: /* @__PURE__ */ t(ae, { className: "h-3 w-3" }) }) : (f ? f(l) : l.toLocaleString(), /* @__PURE__ */ S("div", { ref: a, className: _("flex items-center gap-2", x), children: [
992
- /* @__PURE__ */ t(
993
- le,
994
- {
995
- data: h,
996
- type: n === "sparkline" ? "line" : n,
997
- width: r,
998
- height: c,
999
- color: b,
1000
- animation: !1
1001
- }
1002
- ),
1003
- k && /* @__PURE__ */ S("div", { className: "flex items-center gap-1", children: [
1004
- o === "up" && /* @__PURE__ */ t(ce, { className: "h-3 w-3 text-green-600 dark:text-green-400" }),
1005
- o === "down" && /* @__PURE__ */ t(ue, { className: "h-3 w-3 text-red-600 dark:text-red-400" }),
1006
- o === "neutral" && /* @__PURE__ */ t(ae, { className: "h-3 w-3 text-muted-foreground" }),
1007
- /* @__PURE__ */ S(
1008
- "span",
1009
- {
1010
- className: _(
1011
- "text-xs font-medium",
1012
- o === "up" && "text-green-600 dark:text-green-400",
1013
- o === "down" && "text-red-600 dark:text-red-400",
1014
- o === "neutral" && "text-muted-foreground"
1015
- ),
1016
- children: [
1017
- o !== "neutral" && (u > 0 ? "+" : ""),
1018
- u.toFixed(1),
1019
- "%"
1020
- ]
1021
- }
1022
- )
1023
- ] })
1024
- ] }));
1025
- }
1026
- );
1027
- ye.displayName = "WakaMiniChart";
1028
- function we(e) {
1029
- const {
1030
- accessorKey: n,
1031
- header: r = String(n),
1032
- chartType: c = "sparkline",
1033
- width: s = 100,
1034
- height: k = 24,
1035
- color: f,
1036
- showValue: x = !1,
1037
- valueFormatter: a
1038
- } = e;
1039
- return {
1040
- accessorKey: n,
1041
- header: r,
1042
- size: s + (x ? 60 : 0),
1043
- enableSorting: !1,
1044
- enableColumnFilter: !1,
1045
- cell: (h) => {
1046
- const o = h.getValue();
1047
- let u = [];
1048
- return Array.isArray(o) && (typeof o[0] == "number" ? u = o : typeof o[0] == "object" && o[0] !== null && (u = o.map((l) => {
1049
- const b = l.value ?? Object.values(l).find((g) => typeof g == "number");
1050
- return typeof b == "number" ? b : 0;
1051
- }))), {
1052
- type: "chart",
1053
- chartType: c,
1054
- data: u,
1055
- width: s,
1056
- height: k,
1057
- color: f,
1058
- showTrend: !0,
1059
- valueFormatter: a
1060
- };
1061
- },
1062
- meta: {
1063
- isChartColumn: !0,
1064
- chartConfig: e
1065
- }
1066
- };
1067
- }
1068
- const Se = {
1069
- cell: (e) => {
1070
- if (!Array.isArray(e)) return null;
1071
- let n = [];
1072
- return typeof e[0] == "number" ? n = e : typeof e[0] == "object" && e[0] !== null && (n = e.map((r) => {
1073
- const c = r.value ?? Object.values(r).find((s) => typeof s == "number");
1074
- return typeof c == "number" ? c : 0;
1075
- })), {
1076
- type: "sparkline",
1077
- data: n
1078
- };
1079
- },
1080
- size: 100,
1081
- enableSorting: !1,
1082
- enableFiltering: !1
1083
- }, Le = [
1084
- "hsl(var(--chart-1))",
1085
- "hsl(var(--chart-2))",
1086
- "hsl(var(--chart-3))",
1087
- "hsl(var(--chart-4))",
1088
- "hsl(var(--chart-5))"
1089
- ], $e = {
1090
- sm: { width: "100%", height: 150 },
1091
- md: { width: "100%", height: 250 },
1092
- lg: { width: "100%", height: 350 },
1093
- xl: { width: "100%", height: 450 },
1094
- auto: { width: "100%", height: 300 }
1095
- };
1096
- export {
1097
- $e as C,
1098
- Le as D,
1099
- de as S,
1100
- ee as W,
1101
- me as a,
1102
- pe as b,
1103
- ge as c,
1104
- xe as d,
1105
- le as e,
1106
- ye as f,
1107
- Q as g,
1108
- we as h,
1109
- Se as s,
1110
- ie as u
1111
- };