@innovaccer/design-system 4.27.0 → 4.28.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/CHANGELOG.md +67 -0
  2. package/css/Readme.md +2 -2
  3. package/css/SCOPED_CSS.md +145 -0
  4. package/css/dist/index.css +454 -495
  5. package/css/dist/index.css.map +1 -1
  6. package/css/dist/mds-scoped.css +13785 -0
  7. package/css/gulpfile.js +34 -25
  8. package/css/scoped/package.json +5 -0
  9. package/css/scripts/build-scoped.mjs +313 -0
  10. package/css/scripts/css-sources.cjs +49 -0
  11. package/css/scripts/portal-roots.cjs +47 -0
  12. package/css/src/components/chip.module.css +1 -1
  13. package/css/src/components/grid.module.css +12 -0
  14. package/css/src/components/input.module.css +1 -1
  15. package/css/src/components/metricInput.module.css +1 -1
  16. package/css/src/components/select.module.css +30 -4
  17. package/css/src/components/spinner.module.css +4 -4
  18. package/css/src/tokens/index.css +216 -295
  19. package/css/src/variables/index.css +189 -189
  20. package/dist/brotli/index.js +1 -1
  21. package/dist/brotli/index.js.br +0 -0
  22. package/dist/cjs/index.js +1 -1
  23. package/dist/core/ai-components/SaraSparkle/index.d.ts +1 -0
  24. package/dist/core/components/atoms/avatarGroup/AvatarGroup.d.ts +2 -0
  25. package/dist/core/components/molecules/tabs/TabsWrapper.d.ts +1 -0
  26. package/dist/core/components/molecules/tooltip/Tooltip.d.ts +1 -0
  27. package/dist/core/components/organisms/select/SelectContext.d.ts +1 -0
  28. package/dist/esm/index.js +439 -252
  29. package/dist/gzip/index.js +1 -1
  30. package/dist/gzip/index.js.gz +0 -0
  31. package/dist/index.js +413 -262
  32. package/dist/index.js.map +1 -1
  33. package/dist/index.umd.css +454 -495
  34. package/dist/index.umd.js +1 -1
  35. package/dist/types/tsconfig.type.tsbuildinfo +25 -23
  36. package/package.json +3 -2
@@ -1,240 +1,240 @@
1
1
  /**** Color Primitives ****/
