@agentscope-ai/design 1.0.19 → 1.0.20

package/llms/docs/guide/theme.zh-CN.llms.txt

@@ -0,0 +1,61 @@
+
+
+## 内置主题
+
+Alibaba Cloud Spark Design 提供四种内置主题：
+
+<div><span style="display: inline-block; width: 12px; height: 12px; background-color: #615CED;"></span> purpleTheme</div>
+<div><span style="display: inline-block; width: 12px; height: 12px; background-color: #5551CC;"></span> purpleDarkTheme（暗色模式）</div>
+<div><span style="display: inline-block; width: 12px; height: 12px; background-color: rgba(26, 26, 29, 1);"></span> carbonTheme</div>
+<div><span style="display: inline-block; width: 12px; height: 12px; background-color: #676767;"></span> carbonDarkTheme（暗色模式）</div>
+
+### 示例用法
+
+
+```tsx
+import { ConfigProvider, purpleTheme } from '@agentscope-ai/design';
+
+const App = () => {
+  return <ConfigProvider {...purpleTheme}>Hello Spark Design!</ConfigProvider>;
+};
+
+export default App;
+```
+
+
+## 从 Antd token 生成您自己的主题
+
+如果您已经有了 Antd 主题，仍然可以使用 generateThemeByToken 生成 spark 风格的主题
+
+
+```tsx
+import { ConfigProvider, generateThemeByToken } from '@agentscope-ai/design';
+const yourToken = {
+  borderRadiusXS: 2,
+  borderRadiusSM: 4,
+  borderRadius: 6,
+  borderRadiusLG: 8,
+  borderRadiusXL: 12,
+  borderRadiusFull: 999,
+  wireframe: false,
+  colorPrimaryBg: '#F2F0FF',
+  colorPrimaryBgHover: '#F2F0FF',
+  colorPrimaryBorder: '#E2DEFF',
+  colorPrimaryBorderHover: '#BCB5FF',
+  // ... 您可以在下一个文档中找到完整版本的 tokens：Tokens 和 CSS 变量
+};
+const darkMode = false;
+const yourThemeWithSparkStyle = generateThemeByToken(yourToken, darkMode);
+const App = () => {
+  return (
+    <ConfigProvider {...yourThemeWithSparkStyle}>
+      Hello Spark Design!
+    </ConfigProvider>
+  );
+};
+
+export default App;
+```
+
+
+您仍然可以修改生成的主题：`yourThemeWithSparkStyle`，但不建议这样做。我们建议您保持原始主题以获得 Spark Design 的最佳体验。

package/llms/docs/guide/tokens&variables.zh-CN.llms.txt

