vira 28.19.7 → 29.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/dist/elements/form/vira-form-fields.d.ts +11 -1
  2. package/dist/elements/form/vira-form-fields.js +1 -0
  3. package/dist/elements/form/vira-form.element.js +42 -0
  4. package/dist/elements/pop-up/vira-menu.element.js +2 -4
  5. package/dist/elements/pop-up/vira-pop-up-menu.element.js +3 -4
  6. package/dist/elements/vira-button.element.d.ts +5 -2
  7. package/dist/elements/vira-button.element.js +54 -18
  8. package/dist/elements/vira-card.element.d.ts +1 -1
  9. package/dist/elements/vira-card.element.js +15 -6
  10. package/dist/elements/vira-checkbox.element.d.ts +9 -5
  11. package/dist/elements/vira-checkbox.element.js +45 -15
  12. package/dist/elements/vira-dropdown.element.js +1 -2
  13. package/dist/elements/vira-error.element.js +1 -1
  14. package/dist/elements/vira-input.element.d.ts +3 -2
  15. package/dist/elements/vira-input.element.js +10 -16
  16. package/dist/elements/vira-link.element.d.ts +1 -1
  17. package/dist/elements/vira-link.element.js +7 -6
  18. package/dist/elements/vira-modal.element.d.ts +1 -1
  19. package/dist/elements/vira-modal.element.js +7 -9
  20. package/dist/elements/vira-progress.element.d.ts +1 -1
  21. package/dist/elements/vira-progress.element.js +3 -4
  22. package/dist/elements/vira-select.element.js +5 -4
  23. package/dist/styles/focus.d.ts +0 -13
  24. package/dist/styles/focus.js +3 -17
  25. package/dist/styles/form-styles.d.ts +114 -11
  26. package/dist/styles/form-styles.js +117 -12
  27. package/dist/styles/index.d.ts +0 -1
  28. package/dist/styles/index.js +0 -1
  29. package/dist/styles/native-styles.js +0 -1
  30. package/dist/styles/vira-color-palette.d.ts +86 -84
  31. package/dist/styles/vira-color-palette.js +86 -84
  32. package/dist/styles/vira-color-theme.d.ts +456 -60
  33. package/dist/styles/vira-color-theme.js +471 -93
  34. package/package.json +3 -3
  35. package/dist/styles/border.d.ts +0 -9
  36. package/dist/styles/border.js +0 -10