2
2
  :root {
3
3
  /* Blue */
4
- --color-blue-100: #f0f9ff;
5
- --color-blue-200: #d6eeff;
6
- --color-blue-300: #c2e4ff;
7
- --color-blue-400: #a8d8ff;
8
- --color-blue-500: #8bcafe;
9
- --color-blue-600: #6fb7fb;
10
- --color-blue-700: #4fa3f8;
11
- --color-blue-800: #2e8ef5;
12
- --color-blue-900: #0a74f5;
13
- --color-blue-1000: #0060d6;
14
- --color-blue-1100: #0051ad;
15
- --color-blue-1200: #003e85;
16
- --color-blue-1300: #003066;
17
- --color-blue-1400: #002147;
18
- --color-blue-1000-4a: rgba(0, 96, 214, 0.04);
19
- --color-blue-1000-12a: rgba(0, 96, 214, 0.12);
20
- --color-blue-1000-16a: rgba(0, 96, 214, 0.16);
21
- --color-blue-200-48a: rgba(214, 238, 255, 0.48);
22
- --color-blue-500-48a: rgba(139, 202, 254, 0.48);
23
- --color-blue-1200-16a: rgba(0, 62, 133, 0.16);
4
+ --color-blue-50: #f0f9ff;
5
+ --color-blue-100: #d6eeff;
6
+ --color-blue-200: #c2e4ff;
7
+ --color-blue-300: #a8d8ff;
8
+ --color-blue-400: #8bcafe;
9
+ --color-blue-500: #6fb7fb;
10
+ --color-blue-600: #4fa3f8;
11
+ --color-blue-700: #2e8ef5;
12
+ --color-blue-800: #0a74f5;
13
+ --color-blue-900: #0060d6;
14
+ --color-blue-950: #0051ad;
15
+ --color-blue-1000: #003e85;
16
+ --color-blue-1100: #003066;
17
+ --color-blue-1200: #002147;
18
+ --color-blue-900-4a: rgba(0, 96, 214, 0.04);
19
+ --color-blue-900-12a: rgba(0, 96, 214, 0.12);
20
+ --color-blue-900-16a: rgba(0, 96, 214, 0.16);
21
+ --color-blue-100-48a: rgba(214, 238, 255, 0.48);
22
+ --color-blue-400-48a: rgba(139, 202, 254, 0.48);
23
+ --color-blue-1000-16a: rgba(0, 62, 133, 0.16);
24
24
 
25
25
  /* Red */
26
- --color-red-100: #fff7f5;
27
- --color-red-200: #ffe1db;
28
- --color-red-300: #ffd4cc;
29
- --color-red-400: #fec0b4;
30
- --color-red-500: #fcac9c;
31
- --color-red-600: #f49480;
32
- --color-red-700: #ed765e;
33
- --color-red-800: #e45b3f;
34
- --color-red-900: #df3011;
35
- --color-red-1000: #bd1c00;
36
- --color-red-1100: #9e200a;
37
- --color-red-1200: #791a06;
38
- --color-red-1300: #5c1305;
39
- --color-red-1400: #3f0e03;
40
- --color-red-1000-4a: rgba(189, 28, 0, 0.04);
41
- --color-red-1000-16a: rgba(189, 28, 0, 0.16);
42
- --color-red-1200-16a: rgba(121, 26, 6, 0.16);
26
+ --color-red-50: #fff7f5;
27
+ --color-red-100: #ffe1db;
28
+ --color-red-200: #ffd4cc;
29
+ --color-red-300: #fec0b4;
30
+ --color-red-400: #fcac9c;
31
+ --color-red-500: #f49480;
32
+ --color-red-600: #ed765e;
33
+ --color-red-700: #e45b3f;
34
+ --color-red-800: #df3011;
35
+ --color-red-900: #bd1c00;
36
+ --color-red-950: #9e200a;
37
+ --color-red-1000: #791a06;
38
+ --color-red-1100: #5c1305;
39
+ --color-red-1200: #3f0e03;
40
+ --color-red-900-4a: rgba(189, 28, 0, 0.04);
41
+ --color-red-900-16a: rgba(189, 28, 0, 0.16);
42
+ --color-red-1000-16a: rgba(121, 26, 6, 0.16);
43
43
 
44
44
  /* Green */
45
- --color-green-100: #f1f9f0;
46
- --color-green-200: #dcf0db;
47
- --color-green-300: #cbe8c9;
48
- --color-green-400: #b6dfb3;
49
- --color-green-500: #9dd49b;
50
- --color-green-600: #7ec57d;
51
- --color-green-700: #5eb55e;
52
- --color-green-800: #3aa63c;
53
- --color-green-900: #009900;
54
- --color-green-1000: #008000;
55
- --color-green-1100: #006b00;
56
- --color-green-1200: #005200;
57
- --color-green-1300: #003d04;
58
- --color-green-1400: #002904;
59
- --color-green-1000-4a: rgba(0, 128, 0, 0.04);
60
- --color-green-1000-16a: rgba(0, 128, 0, 0.16);
61
- --color-green-1200-16a: rgba(0, 82, 0, 0.16);
45
+ --color-green-50: #f1f9f0;
46
+ --color-green-100: #dcf0db;
47
+ --color-green-200: #cbe8c9;
48
+ --color-green-300: #b6dfb3;
49
+ --color-green-400: #9dd49b;
50
+ --color-green-500: #7ec57d;
51
+ --color-green-600: #5eb55e;
52
+ --color-green-700: #3aa63c;
53
+ --color-green-800: #009900;
54
+ --color-green-900: #008000;
55
+ --color-green-950: #006b00;
56
+ --color-green-1000: #005200;
57
+ --color-green-1100: #003d04;
58
+ --color-green-1200: #002904;
59
+ --color-green-900-4a: rgba(0, 128, 0, 0.04);
60
+ --color-green-900-16a: rgba(0, 128, 0, 0.16);
61
+ --color-green-1000-16a: rgba(0, 82, 0, 0.16);
62
62
 
63
63
  /* Yellow */
64
- --color-yellow-100: #fff9e5;
65
- --color-yellow-200: #fff5d6;
66
- --color-yellow-300: #fff0c2;
67
- --color-yellow-400: #ffe9a8;
68
- --color-yellow-500: #fee18b;
69
- --color-yellow-600: #fbd86f;
70
- --color-yellow-700: #f8cd4f;
71
- --color-yellow-800: #f5c32e;
72
- --color-yellow-900: #f5ba0a;
73
- --color-yellow-1000: #d6a100;
74
- --color-yellow-1100: #ad8200;
75
- --color-yellow-1200: #856300;
76
- --color-yellow-1300: #664d00;
77
- --color-yellow-1400: #473600;
78
- --color-yellow-900-4a: rgba(245, 186, 10, 0.04);
79
- --color-yellow-900-16a: rgba(245, 186, 10, 0.16);
80
- --color-yellow-1000-16a: rgba(214, 161, 0, 0.16);
81
- --color-yellow-1100-16a: rgba(173, 130, 0, 0.16);
64
+ --color-yellow-50: #fff9e5;
65
+ --color-yellow-100: #fff5d6;
66
+ --color-yellow-200: #fff0c2;
67
+ --color-yellow-300: #ffe9a8;
68
+ --color-yellow-400: #fee18b;
69
+ --color-yellow-500: #fbd86f;
70
+ --color-yellow-600: #f8cd4f;
71
+ --color-yellow-700: #f5c32e;
72
+ --color-yellow-800: #f5ba0a;
73
+ --color-yellow-900: #d6a100;
74
+ --color-yellow-950: #ad8200;
75
+ --color-yellow-1000: #856300;
76
+ --color-yellow-1100: #664d00;
77
+ --color-yellow-1200: #473600;
78
+ --color-yellow-800-4a: rgba(245, 186, 10, 0.04);
79
+ --color-yellow-800-16a: rgba(245, 186, 10, 0.16);
80
+ --color-yellow-900-16a: rgba(214, 161, 0, 0.16);
81
+ --color-yellow-950-16a: rgba(173, 130, 0, 0.16);
82
82
 
83
83
  /* Orange */
84
- --color-orange-100: #ffeed1;
85
- --color-orange-200: #ffe8c2;
86
- --color-orange-300: #ffdca3;
87
- --color-orange-400: #ffca7a;
88
- --color-orange-500: #ffb657;
89
- --color-orange-600: #ffa333;
90
- --color-orange-700: #ff9114;
91
- --color-orange-800: #eb7900;
92
- --color-orange-900: #d66c00;
93
- --color-orange-1000: #bd5b00;
94
- --color-orange-1100: #a34c00;
95
- --color-orange-1200: #8a3b00;
96
- --color-orange-1300: #6b2900;
97
- --color-orange-1400: #4d1c00;
98
- --color-orange-1000-4a: rgba(189, 91, 0, 0.04);
99
- --color-orange-1000-16a: rgba(189, 91, 0, 0.16);
84
+ --color-orange-50: #ffeed1;
85
+ --color-orange-100: #ffe8c2;
86
+ --color-orange-200: #ffdca3;
87
+ --color-orange-300: #ffca7a;
88
+ --color-orange-400: #ffb657;
89
+ --color-orange-500: #ffa333;
90
+ --color-orange-600: #ff9114;
91
+ --color-orange-700: #eb7900;
92
+ --color-orange-800: #d66c00;
93
+ --color-orange-900: #bd5b00;
94
+ --color-orange-950: #a34c00;
95
+ --color-orange-1000: #8a3b00;
96
+ --color-orange-1100: #6b2900;
97
+ --color-orange-1200: #4d1c00;
98
+ --color-orange-900-4a: rgba(189, 91, 0, 0.04);
99
+ --color-orange-900-16a: rgba(189, 91, 0, 0.16);
100
100
 
101
101
  /* Violet */
102
- --color-violet-100: #faf6fe;
103
- --color-violet-200: #f0e7fd;
104
- --color-violet-300: #e4d5fb;
105
- --color-violet-400: #dcc7fa;
106
- --color-violet-500: #cfb4f8;
107
- --color-violet-600: #c0a0f3;
108
- --color-violet-700: #ac87ee;
109
- --color-violet-800: #9e72e9;
110
- --color-violet-900: #8854e8;
111
- --color-violet-1000: #6f47cd;
112
- --color-violet-1100: #5b3ba5;
113
- --color-violet-1200: #462d80;
114
- --color-violet-1300: #322361;
115
- --color-violet-1400: #211844;
116
- --color-violet-1000-16a: rgba(111, 71, 205, 0.16);
102
+ --color-violet-50: #faf6fe;
103
+ --color-violet-100: #f0e7fd;
104
+ --color-violet-200: #e4d5fb;
105
+ --color-violet-300: #dcc7fa;
106
+ --color-violet-400: #cfb4f8;
107
+ --color-violet-500: #c0a0f3;
108
+ --color-violet-600: #ac87ee;
109
+ --color-violet-700: #9e72e9;
110
+ --color-violet-800: #8854e8;
111
+ --color-violet-900: #6f47cd;
112
+ --color-violet-950: #5b3ba5;
113
+ --color-violet-1000: #462d80;
114
+ --color-violet-1100: #322361;
115
+ --color-violet-1200: #211844;
116
+ --color-violet-900-16a: rgba(111, 71, 205, 0.16);
117
117
 
118
118
  /* Indigo */
119
- --color-indigo-100: #f5f6ff;
120
- --color-indigo-200: #e5e8ff;
121
- --color-indigo-300: #d6daff;
122
- --color-indigo-400: #c7ccff;
123
- --color-indigo-500: #b3baff;
124
- --color-indigo-600: #9faafe;
125
- --color-indigo-700: #8993fa;
126
- --color-indigo-800: #7380f7;
127
- --color-indigo-900: #5a67f6;
128
- --color-indigo-1000: #4256d7;
129
- --color-indigo-1100: #2f4aac;
130
- --color-indigo-1200: #223987;
131
- --color-indigo-1300: #192b66;
132
- --color-indigo-1400: #101c46;
133
- --color-indigo-1000-16a: rgba(66, 86, 215, 0.16);
119
+ --color-indigo-50: #f5f6ff;
120
+ --color-indigo-100: #e5e8ff;
121
+ --color-indigo-200: #d6daff;
122
+ --color-indigo-300: #c7ccff;
123
+ --color-indigo-400: #b3baff;
124
+ --color-indigo-500: #9faafe;
125
+ --color-indigo-600: #8993fa;
126
+ --color-indigo-700: #7380f7;
127
+ --color-indigo-800: #5a67f6;
128
+ --color-indigo-900: #4256d7;
129
+ --color-indigo-950: #2f4aac;
130
+ --color-indigo-1000: #223987;
131
+ --color-indigo-1100: #192b66;
132
+ --color-indigo-1200: #101c46;
133
+ --color-indigo-900-16a: rgba(66, 86, 215, 0.16);
134
134
 
135
135
  /* Lime */
136
- --color-lime-100: #f5faed;
137
- --color-lime-200: #e4efd3;
138
- --color-lime-300: #d5e6bb;
139
- --color-lime-400: #c5dc9e;
140
- --color-lime-500: #b2d07d;
141
- --color-lime-600: #9dc057;
142
- --color-lime-700: #87b018;
143
- --color-lime-800: #779d00;
144
- --color-lime-900: #688900;
145
- --color-lime-1000: #577400;
146
- --color-lime-1100: #476000;
147
- --color-lime-1200: #364900;
148
- --color-lime-1300: #283800;
149
- --color-lime-1400: #1a2700;
150
- --color-lime-900-16a: rgba(104, 137, 0, 0.16);
151
- --color-lime-1000-16a: rgba(87, 116, 0, 0.16);
136
+ --color-lime-50: #f5faed;
137
+ --color-lime-100: #e4efd3;
138
+ --color-lime-200: #d5e6bb;
139
+ --color-lime-300: #c5dc9e;
140
+ --color-lime-400: #b2d07d;
141
+ --color-lime-500: #9dc057;
142
+ --color-lime-600: #87b018;
143
+ --color-lime-700: #779d00;
144
+ --color-lime-800: #688900;
145
+ --color-lime-900: #577400;
146
+ --color-lime-950: #476000;
147
+ --color-lime-1000: #364900;
148
+ --color-lime-1100: #283800;
149
+ --color-lime-1200: #1a2700;
150
+ --color-lime-800-16a: rgba(104, 137, 0, 0.16);
151
+ --color-lime-900-16a: rgba(87, 116, 0, 0.16);
152
152
 
153
153
  /* Cyan */
154
- --color-cyan-100: #eefafc;
155
- --color-cyan-200: #cff1f7;
156
- --color-cyan-300: #b6e8f2;
157
- --color-cyan-400: #96dfee;
158
- --color-cyan-500: #6ed3e7;
159
- --color-cyan-600: #33c4e1;
160
- --color-cyan-700: #00b2d6;
161
- --color-cyan-800: #009fc7;
162
- --color-cyan-900: #008cb3;
163
- --color-cyan-1000: #007599;
164
- --color-cyan-1100: #006080;
165
- --color-cyan-1200: #004766;
166
- --color-cyan-1300: #003952;
167
- --color-cyan-1400: #002738;
168
-
169
- /* Sea */
170
- --color-sea-100: #effaf9;
171
- --color-sea-200: #cff2ef;
172
- --color-sea-300: #b8eae5;
173
- --color-sea-400: #98e2dc;
174
- --color-sea-500: #6fd8d2;
175
- --color-sea-600: #2fcac0;
176
- --color-sea-700: #00b8ae;
177
- --color-sea-800: #00a89d;
178
- --color-sea-900: #008f88;
179
- --color-sea-1000: #007a74;
180
- --color-sea-1100: #00665f;
181
- --color-sea-1200: #004d47;
182
- --color-sea-1300: #003d3a;
183
- --color-sea-1400: #002926;
184
-
185
- /* Magenta */
186
- --color-magenta-100: #fff5f9;
187
- --color-magenta-200: #fee1eb;
188
- --color-magenta-300: #fccfdf;
189
- --color-magenta-400: #fabdd2;
190
- --color-magenta-500: #f6a7c4;
191
- --color-magenta-600: #ef8fb2;
192
- --color-magenta-700: #e7739e;
193
- --color-magenta-800: #de5487;
194
- --color-magenta-900: #d62974;
195
- --color-magenta-1000: #bb165b;
196
- --color-magenta-1100: #991a44;
197
- --color-magenta-1200: #751538;
198
- --color-magenta-1300: #5a112d;
199
- --color-magenta-1400: #3d0b20;
154
+ --color-cyan-50: #eefafc;
155
+ --color-cyan-100: #cff1f7;
156
+ --color-cyan-200: #b6e8f2;
157
+ --color-cyan-300: #96dfee;
158
+ --color-cyan-400: #6ed3e7;
159
+ --color-cyan-500: #33c4e1;
160
+ --color-cyan-600: #00b2d6;
161
+ --color-cyan-700: #009fc7;
162
+ --color-cyan-800: #008cb3;
163
+ --color-cyan-900: #007599;
164
+ --color-cyan-950: #006080;
165
+ --color-cyan-1000: #004766;
166
+ --color-cyan-1100: #003952;
167
+ --color-cyan-1200: #002738;
168
+
169
+ /* Teal */
170
+ --color-teal-50: #effaf9;
171
+ --color-teal-100: #cff2ef;
172
+ --color-teal-200: #b8eae5;
173
+ --color-teal-300: #98e2dc;
174
+ --color-teal-400: #6fd8d2;
175
+ --color-teal-500: #2fcac0;
176
+ --color-teal-600: #00b8ae;
177
+ --color-teal-700: #00a89d;
178
+ --color-teal-800: #008f88;
179
+ --color-teal-900: #007a74;
180
+ --color-teal-950: #00665f;
181
+ --color-teal-1000: #004d47;
182
+ --color-teal-1100: #003d3a;
183
+ --color-teal-1200: #002926;
200
184
 
201
185
  /* Pink */
202
- --color-pink-100: #fdf6fc;
203
- --color-pink-200: #f8e2f5;
204
- --color-pink-300: #f3d3ef;
205
- --color-pink-400: #efc2e9;
206
- --color-pink-500: #e7ace1;
207
- --color-pink-600: #dd92d5;
208
- --color-pink-700: #d17acd;
209
- --color-pink-800: #c55ec1;
210
- --color-pink-900: #b83db8;
211
- --color-pink-1000: #9d2d9f;
212
- --color-pink-1100: #842a82;
213
- --color-pink-1200: #651f64;
214
- --color-pink-1300: #4e184d;
215
- --color-pink-1400: #371036;
216
-
217
- /* Gray */
218
- --color-gray-100: #f7f7f7;
219
- --color-gray-200: #ebebeb;
220
- --color-gray-300: #e0e0e0;
221
- --color-gray-400: #d4d4d4;
222
- --color-gray-500: #c4c4c4;
223
- --color-gray-600: #b5b5b5;
224
- --color-gray-700: #a3a3a3;
225
- --color-gray-800: #858585;
226
- --color-gray-900: #636363;
227
- --color-gray-1000: #575757;
228
- --color-gray-1100: #424242;
229
- --color-gray-1200: #333333;
230
- --color-gray-1300: #242424;
231
- --color-gray-1400: #1a1a1a;
232
- --color-gray-100-40a: rgba(247, 247, 247, 0.4);
233
- --color-gray-400-16a: rgba(212, 212, 212, 0.16);
234
- --color-gray-1400-16a: rgba(26, 26, 26, 0.16);
235
- --color-gray-1400-48a: rgba(26, 26, 26, 0.48);
236
- --color-gray-1400-64a: rgba(26, 26, 26, 0.64);
237
- --color-gray-1400-80a: rgba(26, 26, 26, 0.8);
186
+ --color-pink-50: #fff5f9;
187
+ --color-pink-100: #fee1eb;
188
+ --color-pink-200: #fccfdf;
189
+ --color-pink-300: #fabdd2;
190
+ --color-pink-400: #f6a7c4;
191
+ --color-pink-500: #ef8fb2;
192
+ --color-pink-600: #e7739e;
193
+ --color-pink-700: #de5487;
194
+ --color-pink-800: #d62974;
195
+ --color-pink-900: #bb165b;
196
+ --color-pink-950: #991a44;
197
+ --color-pink-1000: #751538;
198
+ --color-pink-1100: #5a112d;
199
+ --color-pink-1200: #3d0b20;
200
+
201
+ /* Fuchsia */
202
+ --color-fuchsia-50: #fdf6fc;
203
+ --color-fuchsia-100: #f8e2f5;
204
+ --color-fuchsia-200: #f3d3ef;
205
+ --color-fuchsia-300: #efc2e9;
206
+ --color-fuchsia-400: #e7ace1;
207
+ --color-fuchsia-500: #dd92d5;
208
+ --color-fuchsia-600: #d17acd;
209
+ --color-fuchsia-700: #c55ec1;
210
+ --color-fuchsia-800: #b83db8;
211
+ --color-fuchsia-900: #9d2d9f;
212
+ --color-fuchsia-950: #842a82;
213
+ --color-fuchsia-1000: #651f64;
214
+ --color-fuchsia-1100: #4e184d;
215
+ --color-fuchsia-1200: #371036;
216
+
217
+ /* Neutral */
218
+ --color-neutral-50: #f7f7f7;
219
+ --color-neutral-100: #ebebeb;
220
+ --color-neutral-200: #e0e0e0;
221
+ --color-neutral-300: #d4d4d4;
222
+ --color-neutral-400: #c4c4c4;
223
+ --color-neutral-500: #b5b5b5;
224
+ --color-neutral-600: #a3a3a3;
225
+ --color-neutral-700: #858585;
226
+ --color-neutral-800: #636363;
227
+ --color-neutral-900: #575757;
228
+ --color-neutral-950: #424242;
229
+ --color-neutral-1000: #333333;
230
+ --color-neutral-1100: #242424;
231
+ --color-neutral-1200: #1a1a1a;
232
+ --color-neutral-50-40a: rgba(247, 247, 247, 0.4);
233
+ --color-neutral-300-16a: rgba(212, 212, 212, 0.16);
234
+ --color-neutral-1200-16a: rgba(26, 26, 26, 0.16);
235
+ --color-neutral-1200-48a: rgba(26, 26, 26, 0.48);
236
+ --color-neutral-1200-64a: rgba(26, 26, 26, 0.64);
237
+ --color-neutral-1200-80a: rgba(26, 26, 26, 0.8);
238
238
 
239
239
  /* Defaults */
240
240
  --color-white: #ffffff;
@@ -242,91 +242,12 @@
242
242
  --color-white-48a: rgba(255, 255, 255, 0.48);
243
243
  --color-white-80a: rgba(255, 255, 255, 0.8);
244
244
 
245
- /**** Semantic Colors (mapped to primitives) ****/
246
-
247
- /* Warning (Yellow) */
248
- --haldi: var(--color-yellow-900);
249
- --haldi-dark: var(--color-yellow-1100);
250
- --haldi-darker: var(--color-yellow-1300);
251
- --haldi-light: var(--color-yellow-700);
252
- --haldi-lighter: var(--color-yellow-500);
253
- --haldi-lightest: var(--color-yellow-200);
254
-
255
- /* Primary (Blue) */
256
- --jal: var(--color-blue-1000);
257
- --jal-dark: var(--color-blue-1200);
258
- --jal-darker: var(--color-blue-1300);
259
- --jal-light: var(--color-blue-700);
260
- --jal-lighter: var(--color-blue-500);
261
- --jal-lightest: var(--color-blue-200);
262
-
263
- /* Accent 2 (Violet) */
264
- --jamun: var(--color-violet-1000);
265
- --jamun-dark: var(--color-violet-1200);
266
- --jamun-darker: var(--color-violet-1300);
267
- --jamun-light: var(--color-violet-700);
268
- --jamun-lighter: var(--color-violet-500);
269
- --jamun-lightest: var(--color-violet-200);
270
-
271
- /* Alert (Red) */
272
- --mirch: var(--color-red-1000);
273
- --mirch-dark: var(--color-red-1200);
274
- --mirch-darker: var(--color-red-1300);
275
- --mirch-light: var(--color-red-700);
276
- --mirch-lighter: var(--color-red-500);
277
- --mirch-lightest: var(--color-red-200);
278
-
279
- /* Accent 3 (Indigo) */
280
- --neel: var(--color-indigo-1000);
281
- --neel-dark: var(--color-indigo-1200);
282
- --neel-darker: var(--color-indigo-1300);
283
- --neel-light: var(--color-indigo-700);
284
- --neel-lighter: var(--color-indigo-500);
285
- --neel-lightest: var(--color-indigo-200);
286
-
287
- /* Success (Green) */
288
- --neem: var(--color-green-1000);
289
- --neem-dark: var(--color-green-1200);
290
- --neem-darker: var(--color-green-1300);
291
- --neem-light: var(--color-green-700);
292
- --neem-lighter: var(--color-green-500);
293
- --neem-lightest: var(--color-green-200);
294
-
295
- /* Neutral (Gray) */
296
- --night: var(--color-gray-1400);
297
- --night-light: var(--color-gray-1100);
298
- --night-lighter: var(--color-gray-900);
299
- --night-lightest: var(--color-gray-700);
300
-
301
- /* Accent 4 (Lime) */
302
- --nimbu: var(--color-lime-1000);
303
- --nimbu-dark: var(--color-lime-1200);
304
- --nimbu-darker: var(--color-lime-1300);
305
- --nimbu-light: var(--color-lime-700);
306
- --nimbu-lighter: var(--color-lime-500);
307
- --nimbu-lightest: var(--color-lime-200);
308
-
309
245
  /* Shadows */
310
246
  --shadow-0: #ffffff;
311
247
  --shadow-10: #ffffff;
312
248
  --shadow-20: #ffffff;
313
249
  --shadow-30: #ffffff;
314
250
 
315
- /* Secondary (Gray) */
316
- --stone: var(--color-gray-400);
317
- --stone-dark: var(--color-gray-500);
318
- --stone-light: var(--color-gray-300);
319
- --stone-lighter: var(--color-gray-200);
320
- --stone-lightest: var(--color-gray-100);
321
-
322
- /* Accent 1 (Orange) */
323
- --tawak: var(--color-orange-1000);
324
- --tawak-dark: var(--color-orange-1200);
325
- --tawak-darker: var(--color-orange-1300);
326
- --tawak-light: var(--color-orange-700);
327
- --tawak-lighter: var(--color-orange-500);
328
- --tawak-lightest: var(--color-orange-200);
329
-
330
251
  --white: var(--color-white);
331
252
 
332
253
  /**** Fonts ****/