@agentscope-ai/design 1.0.19-beta.1765957449539 → 1.0.19

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 (61) hide show
  1. package/lib/antd/themes/generateTheme.js +29 -30
  2. package/lib/components/commonComponents/CodeBlock/index.js +12 -21
  3. package/package.json +2 -4
  4. package/llms/all.llms.txt +0 -4976
  5. package/llms/components/commonComponents/Alert/index.zh-CN.llms.txt +0 -32
  6. package/llms/components/commonComponents/AlertDialog/index.zh-CN.llms.txt +0 -171
  7. package/llms/components/commonComponents/Anchor/index.zh-CN.llms.txt +0 -51
  8. package/llms/components/commonComponents/Audio/index.zh-CN.llms.txt +0 -7
  9. package/llms/components/commonComponents/Avatar/index.zh-CN.llms.txt +0 -37
  10. package/llms/components/commonComponents/Breadcrumb/index.zh-CN.llms.txt +0 -117
  11. package/llms/components/commonComponents/Button/index.zh-CN.llms.txt +0 -54
  12. package/llms/components/commonComponents/Card/index.zh-CN.llms.txt +0 -61
  13. package/llms/components/commonComponents/Checkbox/index.zh-CN.llms.txt +0 -69
  14. package/llms/components/commonComponents/CodeBlock/index.zh-CN.llms.txt +0 -13
  15. package/llms/components/commonComponents/Collapse/index.zh-CN.llms.txt +0 -56
  16. package/llms/components/commonComponents/CollapsePanel/index.zh-CN.llms.txt +0 -69
  17. package/llms/components/commonComponents/DatePicker/index.zh-CN.llms.txt +0 -221
  18. package/llms/components/commonComponents/Descriptions/index.zh-CN.llms.txt +0 -37
  19. package/llms/components/commonComponents/Drawer/index.zh-CN.llms.txt +0 -62
  20. package/llms/components/commonComponents/Dropdown/index.zh-CN.llms.txt +0 -149
  21. package/llms/components/commonComponents/Empty/index.zh-CN.llms.txt +0 -41
  22. package/llms/components/commonComponents/FloatButton/index.zh-CN.llms.txt +0 -51
  23. package/llms/components/commonComponents/Form/index.zh-CN.llms.txt +0 -558
  24. package/llms/components/commonComponents/IconButton/index.zh-CN.llms.txt +0 -45
  25. package/llms/components/commonComponents/Image/index.zh-CN.llms.txt +0 -165
  26. package/llms/components/commonComponents/Input/index.zh-CN.llms.txt +0 -133
  27. package/llms/components/commonComponents/InputNumber/index.zh-CN.llms.txt +0 -51
  28. package/llms/components/commonComponents/Message/index.zh-CN.llms.txt +0 -98
  29. package/llms/components/commonComponents/Modal/index.zh-CN.llms.txt +0 -168
  30. package/llms/components/commonComponents/Notification/index.zh-CN.llms.txt +0 -94
  31. package/llms/components/commonComponents/Pagination/index.zh-CN.llms.txt +0 -45
  32. package/llms/components/commonComponents/Popconfirm/index.zh-CN.llms.txt +0 -55
  33. package/llms/components/commonComponents/Popover/index.zh-CN.llms.txt +0 -43
  34. package/llms/components/commonComponents/Progress/index.zh-CN.llms.txt +0 -50
  35. package/llms/components/commonComponents/PromptsEditor/index.zh-CN.llms.txt +0 -15
  36. package/llms/components/commonComponents/Radio/index.zh-CN.llms.txt +0 -66
  37. package/llms/components/commonComponents/RadioButton/index.zh-CN.llms.txt +0 -73
  38. package/llms/components/commonComponents/Result/index.zh-CN.llms.txt +0 -10
  39. package/llms/components/commonComponents/Select/index.zh-CN.llms.txt +0 -96
  40. package/llms/components/commonComponents/Skeleton/index.zh-CN.llms.txt +0 -59
  41. package/llms/components/commonComponents/Slider/index.zh-CN.llms.txt +0 -62
  42. package/llms/components/commonComponents/Spinner/index.zh-CN.llms.txt +0 -15
  43. package/llms/components/commonComponents/Statistic/index.zh-CN.llms.txt +0 -58
  44. package/llms/components/commonComponents/Steps/index.zh-CN.llms.txt +0 -57
  45. package/llms/components/commonComponents/Switch/index.zh-CN.llms.txt +0 -39
  46. package/llms/components/commonComponents/Table/index.zh-CN.llms.txt +0 -254
  47. package/llms/components/commonComponents/Tabs/index.zh-CN.llms.txt +0 -68
  48. package/llms/components/commonComponents/Tag/index.zh-CN.llms.txt +0 -33
  49. package/llms/components/commonComponents/TimePicker/index.zh-CN.llms.txt +0 -111
  50. package/llms/components/commonComponents/Tooltip/index.zh-CN.llms.txt +0 -45
  51. package/llms/components/commonComponents/Upload/index.zh-CN.llms.txt +0 -95
  52. package/llms/components/commonComponents/Video/index.zh-CN.llms.txt +0 -11
  53. package/llms/docs/guide/fromAntd.zh-CN.llms.txt +0 -156
  54. package/llms/docs/guide/fromScratch.zh-CN.llms.txt +0 -83
  55. package/llms/docs/guide/iconfont.zh-CN.llms.txt +0 -69
  56. package/llms/docs/guide/overview.zh-CN.llms.txt +0 -51
  57. package/llms/docs/guide/sparkIcons.zh-CN.llms.txt +0 -25
  58. package/llms/docs/guide/theme.zh-CN.llms.txt +0 -61
  59. package/llms/docs/guide/tokens&variables.zh-CN.llms.txt +0 -433
  60. package/llms/docs/guide/vibe-coding.zh-CN.llms.txt +0 -29
  61. package/llms/index.llms.txt +0 -58
