@salt-ds/core 1.51.0 → 1.52.1

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 (17) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/css/salt-core.css +156 -281
  3. package/dist-cjs/banner/Banner.js +0 -1
  4. package/dist-cjs/banner/Banner.js.map +1 -1
  5. package/dist-cjs/button/Button.css.js +1 -1
  6. package/dist-cjs/pill/Pill.css.js +1 -1
  7. package/dist-cjs/pill-input/PillInput.js +2 -1
  8. package/dist-cjs/pill-input/PillInput.js.map +1 -1
  9. package/dist-cjs/toggle-button/ToggleButton.css.js +1 -1
  10. package/dist-es/banner/Banner.js +0 -1
  11. package/dist-es/banner/Banner.js.map +1 -1
  12. package/dist-es/button/Button.css.js +1 -1
  13. package/dist-es/pill/Pill.css.js +1 -1
  14. package/dist-es/pill-input/PillInput.js +2 -1
  15. package/dist-es/pill-input/PillInput.js.map +1 -1
  16. package/dist-es/toggle-button/ToggleButton.css.js +1 -1
  17. package/package.json +1 -1
package/css/salt-core.css CHANGED
@@ -395,19 +395,16 @@
395
395
  color: var(--saltButton-text-color-hover, var(--button-text-color-hover));
396
396
  border-color: var(--saltButton-borderColor-hover, var(--button-borderColor-hover));
397
397
  }
