contain-css-svelte 1.1.13 → 1.1.14

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 (49) hide show
  1. package/README.md +6 -2
  2. package/dist/Card.svelte +345 -5
  3. package/dist/controls/Button.svelte +414 -6
  4. package/dist/controls/ButtonLink.svelte +483 -7
  5. package/dist/controls/Checkbox.svelte +138 -2
  6. package/dist/controls/CircleButton.svelte +483 -7
  7. package/dist/controls/Input.svelte +69 -1
  8. package/dist/controls/RadioButton.svelte +138 -2
  9. package/dist/controls/Select.svelte +138 -2
  10. package/dist/controls/TabItem.svelte +138 -2
  11. package/dist/controls/Toggle.svelte +138 -2
  12. package/dist/dropdowns/DropdownMenu.svelte +276 -4
  13. package/dist/index.d.ts +2 -0
  14. package/dist/index.js +2 -0
  15. package/dist/layout/Accordion.svelte +276 -4
  16. package/dist/layout/Bar.svelte +138 -2
  17. package/dist/layout/Container.svelte +75 -1
  18. package/dist/layout/DataList.svelte +69 -1
  19. package/dist/layout/DataListItem.svelte +69 -1
  20. package/dist/layout/Fieldset.svelte +138 -2
  21. package/dist/layout/Form.svelte +69 -1
  22. package/dist/layout/Hero.svelte +69 -1
  23. package/dist/layout/MenuList.svelte +276 -4
  24. package/dist/layout/Page.svelte +138 -2
  25. package/dist/layout/Sidebar.svelte +345 -5
  26. package/dist/layout/TabBar.svelte +69 -1
  27. package/dist/layout/Table.svelte +345 -5
  28. package/dist/layout/Tile.svelte +276 -4
  29. package/dist/misc/CodeInner.svelte +621 -9
  30. package/dist/misc/Progress.svelte +276 -4
  31. package/dist/misc/Tag.svelte +414 -6
  32. package/dist/overlays/Dialog.svelte +71 -3
  33. package/dist/overlays/Tooltip.svelte +210 -22
  34. package/dist/review/scenarios/IncredibleAppShell.svelte +3 -3
  35. package/dist/review/scenarios/LayoutWorkbench.svelte +2 -2
  36. package/dist/sass/_color.scss +37 -5
  37. package/dist/typography/Text.svelte +54 -0
  38. package/dist/typography/Text.svelte.d.ts +21 -0
  39. package/dist/vars/colors.css +8 -0
  40. package/dist/vars/defaults.css +8 -0
  41. package/dist/vars/themes/bootstrap.css +6 -0
  42. package/dist/vars/themes/canyon.css +6 -0
  43. package/dist/vars/themes/dark.css +6 -0
  44. package/dist/vars/themes/forest.css +6 -0
  45. package/dist/vars/themes/light.css +6 -0
  46. package/dist/vars/themes/material.css +6 -0
  47. package/dist/vars/themes/purple.css +6 -0
  48. package/dist/vars/themes/retro.css +6 -0
  49. package/package.json +1 -1
package/dist/misc/Progress.svelte CHANGED
@@ -75,7 +75,75 @@ let halfFull = $derived(fillFraction > 0.5);
75
75
  var(--_bg-base),
76
76
  var(--_bg-mix-color) var(--_bg-mix-amount)
77
77
  );
78
- --_color: color-mix(in srgb, var(--_fg-base), var(--_fg-mix-color) var(--_fg-mix-amount));
78
+ --_color: color-mix(
79
+ in srgb,
80
+ var(--_fg-base),
81
+ var(--_fg-mix-color) var(--_fg-mix-amount)
82
+ );
83
+ --muted-color: var(--muted-color-override, var(--_background-color));
84
+ --primary-text-fg: var(
85
+ --primary-text-fg-override,
86
+ color-mix(
87
+ in srgb,
88
+ var(--_color),
89
+ var(--primary-color)
90
+ var(--primary-text-amount, var(--text-amount, 50%))
91
+ )
92
+ );
93
+ --secondary-text-fg: var(
94
+ --secondary-text-fg-override,
95
+ color-mix(
96
+ in srgb,
97
+ var(--_color),
98
+ var(--secondary-color)
99
+ var(--secondary-text-amount, var(--text-amount, 50%))
100
+ )
101
+ );
102
+ --info-text-fg: var(
103
+ --info-text-fg-override,
104
+ color-mix(
105
+ in srgb,
106
+ var(--_color),
107
+ var(--info-color)
108
+ var(--info-text-amount, var(--text-amount, 50%))
109
+ )
110
+ );
111
+ --success-text-fg: var(
112
+ --success-text-fg-override,
113
+ color-mix(
114
+ in srgb,
115
+ var(--_color),
116
+ var(--success-color)
117
+ var(--success-text-amount, var(--text-amount, 50%))
118
+ )
119
+ );
120
+ --warning-text-fg: var(
121
+ --warning-text-fg-override,
122
+ color-mix(
123
+ in srgb,
124
+ var(--_color),
125
+ var(--warning-color)
126
+ var(--warning-text-amount, var(--text-amount, 50%))
127
+ )
128
+ );
129
+ --danger-text-fg: var(
130
+ --danger-text-fg-override,
131
+ color-mix(
132
+ in srgb,
133
+ var(--_color),
134
+ var(--danger-color)
135
+ var(--danger-text-amount, var(--text-amount, 50%))
136
+ )
137
+ );
138
+ --muted-text-fg: var(
139
+ --muted-text-fg-override,
140
+ color-mix(
141
+ in srgb,
142
+ var(--_color),
143
+ var(--muted-color)
144
+ var(--muted-text-amount, var(--text-amount, 50%))
145
+ )
146
+ );
79
147
  background-color: var(--_background-color);