@@ -1,61 +0,0 @@
1
-
2
-
3
- ## 内置主题
4
-
5
- Alibaba Cloud Spark Design 提供四种内置主题:
6
-
7
- <div><span style="display: inline-block; width: 12px; height: 12px; background-color: #615CED;"></span> purpleTheme</div>
8
- <div><span style="display: inline-block; width: 12px; height: 12px; background-color: #5551CC;"></span> purpleDarkTheme(暗色模式)</div>
9
- <div><span style="display: inline-block; width: 12px; height: 12px; background-color: rgba(26, 26, 29, 1);"></span> carbonTheme</div>
10
- <div><span style="display: inline-block; width: 12px; height: 12px; background-color: #676767;"></span> carbonDarkTheme(暗色模式)</div>
11
-
12
- ### 示例用法
13
-
14
-
15
- ```tsx
16
- import { ConfigProvider, purpleTheme } from '@agentscope-ai/design';
17
-
18
- const App = () => {
19
- return <ConfigProvider {...purpleTheme}>Hello Spark Design!</ConfigProvider>;
20
- };
21
-
22
- export default App;
23
- ```
24
-
25
-
26
- ## 从 Antd token 生成您自己的主题
27
-
28
- 如果您已经有了 Antd 主题,仍然可以使用 generateThemeByToken 生成 spark 风格的主题
29
-
30
-
31
- ```tsx
32
- import { ConfigProvider, generateThemeByToken } from '@agentscope-ai/design';
33
- const yourToken = {
34
- borderRadiusXS: 2,
35
- borderRadiusSM: 4,
36
- borderRadius: 6,
37
- borderRadiusLG: 8,
38
- borderRadiusXL: 12,
39
- borderRadiusFull: 999,
40
- wireframe: false,
41
- colorPrimaryBg: '#F2F0FF',
42
- colorPrimaryBgHover: '#F2F0FF',
43
- colorPrimaryBorder: '#E2DEFF',
44
- colorPrimaryBorderHover: '#BCB5FF',
45
- // ... 您可以在下一个文档中找到完整版本的 tokens:Tokens 和 CSS 变量
46
- };
47
- const darkMode = false;
48
- const yourThemeWithSparkStyle = generateThemeByToken(yourToken, darkMode);
49
- const App = () => {
50
- return (
51
- <ConfigProvider {...yourThemeWithSparkStyle}>
52
- Hello Spark Design!
53
- </ConfigProvider>
54
- );
55
- };
56
-
57
- export default App;
58
- ```
59
-
60
-
61
- 您仍然可以修改生成的主题:`yourThemeWithSparkStyle`,但不建议这样做。我们建议您保持原始主题以获得 Spark Design 的最佳体验。
@@ -1,433 +0,0 @@
1
-
2
-
3
- # Tokens
4
-
5
- 除了来自 [antd](https://ant.design/theme-editor) 的固有 tokens 之外,Spark Design 在原有基础上扩展了更多变量。完整的 token 示例如下所示:
6
-
7
- <div><span style="display: inline-block; width: 12px; height: 12px; background-color: #615CED;"></span> purpleTheme</div>
8
-
9
- ```json
10
- {
11
- "borderRadiusXS": 2,
12
- "borderRadiusSM": 4,
13
- "borderRadius": 6,
14
- "borderRadiusLG": 8,
15
- "borderRadiusXL": 12,
16
- "borderRadiusFull": 999,
17
- "wireframe": false,
18
- "colorPrimaryBg": "rgba(97, 92, 237, 0.08)",
19
- "colorPrimaryBgHover": "#F2F0FF",
20
- "colorPrimaryBorder": "#E2DEFF",
21
- "colorPrimaryBorderHover": "#BCB5FF",
22
- "colorPrimaryHover": "#9189FA",
23
- "colorPrimary": "#615CED",
24
- "colorPrimaryActive": "#4444C7",
25
- "colorPrimaryTextHover": "#9189FA",
26
- "colorPrimaryText": "#615CED",
27
- "colorPrimaryTextActive": "#4444C7",
28
- "colorTextBase": "#26244c",
29
- "colorBgBase": "#FFFFFF",
30
- "colorText": "rgba(38, 36, 76, 0.88)",
31
- "colorTextSecondary": "rgba(38, 36, 76, 0.65)",
32
- "colorTextTertiary": "rgba(38, 36, 76, 0.45)",
33
- "colorTextQuaternary": "rgba(38, 36, 76, 0.25)",
34
- "colorBorder": "#cdd0dc",
35
- "colorBorderSecondary": "#e6e8ee",
36
- "colorFill": "#cdd0dc5c",
37
- "colorFillSecondary": "#cdd0dc33",
38
- "colorFillTertiary": "#cdd0dc26",
39
- "colorFillQuaternary": "#cdd0dc1a",
40
- "colorBgContainer": "#FFFFFF",
41
- "colorBgElevated": "#FFFFFF",
42
- "colorBgLayout": "#f9fafd",
43
- "colorBgSpotlight": "rgba(38, 36, 76, 0.85)",
44
- "colorBgMask": "rgba(20, 19, 39, 0.45)",
45
- "colorInfo": "#0B83F1",
46
- "colorInfoHover": "#5EBCFF",
47
- "colorInfoBorder": "#87D1FF",
48
- "colorInfoText": "#0B83F1",
49
- "colorInfoBg": "#E6F7FF",
50
- "colorInfoBgHover": "#B0E3FF",
51
- "colorInfoBorderHover": "#5EBCFF",
52
- "colorSuccess": "#5BB98B",
53
- "colorSuccessHover": "#ABD4BE",
54
- "colorSuccessBg": "#EBFAF0",
55
- "colorSuccessBgHover": "#DFEDE4",
56
- "colorSuccessBorder": "#D3E0D9",
57
- "colorSuccessBorderHover": "#ABD4BE",
58
- "colorWarning": "#FAAD14",
59
- "colorWarningHover": "#FFD666",
60
- "colorWarningBg": "#FFFBE6",
61
- "colorWarningBgHover": "#FFF1B8",
62
- "colorWarningBorder": "#FFE58F",
63
- "colorWarningBorderHover": "#FFD666",
64
- "colorError": "#FF4D4F",
65
- "colorErrorHover": "#FF7875",
66
- "colorErrorBg": "#FFF2F0",
67
- "colorErrorBgHover": "#FFF1F0",
68
- "colorErrorBorder": "#FFCCC7",
69
- "colorErrorBorderHover": "#FFA39E",
70
- "colorLink": "#615CED",
71
- "boxShadow": "0px 4px 6px 0px rgba(0, 0, 0, 0.08)",
72
- "boxShadowSecondary": "0px 12px 24px -16px rgba(0, 0, 0, 0.06),0px 8px 40px 0px rgba(0, 0, 0, 0.12),0px 0px 1px 0px rgba(0, 0, 0, 0.04)",
73
-
74
- "colorTextWhite": "#ffffff",
75
- "colorTextOnPrimary": "#ffffff",
76
- "colorFillDisable": "#DBDAE7",
77
- "colorPurple": "#615CED",
78
- "colorPurpleHover": "#8080FF",
79
- "colorPurpleBg": "rgba(226, 222, 255, 0.8)",
80
- "colorPink": "#EC4899",
81
- "colorPinkHover": "#E593BC",
82
- "colorPinkBg": "rgba(251, 220, 239, 0.8)",
83
- "colorYellow": "#EAB308",
84
- "colorYellowHover": "#F1D372",
85
- "colorYellowBg": "rgba(255, 250, 184, 0.8)",
86
- "colorOrange": "#FA8125",
87
- "colorOrangeHover": "#E88C45",
88
- "colorOrangeBg": "rgba(255, 232, 201, 0.8)",
89
- "colorTeal": "#14B8A6",
90
- "colorTealHover": "#5FB3A9",
91
- "colorTealBg": "rgba(200, 244, 233, 0.8)",
92
- "colorBlue": "#0090FF",
93
- "colorBlueHover": "#72BCF5",
94
- "colorBlueBg": "rgba(194, 229, 255, 0.8)",
95
- "colorMauve": "#8E8C99",
96
- "colorMauveHover": "#C0BFC8",
97
- "colorMauveBg": "rgba(239, 240, 243, 0.8)",
98
- "colorSlate": "#1E293B",
99
- "colorSlateHover": "#475569",
100
- "colorSlateBg": "#E2E8F0",
101
- "colorLavender": "#A77BFF",
102
- "colorLavenderHover": "#BB99FF",
103
- "colorLavenderBg": "rgba(226, 212, 255, 0.8)",
104
-
105
- "boxShadowTertiary": "0px 12px 32px -16px rgba(0, 0, 0, 0.24),0px 12px 60px 0px rgba(0, 0, 0, 0.12),0px 0px 1px 0px rgba(0, 0, 0, 0.04)",
106
- "boxShadowTertiaryLeft": "-12px 0px 32px -16px rgba(0, 0, 0, 0.24),-12px 0px 60px 0px rgba(0, 0, 0, 0.12),0px 0px 1px 0px rgba(0, 0, 0, 0.04)",
107
- "boxShadowInput": "0px 12px 24px -16px rgba(54, 54, 73, 0.04),0px 12px 40px 0px rgba(51, 51, 71, 0.08),0px 0px 1px 0px rgba(44, 44, 54, 0.02)"
108
- }
109
- ```
110
-
111
- <div><span style="display: inline-block; width: 12px; height: 12px; background-color: #5551CC;"></span> purpleDarkTheme(暗色模式)</div>
112
-
113
- ```json
114
- {
115
- "borderRadiusXS": 2,
116
- "borderRadiusSM": 4,
117
- "borderRadius": 6,
118
- "borderRadiusLG": 8,
119
- "borderRadiusXL": 12,
120
- "borderRadiusFull": 999,
121
- "wireframe": false,
122
- "colorPrimaryBg": "#202041",
123
- "colorPrimaryBgHover": "#202041",
124
- "colorPrimaryBorder": "#2B2A55",
125
- "colorPrimaryBorderHover": "#373476",
126
- "colorPrimaryHover": "#857DE3",
127
- "colorPrimary": "#5551CC",
128
- "colorPrimaryActive": "#4643A1",
129
- "colorPrimaryTextHover": "#857DE3",
130
- "colorPrimaryText": "#5551CC",
131
- "colorPrimaryTextActive": "#4643A1",
132
- "colorTextBase": "#E7E7ED",
133
- "colorBgBase": "#000000",
134
- "colorText": "rgba(231, 231, 237, 0.88)",
135
- "colorTextSecondary": "rgba(231, 231, 237, 0.65)",
136
- "colorTextTertiary": "rgba(231, 231, 237, 0.45)",
137
- "colorTextQuaternary": "rgba(231, 231, 237, 0.25)",
138
- "colorBorder": "rgba(71, 71, 97, 0.8)",
139
- "colorBorderSecondary": "rgba(56, 56, 76, 0.8)",
140
- "colorFill": "rgba(231, 231, 237, 0.18)",
141
- "colorFillSecondary": "rgba(231, 231, 237, 0.12)",
142
- "colorFillTertiary": "rgba(231, 231, 237, 0.08)",
143
- "colorFillQuaternary": "rgba(231, 231, 237, 0.04)",
144
- "colorBgContainer": "#0F0F14",
145
- "colorBgElevated": "#0F0F14",
146
- "colorBgLayout": "#0F0F14",
147
- "colorBgSpotlight": "rgba(71, 71, 97, 0.85)",
148
- "colorBgMask": "rgba(5, 5, 8, 0.8)",
149
- "colorInfo": "#0B83F1",
150
- "colorInfoHover": "rgba(42, 114, 165, 1)",
151
- "colorInfoBorder": "rgba(135, 209, 255, 0.2)",
152
- "colorInfoText": "#0B83F1",
153
- "colorInfoBg": "rgba(27, 73, 115, 0.25)",
154
- "colorInfoBgHover": "rgba(27, 73, 115, 0.32)",
155
- "colorInfoBorderHover": "rgba(94, 188, 255, 0.2)",
156
- "colorSuccess": "#5BB98B",
157
- "colorSuccessHover": "rgba(87, 141, 112, 1)",
158
- "colorSuccessBg": "rgba(0, 50, 26, 0.25)",
159
- "colorSuccessBgHover": "rgba(0, 50, 26, 0.32)",
160
- "colorSuccessBorder": "rgba(211, 224, 217, 0.2)",
161
- "colorSuccessBorderHover": "rgba(171, 212, 190, 0.2)",
162
- "colorWarning": "#FAAD14",
163
- "colorWarningHover": "rgba(170, 136, 43, 1)",
164
- "colorWarningBg": "rgba(129, 116, 49, 0.25)",
165
- "colorWarningBgHover": "rgba(129, 116, 49, 0.32)",
166
- "colorWarningBorder": "rgba(255, 229, 143, 0.2)",
167
- "colorWarningBorderHover": "rgba(255, 214, 102, 0.2)",
168
- "colorError": "#FF4D4F",
169
- "colorErrorHover": "rgba(165, 50, 48, 1)",
170
- "colorErrorBg": "rgba(129, 46, 46, 0.25)",
171
- "colorErrorBgHover": "rgba(129, 46, 46, 0.32)",
172
- "colorErrorBorder": "rgba(255, 204, 199, 0.2)",
173
- "colorErrorBorderHover": "rgba(255, 163, 158, 0.2)",
174
- "colorLink": "#5551CC",
175
- "boxShadow": "0px 4px 6px 0px rgba(255, 255, 255, 0.08)",
176
- "boxShadowSecondary": "0px 12px 24px -16px rgba(255, 255, 255, 0.04),0px 8px 40px 0px rgba(255, 255, 255, 0.06),0px 0px 1px 0px rgba(255, 255, 255, 0.02)",
177
-
178
- "colorTextWhite": "#fff",
179
- "colorTextOnPrimary": "#fff",
180
- "colorFillDisable": "#8D8C98",
181
- "colorPurple": "#5551CC",
182
- "colorPurpleHover": "#8383F0",
183
- "colorPurpleBg": "rgba(226, 222, 255, 0.2)",
184
- "colorPink": "#EC4899",
185
- "colorPinkHover": "#E494BC",
186
- "colorPinkBg": "rgba(251, 220, 239, 0.2)",
187
- "colorYellow": "#EAB308",
188
- "colorYellowHover": "#DBBE62",
189
- "colorYellowBg": "rgba(255, 250, 184, 0.2)",
190
- "colorOrange": "#FA8125",
191
- "colorOrangeHover": "#F7A25F",
192
- "colorOrangeBg": "rgba(255, 232, 201, 0.2)",
193
- "colorTeal": "#14B8A6",
194
- "colorTealHover": "#7BC7BE",
195
- "colorTealBg": "rgba(200, 244, 233, 0.2)",
196
- "colorBlue": "#0090FF",
197
- "colorBlueHover": "#83BFED",
198
- "colorBlueBg": "rgba(194, 229, 255, 0.2)",
199
- "colorMauve": "#8E8C99",
200
- "colorMauveHover": "#BBB8CA",
201
- "colorMauveBg": "rgba(239, 240, 243, 0.2)",
202
- "colorSlate": "#2C3A50",
203
- "colorSlateHover": "#354252",
204
- "colorSlateBg": "#232B36",
205
- "colorLavender": "#A77BFF",
206
- "colorLavenderHover": "#BFA5F3",
207
- "colorLavenderBg": "rgba(150, 143, 167, 0.48)",
208
-
209
- "boxShadowTertiary": "0px 12px 32px -16px rgba(255, 255, 255, 0.16),0px 12px 60px 0px rgba(255, 255, 255, 0.08),0px 0px 1px 0px rgba(255, 255, 255, 0.02)",
210
- "boxShadowTertiaryLeft": "-12px 0px 32px -16px rgba(255, 255, 255, 0.16),-12px 0px 60px 0px rgba(255, 255, 255, 0.08),0px 0px 1px 0px rgba(255, 255, 255, 0.02);",
211
- "boxShadowInput": "0px 12px 24px -16px rgba(255, 255, 255, 0.08),0px 12px 40px 0px rgba(255, 255, 255, 0.16),0px 0px 1px 0px rgba(255, 255, 255, 0.04)"
212
- }
213
-
214
- ```
215
-
216
- <div><span style="display: inline-block; width: 12px; height: 12px; background-color: rgba(26, 26, 29, 1);"></span> carbonTheme</div>
217
-
218
- ```json
219
- {
220
- "borderRadiusXS": 2,
221
- "borderRadiusSM": 4,
222
- "borderRadius": 6,
223
- "borderRadiusLG": 8,
224
- "borderRadiusXL": 12,
225
- "borderRadiusFull": 999,
226
- "wireframe": false,
227
- "colorPrimaryBg": "rgba(244, 244, 247, 1)",
228
- "colorPrimaryBgHover": "rgba(239, 239, 244, 1)",
229
- "colorPrimaryBorder": "rgba(62, 63, 66, 1)",
230
- "colorPrimaryBorderHover": "rgba(130, 132, 137, 1)",
231
- "colorPrimaryHover": "rgba(38, 38, 41, 1)",
232
- "colorPrimary": "rgba(26, 26, 29, 1)",
233
- "colorPrimaryActive": "rgba(0, 0, 0, 1)",
234
- "colorPrimaryTextHover": "rgba(38, 38, 41, 1)",
235
- "colorPrimaryText": "rgba(26, 26, 29, 1)",
236
- "colorPrimaryTextActive": "rgba(0, 0, 0, 1)",
237
- "colorTextBase": "rgba(26, 26, 29, 1)",
238
- "colorBgBase": "rgba(255, 255, 255, 1)",
239
- "colorText": "rgba(26, 26, 29, 0.88)",
240
- "colorTextSecondary": "rgba(26, 26, 29, 0.65)",
241
- "colorTextTertiary": "rgba(26, 26, 29, 0.45)",
242
- "colorTextQuaternary": "rgba(26, 26, 29, 0.25)",
243
- "colorBorder": "rgba(187, 187, 193, 1)",
244
- "colorBorderSecondary": "rgba(234, 234, 234, 1)",
245
- "colorFill": "rgba(0, 0, 43, 0.06)",
246
- "colorFillSecondary": "rgba(0, 0, 85, 0.03)",
247
- "colorFillTertiary": "rgba(205, 208, 220, 0.15)",
248
- "colorFillQuaternary": "rgba(205, 208, 220, 0.1)",
249
- "colorBgContainer": "rgba(255, 255, 255, 1)",
250
- "colorBgElevated": "rgba(255, 255, 255, 1)",
251
- "colorBgLayout": "rgba(250, 250, 251, 1)",
252
- "colorBgSpotlight": "rgba(26, 26, 29, 0.85)",
253
- "colorBgMask": "rgba(0, 0, 0, 0.45)",
254
- "colorInfo": "rgba(11, 131, 241, 1)",
255
- "colorInfoHover": "rgba(94, 188, 255, 1)",
256
- "colorInfoBorder": "rgba(135, 209, 255, 1)",
257
- "colorInfoText": "rgba(11, 131, 241, 1)",
258
- "colorInfoBg": "rgba(230, 247, 255, 1)",
259
- "colorInfoBgHover": "rgba(176, 227, 255, 1)",
260
- "colorInfoBorderHover": "rgba(94, 188, 255, 1)",
261
- "colorSuccess": "rgba(91, 185, 139, 1)",
262
- "colorSuccessHover": "rgba(171, 212, 190, 1)",
263
- "colorSuccessBg": "rgba(235, 250, 240, 1)",
264
- "colorSuccessBgHover": "rgba(223, 237, 228, 1)",
265
- "colorSuccessBorder": "rgba(211, 224, 217, 1)",
266
- "colorSuccessBorderHover": "rgba(171, 212, 190, 1)",
267
- "colorWarning": "rgba(250, 173, 20, 1)",
268
- "colorWarningHover": "rgba(255, 214, 102, 1)",
269
- "colorWarningBg": "rgba(255, 251, 230, 1)",
270
- "colorWarningBgHover": "rgba(255, 241, 184, 1)",
271
- "colorWarningBorder": "rgba(255, 229, 143, 1)",
272
- "colorWarningBorderHover": "rgba(255, 214, 102, 1)",
273
- "colorError": "rgba(255, 77, 79, 1)",
274
- "colorErrorHover": "rgba(255, 120, 117, 1)",
275
- "colorErrorBg": "rgba(255, 242, 240, 1)",
276
- "colorErrorBgHover": "rgba(255, 241, 240, 1)",
277
- "colorErrorBorder": "rgba(255, 204, 199, 1)",
278
- "colorErrorBorderHover": "rgba(255, 163, 158, 1)",
279
- "colorLink": "rgba(0, 77, 255, 1)",
280
- "boxShadow": "0px 4px 6px 0px rgba(0, 0, 0, 0.08)",
281
- "boxShadowSecondary": "0px 12px 24px -16px rgba(0, 0, 0, 0.06),0px 8px 40px 0px rgba(0, 0, 0, 0.12),0px 0px 1px 0px rgba(0, 0, 0, 0.04)",
282
-
283
- "colorTextWhite": "#ffffff",
284
- "colorTextOnPrimary": "#ffffff",
285
- "colorFillDisable": "rgba(232, 232, 235, 1)",
286
- "colorPurple": "rgba(97, 92, 237, 1)",
287
- "colorPurpleHover": "#8080FF",
288
- "colorPurpleBg": "rgba(226, 222, 255, 0.8)",
289
- "colorPink": "rgba(236, 72, 153, 1)",
290
- "colorPinkHover": "#E593BC",
291
- "colorPinkBg": "rgba(251, 220, 239, 0.8)",
292
- "colorYellow": "rgba(234, 179, 8, 1)",
293
- "colorYellowHover": "#F1D372",
294
- "colorYellowBg": "rgba(255, 250, 184, 0.8)",
295
- "colorOrange": "rgba(250, 129, 37, 1)",
296
- "colorOrangeHover": "#E88C45",
297
- "colorOrangeBg": "rgba(255, 232, 201, 0.8)",
298
- "colorTeal": "rgba(20, 184, 166, 1)",
299
- "colorTealHover": "#5FB3A9",
300
- "colorTealBg": "rgba(200, 244, 233, 0.8)",
301
- "colorBlue": "rgba(0, 144, 255, 1)",
302
- "colorBlueHover": "#72BCF5",
303
- "colorBlueBg": "rgba(194, 229, 255, 0.8)",
304
- "colorMauve": "rgba(142, 140, 153, 1)",
305
- "colorMauveHover": "#C0BFC8",
306
- "colorMauveBg": "rgba(239, 240, 243, 0.8)",
307
- "colorSlate": "#2C3A50",
308
- "colorSlateHover": "#354252",
309
- "colorSlateBg": "#232B36",
310
- "boxShadowTertiary": "0px 12px 32px -16px rgba(0, 0, 0, 0.24),0px 12px 60px 0px rgba(0, 0, 0, 0.12),0px 0px 1px 0px rgba(0, 0, 0, 0.04)",
311
- "boxShadowTertiaryLeft": "-12px 0px 32px -16px rgba(0, 0, 0, 0.24),-12px 0px 60px 0px rgba(0, 0, 0, 0.12),0px 0px 1px 0px rgba(0, 0, 0, 0.04)",
312
- "boxShadowInput": "0px 12px 24px -16px rgba(54, 54, 73, 0.04),0px 12px 40px 0px rgba(51, 51, 71, 0.08),0px 0px 1px 0px rgba(44, 44, 54, 0.02)"
313
- }
314
-
315
- ```
316
-
317
- <div><span style="display: inline-block; width: 12px; height: 12px; background-color: rgba(26, 26, 29, 1);"></span> carbonDarkTheme</div>
318
-
319
- ```json
320
- {
321
- "borderRadiusXS": 2,
322
- "borderRadiusSM": 4,
323
- "borderRadius": 6,
324
- "borderRadiusLG": 8,
325
- "borderRadiusXL": 12,
326
- "borderRadiusFull": 999,
327
- "wireframe": false,
328
- "colorPrimaryBg": "#181818",
329
- "colorPrimaryBgHover": "#2E2E2E",
330
- "colorPrimaryBorder": "#323232",
331
- "colorPrimaryBorderHover": "#2C2C2C",
332
- "colorPrimaryHover": "#DFDFDF",
333
- "colorPrimary": "#E4E4E4",
334
- "colorPrimaryActive": "#7E7E7E",
335
- "colorPrimaryTextHover": "#909090",
336
- "colorPrimaryText": "#676767",
337
- "colorPrimaryTextActive": "#959595",
338
- "colorTextBase": "#E7E7ED",
339
- "colorBgBase": "#0A0A0B",
340
- "colorText": "#E7E7EDC7",
341
- "colorTextSecondary": "#E7E7EDA6",
342
- "colorTextTertiary": "#E7E7ED73",
343
- "colorTextQuaternary": "#E7E7ED40",
344
- "colorBorder": "#5B5B5BCC",
345
- "colorBorderSecondary": "#323232CC",
346
- "colorFill": "#E7E7ED2E",
347
- "colorFillSecondary": "#E7E7ED1F",
348
- "colorFillTertiary": "#E7E7ED14",
349
- "colorFillQuaternary": "#E7E7ED0A",
350
- "colorBgContainer": "#121212",
351
- "colorBgElevated": "#212121",
352
- "colorBgLayout": "#141414",
353
- "colorBgSpotlight": "#525252D9",
354
- "colorBgMask": "#050508CC",
355
- "colorInfo": "#0B83F1",
356
- "colorInfoHover": "#5EBCFF",
357
- "colorInfoBorder": "#3990C9",
358
- "colorInfoText": "#0B83F1",
359
- "colorInfoBg": "#112233",
360
- "colorInfoBgHover": "#264866",
361
- "colorInfoBorderHover": "#5EBCFF",
362
- "colorSuccess": "#5BB98B",
363
- "colorSuccessHover": "#74A47C",
364
- "colorSuccessBg": "#293631",
365
- "colorSuccessBgHover": "#3F5147",
366
- "colorSuccessBorder": "#73A377",
367
- "colorSuccessBorderHover": "#ABD4BE",
368
- "colorWarning": "#FAAD14",
369
- "colorWarningHover": "#FF8C28",
370
- "colorWarningBg": "#2D231A",
371
- "colorWarningBgHover": "#4D3B23",
372
- "colorWarningBorder": "#FFA628",
373
- "colorWarningBorderHover": "#FFD666",
374
- "colorError": "#FF4D4F",
375
- "colorErrorHover": "#EE654E",
376
- "colorErrorBg": "#2B0B08",
377
- "colorErrorBgHover": "#4A2A28",
378
- "colorErrorBorder": "#EE5B4E",
379
- "colorErrorBorderHover": "#FFA39E",
380
- "colorLink": "#4D7DFF",
381
- "boxShadow": "0px 4px 6px 0px rgba(255, 255, 255, 0.08)",
382
- "boxShadowSecondary": "0px 12px 24px -16px rgba(255, 255, 255, 0.06),0px 8px 40px 0px rgba(255, 255, 255, 0.12),0px 0px 1px 0px rgba(255, 255, 255, 0.04)",
383
-
384
- "colorTextWhite": "#ffffff",
385
- "colorTextOnPrimary": "#000000",
386
- "colorFillDisable": "#898989",
387
- "colorPurple": "#615CED",
388
- "colorPurpleHover": "#8383F0",
389
- "colorPurpleBg": "#6964877A",
390
- "colorPink": "#EC4899",
391
- "colorPinkHover": "#E494BC",
392
- "colorPinkBg": "#53424D7A",
393
- "colorYellow": "#EAB308",
394
- "colorYellowHover": "#DBBE62",
395
- "colorYellowBg": "#9585527A",
396
- "colorOrange": "#FA8125",
397
- "colorOrangeHover": "#F7A25F",
398
- "colorOrangeBg": "#6F58417A",
399
- "colorTeal": "#14B8A6",
400
- "colorTealHover": "#7BC7BE",
401
- "colorTealBg": "#4658547A",
402
- "colorBlue": "#0090FF",
403
- "colorBlueHover": "#83BFED",
404
- "colorBlueBg": "#5E76897A",
405
- "colorMauve": "#8E8C99",
406
- "colorMauveHover": "#BBB8CA",
407
- "colorMauveBg": "#5859647A",
408
- "colorSlate": "#2C3A50",
409
- "colorSlateHover": "#354252",
410
- "colorSlateBg": "#232B36",
411
- "colorLavender": "#A77BFF",
412
- "colorLavenderHover": "#BFA5F3",
413
- "colorLavenderBg": "rgba(150, 143, 167, 0.48)",
414
-
415
- "boxShadowTertiary": "0px 12px 32px -16px rgba(255, 255, 255, 0.24),0px 12px 60px 0px rgba(255, 255, 255, 0.12),0px 0px 1px 0px rgba(255, 255, 255, 0.04)",
416
- "boxShadowTertiaryLeft": "-12px 0px 32px -16px rgba(255, 255, 255, 0.24),-12px 0px 60px 0px rgba(255, 255, 255, 0.12),0px 0px 1px 0px rgba(255, 255, 255, 0.04)",
417
- "boxShadowInput": "0px 12px 24px -16px rgba(255, 255, 255, 0.08),0px 12px 40px 0px rgba(255, 255, 255, 0.16),0px 0px 1px 0px rgba(255, 255, 255, 0.04)",
418
- "colorTextBlack": "#000000"
419
- }
420
- ```
421
-
422
- # CSS 变量
423
-
424
- Spark Design 默认启用 cssVar 模式,因此您可以利用 从 token 派生出的 CSS 变量来构建自己的样式。
425
-
426
-
427
- ```less
428
- .example {
429
- background: var(--sps-color-bg-base);
430
- color: var(--sps-color-pink);
431
- }
432
- // 提示:您可以将 'sps' 替换为您自己的前缀
433
- ```
@@ -1,29 +0,0 @@
1
-
2
-
3
- # Vibe 编程
4
-
5
- ## LLMs.txt
6
-
7
- 为了让 Cursor 和 Claude Code 等工具理解 Spark Design,我们支持 LLMs.txt 文件,使 Spark Design 的文档可供大型语言模型使用。
8
-
9
-
10
- - [index.llms.txt](https://g.alicdn.com/code/npm/@ali/agentscope-ai-design/4.7.2/docs-dist/llms/index.llms.txt):主要的 LLMs.txt 索引文件
11
- - [all.llms.txt](https://g.alicdn.com/code/npm/@ali/agentscope-ai-design/4.7.2/docs-dist/llms/all.llms.txt):Spark Design 的完整文档
12
-
13
- 在 Cursor 中使用 @Docs 功能将 LLMs.txt 文件包含在您的项目中。[了解更多](https://docs.cursor.com/en/context/@-symbols/@-docs)
14
-
15
- ## D2C
16
-
17
- 在前端使用 Alibaba Cloud Spark Design、设计稿使用 Spark Design 套件的前提下,通过 masterGo 视觉稿生成代码可以做到以下几点:
18
-
19
-
20
- - 准确识别 icon
21
- - 使用标准 css token
22
- - 无需测量间距、圆角等数据,AI 直接还原布局(90%以上概率准确生成)
23
- - 使用标准组件还原页面,大部分标准组件可一次性正确生成,无需二次调整
24
-
25
- <div>
26
- <video style="width: 100%" controls src="https://cloud.video.taobao.com/vod/PrrYzvYJkoDlbJwoL8Ei1Bo_60LrKAROCojWxB_EAYs.mp4" />
27
- </div>
28
-
29
- 我们会在不久的将来开放 masterGo 的设计套件和 rules,帮助您高效率还原视觉稿
@@ -1,58 +0,0 @@
1
- # 索引
2
-
3
- - [](components/commonComponents/Upload/index.zh-CN.llms.txt)
4
- - [](components/commonComponents/Tooltip/index.zh-CN.llms.txt)
5
- - [](components/commonComponents/TimePicker/index.zh-CN.llms.txt)
6
- - [](components/commonComponents/Tag/index.zh-CN.llms.txt)
7
- - [](components/commonComponents/Video/index.zh-CN.llms.txt)
8
- - [](components/commonComponents/Tabs/index.zh-CN.llms.txt)
9
- - [](components/commonComponents/Table/index.zh-CN.llms.txt)
10
- - [](components/commonComponents/Switch/index.zh-CN.llms.txt)
11
- - [](components/commonComponents/Steps/index.zh-CN.llms.txt)
12
- - [](components/commonComponents/Statistic/index.zh-CN.llms.txt)
13
- - [](components/commonComponents/Spinner/index.zh-CN.llms.txt)
14
- - [](components/commonComponents/Slider/index.zh-CN.llms.txt)
15
- - [](components/commonComponents/Skeleton/index.zh-CN.llms.txt)
16
- - [](components/commonComponents/Select/index.zh-CN.llms.txt)
17
- - [](components/commonComponents/Result/index.zh-CN.llms.txt)
18
- - [](components/commonComponents/RadioButton/index.zh-CN.llms.txt)
19
- - [](components/commonComponents/Radio/index.zh-CN.llms.txt)
20
- - [](components/commonComponents/PromptsEditor/index.zh-CN.llms.txt)
21
- - [](components/commonComponents/Progress/index.zh-CN.llms.txt)
22
- - [](components/commonComponents/Popconfirm/index.zh-CN.llms.txt)
23
- - [](components/commonComponents/Popover/index.zh-CN.llms.txt)
24
- - [](components/commonComponents/Pagination/index.zh-CN.llms.txt)
25
- - [](components/commonComponents/Notification/index.zh-CN.llms.txt)
26
- - [](components/commonComponents/Modal/index.zh-CN.llms.txt)
27
- - [](components/commonComponents/Message/index.zh-CN.llms.txt)
28
- - [](components/commonComponents/InputNumber/index.zh-CN.llms.txt)
29
- - [](components/commonComponents/Input/index.zh-CN.llms.txt)
30
- - [](components/commonComponents/Image/index.zh-CN.llms.txt)
31
- - [](components/commonComponents/IconButton/index.zh-CN.llms.txt)
32
- - [](components/commonComponents/Form/index.zh-CN.llms.txt)
33
- - [](components/commonComponents/FloatButton/index.zh-CN.llms.txt)
34
- - [](components/commonComponents/Empty/index.zh-CN.llms.txt)
35
- - [](components/commonComponents/Dropdown/index.zh-CN.llms.txt)
36
- - [](components/commonComponents/Drawer/index.zh-CN.llms.txt)
37
- - [](components/commonComponents/Descriptions/index.zh-CN.llms.txt)
38
- - [](components/commonComponents/CollapsePanel/index.zh-CN.llms.txt)
39
- - [](components/commonComponents/DatePicker/index.zh-CN.llms.txt)
40
- - [](components/commonComponents/Collapse/index.zh-CN.llms.txt)
41
- - [](components/commonComponents/CodeBlock/index.zh-CN.llms.txt)
42
- - [](components/commonComponents/Card/index.zh-CN.llms.txt)
43
- - [](components/commonComponents/Button/index.zh-CN.llms.txt)
44
- - [](components/commonComponents/Checkbox/index.zh-CN.llms.txt)
45
- - [](components/commonComponents/Avatar/index.zh-CN.llms.txt)
46
- - [](components/commonComponents/Breadcrumb/index.zh-CN.llms.txt)
47
- - [](components/commonComponents/Audio/index.zh-CN.llms.txt)
48
- - [](components/commonComponents/Anchor/index.zh-CN.llms.txt)
49
- - [](components/commonComponents/AlertDialog/index.zh-CN.llms.txt)
50
- - [](components/commonComponents/Alert/index.zh-CN.llms.txt)
51
- - [](docs/guide/theme.zh-CN.llms.txt)
52
- - [概述](docs/guide/overview.zh-CN.llms.txt)
53
- - [使用](docs/guide/sparkIcons.zh-CN.llms.txt)
54
- - [从 Antd 迁移](docs/guide/fromAntd.zh-CN.llms.txt)
55
- - [使用](docs/guide/iconfont.zh-CN.llms.txt)
56
- - [Vibe 编程](docs/guide/vibe-coding.zh-CN.llms.txt)
57
- - [从零开始使用](docs/guide/fromScratch.zh-CN.llms.txt)
58
- - [Tokens](docs/guide/tokens&variables.zh-CN.llms.txt)