@nice2dev/ui-bi 1.0.28 → 1.1.5

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/index.mjs CHANGED
@@ -1,2453 +1,4 @@
1
- import { jsx as e, jsxs as d, Fragment as N } from "react/jsx-runtime";
2
- import { useContext as F, createContext as b, memo as re, useState as w, useEffect as ae, useRef as ie, useCallback as x } from "react";
3
- const ne = (a, r) => r, ce = b(ne);
4
- function de() {
5
- return { t: F(ce) };
6
- }
7
- b({
8
- dir: "ltr",
9
- isRTL: !1,
10
- flip: (a) => a,
11
- value: (a) => a.ltr
12
- });
13
- b(null);
14
- b(null);
15
- const oe = {
16
- radius: "md",
17
- shadow: "md",
18
- fill: "solid",
19
- buttonStyle: "flat",
20
- inputStyle: "bordered",
21
- cardStyle: "elevated",
22
- badgeStyle: "solid",
23
- tabStyle: "underline",
24
- toggleStyle: "default",
25
- tooltipStyle: "dark",
26
- modalStyle: "default",
27
- tableStyle: "default",
28
- menuStyle: "default",
29
- animation: "normal",
30
- density: "normal"
31
- };
32
- b({
33
- displayStyle: "default",
34
- variantConfig: oe,
35
- setDisplayStyle: () => {
36
- }
37
- });
38
- b({});
39
- b({
40
- direction: "ltr",
41
- isRTL: !1,
42
- flip: (a) => a,
43
- flipStyle: (a, r) => ({ [a]: r })
44
- });
45
- b({
46
- permissions: {},
47
- getAccessMode: () => "full"
48
- });
49
- b(null);
50
- const te = process.env.NODE_ENV === "development";
51
- let W = {
52
- enabled: te,
53
- slowRenderThreshold: 16
54
- };
55
- const O = [], M = /* @__PURE__ */ new Map(), B = /* @__PURE__ */ new Map();
56
- function fe() {
57
- O.length = 0, M.clear(), B.clear();
58
- }
59
- function se(a) {
60
- const r = W.slowRenderThreshold;
61
- return O.filter((c) => c.actualDuration > r);
62
- }
63
- function H(a) {
64
- return a < 1 ? `${(a * 1e3).toFixed(0)}μs` : a < 1e3 ? `${a.toFixed(2)}ms` : `${(a / 1e3).toFixed(2)}s`;
65
- }
66
- function le() {
67
- const a = Array.from(M.values()), r = se(), c = a.reduce((u, o) => u + o.renderCount, 0), t = a.length > 0 ? a.reduce((u, o) => u + o.avgRenderTime, 0) / a.length : 0, y = Array.from(B.values());
68
- return { stats: a, slowRenders: r, totalRenders: c, avgRenderTime: t, marks: y };
69
- }
70
- function ye() {
71
- const a = le();
72
- console.group(
73
- "%c[Nice2Dev Performance Report]",
74
- "color: var(--nice-info, #6366f1); font-weight: bold; font-size: 14px"
75
- ), console.log(`Total renders: ${a.totalRenders}`), console.log(`Average render time: ${H(a.avgRenderTime)}`), console.log(`Slow renders: ${a.slowRenders.length}`), console.group("Component Stats"), console.table(
76
- a.stats.sort((r, c) => c.totalRenderTime - r.totalRenderTime).map((r) => ({
77
- Name: r.componentName,
78
- Renders: r.renderCount,
79
- "Avg Time": H(r.avgRenderTime),
80
- "Max Time": H(r.maxRenderTime),
81
- "Total Time": H(r.totalRenderTime),
82
- "Slow Renders": r.slowRenderCount
83
- }))
84
- ), console.groupEnd(), a.slowRenders.length > 0 && (console.group("Slow Renders (last 10)"), console.table(
85
- a.slowRenders.slice(-10).map((r) => ({
86
- Component: r.componentName,
87
- Phase: r.phase,
88
- Duration: H(r.actualDuration),
89
- Time: new Date(r.timestamp).toLocaleTimeString()
90
- }))
91
- ), console.groupEnd()), a.marks.length > 0 && (console.group("Custom Marks"), console.table(
92
- a.marks.filter((r) => r.duration).map((r) => ({
93
- Name: r.name,
94
- Duration: H(r.duration)
95
- }))
96
- ), console.groupEnd()), console.groupEnd();
97
- }
98
- const me = re(
99
- ({ position: a = "bottom-right", defaultCollapsed: r = !0 }) => {
100
- const [c, t] = w(r), [y, u] = w([]), [o, p] = w({ used: 0, total: 0 });
101
- if (ae(() => {
102
- const f = () => {
103
- const _ = Array.from(M.values());
104
- u(_.sort((T, k) => k.totalRenderTime - T.totalRenderTime).slice(0, 10));
105
- const C = window.performance;
106
- C.memory && p({
107
- used: C.memory.usedJSHeapSize / 1024 / 1024,
108
- total: C.memory.totalJSHeapSize / 1024 / 1024
109
- });
110
- };
111
- f();
112
- const v = setInterval(f, 2e3);
113
- return () => clearInterval(v);
114
- }, []), !W.enabled)
115
- return null;
116
- const S = {
117
- position: "fixed",
118
- zIndex: 99999,
119
- ...a.includes("top") ? { top: 8 } : { bottom: 8 },
120
- ...a.includes("left") ? { left: 8 } : { right: 8 }
121
- };
122
- return /* @__PURE__ */ d(
123
- "div",
124
- {
125
- style: {
126
- ...S,
127
- background: "var(--nice-overlay-85, rgba(0, 0, 0, 0.85))",
128
- color: "var(--bg-primary, #fff)",
129
- borderRadius: 8,
130
- fontSize: 11,
131
- fontFamily: "Monaco, Consolas, monospace",
132
- padding: c ? "4px 8px" : 8,
133
- maxWidth: c ? "auto" : 300,
134
- maxHeight: c ? "auto" : 400,
135
- overflow: "auto"
136
- },
137
- children: [
138
- /* @__PURE__ */ d(
139
- "div",
140
- {
141
- style: { cursor: "pointer", display: "flex", alignItems: "center", gap: 8 },
142
- onClick: () => t((f) => !f),
143
- children: [
144
- /* @__PURE__ */ e("span", { style: { color: "var(--color-success, #22c55e)" }, children: "●" }),
145
- /* @__PURE__ */ e("span", { children: "Profiler" }),
146
- o.used > 0 && /* @__PURE__ */ d(
147
- "span",
148
- {
149
- style: {
150
- color: o.used > 100 ? "var(--color-warning, #f59e0b)" : "var(--text-muted, #64748b)"
151
- },
152
- children: [
153
- o.used.toFixed(0),
154
- "MB"
155
- ]
156
- }
157
- ),
158
- /* @__PURE__ */ e("span", { style: { marginLeft: "auto", opacity: 0.5 }, children: c ? "▼" : "▲" })
159
- ]
160
- }
161
- ),
162
- !c && /* @__PURE__ */ d("div", { style: { marginTop: 8 }, children: [
163
- /* @__PURE__ */ e(
164
- "div",
165
- {
166
- style: {
167
- borderBottom: "1px solid var(--border-color, #333)",
168
- paddingBottom: 4,
169
- marginBottom: 8
170
- },
171
- children: /* @__PURE__ */ e("strong", { children: "Top Components" })
172
- }
173
- ),
174
- y.map((f) => /* @__PURE__ */ d("div", { style: { marginBottom: 4, display: "flex", gap: 8 }, children: [
175
- /* @__PURE__ */ e("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis" }, children: f.componentName }),
176
- /* @__PURE__ */ e(
177
- "span",
178
- {
179
- style: {
180
- color: f.avgRenderTime > 16 ? "var(--color-warning, #f59e0b)" : "var(--color-success, #22c55e)"
181
- },
182
- children: H(f.avgRenderTime)
183
- }
184
- ),
185
- /* @__PURE__ */ d(
186
- "span",
187
- {
188
- style: { color: "var(--text-muted, #64748b)", minWidth: 30, textAlign: "right" },
189
- children: [
190
- "x",
191
- f.renderCount
192
- ]
193
- }
194
- )
195
- ] }, f.componentName)),
196
- /* @__PURE__ */ d("div", { style: { marginTop: 8, display: "flex", gap: 8 }, children: [
197
- /* @__PURE__ */ e(
198
- "button",
199
- {
200
- onClick: ye,
201
- style: {
202
- flex: 1,
203
- padding: "4px 8px",
204
- background: "var(--bg-tertiary, #333)",
205
- border: "none",
206
- borderRadius: 4,
207
- color: "var(--bg-primary, #fff)",
208
- cursor: "pointer",
209
- fontSize: 10
210
- },
211
- children: "Print Report"
212
- }
213
- ),
214
- /* @__PURE__ */ e(
215
- "button",
216
- {
217
- onClick: fe,
218
- style: {
219
- flex: 1,
220
- padding: "4px 8px",
221
- background: "var(--bg-tertiary, #333)",
222
- border: "none",
223
- borderRadius: 4,
224
- color: "var(--bg-primary, #fff)",
225
- cursor: "pointer",
226
- fontSize: 10
227
- },
228
- children: "Clear"
229
- }
230
- )
231
- ] })
232
- ] })
233
- ]
234
- }
235
- );
236
- }
237
- );
238
- me.displayName = "ProfilerOverlay";
239
- process.env.NODE_ENV;
240
- b(null);
241
- const pe = b({
242
- enabled: !0,
243
- active: !1,
244
- run: () => {
245
- }
246
- });
247
- function ue() {
248
- return F(pe);
249
- }
250
- function be(a, r) {
251
- if (!a)
252
- return null;
253
- if (a === !0)
254
- return r && r.length > 0 ? r : null;
255
- if (Array.isArray(a))
256
- return a.length > 0 ? a : null;
257
- const c = a.steps ?? r;
258
- return c && c.length > 0 ? c : null;
259
- }
260
- function ve(a, r) {
261
- return a.map((c) => ({
262
- target: c.target,
263
- title: c.titleKey ? r(c.titleKey, c.title ?? "") : c.title ?? "",
264
- content: c.contentKey ? r(c.contentKey, c.content ?? "") : c.content ?? "",
265
- placement: c.placement,
266
- highlightPadding: c.highlightPadding,
267
- showArrow: c.showArrow,
268
- scrollIntoView: c.scrollIntoView,
269
- disableInteraction: c.disableInteraction
270
- }));
271
- }
272
- const he = ({
273
- steps: a,
274
- autoStart: r,
275
- label: c,
276
- size: t = "md",
277
- className: y,
278
- style: u,
279
- "data-testid": o
280
- }) => {
281
- const { enabled: p, run: S } = ue(), { t: f } = de();
282
- if (!p || !a || a.length === 0)
283
- return null;
284
- const v = c ?? f("tutorial.startAria", "Start tutorial");
285
- return /* @__PURE__ */ e(
286
- "button",
287
- {
288
- type: "button",
289
- className: `nice-tutorial-button nice-tutorial-button--${t}` + (y ? ` ${y}` : ""),
290
- style: u,
291
- "data-testid": o,
292
- "aria-label": v,
293
- title: v,
294
- onClick: () => S(ve(a, f), { autoStart: r }),
295
- children: "?"
296
- }
297
- );
298
- }, U = "nice-tutorial-button-styles";
299
- if (typeof document < "u" && !document.getElementById(U)) {
300
- const a = document.createElement("style");
301
- a.id = U, a.textContent = `
302
- .nice-tutorial-button {
303
- display: inline-flex;
304
- align-items: center;
305
- justify-content: center;
306
- border: 1px solid var(--nice-border, #cbd5e1);
307
- background: var(--nice-bg, #fff);
308
- color: var(--nice-text-secondary, #475569);
309
- border-radius: var(--nice-radius-full, 9999px);
310
- cursor: help;
311
- font-weight: 700;
312
- line-height: 1;
313
- padding: 0;
314
- transition: background var(--nice-transition, 200ms ease), color var(--nice-transition, 200ms ease), border-color var(--nice-transition, 200ms ease);
315
- }
316
- .nice-tutorial-button:hover {
317
- background: var(--nice-primary, #2563eb);
318
- border-color: var(--nice-primary, #2563eb);
319
- color: var(--nice-text-inverse, #fff);
320
- }
321
- .nice-tutorial-button:focus-visible {
322
- outline: none;
323
- box-shadow: 0 0 0 2px var(--nice-bg, #fff), 0 0 0 4px var(--nice-primary, #2563eb);
324
- }
325
- .nice-tutorial-button--sm { width: 16px; height: 16px; font-size: 11px; }
326
- .nice-tutorial-button--md { width: 20px; height: 20px; font-size: 12px; }
327
- `, document.head.appendChild(a);
328
- }
329
- b(null);
330
- b(null);
331
- b(null);
332
- const $ = {
333
- space1: "4px",
334
- space2: "8px",
335
- space3: "12px",
336
- space4: "16px",
337
- space5: "20px",
338
- space6: "24px",
339
- space8: "32px"
340
- }, V = {
341
- fontFamily: "'Inter', system-ui, -apple-system, sans-serif",
342
- fontSizeXs: "0.75rem",
343
- fontSizeSm: "0.8125rem",
344
- fontSizeMd: "0.875rem",
345
- fontSizeLg: "1rem",
346
- fontSizeXl: "1.125rem",
347
- fontWeightNormal: 400,
348
- fontWeightMedium: 500,
349
- fontWeightSemibold: 600,
350
- fontWeightBold: 700,
351
- lineHeight: 1.5
352
- }, K = { fast: "120ms ease", normal: "200ms ease", slow: "300ms ease" }, j = (a) => ({
353
- color: a,
354
- radiusSm: "4px",
355
- radiusMd: "6px",
356
- radiusLg: "8px",
357
- radiusXl: "12px",
358
- radiusFull: "9999px"
359
- }), ge = {
360
- sm: "0 1px 2px rgba(0,0,0,0.05)",
361
- md: "0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1)",
362
- lg: "0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1)",
363
- xl: "0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1)"
364
- }, we = {
365
- sm: "0 1px 2px rgba(0,0,0,0.3)",
366
- md: "0 4px 6px -1px rgba(0,0,0,0.4)",
367
- lg: "0 10px 15px -3px rgba(0,0,0,0.4)",
368
- xl: "0 20px 25px -5px rgba(0,0,0,0.4)"
369
- };
370
- function i(a, r, c, t, y) {
371
- return {
372
- name: a,
373
- darkMode: "light",
374
- colors: {
375
- ...r,
376
- surface: r.surface ?? c.primary,
377
- surfaceHover: r.surfaceHover ?? c.secondary
378
- },
379
- backgrounds: {
380
- ...c,
381
- elevated: c.elevated ?? c.primary,
382
- inset: c.inset ?? c.tertiary,
383
- canvas: c.canvas ?? c.primary
384
- },
385
- text: { ...t, inverse: t.inverse ?? "#ffffff" },
386
- borders: j(y),
387
- shadows: ge,
388
- spacing: $,
389
- typography: V,
390
- transitions: K
391
- };
392
- }
393
- function m(a, r, c, t, y) {
394
- return {
395
- name: a,
396
- darkMode: "dark",
397
- colors: {
398
- ...r,
399
- surface: r.surface ?? c.secondary,
400
- surfaceHover: r.surfaceHover ?? c.tertiary
401
- },
402
- backgrounds: {
403
- ...c,
404
- elevated: c.elevated ?? c.secondary,
405
- inset: c.inset ?? c.primary,
406
- canvas: c.canvas ?? c.primary
407
- },
408
- text: { ...t, inverse: t.inverse ?? "#0f172a" },
409
- borders: j(y),
410
- shadows: we,
411
- spacing: $,
412
- typography: V,
413
- transitions: K
414
- };
415
- }
416
- i(
417
- "Slate",
418
- {
419
- primary: "#64748b",
420
- primaryHover: "#475569",
421
- success: "#10b981",
422
- warning: "#f59e0b",
423
- error: "#ef4444",
424
- info: "#06b6d4"
425
- },
426
- { primary: "#f8fafc", secondary: "#f1f5f9", tertiary: "#e2e8f0", hover: "#e2e8f0" },
427
- { primary: "#1e293b", secondary: "#475569", muted: "#94a3b8" },
428
- "#cbd5e1"
429
- );
430
- i(
431
- "Zinc",
432
- {
433
- primary: "#71717a",
434
- primaryHover: "#52525b",
435
- success: "#22c55e",
436
- warning: "#eab308",
437
- error: "#ef4444",
438
- info: "#06b6d4"
439
- },
440
- { primary: "#fafafa", secondary: "#f4f4f5", tertiary: "#e4e4e7", hover: "#e4e4e7" },
441
- { primary: "#18181b", secondary: "#3f3f46", muted: "#a1a1aa" },
442
- "#d4d4d8"
443
- );
444
- i(
445
- "Stone",
446
- {
447
- primary: "#78716c",
448
- primaryHover: "#57534e",
449
- success: "#16a34a",
450
- warning: "#ca8a04",
451
- error: "#dc2626",
452
- info: "#0891b2"
453
- },
454
- { primary: "#fafaf9", secondary: "#f5f5f4", tertiary: "#e7e5e4", hover: "#e7e5e4" },
455
- { primary: "#1c1917", secondary: "#44403c", muted: "#a8a29e" },
456
- "#d6d3d1"
457
- );
458
- i(
459
- "Cool Gray",
460
- {
461
- primary: "#6b7280",
462
- primaryHover: "#4b5563",
463
- success: "#10b981",
464
- warning: "#f59e0b",
465
- error: "#ef4444",
466
- info: "#3b82f6"
467
- },
468
- { primary: "#f9fafb", secondary: "#f3f4f6", tertiary: "#e5e7eb", hover: "#e5e7eb" },
469
- { primary: "#111827", secondary: "#374151", muted: "#9ca3af" },
470
- "#d1d5db"
471
- );
472
- i(
473
- "Warm Gray",
474
- {
475
- primary: "#7c7568",
476
- primaryHover: "#5c564c",
477
- success: "#4d7c0f",
478
- warning: "#a16207",
479
- error: "#b91c1c",
480
- info: "#0e7490"
481
- },
482
- { primary: "#faf9f7", secondary: "#f5f4f0", tertiary: "#e8e6e1", hover: "#e8e6e1" },
483
- { primary: "#1f1d19", secondary: "#4a463d", muted: "#a09888" },
484
- "#d4d0c8"
485
- );
486
- i(
487
- "Silver",
488
- {
489
- primary: "#94a3b8",
490
- primaryHover: "#64748b",
491
- success: "#10b981",
492
- warning: "#f59e0b",
493
- error: "#ef4444",
494
- info: "#38bdf8"
495
- },
496
- { primary: "#f8fafc", secondary: "#f1f5f9", tertiary: "#e2e8f0", hover: "#e2e8f0" },
497
- { primary: "#334155", secondary: "#64748b", muted: "#94a3b8" },
498
- "#cbd5e1"
499
- );
500
- i(
501
- "Charcoal",
502
- {
503
- primary: "#374151",
504
- primaryHover: "#1f2937",
505
- success: "#059669",
506
- warning: "#d97706",
507
- error: "#dc2626",
508
- info: "#0284c7"
509
- },
510
- { primary: "#f9fafb", secondary: "#f3f4f6", tertiary: "#e5e7eb", hover: "#e5e7eb" },
511
- { primary: "#111827", secondary: "#374151", muted: "#6b7280" },
512
- "#d1d5db"
513
- );
514
- i(
515
- "Ivory",
516
- {
517
- primary: "#92876d",
518
- primaryHover: "#7a6f55",
519
- success: "#4d7c0f",
520
- warning: "#a16207",
521
- error: "#b91c1c",
522
- info: "#0e7490"
523
- },
524
- { primary: "#fffef7", secondary: "#faf6eb", tertiary: "#f0ead6", hover: "#f0ead6" },
525
- { primary: "#2b2517", secondary: "#5c5340", muted: "#9c9280" },
526
- "#ddd8c4"
527
- );
528
- i(
529
- "Rose",
530
- {
531
- primary: "#e11d48",
532
- primaryHover: "#be123c",
533
- success: "#16a34a",
534
- warning: "#ea580c",
535
- error: "#dc2626",
536
- info: "#0891b2"
537
- },
538
- { primary: "#fff1f2", secondary: "#ffe4e6", tertiary: "#fecdd3", hover: "#ffe4e6" },
539
- { primary: "#4c0519", secondary: "#881337", muted: "#f43f5e" },
540
- "#fda4af"
541
- );
542
- i(
543
- "Emerald",
544
- {
545
- primary: "#059669",
546
- primaryHover: "#047857",
547
- success: "#16a34a",
548
- warning: "#d97706",
549
- error: "#dc2626",
550
- info: "#0891b2"
551
- },
552
- { primary: "#ecfdf5", secondary: "#d1fae5", tertiary: "#a7f3d0", hover: "#d1fae5" },
553
- { primary: "#064e3b", secondary: "#065f46", muted: "#34d399" },
554
- "#6ee7b7"
555
- );
556
- i(
557
- "Amber",
558
- {
559
- primary: "#d97706",
560
- primaryHover: "#b45309",
561
- success: "#16a34a",
562
- warning: "#ca8a04",
563
- error: "#dc2626",
564
- info: "#0284c7"
565
- },
566
- { primary: "#fffbeb", secondary: "#fef3c7", tertiary: "#fde68a", hover: "#fef3c7" },
567
- { primary: "#451a03", secondary: "#78350f", muted: "#f59e0b" },
568
- "#fcd34d"
569
- );
570
- i(
571
- "Violet",
572
- {
573
- primary: "#7c3aed",
574
- primaryHover: "#6d28d9",
575
- success: "#10b981",
576
- warning: "#f59e0b",
577
- error: "#ef4444",
578
- info: "#06b6d4"
579
- },
580
- { primary: "#f5f3ff", secondary: "#ede9fe", tertiary: "#ddd6fe", hover: "#ede9fe" },
581
- { primary: "#2e1065", secondary: "#4c1d95", muted: "#a78bfa" },
582
- "#c4b5fd"
583
- );
584
- i(
585
- "Teal",
586
- {
587
- primary: "#0d9488",
588
- primaryHover: "#0f766e",
589
- success: "#16a34a",
590
- warning: "#d97706",
591
- error: "#dc2626",
592
- info: "#0284c7"
593
- },
594
- { primary: "#f0fdfa", secondary: "#ccfbf1", tertiary: "#99f6e4", hover: "#ccfbf1" },
595
- { primary: "#134e4a", secondary: "#115e59", muted: "#2dd4bf" },
596
- "#5eead4"
597
- );
598
- i(
599
- "Indigo",
600
- {
601
- primary: "#4f46e5",
602
- primaryHover: "#4338ca",
603
- success: "#10b981",
604
- warning: "#f59e0b",
605
- error: "#ef4444",
606
- info: "#06b6d4"
607
- },
608
- { primary: "#eef2ff", secondary: "#e0e7ff", tertiary: "#c7d2fe", hover: "#e0e7ff" },
609
- { primary: "#1e1b4b", secondary: "#312e81", muted: "#818cf8" },
610
- "#a5b4fc"
611
- );
612
- i(
613
- "Cyan",
614
- {
615
- primary: "#0891b2",
616
- primaryHover: "#0e7490",
617
- success: "#10b981",
618
- warning: "#f59e0b",
619
- error: "#ef4444",
620
- info: "#0284c7"
621
- },
622
- { primary: "#ecfeff", secondary: "#cffafe", tertiary: "#a5f3fc", hover: "#cffafe" },
623
- { primary: "#164e63", secondary: "#155e75", muted: "#22d3ee" },
624
- "#67e8f9"
625
- );
626
- i(
627
- "Lime",
628
- {
629
- primary: "#65a30d",
630
- primaryHover: "#4d7c0f",
631
- success: "#16a34a",
632
- warning: "#ca8a04",
633
- error: "#dc2626",
634
- info: "#0891b2"
635
- },
636
- { primary: "#f7fee7", secondary: "#ecfccb", tertiary: "#d9f99d", hover: "#ecfccb" },
637
- { primary: "#1a2e05", secondary: "#365314", muted: "#84cc16" },
638
- "#bef264"
639
- );
640
- i(
641
- "Pink",
642
- {
643
- primary: "#db2777",
644
- primaryHover: "#be185d",
645
- success: "#10b981",
646
- warning: "#f59e0b",
647
- error: "#dc2626",
648
- info: "#06b6d4"
649
- },
650
- { primary: "#fdf2f8", secondary: "#fce7f3", tertiary: "#fbcfe8", hover: "#fce7f3" },
651
- { primary: "#500724", secondary: "#831843", muted: "#f472b6" },
652
- "#f9a8d4"
653
- );
654
- i(
655
- "Orange",
656
- {
657
- primary: "#ea580c",
658
- primaryHover: "#c2410c",
659
- success: "#16a34a",
660
- warning: "#ca8a04",
661
- error: "#dc2626",
662
- info: "#0891b2"
663
- },
664
- { primary: "#fff7ed", secondary: "#ffedd5", tertiary: "#fed7aa", hover: "#ffedd5" },
665
- { primary: "#431407", secondary: "#7c2d12", muted: "#fb923c" },
666
- "#fdba74"
667
- );
668
- i(
669
- "Fuchsia",
670
- {
671
- primary: "#c026d3",
672
- primaryHover: "#a21caf",
673
- success: "#10b981",
674
- warning: "#eab308",
675
- error: "#ef4444",
676
- info: "#06b6d4"
677
- },
678
- { primary: "#fdf4ff", secondary: "#fae8ff", tertiary: "#f5d0fe", hover: "#fae8ff" },
679
- { primary: "#4a044e", secondary: "#701a75", muted: "#d946ef" },
680
- "#e879f9"
681
- );
682
- i(
683
- "Sky",
684
- {
685
- primary: "#0284c7",
686
- primaryHover: "#0369a1",
687
- success: "#10b981",
688
- warning: "#f59e0b",
689
- error: "#ef4444",
690
- info: "#06b6d4"
691
- },
692
- { primary: "#f0f9ff", secondary: "#e0f2fe", tertiary: "#bae6fd", hover: "#e0f2fe" },
693
- { primary: "#0c4a6e", secondary: "#075985", muted: "#38bdf8" },
694
- "#7dd3fc"
695
- );
696
- i(
697
- "Ruby",
698
- {
699
- primary: "#be123c",
700
- primaryHover: "#9f1239",
701
- success: "#059669",
702
- warning: "#d97706",
703
- error: "#dc2626",
704
- info: "#0284c7"
705
- },
706
- { primary: "#fff1f2", secondary: "#ffe4e6", tertiary: "#fecdd3", hover: "#ffe4e6" },
707
- { primary: "#4c0519", secondary: "#881337", muted: "#fb7185" },
708
- "#fda4af"
709
- );
710
- i(
711
- "Coral",
712
- {
713
- primary: "#f97316",
714
- primaryHover: "#ea580c",
715
- success: "#10b981",
716
- warning: "#eab308",
717
- error: "#ef4444",
718
- info: "#06b6d4"
719
- },
720
- { primary: "#fff7ed", secondary: "#ffedd5", tertiary: "#fed7aa", hover: "#ffedd5" },
721
- { primary: "#431407", secondary: "#9a3412", muted: "#fb923c" },
722
- "#fdba74"
723
- );
724
- m(
725
- "Midnight",
726
- {
727
- primary: "#818cf8",
728
- primaryHover: "#6366f1",
729
- success: "#34d399",
730
- warning: "#fbbf24",
731
- error: "#f87171",
732
- info: "#22d3ee"
733
- },
734
- { primary: "#020617", secondary: "#0f172a", tertiary: "#1e293b", hover: "#1e293b" },
735
- { primary: "#f1f5f9", secondary: "#94a3b8", muted: "#475569" },
736
- "#1e293b"
737
- );
738
- m(
739
- "Obsidian",
740
- {
741
- primary: "#a78bfa",
742
- primaryHover: "#8b5cf6",
743
- success: "#4ade80",
744
- warning: "#facc15",
745
- error: "#fb7185",
746
- info: "#38bdf8"
747
- },
748
- { primary: "#09090b", secondary: "#18181b", tertiary: "#27272a", hover: "#27272a" },
749
- { primary: "#fafafa", secondary: "#a1a1aa", muted: "#52525b" },
750
- "#3f3f46"
751
- );
752
- m(
753
- "Eclipse",
754
- {
755
- primary: "#c084fc",
756
- primaryHover: "#a855f7",
757
- success: "#34d399",
758
- warning: "#fbbf24",
759
- error: "#f87171",
760
- info: "#67e8f9"
761
- },
762
- { primary: "#0c0a1d", secondary: "#1a1533", tertiary: "#2a2248", hover: "#2a2248" },
763
- { primary: "#f5f3ff", secondary: "#a78bfa", muted: "#6d5eac" },
764
- "#3b3266"
765
- );
766
- m(
767
- "Onyx",
768
- {
769
- primary: "#60a5fa",
770
- primaryHover: "#3b82f6",
771
- success: "#4ade80",
772
- warning: "#fbbf24",
773
- error: "#f87171",
774
- info: "#22d3ee"
775
- },
776
- { primary: "#000000", secondary: "#0a0a0a", tertiary: "#171717", hover: "#171717" },
777
- { primary: "#ffffff", secondary: "#a3a3a3", muted: "#525252" },
778
- "#262626"
779
- );
780
- m(
781
- "Carbon",
782
- {
783
- primary: "#38bdf8",
784
- primaryHover: "#0ea5e9",
785
- success: "#4ade80",
786
- warning: "#facc15",
787
- error: "#f87171",
788
- info: "#67e8f9"
789
- },
790
- { primary: "#161616", secondary: "#262626", tertiary: "#393939", hover: "#393939" },
791
- { primary: "#f4f4f4", secondary: "#c6c6c6", muted: "#6f6f6f" },
792
- "#525252"
793
- );
794
- m(
795
- "Cosmos",
796
- {
797
- primary: "#6366f1",
798
- primaryHover: "#4f46e5",
799
- success: "#34d399",
800
- warning: "#fbbf24",
801
- error: "#f87171",
802
- info: "#22d3ee"
803
- },
804
- { primary: "#030712", secondary: "#111827", tertiary: "#1f2937", hover: "#1f2937" },
805
- { primary: "#e5e7eb", secondary: "#9ca3af", muted: "#4b5563" },
806
- "#374151"
807
- );
808
- m(
809
- "Nebula",
810
- {
811
- primary: "#e879f9",
812
- primaryHover: "#d946ef",
813
- success: "#4ade80",
814
- warning: "#fbbf24",
815
- error: "#fb7185",
816
- info: "#67e8f9"
817
- },
818
- { primary: "#0d0117", secondary: "#1a0533", tertiary: "#2d0a52", hover: "#2d0a52" },
819
- { primary: "#fae8ff", secondary: "#d8b4fe", muted: "#7c3aed" },
820
- "#581c87"
821
- );
822
- m(
823
- "Abyss",
824
- {
825
- primary: "#22d3ee",
826
- primaryHover: "#06b6d4",
827
- success: "#34d399",
828
- warning: "#fbbf24",
829
- error: "#f87171",
830
- info: "#38bdf8"
831
- },
832
- { primary: "#001219", secondary: "#002a3a", tertiary: "#003e54", hover: "#003e54" },
833
- { primary: "#e0f2fe", secondary: "#7dd3fc", muted: "#0369a1" },
834
- "#075985"
835
- );
836
- m(
837
- "Shadow",
838
- {
839
- primary: "#a3a3a3",
840
- primaryHover: "#737373",
841
- success: "#4ade80",
842
- warning: "#facc15",
843
- error: "#f87171",
844
- info: "#38bdf8"
845
- },
846
- { primary: "#171717", secondary: "#1f1f1f", tertiary: "#2a2a2a", hover: "#2a2a2a" },
847
- { primary: "#e5e5e5", secondary: "#a3a3a3", muted: "#525252" },
848
- "#404040"
849
- );
850
- m(
851
- "Emerald Dark",
852
- {
853
- primary: "#34d399",
854
- primaryHover: "#10b981",
855
- success: "#4ade80",
856
- warning: "#fbbf24",
857
- error: "#f87171",
858
- info: "#22d3ee"
859
- },
860
- { primary: "#022c22", secondary: "#064e3b", tertiary: "#065f46", hover: "#065f46" },
861
- { primary: "#ecfdf5", secondary: "#6ee7b7", muted: "#047857" },
862
- "#047857"
863
- );
864
- i(
865
- "Forest",
866
- {
867
- primary: "#166534",
868
- primaryHover: "#14532d",
869
- success: "#22c55e",
870
- warning: "#ca8a04",
871
- error: "#dc2626",
872
- info: "#0891b2"
873
- },
874
- { primary: "#f0fdf4", secondary: "#dcfce7", tertiary: "#bbf7d0", hover: "#dcfce7" },
875
- { primary: "#052e16", secondary: "#166534", muted: "#4ade80" },
876
- "#86efac"
877
- );
878
- i(
879
- "Ocean",
880
- {
881
- primary: "#0369a1",
882
- primaryHover: "#075985",
883
- success: "#059669",
884
- warning: "#d97706",
885
- error: "#dc2626",
886
- info: "#0284c7"
887
- },
888
- { primary: "#f0f9ff", secondary: "#e0f2fe", tertiary: "#bae6fd", hover: "#e0f2fe" },
889
- { primary: "#0c4a6e", secondary: "#0369a1", muted: "#38bdf8" },
890
- "#7dd3fc"
891
- );
892
- i(
893
- "Desert",
894
- {
895
- primary: "#b45309",
896
- primaryHover: "#92400e",
897
- success: "#4d7c0f",
898
- warning: "#a16207",
899
- error: "#b91c1c",
900
- info: "#0e7490"
901
- },
902
- { primary: "#fefce8", secondary: "#fef9c3", tertiary: "#fef08a", hover: "#fef9c3" },
903
- { primary: "#422006", secondary: "#713f12", muted: "#ca8a04" },
904
- "#fde047"
905
- );
906
- i(
907
- "Sunset",
908
- {
909
- primary: "#ea580c",
910
- primaryHover: "#c2410c",
911
- success: "#16a34a",
912
- warning: "#d97706",
913
- error: "#dc2626",
914
- info: "#0891b2"
915
- },
916
- { primary: "#fff7ed", secondary: "#ffedd5", tertiary: "#fed7aa", hover: "#ffedd5" },
917
- { primary: "#431407", secondary: "#9a3412", muted: "#f97316" },
918
- "#fdba74"
919
- );
920
- i(
921
- "Aurora",
922
- {
923
- primary: "#0d9488",
924
- primaryHover: "#0f766e",
925
- success: "#22c55e",
926
- warning: "#eab308",
927
- error: "#ef4444",
928
- info: "#06b6d4"
929
- },
930
- { primary: "#f0fdfa", secondary: "#ccfbf1", tertiary: "#99f6e4", hover: "#ccfbf1" },
931
- { primary: "#134e4a", secondary: "#115e59", muted: "#2dd4bf" },
932
- "#5eead4"
933
- );
934
- i(
935
- "Lavender",
936
- {
937
- primary: "#7e22ce",
938
- primaryHover: "#6b21a8",
939
- success: "#16a34a",
940
- warning: "#d97706",
941
- error: "#dc2626",
942
- info: "#0891b2"
943
- },
944
- { primary: "#faf5ff", secondary: "#f3e8ff", tertiary: "#e9d5ff", hover: "#f3e8ff" },
945
- { primary: "#3b0764", secondary: "#581c87", muted: "#a855f7" },
946
- "#d8b4fe"
947
- );
948
- i(
949
- "Autumn",
950
- {
951
- primary: "#c2410c",
952
- primaryHover: "#9a3412",
953
- success: "#4d7c0f",
954
- warning: "#a16207",
955
- error: "#b91c1c",
956
- info: "#0e7490"
957
- },
958
- { primary: "#fef2f2", secondary: "#fee2e2", tertiary: "#fecaca", hover: "#fee2e2" },
959
- { primary: "#450a0a", secondary: "#7f1d1d", muted: "#f87171" },
960
- "#fca5a5"
961
- );
962
- i(
963
- "Spring",
964
- {
965
- primary: "#16a34a",
966
- primaryHover: "#15803d",
967
- success: "#22c55e",
968
- warning: "#eab308",
969
- error: "#ef4444",
970
- info: "#06b6d4"
971
- },
972
- { primary: "#f0fdf4", secondary: "#dcfce7", tertiary: "#bbf7d0", hover: "#dcfce7" },
973
- { primary: "#14532d", secondary: "#166534", muted: "#4ade80" },
974
- "#86efac"
975
- );
976
- i(
977
- "Arctic",
978
- {
979
- primary: "#0ea5e9",
980
- primaryHover: "#0284c7",
981
- success: "#10b981",
982
- warning: "#f59e0b",
983
- error: "#ef4444",
984
- info: "#06b6d4"
985
- },
986
- { primary: "#f0f9ff", secondary: "#e0f2fe", tertiary: "#bae6fd", hover: "#e0f2fe" },
987
- { primary: "#0c4a6e", secondary: "#0369a1", muted: "#7dd3fc" },
988
- "#bae6fd"
989
- );
990
- i(
991
- "Tropical",
992
- {
993
- primary: "#0d9488",
994
- primaryHover: "#0f766e",
995
- success: "#16a34a",
996
- warning: "#f59e0b",
997
- error: "#ef4444",
998
- info: "#06b6d4"
999
- },
1000
- { primary: "#ecfdf5", secondary: "#d1fae5", tertiary: "#a7f3d0", hover: "#d1fae5" },
1001
- { primary: "#064e3b", secondary: "#065f46", muted: "#6ee7b7" },
1002
- "#a7f3d0"
1003
- );
1004
- i(
1005
- "Pastel Rose",
1006
- {
1007
- primary: "#f472b6",
1008
- primaryHover: "#ec4899",
1009
- success: "#4ade80",
1010
- warning: "#fcd34d",
1011
- error: "#fb7185",
1012
- info: "#67e8f9"
1013
- },
1014
- { primary: "#fdf2f8", secondary: "#fce7f3", tertiary: "#fbcfe8", hover: "#fce7f3" },
1015
- { primary: "#831843", secondary: "#9d174d", muted: "#f9a8d4" },
1016
- "#f9a8d4"
1017
- );
1018
- i(
1019
- "Pastel Sky",
1020
- {
1021
- primary: "#38bdf8",
1022
- primaryHover: "#0ea5e9",
1023
- success: "#4ade80",
1024
- warning: "#fcd34d",
1025
- error: "#fb7185",
1026
- info: "#67e8f9"
1027
- },
1028
- { primary: "#f0f9ff", secondary: "#e0f2fe", tertiary: "#bae6fd", hover: "#e0f2fe" },
1029
- { primary: "#075985", secondary: "#0369a1", muted: "#7dd3fc" },
1030
- "#bae6fd"
1031
- );
1032
- i(
1033
- "Pastel Mint",
1034
- {
1035
- primary: "#34d399",
1036
- primaryHover: "#10b981",
1037
- success: "#4ade80",
1038
- warning: "#fcd34d",
1039
- error: "#fb7185",
1040
- info: "#67e8f9"
1041
- },
1042
- { primary: "#ecfdf5", secondary: "#d1fae5", tertiary: "#a7f3d0", hover: "#d1fae5" },
1043
- { primary: "#065f46", secondary: "#047857", muted: "#6ee7b7" },
1044
- "#a7f3d0"
1045
- );
1046
- i(
1047
- "Pastel Peach",
1048
- {
1049
- primary: "#fb923c",
1050
- primaryHover: "#f97316",
1051
- success: "#4ade80",
1052
- warning: "#fcd34d",
1053
- error: "#fb7185",
1054
- info: "#67e8f9"
1055
- },
1056
- { primary: "#fff7ed", secondary: "#ffedd5", tertiary: "#fed7aa", hover: "#ffedd5" },
1057
- { primary: "#7c2d12", secondary: "#9a3412", muted: "#fdba74" },
1058
- "#fed7aa"
1059
- );
1060
- i(
1061
- "Pastel Lavender",
1062
- {
1063
- primary: "#a78bfa",
1064
- primaryHover: "#8b5cf6",
1065
- success: "#4ade80",
1066
- warning: "#fcd34d",
1067
- error: "#fb7185",
1068
- info: "#67e8f9"
1069
- },
1070
- { primary: "#f5f3ff", secondary: "#ede9fe", tertiary: "#ddd6fe", hover: "#ede9fe" },
1071
- { primary: "#4c1d95", secondary: "#5b21b6", muted: "#c4b5fd" },
1072
- "#ddd6fe"
1073
- );
1074
- i(
1075
- "Pastel Lemon",
1076
- {
1077
- primary: "#facc15",
1078
- primaryHover: "#eab308",
1079
- success: "#4ade80",
1080
- warning: "#fcd34d",
1081
- error: "#fb7185",
1082
- info: "#67e8f9"
1083
- },
1084
- { primary: "#fefce8", secondary: "#fef9c3", tertiary: "#fef08a", hover: "#fef9c3" },
1085
- { primary: "#713f12", secondary: "#854d0e", muted: "#fde047" },
1086
- "#fef08a"
1087
- );
1088
- i(
1089
- "Pastel Sage",
1090
- {
1091
- primary: "#86efac",
1092
- primaryHover: "#4ade80",
1093
- success: "#22c55e",
1094
- warning: "#fcd34d",
1095
- error: "#fb7185",
1096
- info: "#67e8f9"
1097
- },
1098
- { primary: "#f0fdf4", secondary: "#dcfce7", tertiary: "#bbf7d0", hover: "#dcfce7" },
1099
- { primary: "#166534", secondary: "#15803d", muted: "#86efac" },
1100
- "#bbf7d0"
1101
- );
1102
- i(
1103
- "Pastel Coral",
1104
- {
1105
- primary: "#fb7185",
1106
- primaryHover: "#f43f5e",
1107
- success: "#4ade80",
1108
- warning: "#fcd34d",
1109
- error: "#ef4444",
1110
- info: "#67e8f9"
1111
- },
1112
- { primary: "#fff1f2", secondary: "#ffe4e6", tertiary: "#fecdd3", hover: "#ffe4e6" },
1113
- { primary: "#881337", secondary: "#9f1239", muted: "#fda4af" },
1114
- "#fecdd3"
1115
- );
1116
- i(
1117
- "Banking",
1118
- {
1119
- primary: "#1e3a5f",
1120
- primaryHover: "#152c4a",
1121
- success: "#059669",
1122
- warning: "#d97706",
1123
- error: "#dc2626",
1124
- info: "#0891b2"
1125
- },
1126
- { primary: "#f8fafc", secondary: "#f1f5f9", tertiary: "#e2e8f0", hover: "#e2e8f0" },
1127
- { primary: "#0f172a", secondary: "#334155", muted: "#94a3b8" },
1128
- "#cbd5e1"
1129
- );
1130
- i(
1131
- "Healthcare",
1132
- {
1133
- primary: "#0891b2",
1134
- primaryHover: "#0e7490",
1135
- success: "#059669",
1136
- warning: "#d97706",
1137
- error: "#dc2626",
1138
- info: "#0284c7"
1139
- },
1140
- { primary: "#f0fdfa", secondary: "#e0f7fa", tertiary: "#b2ebf2", hover: "#e0f7fa" },
1141
- { primary: "#134e4a", secondary: "#1a6b6a", muted: "#80cbc4" },
1142
- "#b2dfdb"
1143
- );
1144
- i(
1145
- "Legal",
1146
- {
1147
- primary: "#1e293b",
1148
- primaryHover: "#0f172a",
1149
- success: "#059669",
1150
- warning: "#d97706",
1151
- error: "#dc2626",
1152
- info: "#0284c7"
1153
- },
1154
- { primary: "#fafaf9", secondary: "#f5f5f4", tertiary: "#e7e5e4", hover: "#e7e5e4" },
1155
- { primary: "#0f172a", secondary: "#44403c", muted: "#a8a29e" },
1156
- "#d6d3d1"
1157
- );
1158
- i(
1159
- "Tech Startup",
1160
- {
1161
- primary: "#7c3aed",
1162
- primaryHover: "#6d28d9",
1163
- success: "#10b981",
1164
- warning: "#f59e0b",
1165
- error: "#ef4444",
1166
- info: "#06b6d4"
1167
- },
1168
- { primary: "#faf5ff", secondary: "#f3e8ff", tertiary: "#e9d5ff", hover: "#f3e8ff" },
1169
- { primary: "#1e1b4b", secondary: "#4c1d95", muted: "#a78bfa" },
1170
- "#c4b5fd"
1171
- );
1172
- i(
1173
- "Enterprise",
1174
- {
1175
- primary: "#1e40af",
1176
- primaryHover: "#1e3a8a",
1177
- success: "#059669",
1178
- warning: "#d97706",
1179
- error: "#dc2626",
1180
- info: "#0891b2"
1181
- },
1182
- { primary: "#eff6ff", secondary: "#dbeafe", tertiary: "#bfdbfe", hover: "#dbeafe" },
1183
- { primary: "#1e3a5f", secondary: "#1e40af", muted: "#60a5fa" },
1184
- "#93c5fd"
1185
- );
1186
- i(
1187
- "Government",
1188
- {
1189
- primary: "#1d4ed8",
1190
- primaryHover: "#1e40af",
1191
- success: "#059669",
1192
- warning: "#d97706",
1193
- error: "#dc2626",
1194
- info: "#0891b2"
1195
- },
1196
- { primary: "#f8fafc", secondary: "#f1f5f9", tertiary: "#e2e8f0", hover: "#e2e8f0" },
1197
- { primary: "#0f172a", secondary: "#1e293b", muted: "#64748b" },
1198
- "#cbd5e1"
1199
- );
1200
- i(
1201
- "Education",
1202
- {
1203
- primary: "#059669",
1204
- primaryHover: "#047857",
1205
- success: "#16a34a",
1206
- warning: "#f59e0b",
1207
- error: "#ef4444",
1208
- info: "#0891b2"
1209
- },
1210
- { primary: "#f0fdf9", secondary: "#d1fae5", tertiary: "#a7f3d0", hover: "#d1fae5" },
1211
- { primary: "#064e3b", secondary: "#065f46", muted: "#6ee7b7" },
1212
- "#a7f3d0"
1213
- );
1214
- i(
1215
- "Real Estate",
1216
- {
1217
- primary: "#92400e",
1218
- primaryHover: "#78350f",
1219
- success: "#059669",
1220
- warning: "#b45309",
1221
- error: "#dc2626",
1222
- info: "#0891b2"
1223
- },
1224
- { primary: "#fffbeb", secondary: "#fef3c7", tertiary: "#fde68a", hover: "#fef3c7" },
1225
- { primary: "#422006", secondary: "#713f12", muted: "#d97706" },
1226
- "#fcd34d"
1227
- );
1228
- i(
1229
- "Nord",
1230
- {
1231
- primary: "#5e81ac",
1232
- primaryHover: "#4c6b90",
1233
- success: "#a3be8c",
1234
- warning: "#ebcb8b",
1235
- error: "#bf616a",
1236
- info: "#88c0d0"
1237
- },
1238
- { primary: "#eceff4", secondary: "#e5e9f0", tertiary: "#d8dee9", hover: "#d8dee9" },
1239
- { primary: "#2e3440", secondary: "#3b4252", muted: "#4c566a" },
1240
- "#d8dee9"
1241
- );
1242
- m(
1243
- "Dracula",
1244
- {
1245
- primary: "#bd93f9",
1246
- primaryHover: "#9d79d9",
1247
- success: "#50fa7b",
1248
- warning: "#f1fa8c",
1249
- error: "#ff5555",
1250
- info: "#8be9fd"
1251
- },
1252
- { primary: "#282a36", secondary: "#343746", tertiary: "#44475a", hover: "#44475a" },
1253
- { primary: "#f8f8f2", secondary: "#c0c0c0", muted: "#6272a4" },
1254
- "#44475a"
1255
- );
1256
- i(
1257
- "Solarized Light",
1258
- {
1259
- primary: "#268bd2",
1260
- primaryHover: "#1a6da0",
1261
- success: "#859900",
1262
- warning: "#b58900",
1263
- error: "#dc322f",
1264
- info: "#2aa198"
1265
- },
1266
- { primary: "#fdf6e3", secondary: "#eee8d5", tertiary: "#e0dbc7", hover: "#eee8d5" },
1267
- { primary: "#073642", secondary: "#586e75", muted: "#93a1a1" },
1268
- "#eee8d5"
1269
- );
1270
- m(
1271
- "Solarized Dark",
1272
- {
1273
- primary: "#268bd2",
1274
- primaryHover: "#3d98db",
1275
- success: "#859900",
1276
- warning: "#b58900",
1277
- error: "#dc322f",
1278
- info: "#2aa198"
1279
- },
1280
- { primary: "#002b36", secondary: "#073642", tertiary: "#0a4858", hover: "#073642" },
1281
- { primary: "#eee8d5", secondary: "#93a1a1", muted: "#586e75" },
1282
- "#073642"
1283
- );
1284
- m(
1285
- "Monokai",
1286
- {
1287
- primary: "#66d9ef",
1288
- primaryHover: "#45c0d6",
1289
- success: "#a6e22e",
1290
- warning: "#e6db74",
1291
- error: "#f92672",
1292
- info: "#66d9ef"
1293
- },
1294
- { primary: "#272822", secondary: "#34352e", tertiary: "#3e3d32", hover: "#3e3d32" },
1295
- { primary: "#f8f8f2", secondary: "#cfcfc2", muted: "#75715e" },
1296
- "#3e3d32"
1297
- );
1298
- m(
1299
- "One Dark",
1300
- {
1301
- primary: "#61afef",
1302
- primaryHover: "#4b9ee0",
1303
- success: "#98c379",
1304
- warning: "#e5c07b",
1305
- error: "#e06c75",
1306
- info: "#56b6c2"
1307
- },
1308
- { primary: "#282c34", secondary: "#2c313a", tertiary: "#353b45", hover: "#353b45" },
1309
- { primary: "#abb2bf", secondary: "#828997", muted: "#545862" },
1310
- "#3e4452"
1311
- );
1312
- m(
1313
- "Synthwave",
1314
- {
1315
- primary: "#ff7edb",
1316
- primaryHover: "#e660c2",
1317
- success: "#72f1b8",
1318
- warning: "#fede5d",
1319
- error: "#fe4450",
1320
- info: "#36f9f6"
1321
- },
1322
- { primary: "#241b2f", secondary: "#2d2140", tertiary: "#362a50", hover: "#362a50" },
1323
- { primary: "#f0e4fc", secondary: "#b4a0cc", muted: "#6c5c84" },
1324
- "#4a3866"
1325
- );
1326
- i(
1327
- "Vaporwave",
1328
- {
1329
- primary: "#ff71ce",
1330
- primaryHover: "#e655b5",
1331
- success: "#78dcca",
1332
- warning: "#ffb86c",
1333
- error: "#ff5555",
1334
- info: "#76e8fc"
1335
- },
1336
- { primary: "#fce4f7", secondary: "#e8d0f4", tertiary: "#d4bcf0", hover: "#e8d0f4" },
1337
- { primary: "#4a1a4e", secondary: "#7b3f7d", muted: "#c080c0" },
1338
- "#d8a8e8"
1339
- );
1340
- m(
1341
- "Terminal Green",
1342
- {
1343
- primary: "#00ff41",
1344
- primaryHover: "#00cc34",
1345
- success: "#00ff41",
1346
- warning: "#ffff00",
1347
- error: "#ff0000",
1348
- info: "#00ffff"
1349
- },
1350
- { primary: "#0a0a0a", secondary: "#0d1a0d", tertiary: "#1a2e1a", hover: "#1a2e1a" },
1351
- { primary: "#00ff41", secondary: "#00cc33", muted: "#008822" },
1352
- "#003300"
1353
- );
1354
- i(
1355
- "Sepia",
1356
- {
1357
- primary: "#8b6914",
1358
- primaryHover: "#704f10",
1359
- success: "#6b8e23",
1360
- warning: "#cd853f",
1361
- error: "#b22222",
1362
- info: "#5f9ea0"
1363
- },
1364
- { primary: "#faf0e6", secondary: "#f5e6d3", tertiary: "#eddcc7", hover: "#f5e6d3" },
1365
- { primary: "#3e2723", secondary: "#5d4037", muted: "#a1887f" },
1366
- "#d7ccc8"
1367
- );
1368
- i(
1369
- "Vintage",
1370
- {
1371
- primary: "#8d6e63",
1372
- primaryHover: "#6d4c41",
1373
- success: "#66bb6a",
1374
- warning: "#ffb300",
1375
- error: "#e53935",
1376
- info: "#29b6f6"
1377
- },
1378
- { primary: "#efebe9", secondary: "#d7ccc8", tertiary: "#bcaaa4", hover: "#d7ccc8" },
1379
- { primary: "#3e2723", secondary: "#5d4037", muted: "#a1887f" },
1380
- "#bcaaa4"
1381
- );
1382
- m(
1383
- "Cyberpunk",
1384
- {
1385
- primary: "#00f0ff",
1386
- primaryHover: "#00c8d4",
1387
- success: "#39ff14",
1388
- warning: "#ffff00",
1389
- error: "#ff003c",
1390
- info: "#bf00ff"
1391
- },
1392
- { primary: "#0a0e17", secondary: "#131824", tertiary: "#1c2333", hover: "#1c2333" },
1393
- { primary: "#e0fbfc", secondary: "#80d4dd", muted: "#3a6b72" },
1394
- "#1c3a44"
1395
- );
1396
- m(
1397
- "Neon",
1398
- {
1399
- primary: "#ff00ff",
1400
- primaryHover: "#cc00cc",
1401
- success: "#00ff00",
1402
- warning: "#ffff00",
1403
- error: "#ff0000",
1404
- info: "#00ffff"
1405
- },
1406
- { primary: "#0d0d0d", secondary: "#1a1a1a", tertiary: "#262626", hover: "#262626" },
1407
- { primary: "#ffffff", secondary: "#cccccc", muted: "#666666" },
1408
- "#333333"
1409
- );
1410
- m(
1411
- "Retrowave",
1412
- {
1413
- primary: "#f77fbe",
1414
- primaryHover: "#e462a3",
1415
- success: "#72f1b8",
1416
- warning: "#ffe261",
1417
- error: "#ff4444",
1418
- info: "#79e8fb"
1419
- },
1420
- { primary: "#1b0a2e", secondary: "#261440", tertiary: "#321e52", hover: "#321e52" },
1421
- { primary: "#ffe6f7", secondary: "#c9a0c9", muted: "#6b4c7a" },
1422
- "#4a2d66"
1423
- );
1424
- i(
1425
- "Christmas",
1426
- {
1427
- primary: "#c41e3a",
1428
- primaryHover: "#a01830",
1429
- success: "#228b22",
1430
- warning: "#ffd700",
1431
- error: "#dc2626",
1432
- info: "#0891b2"
1433
- },
1434
- { primary: "#fef2f2", secondary: "#fde8e8", tertiary: "#f8d0d0", hover: "#fde8e8" },
1435
- { primary: "#3b0a0a", secondary: "#7f1d1d", muted: "#dc6868" },
1436
- "#e8a0a0"
1437
- );
1438
- m(
1439
- "Halloween",
1440
- {
1441
- primary: "#ff6600",
1442
- primaryHover: "#e05500",
1443
- success: "#4ade80",
1444
- warning: "#fbbf24",
1445
- error: "#ff0000",
1446
- info: "#9333ea"
1447
- },
1448
- { primary: "#1a0a00", secondary: "#2d1500", tertiary: "#402000", hover: "#402000" },
1449
- { primary: "#ffedd5", secondary: "#fdba74", muted: "#9a5c28" },
1450
- "#5c3400"
1451
- );
1452
- i(
1453
- "Valentine",
1454
- {
1455
- primary: "#e11d48",
1456
- primaryHover: "#be123c",
1457
- success: "#10b981",
1458
- warning: "#f59e0b",
1459
- error: "#dc2626",
1460
- info: "#ec4899"
1461
- },
1462
- { primary: "#fff1f2", secondary: "#ffe4e6", tertiary: "#fecdd3", hover: "#ffe4e6" },
1463
- { primary: "#4c0519", secondary: "#881337", muted: "#f9a8d4" },
1464
- "#fda4af"
1465
- );
1466
- i(
1467
- "Easter",
1468
- {
1469
- primary: "#a78bfa",
1470
- primaryHover: "#8b5cf6",
1471
- success: "#4ade80",
1472
- warning: "#fcd34d",
1473
- error: "#fb7185",
1474
- info: "#67e8f9"
1475
- },
1476
- { primary: "#fef9ff", secondary: "#f3e8ff", tertiary: "#e8d5ff", hover: "#f3e8ff" },
1477
- { primary: "#581c87", secondary: "#6d28d9", muted: "#c4b5fd" },
1478
- "#ddd6fe"
1479
- );
1480
- i(
1481
- "Summer Beach",
1482
- {
1483
- primary: "#0ea5e9",
1484
- primaryHover: "#0284c7",
1485
- success: "#10b981",
1486
- warning: "#f59e0b",
1487
- error: "#ef4444",
1488
- info: "#06b6d4"
1489
- },
1490
- { primary: "#fffbeb", secondary: "#fef3c7", tertiary: "#fde68a", hover: "#fef3c7" },
1491
- { primary: "#0c4a6e", secondary: "#0369a1", muted: "#7dd3fc" },
1492
- "#fcd34d"
1493
- );
1494
- i(
1495
- "Winter Frost",
1496
- {
1497
- primary: "#3b82f6",
1498
- primaryHover: "#2563eb",
1499
- success: "#10b981",
1500
- warning: "#f59e0b",
1501
- error: "#ef4444",
1502
- info: "#06b6d4"
1503
- },
1504
- { primary: "#f0f9ff", secondary: "#e0f2fe", tertiary: "#bae6fd", hover: "#e0f2fe" },
1505
- { primary: "#1e3a5f", secondary: "#1e40af", muted: "#93c5fd" },
1506
- "#bfdbfe"
1507
- );
1508
- i(
1509
- "Cherry Blossom",
1510
- {
1511
- primary: "#ec4899",
1512
- primaryHover: "#db2777",
1513
- success: "#10b981",
1514
- warning: "#f59e0b",
1515
- error: "#ef4444",
1516
- info: "#06b6d4"
1517
- },
1518
- { primary: "#fdf2f8", secondary: "#fce7f3", tertiary: "#fbcfe8", hover: "#fce7f3" },
1519
- { primary: "#831843", secondary: "#9d174d", muted: "#f9a8d4" },
1520
- "#fbcfe8"
1521
- );
1522
- i(
1523
- "Harvest",
1524
- {
1525
- primary: "#b45309",
1526
- primaryHover: "#92400e",
1527
- success: "#4d7c0f",
1528
- warning: "#a16207",
1529
- error: "#b91c1c",
1530
- info: "#0e7490"
1531
- },
1532
- { primary: "#fffbeb", secondary: "#fef3c7", tertiary: "#fde68a", hover: "#fef3c7" },
1533
- { primary: "#451a03", secondary: "#78350f", muted: "#d97706" },
1534
- "#fcd34d"
1535
- );
1536
- i(
1537
- "Japanese Zen",
1538
- {
1539
- primary: "#6b7280",
1540
- primaryHover: "#4b5563",
1541
- success: "#6b8e23",
1542
- warning: "#d4a017",
1543
- error: "#c0392b",
1544
- info: "#5f9ea0"
1545
- },
1546
- { primary: "#faf9f6", secondary: "#f0ece3", tertiary: "#e6e0d4", hover: "#f0ece3" },
1547
- { primary: "#2c2c2c", secondary: "#5c5c5c", muted: "#a0998a" },
1548
- "#d5cec0"
1549
- );
1550
- i(
1551
- "Moroccan",
1552
- {
1553
- primary: "#c2410c",
1554
- primaryHover: "#9a3412",
1555
- success: "#15803d",
1556
- warning: "#ca8a04",
1557
- error: "#b91c1c",
1558
- info: "#0e7490"
1559
- },
1560
- { primary: "#fffbf0", secondary: "#fef3e0", tertiary: "#fde6c4", hover: "#fef3e0" },
1561
- { primary: "#3a1a00", secondary: "#7c2d12", muted: "#d97706" },
1562
- "#f5d0a0"
1563
- );
1564
- i(
1565
- "Scandinavian",
1566
- {
1567
- primary: "#4b5563",
1568
- primaryHover: "#374151",
1569
- success: "#059669",
1570
- warning: "#d97706",
1571
- error: "#dc2626",
1572
- info: "#0891b2"
1573
- },
1574
- { primary: "#ffffff", secondary: "#f9fafb", tertiary: "#f3f4f6", hover: "#f3f4f6" },
1575
- { primary: "#111827", secondary: "#374151", muted: "#9ca3af" },
1576
- "#e5e7eb"
1577
- );
1578
- i(
1579
- "Mediterranean",
1580
- {
1581
- primary: "#1e40af",
1582
- primaryHover: "#1e3a8a",
1583
- success: "#059669",
1584
- warning: "#d97706",
1585
- error: "#dc2626",
1586
- info: "#0891b2"
1587
- },
1588
- { primary: "#eff6ff", secondary: "#dbeafe", tertiary: "#bfdbfe", hover: "#dbeafe" },
1589
- { primary: "#1e3a5f", secondary: "#2563eb", muted: "#93c5fd" },
1590
- "#bfdbfe"
1591
- );
1592
- i(
1593
- "Chinese New Year",
1594
- {
1595
- primary: "#dc2626",
1596
- primaryHover: "#b91c1c",
1597
- success: "#16a34a",
1598
- warning: "#d4a017",
1599
- error: "#ef4444",
1600
- info: "#0891b2"
1601
- },
1602
- { primary: "#fef2f2", secondary: "#fee2e2", tertiary: "#fecaca", hover: "#fee2e2" },
1603
- { primary: "#450a0a", secondary: "#991b1b", muted: "#f87171" },
1604
- "#fca5a5"
1605
- );
1606
- i(
1607
- "Indian Festive",
1608
- {
1609
- primary: "#d97706",
1610
- primaryHover: "#b45309",
1611
- success: "#16a34a",
1612
- warning: "#ca8a04",
1613
- error: "#dc2626",
1614
- info: "#7c3aed"
1615
- },
1616
- { primary: "#fffbeb", secondary: "#fef3c7", tertiary: "#fde68a", hover: "#fef3c7" },
1617
- { primary: "#451a03", secondary: "#92400e", muted: "#f59e0b" },
1618
- "#fcd34d"
1619
- );
1620
- i(
1621
- "Brazilian Carnival",
1622
- {
1623
- primary: "#16a34a",
1624
- primaryHover: "#15803d",
1625
- success: "#22c55e",
1626
- warning: "#facc15",
1627
- error: "#ef4444",
1628
- info: "#0ea5e9"
1629
- },
1630
- { primary: "#f0fdf4", secondary: "#dcfce7", tertiary: "#bbf7d0", hover: "#dcfce7" },
1631
- { primary: "#052e16", secondary: "#166534", muted: "#4ade80" },
1632
- "#86efac"
1633
- );
1634
- i(
1635
- "African Earth",
1636
- {
1637
- primary: "#92400e",
1638
- primaryHover: "#78350f",
1639
- success: "#4d7c0f",
1640
- warning: "#a16207",
1641
- error: "#b91c1c",
1642
- info: "#0e7490"
1643
- },
1644
- { primary: "#faf5f0", secondary: "#f0e6d6", tertiary: "#e6d5bb", hover: "#f0e6d6" },
1645
- { primary: "#2b1a0e", secondary: "#5c3d1e", muted: "#a08060" },
1646
- "#d4b896"
1647
- );
1648
- m(
1649
- "High Contrast Dark",
1650
- {
1651
- primary: "#ffff00",
1652
- primaryHover: "#cccc00",
1653
- success: "#00ff00",
1654
- warning: "#ff8c00",
1655
- error: "#ff0000",
1656
- info: "#00ffff"
1657
- },
1658
- { primary: "#000000", secondary: "#1a1a1a", tertiary: "#333333", hover: "#333333" },
1659
- { primary: "#ffffff", secondary: "#ffffff", muted: "#cccccc" },
1660
- "#ffffff"
1661
- );
1662
- i(
1663
- "Monochrome",
1664
- {
1665
- primary: "#404040",
1666
- primaryHover: "#262626",
1667
- success: "#4d7c0f",
1668
- warning: "#a16207",
1669
- error: "#b91c1c",
1670
- info: "#0e7490"
1671
- },
1672
- { primary: "#fafafa", secondary: "#f0f0f0", tertiary: "#e0e0e0", hover: "#e0e0e0" },
1673
- { primary: "#1a1a1a", secondary: "#404040", muted: "#808080" },
1674
- "#c0c0c0"
1675
- );
1676
- i(
1677
- "Enhanced Contrast",
1678
- {
1679
- primary: "#0050b3",
1680
- primaryHover: "#003d8c",
1681
- success: "#006400",
1682
- warning: "#cc7000",
1683
- error: "#cc0000",
1684
- info: "#006680"
1685
- },
1686
- { primary: "#ffffff", secondary: "#f5f5f5", tertiary: "#ebebeb", hover: "#ebebeb" },
1687
- { primary: "#000000", secondary: "#1a1a1a", muted: "#595959" },
1688
- "#8c8c8c"
1689
- );
1690
- i(
1691
- "Minimalist",
1692
- {
1693
- primary: "#18181b",
1694
- primaryHover: "#27272a",
1695
- success: "#22c55e",
1696
- warning: "#eab308",
1697
- error: "#ef4444",
1698
- info: "#3b82f6"
1699
- },
1700
- { primary: "#ffffff", secondary: "#fafafa", tertiary: "#f5f5f5", hover: "#f5f5f5" },
1701
- { primary: "#0a0a0a", secondary: "#404040", muted: "#a3a3a3" },
1702
- "#e5e5e5"
1703
- );
1704
- m(
1705
- "Warm Dark",
1706
- {
1707
- primary: "#f59e0b",
1708
- primaryHover: "#d97706",
1709
- success: "#10b981",
1710
- warning: "#fbbf24",
1711
- error: "#f87171",
1712
- info: "#38bdf8"
1713
- },
1714
- { primary: "#1c1917", secondary: "#292524", tertiary: "#44403c", hover: "#44403c" },
1715
- { primary: "#fafaf9", secondary: "#d6d3d1", muted: "#78716c" },
1716
- "#57534e"
1717
- );
1718
- m(
1719
- "Soft Dark",
1720
- {
1721
- primary: "#a78bfa",
1722
- primaryHover: "#8b5cf6",
1723
- success: "#34d399",
1724
- warning: "#fcd34d",
1725
- error: "#fb7185",
1726
- info: "#67e8f9"
1727
- },
1728
- { primary: "#1e1e2e", secondary: "#262637", tertiary: "#313147", hover: "#313147" },
1729
- { primary: "#e8e8f0", secondary: "#a0a0b8", muted: "#5c5c74" },
1730
- "#3e3e58"
1731
- );
1732
- i(
1733
- "Coffee",
1734
- {
1735
- primary: "#6f4e37",
1736
- primaryHover: "#5c3d28",
1737
- success: "#4d7c0f",
1738
- warning: "#a16207",
1739
- error: "#b91c1c",
1740
- info: "#0e7490"
1741
- },
1742
- { primary: "#faf6f1", secondary: "#f0e8dc", tertiary: "#e6d8c6", hover: "#f0e8dc" },
1743
- { primary: "#2c1a0e", secondary: "#5c3d28", muted: "#a08868" },
1744
- "#d4c4a8"
1745
- );
1746
- i(
1747
- "Wine",
1748
- {
1749
- primary: "#7f1d1d",
1750
- primaryHover: "#641717",
1751
- success: "#059669",
1752
- warning: "#d97706",
1753
- error: "#dc2626",
1754
- info: "#0891b2"
1755
- },
1756
- { primary: "#fef2f2", secondary: "#fde8e8", tertiary: "#f8d0d0", hover: "#fde8e8" },
1757
- { primary: "#3b0a0a", secondary: "#7f1d1d", muted: "#dc6868" },
1758
- "#e8a0a0"
1759
- );
1760
- b(null);
1761
- const _e = [
1762
- {
1763
- target: ".nice-etl-builder",
1764
- titleKey: "tutorial.etlBuilder.intro.title",
1765
- title: "ETL builder",
1766
- contentKey: "tutorial.etlBuilder.intro.content",
1767
- content: "Wire sources → transformations → destinations into a pipeline, switch the views, then run it and save the configuration.",
1768
- placement: "auto"
1769
- }
1770
- ], xe = {
1771
- id: "",
1772
- name: "New Pipeline",
1773
- sources: [],
1774
- transformations: [],
1775
- destinations: [],
1776
- version: 1
1777
- }, P = [
1778
- { type: "filter", label: "Filter", icon: "🔍" },
1779
- { type: "map", label: "Map", icon: "🔄" },
1780
- { type: "aggregate", label: "Aggregate", icon: "∑" },
1781
- { type: "join", label: "Join", icon: "🔗" },
1782
- { type: "union", label: "Union", icon: "∪" },
1783
- { type: "sort", label: "Sort", icon: "↕️" },
1784
- { type: "deduplicate", label: "Deduplicate", icon: "🔲" },
1785
- { type: "pivot", label: "Pivot", icon: "⤢" },
1786
- { type: "unpivot", label: "Unpivot", icon: "⤡" },
1787
- { type: "split", label: "Split", icon: "✂️" },
1788
- { type: "merge", label: "Merge", icon: "🔀" },
1789
- { type: "lookup", label: "Lookup", icon: "📖" },
1790
- { type: "derive", label: "Derive Column", icon: "➕" },
1791
- { type: "validate", label: "Validate", icon: "✓" },
1792
- { type: "cleanse", label: "Cleanse", icon: "🧹" },
1793
- { type: "custom", label: "Custom", icon: "ƒ" }
1794
- ];
1795
- function De({
1796
- pipeline: a,
1797
- dataSources: r = [],
1798
- onChange: c,
1799
- onRun: t,
1800
- onSchedule: y,
1801
- className: u = "",
1802
- tutorial: o
1803
- }) {
1804
- const [p, S] = w(
1805
- a || { ...xe, id: crypto.randomUUID() }
1806
- ), [f, v] = w(null), [_, C] = w("design"), [T, k] = w(!1), [J, G] = w([]), [D, E] = w(null), Y = ie(null), h = x(
1807
- (n) => {
1808
- S((s) => {
1809
- const l = n(s);
1810
- return c == null || c(l), l;
1811
- });
1812
- },
1813
- [c]
1814
- ), I = x(
1815
- (n) => {
1816
- var l;
1817
- const s = {
1818
- id: crypto.randomUUID(),
1819
- type: n.type,
1820
- name: n.name,
1821
- config: n.config,
1822
- schema: (l = n.schema) == null ? void 0 : l.tables[0]
1823
- };
1824
- h((g) => ({
1825
- ...g,
1826
- sources: [...g.sources, s]
1827
- }));
1828
- },
1829
- [h]
1830
- ), z = x(
1831
- (n, s) => {
1832
- var g;
1833
- const l = {
1834
- id: crypto.randomUUID(),
1835
- type: n,
1836
- name: ((g = P.find((R) => R.type === n)) == null ? void 0 : g.label) || n,
1837
- input: [],
1838
- output: crypto.randomUUID(),
1839
- config: He(n)
1840
- };
1841
- h((R) => ({
1842
- ...R,
1843
- transformations: [...R.transformations, l]
1844
- })), v({ type: "transformation", id: l.id });
1845
- },
1846
- [h]
1847
- ), X = x(() => {
1848
- const n = {
1849
- id: crypto.randomUUID(),
1850
- type: "database",
1851
- name: "New Destination",
1852
- config: {},
1853
- writeMode: "append"
1854
- };
1855
- h((s) => ({
1856
- ...s,
1857
- destinations: [...s.destinations, n]
1858
- })), v({ type: "destination", id: n.id });
1859
- }, [h]), A = x(
1860
- (n, s) => {
1861
- h((l) => {
1862
- switch (n) {
1863
- case "source":
1864
- return { ...l, sources: l.sources.filter((g) => g.id !== s) };
1865
- case "transformation":
1866
- return {
1867
- ...l,
1868
- transformations: l.transformations.filter((g) => g.id !== s)
1869
- };
1870
- case "destination":
1871
- return { ...l, destinations: l.destinations.filter((g) => g.id !== s) };
1872
- default:
1873
- return l;
1874
- }
1875
- }), v(null);
1876
- },
1877
- [h]
1878
- ), Z = x(async () => {
1879
- if (t) {
1880
- k(!0);
1881
- try {
1882
- const n = await t(p);
1883
- G((s) => [n, ...s].slice(0, 50));
1884
- } finally {
1885
- k(!1);
1886
- }
1887
- }
1888
- }, [p, t]), q = x(
1889
- (n) => {
1890
- h((s) => ({ ...s, schedule: n })), y == null || y(p, n);
1891
- },
1892
- [p, h, y]
1893
- ), Q = x(
1894
- (n) => {
1895
- if (n.preventDefault(), !!D) {
1896
- if (D.startsWith("transform:")) {
1897
- const s = D.replace("transform:", "");
1898
- z(s);
1899
- }
1900
- E(null);
1901
- }
1902
- },
1903
- [D, z]
1904
- ), ee = () => {
1905
- if (!f)
1906
- return null;
1907
- switch (f.type) {
1908
- case "source":
1909
- return p.sources.find((n) => n.id === f.id);
1910
- case "transformation":
1911
- return p.transformations.find((n) => n.id === f.id);
1912
- case "destination":
1913
- return p.destinations.find((n) => n.id === f.id);
1914
- default:
1915
- return null;
1916
- }
1917
- };
1918
- return /* @__PURE__ */ d("div", { className: `nice-etl-builder ${u}`, children: [
1919
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__toolbar", children: [
1920
- /* @__PURE__ */ e(
1921
- "input",
1922
- {
1923
- type: "text",
1924
- value: p.name,
1925
- onChange: (n) => h((s) => ({ ...s, name: n.target.value })),
1926
- className: "nice-etl-builder__name-input"
1927
- }
1928
- ),
1929
- /* @__PURE__ */ e("div", { className: "nice-etl-builder__tabs", children: ["design", "code", "schedule", "history"].map((n) => /* @__PURE__ */ e(
1930
- "button",
1931
- {
1932
- className: `nice-etl-builder__tab ${_ === n ? "nice-etl-builder__tab--active" : ""}`,
1933
- onClick: () => C(n),
1934
- children: n.charAt(0).toUpperCase() + n.slice(1)
1935
- },
1936
- n
1937
- )) }),
1938
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__actions", children: [
1939
- /* @__PURE__ */ e("button", { onClick: Z, disabled: T, className: "nice-etl-builder__run-btn", children: T ? "⏳ Running..." : "▶ Run" }),
1940
- /* @__PURE__ */ e("button", { className: "nice-etl-builder__save-btn", children: "💾 Save" }),
1941
- /* @__PURE__ */ e(he, { steps: be(o, _e) })
1942
- ] })
1943
- ] }),
1944
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__main", children: [
1945
- _ === "design" && /* @__PURE__ */ d("div", { className: "nice-etl-builder__palette", children: [
1946
- /* @__PURE__ */ e("h4", { children: "Sources" }),
1947
- r.map((n) => /* @__PURE__ */ d(
1948
- "div",
1949
- {
1950
- className: "nice-etl-builder__palette-item",
1951
- onClick: () => I(n),
1952
- children: [
1953
- /* @__PURE__ */ e("span", { className: "nice-etl-builder__palette-icon", children: "🗄️" }),
1954
- /* @__PURE__ */ e("span", { children: n.name })
1955
- ]
1956
- },
1957
- n.id
1958
- )),
1959
- /* @__PURE__ */ e(
1960
- "button",
1961
- {
1962
- onClick: () => I({ id: "", name: "New Source", type: "database", config: {} }),
1963
- children: "+ Add Source"
1964
- }
1965
- ),
1966
- /* @__PURE__ */ e("h4", { children: "Transformations" }),
1967
- P.map((n) => /* @__PURE__ */ d(
1968
- "div",
1969
- {
1970
- className: "nice-etl-builder__palette-item",
1971
- draggable: !0,
1972
- onDragStart: () => E(`transform:${n.type}`),
1973
- onDragEnd: () => E(null),
1974
- children: [
1975
- /* @__PURE__ */ e("span", { className: "nice-etl-builder__palette-icon", children: n.icon }),
1976
- /* @__PURE__ */ e("span", { children: n.label })
1977
- ]
1978
- },
1979
- n.type
1980
- )),
1981
- /* @__PURE__ */ e("h4", { children: "Destinations" }),
1982
- /* @__PURE__ */ e("button", { onClick: X, children: "+ Add Destination" })
1983
- ] }),
1984
- _ === "design" && /* @__PURE__ */ e(
1985
- "div",
1986
- {
1987
- ref: Y,
1988
- className: "nice-etl-builder__canvas",
1989
- onDragOver: (n) => n.preventDefault(),
1990
- onDrop: Q,
1991
- onClick: () => v(null),
1992
- children: /* @__PURE__ */ d("div", { className: "nice-etl-builder__flow", children: [
1993
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__column", children: [
1994
- /* @__PURE__ */ e("h5", { children: "Sources" }),
1995
- p.sources.map((n) => /* @__PURE__ */ e(
1996
- L,
1997
- {
1998
- node: n,
1999
- nodeType: "source",
2000
- icon: "🗄️",
2001
- isSelected: (f == null ? void 0 : f.id) === n.id,
2002
- onSelect: () => v({ type: "source", id: n.id }),
2003
- onDelete: () => A("source", n.id)
2004
- },
2005
- n.id
2006
- ))
2007
- ] }),
2008
- /* @__PURE__ */ e("div", { className: "nice-etl-builder__arrow", children: "→" }),
2009
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__column nice-etl-builder__column--transforms", children: [
2010
- /* @__PURE__ */ e("h5", { children: "Transformations" }),
2011
- p.transformations.map((n) => {
2012
- const s = P.find((l) => l.type === n.type);
2013
- return /* @__PURE__ */ e(
2014
- L,
2015
- {
2016
- node: n,
2017
- nodeType: "transformation",
2018
- icon: (s == null ? void 0 : s.icon) || "🔄",
2019
- isSelected: (f == null ? void 0 : f.id) === n.id,
2020
- onSelect: () => v({ type: "transformation", id: n.id }),
2021
- onDelete: () => A("transformation", n.id)
2022
- },
2023
- n.id
2024
- );
2025
- }),
2026
- p.transformations.length === 0 && /* @__PURE__ */ e("div", { className: "nice-etl-builder__empty-column", children: "Drag transformations here" })
2027
- ] }),
2028
- /* @__PURE__ */ e("div", { className: "nice-etl-builder__arrow", children: "→" }),
2029
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__column", children: [
2030
- /* @__PURE__ */ e("h5", { children: "Destinations" }),
2031
- p.destinations.map((n) => /* @__PURE__ */ e(
2032
- L,
2033
- {
2034
- node: n,
2035
- nodeType: "destination",
2036
- icon: "📥",
2037
- isSelected: (f == null ? void 0 : f.id) === n.id,
2038
- onSelect: () => v({ type: "destination", id: n.id }),
2039
- onDelete: () => A("destination", n.id)
2040
- },
2041
- n.id
2042
- ))
2043
- ] })
2044
- ] })
2045
- }
2046
- ),
2047
- _ === "code" && /* @__PURE__ */ e("div", { className: "nice-etl-builder__code-view", children: /* @__PURE__ */ e("pre", { children: JSON.stringify(p, null, 2) }) }),
2048
- _ === "schedule" && /* @__PURE__ */ e(
2049
- Se,
2050
- {
2051
- schedule: p.schedule,
2052
- monitoring: p.monitoring,
2053
- onChange: q
2054
- }
2055
- ),
2056
- _ === "history" && /* @__PURE__ */ e(Ce, { runs: J }),
2057
- f && _ === "design" && /* @__PURE__ */ e(
2058
- Ne,
2059
- {
2060
- nodeType: f.type,
2061
- node: ee() ?? null,
2062
- dataSources: r,
2063
- onChange: (n) => {
2064
- h((s) => {
2065
- switch (f.type) {
2066
- case "source":
2067
- return {
2068
- ...s,
2069
- sources: s.sources.map(
2070
- (l) => l.id === f.id ? { ...l, ...n } : l
2071
- )
2072
- };
2073
- case "transformation":
2074
- return {
2075
- ...s,
2076
- transformations: s.transformations.map(
2077
- (l) => l.id === f.id ? { ...l, ...n } : l
2078
- )
2079
- };
2080
- case "destination":
2081
- return {
2082
- ...s,
2083
- destinations: s.destinations.map(
2084
- (l) => l.id === f.id ? { ...l, ...n } : l
2085
- )
2086
- };
2087
- default:
2088
- return s;
2089
- }
2090
- });
2091
- },
2092
- onClose: () => v(null)
2093
- }
2094
- )
2095
- ] })
2096
- ] });
2097
- }
2098
- function He(a) {
2099
- switch (a) {
2100
- case "filter":
2101
- return { condition: "" };
2102
- case "map":
2103
- return { mappings: [] };
2104
- case "aggregate":
2105
- return { groupBy: [], aggregations: [] };
2106
- case "join":
2107
- return { joinType: "inner", leftKey: "", rightKey: "" };
2108
- case "union":
2109
- return { inputs: [] };
2110
- case "sort":
2111
- return { columns: [], directions: [] };
2112
- case "deduplicate":
2113
- return { columns: [], keepFirst: !0 };
2114
- case "pivot":
2115
- return { pivotColumn: "", valueColumn: "", aggregation: "sum" };
2116
- case "unpivot":
2117
- return { columns: [], nameColumn: "name", valueColumn: "value" };
2118
- case "derive":
2119
- return { name: "", expression: "" };
2120
- case "validate":
2121
- return { rules: [] };
2122
- case "cleanse":
2123
- return { operations: [] };
2124
- case "custom":
2125
- return { code: `// Custom transformation
2126
- return data;` };
2127
- default:
2128
- return {};
2129
- }
2130
- }
2131
- function L({
2132
- node: a,
2133
- nodeType: r,
2134
- icon: c,
2135
- isSelected: t,
2136
- onSelect: y,
2137
- onDelete: u
2138
- }) {
2139
- return /* @__PURE__ */ d(
2140
- "div",
2141
- {
2142
- className: `nice-etl-builder__node nice-etl-builder__node--${r} ${t ? "nice-etl-builder__node--selected" : ""}`,
2143
- onClick: (o) => {
2144
- o.stopPropagation(), y();
2145
- },
2146
- children: [
2147
- /* @__PURE__ */ e("span", { className: "nice-etl-builder__node-icon", children: c }),
2148
- /* @__PURE__ */ e("span", { className: "nice-etl-builder__node-name", children: a.name }),
2149
- /* @__PURE__ */ e(
2150
- "button",
2151
- {
2152
- className: "nice-etl-builder__node-delete",
2153
- onClick: (o) => {
2154
- o.stopPropagation(), u();
2155
- },
2156
- children: "×"
2157
- }
2158
- )
2159
- ]
2160
- }
2161
- );
2162
- }
2163
- function Ne({
2164
- nodeType: a,
2165
- node: r,
2166
- dataSources: c,
2167
- onChange: t,
2168
- onClose: y
2169
- }) {
2170
- var u;
2171
- return r ? /* @__PURE__ */ d("div", { className: "nice-etl-builder__properties", children: [
2172
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__properties-header", children: [
2173
- /* @__PURE__ */ d("h4", { children: [
2174
- a.charAt(0).toUpperCase() + a.slice(1),
2175
- " Properties"
2176
- ] }),
2177
- /* @__PURE__ */ e("button", { onClick: y, children: "×" })
2178
- ] }),
2179
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__properties-content", children: [
2180
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__field", children: [
2181
- /* @__PURE__ */ e("label", { children: "Name" }),
2182
- /* @__PURE__ */ e(
2183
- "input",
2184
- {
2185
- type: "text",
2186
- value: r.name,
2187
- onChange: (o) => t({ name: o.target.value })
2188
- }
2189
- )
2190
- ] }),
2191
- a === "source" && /* @__PURE__ */ d(N, { children: [
2192
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__field", children: [
2193
- /* @__PURE__ */ e("label", { children: "Type" }),
2194
- /* @__PURE__ */ d(
2195
- "select",
2196
- {
2197
- value: r.type,
2198
- onChange: (o) => t({ type: o.target.value }),
2199
- children: [
2200
- /* @__PURE__ */ e("option", { value: "database", children: "Database" }),
2201
- /* @__PURE__ */ e("option", { value: "api", children: "API" }),
2202
- /* @__PURE__ */ e("option", { value: "file", children: "File" }),
2203
- /* @__PURE__ */ e("option", { value: "stream", children: "Stream" })
2204
- ]
2205
- }
2206
- )
2207
- ] }),
2208
- /* @__PURE__ */ e("div", { className: "nice-etl-builder__field", children: /* @__PURE__ */ d("label", { children: [
2209
- /* @__PURE__ */ e(
2210
- "input",
2211
- {
2212
- type: "checkbox",
2213
- checked: ((u = r.incremental) == null ? void 0 : u.enabled) || !1,
2214
- onChange: (o) => {
2215
- var p;
2216
- return t({
2217
- incremental: {
2218
- ...r.incremental,
2219
- enabled: o.target.checked,
2220
- column: ((p = r.incremental) == null ? void 0 : p.column) || ""
2221
- }
2222
- });
2223
- }
2224
- }
2225
- ),
2226
- "Incremental Load"
2227
- ] }) })
2228
- ] }),
2229
- a === "transformation" && /* @__PURE__ */ d(N, { children: [
2230
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__field", children: [
2231
- /* @__PURE__ */ e("label", { children: "Type" }),
2232
- /* @__PURE__ */ e("span", { children: r.type })
2233
- ] }),
2234
- r.type === "filter" && /* @__PURE__ */ d("div", { className: "nice-etl-builder__field", children: [
2235
- /* @__PURE__ */ e("label", { children: "Condition" }),
2236
- /* @__PURE__ */ e(
2237
- "textarea",
2238
- {
2239
- value: String(r.config.condition || ""),
2240
- onChange: (o) => t({
2241
- config: { ...r.config, condition: o.target.value }
2242
- }),
2243
- placeholder: "e.g., age > 18 AND status = 'active'",
2244
- rows: 3
2245
- }
2246
- )
2247
- ] }),
2248
- r.type === "derive" && /* @__PURE__ */ d(N, { children: [
2249
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__field", children: [
2250
- /* @__PURE__ */ e("label", { children: "Column Name" }),
2251
- /* @__PURE__ */ e(
2252
- "input",
2253
- {
2254
- type: "text",
2255
- value: String(r.config.name || ""),
2256
- onChange: (o) => t({
2257
- config: { ...r.config, name: o.target.value }
2258
- })
2259
- }
2260
- )
2261
- ] }),
2262
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__field", children: [
2263
- /* @__PURE__ */ e("label", { children: "Expression" }),
2264
- /* @__PURE__ */ e(
2265
- "input",
2266
- {
2267
- type: "text",
2268
- value: String(r.config.expression || ""),
2269
- onChange: (o) => t({
2270
- config: {
2271
- ...r.config,
2272
- expression: o.target.value
2273
- }
2274
- }),
2275
- placeholder: "e.g., price * quantity"
2276
- }
2277
- )
2278
- ] })
2279
- ] }),
2280
- r.type === "custom" && /* @__PURE__ */ d("div", { className: "nice-etl-builder__field", children: [
2281
- /* @__PURE__ */ e("label", { children: "Code" }),
2282
- /* @__PURE__ */ e(
2283
- "textarea",
2284
- {
2285
- value: String(r.config.code || ""),
2286
- onChange: (o) => t({
2287
- config: { ...r.config, code: o.target.value }
2288
- }),
2289
- rows: 10,
2290
- className: "nice-etl-builder__code-input"
2291
- }
2292
- )
2293
- ] })
2294
- ] }),
2295
- a === "destination" && /* @__PURE__ */ d(N, { children: [
2296
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__field", children: [
2297
- /* @__PURE__ */ e("label", { children: "Type" }),
2298
- /* @__PURE__ */ d(
2299
- "select",
2300
- {
2301
- value: r.type,
2302
- onChange: (o) => t({ type: o.target.value }),
2303
- children: [
2304
- /* @__PURE__ */ e("option", { value: "database", children: "Database" }),
2305
- /* @__PURE__ */ e("option", { value: "file", children: "File" }),
2306
- /* @__PURE__ */ e("option", { value: "api", children: "API" }),
2307
- /* @__PURE__ */ e("option", { value: "warehouse", children: "Data Warehouse" })
2308
- ]
2309
- }
2310
- )
2311
- ] }),
2312
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__field", children: [
2313
- /* @__PURE__ */ e("label", { children: "Write Mode" }),
2314
- /* @__PURE__ */ d(
2315
- "select",
2316
- {
2317
- value: r.writeMode,
2318
- onChange: (o) => t({ writeMode: o.target.value }),
2319
- children: [
2320
- /* @__PURE__ */ e("option", { value: "append", children: "Append" }),
2321
- /* @__PURE__ */ e("option", { value: "overwrite", children: "Overwrite" }),
2322
- /* @__PURE__ */ e("option", { value: "upsert", children: "Upsert" }),
2323
- /* @__PURE__ */ e("option", { value: "merge", children: "Merge" })
2324
- ]
2325
- }
2326
- )
2327
- ] })
2328
- ] })
2329
- ] })
2330
- ] }) : /* @__PURE__ */ e(N, {});
2331
- }
2332
- function Se({
2333
- schedule: a,
2334
- monitoring: r,
2335
- onChange: c
2336
- }) {
2337
- const [t, y] = w(a || { enabled: !1 });
2338
- return /* @__PURE__ */ d("div", { className: "nice-etl-builder__schedule-editor", children: [
2339
- /* @__PURE__ */ e("h4", { children: "Schedule Configuration" }),
2340
- /* @__PURE__ */ e("div", { className: "nice-etl-builder__field", children: /* @__PURE__ */ d("label", { children: [
2341
- /* @__PURE__ */ e(
2342
- "input",
2343
- {
2344
- type: "checkbox",
2345
- checked: t.enabled,
2346
- onChange: (u) => {
2347
- const o = { ...t, enabled: u.target.checked };
2348
- y(o), c(o);
2349
- }
2350
- }
2351
- ),
2352
- "Enable scheduled execution"
2353
- ] }) }),
2354
- t.enabled && /* @__PURE__ */ d(N, { children: [
2355
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__field", children: [
2356
- /* @__PURE__ */ e("label", { children: "Cron Expression" }),
2357
- /* @__PURE__ */ e(
2358
- "input",
2359
- {
2360
- type: "text",
2361
- value: t.cron || "",
2362
- onChange: (u) => {
2363
- const o = { ...t, cron: u.target.value };
2364
- y(o);
2365
- },
2366
- placeholder: "0 0 * * * (every hour)"
2367
- }
2368
- ),
2369
- /* @__PURE__ */ e("small", { children: "Format: minute hour day month weekday" })
2370
- ] }),
2371
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__field", children: [
2372
- /* @__PURE__ */ e("label", { children: "Timezone" }),
2373
- /* @__PURE__ */ d(
2374
- "select",
2375
- {
2376
- value: t.timezone || "UTC",
2377
- onChange: (u) => {
2378
- const o = { ...t, timezone: u.target.value };
2379
- y(o);
2380
- },
2381
- children: [
2382
- /* @__PURE__ */ e("option", { value: "UTC", children: "UTC" }),
2383
- /* @__PURE__ */ e("option", { value: "America/New_York", children: "Eastern Time" }),
2384
- /* @__PURE__ */ e("option", { value: "America/Chicago", children: "Central Time" }),
2385
- /* @__PURE__ */ e("option", { value: "America/Los_Angeles", children: "Pacific Time" }),
2386
- /* @__PURE__ */ e("option", { value: "Europe/London", children: "London" }),
2387
- /* @__PURE__ */ e("option", { value: "Europe/Warsaw", children: "Warsaw" })
2388
- ]
2389
- }
2390
- )
2391
- ] }),
2392
- /* @__PURE__ */ e("button", { onClick: () => c(t), children: "Save Schedule" })
2393
- ] }),
2394
- /* @__PURE__ */ e("h4", { children: "Monitoring" }),
2395
- /* @__PURE__ */ e("div", { className: "nice-etl-builder__field", children: /* @__PURE__ */ d("label", { children: [
2396
- /* @__PURE__ */ e("input", { type: "checkbox", checked: (r == null ? void 0 : r.alertOnFailure) || !1, disabled: !0 }),
2397
- "Alert on failure"
2398
- ] }) }),
2399
- /* @__PURE__ */ d("div", { className: "nice-etl-builder__field", children: [
2400
- /* @__PURE__ */ e("label", { children: "Log Level" }),
2401
- /* @__PURE__ */ d("select", { value: (r == null ? void 0 : r.logLevel) || "info", disabled: !0, children: [
2402
- /* @__PURE__ */ e("option", { value: "error", children: "Error" }),
2403
- /* @__PURE__ */ e("option", { value: "warn", children: "Warning" }),
2404
- /* @__PURE__ */ e("option", { value: "info", children: "Info" }),
2405
- /* @__PURE__ */ e("option", { value: "debug", children: "Debug" })
2406
- ] })
2407
- ] })
2408
- ] });
2409
- }
2410
- function Ce({ runs: a }) {
2411
- return /* @__PURE__ */ d("div", { className: "nice-etl-builder__history-view", children: [
2412
- /* @__PURE__ */ e("h4", { children: "Run History" }),
2413
- a.length === 0 ? /* @__PURE__ */ e("div", { className: "nice-etl-builder__no-history", children: "No runs yet" }) : /* @__PURE__ */ d("table", { className: "nice-etl-builder__history-table", children: [
2414
- /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ d("tr", { children: [
2415
- /* @__PURE__ */ e("th", { children: "Status" }),
2416
- /* @__PURE__ */ e("th", { children: "Start Time" }),
2417
- /* @__PURE__ */ e("th", { children: "Duration" }),
2418
- /* @__PURE__ */ e("th", { children: "Rows" }),
2419
- /* @__PURE__ */ e("th", { children: "Errors" })
2420
- ] }) }),
2421
- /* @__PURE__ */ e("tbody", { children: a.map((r) => /* @__PURE__ */ d(
2422
- "tr",
2423
- {
2424
- className: `nice-etl-builder__run nice-etl-builder__run--${r.status}`,
2425
- children: [
2426
- /* @__PURE__ */ e("td", { children: /* @__PURE__ */ d(
2427
- "span",
2428
- {
2429
- className: `nice-etl-builder__status nice-etl-builder__status--${r.status}`,
2430
- children: [
2431
- r.status === "success" ? "✓" : r.status === "failed" ? "✗" : "⏳",
2432
- r.status
2433
- ]
2434
- }
2435
- ) }),
2436
- /* @__PURE__ */ e("td", { children: r.startTime.toLocaleString() }),
2437
- /* @__PURE__ */ e("td", { children: r.endTime ? `${Math.round((r.endTime.getTime() - r.startTime.getTime()) / 1e3)}s` : "-" }),
2438
- /* @__PURE__ */ d("td", { children: [
2439
- r.rowsProcessed.toLocaleString(),
2440
- " / ",
2441
- r.rowsWritten.toLocaleString()
2442
- ] }),
2443
- /* @__PURE__ */ e("td", { children: r.errors.length })
2444
- ]
2445
- },
2446
- r.id
2447
- )) })
2448
- ] })
2449
- ] });
2450
- }
1
+ import { N as i } from "./index-C5HkRuCY.js";
2451
2
  export {
2452
- De as NiceETLBuilder
3
+ i as NiceETLBuilder
2453
4
  };