@yl_lowcode/docs-theme 0.0.7 → 0.0.9

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.
package/color/blue.ts ADDED
@@ -0,0 +1,12 @@
1
+ export default {
2
+ "Brand-1": "#E9F5FE",
3
+ "Brand-2": "#BDE2FF",
4
+ "Brand-10": "#001D61",
5
+ "Brand-3": "#94CDFF",
6
+ "Brand-4": "#6BB5FF",
7
+ "Brand-5": "#429AFF",
8
+ "Brand-6": "#197AFA",
9
+ "Brand-7": "#0B5BD4",
10
+ "Brand-8": "#0040AD",
11
+ "Brand-9": "#002D87",
12
+ };
package/color/dark.ts ADDED
@@ -0,0 +1,298 @@
1
+ export default {
2
+ "Brand-1": "#283546",
3
+ "Brand-2": "#2A4366",
4
+ "Brand-10": "#D9F0FF",
5
+ "Brand-3": "#2B5285",
6
+ "Brand-4": "#2D61A5F9",
7
+ "Brand-5": "#3079DA",
8
+ "Brand-6": "#3288FA",
9
+ "Brand-7": "#58A9FC",
10
+ "Brand-8": "#8BC8FD",
11
+ "Brand-9": "#B2DCFE",
12
+ "Neutral-text-5": "#FFFFFFE6",
13
+ "Neutral-text-4": "#FFFFFFBF",
14
+ "Neutral-text-3": "#FFFFFF99",
15
+ "Neutral-text-2": "#FFFFFF4D",
16
+ "Neutral-border-2": "#555555",
17
+ "Neutral-border-1": "#333333",
18
+ "Neutral-fill-4": "#515151",
19
+ "Neutral-fill-3": "#3B3B3B",
20
+ "Neutral-fill-2": "#181819",
21
+ "Neutral-fill-1": "#1b1b1f",
22
+ buttonPrimaryDisabledFontColor: "var(--soui-neutral-text-2)",
23
+ buttonSecondaryFontColor: "var(--soui-neutral-text-1)",
24
+ buttonWarningDisabledFontColor: "var(--soui-neutral-text-2)",
25
+ inputFontColor: "var(--soui-neutral-text-5)",
26
+ selectFontColor: "var(--soui-neutral-text-1)",
27
+ selectBorderWidth: "var(--soui-border-2)",
28
+ selectPlaceholderColor: "var(--soui-neutral-text-2)",
29
+ selectBackgroundColor: "var(--soui-neutral-fill-2)",
30
+ "Danger-1": "#412B2B",
31
+ "Danger-10": "#FFECE8",
32
+ "Danger-2": "#542E2E",
33
+ "Danger-3": "#6F3233",
34
+ "Danger-4": "#C33136",
35
+ "Danger-5": "#B83E40",
36
+ "Danger-6": "#DC4446",
37
+ "Danger-7": "#E36461",
38
+ "Danger-8": "#F7ADA6",
39
+ "Danger-9": "#FBCDC7",
40
+ "Success-1": "#20392E",
41
+ "Success-2": "#1D4534",
42
+ "Success-10": "#EBFFF3",
43
+ "Success-3": "#17583C",
44
+ "Success-4": "#11915E",
45
+ "Success-5": "#088A51",
46
+ "Success-6": "#00A35C",
47
+ "Success-7": "#21B570",
48
+ "Success-8": "#7BDCA9",
49
+ "Success-9": "#B0EECB",
50
+ "Warning-1": "#433128",
51
+ "Warning-10": "#FFF5E8",
52
+ "Warning-2": "#573929",
53
+ "Warning-3": "#74442B",
54
+ "Warning-4": "#CB5C16",
55
+ "Warning-5": "#C16330",
56
+ "Warning-6": "#E87233",
57
+ "Warning-7": "#ED8F55",
58
+ "Warning-8": "#FBC58A",
59
+ "Warning-9": "#FDDFB9",
60
+ "Shadow-2": "0px 4px 10px 0px rgba(2, 11, 24, 0.10)",
61
+ "Shadow-3": "0px 8px 20px 0px rgba(2, 11, 24, 0.10)",
62
+ "Shadow-4": "0px -2px 10px 0px rgba(2, 11, 24, 0.08)",
63
+ buttonSuccessDisabledFontColor: "var(--soui-neutral-text-2)",
64
+ buttonDangerDisabledFontColor: "var(--soui-neutral-text-2)",
65
+ buttonSecondaryActiveBackgroundColor: "var(--soui-neutral-fill-4)",
66
+ buttonSecondaryActiveBorderColor: "var(--soui-neutral-fill-4)",
67
+ popoverBackgroundColor: "var(--soui-neutral-fill-2)",
68
+ popoverSuccessBackgroundColor: "var(--soui-success-1)",
69
+ popoverInfoBackgroundColor: "var(--soui-brand-1)",
70
+ tableTbodyHoverBackgroundColor: "var(--soui-neutral-fill-3)",
71
+ cardBackgroundColor: "var(--soui-neutral-fill-1)",
72
+ cascaderOptionBackgroundColor: "var(--soui-neutral-fill-2)",
73
+ tooltipBackgroundColor: "var(--soui-success-5)",
74
+ tooltipLightColor: "var(--soui-neutral-fill-2)",
75
+ tooltipLightBackgroundColor: "var(--soui-neutral-fill-10)",
76
+ tooltipPrimaryBackgroundColor: "var(--soui-brand-1)",
77
+ tooltipSuccessColor: "var(--soui-success-6)",
78
+ treeLineBackgroundColor: "var(--soui-neutral-border-2)",
79
+ treeContentActiveBackgroundColor: "var(--soui-brand-1)",
80
+ datePickerCellHoverBackgroundColor: "var(--soui-neutral-fill-3)",
81
+ tagInfoBackgroundColor: "var(--soui-brand-1)",
82
+ alertInfoBackgroundColor: "var(--soui-brand-1)",
83
+ messageBackgroundColor: "var(--soui-neutral-fill-2)",
84
+ progressCircleInfoFontColor: "var(--soui-neutral-text-5)",
85
+ dropdownListBackgroundColor: "var(--soui-neutral-fill-2)",
86
+ menuItemActiveBackgroundColor: "var(--soui-brand-1)",
87
+ dividerFontColor: "var(--soui-neutral-text-2)",
88
+ cascaderPanelBackgroundColor: "var(--soui-neutral-fill-2)",
89
+ cascaderOptionDisabledBackgroundColor: "var(--soui-neutral-fill-2)",
90
+ cascaderOptionHoverBackgroundColor: "var(--soui-neutral-fill-3)",
91
+ datePickerPanelBackgroundColor: "var(--soui-neutral-fill-2)",
92
+ dropdownOptionHoverBackgroundColor: "var(--soui-neutral-fill-3)",
93
+ treeSelectPanelBackgroundColor: "var(--soui-neutral-fill-2)",
94
+ treeSelectContentHoverBackgroundColor: "var(--soui-neutral-fill-3)",
95
+ modalPanelBackground: "var(--soui-neutral-fill-2)",
96
+ dropdownOptionDisabledBackgroundColor: "var(--soui-neutral-fill-2)",
97
+ messageBorderColor: "var(--soui-transparent)",
98
+ modalPanelBorder: "var(--soui-transparent)",
99
+ popoverBorderColor: "var(--soui-transparent)",
100
+ dropdownOptionBackgroundColor: "var(--soui-neutral-fill-2)",
101
+ selectPanelBackgroundColor: "var(--soui-neutral-fill-2)",
102
+ selectOptionBackgroundColor: "var(--soui-neutral-fill-2)",
103
+ selectOptionHoverBackgroundColor: "var(--soui-neutral-fill-3)",
104
+ selectOptionDisabledBackgroundColor: "var(--soui-neutral-fill-2)",
105
+ switchDisabledCircleFill: "var(--soui-neutral-text-2)",
106
+ switchCheckedCircleFill: "var(--soui-neutral-text-1)",
107
+ switchCheckedDisabledCircleFill: "var(--soui-neutral-text-2)",
108
+ switchCheckedDisabledFontColor: "var(--soui-neutral-text-2)",
109
+ "Neutral-mask-2": "#FFFFFF66",
110
+ descriptionsLabelColor: "var(--soui-neutral-text-3)",
111
+ menuDarkItemBackgroundColor: "var(--soui-neutral-fill-1)",
112
+ menuDarkItemHoverBackgroundColor: "var(--soui-neutral-fill-2)",
113
+ menuDarkItemActiveBackgroundColor: "var(--soui-brand-4)",
114
+ menuDarkItemDisabledBackgroundColor: "var(--soui-neutral-fill-1)",
115
+ rateFrontBackgroundColor: "var(--soui-functional-le-6)",
116
+ "Neutral-fill-9": "#E4E4E4",
117
+ "Neutral-fill-10": "#FFFFFF",
118
+ "Neutral-fill-6": "#A4A4A4",
119
+ "Neutral-fill-8": "#CCCCCC",
120
+ "Mask-fill-1": "#00000080",
121
+ "Neutral-fill-11": "#2A2A2A",
122
+ alertInfoBorderColor: "var(--soui-brand-2)",
123
+ listStripedBackgroundColor: "var(--soui-neutral-fill-11)",
124
+ menuItemActiveFontColor: "var(--soui-brand-6)",
125
+ tabsFillCheckedBackgroundColor: "var(--soui-neutral-fill-3)",
126
+ "Neutral-fill-5": "#757575",
127
+ buttonPrimaryOutlineDisabledFontColor: "var(--soui-brand-3)",
128
+ buttonPrimaryOutlineDisabledBorderColor: "var(--soui-brand-3)",
129
+ buttonWarningOutlineDisabledFontColor: "var(--soui-warning-3)",
130
+ buttonSecondaryOutlineDisabledBorderColor: "var(--soui-neutral-border-2)",
131
+ cascaderOptionActiveBackgroundColor: "var(--soui-brand-2)",
132
+ tagInfoFillDisabledFontColor: "var(--soui-neutral-text-2)",
133
+ tagSuccessFillDisabledFontColor: "var(--soui-neutral-text-2)",
134
+ tagWarningFillDisabledFontColor: "var(--soui-neutral-text-2)",
135
+ tagDangerFillDisabledFontColor: "var(--soui-neutral-text-2)",
136
+ tooltipWarningColor: "var(--soui-warning-6)",
137
+ tooltipDangerColor: "var(--soui-danger-6)",
138
+ "Neutral-text-1": "#FFFFFFE6",
139
+ checkboxIconDisabledBackgroundColor: "var(--soui-neutral-fill-3)",
140
+ checkboxIconBackgroundColor: "var(--soui-transparent)",
141
+ checkboxIconDisabledBorderColor: "var(--soui-neutral-border-2)",
142
+ radioIconBackgroundColor: "var(--soui-transparent)",
143
+ radioIconDisabledBackgroundColor: "var(--soui-neutral-fill-3)",
144
+ radioIconDisabledColor: "var(--soui-neutral-border-2)",
145
+ datePickerTimeItemActiveBackgroundColor: "var(--soui-brand-2)",
146
+ selectOptionActiveBackgroundColor: "var(--soui-brand-2)",
147
+ dropdownOptionSelectBackgroundColor: "var(--soui-brand-2)",
148
+ treeSelectContentActiveBackgroundColor: "var(--soui-brand-2)",
149
+ treeSelectContentDisabledHoverBackgroundColor: "var(--soui-neutral-fill-3)",
150
+ sliderValueHoverBackgroundColor: "var(--soui-warning-6)",
151
+ checkboxIconCheckedColor: "var(--soui-neutral-text-1)",
152
+ checkboxIconCheckedDisabledColor: "var(--soui-neutral-text-2)",
153
+ switchDisabledCircleCheckedFill: "var(--soui-neutral-text-2)",
154
+ tagTangerineFontColor: "var(--soui-functional-t-6)",
155
+ tagTangerineBackgroundColor: "var(--soui-functional-t-1)",
156
+ tagTangerineBorderColor: "var(--soui-functional-t-1)",
157
+ tagTangerineOutlineFontColor: "var(--soui-functional-t-6)",
158
+ tagTangerineOutlineBorderColor: "var(--soui-functional-t-3)",
159
+ tagTangerineFillBackgroundColor: "var(--soui-functional-t-6)",
160
+ tagTangerineFillBorderColor: "var(--soui-functional-t-6)",
161
+ tagPurpleFontColor: "var(--soui-functional-p-6)",
162
+ tagPurpleBackgroundColor: "var(--soui-functional-p-1)",
163
+ tagPurpleBorderColor: "var(--soui-functional-p-1)",
164
+ tagPurpleOutlineFontColor: "var(--soui-functional-p-6)",
165
+ tagPurpleOutlineBorderColor: "var(--soui-functional-p-3)",
166
+ tagPurpleFillBackgroundColor: "var(--soui-functional-p-6)",
167
+ tagPurpleFillBorderColor: "var(--soui-functional-p-6)",
168
+ tagMagentaFontColor: "var(--soui-functional-ma-6)",
169
+ tagMagentaBackgroundColor: "var(--soui-functional-ma-1)",
170
+ tagMagentaBorderColor: "var(--soui-functional-ma-1)",
171
+ tagMagentaOutlineFontColor: "var(--soui-functional-ma-6)",
172
+ tagMagentaOutlineBorderColor: "var(--soui-functional-ma-3)",
173
+ tagMagentaFillBackgroundColor: "var(--soui-functional-ma-6)",
174
+ tagMagentaFillBorderColor: "var(--soui-functional-ma-6)",
175
+ tagBrownFontColor: "var(--soui-functional-br-6)",
176
+ tagBrownBackgroundColor: "var(--soui-functional-br-1)",
177
+ tagBrownBorderColor: "var(--soui-functional-br-1)",
178
+ tagBrownOutlineFontColor: "var(--soui-functional-br-6)",
179
+ tagBrownOutlineBorderColor: "var(--soui-functional-br-3)",
180
+ tagBrownFillBackgroundColor: "var(--soui-functional-br-6)",
181
+ tagBrownFillBorderColor: "var(--soui-functional-br-6)",
182
+ tagIndigoFontColor: "var(--soui-functional-in-6)",
183
+ tagIndigoBackgroundColor: "var(--soui-functional-in-1)",
184
+ tagIndigoBorderColor: "var(--soui-functional-in-1)",
185
+ tagIndigoOutlineFontColor: "var(--soui-functional-in-6)",
186
+ tagIndigoOutlineBorderColor: "var(--soui-functional-in-3)",
187
+ tagIndigoFillBackgroundColor: "var(--soui-functional-in-6)",
188
+ tagIndigoFillBorderColor: "var(--soui-functional-in-6)",
189
+ tagCyanFontColor: "var(--soui-functional-cy-6)",
190
+ tagCyanBackgroundColor: "var(--soui-functional-cy-1)",
191
+ tagCyanBorderColor: "var(--soui-functional-cy-1)",
192
+ tagCyanOutlineFontColor: "var(--soui-functional-cy-6)",
193
+ tagCyanOutlineBorderColor: "var(--soui-functional-cy-3)",
194
+ tagCyanFillBackgroundColor: "var(--soui-functional-cy-6)",
195
+ tagCyanFillBorderColor: "var(--soui-functional-cy-6)",
196
+ tagNeonFontColor: "var(--soui-functional-ne-6)",
197
+ tagNeonBackgroundColor: "var(--soui-functional-ne-1)",
198
+ tagNeonBorderColor: "var(--soui-functional-ne-1)",
199
+ tagNeonOutlineFontColor: "var(--soui-functional-ne-6)",
200
+ tagNeonOutlineBorderColor: "var(--soui-functional-ne-3)",
201
+ tagNeonFillBackgroundColor: "var(--soui-functional-ne-6)",
202
+ tagNeonFillBorderColor: "var(--soui-functional-ne-6)",
203
+ tagLemonFontColor: "var(--soui-functional-le-6)",
204
+ tagLemonBackgroundColor: "var(--soui-functional-le-1)",
205
+ tagLemonBorderColor: "var(--soui-functional-le-1)",
206
+ tagLemonOutlineFontColor: "var(--soui-functional-le-6)",
207
+ tagLemonOutlineBorderColor: "var(--soui-functional-le-3)",
208
+ tagLemonFillBackgroundColor: "var(--soui-functional-le-6)",
209
+ tagLemonFillBorderColor: "var(--soui-functional-le-6)",
210
+ tagOrangeFontColor: "var(--soui-functional-or-6)",
211
+ tagOrangeBackgroundColor: "var(--soui-functional-or-1)",
212
+ tagOrangeBorderColor: "var(--soui-functional-or-1)",
213
+ tagOrangeOutlineFontColor: "var(--soui-functional-or-6)",
214
+ tagOrangeOutlineBorderColor: "var(--soui-functional-or-3)",
215
+ tagOrangeFillBackgroundColor: "var(--soui-functional-or-6)",
216
+ tagOrangeFillBorderColor: "var(--soui-functional-or-6)",
217
+ tagTangerineDisabledFontColor: "var(--soui-functional-t-3)",
218
+ tagTangerineDisabledBackgroundColor: "var(--soui-functional-t-1)",
219
+ tagTangerineDisabledBorderColor: "var(--soui-functional-t-1)",
220
+ tagTangerineOutlineDisabledFontColor: "var(--soui-functional-t-3)",
221
+ tagTangerineOutlineDisabledBorderColor: "var(--soui-functional-t-2)",
222
+ tagTangerineFillDisabledBackgroundColor: "var(--soui-functional-t-3)",
223
+ tagTangerineFillDisabledBorderColor: "var(--soui-functional-t-3)",
224
+ tagPurpleDisabledFontColor: "var(--soui-functional-p-4)",
225
+ tagPurpleDisabledBackgroundColor: "var(--soui-functional-p-1)",
226
+ tagPurpleDisabledBorderColor: "var(--soui-functional-p-1)",
227
+ tagPurpleOutlineDisabledFontColor: "var(--soui-functional-p-3)",
228
+ tagPurpleOutlineDisabledBorderColor: "var(--soui-functional-p-2)",
229
+ tagPurpleFillDisabledBackgroundColor: "var(--soui-functional-p-3)",
230
+ tagPurpleFillDisabledBorderColor: "var(--soui-functional-p-3)",
231
+ tagBrownDisabledFontColor: "var(--soui-functional-br-3)",
232
+ tagBrownDisabledBackgroundColor: "var(--soui-functional-br-1)",
233
+ tagBrownDisabledBorderColor: "var(--soui-functional-br-1)",
234
+ tagBrownOutlineDisabledFontColor: "var(--soui-functional-br-3)",
235
+ tagBrownOutlineDisabledBorderColor: "var(--soui-functional-br-2)",
236
+ tagBrownFillDisabledBackgroundColor: "var(--soui-functional-br-3)",
237
+ tagBrownFillDisabledBorderColor: "var(--soui-functional-br-3)",
238
+ tagMagentaDisabledFontColor: "var(--soui-functional-ma-3)",
239
+ tagMagentaDisabledBackgroundColor: "var(--soui-functional-ma-1)",
240
+ tagMagentaDisabledBorderColor: "var(--soui-functional-ma-1)",
241
+ tagMagentaOutlineDisabledFontColor: "var(--soui-functional-ma-3)",
242
+ tagMagentaOutlineDisabledBorderColor: "var(--soui-functional-ma-2)",
243
+ tagMagentaFillDisabledBackgroundColor: "var(--soui-functional-ma-3)",
244
+ tagMagentaFillDisabledBorderColor: "var(--soui-functional-ma-3)",
245
+ tagIndigoDisabledFontColor: "var(--soui-functional-in-3)",
246
+ tagIndigoDisabledBackgroundColor: "var(--soui-functional-in-1)",
247
+ tagIndigoDisabledBorderColor: "var(--soui-functional-in-1)",
248
+ tagIndigoOutlineDisabledFontColor: "var(--soui-functional-in-3)",
249
+ tagIndigoOutlineDisabledBorderColor: "var(--soui-functional-in-2)",
250
+ tagIndigoFillDisabledBackgroundColor: "var(--soui-functional-in-3)",
251
+ tagIndigoFillDisabledBorderColor: "var(--soui-functional-in-3)",
252
+ tagCyanDisabledFontColor: "var(--soui-functional-cy-3)",
253
+ tagCyanDisabledBackgroundColor: "var(--soui-functional-cy-1)",
254
+ tagCyanDisabledBorderColor: "var(--soui-functional-cy-1)",
255
+ tagCyanOutlineDisabledFontColor: "var(--soui-functional-cy-3)",
256
+ tagCyanOutlineDisabledBorderColor: "var(--soui-functional-cy-2)",
257
+ tagCyanFillDisabledBackgroundColor: "var(--soui-functional-cy-3)",
258
+ tagCyanFillDisabledBorderColor: "var(--soui-functional-cy-3)",
259
+ tagNeonDisabledFontColor: "var(--soui-functional-ne-3)",
260
+ tagNeonDisabledBackgroundColor: "var(--soui-functional-ne-1)",
261
+ tagNeonDisabledBorderColor: "var(--soui-functional-ne-1)",
262
+ tagNeonOutlineDisabledFontColor: "var(--soui-functional-ne-3)",
263
+ tagNeonOutlineDisabledBorderColor: "var(--soui-functional-ne-2)",
264
+ tagNeonFillDisabledBackgroundColor: "var(--soui-functional-ne-3)",
265
+ tagNeonFillDisabledBorderColor: "var(--soui-functional-ne-3)",
266
+ tagLemonDisabledFontColor: "var(--soui-functional-le-3)",
267
+ tagLemonDisabledBackgroundColor: "var(--soui-functional-le-1)",
268
+ tagLemonDisabledBorderColor: "var(--soui-functional-le-1)",
269
+ tagLemonOutlineDisabledFontColor: "var(--soui-functional-le-3)",
270
+ tagLemonOutlineDisabledBorderColor: "var(--soui-functional-le-2)",
271
+ tagLemonFillDisabledBackgroundColor: "var(--soui-functional-le-3)",
272
+ tagLemonFillDisabledBorderColor: "var(--soui-functional-le-3)",
273
+ tagOrangeDisabledFontColor: "var(--soui-functional-or-3)",
274
+ tagOrangeDisabledBackgroundColor: "var(--soui-functional-or-1)",
275
+ tagOrangeDisabledBorderColor: "var(--soui-functional-or-1)",
276
+ tagOrangeOutlineDisabledFontColor: "var(--soui-functional-or-3)",
277
+ tagOrangeOutlineDisabledBorderColor: "var(--soui-functional-or-2)",
278
+ tagOrangeFillDisabledBackgroundColor: "var(--soui-functional-or-3)",
279
+ tagOrangeFillDisabledBorderColor: "var(--soui-functional-or-3)",
280
+ tagMagentaFillDisabledFontColor: "var(--soui-neutral-text-2)",
281
+ tagBrownFillDisabledFontColor: "var(--soui-neutral-text-2)",
282
+ tagPurpleFillDisabledFontColor: "var(--soui-neutral-text-2)",
283
+ tagIndigoFillDisabledFontColor: "var(--soui-neutral-text-2)",
284
+ tagCyanFillDisabledFontColor: "var(--soui-neutral-text-2)",
285
+ tagNeonFillDisabledFontColor: "var(--soui-neutral-text-2)",
286
+ tagLemonFillDisabledFontColor: "var(--soui-neutral-text-2)",
287
+ tagOrangeFillDisabledFontColor: "var(--soui-neutral-text-2)",
288
+ tagTangerineFillDisabledFontColor: "var(--soui-neutral-text-2)",
289
+ tagInfoOutlineBorderColor: "var(--soui-brand-3)",
290
+ tagSuccessOutlineBorderColor: "var(--soui-success-3)",
291
+ tagWarningOutlineBorderColor: "var(--soui-warning-3)",
292
+ tagDangerOutlineBorderColor: "var(--soui-danger-3)",
293
+ tagInfoOutlineDisabledBorderColor: "var(--soui-brand-2)",
294
+ tagSuccessOutlineDisabledBorderColor: "var(--soui-success-2)",
295
+ tagWarningOutlineDisabledBorderColor: "var(--soui-warning-2)",
296
+ tagDangerOutlineDisabledBorderColor: "var(--soui-danger-2)",
297
+ treeSelectContentDisabledBackgroundColor: "var(--soui-neutral-fill-2)",
298
+ };
@@ -0,0 +1,309 @@
1
+ export default {
2
+ "Brand-1": "#E9F5FE",
3
+ "Brand-2": "#BDE2FF",
4
+ "Brand-10": "#001D61",
5
+ "Brand-3": "#94CDFF",
6
+ "Brand-4": "#6BB5FF",
7
+ "Brand-5": "#429AFF",
8
+ "Brand-6": "#197AFA",
9
+ "Brand-7": "#0B5BD4",
10
+ "Brand-8": "#0040AD",
11
+ "Brand-9": "#002D87",
12
+ "Cyan-1": "#E3FEFA",
13
+ "Cyan-10": "#051F24",
14
+ "Cyan-2": "#ADF2E9",
15
+ "Cyan-3": "#7DE3D9",
16
+ "Cyan-4": "#54D4CC",
17
+ "Cyan-5": "#34C6C1",
18
+ "Cyan-6": "#1DB8B9",
19
+ "Cyan-7": "#158B90",
20
+ "Cyan-8": "#0D6169",
21
+ "Cyan-9": "#093D45",
22
+ "Danger-1": "#FCE6E6",
23
+ "Danger-10": "#4D000A",
24
+ "Danger-2": "#F7C1C0",
25
+ "Danger-3": "#F29896",
26
+ "Danger-4": "#F38981",
27
+ "Danger-5": "#EF6661",
28
+ "Danger-6": "#EB4242",
29
+ "Danger-7": "#CC2C29",
30
+ "Danger-8": "#9C161F",
31
+ "Danger-9": "#740813",
32
+ "Indigo-1": "#EEF2FE",
33
+ "Indigo-10": "#170F69",
34
+ "Indigo-2": "#D7DDFF",
35
+ "Indigo-3": "#ABB4FB",
36
+ "Indigo-4": "#848FF9",
37
+ "Indigo-5": "#6972F6",
38
+ "Indigo-6": "#4446F7",
39
+ "Indigo-7": "#3431CD",
40
+ "Indigo-8": "#2822A6",
41
+ "Indigo-9": "#1E1782",
42
+ "Lemon-1": "#FCFADE",
43
+ "Lemon-10": "#4D3000",
44
+ "Lemon-2": "#FFF9BF",
45
+ "Lemon-3": "#FFE76C",
46
+ "Lemon-4": "#FFE76C",
47
+ "Lemon-5": "#FFD943",
48
+ "Lemon-6": "#FFC91A",
49
+ "Lemon-7": "#D29F10",
50
+ "Lemon-8": "#A67708",
51
+ "Lemon-9": "#795203",
52
+ "Magenta-1": "#FCF1F6",
53
+ "Magenta-10": "#4B0C37",
54
+ "Magenta-2": "#F8D8E6",
55
+ "Magenta-3": "#F3B1D0",
56
+ "Magenta-4": "#EF8BBE",
57
+ "Magenta-5": "#E564A8",
58
+ "Magenta-6": "#D84293",
59
+ "Magenta-7": "#B4317D",
60
+ "Magenta-8": "#912266",
61
+ "Magenta-9": "#6E164E",
62
+ "Neon-1": "#F1FAE1",
63
+ "Neon-10": "#194D00",
64
+ "Neon-2": "#DDF2BE",
65
+ "Neon-3": "#C4E598",
66
+ "Neon-4": "#AAD974",
67
+ "Neon-5": "#90CC54",
68
+ "Neon-6": "#77BF37",
69
+ "Neon-7": "#5AA223",
70
+ "Neon-8": "#418613",
71
+ "Neon-9": "#2B6908",
72
+ "Neutral-1": "#000000",
73
+ "Neutral-10": "#020B18",
74
+ "Neutral-2": "#F4F5F8",
75
+ "Neutral-3": "#E8EBF0",
76
+ "Neutral-4": "#CCCFD7",
77
+ "Neutral-5": "#B3B7C1",
78
+ "Neutral-6": "#999DA8",
79
+ "Neutral-7": "#666C7C",
80
+ "Neutral-8": "#333E59",
81
+ "Neutral-9": "#141737",
82
+ "Orange-1": "#FFF8E6",
83
+ "Orange-10": "#4D2100",
84
+ "Orange-2": "#FFEABA",
85
+ "Orange-3": "#FFD98D",
86
+ "Orange-4": "#FFC45F",
87
+ "Orange-5": "#FFAD32",
88
+ "Orange-6": "#FF9204",
89
+ "Orange-7": "#D27102",
90
+ "Orange-8": "#A65401",
91
+ "Orange-9": "#793900",
92
+ "Brown-1": "#FAF4E3",
93
+ "Brown-10": "#4D2100",
94
+ "Brown-2": "#EBDDBC",
95
+ "Brown-3": "#D6C094",
96
+ "Brown-4": "#C2A470",
97
+ "Brown-5": "#AD8951",
98
+ "Brown-6": "#996F37",
99
+ "Brown-7": "#865824",
100
+ "Brown-8": "#734415",
101
+ "Brown-9": "#603109",
102
+ "Purple-1": "#F8EEFE",
103
+ "Purple-10": "#150530",
104
+ "Purple-2": "#EDD6FE",
105
+ "Purple-3": "#CFA3F3",
106
+ "Purple-4": "#AD72E4",
107
+ "Purple-5": "#8B48D5",
108
+ "Purple-6": "#6C23C6",
109
+ "Purple-7": "#4E159E",
110
+ "Purple-8": "#360C77",
111
+ "Purple-9": "#220652",
112
+ "Success-1": "#E4FCED",
113
+ "Success-2": "#ADEEC9",
114
+ "Success-10": "#004D36",
115
+ "Success-3": "#78DCA7",
116
+ "Success-4": "#4ACB8A",
117
+ "Success-5": "#22B973",
118
+ "Success-6": "#00A85F",
119
+ "Success-7": "#009157",
120
+ "Success-8": "#007A4D",
121
+ "Success-9": "#006342",
122
+ "Tangerine-1": "#FFF0E5",
123
+ "Tangerine-10": "#56130A",
124
+ "Tangerine-2": "#FED4B9",
125
+ "Tangerine-3": "#FDB58F",
126
+ "Tangerine-4": "#FD9568",
127
+ "Tangerine-5": "#FD7445",
128
+ "Tangerine-6": "#F75229",
129
+ "Tangerine-7": "#CD3A1D",
130
+ "Tangerine-8": "#A22614",
131
+ "Tangerine-9": "#7B1B0E",
132
+ "Warning-1": "#FFF3E2",
133
+ "Warning-10": "#4D1600",
134
+ "Warning-2": "#FDDFBA",
135
+ "Warning-3": "#FBC68D",
136
+ "Warning-4": "#FDBB66",
137
+ "Warning-5": "#F78C35",
138
+ "Warning-6": "#F56C0A",
139
+ "Warning-7": "#CB5206",
140
+ "Warning-8": "#A13A03",
141
+ "Warning-9": "#772601",
142
+ "Neutral-text-5": "#141737",
143
+ "Neutral-text-4": "#666C7C",
144
+ "Neutral-text-3": "#999DA8",
145
+ "Neutral-text-2": "#B3B7C1",
146
+ "Neutral-text-1": "#FFFFFF",
147
+ "Neutral-border-2": "#CCCFD7",
148
+ "Neutral-border-1": "#E8EBF0",
149
+ "Neutral-fill-7": "#666C7C",
150
+ "Neutral-fill-5": "#B3B7C1",
151
+ "Neutral-fill-9": "#141737",
152
+ "Neutral-fill-10": "#020B18",
153
+ "Neutral-fill-6": "#999DA8",
154
+ "Neutral-fill-8": "#333E59",
155
+ "Neutral-fill-4": "#CCCFD7",
156
+ "Neutral-fill-3": "#E8EBF0",
157
+ "Neutral-fill-2": "#F4F5F8",
158
+ "Neutral-fill-1": "#FFFFFF",
159
+ "Padding-1": "1px",
160
+ "Padding-2": "2px",
161
+ "Padding-3": "3px",
162
+ "Padding-4": "4px",
163
+ "Padding-5": "5px",
164
+ "Padding-6": "6px",
165
+ "Padding-7": "7px",
166
+ "Padding-8": "8px",
167
+ "Padding-9": "9px",
168
+ "Padding-10": "10px",
169
+ "Padding-11": "11px",
170
+ "Padding-12": "12px",
171
+ "Padding-13": "13px",
172
+ "Padding-14": "14px",
173
+ "Padding-15": "15px",
174
+ "Padding-16": "16px",
175
+ "Padding-17": "17px",
176
+ "Padding-18": "18px",
177
+ "Padding-19": "19px",
178
+ "Padding-20": "20px",
179
+ "Padding-21": "21px",
180
+ "Padding-22": "22px",
181
+ "Padding-23": "23px",
182
+ "Padding-24": "24px",
183
+ "Margin-4": "4px",
184
+ "Margin-8": "8px",
185
+ "Margin-12": "12px",
186
+ "Margin-16": "16px",
187
+ "Margin-24": "24px",
188
+ "Margin-32": "32px",
189
+ "Radius-0": "0px",
190
+ "Radius-2": "2px",
191
+ "Radius-3": "3px",
192
+ "Radius-4": "4px",
193
+ "Radius-8": "8px",
194
+ "Radius-12": "12px",
195
+ "Radius-1000": "1000px",
196
+ "Shadow-1": "0px 2px 5px rgba(2, 11, 24, 0.1)",
197
+ "Shadow-2": "0px 4px 10px rgba(2, 11, 24, 0.1)",
198
+ "Shadow-3": "0px 8px 20px rgba(2, 11, 24, 0.1)",
199
+ "Shadow-4": "0 -2px 10px rgba(102,108,124,0.08)",
200
+ "Shadow-5": "0 2px 10px rgba(102,108,124,0.08)",
201
+ "Line-height-dynamic": "calc( 1em + 8px )",
202
+ "Line-height-dynamic-min": "calc( max(1em, 14px) + 8px )",
203
+ Transparent: "transparent",
204
+ "Mask-fill-1": "rgba(2, 11, 24, 0.3)",
205
+ Size: "2",
206
+ "Radius-rect": "0px",
207
+ "Radius-lesser": "2px",
208
+ "Radius-small": "3px",
209
+ "Radius-default": "4px",
210
+ "Radius-large": "8px",
211
+ "Radius-full": "1000px",
212
+ "Radius-circle": "50%",
213
+ "Border-0": "0px",
214
+ "Border-1": "1px",
215
+ "Border-2": "2px",
216
+ "Border-3": "3px",
217
+ "Weight-light": "300",
218
+ "Weight-regular": "400",
219
+ "Weight-medium": "500",
220
+ "Weight-Semibold": "600",
221
+ "Weight-Bold": "700",
222
+ "Font-12": "12px",
223
+ "Font-14": "14px",
224
+ "Font-16": "16px",
225
+ "Font-18": "18px",
226
+ "Font-20": "20px",
227
+ "Font-24": "24px",
228
+ "Font-28": "28px",
229
+ "Font-32": "32px",
230
+ "Font-36": "36px",
231
+ "Font-48": "48px",
232
+ "Spacing-0": "0px",
233
+ "Spacing-1": "1px",
234
+ "Spacing-2": "2px",
235
+ "Spacing-3": "3px",
236
+ "Spacing-4": "4px",
237
+ "Spacing-5": "5px",
238
+ "Spacing-6": "6px",
239
+ "Spacing-7": "7px",
240
+ "Spacing-8": "8px",
241
+ "Spacing-9": "9px",
242
+ "Spacing-10": "10px",
243
+ "Spacing-11": "11px",
244
+ "Spacing-12": "12px",
245
+ "Spacing-13": "13px",
246
+ "Spacing-14": "14px",
247
+ "Spacing-15": "15px",
248
+ "Spacing-16": "16px",
249
+ "Spacing-17": "17px",
250
+ "Spacing-18": "18px",
251
+ "Spacing-19": "19px",
252
+ "Spacing-20": "20px",
253
+ "Spacing-21": "21px",
254
+ "Spacing-22": "22px",
255
+ "Spacing-23": "23px",
256
+ "Spacing-24": "24px",
257
+ "Spacing-25": "25px",
258
+ "Spacing-26": "26px",
259
+ "Spacing-27": "27px",
260
+ "Spacing-28": "28px",
261
+ "Spacing-29": "29px",
262
+ "Spacing-30": "30px",
263
+ "Spacing-31": "31px",
264
+ "Spacing-32": "32px",
265
+ "Spacing-33": "33px",
266
+ "Spacing-34": "34px",
267
+ "Spacing-35": "35px",
268
+ "Spacing-36": "36px",
269
+ "Spacing-37": "37px",
270
+ "Spacing-38": "38px",
271
+ "Spacing-39": "39px",
272
+ "Spacing-40": "40px",
273
+ "Spacing-41": "41px",
274
+ "Spacing-42": "42px",
275
+ "Spacing-43": "43px",
276
+ "Spacing-44": "44px",
277
+ "Spacing-45": "45px",
278
+ "Spacing-46": "46px",
279
+ "Spacing-47": "47px",
280
+ "Spacing-48": "48px",
281
+ "Size-1": "2px",
282
+ "Size-2": "4px",
283
+ "Size-3": "6px",
284
+ "Size-4": "8px",
285
+ "Size-5": "10px",
286
+ "Size-6": "12px",
287
+ "Size-7": "14px",
288
+ "Size-8": "16px",
289
+ "Size-9": "18px",
290
+ "Size-10": "20px",
291
+ "Size-11": "22px",
292
+ "Size-12": "24px",
293
+ "Size-13": "26px",
294
+ "Size-14": "28px",
295
+ "Size-15": "30px",
296
+ "Size-16": "32px",
297
+ "Size-17": "34px",
298
+ "Size-18": "36px",
299
+ "Size-19": "38px",
300
+ "Size-20": "40px",
301
+ "Size-21": "42px",
302
+ "Size-22": "44px",
303
+ "Size-23": "46px",
304
+ "Size-24": "48px",
305
+ "Size-25": "50px",
306
+ "Size-26": "52px",
307
+ "Size-27": "54px",
308
+ "Size-28": "56px",
309
+ };
package/color/green.ts ADDED
@@ -0,0 +1,12 @@
1
+ export default {
2
+ "Brand-1": "#e8fff4",
3
+ "Brand-2": "#BCF5DA",
4
+ "Brand-3": "#93EBC5",
5
+ "Brand-4": "#6DE0B2",
6
+ "Brand-5": "#49D6A3",
7
+ "Brand-6": "#29CC97",
8
+ "Brand-7": "#1AAC80",
9
+ "Brand-8": "#0E8C6B",
10
+ "Brand-9": "#056C54",
11
+ "Brand-10": "#004D3D",
12
+ };
package/color/index.ts ADDED
@@ -0,0 +1,41 @@
1
+ import dark from "./dark";
2
+ import light from "./default";
3
+ import blue from "./blue";
4
+ import red from "./red";
5
+ import pink from "./pink";
6
+ import green from "./green";
7
+ import orange from "./orange";
8
+ import purple from "./purple";
9
+
10
+ export const themeColors = {
11
+ green,
12
+ orange,
13
+ purple,
14
+ blue,
15
+ red,
16
+ pink,
17
+ dark,
18
+ light
19
+ };
20
+
21
+ export default (
22
+ theme: "dark" | "light",
23
+ color: "red" | "pink" | "blue" | "green" | "orange" | "purple" = "blue"
24
+ ) => {
25
+ const themeColor = themeColors[color];
26
+ document.documentElement.style.setProperty("--soui-brand-6", themeColor['Brand-6']);
27
+ (window as any).Shineout?.setToken?.({
28
+ selector: "html",
29
+ token: {
30
+ ...(theme === "dark" ? dark : light),
31
+ ...themeColor,
32
+ "Brand-1":
33
+ theme === "dark" ? themeColor["Brand-1"] + "00" : themeColor["Brand-1"],
34
+ },
35
+ });
36
+ if (theme === "dark") {
37
+ document.documentElement.style.setProperty("color-scheme", "dark");
38
+ } else {
39
+ document.documentElement.style.removeProperty("color-scheme");
40
+ }
41
+ };
@@ -0,0 +1,12 @@
1
+ export default {
2
+ "Brand-1": "#fff0e5",
3
+ "Brand-2": "#FED4B9",
4
+ "Brand-3": "#FDB58F",
5
+ "Brand-4": "#FD9568",
6
+ "Brand-5": "#FD7445",
7
+ "Brand-6": "#F75229",
8
+ "Brand-7": "#CD3A1D",
9
+ "Brand-8": "#A22614",
10
+ "Brand-9": "#7B1B0E",
11
+ "Brand-10": "#56130A",
12
+ };
package/color/pink.ts ADDED
@@ -0,0 +1,12 @@
1
+ export default {
2
+ "Brand-1": "#FCF1F6",
3
+ "Brand-10": "#4B0C37",
4
+ "Brand-2": "#F8D8E6",
5
+ "Brand-3": "#F3B1D0",
6
+ "Brand-4": "#EF8BBE",
7
+ "Brand-5": "#E564A8",
8
+ "Brand-6": "#D84293",
9
+ "Brand-7": "#B4317D",
10
+ "Brand-8": "#912266",
11
+ "Brand-9": "#6E164E",
12
+ };
@@ -0,0 +1,12 @@
1
+ export default {
2
+ "Brand-1": "#ece8ff",
3
+ "Brand-2": "#D1CAF7",
4
+ "Brand-3": "#B6AEEE",
5
+ "Brand-4": "#9B94E6",
6
+ "Brand-5": "#807BDD",
7
+ "Brand-6": "#6463D5",
8
+ "Brand-7": "#3E40B3",
9
+ "Brand-8": "#222791",
10
+ "Brand-9": "#0D156F",
11
+ "Brand-10": "#00094D",
12
+ };
package/color/red.ts ADDED
@@ -0,0 +1,12 @@
1
+ export default {
2
+ "Brand-1": "#FBEBEB",
3
+ "Brand-2": "#F4C9BF",
4
+ "Brand-10": "#4D0006",
5
+ "Brand-3": "#E8A599",
6
+ "Brand-4": "#DD8175",
7
+ "Brand-5": "#D15F55",
8
+ "Brand-6": "#C63F37",
9
+ "Brand-7": "#A82523",
10
+ "Brand-8": "#891315",
11
+ "Brand-9": "#6B070C",
12
+ };
package/demo.vue CHANGED
@@ -145,8 +145,9 @@ onBeforeUnmount(() => previewRoot?.unmount());
145
145
  }
