@reliability-design/web 1.4.7 → 1.4.9

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 (48) hide show
  1. package/CHANGELOG.md +98 -2
  2. package/dist/components/rel-accordion/README.md +2 -1
  3. package/dist/components/rel-alert/README.md +1 -1
  4. package/dist/components/rel-autocomplete/README.md +22 -5
  5. package/dist/components/rel-avatar/README.md +9 -7
  6. package/dist/components/rel-badge/README.md +4 -5
  7. package/dist/components/rel-button/README.md +32 -2
  8. package/dist/components/rel-card/README.md +3 -3
  9. package/dist/components/rel-carousel/README.md +3 -0
  10. package/dist/components/rel-checkbox/README.md +8 -4
  11. package/dist/components/rel-chip/README.md +13 -7
  12. package/dist/components/rel-container/README.md +8 -8
  13. package/dist/components/rel-date-picker/README.md +8 -2
  14. package/dist/components/rel-divider/README.md +11 -1
  15. package/dist/components/rel-kbd/README.md +2 -2
  16. package/dist/components/rel-layout/README.md +34 -0
  17. package/dist/components/rel-menu/README.md +3 -1
  18. package/dist/components/rel-menubar/README.md +1 -1
  19. package/dist/components/rel-otp/README.md +4 -3
  20. package/dist/components/rel-pagination/README.md +2 -2
  21. package/dist/components/rel-popover/README.md +5 -5
  22. package/dist/components/rel-progress/README.md +3 -3
  23. package/dist/components/rel-radio/README.md +1 -1
  24. package/dist/components/rel-range-picker/README.md +11 -2
  25. package/dist/components/rel-segmented-button/README.md +7 -5
  26. package/dist/components/rel-select/README.md +11 -6
  27. package/dist/components/rel-sheet/README.md +3 -3
  28. package/dist/components/rel-skeleton/README.md +5 -4
  29. package/dist/components/rel-slider/README.md +3 -2
  30. package/dist/components/rel-snackbar/README.md +13 -7
  31. package/dist/components/rel-stepper/README.md +23 -10
  32. package/dist/components/rel-switch/README.md +16 -7
  33. package/dist/components/rel-tab/README.md +5 -2
  34. package/dist/components/rel-textfield/README.md +19 -2
  35. package/dist/components/rel-time-picker/README.md +6 -0
  36. package/dist/components/rel-toast/README.md +14 -6
  37. package/dist/components/rel-tooltip/README.md +13 -2
  38. package/dist/components/rel-upload/README.md +2 -2
  39. package/dist/index.d.mts +825 -240
  40. package/dist/index.d.ts +825 -240
  41. package/dist/index.js +8617 -5213
  42. package/dist/index.js.map +1 -1
  43. package/dist/index.mjs +8424 -5020
  44. package/dist/index.mjs.map +1 -1
  45. package/dist/styles/focus-ring.ts +84 -0
  46. package/dist/styles/vars.css +75 -60
  47. package/dist/{vars-JHTUGNRG.css → vars-DXX6QOAG.css} +75 -60
  48. package/package.json +1 -1
package/dist/{vars-JHTUGNRG.css → vars-DXX6QOAG.css} RENAMED
@@ -1,5 +1,5 @@
1
1
  /* AUTO-GENERATED by figma-pipeline/scripts/build-vars.ts — DO NOT EDIT */
2
- /* Source: figma-pipeline/tokens/{primitives, color tokens}/*.tokens.json (RelDS_A1 V2) */
2
+ /* Source: figma-pipeline/tokens/{primitives, dimensions, color tokens, typography tokens}/*.tokens.json */
3
3
  /* Contains: color + foundation primitives, semantic color tokens (light/dark). */
4
4
 
