ixia-ui-react 1.6.0 → 1.8.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 (11) hide show
  1. package/dist/index.d.ts +5512 -1987
  2. package/dist/index.js +8493 -1599
  3. package/dist/index.js.map +1 -1
  4. package/dist/styles.css +102 -25
  5. package/dist/themes/hogarth.css +0 -4
  6. package/dist/themes/mabel.css +0 -4
  7. package/dist/themes/maculata.css +0 -4
  8. package/dist/themes/monadelpha.css +0 -4
  9. package/dist/themes/venus.css +0 -4
  10. package/dist/themes/viridiflora.css +0 -4
  11. package/package.json +32 -19
package/dist/styles.css CHANGED
@@ -5,13 +5,45 @@
5
5
  @import '@daypicker/react/style.css';
6
6
  @source ".";
7
7
 
8
+ @layer components {
9
+ :is([data-slot='table-layout'], [data-slot='table-top-bar'], [data-slot='table-bottom-bar']) {
10
+ gap: var(--spacing-md);
11
+ }
12
+
13
+ [data-slot='table-toolbar'] {
14
+ gap: var(--spacing-2xs);
15
+ }
16
+
17
+ [data-slot='table-container'][data-variant='outline']
18
+ > :is(
19
+ [data-slot='table-top-bar'],
20
+ [data-slot='table-toolbar'],
21
+ [data-slot='table-bottom-bar']
22
+ ) {
23
+ padding-inline: var(--spacing-md);
24
+
25
+ &:first-child {
26
+ padding-top: var(--spacing-md);
27
+ }
28
+
29
+ &:last-child {
30
+ padding-bottom: var(--spacing-md);
31
+ }
32
+ }
33
+
34
+ [data-slot='table-container'][data-variant='outline']
35
+ > :not(:is([data-slot='table-dataset-tab'], [data-slot='table-top-bar']))
36
+ + [data-slot='table-viewport'] {
37
+ border-top: 1px solid var(--color-border);
38
+ }
39
+ }
40
+
8
41
  @theme static {
9
42
  --color-*: initial;
10
43
  --color-white: var(--ixia-white);
11
44
  --color-black: var(--ixia-black);
12
45
  --color-brand-default: var(--ixia-brand-default);
13
46
  --color-brand-muted: var(--ixia-brand-muted);
14
- --color-brand-subtle: var(--ixia-brand-subtle);
15
47
  --color-brand-on-default: var(--ixia-brand-on-default);
16
48
  --color-brand-container: var(--ixia-brand-container);
17
49
  --color-brand-container-low: var(--ixia-brand-container-low);
@@ -23,7 +55,6 @@
23
55
  --color-brand-shadow: var(--ixia-brand-shadow);
24
56
  --color-accent-default: var(--ixia-accent-default);
25
57
  --color-accent-muted: var(--ixia-accent-muted);
26
- --color-accent-subtle: var(--ixia-accent-subtle);
27
58
  --color-accent-on-default: var(--ixia-accent-on-default);
28
59
  --color-accent-container: var(--ixia-accent-container);
29
60
  --color-accent-container-low: var(--ixia-accent-container-low);
@@ -35,19 +66,17 @@
35
66
  --color-accent-shadow: var(--ixia-accent-shadow);
36
67
  --color-neutral-default: var(--ixia-neutral-default);
37
68
  --color-neutral-muted: var(--ixia-neutral-muted);
38
- --color-neutral-subtle: var(--ixia-neutral-subtle);
39
69
  --color-neutral-on-default: var(--ixia-neutral-on-default);
40
70
  --color-neutral-container: var(--ixia-neutral-container);
41
71
  --color-neutral-container-high: var(--ixia-neutral-container-high);
42
72
  --color-neutral-container-low: var(--ixia-neutral-container-low);
43
73
  --color-neutral-on-container: var(--ixia-neutral-on-container);
44
74
  --color-neutral-on-container-muted: var(--ixia-neutral-on-container-muted);
45
- --color-neutral-border: var(--ixia-neutral-border);
75
+ --color-neutral-border: var(--color-border);
46
76
  --color-neutral-border-strong: var(--ixia-neutral-border-strong);
47
77
  --color-neutral-shadow: var(--ixia-neutral-shadow);
48
78
  --color-error-default: var(--ixia-error-default);
49
79
  --color-error-muted: var(--ixia-error-muted);
50
- --color-error-subtle: var(--ixia-error-subtle);
51
80
  --color-error-on-default: var(--ixia-error-on-default);
52
81
  --color-error-container-low: var(--ixia-error-container-low);
53
82
  --color-error-container: var(--ixia-error-container);
@@ -59,7 +88,6 @@
59
88
  --color-error-shadow: var(--ixia-error-shadow);
60
89
  --color-info-default: var(--ixia-info-default);
61
90
  --color-info-muted: var(--ixia-info-muted);
62
- --color-info-subtle: var(--ixia-info-subtle);
63
91
  --color-info-on-default: var(--ixia-info-on-default);
64
92
  --color-info-container: var(--ixia-info-container);
65
93
  --color-info-container-low: var(--ixia-info-container-low);
@@ -71,7 +99,6 @@
71
99
  --color-info-shadow: var(--ixia-info-shadow);
72
100
  --color-success-default: var(--ixia-success-default);
73
101
  --color-success-muted: var(--ixia-success-muted);
74
- --color-success-subtle: var(--ixia-success-subtle);
75
102
  --color-success-on-default: var(--ixia-success-on-default);
76
103
  --color-success-container: var(--ixia-success-container);
77
104
  --color-success-container-low: var(--ixia-success-container-low);
@@ -83,7 +110,6 @@
83
110
  --color-success-shadow: var(--ixia-success-shadow);
84
111
  --color-warning-default: var(--ixia-warning-default);
85
112
  --color-warning-muted: var(--ixia-warning-muted);
86
- --color-warning-subtle: var(--ixia-warning-subtle);
87
113
  --color-warning-on-default: var(--ixia-warning-on-default);
88
114
  --color-warning-container: var(--ixia-warning-container);
89
115
  --color-warning-container-low: var(--ixia-warning-container-low);
@@ -192,11 +218,60 @@
192
218
  --radius-3xl: var(--ixia-radius-3xl);
193
219
  --radius-4xl: var(--ixia-radius-4xl);
194
220
  --radius-full: var(--ixia-radius-full);
221
+
195
222
  --ease-out-bounce: cubic-bezier(0.22, 1.61, 0.57, 1);
223
+ --animate-appear: appear 0.3s ease-in-out both;
224
+ --animate-pan: pan 20s linear infinite;
225
+ --animate-slide-in-left: slide-in-left 0.3s ease-out;
226
+ --animate-slide-out-left: slide-out-left 0.25s ease-in forwards;
227
+
228
+ @keyframes appear {
229
+ from {
230
+ opacity: 0.5;
231
+ scale: 0.8;
232
+ }
233
+ 80% {
234
+ scale: 1.05;
235
+ }
236
+ to {
237
+ opacity: 1;
238
+ scale: 1;
239
+ }
240
+ }
241
+
242
+ @keyframes pan {
243
+ from {
244
+ background-position: 0% 50%;
245
+ }
246
+ to {
247
+ background-position: 100% 50%;
248
+ }
249
+ }
250
+
251
+ @keyframes slide-in-left {
252
+ from {
253
+ transform: translateX(-100%);
254
+ opacity: 0;
255
+ }
256
+ to {
257
+ transform: translateX(0);
258
+ opacity: 1;
259
+ }
260
+ }
261
+
262
+ @keyframes slide-out-left {
263
+ from {
264
+ transform: translateX(0);
265
+ opacity: 1;
266
+ }
267
+ to {
268
+ transform: translateX(-100%);
269
+ opacity: 0;
270
+ }
271
+ }
196
272
  }