398
- .saltButton.saltButton-active:focus-visible,
399
- .saltButton:focus-visible:active {
400
- background: var(--saltButton-background-active-hover, var(--button-background));
401
- color: var(--saltButton-text-color-active-hover, var(--button-text-color));
402
- border-color: var(--saltButton-borderColor-hover, var(--button-borderColor-hover));
403
- cursor: var(--salt-cursor-active);
404
- }
405
- .saltButton:hover {
406
- background: var(--saltButton-background-hover, var(--button-background-hover));
407
- color: var(--saltButton-text-color-hover, var(--button-text-color-hover));
408
- border-color: var(--saltButton-borderColor-hover, var(--button-borderColor-hover));
409
- cursor: var(--salt-cursor-hover);
398
+ @media (hover: hover) {
399
+ .saltButton:hover {
400
+ background: var(--saltButton-background-hover, var(--button-background-hover));
401
+ color: var(--saltButton-text-color-hover, var(--button-text-color-hover));
402
+ border-color: var(--saltButton-borderColor-hover, var(--button-borderColor-hover));
403
+ cursor: var(--salt-cursor-hover);
404
+ }
410
405
  }
406
+ .saltButton.saltButton-active:focus-visible,
407
+ .saltButton:focus-visible:active,
411
408
  .saltButton:active,
412
409
  .saltButton.saltButton-active {
413
410
  background: var(--saltButton-background-active, var(--button-background-active));
@@ -422,299 +419,240 @@
422
419
  border-color: var(--saltButton-borderColor-active, var(--button-borderColor-active));
423
420
  }
424
421
  .saltButton:disabled,
425
- .saltButton-disabled,
426
- .saltButton-disabled:active,
427
- .saltButton-disabled:focus-visible,
428
- .saltButton-disabled:focus-visible:active,
429
- .saltButton-disabled:hover {
430
- background: var(--saltButton-background-disabled, var(--button-background-disabled));
431
- color: var(--saltButton-text-color-disabled, var(--button-text-color-disabled));
422
+ .saltButton.saltButton-disabled,
423
+ .saltButton.saltButton-disabled:active,
424
+ .saltButton.saltButton-disabled:focus-visible,
425
+ .saltButton.saltButton-disabled:focus-visible:active,
426
+ .saltButton.saltButton-disabled:hover {
427
+ background: var(--saltButton-background-disabled, var(--button-background));
428
+ color: var(--saltButton-text-color-disabled, var(--button-text-color));
432
429
  cursor: var(--saltButton-cursor-disabled, var(--salt-cursor-disabled));
433
- border-color: var(--saltButton-borderColor-disabled, var(--button-borderColor-disabled));
430
+ border-color: var(--saltButton-borderColor-disabled, var(--button-borderColor));
431
+ opacity: 0.4;
434
432
  }
435
433
  .saltButton-accented.saltButton-solid {
436
434
  --button-text-color: var(--salt-actionable-accented-bold-foreground);
437
435
  --button-text-color-hover: var(--salt-actionable-accented-bold-foreground-hover);
438
436
  --button-text-color-active: var(--salt-actionable-accented-bold-foreground-active);
439
- --button-text-color-disabled: var(--salt-actionable-accented-bold-foreground-disabled);
440
437
  --button-background: var(--salt-actionable-accented-bold-background);
441
438
  --button-background-active: var(--salt-actionable-accented-bold-background-active);
442
- --button-background-disabled: var(--salt-actionable-accented-bold-background-disabled);
443
439
  --button-background-hover: var(--salt-actionable-accented-bold-background-hover);
444
440
  --button-borderColor: var(--salt-actionable-accented-bold-borderColor);
445
441
  --button-borderColor-hover: var(--salt-actionable-accented-bold-borderColor-hover);
446
442
  --button-borderColor-active: var(--salt-actionable-accented-bold-borderColor-active);
447
- --button-borderColor-disabled: var(--salt-actionable-accented-bold-borderColor-disabled);
448
443
  }
449
444
  .saltButton-accented.saltButton-bordered {
450
445
  --button-text-color: var(--salt-actionable-accented-foreground);
451
446
  --button-text-color-hover: var(--salt-actionable-accented-foreground-hover);
452
447
  --button-text-color-active: var(--salt-actionable-accented-foreground-active);
453
- --button-text-color-disabled: var(--salt-actionable-accented-foreground-disabled);
454
448
  --button-background: var(--salt-actionable-accented-background);
455
449
  --button-background-hover: var(--salt-actionable-accented-background-hover);
456
450
  --button-background-active: var(--salt-actionable-accented-background-active);
457
- --button-background-disabled: var(--salt-actionable-accented-background-disabled);
458
451
  --button-borderColor: var(--salt-actionable-accented-borderColor);
459
452
  --button-borderColor-hover: var(--salt-actionable-accented-borderColor-hover);
460
453
  --button-borderColor-active: var(--salt-actionable-accented-borderColor-active);
461
- --button-borderColor-disabled: var(--salt-actionable-accented-borderColor-disabled);
462
454
  }
463
455
  .saltButton-accented.saltButton-transparent {
464
456
  --button-text-color: var(--salt-actionable-accented-subtle-foreground);
465
457
  --button-text-color-hover: var(--salt-actionable-accented-subtle-foreground-hover);
466
458
  --button-text-color-active: var(--salt-actionable-accented-subtle-foreground-active);
467
- --button-text-color-disabled: var(--salt-actionable-accented-subtle-foreground-disabled);
468
459
  --button-background: var(--salt-actionable-accented-subtle-background);
469
460
  --button-background-hover: var(--salt-actionable-accented-subtle-background-hover);
470
461
  --button-background-active: var(--salt-actionable-accented-subtle-background-active);
471
- --button-background-disabled: var(--salt-actionable-accented-subtle-background-disabled);
472
462
  --button-borderColor: var(--salt-actionable-accented-subtle-borderColor);
473
463
  --button-borderColor-hover: var(--salt-actionable-accented-subtle-borderColor-hover);
474
464
  --button-borderColor-active: var(--salt-actionable-accented-subtle-borderColor-active);
475
- --button-borderColor-disabled: var(--salt-actionable-accented-subtle-borderColor-disabled);
476
465
  }
477
466
  .saltButton-accented.saltButton-loading {
478
467
  --button-text-color: var(--salt-actionable-accented-background);
479
468
  --button-text-color-hover: var(--salt-actionable-accented-background);
480
469
  --button-text-color-active: var(--salt-actionable-accented-background);
481
- --button-text-color-disabled: var(--salt-actionable-accented-background);
482
470
  --button-background: var(--salt-actionable-accented-background);
483
471
  --button-background-hover: var(--salt-actionable-accented-background);
484
472
  --button-background-active: var(--salt-actionable-accented-background);
485
- --button-background-disabled: var(--salt-actionable-accented-background);
486
473
  --button-borderColor: var(--salt-actionable-accented-borderColor);
487
474
  --button-borderColor-hover: var(--salt-actionable-accented-borderColor);
488
475
  --button-borderColor-active: var(--salt-actionable-accented-borderColor);
489
- --button-borderColor-disabled: var(--salt-actionable-accented-borderColor);
490
476
  cursor: var(--salt-cursor-pending);
491
477
  }
492
478
  .saltButton-neutral.saltButton-solid {
493
479
  --button-text-color: var(--salt-actionable-bold-foreground);
494
480
  --button-text-color-hover: var(--salt-actionable-bold-foreground-hover);
495
481
  --button-text-color-active: var(--salt-actionable-bold-foreground-active);
496
- --button-text-color-disabled: var(--salt-actionable-bold-foreground-disabled);
497
482
  --button-background: var(--salt-actionable-bold-background);
498
483
  --button-background-hover: var(--salt-actionable-bold-background-hover);
499
484
  --button-background-active: var(--salt-actionable-bold-background-active);
500
- --button-background-disabled: var(--salt-actionable-bold-background-disabled);
501
485
  --button-borderColor: var(--salt-actionable-bold-borderColor);
502
486
  --button-borderColor-hover: var(--salt-actionable-bold-borderColor-hover);
503
487
  --button-borderColor-active: var(--salt-actionable-bold-borderColor-active);
504
- --button-borderColor-disabled: var(--salt-actionable-bold-borderColor-disabled);
505
488
  }
506
489
  .saltButton-neutral.saltButton-bordered {
507
490
  --button-text-color: var(--salt-actionable-foreground);
508
491
  --button-text-color-hover: var(--salt-actionable-foreground-hover);
509
492
  --button-text-color-active: var(--salt-actionable-foreground-active);
510
- --button-text-color-disabled: var(--salt-actionable-foreground-disabled);
511
493
  --button-background: var(--salt-actionable-background);
512
494
  --button-background-hover: var(--salt-actionable-background-hover);
513
495
  --button-background-active: var(--salt-actionable-background-active);
514
- --button-background-disabled: var(--salt-actionable-background-disabled);
515
496
  --button-borderColor: var(--salt-actionable-borderColor);
516
497
  --button-borderColor-hover: var(--salt-actionable-borderColor-hover);
517
498
  --button-borderColor-active: var(--salt-actionable-borderColor-active);
518
- --button-borderColor-disabled: var(--salt-actionable-borderColor-disabled);
519
499
  }
520
500
  .saltButton-neutral.saltButton-transparent {
521
501
  --button-text-color: var(--salt-actionable-subtle-foreground);
522
502
  --button-text-color-hover: var(--salt-actionable-subtle-foreground-hover);
523
503
  --button-text-color-active: var(--salt-actionable-subtle-foreground-active);
524
- --button-text-color-disabled: var(--salt-actionable-subtle-foreground-disabled);
525
504
  --button-background: var(--salt-actionable-subtle-background);
526
505
  --button-background-hover: var(--salt-actionable-subtle-background-hover);
527
506
  --button-background-active: var(--salt-actionable-subtle-background-active);
528
- --button-background-disabled: var(--salt-actionable-subtle-background-disabled);
529
507
  --button-borderColor: var(--salt-actionable-subtle-borderColor);
530
508
  --button-borderColor-hover: var(--salt-actionable-subtle-borderColor-hover);
531
509
  --button-borderColor-active: var(--salt-actionable-subtle-borderColor-active);
532
- --button-borderColor-disabled: var(--salt-actionable-subtle-borderColor-disabled);
533
510
  }
534
511
  .saltButton-neutral.saltButton-loading {
535
512
  --button-text-color: var(--salt-actionable-background);
536
513
  --button-text-color-hover: var(--salt-actionable-background);
537
514
  --button-text-color-active: var(--salt-actionable-background);
538
- --button-text-color-disabled: var(--salt-actionable-background);
539
515
  --button-background: var(--salt-actionable-background);
540
516
  --button-background-hover: var(--salt-actionable-background);
541
517
  --button-background-active: var(--salt-actionable-background);
542
- --button-background-disabled: var(--salt-actionable-background);
543
518
  --button-borderColor: var(--salt-actionable-borderColor);
544
519
  --button-borderColor-hover: var(--salt-actionable-borderColor);
545
520
  --button-borderColor-active: var(--salt-actionable-borderColor);
546
- --button-borderColor-disabled: var(--salt-actionable-borderColor);
547
521
  cursor: var(--salt-cursor-pending);
548
522
  }
549
523
  .saltButton-negative.saltButton-solid {
550
524
  --button-text-color: var(--salt-actionable-negative-bold-foreground);
551
525
  --button-text-color-hover: var(--salt-actionable-negative-bold-foreground-hover);
552
526
  --button-text-color-active: var(--salt-actionable-negative-bold-foreground-active);
553
- --button-text-color-disabled: var(--salt-actionable-negative-bold-foreground-disabled);
554
527
  --button-background: var(--salt-actionable-negative-bold-background);
555
528
  --button-background-hover: var(--salt-actionable-negative-bold-background-hover);
556
529
  --button-background-active: var(--salt-actionable-negative-bold-background-active);
557
- --button-background-disabled: var(--salt-actionable-negative-bold-background-disabled);
558
530
  --button-borderColor: var(--salt-actionable-negative-bold-borderColor);
559
531
  --button-borderColor-hover: var(--salt-actionable-negative-bold-borderColor-hover);
560
532
  --button-borderColor-active: var(--salt-actionable-negative-bold-borderColor-active);
561
- --button-borderColor-disabled: var(--salt-actionable-negative-bold-borderColor-disabled);
562
533
  }
563
534
  .saltButton-negative.saltButton-bordered {
564
535
  --button-text-color: var(--salt-actionable-negative-foreground);
565
536
  --button-text-color-hover: var(--salt-actionable-negative-foreground-hover);
566
537
  --button-text-color-active: var(--salt-actionable-negative-foreground-active);
567
- --button-text-color-disabled: var(--salt-actionable-negative-foreground-disabled);
568
538
  --button-background: var(--salt-actionable-negative-background);
569
539
  --button-background-hover: var(--salt-actionable-negative-background-hover);
570
540
  --button-background-active: var(--salt-actionable-negative-background-active);
571
- --button-background-disabled: var(--salt-actionable-negative-background-disabled);
572
541
  --button-borderColor: var(--salt-actionable-negative-borderColor);
573
542
  --button-borderColor-hover: var(--salt-actionable-negative-borderColor-hover);
574
543
  --button-borderColor-active: var(--salt-actionable-negative-borderColor-active);
575
- --button-borderColor-disabled: var(--salt-actionable-negative-borderColor-disabled);
576
544
  }
577
545
  .saltButton-negative.saltButton-transparent {
578
546
  --button-text-color: var(--salt-actionable-negative-subtle-foreground);
579
547
  --button-text-color-hover: var(--salt-actionable-negative-subtle-foreground-hover);
580
548
  --button-text-color-active: var(--salt-actionable-negative-subtle-foreground-active);
581
- --button-text-color-disabled: var(--salt-actionable-negative-subtle-foreground-disabled);
582
549
  --button-background: var(--salt-actionable-negative-subtle-background);
583
550
  --button-background-hover: var(--salt-actionable-negative-subtle-background-hover);
584
551
  --button-background-active: var(--salt-actionable-negative-subtle-background-active);
585
- --button-background-disabled: var(--salt-actionable-negative-subtle-background-disabled);
586
552
  --button-borderColor: var(--salt-actionable-negative-subtle-borderColor);
587
553
  --button-borderColor-hover: var(--salt-actionable-negative-subtle-borderColor-hover);
588
554
  --button-borderColor-active: var(--salt-actionable-negative-subtle-borderColor-active);
589
- --button-borderColor-disabled: var(--salt-actionable-negative-subtle-borderColor-disabled);
590
555
  }
591
556
  .saltButton-negative.saltButton-loading {
592
557
  --button-text-color: var(--salt-actionable-negative-background);
593
558
  --button-text-color-hover: var(--salt-actionable-negative-background);
594
559
  --button-text-color-active: var(--salt-actionable-negative-background);
595
- --button-text-color-disabled: var(--salt-actionable-negative-background);
596
560
  --button-background: var(--salt-actionable-negative-background);
597
561
  --button-background-hover: var(--salt-actionable-negative-background);
598
562
  --button-background-active: var(--salt-actionable-negative-background);
599
- --button-background-disabled: var(--salt-actionable-negative-background);
600
563
  --button-borderColor: var(--salt-actionable-negative-borderColor);
601
564
  --button-borderColor-hover: var(--salt-actionable-negative-borderColor);
602
565
  --button-borderColor-active: var(--salt-actionable-negative-borderColor);
603
- --button-borderColor-disabled: var(--salt-actionable-negative-borderColor);
604
566
  cursor: var(--salt-cursor-pending);
605
567
  }
606
568
  .saltButton-positive.saltButton-solid {
607
569
  --button-text-color: var(--salt-actionable-positive-bold-foreground);
608
570
  --button-text-color-hover: var(--salt-actionable-positive-bold-foreground-hover);
609
571
  --button-text-color-active: var(--salt-actionable-positive-bold-foreground-active);
610
- --button-text-color-disabled: var(--salt-actionable-positive-bold-foreground-disabled);
611
572
  --button-background: var(--salt-actionable-positive-bold-background);
612
573
  --button-background-hover: var(--salt-actionable-positive-bold-background-hover);
613
574
  --button-background-active: var(--salt-actionable-positive-bold-background-active);
614
- --button-background-disabled: var(--salt-actionable-positive-bold-background-disabled);
615
575
  --button-borderColor: var(--salt-actionable-positive-bold-borderColor);
616
576
  --button-borderColor-hover: var(--salt-actionable-positive-bold-borderColor-hover);
617
577
  --button-borderColor-active: var(--salt-actionable-positive-bold-borderColor-active);
618
- --button-borderColor-disabled: var(--salt-actionable-positive-bold-borderColor-disabled);
619
578
  }
620
579
  .saltButton-positive.saltButton-bordered {
621
580
  --button-text-color: var(--salt-actionable-positive-foreground);
622
581
  --button-text-color-hover: var(--salt-actionable-positive-foreground-hover);
623
582
  --button-text-color-active: var(--salt-actionable-positive-foreground-active);
624
- --button-text-color-disabled: var(--salt-actionable-positive-foreground-disabled);
625
583
  --button-background: var(--salt-actionable-positive-background);
626
584
  --button-background-hover: var(--salt-actionable-positive-background-hover);
627
585
  --button-background-active: var(--salt-actionable-positive-background-active);
628
- --button-background-disabled: var(--salt-actionable-positive-background-disabled);
629
586
  --button-borderColor: var(--salt-actionable-positive-borderColor);
630
587
  --button-borderColor-hover: var(--salt-actionable-positive-borderColor-hover);
631
588
  --button-borderColor-active: var(--salt-actionable-positive-borderColor-active);
632
- --button-borderColor-disabled: var(--salt-actionable-positive-borderColor-disabled);
633
589
  }
634
590
  .saltButton-positive.saltButton-transparent {
635
591
  --button-text-color: var(--salt-actionable-positive-subtle-foreground);
636
592
  --button-text-color-hover: var(--salt-actionable-positive-subtle-foreground-hover);
637
593
  --button-text-color-active: var(--salt-actionable-positive-subtle-foreground-active);
638
- --button-text-color-disabled: var(--salt-actionable-positive-subtle-foreground-disabled);
639
594
  --button-background: var(--salt-actionable-positive-subtle-background);
640
595
  --button-background-hover: var(--salt-actionable-positive-subtle-background-hover);
641
596
  --button-background-active: var(--salt-actionable-positive-subtle-background-active);
642
- --button-background-disabled: var(--salt-actionable-positive-subtle-background-disabled);
643
597
  --button-borderColor: var(--salt-actionable-positive-subtle-borderColor);
644
598
  --button-borderColor-hover: var(--salt-actionable-positive-subtle-borderColor-hover);
645
599
  --button-borderColor-active: var(--salt-actionable-positive-subtle-borderColor-active);
646
- --button-borderColor-disabled: var(--salt-actionable-positive-subtle-borderColor-disabled);
647
600
  }
648
601
  .saltButton-positive.saltButton-loading {
649
602
  --button-text-color: var(--salt-actionable-positive-background);
650
603
  --button-text-color-hover: var(--salt-actionable-positive-background);
651
604
  --button-text-color-active: var(--salt-actionable-positive-background);
652
- --button-text-color-disabled: var(--salt-actionable-positive-background);
653
605
  --button-background: var(--salt-actionable-positive-background);
654
606
  --button-background-hover: var(--salt-actionable-positive-background);
655
607
  --button-background-active: var(--salt-actionable-positive-background);
656
- --button-background-disabled: var(--salt-actionable-positive-background);
657
608
  --button-borderColor: var(--salt-actionable-positive-borderColor);
658
609
  --button-borderColor-hover: var(--salt-actionable-positive-borderColor);
659
610
  --button-borderColor-active: var(--salt-actionable-positive-borderColor);
660
- --button-borderColor-disabled: var(--salt-actionable-positive-borderColor);
661
611
  cursor: var(--salt-cursor-pending);
662
612
  }
663
613
  .saltButton-caution.saltButton-solid {
664
614
  --button-text-color: var(--salt-actionable-caution-bold-foreground);
665
615
  --button-text-color-hover: var(--salt-actionable-caution-bold-foreground-hover);
666
616
  --button-text-color-active: var(--salt-actionable-caution-bold-foreground-active);
667
- --button-text-color-disabled: var(--salt-actionable-caution-bold-foreground-disabled);
668
617
  --button-background: var(--salt-actionable-caution-bold-background);
669
618
  --button-background-hover: var(--salt-actionable-caution-bold-background-hover);
670
619
  --button-background-active: var(--salt-actionable-caution-bold-background-active);
671
- --button-background-disabled: var(--salt-actionable-caution-bold-background-disabled);
672
620
  --button-borderColor: var(--salt-actionable-caution-bold-borderColor);
673
621
  --button-borderColor-hover: var(--salt-actionable-caution-bold-borderColor-hover);
674
622
  --button-borderColor-active: var(--salt-actionable-caution-bold-borderColor-active);
675
- --button-borderColor-disabled: var(--salt-actionable-caution-bold-borderColor-disabled);
676
623
  }
677
624
  .saltButton-caution.saltButton-bordered {
678
625
  --button-text-color: var(--salt-actionable-caution-foreground);
679
626
  --button-text-color-hover: var(--salt-actionable-caution-foreground-hover);
680
627
  --button-text-color-active: var(--salt-actionable-caution-foreground-active);
681
- --button-text-color-disabled: var(--salt-actionable-caution-foreground-disabled);
682
628
  --button-background: var(--salt-actionable-caution-background);
683
629
  --button-background-hover: var(--salt-actionable-caution-background-hover);
684
630
  --button-background-active: var(--salt-actionable-caution-background-active);
685
- --button-background-disabled: var(--salt-actionable-caution-background-disabled);
686
631
  --button-borderColor: var(--salt-actionable-caution-borderColor);
687
632
  --button-borderColor-hover: var(--salt-actionable-caution-borderColor-hover);
688
633
  --button-borderColor-active: var(--salt-actionable-caution-borderColor-active);
689
- --button-borderColor-disabled: var(--salt-actionable-caution-borderColor-disabled);
690
634
  }
691
635
  .saltButton-caution.saltButton-transparent {
692
636
  --button-text-color: var(--salt-actionable-caution-subtle-foreground);
693
637
  --button-text-color-hover: var(--salt-actionable-caution-subtle-foreground-hover);
694
638
  --button-text-color-active: var(--salt-actionable-caution-subtle-foreground-active);
695
- --button-text-color-disabled: var(--salt-actionable-caution-subtle-foreground-disabled);
696
639
  --button-background: var(--salt-actionable-caution-subtle-background);
697
640
  --button-background-hover: var(--salt-actionable-caution-subtle-background-hover);
698
641
  --button-background-active: var(--salt-actionable-caution-subtle-background-active);
699
- --button-background-disabled: var(--salt-actionable-caution-subtle-background-disabled);
700
642
  --button-borderColor: var(--salt-actionable-caution-subtle-borderColor);
701
643
  --button-borderColor-hover: var(--salt-actionable-caution-subtle-borderColor-hover);
702
644
  --button-borderColor-active: var(--salt-actionable-caution-subtle-borderColor-active);
703
- --button-borderColor-disabled: var(--salt-actionable-caution-subtle-borderColor-disabled);
704
645
  }
705
646
  .saltButton-caution.saltButton-loading {
706
647
  --button-text-color: var(--salt-actionable-caution-background);
707
648
  --button-text-color-hover: var(--salt-actionable-caution-background);
708
649
  --button-text-color-active: var(--salt-actionable-caution-background);
709
- --button-text-color-disabled: var(--salt-actionable-caution-background);
710
650
  --button-background: var(--salt-actionable-caution-background);
711
651
  --button-background-hover: var(--salt-actionable-caution-background);
712
652
  --button-background-active: var(--salt-actionable-caution-background);
713
- --button-background-disabled: var(--salt-actionable-caution-background);
714
653
  --button-borderColor: var(--salt-actionable-caution-borderColor);
715
654
  --button-borderColor-hover: var(--salt-actionable-caution-borderColor);
716
655
  --button-borderColor-active: var(--salt-actionable-caution-borderColor);
717
- --button-borderColor-disabled: var(--salt-actionable-caution-borderColor);
718
656
  cursor: var(--salt-cursor-pending);
719
657
  }
720
658
  .saltButton strong {
@@ -3087,10 +3025,11 @@ a:focus .saltCard-interactable.saltCard-disabled {
3087
3025
  }
3088
3026
  .saltPill:disabled,
3089
3027
  .saltPill:disabled:hover {
3090
- --pill-color: var(--salt-actionable-bold-foreground-disabled);
3091
- --pill-background: var(--salt-actionable-bold-background-disabled);
3092
- --pill-borderColor: var(--salt-actionable-bold-borderColor-disabled);
3028
+ --pill-color: var(--salt-actionable-bold-foreground);
3029
+ --pill-background: var(--salt-actionable-bold-background);
3030
+ --pill-borderColor: var(--salt-actionable-bold-borderColor);
3093
3031
  cursor: var(--salt-cursor-disabled);
3032
+ opacity: 0.4;
3094
3033
  }
3095
3034
 
3096
3035
  /* src/pill-input/PillInput.css */
@@ -4375,7 +4314,7 @@ label.saltText small,
4375
4314
  border-radius: var(--salt-palette-corner-weak, 0);
4376
4315
  box-sizing: border-box;
4377
4316
  color: var(--toggleButton-text-color);
4378
- cursor: pointer;
4317
+ cursor: var(--salt-cursor-hover);
4379
4318
  display: inline-flex;
4380
4319
  gap: var(--salt-spacing-50);
4381
4320
  height: var(--salt-size-base);
@@ -4406,10 +4345,17 @@ label.saltText small,
4406
4345
  color: var(--toggleButton-text-color-hover);
4407
4346
  border-color: var(--toggleButton-borderColor-hover);
4408
4347
  }
4409
- .saltToggleButton:hover {
4410
- background: var(--toggleButton-background-hover);
4411
- color: var(--toggleButton-text-color-hover);
4412
- border-color: var(--toggleButton-borderColor-hover);
4348
+ @media (hover: hover) {
4349
+ .saltToggleButton:hover {
4350
+ background: var(--toggleButton-background-hover);
4351
+ color: var(--toggleButton-text-color-hover);
4352
+ border-color: var(--toggleButton-borderColor-hover);
4353
+ }
4354
+ }
4355
+ .saltToggleButton:active {
4356
+ background: var(--toggleButton-background-active);
4357
+ color: var(--toggleButton-text-color-active);
4358
+ border-color: var(--toggleButton-borderColor-active);
4413
4359
  }
4414
4360
  .saltToggleButton[aria-checked=true],
4415
4361
  .saltToggleButton[aria-pressed=true] {
@@ -4418,259 +4364,188 @@ label.saltText small,
4418
4364
  cursor: var(--salt-cursor-active);
4419
4365
  border-color: var(--toggleButton-borderColor-selected);
4420
4366
  }
4367
+ .saltToggleButton[aria-checked=true]:hover {
4368
+ cursor: unset;
4369
+ }
4370
+ .saltToggleButton[aria-pressed=true]:hover {
4371
+ border-color: var(--toggleButton-borderColor-selectedHover);
4372
+ }
4421
4373
  .saltToggleButton[aria-disabled=true] {
4422
- background: var(--toggleButton-background-disabled);
4423
- color: var(--toggleButton-text-color-disabled);
4374
+ background: var(--toggleButton-background);
4375
+ color: var(--toggleButton-text-color);
4424
4376
  cursor: var(--salt-cursor-disabled);
4425
- border-color: var(--toggleButton-borderColor-disabled);
4377
+ border-color: var(--toggleButton-borderColor);
4378
+ opacity: 0.4;
4426
4379
  }
4427
4380
  .saltToggleButton[aria-checked=true].saltToggleButton[aria-disabled=true],
4428
4381
  .saltToggleButton[aria-pressed=true].saltToggleButton[aria-disabled=true] {
4429
- background: var(--toggleButton-background-disabled-selected);
4430
- color: var(--toggleButton-text-color-disabled-selected);
4431
- border-color: var(--toggleButton-borderColor-disabled-selected);
4382
+ background: var(--toggleButton-background-selected);
4383
+ color: var(--toggleButton-text-color-selected);
4384
+ border-color: var(--toggleButton-borderColor-selected);
4432
4385
  }
4433
4386
  .saltToggleButton.saltToggleButton-readOnly {
4434
- background: var(--toggleButton-background-readonly);
4435
- color: var(--toggleButton-text-color-readonly);
4387
+ background: var(--toggleButton-background);
4388
+ color: var(--toggleButton-text-color);
4436
4389
  cursor: var(--salt-cursor-disabled);
4437
- border-color: var(--toggleButton-borderColor-readonly);
4390
+ border-color: var(--toggleButton-borderColor);
4391
+ opacity: 0.4;
4438
4392
  }
4439
4393
  .saltToggleButton[aria-checked=true].saltToggleButton-readOnly,
4440
4394
  .saltToggleButton[aria-pressed=true].saltToggleButton-readOnly {
4441
- background: var(--toggleButton-background-readonly-selected);
4442
- color: var(--toggleButton-text-color-readonly-selected);
4443
- border-color: var(--toggleButton-borderColor-readonly-selected);
4395
+ background: var(--toggleButton-background-selected);
4396
+ color: var(--toggleButton-text-color-selected);
4397
+ border-color: var(--toggleButton-borderColor-selected);
4398
+ opacity: unset;
4444
4399
  }
4445
4400
  .saltToggleButton-neutral.saltToggleButton-solid {
4446
4401
  --toggleButton-text-color: var(--salt-actionable-subtle-foreground);
4447
4402
  --toggleButton-text-color-hover: var(--salt-actionable-subtle-foreground-hover);
4448
- --toggleButton-text-color-selected: var(--salt-actionable-subtle-foreground-active);
4449
- --toggleButton-text-color-disabled: var(--salt-actionable-subtle-foreground-disabled);
4450
- --toggleButton-text-color-disabled-selected: var(--salt-actionable-bold-foreground-disabled);
4451
- --toggleButton-text-color-readonly: var(--salt-actionable-subtle-foreground-disabled);
4452
- --toggleButton-text-color-readonly-selected: var(--salt-actionable-subtle-foreground-active);
4403
+ --toggleButton-text-color-active: var(--salt-actionable-subtle-foreground-active);
4404
+ --toggleButton-text-color-selected: var(--salt-actionable-foreground-selected);
4453
4405
  --toggleButton-background: var(--salt-actionable-subtle-background);
4454
4406
  --toggleButton-background-hover: var(--salt-actionable-subtle-background-hover);
4455
- --toggleButton-background-selected: var(--salt-actionable-subtle-background-active);
4456
- --toggleButton-background-disabled: var(--salt-actionable-subtle-background-disabled);
4457
- --toggleButton-background-disabled-selected: var(--salt-actionable-bold-background-disabled);
4458
- --toggleButton-background-readonly: var(--salt-actionable-subtle-background-disabled);
4459
- --toggleButton-background-readonly-selected: var(--salt-actionable-subtle-background-active);
4407
+ --toggleButton-background-active: var(--salt-actionable-subtle-background-active);
4408
+ --toggleButton-background-selected: var(--salt-actionable-background-selected);
4460
4409
  --toggleButton-borderColor: var(--salt-actionable-subtle-borderColor);
4461
4410
  --toggleButton-borderColor-hover: var(--salt-actionable-subtle-borderColor-hover);
4462
- --toggleButton-borderColor-selected: var(--salt-actionable-subtle-borderColor-active);
4463
- --toggleButton-borderColor-disabled: var(--salt-actionable-subtle-borderColor-disabled);
4464
- --toggleButton-borderColor-disabled-selected: var(--salt-actionable-bold-borderColor-disabled);
4465
- --toggleButton-borderColor-readonly: var(--salt-actionable-subtle-borderColor-disabled);
4466
- --toggleButton-borderColor-readonly-selected: var(--salt-actionable-subtle-borderColor-active);
4411
+ --toggleButton-borderColor-active: var(--salt-actionable-subtle-borderColor-active);
4412
+ --toggleButton-borderColor-selected: var(--salt-actionable-borderColor-selected);
4413
+ --toggleButton-borderColor-selectedHover: var(--salt-actionable-bold-borderColor-hover);
4467
4414
  }
4468
4415
  .saltToggleButton-accented.saltToggleButton-solid {
4469
4416
  --toggleButton-text-color: var(--salt-actionable-accented-subtle-foreground);
4470
4417
  --toggleButton-text-color-hover: var(--salt-actionable-accented-subtle-foreground-hover);
4471
- --toggleButton-text-color-selected: var(--salt-actionable-accented-subtle-foreground-active);
4472
- --toggleButton-text-color-disabled: var(--salt-actionable-accented-subtle-foreground-disabled);
4473
- --toggleButton-text-color-disabled-selected: var(--salt-actionable-accented-bold-foreground-disabled);
4474
- --toggleButton-text-color-readonly: var(--salt-actionable-accented-subtle-foreground-disabled);
4475
- --toggleButton-text-color-readonly-selected: var(--salt-actionable-accented-subtle-foreground-active);
4418
+ --toggleButton-text-color-active: var(--salt-actionable-accented-subtle-foreground-active);
4419
+ --toggleButton-text-color-selected: var(--salt-actionable-accented-foreground-selected);
4476
4420
  --toggleButton-background: var(--salt-actionable-accented-subtle-background);
4477
4421
  --toggleButton-background-hover: var(--salt-actionable-accented-subtle-background-hover);
4478
- --toggleButton-background-selected: var(--salt-actionable-accented-subtle-background-active);
4479
- --toggleButton-background-disabled: var(--salt-actionable-accented-subtle-background-disabled);
4480
- --toggleButton-background-disabled-selected: var(--salt-actionable-accented-bold-background-disabled);
4481
- --toggleButton-background-readonly: var(--salt-actionable-accented-subtle-background-disabled);
4482
- --toggleButton-background-readonly-selected: var(--salt-actionable-accented-subtle-background-active);
4422
+ --toggleButton-background-active: var(--salt-actionable-accented-subtle-background-active);
4423
+ --toggleButton-background-selected: var(--salt-actionable-accented-background-selected);
4483
4424
  --toggleButton-borderColor: var(--salt-actionable-accented-subtle-borderColor);
4484
4425
  --toggleButton-borderColor-hover: var(--salt-actionable-accented-subtle-borderColor-hover);
4485
- --toggleButton-borderColor-selected: var(--salt-actionable-accented-subtle-borderColor-active);
4486
- --toggleButton-borderColor-disabled: var(--salt-actionable-accented-subtle-borderColor-disabled);
4487
- --toggleButton-borderColor-disabled-selected: var(--salt-actionable-accented-bold-borderColor-disabled);
4488
- --toggleButton-borderColor-readonly: var(--salt-actionable-accented-subtle-borderColor-disabled);
4489
- --toggleButton-borderColor-readonly-selected: var(--salt-actionable-accented-subtle-borderColor-active);
4426
+ --toggleButton-borderColor-active: var(--salt-actionable-accented-subtle-borderColor-active);
4427
+ --toggleButton-borderColor-selected: var(--salt-actionable-accented-borderColor-selected);
4428
+ --toggleButton-borderColor-selectedHover: var(--salt-actionable-accented-bold-borderColor-hover);
4490
4429
  }
4491
4430
  .saltToggleButton-positive.saltToggleButton-solid {
4492
4431
  --toggleButton-text-color: var(--salt-actionable-positive-subtle-foreground);
4493
4432
  --toggleButton-text-color-hover: var(--salt-actionable-positive-subtle-foreground-hover);
4494
- --toggleButton-text-color-selected: var(--salt-actionable-positive-subtle-foreground-active);
4495
- --toggleButton-text-color-disabled: var(--salt-actionable-positive-subtle-foreground-disabled);
4496
- --toggleButton-text-color-disabled-selected: var(--salt-actionable-positive-bold-foreground-disabled);
4497
- --toggleButton-text-color-readonly: var(--salt-actionable-positive-subtle-foreground-disabled);
4498
- --toggleButton-text-color-readonly-selected: var(--salt-actionable-positive-subtle-foreground-active);
4433
+ --toggleButton-text-color-active: var(--salt-actionable-positive-subtle-foreground-active);
4434
+ --toggleButton-text-color-selected: var(--salt-actionable-positive-foreground-selected);
4499
4435
  --toggleButton-background: var(--salt-actionable-positive-subtle-background);
4500
4436
  --toggleButton-background-hover: var(--salt-actionable-positive-subtle-background-hover);
4501
- --toggleButton-background-selected: var(--salt-actionable-positive-subtle-background-active);
4502
- --toggleButton-background-disabled: var(--salt-actionable-positive-subtle-background-disabled);
4503
- --toggleButton-background-disabled-selected: var(--salt-actionable-positive-bold-background-disabled);
4504
- --toggleButton-background-readonly: var(--salt-actionable-positive-subtle-background-disabled);
4505
- --toggleButton-background-readonly-selected: var(--salt-actionable-positive-subtle-background-active);
4437
+ --toggleButton-background-active: var(--salt-actionable-positive-subtle-background-active);
4438
+ --toggleButton-background-selected: var(--salt-actionable-positive-background-selected);
4506
4439
  --toggleButton-borderColor: var(--salt-actionable-positive-subtle-borderColor);
4507
4440
  --toggleButton-borderColor-hover: var(--salt-actionable-positive-subtle-borderColor-hover);
4508
- --toggleButton-borderColor-selected: var(--salt-actionable-positive-subtle-borderColor-active);
4509
- --toggleButton-borderColor-disabled: var(--salt-actionable-positive-subtle-borderColor-disabled);
4510
- --toggleButton-borderColor-disabled-selected: var(--salt-actionable-positive-bold-borderColor-disabled);
4511
- --toggleButton-borderColor-readonly: var(--salt-actionable-positive-subtle-borderColor-disabled);
4512
- --toggleButton-borderColor-readonly-selected: var(--salt-actionable-positive-subtle-borderColor-active);
4441
+ --toggleButton-borderColor-active: var(--salt-actionable-positive-subtle-borderColor-active);
4442
+ --toggleButton-borderColor-selected: var(--salt-actionable-positive-borderColor-selected);
4443
+ --toggleButton-borderColor-selectedHover: var(--salt-actionable-positive-bold-borderColor-hover);
4513
4444
  }
4514
4445
  .saltToggleButton-negative.saltToggleButton-solid {
4515
4446
  --toggleButton-text-color: var(--salt-actionable-negative-subtle-foreground);
4516
4447
  --toggleButton-text-color-hover: var(--salt-actionable-negative-subtle-foreground-hover);
4517
- --toggleButton-text-color-selected: var(--salt-actionable-negative-subtle-foreground-active);
4518
- --toggleButton-text-color-disabled: var(--salt-actionable-negative-subtle-foreground-disabled);
4519
- --toggleButton-text-color-disabled-selected: var(--salt-actionable-negative-bold-foreground-disabled);
4520
- --toggleButton-text-color-readonly: var(--salt-actionable-negative-subtle-foreground-disabled);
4521
- --toggleButton-text-color-readonly-selected: var(--salt-actionable-negative-subtle-foreground-active);
4448
+ --toggleButton-text-color-active: var(--salt-actionable-negative-subtle-foreground-active);
4449
+ --toggleButton-text-color-selected: var(--salt-actionable-negative-foreground-selected);
4522
4450
  --toggleButton-background: var(--salt-actionable-negative-subtle-background);
4523
4451
  --toggleButton-background-hover: var(--salt-actionable-negative-subtle-background-hover);
4524
- --toggleButton-background-selected: var(--salt-actionable-negative-subtle-background-active);
4525
- --toggleButton-background-disabled: var(--salt-actionable-negative-subtle-background-disabled);
4526
- --toggleButton-background-disabled-selected: var(--salt-actionable-negative-bold-background-disabled);
4527
- --toggleButton-background-readonly: var(--salt-actionable-negative-subtle-background-disabled);
4528
- --toggleButton-background-readonly-selected: var(--salt-actionable-negative-subtle-background-active);
4452
+ --toggleButton-background-active: var(--salt-actionable-negative-subtle-background-active);
4453
+ --toggleButton-background-selected: var(--salt-actionable-negative-background-selected);
4529
4454
  --toggleButton-borderColor: var(--salt-actionable-negative-subtle-borderColor);
4530
4455
  --toggleButton-borderColor-hover: var(--salt-actionable-negative-subtle-borderColor-hover);
4531
- --toggleButton-borderColor-selected: var(--salt-actionable-negative-subtle-borderColor-active);
4532
- --toggleButton-borderColor-disabled: var(--salt-actionable-negative-subtle-borderColor-disabled);
4533
- --toggleButton-borderColor-disabled-selected: var(--salt-actionable-negative-bold-borderColor-disabled);
4534
- --toggleButton-borderColor-readonly: var(--salt-actionable-negative-subtle-borderColor-disabled);
4535
- --toggleButton-borderColor-readonly-selected: var(--salt-actionable-negative-subtle-borderColor-active);
4456
+ --toggleButton-borderColor-active: var(--salt-actionable-negative-subtle-borderColor-active);
4457
+ --toggleButton-borderColor-selected: var(--salt-actionable-negative-borderColor-selected);
4458
+ --toggleButton-borderColor-selectedHover: var(--salt-actionable-negative-bold-borderColor-hover);
4536
4459
  }
4537
4460
  .saltToggleButton-caution.saltToggleButton-solid {
4538
4461
  --toggleButton-text-color: var(--salt-actionable-caution-subtle-foreground);
4539
4462
  --toggleButton-text-color-hover: var(--salt-actionable-caution-subtle-foreground-hover);
4540
- --toggleButton-text-color-selected: var(--salt-actionable-caution-subtle-foreground-active);
4541
- --toggleButton-text-color-disabled: var(--salt-actionable-caution-subtle-foreground-disabled);
4542
- --toggleButton-text-color-disabled-selected: var(--salt-actionable-caution-bold-foreground-disabled);
4543
- --toggleButton-text-color-readonly: var(--salt-actionable-caution-subtle-foreground-disabled);
4544
- --toggleButton-text-color-readonly-selected: var(--salt-actionable-caution-subtle-foreground-active);
4463
+ --toggleButton-text-color-active: var(--salt-actionable-caution-subtle-foreground-active);
4464
+ --toggleButton-text-color-selected: var(--salt-actionable-caution-foreground-selected);
4545
4465
  --toggleButton-background: var(--salt-actionable-caution-subtle-background);
4546
4466
  --toggleButton-background-hover: var(--salt-actionable-caution-subtle-background-hover);
4547
- --toggleButton-background-selected: var(--salt-actionable-caution-subtle-background-active);
4548
- --toggleButton-background-disabled: var(--salt-actionable-caution-subtle-background-disabled);
4549
- --toggleButton-background-disabled-selected: var(--salt-actionable-caution-bold-background-disabled);
4550
- --toggleButton-background-readonly: var(--salt-actionable-caution-subtle-background-disabled);
4551
- --toggleButton-background-readonly-selected: var(--salt-actionable-caution-subtle-background-active);
4467
+ --toggleButton-background-active: var(--salt-actionable-caution-subtle-background-active);
4468
+ --toggleButton-background-selected: var(--salt-actionable-caution-background-selected);
4552
4469
  --toggleButton-borderColor: var(--salt-actionable-caution-subtle-borderColor);
4553
4470
  --toggleButton-borderColor-hover: var(--salt-actionable-caution-subtle-borderColor-hover);
4554
- --toggleButton-borderColor-selected: var(--salt-actionable-caution-subtle-borderColor-active);
4555
- --toggleButton-borderColor-disabled: var(--salt-actionable-caution-subtle-borderColor-disabled);
4556
- --toggleButton-borderColor-disabled-selected: var(--salt-actionable-caution-bold-borderColor-disabled);
4557
- --toggleButton-borderColor-readonly: var(--salt-actionable-caution-subtle-borderColor-disabled);
4558
- --toggleButton-borderColor-readonly-selected: var(--salt-actionable-caution-subtle-borderColor-active);
4471
+ --toggleButton-borderColor-active: var(--salt-actionable-caution-subtle-borderColor-active);
4472
+ --toggleButton-borderColor-selected: var(--salt-actionable-caution-borderColor-selected);
4473
+ --toggleButton-borderColor-selectedHover: var(--salt-actionable-caution-bold-borderColor-hover);
4559
4474
  }
4560
4475
  .saltToggleButton-neutral.saltToggleButton-bordered {
4561
- --toggleButton-text-color: var(--salt-actionable-subtle-foreground);
4562
- --toggleButton-text-color-hover: var(--salt-actionable-subtle-foreground-hover);
4563
- --toggleButton-text-color-selected: var(--salt-actionable-foreground);
4564
- --toggleButton-text-color-disabled: var(--salt-actionable-subtle-foreground-disabled);
4565
- --toggleButton-text-color-disabled-selected: var(--salt-actionable-foreground-disabled);
4566
- --toggleButton-text-color-readonly: var(--salt-actionable-subtle-foreground-disabled);
4567
- --toggleButton-text-color-readonly-selected: var(--salt-actionable-foreground);
4568
- --toggleButton-background: var(--salt-actionable-subtle-background);
4569
- --toggleButton-background-hover: var(--salt-actionable-subtle-background-hover);
4570
- --toggleButton-background-selected: var(--salt-actionable-background);
4571
- --toggleButton-background-disabled: var(--salt-actionable-subtle-background-disabled);
4572
- --toggleButton-background-disabled-selected: var(--salt-actionable-background-disabled);
4573
- --toggleButton-background-readonly: var(--salt-actionable-subtle-background-disabled);
4574
- --toggleButton-background-readonly-selected: var(--salt-actionable-background);
4575
- --toggleButton-borderColor: var(--salt-actionable-subtle-borderColor);
4576
- --toggleButton-borderColor-hover: var(--salt-actionable-subtle-border);
4577
- --toggleButton-borderColor-selected: var(--salt-actionable-borderColor);
4578
- --toggleButton-borderColor-disabled: var(--salt-actionable-subtle-borderColor-disabled);
4579
- --toggleButton-borderColor-disabled-selected: var(--salt-actionable-borderColor-disabled);
4580
- --toggleButton-borderColor-readonly: var(--salt-actionable-subtle-borderColor-disabled);
4581
- --toggleButton-borderColor-readonly-selected: var(--salt-actionable-borderColor);
4476
+ --toggleButton-text-color: var(--salt-actionable-foreground);
4477
+ --toggleButton-text-color-hover: var(--salt-actionable-foreground-hover);
4478
+ --toggleButton-text-color-active: var(--salt-actionable-foreground);
4479
+ --toggleButton-text-color-selected: var(--salt-actionable-foreground-selected);
4480
+ --toggleButton-background: var(--salt-actionable-background);
4481
+ --toggleButton-background-hover: var(--salt-actionable-background-hover);
4482
+ --toggleButton-background-active: var(--salt-actionable-background);
4483
+ --toggleButton-background-selected: var(--salt-actionable-background-selected);
4484
+ --toggleButton-borderColor: var(--salt-actionable-borderColor);
4485
+ --toggleButton-borderColor-hover: var(--salt-actionable-borderColor);
4486
+ --toggleButton-borderColor-active: var(--salt-actionable-borderColor);
4487
+ --toggleButton-borderColor-selected: var(--salt-actionable-borderColor-selected);
4488
+ --toggleButton-borderColor-selectedHover: var(--salt-actionable-bold-borderColor-hover);
4582
4489
  }
4583
4490
  .saltToggleButton-accented.saltToggleButton-bordered {
4584
- --toggleButton-text-color: var(--salt-actionable-accented-subtle-foreground);
4585
- --toggleButton-text-color-hover: var(--salt-actionable-accented-subtle-foreground-hover);
4586
- --toggleButton-text-color-selected: var(--salt-actionable-accented-foreground);
4587
- --toggleButton-text-color-disabled: var(--salt-actionable-accented-subtle-foreground-disabled);
4588
- --toggleButton-text-color-disabled-selected: var(--salt-actionable-accented-foreground-disabled);
4589
- --toggleButton-text-color-readonly: var(--salt-actionable-accented-subtle-foreground-disabled);
4590
- --toggleButton-text-color-readonly-selected: var(--salt-actionable-accented-foreground);
4591
- --toggleButton-background: var(--salt-actionable-accented-subtle-background);
4592
- --toggleButton-background-hover: var(--salt-actionable-accented-subtle-background-hover);
4593
- --toggleButton-background-selected: var(--salt-actionable-accented-background);
4594
- --toggleButton-background-disabled: var(--salt-actionable-accented-subtle-background-disabled);
4595
- --toggleButton-background-disabled-selected: var(--salt-actionable-accented-background-disabled);
4596
- --toggleButton-background-readonly: var(--salt-actionable-accented-subtle-background-disabled);
4597
- --toggleButton-background-readonly-selected: var(--salt-actionable-accented-background);
4598
- --toggleButton-borderColor: var(--salt-actionable-accented-subtle-borderColor);
4599
- --toggleButton-borderColor-hover: var(--salt-actionable-accented-subtle-borderColor);
4600
- --toggleButton-borderColor-selected: var(--salt-actionable-accented-borderColor);
4601
- --toggleButton-borderColor-disabled: var(--salt-actionable-accented-subtle-borderColor-disabled);
4602
- --toggleButton-borderColor-disabled-selected: var(--salt-actionable-accented-borderColor-disabled);
4603
- --toggleButton-borderColor-readonly: var(--salt-actionable-accented-subtle-borderColor-disabled);
4604
- --toggleButton-borderColor-readonly-selected: var(--salt-actionable-accented-borderColor);
4491
+ --toggleButton-text-color: var(--salt-actionable-accented-foreground);
4492
+ --toggleButton-text-color-hover: var(--salt-actionable-accented-foreground-hover);
4493
+ --toggleButton-text-color-active: var(--salt-actionable-accented-foreground);
4494
+ --toggleButton-text-color-selected: var(--salt-actionable-accented-foreground-selected);
4495
+ --toggleButton-background: var(--salt-actionable-accented-background);
4496
+ --toggleButton-background-hover: var(--salt-actionable-accented-background-hover);
4497
+ --toggleButton-background-active: var(--salt-actionable-accented-background);
4498
+ --toggleButton-background-selected: var(--salt-actionable-accented-background-selected);
4499
+ --toggleButton-borderColor: var(--salt-actionable-accented-borderColor);
4500
+ --toggleButton-borderColor-hover: var(--salt-actionable-accented-borderColor);
4501
+ --toggleButton-borderColor-active: var(--salt-actionable-accented-borderColor);
4502
+ --toggleButton-borderColor-selected: var(--salt-actionable-accented-borderColor-selected);
4503
+ --toggleButton-borderColor-selectedHover: var(--salt-actionable-accented-bold-borderColor-hover);
4605
4504
  }
4606
4505
  .saltToggleButton-positive.saltToggleButton-bordered {
4607
- --toggleButton-text-color: var(--salt-actionable-positive-subtle-foreground);
4608
- --toggleButton-text-color-hover: var(--salt-actionable-positive-subtle-foreground-hover);
4609
- --toggleButton-text-color-selected: var(--salt-actionable-positive-foreground);
4610
- --toggleButton-text-color-disabled: var(--salt-actionable-positive-subtle-foreground-disabled);
4611
- --toggleButton-text-color-disabled-selected: var(--salt-actionable-positive-foreground-disabled);
4612
- --toggleButton-text-color-readonly: var(--salt-actionable-positive-subtle-foreground-disabled);
4613
- --toggleButton-text-color-readonly-selected: var(--salt-actionable-positive-foreground);
4614
- --toggleButton-background: var(--salt-actionable-positive-subtle-background);
4615
- --toggleButton-background-hover: var(--salt-actionable-positive-subtle-background-hover);
4616
- --toggleButton-background-selected: var(--salt-actionable-positive-background);
4617
- --toggleButton-background-disabled: var(--salt-actionable-positive-subtle-background-disabled);
4618
- --toggleButton-background-disabled-selected: var(--salt-actionable-positive-background-disabled);
4619
- --toggleButton-background-readonly: var(--salt-actionable-positive-subtle-background-disabled);
4620
- --toggleButton-background-readonly-selected: var(--salt-actionable-positive-background);
4621
- --toggleButton-borderColor: var(--salt-actionable-positive-subtle-borderColor);
4622
- --toggleButton-borderColor-hover: var(--salt-actionable-positive-subtle-borderColor);
4623
- --toggleButton-borderColor-selected: var(--salt-actionable-positive-borderColor);
4624
- --toggleButton-borderColor-disabled: var(--salt-actionable-positive-subtle-borderColor-disabled);
4625
- --toggleButton-borderColor-disabled-selected: var(--salt-actionable-positive-borderColor-disabled);
4626
- --toggleButton-borderColor-readonly: var(--salt-actionable-positive-subtle-borderColor-disabled);
4627
- --toggleButton-borderColor-readonly-selected: var(--salt-actionable-positive-borderColor);
4506
+ --toggleButton-text-color: var(--salt-actionable-positive-foreground);
4507
+ --toggleButton-text-color-hover: var(--salt-actionable-positive-foreground-hover);
4508
+ --toggleButton-text-color-active: var(--salt-actionable-positive-foreground);
4509
+ --toggleButton-text-color-selected: var(--salt-actionable-positive-foreground-selected);
4510
+ --toggleButton-background: var(--salt-actionable-positive-background);
4511
+ --toggleButton-background-hover: var(--salt-actionable-positive-background-hover);
4512
+ --toggleButton-background-active: var(--salt-actionable-positive-background);
4513
+ --toggleButton-background-selected: var(--salt-actionable-positive-background-selected);
4514
+ --toggleButton-borderColor: var(--salt-actionable-positive-borderColor);
4515
+ --toggleButton-borderColor-hover: var(--salt-actionable-positive-borderColor);
4516
+ --toggleButton-borderColor-active: var(--salt-actionable-positive-borderColor);
4517
+ --toggleButton-borderColor-selected: var(--salt-actionable-positive-borderColor-selected);
4518
+ --toggleButton-borderColor-selectedHover: var(--salt-actionable-positive-bold-borderColor-hover);
4628
4519
  }
4629
4520
  .saltToggleButton-negative.saltToggleButton-bordered {
4630
- --toggleButton-text-color: var(--salt-actionable-negative-subtle-foreground);
4631
- --toggleButton-text-color-hover: var(--salt-actionable-negative-subtle-foreground-hover);
4632
- --toggleButton-text-color-selected: var(--salt-actionable-negative-foreground);
4633
- --toggleButton-text-color-disabled: var(--salt-actionable-negative-subtle-foreground-disabled);
4634
- --toggleButton-text-color-disabled-selected: var(--salt-actionable-negative-foreground-disabled);
4635
- --toggleButton-text-color-readonly: var(--salt-actionable-negative-subtle-foreground-disabled);
4636
- --toggleButton-text-color-readonly-selected: var(--salt-actionable-negative-foreground);
4637
- --toggleButton-background: var(--salt-actionable-negative-subtle-background);
4638
- --toggleButton-background-hover: var(--salt-actionable-negative-subtle-background-hover);
4639
- --toggleButton-background-selected: var(--salt-actionable-negative-background);
4640
- --toggleButton-background-disabled: var(--salt-actionable-negative-subtle-background-disabled);
4641
- --toggleButton-background-disabled-selected: var(--salt-actionable-negative-background-disabled);
4642
- --toggleButton-background-readonly: var(--salt-actionable-negative-subtle-background-disabled);
4643
- --toggleButton-background-readonly-selected: var(--salt-actionable-negative-background);
4644
- --toggleButton-borderColor: var(--salt-actionable-negative-subtle-borderColor);
4645
- --toggleButton-borderColor-hover: var(--salt-actionable-negative-subtle-borderColor);
4646
- --toggleButton-borderColor-selected: var(--salt-actionable-negative-borderColor);
4647
- --toggleButton-borderColor-disabled: var(--salt-actionable-negative-subtle-borderColor-disabled);
4648
- --toggleButton-borderColor-disabled-selected: var(--salt-actionable-negative-borderColor-disabled);
4649
- --toggleButton-borderColor-readonly: var(--salt-actionable-negative-subtle-borderColor-disabled);
4650
- --toggleButton-borderColor-readonly-selected: var(--salt-actionable-negative-borderColor);
4521
+ --toggleButton-text-color: var(--salt-actionable-negative-foreground);
4522
+ --toggleButton-text-color-hover: var(--salt-actionable-negative-foreground-hover);
4523
+ --toggleButton-text-color-active: var(--salt-actionable-negative-foreground);
4524
+ --toggleButton-text-color-selected: var(--salt-actionable-negative-foreground-selected);
4525
+ --toggleButton-background: var(--salt-actionable-negative-background);
4526
+ --toggleButton-background-hover: var(--salt-actionable-negative-background-hover);
4527
+ --toggleButton-background-active: var(--salt-actionable-negative-background);
4528
+ --toggleButton-background-selected: var(--salt-actionable-negative-background-selected);
4529
+ --toggleButton-borderColor: var(--salt-actionable-negative-borderColor);
4530
+ --toggleButton-borderColor-hover: var(--salt-actionable-negative-borderColor);
4531
+ --toggleButton-borderColor-active: var(--salt-actionable-negative-borderColor);
4532
+ --toggleButton-borderColor-selected: var(--salt-actionable-negative-borderColor-selected);
4533
+ --toggleButton-borderColor-selectedHover: var(--salt-actionable-negative-bold-borderColor-hover);
4651
4534
  }
4652
4535
  .saltToggleButton-caution.saltToggleButton-bordered {
4653
- --toggleButton-text-color: var(--salt-actionable-caution-subtle-foreground);
4654
- --toggleButton-text-color-hover: var(--salt-actionable-caution-subtle-foreground-hover);
4655
- --toggleButton-text-color-selected: var(--salt-actionable-caution-foreground);
4656
- --toggleButton-text-color-disabled: var(--salt-actionable-caution-subtle-foreground-disabled);
4657
- --toggleButton-text-color-disabled-selected: var(--salt-actionable-caution-foreground-disabled);
4658
- --toggleButton-text-color-readonly: var(--salt-actionable-caution-subtle-foreground-disabled);
4659
- --toggleButton-text-color-readonly-selected: var(--salt-actionable-caution-foreground);
4660
- --toggleButton-background: var(--salt-actionable-caution-subtle-background);
4661
- --toggleButton-background-hover: var(--salt-actionable-caution-subtle-background-hover);
4662
- --toggleButton-background-selected: var(--salt-actionable-caution-background);
4663
- --toggleButton-background-disabled: var(--salt-actionable-caution-subtle-background-disabled);
4664
- --toggleButton-background-disabled-selected: var(--salt-actionable-caution-background-disabled);
4665
- --toggleButton-background-readonly: var(--salt-actionable-caution-subtle-background-disabled);
4666
- --toggleButton-background-readonly-selected: var(--salt-actionable-caution-background);
4667
- --toggleButton-borderColor: var(--salt-actionable-caution-subtle-borderColor);
4668
- --toggleButton-borderColor-hover: var(--salt-actionable-caution-subtle-borderColor);
4669
- --toggleButton-borderColor-selected: var(--salt-actionable-caution-borderColor);
4670
- --toggleButton-borderColor-disabled: var(--salt-actionable-caution-subtle-borderColor-disabled);
4671
- --toggleButton-borderColor-disabled-selected: var(--salt-actionable-caution-borderColor-disabled);
4672
- --toggleButton-borderColor-readonly: var(--salt-actionable-caution-subtle-borderColor-disabled);
4673
- --toggleButton-borderColor-readonly-selected: var(--salt-actionable-caution-borderColor);
4536
+ --toggleButton-text-color: var(--salt-actionable-caution-foreground);
4537
+ --toggleButton-text-color-hover: var(--salt-actionable-caution-foreground-hover);
4538
+ --toggleButton-text-color-active: var(--salt-actionable-caution-foreground);
4539
+ --toggleButton-text-color-selected: var(--salt-actionable-caution-foreground-selected);
4540
+ --toggleButton-background: var(--salt-actionable-caution-background);
4541
+ --toggleButton-background-hover: var(--salt-actionable-caution-background-hover);
4542
+ --toggleButton-background-active: var(--salt-actionable-caution-background);
4543
+ --toggleButton-background-selected: var(--salt-actionable-caution-background-selected);
4544
+ --toggleButton-borderColor: var(--salt-actionable-caution-borderColor);
4545
+ --toggleButton-borderColor-hover: var(--salt-actionable-caution-borderColor);
4546
+ --toggleButton-borderColor-active: var(--salt-actionable-caution-borderColor);
4547
+ --toggleButton-borderColor-selected: var(--salt-actionable-caution-borderColor-selected);
4548
+ --toggleButton-borderColor-selectedHover: var(--salt-actionable-caution-bold-borderColor-hover);
4674
4549
  }
4675
4550
 
4676
4551
  /* src/toggle-button-group/ToggleButtonGroup.css */
@@ -5467,4 +5342,4 @@ label.saltText small,
5467
5342
  color: var(--salt-status-error-foreground-informative);
5468
5343
  }
5469
5344
 
5470
- /* src/6df45073-85b8-4252-885c-59f909fae448.css */
5345
+ /* src/cffa4c84-7bd6-49e1-a87d-9c027d493356.css */