@@ -0,0 +1,433 @@
+
+
+# Tokens
+
+除了来自 [antd](https://ant.design/theme-editor) 的固有 tokens 之外，Spark Design 在原有基础上扩展了更多变量。完整的 token 示例如下所示：
+
+<div><span style="display: inline-block; width: 12px; height: 12px; background-color: #615CED;"></span> purpleTheme</div>
+
+```json
+{
+  "borderRadiusXS": 2,
+  "borderRadiusSM": 4,
+  "borderRadius": 6,
+  "borderRadiusLG": 8,
+  "borderRadiusXL": 12,
+  "borderRadiusFull": 999,
+  "wireframe": false,
+  "colorPrimaryBg": "rgba(97, 92, 237, 0.08)",
+  "colorPrimaryBgHover": "#F2F0FF",
+  "colorPrimaryBorder": "#E2DEFF",
+  "colorPrimaryBorderHover": "#BCB5FF",
+  "colorPrimaryHover": "#9189FA",
+  "colorPrimary": "#615CED",
+  "colorPrimaryActive": "#4444C7",
+  "colorPrimaryTextHover": "#9189FA",
+  "colorPrimaryText": "#615CED",
+  "colorPrimaryTextActive": "#4444C7",
+  "colorTextBase": "#26244c",
+  "colorBgBase": "#FFFFFF",
+  "colorText": "rgba(38, 36, 76, 0.88)",
+  "colorTextSecondary": "rgba(38, 36, 76, 0.65)",
+  "colorTextTertiary": "rgba(38, 36, 76, 0.45)",
+  "colorTextQuaternary": "rgba(38, 36, 76, 0.25)",
+  "colorBorder": "#cdd0dc",
+  "colorBorderSecondary": "#e6e8ee",
+  "colorFill": "#cdd0dc5c",
+  "colorFillSecondary": "#cdd0dc33",
+  "colorFillTertiary": "#cdd0dc26",
+  "colorFillQuaternary": "#cdd0dc1a",
+  "colorBgContainer": "#FFFFFF",
+  "colorBgElevated": "#FFFFFF",
+  "colorBgLayout": "#f9fafd",
+  "colorBgSpotlight": "rgba(38, 36, 76, 0.85)",
+  "colorBgMask": "rgba(20, 19, 39, 0.45)",
+  "colorInfo": "#0B83F1",
+  "colorInfoHover": "#5EBCFF",
+  "colorInfoBorder": "#87D1FF",
+  "colorInfoText": "#0B83F1",
+  "colorInfoBg": "#E6F7FF",
+  "colorInfoBgHover": "#B0E3FF",
+  "colorInfoBorderHover": "#5EBCFF",
+  "colorSuccess": "#5BB98B",
+  "colorSuccessHover": "#ABD4BE",
+  "colorSuccessBg": "#EBFAF0",
+  "colorSuccessBgHover": "#DFEDE4",
+  "colorSuccessBorder": "#D3E0D9",
+  "colorSuccessBorderHover": "#ABD4BE",
+  "colorWarning": "#FAAD14",
+  "colorWarningHover": "#FFD666",
+  "colorWarningBg": "#FFFBE6",
+  "colorWarningBgHover": "#FFF1B8",
+  "colorWarningBorder": "#FFE58F",
+  "colorWarningBorderHover": "#FFD666",
+  "colorError": "#FF4D4F",
+  "colorErrorHover": "#FF7875",
+  "colorErrorBg": "#FFF2F0",
+  "colorErrorBgHover": "#FFF1F0",
+  "colorErrorBorder": "#FFCCC7",
+  "colorErrorBorderHover": "#FFA39E",
+  "colorLink": "#615CED",
+  "boxShadow": "0px 4px 6px 0px rgba(0, 0, 0, 0.08)",
+  "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)",
+
+  "colorTextWhite": "#ffffff",
+  "colorTextOnPrimary": "#ffffff",
+  "colorFillDisable": "#DBDAE7",
+  "colorPurple": "#615CED",
+  "colorPurpleHover": "#8080FF",
+  "colorPurpleBg": "rgba(226, 222, 255, 0.8)",
+  "colorPink": "#EC4899",
+  "colorPinkHover": "#E593BC",
+  "colorPinkBg": "rgba(251, 220, 239, 0.8)",
+  "colorYellow": "#EAB308",
+  "colorYellowHover": "#F1D372",
+  "colorYellowBg": "rgba(255, 250, 184, 0.8)",
+  "colorOrange": "#FA8125",
+  "colorOrangeHover": "#E88C45",
+  "colorOrangeBg": "rgba(255, 232, 201, 0.8)",
+  "colorTeal": "#14B8A6",
+  "colorTealHover": "#5FB3A9",
+  "colorTealBg": "rgba(200, 244, 233, 0.8)",
+  "colorBlue": "#0090FF",
+  "colorBlueHover": "#72BCF5",
+  "colorBlueBg": "rgba(194, 229, 255, 0.8)",
+  "colorMauve": "#8E8C99",
+  "colorMauveHover": "#C0BFC8",
+  "colorMauveBg": "rgba(239, 240, 243, 0.8)",
+  "colorSlate": "#1E293B",
+  "colorSlateHover": "#475569",
+  "colorSlateBg": "#E2E8F0",
+  "colorLavender": "#A77BFF",
+  "colorLavenderHover": "#BB99FF",
+  "colorLavenderBg": "rgba(226, 212, 255, 0.8)",
+
+  "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)",
+  "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)",
+  "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)"
+}
+```
+
+<div><span style="display: inline-block; width: 12px; height: 12px; background-color: #5551CC;"></span> purpleDarkTheme（暗色模式）</div>
+
+```json
+{
+  "borderRadiusXS": 2,
+  "borderRadiusSM": 4,
+  "borderRadius": 6,
+  "borderRadiusLG": 8,
+  "borderRadiusXL": 12,
+  "borderRadiusFull": 999,
+  "wireframe": false,
+  "colorPrimaryBg": "#202041",
+  "colorPrimaryBgHover": "#202041",
+  "colorPrimaryBorder": "#2B2A55",
+  "colorPrimaryBorderHover": "#373476",
+  "colorPrimaryHover": "#857DE3",
+  "colorPrimary": "#5551CC",
+  "colorPrimaryActive": "#4643A1",
+  "colorPrimaryTextHover": "#857DE3",
+  "colorPrimaryText": "#5551CC",
+  "colorPrimaryTextActive": "#4643A1",
+  "colorTextBase": "#E7E7ED",
+  "colorBgBase": "#000000",
+  "colorText": "rgba(231, 231, 237, 0.88)",
+  "colorTextSecondary": "rgba(231, 231, 237, 0.65)",
+  "colorTextTertiary": "rgba(231, 231, 237, 0.45)",
+  "colorTextQuaternary": "rgba(231, 231, 237, 0.25)",
+  "colorBorder": "rgba(71, 71, 97, 0.8)",
+  "colorBorderSecondary": "rgba(56, 56, 76, 0.8)",
+  "colorFill": "rgba(231, 231, 237, 0.18)",
+  "colorFillSecondary": "rgba(231, 231, 237, 0.12)",
+  "colorFillTertiary": "rgba(231, 231, 237, 0.08)",
+  "colorFillQuaternary": "rgba(231, 231, 237, 0.04)",
+  "colorBgContainer": "#0F0F14",
+  "colorBgElevated": "#0F0F14",
+  "colorBgLayout": "#0F0F14",
+  "colorBgSpotlight": "rgba(71, 71, 97, 0.85)",
+  "colorBgMask": "rgba(5, 5, 8, 0.8)",
+  "colorInfo": "#0B83F1",
+  "colorInfoHover": "rgba(42, 114, 165, 1)",
+  "colorInfoBorder": "rgba(135, 209, 255, 0.2)",
+  "colorInfoText": "#0B83F1",
+  "colorInfoBg": "rgba(27, 73, 115, 0.25)",
+  "colorInfoBgHover": "rgba(27, 73, 115, 0.32)",
+  "colorInfoBorderHover": "rgba(94, 188, 255, 0.2)",
+  "colorSuccess": "#5BB98B",
+  "colorSuccessHover": "rgba(87, 141, 112, 1)",
+  "colorSuccessBg": "rgba(0, 50, 26, 0.25)",
+  "colorSuccessBgHover": "rgba(0, 50, 26, 0.32)",
+  "colorSuccessBorder": "rgba(211, 224, 217, 0.2)",
+  "colorSuccessBorderHover": "rgba(171, 212, 190, 0.2)",
+  "colorWarning": "#FAAD14",
+  "colorWarningHover": "rgba(170, 136, 43, 1)",
+  "colorWarningBg": "rgba(129, 116, 49, 0.25)",
+  "colorWarningBgHover": "rgba(129, 116, 49, 0.32)",
+  "colorWarningBorder": "rgba(255, 229, 143, 0.2)",
+  "colorWarningBorderHover": "rgba(255, 214, 102, 0.2)",
+  "colorError": "#FF4D4F",
+  "colorErrorHover": "rgba(165, 50, 48, 1)",
+  "colorErrorBg": "rgba(129, 46, 46, 0.25)",
+  "colorErrorBgHover": "rgba(129, 46, 46, 0.32)",
+  "colorErrorBorder": "rgba(255, 204, 199, 0.2)",
+  "colorErrorBorderHover": "rgba(255, 163, 158, 0.2)",
+  "colorLink": "#5551CC",
+  "boxShadow": "0px 4px 6px 0px rgba(255, 255, 255, 0.08)",
+  "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)",
+
+ "colorTextWhite": "#fff",
+ "colorTextOnPrimary": "#fff",
+  "colorFillDisable": "#8D8C98",
+  "colorPurple": "#5551CC",
+  "colorPurpleHover": "#8383F0",
+  "colorPurpleBg": "rgba(226, 222, 255, 0.2)",
+  "colorPink": "#EC4899",
+  "colorPinkHover": "#E494BC",
+  "colorPinkBg": "rgba(251, 220, 239, 0.2)",
+  "colorYellow": "#EAB308",
+  "colorYellowHover": "#DBBE62",
+  "colorYellowBg": "rgba(255, 250, 184, 0.2)",
+  "colorOrange": "#FA8125",
+  "colorOrangeHover": "#F7A25F",
+  "colorOrangeBg": "rgba(255, 232, 201, 0.2)",
+  "colorTeal": "#14B8A6",
+  "colorTealHover": "#7BC7BE",
+  "colorTealBg": "rgba(200, 244, 233, 0.2)",
+  "colorBlue": "#0090FF",
+  "colorBlueHover": "#83BFED",
+  "colorBlueBg": "rgba(194, 229, 255, 0.2)",
+  "colorMauve": "#8E8C99",
+  "colorMauveHover": "#BBB8CA",
+  "colorMauveBg": "rgba(239, 240, 243, 0.2)",
+ "colorSlate": "#2C3A50",
+  "colorSlateHover": "#354252",
+  "colorSlateBg": "#232B36",
+  "colorLavender": "#A77BFF",
+  "colorLavenderHover": "#BFA5F3",
+  "colorLavenderBg": "rgba(150, 143, 167, 0.48)",
+
+  "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)",
+  "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);",
+  "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)"
+}
+
+```
+
+<div><span style="display: inline-block; width: 12px; height: 12px; background-color: rgba(26, 26, 29, 1);"></span> carbonTheme</div>
+
+```json
+{
+  "borderRadiusXS": 2,
+  "borderRadiusSM": 4,
+  "borderRadius": 6,
+  "borderRadiusLG": 8,
+  "borderRadiusXL": 12,
+  "borderRadiusFull": 999,
+  "wireframe": false,
+  "colorPrimaryBg": "rgba(244, 244, 247, 1)",
+  "colorPrimaryBgHover": "rgba(239, 239, 244, 1)",
+  "colorPrimaryBorder": "rgba(62, 63, 66, 1)",
+  "colorPrimaryBorderHover": "rgba(130, 132, 137, 1)",
+  "colorPrimaryHover": "rgba(38, 38, 41, 1)",
+  "colorPrimary": "rgba(26, 26, 29, 1)",
+  "colorPrimaryActive": "rgba(0, 0, 0, 1)",
+  "colorPrimaryTextHover": "rgba(38, 38, 41, 1)",
+  "colorPrimaryText": "rgba(26, 26, 29, 1)",
+  "colorPrimaryTextActive": "rgba(0, 0, 0, 1)",
+  "colorTextBase": "rgba(26, 26, 29, 1)",
+  "colorBgBase": "rgba(255, 255, 255, 1)",
+  "colorText": "rgba(26, 26, 29, 0.88)",
+  "colorTextSecondary": "rgba(26, 26, 29, 0.65)",
+  "colorTextTertiary": "rgba(26, 26, 29, 0.45)",
+  "colorTextQuaternary": "rgba(26, 26, 29, 0.25)",
+  "colorBorder": "rgba(187, 187, 193, 1)",
+  "colorBorderSecondary": "rgba(234, 234, 234, 1)",
+  "colorFill": "rgba(0, 0, 43, 0.06)",
+  "colorFillSecondary": "rgba(0, 0, 85, 0.03)",
+  "colorFillTertiary": "rgba(205, 208, 220, 0.15)",
+  "colorFillQuaternary": "rgba(205, 208, 220, 0.1)",
+  "colorBgContainer": "rgba(255, 255, 255, 1)",
+  "colorBgElevated": "rgba(255, 255, 255, 1)",
+  "colorBgLayout": "rgba(250, 250, 251, 1)",
+  "colorBgSpotlight": "rgba(26, 26, 29, 0.85)",
+  "colorBgMask": "rgba(0, 0, 0, 0.45)",
+  "colorInfo": "rgba(11, 131, 241, 1)",
+  "colorInfoHover": "rgba(94, 188, 255, 1)",
+  "colorInfoBorder": "rgba(135, 209, 255, 1)",
+  "colorInfoText": "rgba(11, 131, 241, 1)",
+  "colorInfoBg": "rgba(230, 247, 255, 1)",
+  "colorInfoBgHover": "rgba(176, 227, 255, 1)",
+  "colorInfoBorderHover": "rgba(94, 188, 255, 1)",
+  "colorSuccess": "rgba(91, 185, 139, 1)",
+  "colorSuccessHover": "rgba(171, 212, 190, 1)",
+  "colorSuccessBg": "rgba(235, 250, 240, 1)",
+  "colorSuccessBgHover": "rgba(223, 237, 228, 1)",
+  "colorSuccessBorder": "rgba(211, 224, 217, 1)",
+  "colorSuccessBorderHover": "rgba(171, 212, 190, 1)",
+  "colorWarning": "rgba(250, 173, 20, 1)",
+  "colorWarningHover": "rgba(255, 214, 102, 1)",
+  "colorWarningBg": "rgba(255, 251, 230, 1)",
+  "colorWarningBgHover": "rgba(255, 241, 184, 1)",
+  "colorWarningBorder": "rgba(255, 229, 143, 1)",
+  "colorWarningBorderHover": "rgba(255, 214, 102, 1)",
+  "colorError": "rgba(255, 77, 79, 1)",
+  "colorErrorHover": "rgba(255, 120, 117, 1)",
+  "colorErrorBg": "rgba(255, 242, 240, 1)",
+  "colorErrorBgHover": "rgba(255, 241, 240, 1)",
+  "colorErrorBorder": "rgba(255, 204, 199, 1)",
+  "colorErrorBorderHover": "rgba(255, 163, 158, 1)",
+  "colorLink": "rgba(0, 77, 255, 1)",
+  "boxShadow": "0px 4px 6px 0px rgba(0, 0, 0, 0.08)",
+  "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)",
+
+  "colorTextWhite": "#ffffff",
+  "colorTextOnPrimary": "#ffffff",
+  "colorFillDisable": "rgba(232, 232, 235, 1)",
+  "colorPurple": "rgba(97, 92, 237, 1)",
+  "colorPurpleHover": "#8080FF",
+  "colorPurpleBg": "rgba(226, 222, 255, 0.8)",
+  "colorPink": "rgba(236, 72, 153, 1)",
+  "colorPinkHover": "#E593BC",
+  "colorPinkBg": "rgba(251, 220, 239, 0.8)",
+  "colorYellow": "rgba(234, 179, 8, 1)",
+  "colorYellowHover": "#F1D372",
+  "colorYellowBg": "rgba(255, 250, 184, 0.8)",
+  "colorOrange": "rgba(250, 129, 37, 1)",
+  "colorOrangeHover": "#E88C45",
+  "colorOrangeBg": "rgba(255, 232, 201, 0.8)",
+  "colorTeal": "rgba(20, 184, 166, 1)",
+  "colorTealHover": "#5FB3A9",
+  "colorTealBg": "rgba(200, 244, 233, 0.8)",
+  "colorBlue": "rgba(0, 144, 255, 1)",
+  "colorBlueHover": "#72BCF5",
+  "colorBlueBg": "rgba(194, 229, 255, 0.8)",
+  "colorMauve": "rgba(142, 140, 153, 1)",
+  "colorMauveHover": "#C0BFC8",
+  "colorMauveBg": "rgba(239, 240, 243, 0.8)",
+  "colorSlate": "#2C3A50",
+  "colorSlateHover": "#354252",
+  "colorSlateBg": "#232B36",
+  "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)",
+  "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)",
+  "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)"
+}
+
+```
+
+<div><span style="display: inline-block; width: 12px; height: 12px; background-color: rgba(26, 26, 29, 1);"></span> carbonDarkTheme</div>
+
+```json
+{
+  "borderRadiusXS": 2,
+  "borderRadiusSM": 4,
+  "borderRadius": 6,
+  "borderRadiusLG": 8,
+  "borderRadiusXL": 12,
+  "borderRadiusFull": 999,
+  "wireframe": false,
+  "colorPrimaryBg": "#181818",
+  "colorPrimaryBgHover": "#2E2E2E",
+  "colorPrimaryBorder": "#323232",
+  "colorPrimaryBorderHover": "#2C2C2C",
+  "colorPrimaryHover": "#DFDFDF",
+  "colorPrimary": "#E4E4E4",
+  "colorPrimaryActive": "#7E7E7E",
+  "colorPrimaryTextHover": "#909090",
+  "colorPrimaryText": "#676767",
+  "colorPrimaryTextActive": "#959595",
+  "colorTextBase": "#E7E7ED",
+  "colorBgBase": "#0A0A0B",
+  "colorText": "#E7E7EDC7",
+  "colorTextSecondary": "#E7E7EDA6",
+  "colorTextTertiary": "#E7E7ED73",
+  "colorTextQuaternary": "#E7E7ED40",
+  "colorBorder": "#5B5B5BCC",
+  "colorBorderSecondary": "#323232CC",
+  "colorFill": "#E7E7ED2E",
+  "colorFillSecondary": "#E7E7ED1F",
+  "colorFillTertiary": "#E7E7ED14",
+  "colorFillQuaternary": "#E7E7ED0A",
+  "colorBgContainer": "#121212",
+  "colorBgElevated": "#212121",
+  "colorBgLayout": "#141414",
+  "colorBgSpotlight": "#525252D9",
+  "colorBgMask": "#050508CC",
+  "colorInfo": "#0B83F1",
+  "colorInfoHover": "#5EBCFF",
+  "colorInfoBorder": "#3990C9",
+  "colorInfoText": "#0B83F1",
+  "colorInfoBg": "#112233",
+  "colorInfoBgHover": "#264866",
+  "colorInfoBorderHover": "#5EBCFF",
+  "colorSuccess": "#5BB98B",
+  "colorSuccessHover": "#74A47C",
+  "colorSuccessBg": "#293631",
+  "colorSuccessBgHover": "#3F5147",
+  "colorSuccessBorder": "#73A377",
+  "colorSuccessBorderHover": "#ABD4BE",
+  "colorWarning": "#FAAD14",
+  "colorWarningHover": "#FF8C28",
+  "colorWarningBg": "#2D231A",
+  "colorWarningBgHover": "#4D3B23",
+  "colorWarningBorder": "#FFA628",
+  "colorWarningBorderHover": "#FFD666",
+  "colorError": "#FF4D4F",
+  "colorErrorHover": "#EE654E",
+  "colorErrorBg": "#2B0B08",
+  "colorErrorBgHover": "#4A2A28",
+  "colorErrorBorder": "#EE5B4E",
+  "colorErrorBorderHover": "#FFA39E",
+  "colorLink": "#4D7DFF",
+  "boxShadow": "0px 4px 6px 0px rgba(255, 255, 255, 0.08)",
+  "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)",
+
+ "colorTextWhite": "#ffffff",
+ "colorTextOnPrimary": "#000000",
+  "colorFillDisable": "#898989",
+  "colorPurple": "#615CED",
+  "colorPurpleHover": "#8383F0",
+  "colorPurpleBg": "#6964877A",
+  "colorPink": "#EC4899",
+  "colorPinkHover": "#E494BC",
+  "colorPinkBg": "#53424D7A",
+  "colorYellow": "#EAB308",
+  "colorYellowHover": "#DBBE62",
+  "colorYellowBg": "#9585527A",
+  "colorOrange": "#FA8125",
+  "colorOrangeHover": "#F7A25F",
+  "colorOrangeBg": "#6F58417A",
+  "colorTeal": "#14B8A6",
+  "colorTealHover": "#7BC7BE",
+  "colorTealBg": "#4658547A",
+  "colorBlue": "#0090FF",
+  "colorBlueHover": "#83BFED",
+  "colorBlueBg": "#5E76897A",
+  "colorMauve": "#8E8C99",
+  "colorMauveHover": "#BBB8CA",
+  "colorMauveBg": "#5859647A",
+  "colorSlate": "#2C3A50",
+  "colorSlateHover": "#354252",
+  "colorSlateBg": "#232B36",
+  "colorLavender": "#A77BFF",
+  "colorLavenderHover": "#BFA5F3",
+  "colorLavenderBg": "rgba(150, 143, 167, 0.48)",
+
+  "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)",
+  "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)",
+  "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)",
+  "colorTextBlack": "#000000"
+}
+```
+
+# CSS 变量
+
+Spark Design 默认启用 cssVar 模式，因此您可以利用 从 token 派生出的 CSS 变量来构建自己的样式。
+
+
+```less
+.example {
+  background: var(--sps-color-bg-base);
+  color: var(--sps-color-pink);
+}
+// 提示：您可以将 'sps' 替换为您自己的前缀
+```

package/llms/docs/guide/vibe-coding.zh-CN.llms.txt

@@ -0,0 +1,29 @@
+
+
+# Vibe 编程
+
+## LLMs.txt
+
+为了让 Cursor 和 Claude Code 等工具理解 Spark Design，我们支持 LLMs.txt 文件，使 Spark Design 的文档可供大型语言模型使用。
+
+
+- [index.llms.txt](https://g.alicdn.com/code/npm/@ali/agentscope-ai-design/4.7.2/docs-dist/llms/index.llms.txt)：主要的 LLMs.txt 索引文件
+- [all.llms.txt](https://g.alicdn.com/code/npm/@ali/agentscope-ai-design/4.7.2/docs-dist/llms/all.llms.txt)：Spark Design 的完整文档
+
+在 Cursor 中使用 @Docs 功能将 LLMs.txt 文件包含在您的项目中。[了解更多](https://docs.cursor.com/en/context/@-symbols/@-docs)
+
+## D2C
+
+在前端使用 Alibaba Cloud Spark Design、设计稿使用 Spark Design 套件的前提下，通过 masterGo 视觉稿生成代码可以做到以下几点：
+
+
+- 准确识别 icon
+- 使用标准 css token
+- 无需测量间距、圆角等数据，AI 直接还原布局（90%以上概率准确生成）
+- 使用标准组件还原页面，大部分标准组件可一次性正确生成，无需二次调整
+
+<div>
+<video style="width: 100%" controls src="https://cloud.video.taobao.com/vod/PrrYzvYJkoDlbJwoL8Ei1Bo_60LrKAROCojWxB_EAYs.mp4" />
+</div>
+
+我们会在不久的将来开放 masterGo 的设计套件和 rules，帮助您高效率还原视觉稿

package/llms/index.llms.txt

@@ -0,0 +1,58 @@
+# 索引
+
+- [](components/commonComponents/Upload/index.zh-CN.llms.txt)
+- [](components/commonComponents/Tooltip/index.zh-CN.llms.txt)
+- [](components/commonComponents/TimePicker/index.zh-CN.llms.txt)
+- [](components/commonComponents/Tag/index.zh-CN.llms.txt)
+- [](components/commonComponents/Video/index.zh-CN.llms.txt)
+- [](components/commonComponents/Tabs/index.zh-CN.llms.txt)
+- [](components/commonComponents/Table/index.zh-CN.llms.txt)
+- [](components/commonComponents/Switch/index.zh-CN.llms.txt)
+- [](components/commonComponents/Steps/index.zh-CN.llms.txt)
+- [](components/commonComponents/Statistic/index.zh-CN.llms.txt)
+- [](components/commonComponents/Spinner/index.zh-CN.llms.txt)
+- [](components/commonComponents/Slider/index.zh-CN.llms.txt)
+- [](components/commonComponents/Skeleton/index.zh-CN.llms.txt)
+- [](components/commonComponents/Select/index.zh-CN.llms.txt)
+- [](components/commonComponents/Result/index.zh-CN.llms.txt)
+- [](components/commonComponents/RadioButton/index.zh-CN.llms.txt)
+- [](components/commonComponents/Radio/index.zh-CN.llms.txt)
+- [](components/commonComponents/PromptsEditor/index.zh-CN.llms.txt)
+- [](components/commonComponents/Progress/index.zh-CN.llms.txt)
+- [](components/commonComponents/Popconfirm/index.zh-CN.llms.txt)
+- [](components/commonComponents/Popover/index.zh-CN.llms.txt)
+- [](components/commonComponents/Pagination/index.zh-CN.llms.txt)
+- [](components/commonComponents/Notification/index.zh-CN.llms.txt)
+- [](components/commonComponents/Modal/index.zh-CN.llms.txt)
+- [](components/commonComponents/Message/index.zh-CN.llms.txt)
+- [](components/commonComponents/InputNumber/index.zh-CN.llms.txt)
+- [](components/commonComponents/Input/index.zh-CN.llms.txt)
+- [](components/commonComponents/Image/index.zh-CN.llms.txt)
+- [](components/commonComponents/IconButton/index.zh-CN.llms.txt)
+- [](components/commonComponents/Form/index.zh-CN.llms.txt)
+- [](components/commonComponents/FloatButton/index.zh-CN.llms.txt)
+- [](components/commonComponents/Empty/index.zh-CN.llms.txt)
+- [](components/commonComponents/Dropdown/index.zh-CN.llms.txt)
+- [](components/commonComponents/Drawer/index.zh-CN.llms.txt)
+- [](components/commonComponents/Descriptions/index.zh-CN.llms.txt)
+- [](components/commonComponents/CollapsePanel/index.zh-CN.llms.txt)
+- [](components/commonComponents/DatePicker/index.zh-CN.llms.txt)
+- [](components/commonComponents/Collapse/index.zh-CN.llms.txt)
+- [](components/commonComponents/CodeBlock/index.zh-CN.llms.txt)
+- [](components/commonComponents/Card/index.zh-CN.llms.txt)
+- [](components/commonComponents/Button/index.zh-CN.llms.txt)
+- [](components/commonComponents/Checkbox/index.zh-CN.llms.txt)
+- [](components/commonComponents/Avatar/index.zh-CN.llms.txt)
+- [](components/commonComponents/Breadcrumb/index.zh-CN.llms.txt)
+- [](components/commonComponents/Audio/index.zh-CN.llms.txt)
+- [](components/commonComponents/Anchor/index.zh-CN.llms.txt)
+- [](components/commonComponents/AlertDialog/index.zh-CN.llms.txt)
+- [](components/commonComponents/Alert/index.zh-CN.llms.txt)
+- [](docs/guide/theme.zh-CN.llms.txt)
+- [概述](docs/guide/overview.zh-CN.llms.txt)
+- [使用](docs/guide/sparkIcons.zh-CN.llms.txt)
+- [从 Antd 迁移](docs/guide/fromAntd.zh-CN.llms.txt)
+- [使用](docs/guide/iconfont.zh-CN.llms.txt)
+- [Vibe 编程](docs/guide/vibe-coding.zh-CN.llms.txt)
+- [从零开始使用](docs/guide/fromScratch.zh-CN.llms.txt)
+- [Tokens](docs/guide/tokens&variables.zh-CN.llms.txt)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agentscope-ai/design",
-  "version": "1.0.19",
+  "version": "1.0.20",
   "description": "AgentScope Spark Design - UI Library for AgentScope AI",
   "repository": {
     "type": "git",
@@ -37,7 +37,9 @@
     "dumi:setup": "dumi setup",
     "prepare": "npm run dumi:setup",
     "start": "npm run dev",
-    "test": "vitest"
+    "test": "vitest",
+    "publish": "node scripts/publish.js",
+    "publish:beta": "node scripts/publish-beta.js"
   },
   "dependencies": {
     "@agentscope-ai/icons": "^1.0.35",