80
148
  color: var(--_color);
81
149
  box-sizing: border-box;
@@ -419,7 +487,75 @@ let halfFull = $derived(fillFraction > 0.5);
419
487
  var(--_bg-base),
420
488
  var(--_bg-mix-color) var(--_bg-mix-amount)
421
489
  );
422
- --_color: color-mix(in srgb, var(--_fg-base), var(--_fg-mix-color) var(--_fg-mix-amount));
490
+ --_color: color-mix(
491
+ in srgb,
492
+ var(--_fg-base),
493
+ var(--_fg-mix-color) var(--_fg-mix-amount)
494
+ );
495
+ --muted-color: var(--muted-color-override, var(--_background-color));
496
+ --primary-text-fg: var(
497
+ --primary-text-fg-override,
498
+ color-mix(
499
+ in srgb,
500
+ var(--_color),
501
+ var(--primary-color)
502
+ var(--primary-text-amount, var(--text-amount, 50%))
503
+ )
504
+ );
505
+ --secondary-text-fg: var(
506
+ --secondary-text-fg-override,
507
+ color-mix(
508
+ in srgb,
509
+ var(--_color),
510
+ var(--secondary-color)
511
+ var(--secondary-text-amount, var(--text-amount, 50%))
512
+ )
513
+ );
514
+ --info-text-fg: var(
515
+ --info-text-fg-override,
516
+ color-mix(
517
+ in srgb,
518
+ var(--_color),
519
+ var(--info-color)
520
+ var(--info-text-amount, var(--text-amount, 50%))
521
+ )
522
+ );
523
+ --success-text-fg: var(
524
+ --success-text-fg-override,
525
+ color-mix(
526
+ in srgb,
527
+ var(--_color),
528
+ var(--success-color)
529
+ var(--success-text-amount, var(--text-amount, 50%))
530
+ )
531
+ );
532
+ --warning-text-fg: var(
533
+ --warning-text-fg-override,
534
+ color-mix(
535
+ in srgb,
536
+ var(--_color),
537
+ var(--warning-color)
538
+ var(--warning-text-amount, var(--text-amount, 50%))
539
+ )
540
+ );
541
+ --danger-text-fg: var(
542
+ --danger-text-fg-override,
543
+ color-mix(
544
+ in srgb,
545
+ var(--_color),
546
+ var(--danger-color)
547
+ var(--danger-text-amount, var(--text-amount, 50%))
548
+ )
549
+ );
550
+ --muted-text-fg: var(
551
+ --muted-text-fg-override,
552
+ color-mix(
553
+ in srgb,
554
+ var(--_color),
555
+ var(--muted-color)
556
+ var(--muted-text-amount, var(--text-amount, 50%))
557
+ )
558
+ );
423
559
  background-color: var(--_background-color);
424
560
  color: var(--_color);
425
561
  }
@@ -438,7 +574,75 @@ let halfFull = $derived(fillFraction > 0.5);
438
574
  var(--_bg-base),
439
575
  var(--_bg-mix-color) var(--_bg-mix-amount)
440
576
  );