146
146
 
147
147
  .aui-demo-preview {
148
- padding: 32px 24px;
148
+ padding: 20px;
149
149
  min-height: 80px;
150
+ overflow: auto;
150
151
  background: var(--vp-c-bg);
151
152
  }
152
153
 
package/drop-down.vue ADDED
@@ -0,0 +1,197 @@
1
+ <script setup lang="ts">
2
+ // @ts-nocheck
3
+ import { ref, onMounted, onUnmounted } from "vue";
4
+
5
+ // --- 1. 定义配置项接口 ---
6
+ export interface DropdownItem {
7
+ id?: string | number;
8
+ label?: string; // 显示的文字
9
+ color?: string; // 【核心】自定义颜色 (如 '#ff4d4f', 'blue', 'rgb(0,0,0)')
10
+ disabled?: boolean; // 是否禁用
11
+ divider?: boolean; // 是否是分割线
12
+ onClick?: () => void; // 点击回调
13
+ }
14
+
15
+ // --- 2. Props 定义 ---
16
+ const props = withDefaults(
17
+ defineProps<{
18
+ options: DropdownItem[]; // 配置数组
19
+ width?: string; // 下拉框宽度
20
+ trigger?: "click" | "hover";
21
+ }>(),
22
+ {
23
+ options: () => [],
24
+ width: "180px",
25
+ trigger: "click",
26
+ }
27
+ );
28
+
29
+ // --- 3. 状态管理 ---
30
+ const visible = ref(false);
31
+ const containerRef = ref<HTMLElement | null>(null);
32
+
33
+ // 切换显示
34
+ const toggle = () => {
35
+ if (props.trigger === "hover") return;
36
+ visible.value = !visible.value;
37
+ };
38
+
39
+ // Hover 逻辑
40
+ const handleMouseEnter = () => {
41
+ if (props.trigger === "hover") visible.value = true;
42
+ };
43
+ const handleMouseLeave = () => {
44
+ if (props.trigger === "hover") visible.value = false;
45
+ };
46
+
47
+ // --- 4. 点击菜单项逻辑 ---
48
+ const handleItemClick = (item: DropdownItem) => {
49
+ if (item.disabled || item.divider) return;
50
+
51
+ // 关闭菜单
52
+ visible.value = false;
53
+
54
+ // 执行回调
55
+ if (typeof item.onClick === "function") {
56
+ item.onClick();
57
+ }
58
+ };
59
+
60
+ // 点击外部关闭
61
+ const handleClickOutside = (event: MouseEvent) => {
62
+ if (
63
+ containerRef.value &&
64
+ !containerRef.value.contains(event.target as Node)
65
+ ) {
66
+ visible.value = false;
67
+ }
68
+ };
69
+
70
+ onMounted(() => document.addEventListener("click", handleClickOutside));
71
+ onUnmounted(() => document.removeEventListener("click", handleClickOutside));
72
+ </script>
73
+
74
+ <template>
75
+ <div
76
+ class="dropdown-container"
77
+ ref="containerRef"
78
+ @mouseenter="handleMouseEnter"
79
+ @mouseleave="handleMouseLeave"
80
+ >
81
+ <!-- 触发器 (Slot) -->
82
+ <div class="trigger-wrapper" @click.stop="toggle">
83
+ <slot name="trigger">
84
+ <button class="default-btn">菜单 ▾</button>
85
+ </slot>
86
+ </div>
87
+
88
+ <!-- 下拉菜单 -->
89
+ <transition name="scale-fade">
90
+ <div v-if="visible" class="dropdown-menu" :style="{ width: width }">
91
+ <ul class="menu-list">
92
+ <li
93
+ class="menu-item"
94
+ @click.stop="handleItemClick(item)"
95
+ v-for="item in options"
96
+ :key="item.label"
97
+ >
98
+ <!-- 核心:动态绑定颜色 -->
99
+ <span class="item-label">
100
+ {{ item.label }}
101
+ </span>
102
+ <span
103
+ v-if="item.color"
104
+ :style="{ background: item.color }"
105
+ class="item-color"
106
+ />
107
+ </li>
108
+ </ul>
109
+ </div>
110
+ </transition>
111
+ </div>
112
+ </template>
113
+
114
+ <style scoped>
115
+ .dropdown-container {
116
+ position: relative;
117
+ display: inline-block;
118
+ }
119
+
120
+ .trigger-wrapper {
121
+ cursor: pointer;
122
+ display: flex;
123
+ }
124
+
125
+ /* 下拉框主体 */
126
+ .dropdown-menu {
127
+ position: absolute;
128
+ top: calc(100% + 8px); /* 距离触发器下方 8px */
129
+ right: -20px;
130
+ /* 如果需要居右对齐,把 left:0 改为 right:0 */
131
+ background-color: var(--vp-c-bg);
132
+ border-radius: 8px;
133
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
134
+ border: 1px solid var(--vp-c-gutter);
135
+ padding: 6px 0;
136
+ z-index: 2000;
137
+ overflow: hidden;
138
+ }
139
+
140
+ .menu-list {
141
+ list-style: none;
142
+ margin: 0;
143
+ padding: 0;
144
+ }
145
+
146
+ /* 菜单项样式 */
147
+ .menu-item {
148
+ padding: 4px 16px;
149
+ cursor: pointer;
150
+ font-size: 12px;
151
+ transition: background-color 0.2s;
152
+ display: flex;
153
+ gap: 4px;
154
+ align-items: center;
155
+ user-select: none;
156
+ }
157
+
158
+ .menu-item:hover {
159
+ background-color: var(--vp-c-bg-soft); /* 浅灰色 hover 背景 */
160
+ }
161
+
162
+ /* Label 样式 */
163
+ .item-label {
164
+ color: var(--vp-custom-block-info-text);
165
+ font-weight: 500;
166
+ flex: 1;
167
+ }
168
+
169
+ .item-color {
170
+ border-radius: 50%;
171
+ width: 8px;
172
+ height: 8px;
173
+ display: inline-block;
174
+ }
175
+
176
+ /* 默认按钮样式 */
177
+ .default-btn {
178
+ padding: 8px 16px;
179
+ border: 1px solid #dcdfe6;
180
+ background: white;
181
+ border-radius: 4px;
182
+ cursor: pointer;
183
+ color: #606266;
184
+ }
185
+
186
+ /* 动画效果 */
187
+ .scale-fade-enter-active,
188
+ .scale-fade-leave-active {
189
+ transition: opacity 0.2s ease, transform 0.2s ease;
190
+ }
191
+
192
+ .scale-fade-enter-from,
193
+ .scale-fade-leave-to {
194
+ opacity: 0;
195
+ transform: translateY(-8px) scaleY(0.95);
196
+ }
197
+ </style>
package/index.ts CHANGED
@@ -4,6 +4,11 @@ import Layout from "./layout.vue";
4
4
  import Demo from "./demo.vue";