@@ -1,95 +1,97 @@
1
- /** Generously contributed by Trent Hazy, modified to more uniform contrast levels. */
1
+ /**
2
+ * The base Vira color theme palette.
3
+ *
4
+ * @category Color
5
+ */
2
6
  export declare const viraColorPalette: import("lit-css-vars").CssVarDefinitions<{
3
- readonly 'vira-white': "#ffffff";
4
- readonly 'vira-black': "#000000";
5
7
  readonly 'vira-red-5': "#ffe9e6";
6
- readonly 'vira-red-10': "#ffd9d6";
8
+ readonly 'vira-red-10': "#ffd9d5";
7
9
  readonly 'vira-red-20': "#ffc1bc";
8
- readonly 'vira-red-30': "#ffa6a2";
9
- readonly 'vira-red-40': "#ff8887";
10
+ readonly 'vira-red-30': "#ffa7a2";
11
+ readonly 'vira-red-40': "#ff8886";
10
12
  readonly 'vira-red-50': "#ff6065";
11
13
  readonly 'vira-red-60': "#f9163a";
12
- readonly 'vira-red-70': "#d2001e";
14
+ readonly 'vira-red-70': "#d2001d";
13
15
  readonly 'vira-red-80': "#a60012";
14
- readonly 'vira-red-90': "#760004";
16
+ readonly 'vira-red-90': "#760003";
15
17
  readonly 'vira-orange-5': "#ffebd1";
16
- readonly 'vira-orange-10': "#ffdcab";
17
- readonly 'vira-orange-20': "#ffc768";
18
- readonly 'vira-orange-30': "#ffac3a";
19
- readonly 'vira-orange-40': "#f49400";
20
- readonly 'vira-orange-50': "#dd8100";
21
- readonly 'vira-orange-60': "#c66b00";
22
- readonly 'vira-orange-70': "#a85800";
23
- readonly 'vira-orange-80': "#884400";
24
- readonly 'vira-orange-90': "#682800";
25
- readonly 'vira-yellow-5': "#f5f0c6";
26
- readonly 'vira-yellow-10': "#eee399";
27
- readonly 'vira-yellow-20': "#e9d100";
28
- readonly 'vira-yellow-30': "#d6bf00";
29
- readonly 'vira-yellow-40': "#c1ac00";
30
- readonly 'vira-yellow-50': "#ad9800";
31
- readonly 'vira-yellow-60': "#958400";
32
- readonly 'vira-yellow-70': "#7d6e00";
33
- readonly 'vira-yellow-80': "#635700";
34
- readonly 'vira-yellow-90': "#473d00";
35
- readonly 'vira-green-5': "#def6cc";
36
- readonly 'vira-green-10': "#c4eea3";
37
- readonly 'vira-green-20': "#94e53b";
38
- readonly 'vira-green-30': "#81d316";
39
- readonly 'vira-green-40': "#71bf00";
40
- readonly 'vira-green-50': "#5eaa00";
41
- readonly 'vira-green-60': "#509400";
42
- readonly 'vira-green-70': "#427c00";
43
- readonly 'vira-green-80': "#316200";
44
- readonly 'vira-green-90': "#1f4600";
45
- readonly 'vira-teal-5': "#d3f5ed";
46
- readonly 'vira-teal-10': "#aeeedf";
47
- readonly 'vira-teal-20': "#4ce6cc";
48
- readonly 'vira-teal-30': "#31d3ba";
49
- readonly 'vira-teal-40': "#00c0a7";
50
- readonly 'vira-teal-50': "#00aa93";
51
- readonly 'vira-teal-60': "#00937e";
52
- readonly 'vira-teal-70': "#007c68";
53
- readonly 'vira-teal-80': "#006252";
54
- readonly 'vira-teal-90': "#004539";
55
- readonly 'vira-blue-5': "#def1ff";
56
- readonly 'vira-blue-10': "#c0e7ff";
57
- readonly 'vira-blue-20': "#9dd7ff";
58
- readonly 'vira-blue-30': "#78c5ff";
59
- readonly 'vira-blue-40': "#5fb1fc";
60
- readonly 'vira-blue-50': "#4d9de7";
61
- readonly 'vira-blue-60': "#3588d0";
62
- readonly 'vira-blue-70': "#1971b7";
63
- readonly 'vira-blue-80': "#00579a";
64
- readonly 'vira-blue-90': "#003a7b";
65
- readonly 'vira-purple-5': "#f3ebff";
66
- readonly 'vira-purple-10': "#e8dcff";
67
- readonly 'vira-purple-20': "#e1c5ff";
68
- readonly 'vira-purple-30': "#d1afff";
69
- readonly 'vira-purple-40': "#c198ff";
70
- readonly 'vira-purple-50': "#b07dff";
71
- readonly 'vira-purple-60': "#a25cff";
72
- readonly 'vira-purple-70': "#8a3cf2";
73
- readonly 'vira-purple-80': "#710dd3";
74
- readonly 'vira-purple-90': "#4c0099";
18
+ readonly 'vira-orange-10': "#ffdda3";
19
+ readonly 'vira-orange-20': "#ffc66c";
20
+ readonly 'vira-orange-30': "#ffac36";
21
+ readonly 'vira-orange-40': "#f79300";
22
+ readonly 'vira-orange-50': "#e17e00";
23
+ readonly 'vira-orange-60': "#c96900";
24
+ readonly 'vira-orange-70': "#ab5600";
25
+ readonly 'vira-orange-80': "#8b4100";
26
+ readonly 'vira-orange-90': "#6a2500";
27
+ readonly 'vira-yellow-5': "#f7eeca";
28
+ readonly 'vira-yellow-10': "#f6e192";
29
+ readonly 'vira-yellow-20': "#f2cd20";
30
+ readonly 'vira-yellow-30': "#dfbb00";
31
+ readonly 'vira-yellow-40': "#cca800";
32
+ readonly 'vira-yellow-50': "#b59500";
33
+ readonly 'vira-yellow-60': "#9d8100";
34
+ readonly 'vira-yellow-70': "#856b00";
35
+ readonly 'vira-yellow-80': "#6a5400";
36
+ readonly 'vira-yellow-90': "#4c3b00";
37
+ readonly 'vira-green-5': "#d3f8cf";
38
+ readonly 'vira-green-10': "#a3f59b";
39
+ readonly 'vira-green-20': "#4fed46";
40
+ readonly 'vira-green-30': "#36d92e";
41
+ readonly 'vira-green-40': "#0dc501";
42
+ readonly 'vira-green-50': "#00af00";
43
+ readonly 'vira-green-60': "#009800";
44
+ readonly 'vira-green-70': "#007f00";
45
+ readonly 'vira-green-80': "#006400";
46
+ readonly 'vira-green-90': "#004700";
47
+ readonly 'vira-teal-5': "#d4f5f3";
48
+ readonly 'vira-teal-10': "#a1efeb";
49
+ readonly 'vira-teal-20': "#45e5de";
50
+ readonly 'vira-teal-30': "#2ad2cc";
51
+ readonly 'vira-teal-40': "#04beb8";
52
+ readonly 'vira-teal-50': "#00a9a3";
53
+ readonly 'vira-teal-60': "#00928d";
54
+ readonly 'vira-teal-70': "#007a77";
55
+ readonly 'vira-teal-80': "#00615e";
56
+ readonly 'vira-teal-90': "#004442";
57
+ readonly 'vira-blue-5': "#daf2ff";
58
+ readonly 'vira-blue-10': "#bde8ff";
59
+ readonly 'vira-blue-20': "#98d8ff";
60
+ readonly 'vira-blue-30': "#77c6ff";
61
+ readonly 'vira-blue-40': "#4cb2ff";
62
+ readonly 'vira-blue-50': "#299cf9";
63
+ readonly 'vira-blue-60': "#0086e0";
64
+ readonly 'vira-blue-70': "#006ec7";
65
+ readonly 'vira-blue-80': "#0054aa";
66
+ readonly 'vira-blue-90': "#00358a";
67
+ readonly 'vira-purple-5': "#f6eaff";
68
+ readonly 'vira-purple-10': "#eddaff";
69
+ readonly 'vira-purple-20': "#e6c3ff";
70
+ readonly 'vira-purple-30': "#d7adff";
71
+ readonly 'vira-purple-40': "#c795ff";
72
+ readonly 'vira-purple-50': "#b77aff";
73
+ readonly 'vira-purple-60': "#a55aff";
74
+ readonly 'vira-purple-70': "#8f3de9";
75
+ readonly 'vira-purple-80': "#7514cb";
76
+ readonly 'vira-purple-90': "#500095";
75
77
  readonly 'vira-pink-5': "#ffe7fb";
76
- readonly 'vira-pink-10': "#ffd5f7";
77
- readonly 'vira-pink-20': "#ffbaf5";
78
+ readonly 'vira-pink-10': "#ffd5fa";
79
+ readonly 'vira-pink-20': "#ffbaf4";
78
80
  readonly 'vira-pink-30': "#ff9ee6";
79
81
  readonly 'vira-pink-40': "#fa82cc";
80
- readonly 'vira-pink-50': "#e46eb8";
81
- readonly 'vira-pink-60': "#cd58a2";
82
- readonly 'vira-pink-70': "#b3408b";
83
- readonly 'vira-pink-80': "#962472";
84
- readonly 'vira-pink-90': "#6f0050";
85
- readonly 'vira-grey-5': "#eeeef1";
86
- readonly 'vira-grey-10': "#e1e1e4";
87
- readonly 'vira-grey-20': "#d0d0d6";
88
- readonly 'vira-grey-30': "#bebec3";
89
- readonly 'vira-grey-40': "#ababb2";
90
- readonly 'vira-grey-50': "#98989c";
91
- readonly 'vira-grey-60': "#838489";
92
- readonly 'vira-grey-70': "#6e6e73";
93
- readonly 'vira-grey-80': "#57575c";
94
- readonly 'vira-grey-90': "#3d3d43";
82
+ readonly 'vira-pink-50': "#e46eb7";
83
+ readonly 'vira-pink-60': "#cc59a2";
84
+ readonly 'vira-pink-70': "#b2418b";
85
+ readonly 'vira-pink-80': "#962471";
86
+ readonly 'vira-pink-90': "#6e004f";
87
+ readonly 'vira-grey-5': "#eceff0";
88
+ readonly 'vira-grey-10': "#dce2e6";
89
+ readonly 'vira-grey-20': "#c7d2d7";
90
+ readonly 'vira-grey-30': "#b6c0c5";
91
+ readonly 'vira-grey-40': "#a4adb2";
92
+ readonly 'vira-grey-50': "#909a9f";
93
+ readonly 'vira-grey-60': "#7c868a";
94
+ readonly 'vira-grey-70': "#677074";
95
+ readonly 'vira-grey-80': "#50595d";
96
+ readonly 'vira-grey-90': "#363f43";
95
97
  }>;