5
5
  :root {
@@ -9,7 +9,6 @@
9
9
  --rel-colors-gray-100: #E5E5E5;
10
10
  --rel-colors-gray-200: #C2C2C2;
11
11
  --rel-colors-gray-300: #A3A3A3;
12
- --rel-colors-gray-350: #8C8C8C;
13
12
  --rel-colors-gray-400: #7D7D7D;
14
13
  --rel-colors-gray-500: #525252;
15
14
  --rel-colors-gray-600: #404040;
@@ -23,7 +22,7 @@
23
22
  --rel-colors-green-50: #EDF8F4;
24
23
  --rel-colors-green-100: #D5F1E7;
25
24
  --rel-colors-green-200: #91D9BF;
26
- --rel-colors-green-300: #5FC9A3;
25
+ --rel-colors-green-300: #30B887;
27
26
  --rel-colors-green-400: #30B887;
28
27
  --rel-colors-green-500: #00A86B;
29
28
  --rel-colors-green-600: #008655;
@@ -366,17 +365,23 @@
366
365
  --rel-action-md-letter-spacing: var(--rel-fonts-letter-spacing-xs);
367
366
 
368
367
  /* ==================== CARRY-FORWARD (not in Figma export) ==================== */
369
- /* --- shadows (carry-forward) --- */
368
+ /* --- shadows (carry-forward, DEPRECATED — no Figma origin; repoint to xs–2xl) --- */
370
369
  --rel-shadows-shadow-100: 0px 1px 2px 0px rgba(0,0,0,0.3), 0px 1px 3px 1px rgba(0,0,0,0.15);
371
370
  --rel-shadows-shadow-200: 0px 1px 2px 0px rgba(0,0,0,0.3), 0px 2px 6px 2px rgba(0,0,0,0.15);
372
371
  --rel-shadows-shadow-300: 0px 1px 2px 0px rgba(0,0,0,0.3), 0px 4px 8px 3px rgba(0,0,0,0.15);
373
372
  --rel-shadows-shadow-400: 0px 2px 3px 0px rgba(0,0,0,0.3), 0px 6px 10px 4px rgba(0,0,0,0.15);
374
373
  --rel-shadows-shadow-500: 0px 4px 4px 0px rgba(0,0,0,0.3), 0px 8px 12px 6px rgba(0,0,0,0.15);
375
- /* --- shadows (Figma effect styles shadow/sm, shadow/md) --- */
374
+ /* --- shadows (Figma effect styles shadow/xs … shadow/2xl) --- */
375
+ --rel-shadows-xs: 0 0 1px rgba(11,11,11,0.20), 0 1px 2px rgba(11,11,11,0.10);
376
376
  --rel-shadows-sm: 0 2px 4px rgba(11,11,11,0.10);
377
377
  --rel-shadows-md: 0 4px 8px rgba(11,11,11,0.10);
378
- /* --- overlay (carry-forward) --- */
379
- --rel-overlay-scrim: rgba(0,0,0,0.5);
378
+ --rel-shadows-lg: 0 8px 16px rgba(11,11,11,0.10);
379
+ --rel-shadows-xl: 0 0 1px rgba(11,11,11,0.30), 0 16px 24px rgba(11,11,11,0.10);
380
+ --rel-shadows-2xl: 0 0 1px rgba(11,11,11,0.30), 0 24px 40px rgba(11,11,11,0.10);
381
+ /* --- shadow colour (ADDED: no Figma variable; drop-shadow() needs a bare color) --- */
382
+ --rel-shadow-color: rgba(11,11,11,0.10);
383
+ /* --- overlay (DEPRECATED alias — bind --rel-bg-overlay-scrim) --- */
384
+ --rel-overlay-scrim: var(--rel-bg-overlay-scrim);
380
385
 
381
386
  /* ==================== SEMANTIC — LIGHT ==================== */
382
387
  /* --- bg --- */
@@ -407,46 +412,48 @@
407
412
  --rel-bg-success-light: var(--rel-colors-green-50);
408
413
  --rel-bg-success: var(--rel-colors-green-500);
409
414
  --rel-bg-success-strong: var(--rel-colors-green-800);
415
+ --rel-bg-overlay-scrim: var(--rel-colors-dark-alpha-8);
410
416
 
411
417
  /* --- text --- */
412
418
  --rel-text-static-light: var(--rel-colors-gray-0);
413
419
  --rel-text-static-dark: var(--rel-colors-gray-950);
414
420
  --rel-text-default: var(--rel-colors-gray-950);
415
421
  --rel-text-label: var(--rel-colors-gray-700);
416
- --rel-text-body: var(--rel-colors-gray-500);
422
+ --rel-text-body: var(--rel-colors-gray-600);
417
423
  --rel-text-caption: var(--rel-colors-gray-500);
418
- --rel-text-placeholder: var(--rel-colors-gray-500);
424
+ --rel-text-placeholder: var(--rel-colors-gray-300);
419
425
  --rel-text-disabled: var(--rel-colors-gray-200);
420
426
  --rel-text-inverse: var(--rel-colors-gray-0);
421
427
  --rel-text-danger: var(--rel-colors-red-600);
422
428
  --rel-text-warning: var(--rel-colors-yellow-800);
423
- --rel-text-info: var(--rel-colors-blue-700);
424
- --rel-text-success: var(--rel-colors-green-700);
429
+ --rel-text-info: var(--rel-colors-blue-500);
430
+ --rel-text-success: var(--rel-colors-green-600);
425
431
 
426
432
  /* --- border --- */
427
433
  --rel-border-default: var(--rel-colors-gray-100);
428
434
  --rel-border-subtle: var(--rel-colors-gray-50);
429
- --rel-border-accent: var(--rel-colors-gray-350);
435
+ --rel-border-accent: var(--rel-colors-gray-200);
430
436
  --rel-border-strong: var(--rel-colors-gray-950);
431
437
  --rel-border-inverse: var(--rel-colors-gray-0);
432
438
  --rel-border-brand: var(--rel-colors-brand-500);
433
439
  --rel-border-success-subtle: var(--rel-colors-green-100);
434
- --rel-border-success: var(--rel-colors-green-600);
440
+ --rel-border-success: var(--rel-colors-green-500);
435
441
  --rel-border-success-strong: var(--rel-colors-green-800);
436
442
  --rel-border-danger-subtle: var(--rel-colors-red-100);
437
- --rel-border-danger: var(--rel-colors-red-600);
443
+ --rel-border-danger: var(--rel-colors-red-500);
438
444
  --rel-border-danger-strong: var(--rel-colors-red-800);
439
445
  --rel-border-warning-subtle: var(--rel-colors-yellow-100);
440
- --rel-border-warning: var(--rel-colors-yellow-700);
446
+ --rel-border-warning: var(--rel-colors-yellow-500);
441
447
  --rel-border-warning-strong: var(--rel-colors-yellow-800);
442
448
  --rel-border-focus: var(--rel-colors-gray-950);
449
+ --rel-border-focus-static: var(--rel-colors-gray-100);
443
450
  --rel-border-focus-subtle: var(--rel-colors-gray-100);
444
451
  --rel-border-focus-inner: var(--rel-colors-gray-0);
445
452
 
446
453
  /* --- action --- */
447
454
  --rel-action-overlay-hover: var(--rel-colors-dark-alpha-1);
448
- --rel-action-overlay-pressed: var(--rel-colors-dark-alpha-2);
449
- --rel-action-overlay-hover-strong: var(--rel-colors-dark-alpha-3);
455
+ --rel-action-overlay-hover-strong: var(--rel-colors-dark-alpha-2);
456
+ --rel-action-overlay-pressed: var(--rel-colors-dark-alpha-3);
450
457
  --rel-action-overlay-dragged: var(--rel-colors-dark-alpha-6);
451
458
  --rel-action-overlay-hover-inverse: var(--rel-colors-light-alpha-4);
452
459
  --rel-action-neutral-static-hover: var(--rel-colors-light-alpha-1);
@@ -454,8 +461,8 @@
454
461
  --rel-action-neutral-fill-hover: var(--rel-colors-gray-700);
455
462
  --rel-action-neutral-fill-dragged: var(--rel-colors-gray-600);
456
463
  --rel-action-neutral-subtle: var(--rel-colors-gray-50);
457
- --rel-action-neutral-subtle-hover: var(--rel-colors-gray-100);
458
- --rel-action-neutral-subtle-dragged: var(--rel-colors-gray-200);
464
+ --rel-action-neutral-subtle-hover: var(--rel-colors-gray-50);
465
+ --rel-action-neutral-subtle-dragged: var(--rel-colors-gray-100);
459
466
  --rel-action-neutral-ghost-hover: var(--rel-colors-dark-alpha-1);
460
467
  --rel-action-neutral-label-icons-fill-inverse: var(--rel-colors-gray-0);
461
468
  --rel-action-neutral-label-icons-subtle: var(--rel-colors-gray-950);
@@ -465,24 +472,23 @@
465
472
  --rel-action-neutral-label-icons-link-hover: var(--rel-colors-gray-600);
466
473
  --rel-action-neutral-border-subtle-hover: var(--rel-colors-gray-100);
467
474
  --rel-action-neutral-border-subtle-dragged: var(--rel-colors-gray-200);
468
- --rel-action-neutral-border-outline: var(--rel-colors-gray-350);
475
+ --rel-action-neutral-border-outline: var(--rel-colors-gray-300);
469
476
  --rel-action-neutral-border-outline-hover: var(--rel-colors-gray-950);
470
477
  --rel-action-brand-fill: var(--rel-colors-brand-500);
471
478
  --rel-action-brand-fill-hover: var(--rel-colors-brand-600);
472
479
  --rel-action-brand-fill-disabled: var(--rel-colors-gray-200);
473
480
  --rel-action-brand-label-icons-primary: var(--rel-colors-gray-950);
474
- --rel-action-brand-label-icons-primary-disabled: var(--rel-colors-gray-950);
475
- --rel-action-danger-fill: var(--rel-colors-red-600);
476
- --rel-action-danger-fill-hover: var(--rel-colors-red-700);
477
- --rel-action-danger-fill-dragged: var(--rel-colors-red-500);
481
+ --rel-action-danger-fill: var(--rel-colors-red-500);
482
+ --rel-action-danger-fill-hover: var(--rel-colors-red-600);
483
+ --rel-action-danger-fill-dragged: var(--rel-colors-red-400);
478
484
  --rel-action-danger-subtle: var(--rel-colors-red-50);
479
- --rel-action-danger-subtle-hover: var(--rel-colors-red-100);
480
- --rel-action-danger-subtle-dragged: var(--rel-colors-red-200);
485
+ --rel-action-danger-subtle-hover: var(--rel-colors-red-50);
486
+ --rel-action-danger-subtle-dragged: var(--rel-colors-red-100);
481
487
  --rel-action-danger-outline-hover: var(--rel-colors-red-50);
482
488
  --rel-action-danger-ghost-hover: var(--rel-colors-red-50);
483
489
  --rel-action-danger-label-icons-fill: var(--rel-colors-gray-0);
484
490
  --rel-action-danger-label-icons-subtle: var(--rel-colors-red-600);
485
- --rel-action-danger-label-icons-subtle-hover: var(--rel-colors-red-700);
491
+ --rel-action-danger-label-icons-subtle-hover: var(--rel-colors-red-600);
486
492
  --rel-action-danger-label-icons-subtle-dragged: var(--rel-colors-red-700);
487
493
  --rel-action-danger-label-icons-outline: var(--rel-colors-red-600);
488
494
  --rel-action-danger-label-icons-ghost: var(--rel-colors-red-600);
@@ -496,34 +502,34 @@
496
502
  --rel-action-warning-fill-hover: var(--rel-colors-yellow-500);
497
503
  --rel-action-warning-fill-dragged: var(--rel-colors-yellow-300);
498
504
  --rel-action-warning-subtle: var(--rel-colors-yellow-100);
499
- --rel-action-warning-subtle-hover: var(--rel-colors-yellow-200);
500
- --rel-action-warning-subtle-dragged: var(--rel-colors-yellow-300);
505
+ --rel-action-warning-subtle-hover: var(--rel-colors-yellow-100);
506
+ --rel-action-warning-subtle-dragged: var(--rel-colors-yellow-200);
501
507
  --rel-action-warning-label-icons-fill: var(--rel-colors-gray-950);
502
508
  --rel-action-warning-label-icons-subtle: var(--rel-colors-yellow-800);
503
509
  --rel-action-warning-label-icons-subtle-hover: var(--rel-colors-yellow-800);
504
510
  --rel-action-warning-label-icons-subtle-dragged: var(--rel-colors-yellow-900);
505
511
  --rel-action-warning-border-subtle-hover: var(--rel-colors-yellow-300);
506
512
  --rel-action-warning-border-subtle-dragged: var(--rel-colors-yellow-300);
507
- --rel-action-success-fill: var(--rel-colors-green-600);
508
- --rel-action-success-fill-hover: var(--rel-colors-green-700);
509
- --rel-action-success-fill-dragged: var(--rel-colors-green-500);
513
+ --rel-action-success-fill: var(--rel-colors-green-500);
514
+ --rel-action-success-fill-hover: var(--rel-colors-green-600);
515
+ --rel-action-success-fill-dragged: var(--rel-colors-green-400);
510
516
  --rel-action-success-subtle: var(--rel-colors-green-50);
511
- --rel-action-success-subtle-hover: var(--rel-colors-green-100);
512
- --rel-action-success-subtle-dragged: var(--rel-colors-green-200);
517
+ --rel-action-success-subtle-hover: var(--rel-colors-green-50);
518
+ --rel-action-success-subtle-dragged: var(--rel-colors-green-100);
513
519
  --rel-action-success-outline-hover: var(--rel-colors-green-300);
514
520
  --rel-action-success-ghost-hover: var(--rel-colors-green-50);
515
521
  --rel-action-success-label-icons-fill: var(--rel-colors-gray-0);
516
- --rel-action-success-label-icons-subtle: var(--rel-colors-green-700);
517
- --rel-action-success-label-icons-subtle-hover: var(--rel-colors-green-700);
518
- --rel-action-success-label-icons-subtle-dragged: var(--rel-colors-green-800);
522
+ --rel-action-success-label-icons-subtle: var(--rel-colors-green-600);
523
+ --rel-action-success-label-icons-subtle-hover: var(--rel-colors-green-600);
524
+ --rel-action-success-label-icons-subtle-dragged: var(--rel-colors-green-700);
519
525
  --rel-action-success-border-subtle-hover: var(--rel-colors-green-200);
520
526
  --rel-action-success-border-subtle-dragged: var(--rel-colors-green-200);
521
- --rel-action-info-fill: var(--rel-colors-blue-700);
522
- --rel-action-info-fill-hover: var(--rel-colors-blue-800);
523
- --rel-action-info-fill-dragged: var(--rel-colors-blue-600);
527
+ --rel-action-info-fill: var(--rel-colors-blue-500);
528
+ --rel-action-info-fill-hover: var(--rel-colors-blue-600);
529
+ --rel-action-info-fill-dragged: var(--rel-colors-blue-400);
524
530
  --rel-action-info-subtle: var(--rel-colors-blue-50);
525
- --rel-action-info-subtle-hover: var(--rel-colors-blue-100);
526
- --rel-action-info-subtle-dragged: var(--rel-colors-blue-200);
531
+ --rel-action-info-subtle-hover: var(--rel-colors-blue-50);
532
+ --rel-action-info-subtle-dragged: var(--rel-colors-blue-100);
527
533
  --rel-action-info-label-icons-fill: var(--rel-colors-gray-0);
528
534
  --rel-action-info-label-icons-subtle: var(--rel-colors-blue-700);
529
535
  --rel-action-info-label-icons-subtle-hover: var(--rel-colors-blue-700);
@@ -542,7 +548,7 @@
542
548
  --rel-shadows-shadow-300: 0px 4px 10px rgba(0,0,0,0.65);
543
549
  --rel-shadows-shadow-400: 0px 6px 16px rgba(0,0,0,0.7);
544
550
  --rel-shadows-shadow-500: 0px 10px 24px rgba(0,0,0,0.75);
545
- --rel-overlay-scrim: rgba(0,0,0,0.6);
551
+ --rel-overlay-scrim: var(--rel-bg-overlay-scrim);
546
552
 
547
553
  /* ==================== SEMANTIC — DARK (overrides) ==================== */
548
554
  --rel-bg-static-dark: var(--rel-colors-gray-800);
@@ -566,12 +572,13 @@
566
572
  --rel-bg-info-strong: var(--rel-colors-blue-100);
567
573
  --rel-bg-success-light: var(--rel-colors-green-900);
568
574
  --rel-bg-success-strong: var(--rel-colors-green-100);
575
+ --rel-bg-overlay-scrim: var(--rel-colors-dark-alpha-10);
569
576
  --rel-text-default: var(--rel-colors-gray-0);
570
577
  --rel-text-label: var(--rel-colors-gray-200);
571
- --rel-text-body: var(--rel-colors-gray-300);
578
+ --rel-text-body: var(--rel-colors-gray-200);
572
579
  --rel-text-caption: var(--rel-colors-gray-300);
573
- --rel-text-placeholder: var(--rel-colors-gray-300);
574
- --rel-text-disabled: var(--rel-colors-gray-400);
580
+ --rel-text-placeholder: var(--rel-colors-gray-400);
581
+ --rel-text-disabled: var(--rel-colors-gray-500);
575
582
  --rel-text-inverse: var(--rel-colors-gray-950);
576
583
  --rel-text-danger: var(--rel-colors-red-300);
577
584
  --rel-text-warning: var(--rel-colors-yellow-400);
@@ -579,7 +586,7 @@
579
586
  --rel-text-success: var(--rel-colors-green-300);
580
587
  --rel-border-default: var(--rel-colors-gray-700);
581
588
  --rel-border-subtle: var(--rel-colors-gray-800);
582
- --rel-border-accent: var(--rel-colors-gray-400);
589
+ --rel-border-accent: var(--rel-colors-gray-500);
583
590
  --rel-border-strong: var(--rel-colors-gray-0);
584
591
  --rel-border-inverse: var(--rel-colors-gray-950);
585
592
  --rel-border-success-subtle: var(--rel-colors-green-800);
@@ -595,29 +602,31 @@
595
602
  --rel-border-focus-subtle: var(--rel-colors-gray-700);
596
603
  --rel-border-focus-inner: var(--rel-colors-gray-900);
597
604
  --rel-action-overlay-hover: var(--rel-colors-light-alpha-1);
598
- --rel-action-overlay-pressed: var(--rel-colors-light-alpha-2);
605
+ --rel-action-overlay-hover-strong: var(--rel-colors-light-alpha-2);
606
+ --rel-action-overlay-pressed: var(--rel-colors-light-alpha-3);
607
+ --rel-action-overlay-dragged: var(--rel-colors-light-alpha-6);
608
+ --rel-action-overlay-hover-inverse: var(--rel-colors-dark-alpha-4);
599
609
  --rel-action-neutral-fill: var(--rel-colors-gray-0);
600
610
  --rel-action-neutral-fill-hover: var(--rel-colors-gray-50);
601
611
  --rel-action-neutral-fill-dragged: var(--rel-colors-gray-100);
602
612
  --rel-action-neutral-subtle: var(--rel-colors-gray-700);
603
- --rel-action-neutral-subtle-hover: var(--rel-colors-gray-600);
604
- --rel-action-neutral-subtle-dragged: var(--rel-colors-gray-500);
613
+ --rel-action-neutral-subtle-hover: var(--rel-colors-gray-700);
614
+ --rel-action-neutral-subtle-dragged: var(--rel-colors-gray-600);
605
615
  --rel-action-neutral-ghost-hover: var(--rel-colors-light-alpha-1);
606
616
  --rel-action-neutral-label-icons-fill-inverse: var(--rel-colors-gray-950);
607
617
  --rel-action-neutral-label-icons-subtle: var(--rel-colors-gray-0);
608
618
  --rel-action-neutral-label-icons-outline: var(--rel-colors-gray-0);
609
619
  --rel-action-neutral-label-icons-ghost: var(--rel-colors-gray-0);
610
620
  --rel-action-neutral-label-icons-link: var(--rel-colors-gray-0);
611
- --rel-action-neutral-label-icons-link-hover: var(--rel-colors-gray-300);
621
+ --rel-action-neutral-label-icons-link-hover: var(--rel-colors-gray-0);
612
622
  --rel-action-neutral-border-subtle-hover: var(--rel-colors-gray-600);
613
623
  --rel-action-neutral-border-subtle-dragged: var(--rel-colors-gray-500);
614
624
  --rel-action-neutral-border-outline: var(--rel-colors-gray-400);
615
625
  --rel-action-neutral-border-outline-hover: var(--rel-colors-gray-0);
616
626
  --rel-action-brand-fill-disabled: var(--rel-colors-gray-600);
617
- --rel-action-brand-label-icons-primary-disabled: var(--rel-colors-gray-0);
618
627
  --rel-action-danger-subtle: var(--rel-colors-red-900);
619
- --rel-action-danger-subtle-hover: var(--rel-colors-red-800);
620
- --rel-action-danger-subtle-dragged: var(--rel-colors-red-700);
628
+ --rel-action-danger-subtle-hover: var(--rel-colors-red-900);
629
+ --rel-action-danger-subtle-dragged: var(--rel-colors-red-800);
621
630
  --rel-action-danger-outline-hover: var(--rel-colors-red-900);
622
631
  --rel-action-danger-ghost-hover: var(--rel-colors-red-900);
623
632
  --rel-action-danger-label-icons-subtle: var(--rel-colors-red-100);
@@ -634,16 +643,19 @@
634
643
  --rel-action-warning-fill: var(--rel-colors-yellow-500);
635
644
  --rel-action-warning-fill-dragged: var(--rel-colors-yellow-400);
636
645
  --rel-action-warning-subtle: var(--rel-colors-yellow-900);
637
- --rel-action-warning-subtle-hover: var(--rel-colors-yellow-800);
638
- --rel-action-warning-subtle-dragged: var(--rel-colors-yellow-700);
646
+ --rel-action-warning-subtle-hover: var(--rel-colors-yellow-900);
647
+ --rel-action-warning-subtle-dragged: var(--rel-colors-yellow-800);
639
648
  --rel-action-warning-label-icons-subtle: var(--rel-colors-yellow-100);
640
649
  --rel-action-warning-label-icons-subtle-hover: var(--rel-colors-yellow-100);
641
650
  --rel-action-warning-label-icons-subtle-dragged: var(--rel-colors-yellow-50);
642
651
  --rel-action-warning-border-subtle-hover: var(--rel-colors-yellow-800);
643
652
  --rel-action-warning-border-subtle-dragged: var(--rel-colors-yellow-700);
653
+ --rel-action-success-fill: var(--rel-colors-green-600);
654
+ --rel-action-success-fill-hover: var(--rel-colors-green-700);
655
+ --rel-action-success-fill-dragged: var(--rel-colors-green-500);
644
656
  --rel-action-success-subtle: var(--rel-colors-green-900);
645
- --rel-action-success-subtle-hover: var(--rel-colors-green-800);
646
- --rel-action-success-subtle-dragged: var(--rel-colors-green-700);
657
+ --rel-action-success-subtle-hover: var(--rel-colors-green-900);
658
+ --rel-action-success-subtle-dragged: var(--rel-colors-green-800);
647
659
  --rel-action-success-outline-hover: var(--rel-colors-green-700);
648
660
  --rel-action-success-ghost-hover: var(--rel-colors-green-900);
649
661
  --rel-action-success-label-icons-subtle: var(--rel-colors-green-100);
@@ -651,9 +663,12 @@
651
663
  --rel-action-success-label-icons-subtle-dragged: var(--rel-colors-green-50);
652
664
  --rel-action-success-border-subtle-hover: var(--rel-colors-green-800);
653
665
  --rel-action-success-border-subtle-dragged: var(--rel-colors-green-700);
666
+ --rel-action-info-fill: var(--rel-colors-blue-600);
667
+ --rel-action-info-fill-hover: var(--rel-colors-blue-700);
668
+ --rel-action-info-fill-dragged: var(--rel-colors-blue-500);
654
669
  --rel-action-info-subtle: var(--rel-colors-blue-900);
655
- --rel-action-info-subtle-hover: var(--rel-colors-blue-800);
656
- --rel-action-info-subtle-dragged: var(--rel-colors-blue-700);
670
+ --rel-action-info-subtle-hover: var(--rel-colors-blue-900);
671
+ --rel-action-info-subtle-dragged: var(--rel-colors-blue-800);
657
672
  --rel-action-info-label-icons-subtle: var(--rel-colors-blue-100);
658
673
  --rel-action-info-label-icons-subtle-hover: var(--rel-colors-blue-100);
659
674
  --rel-action-info-label-icons-subtle-dragged: var(--rel-colors-blue-50);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@reliability-design/web",
3
- "version": "1.4.7",
3
+ "version": "1.4.9",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.mjs",
6
6
  "types": "dist/index.d.ts",