5
5
  import "./theme.css";
6
6
 
7
+ export interface ThemeHooks {
8
+ /** 主题或颜色变更时触发(dark/light 切换、颜色切换都会调用) */
9
+ onThemeChange?: (info: { theme: "dark" | "light"; color: string }) => void;
10
+ }
11
+
7
12
  export default {
8
13
  extends: DefaultTheme,
9
14
  Layout,
package/layout.vue CHANGED
@@ -4,10 +4,13 @@ import { useData } from "vitepress";
4
4
  import DefaultTheme from "vitepress/theme";
5
5
  import Playground from "./playground.vue";
6
6
  import setTheme from "./color";
7
- import { watch, nextTick, provide, onMounted } from "vue";
7
+ import { watch, nextTick, provide, inject, onMounted } from "vue";
8
+ import type { ThemeHooks } from "./index";
8
9
  // @ts-ignore
9
10
  import NiceDropdown from "./drop-down.vue";
10
11
 
12
+ const themeHooks = inject<ThemeHooks>("theme-hooks", {});
13
+
11
14
  const colorConfig = [
12
15
  {
13
16
  key: "blue",
@@ -45,6 +48,10 @@ const colorConfig = [
45
48
  onClick: async () => {
46
49
  localStorage?.setItem("color", item.key);
47
50
  setTheme(isDark.value ? "dark" : "light", item.key);
51
+ themeHooks.onThemeChange?.({
52
+ theme: isDark.value ? "dark" : "light",
53
+ color: item.key,
54
+ });
48
55
  },
49
56
  };
50
57
  });
@@ -87,13 +94,20 @@ provide("toggle-appearance", async ({ clientX: x, clientY: y }: MouseEvent) => {
87
94
 
88
95
  onMounted(() => {
89
96
  watch(isDark, async (dark) => {
90
- setTheme(dark ? "dark" : "light", localStorage?.getItem("color") as any);
97
+ const color = localStorage?.getItem("color") as any;
98
+ setTheme(dark ? "dark" : "light", color);
99
+ themeHooks.onThemeChange?.({
100
+ theme: dark ? "dark" : "light",
101
+ color: color || "blue",
102
+ });
91
103
  });
92
104
  setTimeout(async () => {
93
- setTheme(
94
- isDark.value ? "dark" : "light",
95
- localStorage?.getItem("color") as any
96
- );
105
+ const color = localStorage?.getItem("color") as any;
106
+ setTheme(isDark.value ? "dark" : "light", color);
107
+ themeHooks.onThemeChange?.({
108
+ theme: isDark.value ? "dark" : "light",
109
+ color: color || "blue",
110
+ });
97
111
  }, 800);
98
112
  });
99
113
  </script>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yl_lowcode/docs-theme",
3
- "version": "0.0.7",
3
+ "version": "0.0.9",
4
4
  "description": "共享 VitePress 文档主题(React Demo 支持)",
5
5
  "type": "module",
6
6
  "main": "index.ts",
@@ -8,14 +8,6 @@
8
8
  ".": "./index.ts",
9
9
  "./plugins/shiki-raw": "./plugins/shiki-raw.js"
10
10
  },
11
- "files": [
12
- "index.ts",
13
- "layout.vue",
14
- "demo.vue",
15
- "playground.vue",
16
- "plugins",
17
- "styles"
18
- ],
19
11
  "dependencies": {
20
12
  "sucrase": "3.35.1",
21
13
  "@yl_lowcode/editor": "0.0.1"
package/playground.vue CHANGED
@@ -3,6 +3,7 @@
3
3
  import React from "react";
4
4
  import * as ReactDOMClient from "react-dom/client";
5
5
  import { ref, inject, onMounted, onBeforeUnmount } from "vue";
6
+ import { Monaco as MonacoEditor } from "@yl_lowcode/editor";
6
7
  /**
7
8
  * 通用 Playground 组件
8
9
  *
@@ -129,9 +130,6 @@ onMounted(async () => {
129
130
  setError(err);
130
131
  }, []);
131
132
 
132
- // 动态获取 Monaco 组件(从 moduleMap 中取)
133
- const MonacoEditor = userModules["@yl_lowcode/editor"]?.Monaco;
134
-
135
133
  return React.createElement(
136
134
  "div",
137
135
  { style: { display: "flex", height: "100vh", overflow: "hidden" } },
package/publish.sh ADDED
@@ -0,0 +1,20 @@
1
+ #!/bin/bash
2
+
3
+ # 发布包
4
+ # 用法: ./publish.sh [patch|minor|major]
5
+ # npm config set //registry.npmjs.org/:_authToken=新的TOKEN值
6
+
7
+ set -e
8
+
9
+ VERSION_TYPE=${1:-patch}
10
+ DIR=$(cd "$(dirname "$0")" && pwd)
11
+
12
+ cd "$DIR"
13
+
14
+ echo ">>> 升版本 ($VERSION_TYPE)"
15
+ npm version "$VERSION_TYPE" --no-git-tag-version
16
+
17
+ echo ">>> 发布"
18
+ pnpm publish --no-git-checks --access public --ignore-scripts
19
+
20
+ echo ">>> 完成!"
package/theme.css ADDED
@@ -0,0 +1,192 @@
1
+ .dark .shiki span {
2
+ color: var(--shiki-dark, inherit);
3
+ font-size: 13px;
4
+ }
5
+
6
+ html:not(.dark) .shiki span {
7
+ color: var(--shiki-light, inherit);
8
+ font-size: 13px;
9
+ }
10
+
11
+ .vp-doc .language-tsx {
12
+ margin: 0 !important;
13
+ border-radius: 0 !important;
14
+ }
15
+
16
+ .vp-doc .shiki-themes {
17
+ padding: 10px 0 !important;
18
+ }
19
+
20
+ .vp-doc img {
21
+ margin: 0 !important;
22
+ }
23
+
24
+ .vp-doc {
25
+ color: var(--vp-c-text-1);
26
+ }
27
+
28
+ /* demo 代码展示区:复用 VitePress 代码块,隐藏多余 UI */
29
+ .aui-demo-code .language-tsx {
30
+ margin: 0;
31
+ }
32
+
33
+ .aui-demo-code .copy,
34
+ .aui-demo-code .lang {
35
+ display: none !important;
36
+ }
37
+
38
+ .aui-demo-code pre.shiki {
39
+ margin: 0;
40
+ padding: 20px 24px;
41
+ font-size: 13px;
42
+ line-height: 1.7;
43
+ border-radius: 0;
44
+ }
45
+
46
+ /** 自定义样式 */
47
+ h3 {
48
+ margin-bottom: 16px !important;
49
+ }
50
+
51
+ table {
52
+ display: table !important;
53
+ margin: 0 !important;
54
+ }
55
+
56
+ a {
57
+ text-decoration: none !important;
58
+ }
59
+
60
+ .vp-doc li+li {
61
+ margin-top: 0 !important;
62
+ }
63
+
64
+ .vp-doc th,
65
+ .vp-doc td {
66
+ border: none;
67
+ }
68
+
69
+ .vp-doc ul,
70
+ .vp-doc ol {
71
+ padding-left: 0 !important;
72
+ margin: 0 !important;
73
+ }
74
+
75
+ .vp-doc blockquote {
76
+ border-left: 2px solid var(--primary-color);
77
+ padding-left: 10px;
78
+ color: var(--vp-c-text-1) !important;
79
+ }
80
+
81
+ #api+table {
82
+ width: 100%;
83
+ }
84
+
85
+ blockquote+table {
86
+ width: 100%;
87
+ }
88
+
89
+ p.text {
90
+ margin-bottom: 1em;
91
+ }
92
+
93
+ h2.text {
94
+ margin-top: 20px;
95
+ margin-bottom: 0.5em;
96
+ }
97
+
98
+ .VPDoc.has-aside .content-container {
99
+ max-width: 940px;
100
+ }
101
+
102
+ .VPDoc .content {
103
+ min-width: 940px;
104
+ padding: 0;
105
+ }
106
+
107
+ .VPDoc .content .content-container {
108
+ max-width: 100% !important;
109
+ }
110
+
111
+ .VPDoc .prev-next {
112
+ padding-bottom: 40px !important;
113
+ }
114
+
115
+ .VPDocAside .content {
116
+ padding-left: 10px;
117
+ }
118
+
119
+ .VPHomeHero .text {
120
+ margin-top: 12px !important;
121
+ color: var(--vp-c-text-1);
122
+ }
123
+
124
+ #VPContent.has-sidebar {
125
+ padding-right: 0;
126
+ padding-left: 260px;
127
+ }
128
+
129
+ .VPSidebar {
130
+ padding-left: 60px !important;
131
+ width: 280px !important;
132
+ }
133
+
134
+ .VPNavBar.has-sidebar .container>.title {
135
+ padding-left: 60px !important;
136
+ width: 280px !important;
137
+ }
138
+
139
+ .VPNavBar.has-sidebar .content {
140
+ padding-left: 280px !important;
141
+ }
142
+
143
+ .VPNavBar.has-sidebar .divider {
144
+ padding-left: 300px !important;
145
+ }
146
+
147
+ .content-container {
148
+ margin-left: 30px !important;
149
+ }
150
+
151
+ .custom-block {
152
+ padding: 12px 30px !important;
153
+ }
154
+
155
+ .custom-block-title {
156
+ display: none;
157
+ }
158
+
159
+ .VPHomeHero .image-bg {
160
+ background-image: linear-gradient(-45deg, #646cffcc 50%, #ffd14785 50%);
161
+ filter: blur(68px);
162
+ }
163
+
164
+ .vp-doc tr:nth-child(2n) {
165
+ background-color: transparent;
166
+ }
167
+
168
+ .vp-doc h2 {
169
+ border-top: none;
170
+ margin: 10px;
171
+ }
172
+
173
+ h2.text {
174
+ margin-top: 0;
175
+ }
176
+
177
+ :root {
178
+ --soui-font-14: 12px;
179
+ --soui-tabs-tab-font-size: 12px;
180
+ --soui-14-regular: 12px;
181
+ --vp-c-brand-1: var(--soui-brand-6, #197afa);
182
+ --vp-c-brand-2: var(--soui-brand-6, #197afa);
183
+ --vp-button-brand-bg: var(--soui-brand-6, #197afa);
184
+ }
185
+
186
+ .VPNavBar.has-sidebar .content {
187
+ padding-right: 40px !important;
188
+ }
189
+
190
+ h2 {
191
+ margin-left: 0 !important;
192
+ }