197
273
  :root {
198
274
  color-scheme: light dark;
199
- /* Primitives. OKLCH source of truth + intended usage: docs/colour-palette.md */
200
275
  --white: #ffffff;
201
276
  --black: #000000;
202
277
  --neutral-50: #fcfaf8;
@@ -380,7 +455,6 @@
380
455
  --ixia-black: var(--black);
381
456
  --ixia-brand-default: light-dark(var(--orange-600), var(--orange-400));
382
457
  --ixia-brand-muted: light-dark(var(--orange-700), var(--orange-300));
383
- --ixia-brand-subtle: light-dark(var(--orange-50), var(--orange-950));
384
458
  --ixia-brand-on-default: light-dark(var(--white), var(--neutral-950));
385
459
  --ixia-brand-container: light-dark(var(--orange-100), var(--orange-950));
386
460
  --ixia-brand-container-low: light-dark(var(--white), var(--neutral-950));
@@ -400,7 +474,6 @@
400
474
  --ixia-brand-gradient-subtle: linear-gradient(135deg, #df640029, #eeac4a1f, #f9dc8414);
401
475
  --ixia-accent-default: light-dark(var(--teal-600), var(--teal-400));
402
476
  --ixia-accent-muted: light-dark(var(--teal-700), var(--teal-300));
403
- --ixia-accent-subtle: light-dark(var(--teal-50), var(--teal-950));
404
477
  --ixia-accent-on-default: light-dark(var(--white), var(--neutral-950));
405
478
  --ixia-accent-container: light-dark(var(--teal-100), var(--teal-950));
406
479
  --ixia-accent-container-low: light-dark(var(--white), var(--neutral-950));
@@ -410,21 +483,25 @@
410
483
  --ixia-accent-border: light-dark(var(--teal-300), var(--teal-700));
411
484
  --ixia-accent-border-strong: var(--teal-500);
412
485
  --ixia-accent-shadow: light-dark(#006d6540, #62d0c259);
413
- --ixia-neutral-default: light-dark(var(--neutral-800), var(--neutral-100));
414
- --ixia-neutral-muted: light-dark(var(--neutral-900), var(--neutral-200));
415
- --ixia-neutral-subtle: light-dark(var(--neutral-100), var(--neutral-800));
486
+ --ixia-neutral-default: light-dark(var(--neutral-900), var(--neutral-50));
487
+ --ixia-neutral-muted: light-dark(var(--neutral-700), var(--neutral-200));
416
488
  --ixia-neutral-on-default: light-dark(var(--white), var(--neutral-950));
417
- --ixia-neutral-container: light-dark(var(--neutral-100), var(--neutral-800));
489
+ --ixia-neutral-container: light-dark(
490
+ var(--neutral-200),
491
+ color-mix(in srgb, var(--neutral-900) 20%, var(--neutral-800))
492
+ );
418
493
  --ixia-neutral-container-low: light-dark(var(--neutral-100), var(--neutral-900));
419
- --ixia-neutral-container-high: light-dark(var(--neutral-200), var(--neutral-700));
494
+ --ixia-neutral-container-high: light-dark(
495
+ var(--neutral-300),
496
+ color-mix(in srgb, var(--neutral-800) 75%, var(--neutral-700))
497
+ );
420
498
  --ixia-neutral-on-container: light-dark(var(--neutral-900), var(--neutral-50));
421
- --ixia-neutral-on-container-muted: light-dark(var(--neutral-600), var(--neutral-300));
422
- --ixia-neutral-border: light-dark(var(--neutral-200), var(--neutral-800));
423
- --ixia-neutral-border-strong: light-dark(var(--neutral-400), var(--neutral-600));
499
+ --ixia-neutral-on-container-muted: light-dark(var(--neutral-700), var(--ixia-on-surface-muted));
500
+ --ixia-neutral-border: var(--ixia-border);
501
+ --ixia-neutral-border-strong: var(--neutral-500);
424
502
  --ixia-neutral-shadow: light-dark(#14110f2e, #00000059);
425
503
  --ixia-error-default: light-dark(var(--red-600), var(--red-400));
426
504
  --ixia-error-muted: light-dark(var(--red-700), var(--red-300));
427
- --ixia-error-subtle: light-dark(var(--red-50), var(--red-950));
428
505
  --ixia-error-on-default: light-dark(var(--white), var(--neutral-950));
429
506
  --ixia-error-container: light-dark(var(--red-100), var(--red-950));
430
507
  --ixia-error-container-low: light-dark(var(--white), var(--neutral-950));
@@ -436,7 +513,6 @@
436
513
  --ixia-error-shadow: light-dark(#af0a2940, #ff9b9359);
437
514
  --ixia-info-default: light-dark(var(--blue-600), var(--blue-400));
438
515
  --ixia-info-muted: light-dark(var(--blue-700), var(--blue-300));
439
- --ixia-info-subtle: light-dark(var(--blue-50), var(--blue-950));
440
516
  --ixia-info-on-default: light-dark(var(--white), var(--neutral-950));
441
517
  --ixia-info-container: light-dark(var(--blue-100), var(--blue-950));
442
518
  --ixia-info-container-low: light-dark(var(--white), var(--neutral-950));
@@ -448,7 +524,6 @@
448
524
  --ixia-info-shadow: light-dark(#2358b440, #8ebdff59);
449
525
  --ixia-success-default: light-dark(var(--green-600), var(--green-400));
450
526
  --ixia-success-muted: light-dark(var(--green-700), var(--green-300));
451
- --ixia-success-subtle: light-dark(var(--green-50), var(--green-950));
452
527
  --ixia-success-on-default: light-dark(var(--white), var(--neutral-950));
453
528
  --ixia-success-container: light-dark(var(--green-100), var(--green-950));
454
529
  --ixia-success-container-low: light-dark(var(--white), var(--neutral-950));
@@ -460,7 +535,6 @@
460
535
  --ixia-success-shadow: light-dark(#00713140, #78d28d59);
461
536
  --ixia-warning-default: light-dark(var(--amber-600), var(--amber-400));
462
537
  --ixia-warning-muted: light-dark(var(--amber-700), var(--amber-300));
463
- --ixia-warning-subtle: light-dark(var(--amber-50), var(--amber-950));
464
538
  --ixia-warning-on-default: light-dark(var(--white), var(--neutral-950));
465
539
  --ixia-warning-container: light-dark(var(--amber-100), var(--amber-950));
466
540
  --ixia-warning-container-low: light-dark(var(--white), var(--neutral-950));
@@ -476,8 +550,11 @@
476
550
  --ixia-surface-3: light-dark(var(--white), var(--neutral-700));
477
551
  --ixia-surface-low: light-dark(var(--neutral-200), var(--black));
478
552
  --ixia-on-surface: light-dark(var(--neutral-900), var(--neutral-50));
479
- --ixia-on-surface-variant: light-dark(var(--neutral-700), var(--neutral-200));
480
- --ixia-on-surface-muted: light-dark(var(--neutral-600), var(--neutral-300));
553
+ --ixia-on-surface-variant: light-dark(var(--neutral-700), var(--neutral-300));
554
+ --ixia-on-surface-muted: light-dark(
555
+ var(--neutral-600),
556
+ color-mix(in srgb, var(--neutral-400) 75%, var(--neutral-300))
557
+ );
481
558
  --ixia-on-surface-disabled: light-dark(var(--neutral-400), var(--neutral-600));
482
559
  --ixia-border: light-dark(var(--neutral-200), var(--neutral-800));
483
560
  --ixia-border-strong: light-dark(var(--neutral-400), var(--neutral-700));
package/dist/themes/hogarth.css CHANGED
@@ -4,7 +4,6 @@
4
4
  /* Yellow is a lifted ladder: light mode needs 800 for text-safe fills. */
5
5
  --ixia-brand-default: light-dark(var(--yellow-800), var(--yellow-500));
6
6
  --ixia-brand-muted: light-dark(var(--yellow-900), var(--yellow-400));
7
- --ixia-brand-subtle: light-dark(var(--yellow-50), var(--yellow-950));
8
7
  --ixia-brand-on-default: light-dark(var(--white), var(--neutral-950));
9
8
  --ixia-brand-container: light-dark(var(--yellow-100), var(--yellow-950));
10
9
  --ixia-brand-container-low: light-dark(var(--white), var(--neutral-950));
@@ -24,7 +23,6 @@
24
23
  --ixia-brand-gradient-subtle: linear-gradient(135deg, #eeb40029, #f9dc841f, #ffd2d914);
25
24
  --ixia-accent-default: light-dark(var(--rose-600), var(--rose-400));
26
25
  --ixia-accent-muted: light-dark(var(--rose-700), var(--rose-300));
27
- --ixia-accent-subtle: light-dark(var(--rose-50), var(--rose-950));
28
26
  --ixia-accent-on-default: light-dark(var(--white), var(--neutral-950));
29
27
  --ixia-accent-container: light-dark(var(--rose-100), var(--rose-950));
30
28
  --ixia-accent-container-low: light-dark(var(--white), var(--neutral-950));
@@ -39,7 +37,6 @@
39
37
  --color-surface-focus-ring: var(--ixia-surface-focus-ring);
40
38
  --color-brand-default: var(--ixia-brand-default);
41
39
  --color-brand-muted: var(--ixia-brand-muted);
42
- --color-brand-subtle: var(--ixia-brand-subtle);
43
40
  --color-brand-on-default: var(--ixia-brand-on-default);
44
41
  --color-brand-container: var(--ixia-brand-container);
45
42
  --color-brand-container-low: var(--ixia-brand-container-low);
@@ -51,7 +48,6 @@
51
48
  --color-brand-shadow: var(--ixia-brand-shadow);
52
49
  --color-accent-default: var(--ixia-accent-default);
53
50
  --color-accent-muted: var(--ixia-accent-muted);
54
- --color-accent-subtle: var(--ixia-accent-subtle);
55
51
  --color-accent-on-default: var(--ixia-accent-on-default);
56
52
  --color-accent-container: var(--ixia-accent-container);
57
53
  --color-accent-container-low: var(--ixia-accent-container-low);
package/dist/themes/mabel.css CHANGED
@@ -3,7 +3,6 @@
3
3
  [data-brand='mabel'] {
4
4
  --ixia-brand-default: light-dark(var(--rose-600), var(--rose-400));
5
5
  --ixia-brand-muted: light-dark(var(--rose-700), var(--rose-300));
6
- --ixia-brand-subtle: light-dark(var(--rose-50), var(--rose-950));
7
6
  --ixia-brand-on-default: light-dark(var(--white), var(--neutral-950));
8
7
  --ixia-brand-container: light-dark(var(--rose-100), var(--rose-950));
9
8
  --ixia-brand-container-low: light-dark(var(--white), var(--neutral-950));
@@ -23,7 +22,6 @@
23
22
  --ixia-brand-gradient-subtle: linear-gradient(135deg, #e4518129, #ff96af1f, #ffcfec14);
24
23
  --ixia-accent-default: light-dark(var(--teal-600), var(--teal-400));
25
24
  --ixia-accent-muted: light-dark(var(--teal-700), var(--teal-300));
26
- --ixia-accent-subtle: light-dark(var(--teal-50), var(--teal-950));
27
25
  --ixia-accent-on-default: light-dark(var(--white), var(--neutral-950));
28
26
  --ixia-accent-container: light-dark(var(--teal-100), var(--teal-950));
29
27
  --ixia-accent-container-low: light-dark(var(--white), var(--neutral-950));
@@ -38,7 +36,6 @@
38
36
  --color-surface-focus-ring: var(--ixia-surface-focus-ring);
39
37
  --color-brand-default: var(--ixia-brand-default);
40
38
  --color-brand-muted: var(--ixia-brand-muted);
41
- --color-brand-subtle: var(--ixia-brand-subtle);
42
39
  --color-brand-on-default: var(--ixia-brand-on-default);
43
40
  --color-brand-container: var(--ixia-brand-container);
44
41
  --color-brand-container-low: var(--ixia-brand-container-low);
@@ -50,7 +47,6 @@
50
47
  --color-brand-shadow: var(--ixia-brand-shadow);
51
48
  --color-accent-default: var(--ixia-accent-default);
52
49
  --color-accent-muted: var(--ixia-accent-muted);
53
- --color-accent-subtle: var(--ixia-accent-subtle);
54
50
  --color-accent-on-default: var(--ixia-accent-on-default);
55
51
  --color-accent-container: var(--ixia-accent-container);
56
52
  --color-accent-container-low: var(--ixia-accent-container-low);
package/dist/themes/maculata.css CHANGED
@@ -3,7 +3,6 @@
3
3
  [data-brand='maculata'] {
4
4
  --ixia-brand-default: light-dark(var(--orange-600), var(--orange-400));
5
5
  --ixia-brand-muted: light-dark(var(--orange-700), var(--orange-300));
6
- --ixia-brand-subtle: light-dark(var(--orange-50), var(--orange-950));
7
6
  --ixia-brand-on-default: light-dark(var(--white), var(--neutral-950));
8
7
  --ixia-brand-container: light-dark(var(--orange-100), var(--orange-950));
9
8
  --ixia-brand-container-low: light-dark(var(--white), var(--neutral-950));
@@ -23,7 +22,6 @@
23
22
  --ixia-brand-gradient-subtle: linear-gradient(135deg, #df640029, #eeac4a1f, #f9dc8414);
24
23
  --ixia-accent-default: light-dark(var(--teal-600), var(--teal-400));
25
24
  --ixia-accent-muted: light-dark(var(--teal-700), var(--teal-300));
26
- --ixia-accent-subtle: light-dark(var(--teal-50), var(--teal-950));
27
25
  --ixia-accent-on-default: light-dark(var(--white), var(--neutral-950));
28
26
  --ixia-accent-container: light-dark(var(--teal-100), var(--teal-950));
29
27
  --ixia-accent-container-low: light-dark(var(--white), var(--neutral-950));
@@ -38,7 +36,6 @@
38
36
  --color-surface-focus-ring: var(--ixia-surface-focus-ring);
39
37
  --color-brand-default: var(--ixia-brand-default);
40
38
  --color-brand-muted: var(--ixia-brand-muted);
41
- --color-brand-subtle: var(--ixia-brand-subtle);
42
39
  --color-brand-on-default: var(--ixia-brand-on-default);
43
40
  --color-brand-container: var(--ixia-brand-container);
44
41
  --color-brand-container-low: var(--ixia-brand-container-low);
@@ -50,7 +47,6 @@
50
47
  --color-brand-shadow: var(--ixia-brand-shadow);
51
48
  --color-accent-default: var(--ixia-accent-default);
52
49
  --color-accent-muted: var(--ixia-accent-muted);
53
- --color-accent-subtle: var(--ixia-accent-subtle);
54
50
  --color-accent-on-default: var(--ixia-accent-on-default);
55
51
  --color-accent-container: var(--ixia-accent-container);
56
52
  --color-accent-container-low: var(--ixia-accent-container-low);
package/dist/themes/monadelpha.css CHANGED
@@ -3,7 +3,6 @@
3
3
  [data-brand='monadelpha'] {
4
4
  --ixia-brand-default: light-dark(var(--indigo-600), var(--indigo-400));
5
5
  --ixia-brand-muted: light-dark(var(--indigo-700), var(--indigo-300));
6
- --ixia-brand-subtle: light-dark(var(--indigo-50), var(--indigo-950));
7
6
  --ixia-brand-on-default: light-dark(var(--white), var(--neutral-950));
8
7
  --ixia-brand-container: light-dark(var(--indigo-100), var(--indigo-950));
9
8
  --ixia-brand-container-low: light-dark(var(--white), var(--neutral-950));
@@ -23,7 +22,6 @@
23
22
  --ixia-brand-gradient-subtle: linear-gradient(135deg, #737ef929, #8cd3fd1f, #b2eee314);
24
23
  --ixia-accent-default: light-dark(var(--teal-600), var(--teal-400));
25
24
  --ixia-accent-muted: light-dark(var(--teal-700), var(--teal-300));
26
- --ixia-accent-subtle: light-dark(var(--teal-50), var(--teal-950));
27
25
  --ixia-accent-on-default: light-dark(var(--white), var(--neutral-950));
28
26
  --ixia-accent-container: light-dark(var(--teal-100), var(--teal-950));
29
27
  --ixia-accent-container-low: light-dark(var(--white), var(--neutral-950));
@@ -38,7 +36,6 @@
38
36
  --color-surface-focus-ring: var(--ixia-surface-focus-ring);
39
37
  --color-brand-default: var(--ixia-brand-default);
40
38
  --color-brand-muted: var(--ixia-brand-muted);
41
- --color-brand-subtle: var(--ixia-brand-subtle);
42
39
  --color-brand-on-default: var(--ixia-brand-on-default);
43
40
  --color-brand-container: var(--ixia-brand-container);
44
41
  --color-brand-container-low: var(--ixia-brand-container-low);
@@ -50,7 +47,6 @@
50
47
  --color-brand-shadow: var(--ixia-brand-shadow);
51
48
  --color-accent-default: var(--ixia-accent-default);
52
49
  --color-accent-muted: var(--ixia-accent-muted);
53
- --color-accent-subtle: var(--ixia-accent-subtle);
54
50
  --color-accent-on-default: var(--ixia-accent-on-default);
55
51
  --color-accent-container: var(--ixia-accent-container);
56
52
  --color-accent-container-low: var(--ixia-accent-container-low);
package/dist/themes/venus.css CHANGED
@@ -3,7 +3,6 @@
3
3
  [data-brand='venus'] {
4
4
  --ixia-brand-default: light-dark(var(--pink-600), var(--pink-400));
5
5
  --ixia-brand-muted: light-dark(var(--pink-700), var(--pink-300));
6
- --ixia-brand-subtle: light-dark(var(--pink-50), var(--pink-950));
7
6
  --ixia-brand-on-default: light-dark(var(--white), var(--neutral-950));
8
7
  --ixia-brand-container: light-dark(var(--pink-100), var(--pink-950));
9
8
  --ixia-brand-container-low: light-dark(var(--white), var(--neutral-950));
@@ -23,7 +22,6 @@
23
22
  --ixia-brand-gradient-subtle: linear-gradient(135deg, #ce5eaf29, #f497d61f, #ffd2d914);
24
23
  --ixia-accent-default: light-dark(var(--emerald-600), var(--emerald-400));
25
24
  --ixia-accent-muted: light-dark(var(--emerald-700), var(--emerald-300));
26
- --ixia-accent-subtle: light-dark(var(--emerald-50), var(--emerald-950));
27
25
  --ixia-accent-on-default: light-dark(var(--white), var(--neutral-950));
28
26
  --ixia-accent-container: light-dark(var(--emerald-100), var(--emerald-950));
29
27
  --ixia-accent-container-low: light-dark(var(--white), var(--neutral-950));
@@ -38,7 +36,6 @@
38
36
  --color-surface-focus-ring: var(--ixia-surface-focus-ring);
39
37
  --color-brand-default: var(--ixia-brand-default);
40
38
  --color-brand-muted: var(--ixia-brand-muted);
41
- --color-brand-subtle: var(--ixia-brand-subtle);
42
39
  --color-brand-on-default: var(--ixia-brand-on-default);
43
40
  --color-brand-container: var(--ixia-brand-container);
44
41
  --color-brand-container-low: var(--ixia-brand-container-low);
@@ -50,7 +47,6 @@
50
47
  --color-brand-shadow: var(--ixia-brand-shadow);
51
48
  --color-accent-default: var(--ixia-accent-default);
52
49
  --color-accent-muted: var(--ixia-accent-muted);
53
- --color-accent-subtle: var(--ixia-accent-subtle);
54
50
  --color-accent-on-default: var(--ixia-accent-on-default);
55
51
  --color-accent-container: var(--ixia-accent-container);
56
52
  --color-accent-container-low: var(--ixia-accent-container-low);
package/dist/themes/viridiflora.css CHANGED
@@ -3,7 +3,6 @@
3
3
  [data-brand='viridiflora'] {
4
4
  --ixia-brand-default: light-dark(var(--teal-600), var(--teal-400));
5
5
  --ixia-brand-muted: light-dark(var(--teal-700), var(--teal-300));
6
- --ixia-brand-subtle: light-dark(var(--teal-50), var(--teal-950));
7
6
  --ixia-brand-on-default: light-dark(var(--white), var(--neutral-950));
8
7
  --ixia-brand-container: light-dark(var(--teal-100), var(--teal-950));
9
8
  --ixia-brand-container-low: light-dark(var(--white), var(--neutral-950));
@@ -23,7 +22,6 @@
23
22
  --ixia-brand-gradient-subtle: linear-gradient(135deg, #00a49729, #62d0c21f, #b3f0d414);
24
23
  --ixia-accent-default: light-dark(var(--orange-600), var(--orange-400));
25
24
  --ixia-accent-muted: light-dark(var(--orange-700), var(--orange-300));
26
- --ixia-accent-subtle: light-dark(var(--orange-50), var(--orange-950));
27
25
  --ixia-accent-on-default: light-dark(var(--white), var(--neutral-950));
28
26
  --ixia-accent-container: light-dark(var(--orange-100), var(--orange-950));
29
27
  --ixia-accent-container-low: light-dark(var(--white), var(--neutral-950));
@@ -38,7 +36,6 @@
38
36
  --color-surface-focus-ring: var(--ixia-surface-focus-ring);
39
37
  --color-brand-default: var(--ixia-brand-default);
40
38
  --color-brand-muted: var(--ixia-brand-muted);
41
- --color-brand-subtle: var(--ixia-brand-subtle);
42
39
  --color-brand-on-default: var(--ixia-brand-on-default);
43
40
  --color-brand-container: var(--ixia-brand-container);
44
41
  --color-brand-container-low: var(--ixia-brand-container-low);
@@ -50,7 +47,6 @@
50
47
  --color-brand-shadow: var(--ixia-brand-shadow);
51
48
  --color-accent-default: var(--ixia-accent-default);
52
49
  --color-accent-muted: var(--ixia-accent-muted);
53
- --color-accent-subtle: var(--ixia-accent-subtle);
54
50
  --color-accent-on-default: var(--ixia-accent-on-default);
55
51
  --color-accent-container: var(--ixia-accent-container);
56
52
  --color-accent-container-low: var(--ixia-accent-container-low);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ixia-ui-react",
3
- "version": "1.6.0",
3
+ "version": "1.8.0",
4
4
  "description": "A React component library for building polished product interfaces with composable primitives and Tailwind CSS styling.",
5
5
  "keywords": [
6
6
  "accessible-ui",
@@ -56,6 +56,11 @@
56
56
  "commit:skip": "git add . && git commit --no-verify",
57
57
  "cz": "cz",
58
58
  "dev": "vp pack --watch",
59
+ "figma": "vp run build-storybook && vp run figma:export && vp run figma:parts && vp run figma:build",
60
+ "figma:build": "node src/tools/figma/tokens.mjs && vp exec tsc --project src/tools/figma/tsconfig.json && vp build --config src/tools/figma/vite.config.ts",
61
+ "figma:export": "node src/tools/figma/export.mjs",
62
+ "figma:parts": "node --disable-warning=ExperimentalWarning src/tools/figma/parts.mjs",
63
+ "figma:test": "node --disable-warning=ExperimentalWarning --test src/tools/figma/*.test.mjs",
59
64
  "pack": "vp pack && pnpm run build:css",
60
65
  "prepare": "vp config --no-agent",
61
66
  "preview": "vp preview",
@@ -67,22 +72,28 @@
67
72
  "dependencies": {
68
73
  "@base-ui/react": "^1.9.0",
69
74
  "@daypicker/react": "^10.0.2",
70
- "@dnd-kit/dom": "^0.5.1",
71
- "@dnd-kit/react": "^0.5.1",
75
+ "@deck.gl/core": "^9.4.1",
76
+ "@deck.gl/google-maps": "^9.4.1",
77
+ "@dnd-kit/dom": "^0.5.3",
78
+ "@dnd-kit/react": "^0.5.3",
72
79
  "@phosphor-icons/react": "^2.1.10",
73
80
  "@tailwindcss/cli": "^4.3.3",
74
81
  "@tailwindcss/vite": "^4.3.3",
75
- "@tanstack/charts": "^1.1.0",
82
+ "@tanstack/charts": "^1.2.0",
76
83
  "@tanstack/react-form": "^1.33.5",
84
+ "@tanstack/react-pacer": "^0.24.1",
77
85
  "@tanstack/react-store": "^0.11.2",
78
- "@tanstack/react-table": "^9.3.1",
79
- "@tanstack/react-virtual": "^3.14.22",
86
+ "@tanstack/react-virtual": "^3.14.25",
87
+ "@types/geojson": "^7946.0.16",
88
+ "@types/google.maps": "^3.66.9",
89
+ "@vis.gl/react-google-maps": "^1.10.2",
80
90
  "chroma-js": "^3.2.0",
81
91
  "class-variance-authority": "^0.7.1",
82
92
  "clsx": "^2.1.1",
83
- "oxc-transform-react": "^0.155.0",
84
- "react-resizable-panels": "^4.15.0",
93
+ "oxc-transform-react": "^0.156.0",
94
+ "react-resizable-panels": "^4.16.1",
85
95
  "recharts": "^3.10.1",
96
+ "supercluster": "^9.1.0",
86
97
  "tailwind-merge": "^3.7.0",
87
98
  "tailwindcss": "^4.3.3",
88
99
  "tw-animate-css": "^1.4.0",
@@ -92,40 +103,42 @@
92
103
  "@chromatic-com/storybook": "^5.6.0",
93
104
  "@commitlint/cli": "^21.2.4",
94
105
  "@commitlint/config-conventional": "^21.2.4",
106
+ "@deck.gl/layers": "^9.4.1",
95
107
  "@faker-js/faker": "^10.6.0",
108
+ "@figma/plugin-typings": "^1.142.0",
96
109
  "@semantic-release/changelog": "^7.0.0",
97
110
  "@semantic-release/commit-analyzer": "^13.0.1",
98
111
  "@semantic-release/git": "^11.0.1",
99
112
  "@semantic-release/github": "^12.0.10",
100
113
  "@semantic-release/npm": "^13.2.0",
101
114
  "@semantic-release/release-notes-generator": "^14.1.1",
102
- "@storybook/addon-a11y": "^10.6.3",
103
- "@storybook/addon-docs": "^10.6.3",
104
- "@storybook/addon-themes": "^10.6.3",
105
- "@storybook/addon-vitest": "^10.6.3",
106
- "@storybook/react-vite": "^10.6.3",
115
+ "@storybook/addon-a11y": "^10.6.5",
116
+ "@storybook/addon-docs": "^10.6.5",
117
+ "@storybook/addon-themes": "^10.6.5",
118
+ "@storybook/addon-vitest": "^10.6.5",
119
+ "@storybook/react-vite": "^10.6.5",
107
120
  "@tailwindcss/node": "^4.3.3",
108
121
  "@tanstack/react-form": "^1.33.5",
109
- "@tanstack/react-table": "^9.1.2",
122
+ "@tanstack/react-table": "^9.3.1",
110
123
  "@types/chroma-js": "^3.1.3",
111
- "@types/node": "^26.6.5",
124
+ "@types/node": "^26.6.6",
112
125
  "@types/react": "^19.3.0",
113
126
  "@types/react-dom": "^19.3.0",
114
127
  "@typescript/typescript6": "^6.0.2",
115
128
  "@vitejs/plugin-react": "^6.1.2",
116
129
  "@vitest/browser-playwright": "catalog:",
117
130
  "@vitest/coverage-v8": "catalog:",
118
- "chromatic": "^18.13.3",
131
+ "chromatic": "^18.13.6",
119
132
  "commitizen": "^4.3.2",
120
133
  "concurrently": "^10.0.6",
121
134
  "cz-conventional-changelog": "^3.3.0",
122
- "globals": "^17.13.0",
135
+ "globals": "^17.14.0",
123
136
  "jsdom": "^30.1.3",
124
- "oxlint-tailwindcss": "^1.16.0",
137
+ "oxlint-tailwindcss": "^1.17.1",
125
138
  "playwright": "^1.64.1",
126
139
  "semantic-release": "^25.0.9",
127
140
  "shiki": "^4.5.0",
128
- "storybook": "^10.6.3",
141
+ "storybook": "^10.6.5",
129
142
  "typescript": "~7.0.2",
130
143
  "uuid": "^14.0.3",
131
144
  "vite": "catalog:",