myshell-react-lib 0.2.20 → 0.2.21

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 (18) hide show
  1. package/dist/assets/animationData.json +4759 -0
  2. package/dist/assets/animationDataDark.json +4759 -0
  3. package/dist/assets/audio-playing.json +3657 -0
  4. package/dist/index.cjs +24753 -0
  5. package/dist/index.cjs.map +1 -0
  6. package/dist/index.d.cts +1763 -0
  7. package/dist/index.d.ts +1763 -0
  8. package/dist/index.js +23728 -0
  9. package/dist/index.js.map +1 -0
  10. package/dist/styles/components-dark.scss +210 -0
  11. package/dist/styles/components-light.scss +208 -0
  12. package/dist/styles/design2-dark.scss +332 -0
  13. package/dist/styles/design2-light.scss +366 -0
  14. package/dist/styles/font.css +19 -0
  15. package/dist/styles/global.scss +278 -0
  16. package/dist/styles/md-viewer.scss +155 -0
  17. package/dist/styles/new-tokens.scss +264 -0
  18. package/package.json +2 -2
package/dist/styles/design2-dark.scss ADDED
@@ -0,0 +1,332 @@
1
+ @import './new-tokens.scss';
2
+
3
+ @layer base {
4
+ .dark {
5
+ // Colors Background Normal Primary
6
+ --Colors-Background-Normal-Primary-Default: var(--Neutral-Variant-10);
7
+ --Colors-Background-Normal-Primary-Hover: var(--Neutral-Variant-20);
8
+ --Colors-Background-Normal-Primary-Active: var(--Neutral-Variant-30);
9
+ --Colors-Background-Normal-Primary-Alt: var(--Neutral-Variant-10);
10
+
11
+ // Colors Background Normal Secondary
12
+ --Colors-Background-Normal-Secondary-Default: var(--Neutral-Variant-20);
13
+ --Colors-Background-Normal-Secondary-Alt: var(--Neutral-Variant-20);
14
+ --Colors-Background-Normal-Secondary-Hover: var(--Neutral-Variant-30);
15
+ --Colors-Background-Normal-Secondary-Active: var(--Neutral-Variant-40);
16
+
17
+ // Colors Background Normal Tertiary
18
+ --Colors-Background-Normal-Tertiary-Default: var(--Neutral-Variant-30);
19
+ --Colors-Background-Normal-Tertiary-Hover: var(--Neutral-Variant-40);
20
+ --Colors-Background-Normal-Tertiary-Active: var(--Neutral-Variant-50);
21
+
22
+ // Colors Background Neutral Primary
23
+ --Colors-Background-Neutral-Primary-Default: var(--Neutral-Variant-5);
24
+ --Colors-Background-Neutral-Primary-Hover: var(--Neutral-Variant-10);
25
+ --Colors-Background-Neutral-Primary-Active: var(--Neutral-Variant-20);
26
+
27
+ // Colors Background Neutral Secondary
28
+ --Colors-Background-Neutral-Secondary-Default: var(--Neutral-Variant-10);
29
+ --Colors-Background-Neutral-Secondary-Hover: var(--Neutral-Variant-20);
30
+ --Colors-Background-Neutral-Secondary-Active: var(--Neutral-Variant-30);
31
+
32
+ // Colors Background Neutral Tertiary
33
+ --Colors-Background-Neutral-Tertiary-Default: var(--Neutral-Variant-30);
34
+ --Colors-Background-Neutral-Tertiary-Hover: var(--Neutral-Variant-40);
35
+ --Colors-Background-Neutral-Tertiary-Active: var(--Neutral-Variant-50);
36
+
37
+ // Colors Background Neutral On Surface
38
+ --Colors-Background-Neutral-On-Surface-Default: var(--Opacity-White-3);
39
+ --Colors-Background-Neutral-On-Surface-Hover: var(--Opacity-White-5);
40
+ --Colors-Background-Neutral-On-Surface-Active: var(--Opacity-White-8);
41
+ --Colors-Background-Neutral-On-Surface-Disabled: var(--Opacity-White-3);
42
+ --Colors-Background-Neutral-On-Surface-Alt: var(--Opacity-White-12);
43
+
44
+ // Colors Background Utilities
45
+ --Colors-Background-Utilities-Bolder: var(--Neutral-Variant-99);
46
+ --Colors-Background-Utilities-None: var(--Basic-None);
47
+ --Colors-Background-Utilities-Overlay: var(--Opacity-Black-70);
48
+ --Colors-Background-Utilities-Static-White: var(--Neutral-Variant-99);
49
+ --Colors-Background-Utilities-Static-Black: var(--Neutral-Variant-5);
50
+ --Colors-Background-Utilities-Modal:var(--Neutral-Variant-10);
51
+
52
+ // Colors Background Brand
53
+ --Colors-Background-Brand-Default: var(--Pure-Mauve-20);
54
+ --Colors-Background-Brand-Alt: var(--Pure-Mauve-50);
55
+ --Colors-Background-Brand-Subtle: var(--Pure-Mauve-10);
56
+ --Colors-Background-Brand-Hover: var(--Pure-Mauve-30);
57
+ --Colors-Background-Brand-Active: var(--Pure-Mauve-40);
58
+ --Colors-Background-Brand-Bolder: var(--Pure-Mauve-80);
59
+
60
+ // Colors Background Critical
61
+ --Colors-Background-Critical-Default: var(--Terracotta-Variant-20);
62
+ --Colors-Background-Critical-Alt: var(--Terracotta-50);
63
+ --Colors-Background-Critical-Subtle: var(--Terracotta-Variant-10);
64
+ --Colors-Background-Critical-Hover: var(--Terracotta-Variant-30);
65
+ --Colors-Background-Critical-Active: var(--Terracotta-Variant-40);
66
+ --Colors-Background-Critical-Bolder: var(--Terracotta-80);
67
+
68
+ // Colors Background Warning
69
+ --Colors-Background-Warning-Default: var(--Khaki-20);
70
+ --Colors-Background-Warning-Alt: var(--Khaki-50);
71
+ --Colors-Background-Warning-Subtle: var(--Khaki-10);
72
+ --Colors-Background-Warning-Hover: var(--Khaki-30);
73
+ --Colors-Background-Warning-Active: var(--Khaki-40);
74
+ --Colors-Background-Warning-Bolder: var(--Khaki-80);
75
+
76
+ // Colors Background Success
77
+ --Colors-Background-Success-Default: var(--Teal-20);
78
+ --Colors-Background-Success-Alt: var(--Teal-50);
79
+ --Colors-Background-Success-Subtle: var(--Teal-10);
80
+ --Colors-Background-Success-Hover: var(--Teal-30);
81
+ --Colors-Background-Success-Active: var(--Teal-40);
82
+ --Colors-Background-Success-Bolder: var(--Teal-80);
83
+
84
+ // Colors Background Info
85
+ --Colors-Background-Info-Default: var(--Lake-Blue-20);
86
+ --Colors-Background-Info-Alt: var(--Lake-Blue-50);
87
+ --Colors-Background-Info-Subtle: var(--Lake-Blue-10);
88
+ --Colors-Background-Info-Hover: var(--Lake-Blue-30);
89
+ --Colors-Background-Info-Active: var(--Lake-Blue-40);
90
+ --Colors-Background-Info-Bolder: var(--Lake-Blue-80);
91
+
92
+ // Colors Text
93
+ --Colors-Text-Default: var(--Neutral-Variant-100);
94
+ --Colors-Text-Subtle: var(--Neutral-Variant-90);
95
+ --Colors-Text-Subtler: var(--Neutral-Variant-70);
96
+ --Colors-Text-Subtlest: var(--Neutral-Variant-50);
97
+ --Colors-Text-Disabled: var(--Neutral-Variant-40);
98
+ --Colors-Text-Bolder: var(--Neutral-Variant-5);
99
+
100
+ // Colors Text Static
101
+ --Colors-Text-Static-White: var(--Neutral-Variant-100);
102
+ --Colors-Text-Static-Black: var(--Neutral-Variant-5);
103
+
104
+ // Colors Text Brand
105
+ --Colors-Text-Brand-Subtle: var(--Pure-Mauve-30);
106
+ --Colors-Text-Brand-Default: var(--Pure-Mauve-70);
107
+ --Colors-Text-Brand-Bolder: var(--Pure-Mauve-90);
108
+
109
+ // Colors Text Critical
110
+ --Colors-Text-Critical-Subtle: var(--Terracotta-30);
111
+ --Colors-Text-Critical-Default: var(--Terracotta-60);
112
+ --Colors-Text-Critical-Bolder: var(--Terracotta-90);
113
+
114
+ // Colors Text Warning
115
+ --Colors-Text-Warning-Subtle: var(--Khaki-30);
116
+ --Colors-Text-Warning-Default: var(--Khaki-70);
117
+ --Colors-Text-Warning-Bolder: var(--Khaki-90);
118
+
119
+ // Colors Text Success
120
+ --Colors-Text-Success-Subtle: var(--Teal-30);
121
+ --Colors-Text-Success-Default: var(--Teal-60);
122
+ --Colors-Text-Success-Bolder: var(--Teal-90);
123
+
124
+ // Colors Foreground
125
+ --Colors-Foreground-Default: var(--Neutral-Variant-100);
126
+ --Colors-Foreground-Subtle: var(--Neutral-Variant-90);
127
+ --Colors-Foreground-Subtler: var(--Neutral-Variant-70);
128
+ --Colors-Foreground-Subtlest: var(--Neutral-Variant-50);
129
+ --Colors-Foreground-Disabled: var(--Neutral-Variant-40);
130
+ --Colors-Foreground-Bolder: var(--Neutral-Variant-5);
131
+
132
+ // Colors Foreground Static
133
+ --Colors-Foreground-Static-White: var(--Neutral-Variant-100);
134
+ --Colors-Foreground-Static-Black: var(--Neutral-Variant-5);
135
+
136
+ // Colors Foreground Brand
137
+ --Colors-Foreground-Brand-Subtle: var(--Pure-Mauve-30);
138
+ --Colors-Foreground-Brand-Default: var(--Pure-Mauve-70);
139
+ --Colors-Foreground-Brand-Bolder: var(--Pure-Mauve-90);
140
+
141
+ // Colors Foreground Critical
142
+ --Colors-Foreground-Critical-Subtle: var(--Terracotta-30);
143
+ --Colors-Foreground-Critical-Default: var(--Terracotta-60);
144
+ --Colors-Foreground-Critical-Bolder: var(--Terracotta-90);
145
+
146
+ // Colors Foreground Warning
147
+ --Colors-Foreground-Warning-Subtle: var(--Khaki-30);
148
+ --Colors-Foreground-Warning-Default: var(--Khaki-70);
149
+ --Colors-Foreground-Warning-Bolder: var(--Khaki-90);
150
+
151
+ // Colors Foreground Success
152
+ --Colors-Foreground-Success-Subtle: var(--Teal-30);
153
+ --Colors-Foreground-Success-Default: var(--Teal-60);
154
+ --Colors-Foreground-Success-Bolder: var(--Teal-90);
155
+
156
+ // Colors Border
157
+ --Colors-Border-Default: var(--Neutral-Variant-30);
158
+ --Colors-Border-Alt: var(--Neutral-Variant-40);
159
+ --Colors-Border-Hover: var(--Neutral-Variant-40);
160
+ --Colors-Border-Active: var(--Neutral-Variant-50);
161
+ --Colors-Border-Bolder: var(--Neutral-Variant-100);
162
+ --Colors-Border-Brand: var(--Pure-Mauve-60);
163
+ --Colors-Border-Brand_alt: var(--Pure-Mauve-40);
164
+ --Colors-Border-Critical: var(--Terracotta-60);
165
+ --Colors-Border-Success: var(--Teal-60);
166
+ --Colors-Border-Warning: var(--Khaki-60);
167
+ --Colors-Border-Opaque: var(--Opacity-White-8);
168
+ --Colors-Border-Static: var(--Neutral-Variant-95);
169
+
170
+ // Colors Alpha
171
+ --Colors-Alpha-White-1: var(--Opacity-Black-1);
172
+ --Colors-Alpha-White-3: var(--Opacity-Black-3);
173
+ --Colors-Alpha-White-5: var(--Opacity-Black-5);
174
+ --Colors-Alpha-White-8: var(--Opacity-Black-8);
175
+ --Colors-Alpha-White-12: var(--Opacity-Black-12);
176
+ --Colors-Alpha-White-16: var(--Opacity-Black-16);
177
+ --Colors-Alpha-White-20: var(--Opacity-Black-20);
178
+ --Colors-Alpha-White-30: var(--Opacity-Black-30);
179
+ --Colors-Alpha-White-40: var(--Opacity-Black-40);
180
+ --Colors-Alpha-White-50: var(--Opacity-Black-50);
181
+ --Colors-Alpha-White-60: var(--Opacity-Black-60);
182
+ --Colors-Alpha-White-70: var(--Opacity-Black-70);
183
+ --Colors-Alpha-White-80: var(--Opacity-Black-80);
184
+ --Colors-Alpha-White-90: var(--Opacity-Black-90);
185
+ --Colors-Alpha-White-95: var(--Opacity-Black-95);
186
+ --Colors-Alpha-White-100: var(--Opacity-Black-100);
187
+ --Colors-Alpha-Black-1: var(--Opacity-White-1);
188
+ --Colors-Alpha-Black-3: var(--Opacity-White-3);
189
+ --Colors-Alpha-Black-5: var(--Opacity-White-5);
190
+ --Colors-Alpha-Black-8: var(--Opacity-White-8);
191
+ --Colors-Alpha-Black-12: var(--Opacity-White-12);
192
+ --Colors-Alpha-Black-16: var(--Opacity-White-16);
193
+ --Colors-Alpha-Black-20: var(--Opacity-White-20);
194
+ --Colors-Alpha-Black-30: var(--Opacity-White-30);
195
+ --Colors-Alpha-Black-40: var(--Opacity-White-40);
196
+ --Colors-Alpha-Black-50: var(--Opacity-White-50);
197
+ --Colors-Alpha-Black-60: var(--Opacity-White-60);
198
+ --Colors-Alpha-Black-70: var(--Opacity-White-70);
199
+ --Colors-Alpha-Black-80: var(--Opacity-White-80);
200
+ --Colors-Alpha-Black-90: var(--Opacity-White-90);
201
+ --Colors-Alpha-Black-95: var(--Opacity-White-95);
202
+ --Colors-Alpha-Black-100: var(--Opacity-White-100);
203
+
204
+ // Colors beta (与亮色模式一套token值)
205
+
206
+ // Colors Utility Gray
207
+ --Colors-Utility-Gray-5: var(--Neutral-Variant-10);
208
+ --Colors-Utility-Gray-10: var(--Neutral-Variant-20);
209
+ --Colors-Utility-Gray-20: var(--Neutral-Variant-30);
210
+ --Colors-Utility-Gray-30: var(--Neutral-Variant-40);
211
+ --Colors-Utility-Gray-40: var(--Neutral-Variant-50);
212
+ --Colors-Utility-Gray-50: var(--Neutral-Variant-60);
213
+ --Colors-Utility-Gray-60: var(--Neutral-Variant-70);
214
+ --Colors-Utility-Gray-70: var(--Neutral-Variant-80);
215
+ --Colors-Utility-Gray-80: var(--Neutral-Variant-90);
216
+
217
+ // Colors Utility Olive
218
+ --Colors-Utility-Olive-5: var(--Olive-10);
219
+ --Colors-Utility-Olive-10: var(--Olive-20);
220
+ --Colors-Utility-Olive-20: var(--Olive-30);
221
+ --Colors-Utility-Olive-30: var(--Olive-40);
222
+ --Colors-Utility-Olive-40: var(--Olive-50);
223
+ --Colors-Utility-Olive-50: var(--Olive-60);
224
+ --Colors-Utility-Olive-60: var(--Olive-70);
225
+ --Colors-Utility-Olive-70: var(--Olive-80);
226
+ --Colors-Utility-Olive-80: var(--Olive-90);
227
+
228
+ // Colors Utility Teal
229
+ --Colors-Utility-Teal-5: var(--Teal-10);
230
+ --Colors-Utility-Teal-10: var(--Teal-20);
231
+ --Colors-Utility-Teal-20: var(--Teal-30);
232
+ --Colors-Utility-Teal-30: var(--Teal-40);
233
+ --Colors-Utility-Teal-40: var(--Teal-50);
234
+ --Colors-Utility-Teal-50: var(--Teal-60);
235
+ --Colors-Utility-Teal-60: var(--Teal-70);
236
+ --Colors-Utility-Teal-70: var(--Teal-80);
237
+ --Colors-Utility-Teal-80: var(--Teal-90);
238
+
239
+ // Colors Utility Lake Blue
240
+ --Colors-Utility-Lake-Blue-5: var(--Lake-Blue-10);
241
+ --Colors-Utility-Lake-Blue-10: var(--Lake-Blue-20);
242
+ --Colors-Utility-Lake-Blue-20: var(--Lake-Blue-30);
243
+ --Colors-Utility-Lake-Blue-30: var(--Lake-Blue-40);
244
+ --Colors-Utility-Lake-Blue-40: var(--Lake-Blue-50);
245
+ --Colors-Utility-Lake-Blue-50: var(--Lake-Blue-60);
246
+ --Colors-Utility-Lake-Blue-60: var(--Lake-Blue-70);
247
+ --Colors-Utility-Lake-Blue-70: var(--Lake-Blue-80);
248
+ --Colors-Utility-Lake-Blue-80: var(--Lake-Blue-90);
249
+
250
+ // Colors Utility Cobalt
251
+ --Colors-Utility-Cobalt-5: var(--Cobalt-10);
252
+ --Colors-Utility-Cobalt-10: var(--Cobalt-20);
253
+ --Colors-Utility-Cobalt-20: var(--Cobalt-30);
254
+ --Colors-Utility-Cobalt-30: var(--Cobalt-40);
255
+ --Colors-Utility-Cobalt-40: var(--Cobalt-50);
256
+ --Colors-Utility-Cobalt-50: var(--Cobalt-60);
257
+ --Colors-Utility-Cobalt-60: var(--Cobalt-70);
258
+ --Colors-Utility-Cobalt-70: var(--Cobalt-80);
259
+ --Colors-Utility-Cobalt-80: var(--Cobalt-90);
260
+
261
+ // Colors Utility Berry Pink
262
+ --Colors-Utility-Berry-Pink-5: var(--Berry-Pink-10);
263
+ --Colors-Utility-Berry-Pink-10: var(--Berry-Pink-20);
264
+ --Colors-Utility-Berry-Pink-20: var(--Berry-Pink-30);
265
+ --Colors-Utility-Berry-Pink-30: var(--Berry-Pink-40);
266
+ --Colors-Utility-Berry-Pink-40: var(--Berry-Pink-50);
267
+ --Colors-Utility-Berry-Pink-50: var(--Berry-Pink-60);
268
+ --Colors-Utility-Berry-Pink-60: var(--Berry-Pink-70);
269
+ --Colors-Utility-Berry-Pink-70: var(--Berry-Pink-80);
270
+ --Colors-Utility-Berry-Pink-80: var(--Berry-Pink-90);
271
+
272
+ // Colors Utility Terracotta
273
+ --Colors-Utility-Terracotta-5: var(--Terracotta-10);
274
+ --Colors-Utility-Terracotta-10: var(--Terracotta-20);
275
+ --Colors-Utility-Terracotta-20: var(--Terracotta-30);
276
+ --Colors-Utility-Terracotta-30: var(--Terracotta-40);
277
+ --Colors-Utility-Terracotta-40: var(--Terracotta-50);
278
+ --Colors-Utility-Terracotta-50: var(--Terracotta-60);
279
+ --Colors-Utility-Terracotta-60: var(--Terracotta-70);
280
+ --Colors-Utility-Terracotta-70: var(--Terracotta-80);
281
+ --Colors-Utility-Terracotta-80: var(--Terracotta-90);
282
+
283
+ // Colors Utility Ember
284
+ --Colors-Utility-Ember-5: var(--Ember-10);
285
+ --Colors-Utility-Ember-10: var(--Ember-20);
286
+ --Colors-Utility-Ember-20: var(--Ember-30);
287
+ --Colors-Utility-Ember-30: var(--Ember-40);
288
+ --Colors-Utility-Ember-40: var(--Ember-50);
289
+ --Colors-Utility-Ember-50: var(--Ember-60);
290
+ --Colors-Utility-Ember-60: var(--Ember-70);
291
+ --Colors-Utility-Ember-70: var(--Ember-80);
292
+ --Colors-Utility-Ember-80: var(--Ember-90);
293
+
294
+ // Colors Utility Khaki
295
+ --Colors-Utility-Khaki-5: var(--Khaki-10);
296
+ --Colors-Utility-Khaki-10: var(--Khaki-20);
297
+ --Colors-Utility-Khaki-20: var(--Khaki-30);
298
+ --Colors-Utility-Khaki-30: var(--Khaki-40);
299
+ --Colors-Utility-Khaki-40: var(--Khaki-50);
300
+ --Colors-Utility-Khaki-50: var(--Khaki-60);
301
+ --Colors-Utility-Khaki-60: var(--Khaki-70);
302
+ --Colors-Utility-Khaki-70: var(--Khaki-80);
303
+ --Colors-Utility-Khaki-80: var(--Khaki-90);
304
+
305
+ // Colors Utility Purple
306
+ --Colors-Utility-Purple-5: var(--Pure-Mauve-10);
307
+ --Colors-Utility-Purple-10: var(--Pure-Mauve-20);
308
+ --Colors-Utility-Purple-20: var(--Pure-Mauve-30);
309
+ --Colors-Utility-Purple-30: var(--Pure-Mauve-40);
310
+ --Colors-Utility-Purple-40: var(--Pure-Mauve-50);
311
+ --Colors-Utility-Purple-50: var(--Pure-Mauve-60);
312
+ --Colors-Utility-Purple-60: var(--Pure-Mauve-70);
313
+ --Colors-Utility-Purple-70: var(--Pure-Mauve-80);
314
+ --Colors-Utility-Purple-80: var(--Pure-Mauve-90);
315
+
316
+ // Colors Utility Plum Purple
317
+ --Colors-Utility-Plum-Purple-5: var(--Plum-Purple-10);
318
+ --Colors-Utility-Plum-Purple-10: var(--Plum-Purple-20);
319
+ --Colors-Utility-Plum-Purple-20: var(--Plum-Purple-30);
320
+ --Colors-Utility-Plum-Purple-30: var(--Plum-Purple-40);
321
+ --Colors-Utility-Plum-Purple-40: var(--Plum-Purple-50);
322
+ --Colors-Utility-Plum-Purple-50: var(--Plum-Purple-60);
323
+ --Colors-Utility-Plum-Purple-60: var(--Plum-Purple-70);
324
+ --Colors-Utility-Plum-Purple-70: var(--Plum-Purple-80);
325
+ --Colors-Utility-Plum-Purple-80: var(--Plum-Purple-90);
326
+
327
+ --Colors-FaceTime-White: var(--Opacity-Black-20);
328
+ --Colors-FaceTime-Black: var(--Opacity-White-20);
329
+
330
+
331
+ }
332
+ }