@@ -1,96 +1,98 @@
1
1
  import { defineCssVars } from 'lit-css-vars';
2
- /** Generously contributed by Trent Hazy, modified to more uniform contrast levels. */
2
+ /**
3
+ * The base Vira color theme palette.
4
+ *
5
+ * @category Color
6
+ */
3
7
  export const viraColorPalette = defineCssVars({
4
- 'vira-white': '#ffffff',
5
- 'vira-black': '#000000',
6
8
  'vira-red-5': '#ffe9e6',
7
- 'vira-red-10': '#ffd9d6',
9
+ 'vira-red-10': '#ffd9d5',
8
10
  'vira-red-20': '#ffc1bc',
9
- 'vira-red-30': '#ffa6a2',
10
- 'vira-red-40': '#ff8887',
11
+ 'vira-red-30': '#ffa7a2',
12
+ 'vira-red-40': '#ff8886',
11
13
  'vira-red-50': '#ff6065',
12
14
  'vira-red-60': '#f9163a',
13
- 'vira-red-70': '#d2001e',
15
+ 'vira-red-70': '#d2001d',
14
16
  'vira-red-80': '#a60012',
15
- 'vira-red-90': '#760004',
17
+ 'vira-red-90': '#760003',
16
18
  'vira-orange-5': '#ffebd1',
17
- 'vira-orange-10': '#ffdcab',
18
- 'vira-orange-20': '#ffc768',
19
- 'vira-orange-30': '#ffac3a',
20
- 'vira-orange-40': '#f49400',
21
- 'vira-orange-50': '#dd8100',
22
- 'vira-orange-60': '#c66b00',
23
- 'vira-orange-70': '#a85800',
24
- 'vira-orange-80': '#884400',
25
- 'vira-orange-90': '#682800',
26
- 'vira-yellow-5': '#f5f0c6',
27
- 'vira-yellow-10': '#eee399',
28
- 'vira-yellow-20': '#e9d100',
29
- 'vira-yellow-30': '#d6bf00',
30
- 'vira-yellow-40': '#c1ac00',
31
- 'vira-yellow-50': '#ad9800',
32
- 'vira-yellow-60': '#958400',
33
- 'vira-yellow-70': '#7d6e00',
34
- 'vira-yellow-80': '#635700',
35
- 'vira-yellow-90': '#473d00',
36
- 'vira-green-5': '#def6cc',
37
- 'vira-green-10': '#c4eea3',
38
- 'vira-green-20': '#94e53b',
39
- 'vira-green-30': '#81d316',
40
- 'vira-green-40': '#71bf00',
41
- 'vira-green-50': '#5eaa00',
42
- 'vira-green-60': '#509400',
43
- 'vira-green-70': '#427c00',
44
- 'vira-green-80': '#316200',
45
- 'vira-green-90': '#1f4600',
46
- 'vira-teal-5': '#d3f5ed',
47
- 'vira-teal-10': '#aeeedf',
48
- 'vira-teal-20': '#4ce6cc',
49
- 'vira-teal-30': '#31d3ba',
50
- 'vira-teal-40': '#00c0a7',
51
- 'vira-teal-50': '#00aa93',
52
- 'vira-teal-60': '#00937e',
53
- 'vira-teal-70': '#007c68',
54
- 'vira-teal-80': '#006252',
55
- 'vira-teal-90': '#004539',
56
- 'vira-blue-5': '#def1ff',
57
- 'vira-blue-10': '#c0e7ff',
58
- 'vira-blue-20': '#9dd7ff',
59
- 'vira-blue-30': '#78c5ff',
60
- 'vira-blue-40': '#5fb1fc',
61
- 'vira-blue-50': '#4d9de7',
62
- 'vira-blue-60': '#3588d0',
63
- 'vira-blue-70': '#1971b7',
64
- 'vira-blue-80': '#00579a',
65
- 'vira-blue-90': '#003a7b',
66
- 'vira-purple-5': '#f3ebff',
67
- 'vira-purple-10': '#e8dcff',
68
- 'vira-purple-20': '#e1c5ff',
69
- 'vira-purple-30': '#d1afff',
70
- 'vira-purple-40': '#c198ff',
71
- 'vira-purple-50': '#b07dff',
72
- 'vira-purple-60': '#a25cff',
73
- 'vira-purple-70': '#8a3cf2',
74
- 'vira-purple-80': '#710dd3',
75
- 'vira-purple-90': '#4c0099',
19
+ 'vira-orange-10': '#ffdda3',
20
+ 'vira-orange-20': '#ffc66c',
21
+ 'vira-orange-30': '#ffac36',
22
+ 'vira-orange-40': '#f79300',
23
+ 'vira-orange-50': '#e17e00',
24
+ 'vira-orange-60': '#c96900',
25
+ 'vira-orange-70': '#ab5600',
26
+ 'vira-orange-80': '#8b4100',
27
+ 'vira-orange-90': '#6a2500',
28
+ 'vira-yellow-5': '#f7eeca',
29
+ 'vira-yellow-10': '#f6e192',
30
+ 'vira-yellow-20': '#f2cd20',
31
+ 'vira-yellow-30': '#dfbb00',
32
+ 'vira-yellow-40': '#cca800',
33
+ 'vira-yellow-50': '#b59500',
34
+ 'vira-yellow-60': '#9d8100',
35
+ 'vira-yellow-70': '#856b00',
36
+ 'vira-yellow-80': '#6a5400',
37
+ 'vira-yellow-90': '#4c3b00',
38
+ 'vira-green-5': '#d3f8cf',
39
+ 'vira-green-10': '#a3f59b',
40
+ 'vira-green-20': '#4fed46',
41
+ 'vira-green-30': '#36d92e',
42
+ 'vira-green-40': '#0dc501',
43
+ 'vira-green-50': '#00af00',
44
+ 'vira-green-60': '#009800',
45
+ 'vira-green-70': '#007f00',
46
+ 'vira-green-80': '#006400',
47
+ 'vira-green-90': '#004700',
48
+ 'vira-teal-5': '#d4f5f3',
49
+ 'vira-teal-10': '#a1efeb',
50
+ 'vira-teal-20': '#45e5de',
51
+ 'vira-teal-30': '#2ad2cc',
52
+ 'vira-teal-40': '#04beb8',
53
+ 'vira-teal-50': '#00a9a3',
54
+ 'vira-teal-60': '#00928d',
55
+ 'vira-teal-70': '#007a77',
56
+ 'vira-teal-80': '#00615e',
57
+ 'vira-teal-90': '#004442',
58
+ 'vira-blue-5': '#daf2ff',
59
+ 'vira-blue-10': '#bde8ff',
60
+ 'vira-blue-20': '#98d8ff',
61
+ 'vira-blue-30': '#77c6ff',
62
+ 'vira-blue-40': '#4cb2ff',
63
+ 'vira-blue-50': '#299cf9',
64
+ 'vira-blue-60': '#0086e0',
65
+ 'vira-blue-70': '#006ec7',
66
+ 'vira-blue-80': '#0054aa',
67
+ 'vira-blue-90': '#00358a',
68
+ 'vira-purple-5': '#f6eaff',
69
+ 'vira-purple-10': '#eddaff',
70
+ 'vira-purple-20': '#e6c3ff',
71
+ 'vira-purple-30': '#d7adff',
72
+ 'vira-purple-40': '#c795ff',
73
+ 'vira-purple-50': '#b77aff',
74
+ 'vira-purple-60': '#a55aff',
75
+ 'vira-purple-70': '#8f3de9',
76
+ 'vira-purple-80': '#7514cb',
77
+ 'vira-purple-90': '#500095',
76
78
  'vira-pink-5': '#ffe7fb',
77
- 'vira-pink-10': '#ffd5f7',
78
- 'vira-pink-20': '#ffbaf5',
79
+ 'vira-pink-10': '#ffd5fa',
80
+ 'vira-pink-20': '#ffbaf4',
79
81
  'vira-pink-30': '#ff9ee6',
80
82
  'vira-pink-40': '#fa82cc',
81
- 'vira-pink-50': '#e46eb8',
82
- 'vira-pink-60': '#cd58a2',
83
- 'vira-pink-70': '#b3408b',
84
- 'vira-pink-80': '#962472',
85
- 'vira-pink-90': '#6f0050',
86
- 'vira-grey-5': '#eeeef1',
87
- 'vira-grey-10': '#e1e1e4',
88
- 'vira-grey-20': '#d0d0d6',
89
- 'vira-grey-30': '#bebec3',
90
- 'vira-grey-40': '#ababb2',
91
- 'vira-grey-50': '#98989c',
92
- 'vira-grey-60': '#838489',
93
- 'vira-grey-70': '#6e6e73',
94
- 'vira-grey-80': '#57575c',
95
- 'vira-grey-90': '#3d3d43',
83
+ 'vira-pink-50': '#e46eb7',
84
+ 'vira-pink-60': '#cc59a2',
85
+ 'vira-pink-70': '#b2418b',
86
+ 'vira-pink-80': '#962471',
87
+ 'vira-pink-90': '#6e004f',
88
+ 'vira-grey-5': '#eceff0',
89
+ 'vira-grey-10': '#dce2e6',
90
+ 'vira-grey-20': '#c7d2d7',
91
+ 'vira-grey-30': '#b6c0c5',
92
+ 'vira-grey-40': '#a4adb2',
93
+ 'vira-grey-50': '#909a9f',
94
+ 'vira-grey-60': '#7c868a',
95
+ 'vira-grey-70': '#677074',
96
+ 'vira-grey-80': '#50595d',
97
+ 'vira-grey-90': '#363f43',
96
98
  });