441
- --_color: color-mix(in srgb, var(--_fg-base), var(--_fg-mix-color) var(--_fg-mix-amount));
577
+ --_color: color-mix(
578
+ in srgb,
579
+ var(--_fg-base),
580
+ var(--_fg-mix-color) var(--_fg-mix-amount)
581
+ );
582
+ --muted-color: var(--muted-color-override, var(--_background-color));
583
+ --primary-text-fg: var(
584
+ --primary-text-fg-override,
585
+ color-mix(
586
+ in srgb,
587
+ var(--_color),
588
+ var(--primary-color)
589
+ var(--primary-text-amount, var(--text-amount, 50%))
590
+ )
591
+ );
592
+ --secondary-text-fg: var(
593
+ --secondary-text-fg-override,
594
+ color-mix(
595
+ in srgb,
596
+ var(--_color),
597
+ var(--secondary-color)
598
+ var(--secondary-text-amount, var(--text-amount, 50%))
599
+ )
600
+ );
601
+ --info-text-fg: var(
602
+ --info-text-fg-override,
603
+ color-mix(
604
+ in srgb,
605
+ var(--_color),
606
+ var(--info-color)
607
+ var(--info-text-amount, var(--text-amount, 50%))
608
+ )
609
+ );
610
+ --success-text-fg: var(
611
+ --success-text-fg-override,
612
+ color-mix(
613
+ in srgb,
614
+ var(--_color),
615
+ var(--success-color)
616
+ var(--success-text-amount, var(--text-amount, 50%))
617
+ )
618
+ );
619
+ --warning-text-fg: var(
620
+ --warning-text-fg-override,
621
+ color-mix(
622
+ in srgb,
623
+ var(--_color),
624
+ var(--warning-color)
625
+ var(--warning-text-amount, var(--text-amount, 50%))
626
+ )
627
+ );
628
+ --danger-text-fg: var(
629
+ --danger-text-fg-override,
630
+ color-mix(
631
+ in srgb,
632
+ var(--_color),
633
+ var(--danger-color)
634
+ var(--danger-text-amount, var(--text-amount, 50%))
635
+ )
636
+ );
637
+ --muted-text-fg: var(
638
+ --muted-text-fg-override,
639
+ color-mix(
640
+ in srgb,
641
+ var(--_color),
642
+ var(--muted-color)
643
+ var(--muted-text-amount, var(--text-amount, 50%))
644
+ )
645
+ );
442
646
  background-color: var(--_background-color);
443
647
  color: var(--_color);
444
648
  }
@@ -457,7 +661,75 @@ let halfFull = $derived(fillFraction > 0.5);
457
661
  var(--_bg-base),
458
662
  var(--_bg-mix-color) var(--_bg-mix-amount)
459
663
  );
460
- --_color: color-mix(in srgb, var(--_fg-base), var(--_fg-mix-color) var(--_fg-mix-amount));
664
+ --_color: color-mix(
665
+ in srgb,
666
+ var(--_fg-base),
667
+ var(--_fg-mix-color) var(--_fg-mix-amount)
668
+ );
669
+ --muted-color: var(--muted-color-override, var(--_background-color));
670
+ --primary-text-fg: var(
671
+ --primary-text-fg-override,
672
+ color-mix(
673
+ in srgb,
674
+ var(--_color),
675
+ var(--primary-color)
676
+ var(--primary-text-amount, var(--text-amount, 50%))
677
+ )
678
+ );
679
+ --secondary-text-fg: var(
680
+ --secondary-text-fg-override,
681
+ color-mix(
682
+ in srgb,
683
+ var(--_color),
684
+ var(--secondary-color)
685
+ var(--secondary-text-amount, var(--text-amount, 50%))
686
+ )
687
+ );
688
+ --info-text-fg: var(
689
+ --info-text-fg-override,
690
+ color-mix(
691
+ in srgb,
692
+ var(--_color),
693
+ var(--info-color)
694
+ var(--info-text-amount, var(--text-amount, 50%))
695
+ )
696
+ );
697
+ --success-text-fg: var(
698
+ --success-text-fg-override,
699
+ color-mix(
700
+ in srgb,
701
+ var(--_color),
702
+ var(--success-color)
703
+ var(--success-text-amount, var(--text-amount, 50%))
704
+ )
705
+ );
706
+ --warning-text-fg: var(
707
+ --warning-text-fg-override,
708
+ color-mix(
709
+ in srgb,
710
+ var(--_color),
711
+ var(--warning-color)
712
+ var(--warning-text-amount, var(--text-amount, 50%))
713
+ )
714
+ );
715
+ --danger-text-fg: var(
716
+ --danger-text-fg-override,
717
+ color-mix(
718
+ in srgb,
719
+ var(--_color),
720
+ var(--danger-color)
721
+ var(--danger-text-amount, var(--text-amount, 50%))
722
+ )
723
+ );
724
+ --muted-text-fg: var(
725
+ --muted-text-fg-override,
726
+ color-mix(
727
+ in srgb,
728
+ var(--_color),
729
+ var(--muted-color)
730
+ var(--muted-text-amount, var(--text-amount, 50%))
731
+ )
732
+ );
461
733
  background-color: var(--_background-color);
462
734
  color: var(--_color);
463
735
  }