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/components-dark.scss ADDED
@@ -0,0 +1,210 @@
1
+ @import './new-tokens.scss';
2
+
3
+ @layer base {
4
+ .dark {
5
+
6
+ // Colors Component_colors_icon
7
+ --Component-Colors-Icon-Featured-icon-fg-info: var(--Lake-Blue-70);
8
+ --Component-Colors-Icon-Featured-icon-fg-success: var(--Teal-70);
9
+ --Component-Colors-Icon-Featured-icon-fg-warning: var(--Khaki-70);
10
+ --Component-Colors-Icon-Featured-icon-fg-error: var(--Terracotta-70);
11
+
12
+ // Colors Component_colors_button_brand
13
+ --Component-Colors-Button-Brand-fg-default: var(--Pure-Mauve-99);
14
+ --Component-Colors-Button-Brand-fg-alt: var(--Neutral-Variant-40);
15
+ --Component-Colors-Button-Brand-bg-default: var(--Pure-Mauve-50);
16
+ --Component-Colors-Button-Brand-bg-hover: var(--Pure-Mauve-40);
17
+ --Component-Colors-Button-Brand-bg-active: var(--Pure-Mauve-20);
18
+ --Component-Colors-Button-Brand-bg-disabled: var(--Neutral-Variant-20);
19
+
20
+ // Colors Component_colors_button_primary
21
+ --Component-Colors-Button-Primary-fg-default: var(--Neutral-Variant-5);
22
+ --Component-Colors-Button-Primary-fg-alt: var(--Neutral-Variant-40);
23
+ --Component-Colors-Button-Primary-bg-default: var(--Neutral-Variant-100);
24
+ --Component-Colors-Button-Primary-bg-hover: var(--Neutral-Variant-90);
25
+ --Component-Colors-Button-Primary-bg-active: var(--Neutral-Variant-80);
26
+ --Component-Colors-Button-Primary-bg-disabled: var(--Neutral-Variant-30);
27
+ --Component-Colors-Button-Primary-bg-default-2: var(--Neutral-Variant-100);
28
+
29
+
30
+ // Colors Component_colors_button_secondary
31
+ --Component-Colors-Button-Secondary-fg-default: var(--Neutral-Variant-100);
32
+ --Component-Colors-Button-Secondary-fg-alt: var(--Neutral-Variant-40);
33
+ --Component-Colors-Button-Secondary-bg-default: var(--Basic-None);
34
+ --Component-Colors-Button-Secondary-bg-hover: var(--Neutral-Variant-30);
35
+ --Component-Colors-Button-Secondary-bg-active: var(--Neutral-Variant-40);
36
+ --Component-Colors-Button-Secondary-border-default: var(--Neutral-Variant-100);
37
+ --Component-Colors-Button-Secondary-border-disabled: var(--Neutral-Variant-30);
38
+
39
+ // Colors Component_colors_button_tertiary
40
+ --Component-Colors-Button-Tertiary-fg-default: var(--Neutral-Variant-100);
41
+ --Component-Colors-Button-Tertiary-fg-alt: var(--Opacity-White-30);
42
+ --Component-Colors-Button-Tertiary-bg-default: var(--Neutral-Variant-30);
43
+ --Component-Colors-Button-Tertiary-bg-hover: var(--Neutral-Variant-40);
44
+ --Component-Colors-Button-Tertiary-bg-active: var(--Neutral-Variant-50);
45
+
46
+ // Colors Component_colors_button_plain
47
+ --Component-Colors-Button-Plain-fg-default: var(--Neutral-Variant-100);
48
+ --Component-Colors-Button-Plain-fg-alt: var(--Neutral-Variant-40);
49
+ --Component-Colors-Button-Plain-bg-default: var(--Basic-None);
50
+ --Component-Colors-Button-Plain-bg-hover: var(--Neutral-Variant-30);
51
+ --Component-Colors-Button-Plain-bg-active: var(--Neutral-Variant-40);
52
+
53
+ // Colors Component_colors_button_plain_brand
54
+ --Component-Colors-Button-Plain-Brand-fg-default: var(--Pure-Mauve-70);
55
+ --Component-Colors-Button-Plain-Brand-fg-alt: var(--Neutral-Variant-40);
56
+ --Component-Colors-Button-Plain-Brand-bg-default: var(--Basic-None);
57
+ --Component-Colors-Button-Plain-Brand-bg-hover: var(--Neutral-Variant-30);
58
+ --Component-Colors-Button-Plain-Brand-bg-active: var(--Neutral-Variant-40);
59
+
60
+ // Colors Component_colors_button_error_primary
61
+ --Component-Colors-Button-Error-Primary-fg-default: var(--Terracotta-95);
62
+ --Component-Colors-Button-Error-Primary-fg-alt: var(--Neutral-Variant-40);
63
+ --Component-Colors-Button-Error-Primary-bg-default: var(--Terracotta-40);
64
+ --Component-Colors-Button-Error-Primary-bg-hover: var(--Terracotta-30);
65
+ --Component-Colors-Button-Error-Primary-bg-active: var(--Terracotta-20);
66
+ --Component-Colors-Button-Error-Primary-bg-disabled: var(--Neutral-Variant-30);
67
+ --Component-Colors-Button-Error-Primary-bg-loading: var(--Terracotta-40);
68
+
69
+ // Colors Component_colors_button_error_secondary
70
+ --Component-Colors-Button-Error-Secondary-fg-default: var(--Terracotta-95);
71
+ --Component-Colors-Button-Error-Secondary-fg-alt: var(--Neutral-Variant-40);
72
+ --Component-Colors-Button-Error-Secondary-bg-default: var(--Terracotta-5);
73
+ --Component-Colors-Button-Error-Secondary-bg-hover: var(--Terracotta-20);
74
+ --Component-Colors-Button-Error-Secondary-bg-active: var(--Terracotta-30);
75
+ --Component-Colors-Button-Error-Secondary-bg-disabled: var(--Basic-None);
76
+ --Component-Colors-Button-Error-Secondary-border-default: var(--Terracotta-40);
77
+ --Component-Colors-Button-Error-Secondary-border-disabled: var(--Neutral-Variant-30);
78
+
79
+ // Colors Component_colors_button_static
80
+ --Component-Colors-Button-Static-fg-default: var(--Neutral-Variant-5);
81
+ --Component-Colors-Button-Static-fg-alt: var(--Neutral-Variant-40);
82
+ --Component-Colors-Button-Static-bg-default: var(--Neutral-Variant-100);
83
+ --Component-Colors-Button-Static-bg-hover: var(--Neutral-Variant-98);
84
+ --Component-Colors-Button-Static-bg-active: var(--Neutral-Variant-95);
85
+ --Component-Colors-Button-Static-border-default: var(--Opacity-On-Surface-20);
86
+ --Component-Colors-Button-Static-border-alt: var(--Opacity-On-Surface-20);
87
+
88
+ // Colors Component_colors_button_ghost
89
+ --Component-Colors-Button-Ghost-fg-default: var(--Neutral-Variant-100);
90
+ --Component-Colors-Button-Ghost-fg-alt: var(--Neutral-Variant-40);
91
+ --Component-Colors-Button-Ghost-bg-default: var(--Neutral-Variant-20);
92
+ --Component-Colors-Button-Ghost-bg-hover: var(--Neutral-Variant-30);
93
+ --Component-Colors-Button-Ghost-bg-active: var(--Neutral-Variant-30);
94
+ --Component-Colors-Button-Ghost-border-default: var(--Neutral-Variant-30);
95
+ --Component-Colors-Button-Ghost-border-alt: var(--Neutral-Variant-30);
96
+
97
+ // Colors Component_colors_icon_button
98
+ --Component-Colors-Icon-Button-Brand-fg-default: var(--Pure-Mauve-99);
99
+ --Component-Colors-Icon-Button-Brand-fg-alt: var(--Neutral-Variant-40);
100
+ --Component-Colors-Icon-Button-Brand-bg-default: var(--Pure-Mauve-50);
101
+ --Component-Colors-Icon-Button-Brand-bg-hover: var(--Pure-Mauve-30);
102
+ --Component-Colors-Icon-Button-Brand-bg-active: var(--Pure-Mauve-20);
103
+ --Component-Colors-Icon-Button-Brand-bg-disabled: var(--Neutral-Variant-30);
104
+
105
+ --Component-Colors-Icon-Button-Plain-fg-default: var(--Neutral-Variant-100);
106
+ --Component-Colors-Icon-Button-Plain-Gray-fg-default: var(--Neutral-Variant-80);
107
+
108
+ // Colors Component_colors_link_button_primary
109
+ --Component-Colors-Link-Button-Primary-fg-default: var(--Pure-Mauve-70);
110
+ --Component-Colors-Link-Button-Primary-fg-hover: var(--Pure-Mauve-80);
111
+ --Component-Colors-Link-Button-Primary-fg-active: var(--Pure-Mauve-80);
112
+ --Component-Colors-Link-Button-Primary-fg-disabled: var(--Neutral-Variant-40);
113
+ --Component-Colors-Link-Button-Primary-bg-default: var(--Basic-None);
114
+
115
+ // Colors Component_colors_link_button_secondary
116
+ --Component-Colors-Link-Button-Secondary-fg-default: var(--Neutral-Variant-100);
117
+ --Component-Colors-Link-Button-Secondary-fg-hover: var(--Neutral-Variant-80);
118
+ --Component-Colors-Link-Button-Secondary-fg-active: var(--Neutral-Variant-60);
119
+ --Component-Colors-Link-Button-Secondary-fg-disabled: var(--Neutral-Variant-40);
120
+ --Component-Colors-Link-Button-Secondary-bg-default: var(--Basic-None);
121
+
122
+ // Colors Component_colors_tooltip
123
+ --Component-Colors-Tooltip-fg-default: var(--Neutral-Variant-100);
124
+ --Component-Colors-Tooltip-fg-subtle: var(--Neutral-Variant-80);
125
+ --Component-Colors-Tooltip-bg-default: var(--Neutral-Variant-10);
126
+ --Component-Colors-Tooltip-border-default: var(--Neutral-Variant-20);
127
+
128
+ // Colors Component_colors_tabbar
129
+ --Component-Colors-Tabbar-fg-default: var(--Neutral-Variant-70);
130
+ --Component-Colors-Tabbar-fg-alt: var(--Neutral-Variant-50);
131
+ --Component-Colors-Tabbar-fg-bolder: var(--Neutral-Variant-100);
132
+ --Component-Colors-Tabbar-fg-disabled: var(--Neutral-Variant-40);
133
+ --Component-Colors-Tabbar-fg-select-disabled: var(--Neutral-Variant-50);
134
+ --Component-Colors-Tabbar-bg-default: var(--Neutral-Variant-30);
135
+ --Component-Colors-Tabbar-bg-select: var(--Neutral-Variant-40);
136
+ --Component-Colors-Tabbar-border-default: var(--Neutral-Variant-100);
137
+ --Component-Colors-Tabbar-border-disabled: var(--Neutral-Variant-20);
138
+
139
+ // Colors Component_colors_energy
140
+ --Component-Colors-Energy-fg-default: var(--Khaki-90);
141
+ --Component-Colors-Energy-bg-default: var(--Khaki-10);
142
+ --Component-Colors-Energy-bg-alt: var(--Khaki-20);
143
+ --Component-Colors-Energy-bg-on: var(--Khaki-60);
144
+ --Component-Colors-Energy-border-default: var(--Khaki-60);
145
+
146
+ // Colors Component_colors_input
147
+ --Component-Colors-Input-bg-default: var(--Neutral-Variant-25);
148
+ --Component-Colors-Input-bg-active: var(--Neutral-Variant-10);
149
+ --Component-Colors-Input-border-default: var(--Neutral-Variant-50);
150
+
151
+ // Colors Component_colors_search_bar
152
+ --Component-Colors-Search-Bar-bg-default: var(--Neutral-Variant-25);
153
+ --Component-Colors-Search-Bar-bg-active: var(--Neutral-Variant-10);
154
+ --Component-Colors-Search-Bar-border-default: var(--Neutral-Variant-50);
155
+
156
+ // Colors Component_colors_shadow
157
+ --Component-Colors-Shadows-Surface-Default: var(--Opacity-White-5);
158
+ --Component-Colors-Shadows-Surface-Bolder: var(--Opacity-White-3);
159
+ --Component-Colors-Shadows-Modal-Default: var(--Opacity-Black-40);
160
+ --Component-Colors-Shadows-Modal-Bolder: var(--Opacity-Black-40);
161
+ --Component-Colors-Shadows-Button-Primary-1:var(--Alpha-White-8);
162
+
163
+ // Colors Component_colors_focus_rings
164
+ --Component-Colors-Focus-Rings-Brand: var(--Opacity-White-40);
165
+ --Component-Colors-Focus-Rings-Error: var(--Terracotta-60);
166
+
167
+ // Colors Component_colors_chat_tips
168
+ --Component-Colors-Chat-Tips-fg-info: var(--Pure-Mauve-70);
169
+ --Component-Colors-Chat-Tips-bg-info: var(--Pure-Mauve-10);
170
+ --Component-Colors-Chat-Tips-border-info: var(--Pure-Mauve-30);
171
+ --Component-Colors-Chat-Tips-fg-alert: var(--Khaki-70);
172
+ --Component-Colors-Chat-Tips-bg-alert: var(--Khaki-10);
173
+ --Component-Colors-Chat-Tips-button-alert: var(--Khaki-40);
174
+ --Component-Colors-Chat-Tips-border-alert: var(--Khaki-30);
175
+ --Component-Colors-Chat-Tips-fg-error: var(--Terracotta-70);
176
+ --Component-Colors-Chat-Tips-bg-error: var(--Terracotta-10);
177
+ --Component-Colors-Chat-Tips-border-error: var(--Terracotta-30);
178
+
179
+ // Colors Component_colors_check_box
180
+ --Component-Colors-Check-Box-fg-default: var(--Neutral-Variant-5);
181
+ --Component-Colors-Check-Box-fg-alt: var(--Neutral-Variant-50);
182
+ --Component-Colors-Check-Box-border-default: var(--Neutral-Variant-30);
183
+ --Component-Colors-Check-Box-border-hover: var(--Neutral-Variant-40);
184
+ --Component-Colors-Check-Box-border-disabled: var(--Neutral-Variant-30);
185
+ --Component-Colors-Check-Box-bg-default: var(--Neutral-Variant-100);
186
+ --Component-Colors-Check-Box-bg-hover: var(--Neutral-Variant-90);
187
+ --Component-Colors-Check-Box-bg-disabled: var(--Neutral-Variant-20);
188
+
189
+ // Colors Component_colors_switch
190
+ --Component-Colors-Switch-fg-default: var(--Neutral-Variant-100);
191
+ --Component-Colors-Switch-fg-on: var(--Neutral-Variant-100);
192
+ --Component-Colors-Switch-fg-disabled: var(--Opacity-White-30);
193
+ --Component-Colors-Switch-bg-default: var(--Neutral-Variant-40);
194
+ --Component-Colors-Switch-bg-on: var(--Pure-Mauve-60);
195
+ --Component-Colors-Switch-bg-disabled: var(--Neutral-Variant-30);
196
+
197
+ // Colors Component_colors_tag
198
+ --Component-Colors-Tag-bg-default: var(--Neutral-Variant-30);
199
+
200
+ // Colors Component_colors_chips
201
+ --Component-Colors-Chips-Primary-bg-default: var(--Neutral-Variant-20);
202
+ --Component-Colors-Chips-Primary-bg-hover: var(--Neutral-Variant-30);
203
+ --Component-Colors-Chips-Primary-bg-disabled: var(--Neutral-Variant-20);
204
+ --Component-Colors-Chips-Primary-border-default: var(--Neutral-Variant-30);
205
+ --Component-Colors-Chips-Primary-bg-select-disabled: var(--Neutral-Variant-30);
206
+ --Component-Colors-Chips-Primary-bg-select: var(--Neutral-Variant-100);
207
+
208
+ }
209
+ }
210
+
package/dist/styles/components-light.scss ADDED
@@ -0,0 +1,208 @@
1
+ @import './new-tokens.scss';
2
+
3
+ @layer base {
4
+ :root {
5
+
6
+ // Colors Component_colors_icon
7
+ --Component-Colors-Icon-Featured-icon-fg-info: var(--Lake-Blue-50);
8
+ --Component-Colors-Icon-Featured-icon-fg-success: var(--Teal-50);
9
+ --Component-Colors-Icon-Featured-icon-fg-warning: var(--Khaki-50);
10
+ --Component-Colors-Icon-Featured-icon-fg-error: var(--Terracotta-50);
11
+
12
+ // Colors Component_colors_button_brand
13
+ --Component-Colors-Button-Brand-fg-default: var(--Pure-Mauve-5);
14
+ --Component-Colors-Button-Brand-fg-alt: var(--Neutral-70);
15
+ --Component-Colors-Button-Brand-bg-default: var(--Pure-Mauve-95);
16
+ --Component-Colors-Button-Brand-bg-hover: var(--Pure-Mauve-90);
17
+ --Component-Colors-Button-Brand-bg-active: var(--Pure-Mauve-80);
18
+ --Component-Colors-Button-Brand-bg-disabled: var(--Neutral-95);
19
+
20
+ // Colors Component_colors_button_primary
21
+ --Component-Colors-Button-Primary-fg-default: var(--Neutral-100);
22
+ --Component-Colors-Button-Primary-fg-alt: var(--Neutral-Variant-98);
23
+ --Component-Colors-Button-Primary-bg-default: var(--Neutral-5);
24
+ --Component-Colors-Button-Primary-bg-hover: var(--Neutral-20);
25
+ --Component-Colors-Button-Primary-bg-active: var(--Neutral-40);
26
+ --Component-Colors-Button-Primary-bg-disabled: var(--Neutral-Variant-80);
27
+ --Component-Colors-Button-Primary-bg-default-2: var(--Neutral-5);
28
+
29
+ // Colors Component_colors_button_secondary
30
+ --Component-Colors-Button-Secondary-fg-default: var(--Neutral-5);
31
+ --Component-Colors-Button-Secondary-fg-alt: var(--Neutral-70);
32
+ --Component-Colors-Button-Secondary-bg-default: var(--Basic-None);
33
+ --Component-Colors-Button-Secondary-bg-hover: var(--Neutral-98);
34
+ --Component-Colors-Button-Secondary-bg-active: var(--Neutral-95);
35
+ --Component-Colors-Button-Secondary-border-default: var(--Neutral-5);
36
+ --Component-Colors-Button-Secondary-border-disabled: var(--Opacity-On-Surface-20);
37
+
38
+ // Colors Component_colors_button_tertiary
39
+ --Component-Colors-Button-Tertiary-fg-default: var(--Neutral-5);
40
+ --Component-Colors-Button-Tertiary-fg-alt: var(--Neutral-70);
41
+ --Component-Colors-Button-Tertiary-bg-default: var(--Opacity-On-Surface-10);
42
+ --Component-Colors-Button-Tertiary-bg-hover: var(--Opacity-On-Surface-20);
43
+ --Component-Colors-Button-Tertiary-bg-active: var(--Opacity-On-Surface-30);
44
+
45
+ // Colors Component_colors_button_plain
46
+ --Component-Colors-Button-Plain-fg-default: var(--Neutral-5);
47
+ --Component-Colors-Button-Plain-fg-alt: var(--Neutral-70);
48
+ --Component-Colors-Button-Plain-bg-default: var(--Basic-None);
49
+ --Component-Colors-Button-Plain-bg-hover: var(--Neutral-98);
50
+ --Component-Colors-Button-Plain-bg-active: var(--Neutral-95);
51
+
52
+ // Colors Component_colors_button_plain_brand
53
+ --Component-Colors-Button-Plain-Brand-fg-default: var(--Pure-Mauve-50);
54
+ --Component-Colors-Button-Plain-Brand-fg-alt: var(--Neutral-70);
55
+ --Component-Colors-Button-Plain-Brand-bg-default: var(--Basic-None);
56
+ --Component-Colors-Button-Plain-Brand-bg-hover: var(--Neutral-98);
57
+ --Component-Colors-Button-Plain-Brand-bg-active: var(--Neutral-95);
58
+
59
+ // Colors Component_colors_button_error
60
+ --Component-Colors-Button-Error-Primary-fg-default: var(--Terracotta-100);
61
+ --Component-Colors-Button-Error-Primary-fg-alt: var(--Neutral-70);
62
+ --Component-Colors-Button-Error-Primary-bg-default: var(--Terracotta-50);
63
+ --Component-Colors-Button-Error-Primary-bg-hover: var(--Terracotta-40);
64
+ --Component-Colors-Button-Error-Primary-bg-active: var(--Terracotta-30);
65
+ --Component-Colors-Button-Error-Primary-bg-disabled: var(--Neutral-95);
66
+ --Component-Colors-Button-Error-Primary-bg-loading: var(--Terracotta-90);
67
+
68
+ // Colors Component_colors_button_error_secondary
69
+ --Component-Colors-Button-Error-Secondary-fg-default: var(--Terracotta-50);
70
+ --Component-Colors-Button-Error-Secondary-fg-alt: var(--Neutral-70);
71
+ --Component-Colors-Button-Error-Secondary-bg-default: var(--Terracotta-98);
72
+ --Component-Colors-Button-Error-Secondary-bg-hover: var(--Terracotta-90);
73
+ --Component-Colors-Button-Error-Secondary-bg-active: var(--Terracotta-80);
74
+ --Component-Colors-Button-Error-Secondary-bg-disabled: var(--Terracotta-100);
75
+ --Component-Colors-Button-Error-Secondary-border-default: var(--Terracotta-50);
76
+ --Component-Colors-Button-Error-Secondary-border-disabled: var(--Opacity-On-Surface-20);
77
+
78
+ // Colors Component_colors_button_static
79
+ --Component-Colors-Button-Static-fg-default: var(--Neutral-5);
80
+ --Component-Colors-Button-Static-fg-alt: var(--Neutral-70);
81
+ --Component-Colors-Button-Static-bg-default: var(--Neutral-100);
82
+ --Component-Colors-Button-Static-bg-hover: var(--Neutral-98);
83
+ --Component-Colors-Button-Static-bg-active: var(--Neutral-95);
84
+ --Component-Colors-Button-Static-border-default: var(--Opacity-On-Surface-20);
85
+ --Component-Colors-Button-Static-border-alt: var(--Opacity-On-Surface-20);
86
+
87
+ // Colors Component_colors_button_ghost
88
+ --Component-Colors-Button-Ghost-fg-default: var(--Neutral-5);
89
+ --Component-Colors-Button-Ghost-fg-alt: var(--Neutral-70);
90
+ --Component-Colors-Button-Ghost-bg-default: var(--Neutral-100);
91
+ --Component-Colors-Button-Ghost-bg-hover: var(--Neutral-98);
92
+ --Component-Colors-Button-Ghost-bg-active: var(--Neutral-95);
93
+ --Component-Colors-Button-Ghost-border-default: var(--Opacity-On-Surface-20);
94
+ --Component-Colors-Button-Ghost-border-alt: var(--Opacity-On-Surface-20);
95
+
96
+ // Colors Component_colors_icon_button
97
+ --Component-Colors-Icon-Button-Brand-fg-default: var(--Pure-Mauve-5);
98
+ --Component-Colors-Icon-Button-Brand-fg-alt: var(--Neutral-70);
99
+ --Component-Colors-Icon-Button-Brand-bg-default: var(--Pure-Mauve-95);
100
+ --Component-Colors-Icon-Button-Brand-bg-hover: var(--Pure-Mauve-80);
101
+ --Component-Colors-Icon-Button-Brand-bg-active: var(--Pure-Mauve-70);
102
+ --Component-Colors-Icon-Button-Brand-bg-disabled: var(--Neutral-95);
103
+
104
+ --Component-Colors-Icon-Button-Plain-fg-default: var(--Neutral-5);
105
+ --Component-Colors-Icon-Button-Plain-Gray-fg-default: var(--Neutral-40);
106
+
107
+ // Colors Component_colors_link_button_primary
108
+ --Component-Colors-Link-Button-Primary-fg-default: var(--Pure-Mauve-50);
109
+ --Component-Colors-Link-Button-Primary-fg-hover: var(--Pure-Mauve-40);
110
+ --Component-Colors-Link-Button-Primary-fg-active: var(--Pure-Mauve-30);
111
+ --Component-Colors-Link-Button-Primary-fg-disabled: var(--Neutral-Variant-80);
112
+ --Component-Colors-Link-Button-Primary-bg-default: var(--Basic-None);
113
+
114
+ // Colors Component_colors_link_button_secondary
115
+ --Component-Colors-Link-Button-Secondary-fg-default: var(--Neutral-Variant-30);
116
+ --Component-Colors-Link-Button-Secondary-fg-hover: var(--Neutral-Variant-50);
117
+ --Component-Colors-Link-Button-Secondary-fg-active: var(--Neutral-Variant-70);
118
+ --Component-Colors-Link-Button-Secondary-fg-disabled: var(--Neutral-Variant-80);
119
+ --Component-Colors-Link-Button-Secondary-bg-default: var(--Basic-None);
120
+
121
+ // Colors Component_colors_tooltip
122
+ --Component-Colors-Tooltip-fg-default: var(--Neutral-Variant-100);
123
+ --Component-Colors-Tooltip-fg-subtle: var(--Neutral-Variant-80);
124
+ --Component-Colors-Tooltip-bg-default: var(--Neutral-Variant-10);
125
+ --Component-Colors-Tooltip-border-default: var(--Basic-None);
126
+
127
+ // Colors Component_colors_tabbar
128
+ --Component-Colors-Tabbar-fg-default: var(--Neutral-60);
129
+ --Component-Colors-Tabbar-fg-alt: var(--Neutral-70);
130
+ --Component-Colors-Tabbar-fg-bolder: var(--Neutral-5);
131
+ --Component-Colors-Tabbar-fg-disabled: var(--Neutral-90);
132
+ --Component-Colors-Tabbar-fg-select-disabled: var(--Neutral-90);
133
+ --Component-Colors-Tabbar-bg-default: var(--Opacity-On-Surface-10);
134
+ --Component-Colors-Tabbar-bg-select: var(--Neutral-100);
135
+ --Component-Colors-Tabbar-border-default: var(--Neutral-5);
136
+ --Component-Colors-Tabbar-border-disabled: var(--Neutral-95);
137
+
138
+ // Colors Component_colors_energy
139
+ --Component-Colors-Energy-fg-default: var(--Khaki-40);
140
+ --Component-Colors-Energy-bg-default: var(--Khaki-99);
141
+ --Component-Colors-Energy-bg-alt: var(--Khaki-95);
142
+ --Component-Colors-Energy-bg-on: var(--Khaki-80);
143
+ --Component-Colors-Energy-border-default: var(--Khaki-80);
144
+
145
+ // Colors Component_colors_input
146
+ --Component-Colors-Input-bg-default: var(--Neutral-98);
147
+ --Component-Colors-Input-bg-active: var(--Neutral-100);
148
+ --Component-Colors-Input-border-default: var(--Neutral-80);
149
+
150
+ // Colors Component_colors_search_bar
151
+ --Component-Colors-Search-Bar-bg-default: var(--Opacity-On-Surface-10);
152
+ --Component-Colors-Search-Bar-bg-active: var(--Neutral-100);
153
+ --Component-Colors-Search-Bar-border-default: var(--Neutral-80);
154
+
155
+ // Colors Component_colors_shadow
156
+ --Component-Colors-Shadows-Surface-Default: var(--Opacity-Black-12);
157
+ --Component-Colors-Shadows-Surface-Bolder: var(--Opacity-Black-3);
158
+ --Component-Colors-Shadows-Modal-Default: var(--Opacity-Black-12);
159
+ --Component-Colors-Shadows-Modal-Bolder: var(--Opacity-Black-12);
160
+ --Component-Colors-Shadows-Button-Primary-1:var(--Alpha-White-8);
161
+
162
+ // Colors Component_colors_focus_rings
163
+ --Component-Colors-Focus-Rings-Brand: var(--Neutral-90);
164
+ --Component-Colors-Focus-Rings-Error: var(--Terracotta-50);
165
+
166
+ // Colors Component_colors_chat_tips
167
+ --Component-Colors-Chat-Tips-fg-info: var(--Pure-Mauve-50);
168
+ --Component-Colors-Chat-Tips-bg-info: var(--Pure-Mauve-99);
169
+ --Component-Colors-Chat-Tips-border-info: var(--Pure-Mauve-90);
170
+ --Component-Colors-Chat-Tips-fg-alert: var(--Khaki-70);
171
+ --Component-Colors-Chat-Tips-bg-alert: var(--Khaki-98);
172
+ --Component-Colors-Chat-Tips-button-alert: var(--Khaki-90);
173
+ --Component-Colors-Chat-Tips-border-alert: var(--Khaki-90);
174
+ --Component-Colors-Chat-Tips-fg-error: var(--Terracotta-50);
175
+ --Component-Colors-Chat-Tips-bg-error: var(--Terracotta-98);
176
+ --Component-Colors-Chat-Tips-border-error: var(--Terracotta-90);
177
+
178
+ // Colors Component_colors_check_box
179
+ --Component-Colors-Check-Box-fg-default: var(--Neutral-100);
180
+ --Component-Colors-Check-Box-fg-alt: var(--Neutral-80);
181
+ --Component-Colors-Check-Box-border-default: var(--Neutral-90);
182
+ --Component-Colors-Check-Box-border-hover: var(--Neutral-80);
183
+ --Component-Colors-Check-Box-border-disabled: var(--Neutral-95);
184
+ --Component-Colors-Check-Box-bg-default: var(--Neutral-5);
185
+ --Component-Colors-Check-Box-bg-hover: var(--Neutral-30);
186
+ --Component-Colors-Check-Box-bg-disabled: var(--Neutral-99);
187
+
188
+ // Colors Component_colors_switch
189
+ --Component-Colors-Switch-fg-default: var(--Neutral-Variant-100);
190
+ --Component-Colors-Switch-fg-on: var(--Neutral-Variant-100);
191
+ --Component-Colors-Switch-fg-disabled: var(--Opacity-White-60);
192
+ --Component-Colors-Switch-bg-default: var(--Neutral-Variant-90);
193
+ --Component-Colors-Switch-bg-on: var(--Neutral-Variant-5);
194
+ --Component-Colors-Switch-bg-disabled: var(--Neutral-Variant-95);
195
+
196
+ // Colors Component_colors_tag
197
+ --Component-Colors-Tag-bg-default: var(--Opacity-On-Surface-10);
198
+
199
+ // Colors Component_colors_chips
200
+ --Component-Colors-Chips-Primary-bg-default: var(--Neutral-100);
201
+ --Component-Colors-Chips-Primary-bg-hover: var(--Neutral-98);
202
+ --Component-Colors-Chips-Primary-bg-disabled: var(--Neutral-100);
203
+ --Component-Colors-Chips-Primary-border-default: var(--Opacity-On-Surface-20);
204
+ --Component-Colors-Chips-Primary-bg-select-disabled: var(--Neutral-90);
205
+ --Component-Colors-Chips-Primary-bg-select: var(--Neutral-5);
206
+ }
207
+ }
208
+