@hsu-react/ui 2.2.15 → 2.4.0

package/es/build/webpack.d.ts

@@ -0,0 +1,40 @@
+/**
+ * 给消费方 webpack 配置用的工具。**构建期模块，不要从应用代码里引**
+ * —— 它不依赖 React，也不该进运行时产物。
+ *
+ * ```js
+ * // webpack.config.js（CJS）
+ * const { excludeNodeModulesExceptHsuUi } = require("@hsu-react/ui/lib/build/webpack");
+ *
+ * { test: /\.scss$/, exclude: excludeNodeModulesExceptHsuUi, use: [...] }
+ * ```
+ */
+/**
+ * 判断一个模块路径「是否该被 loader 排除」：node_modules 一律排除，但放行本库。
+ *
+ * ## 为什么需要它
+ *
+ * 本库的 es / lib 产物里带着**未编译的 `.module.scss`** 和图片资源，要由消费方自己的
+ * loader 处理（这样 CSS Module 的类名哈希、`getLocalIdent` 等策略才由消费方说了算）。
+ * 于是每个 webpack 项目都得在 scss / 图片规则上开一个「排除 node_modules，但放行
+ * @hsu-react/ui」的例外。
+ *
+ * ## 为什么不能用正则
+ *
+ * 手写的版本几乎都是 `/node_modules\/(?!@hsu-react\/ui\/)/`。它只看**第一个**
+ * node_modules 后面跟着什么——扁平安装（yarn / npm）下确实是 `@hsu-react/ui/`，
+ * 但 pnpm 的真实路径是
+ *
+ * ```
+ * node_modules/.pnpm/@hsu-react+ui@<版本>/node_modules/@hsu-react/ui/es/...
+ * ```
+ *
+ * 跟着的是 `.pnpm/`，否定前瞻立刻失败，本库的 scss 与图片会被**全部排除**，
+ * 报「no loaders are configured to process this file」。这个坑在四个下游项目里
+ * 各踩过一次，所以把判定收进库里导出，消费方引用而不是各抄一份。
+ *
+ * 改按「整条路径里有没有 @hsu-react/ui」判断，扁平与嵌套两种布局都成立；
+ * 路径分隔符同时接受 `/` 与 `\`，Windows 下同样有效。
+ */
+export declare const excludeNodeModulesExceptHsuUi: (modulePath: string) => boolean;
+export default excludeNodeModulesExceptHsuUi;

package/es/build/webpack.js

@@ -0,0 +1,43 @@
+/**
+ * 给消费方 webpack 配置用的工具。**构建期模块，不要从应用代码里引**
+ * —— 它不依赖 React，也不该进运行时产物。
+ *
+ * ```js
+ * // webpack.config.js（CJS）
+ * const { excludeNodeModulesExceptHsuUi } = require("@hsu-react/ui/lib/build/webpack");
+ *
+ * { test: /\.scss$/, exclude: excludeNodeModulesExceptHsuUi, use: [...] }
+ * ```
+ */
+
+/**
+ * 判断一个模块路径「是否该被 loader 排除」：node_modules 一律排除，但放行本库。
+ *
+ * ## 为什么需要它
+ *
+ * 本库的 es / lib 产物里带着**未编译的 `.module.scss`** 和图片资源，要由消费方自己的
+ * loader 处理（这样 CSS Module 的类名哈希、`getLocalIdent` 等策略才由消费方说了算）。
+ * 于是每个 webpack 项目都得在 scss / 图片规则上开一个「排除 node_modules，但放行
+ * @hsu-react/ui」的例外。
+ *
+ * ## 为什么不能用正则
+ *
+ * 手写的版本几乎都是 `/node_modules\/(?!@hsu-react\/ui\/)/`。它只看**第一个**
+ * node_modules 后面跟着什么——扁平安装（yarn / npm）下确实是 `@hsu-react/ui/`，
+ * 但 pnpm 的真实路径是
+ *
+ * ```
+ * node_modules/.pnpm/@hsu-react+ui@<版本>/node_modules/@hsu-react/ui/es/...
+ * ```
+ *
+ * 跟着的是 `.pnpm/`，否定前瞻立刻失败，本库的 scss 与图片会被**全部排除**，
+ * 报「no loaders are configured to process this file」。这个坑在四个下游项目里
+ * 各踩过一次，所以把判定收进库里导出，消费方引用而不是各抄一份。
+ *
+ * 改按「整条路径里有没有 @hsu-react/ui」判断，扁平与嵌套两种布局都成立；
+ * 路径分隔符同时接受 `/` 与 `\`，Windows 下同样有效。
+ */
+export var excludeNodeModulesExceptHsuUi = function excludeNodeModulesExceptHsuUi(modulePath) {
+  return /node_modules/.test(modulePath) && !/@hsu-react[\\/]ui[\\/]/.test(modulePath);
+};
+export default excludeNodeModulesExceptHsuUi;

package/es/layout/Menu/_components/SecondaryHeader/index.module.scss

@@ -41,7 +41,7 @@
     text-overflow: ellipsis;
   }
 
-  // 明暗两套文字色由 --cf-text 一并承担，不再各写一份字面量
+  // 明暗两套文字色由 --vita-foreground 一并承担，不再各写一份字面量
   .back,
   .title {
     color: var(--vita-foreground);

package/es/layout/Theme/index.d.ts

@@ -24,7 +24,7 @@ export interface ThemeProps {
  * - 自存一份主题色（原来固定是青色）                                -> antd useToken 里当前生效的 colorPrimary
  * - matchMedia 监听系统深色                                       -> useIsDark
  * - borderRadius / colorBorder / Table / Card / Button / Input 等成套 token 覆盖 -> toAntdTheme
- * - 在包裹元素上内联重定义 --cf-*：那会盖掉 tokens.scss 生成的值，属于主动帮倒忙
+ * - 在包裹元素上内联重定义 --vita-*：那会盖掉 tokens.scss 生成的值，属于主动帮倒忙
  */
 declare const Theme: React.FC<ThemeProps>;
 export default Theme;

package/es/layout/Theme/index.js

@@ -23,7 +23,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
  * - 自存一份主题色（原来固定是青色）                                -> antd useToken 里当前生效的 colorPrimary
  * - matchMedia 监听系统深色                                       -> useIsDark
  * - borderRadius / colorBorder / Table / Card / Button / Input 等成套 token 覆盖 -> toAntdTheme
- * - 在包裹元素上内联重定义 --cf-*：那会盖掉 tokens.scss 生成的值，属于主动帮倒忙
+ * - 在包裹元素上内联重定义 --vita-*：那会盖掉 tokens.scss 生成的值，属于主动帮倒忙
  */
 var Theme = observer(function (props) {
   var _navDarkColors$top, _navDarkColors$bottom;

package/es/styles/tokens.d.ts

@@ -38,8 +38,10 @@ export interface HsuThemeTokens {
     shadow3: string;
 }
 /**
- * 2.0 之前的字段名。CSS 变量那侧留了 `--cf-*` 别名，但这里的 TS 字段是直接改名的 ——
- * 消费方写 `lightTokens.canvas` 会直接拿到 undefined，且没有任何提示。补上映射。
+ * 2.0 之前的字段名。TS 字段是直接改名的，消费方写 `lightTokens.canvas` 会拿到
+ * undefined 且没有任何提示，所以这里补上映射。
+ *
+ * （CSS 变量那侧原本也有一层 `--cf-*` 别名，2.3.0 起已移除，见 docs/guide.md。）
  *
  * `headerBg` 在重命名时被整个删掉了（没有对应的新名），这里指回 `surface`：2.0 之前
  * 两者在浅色下同为 #ffffff、暗色下同为卡片底色，语义上就是「顶栏用的面」。
@@ -98,7 +100,7 @@ export declare const breakpoints: {
     sm: number;
     md: number;
     lg: number;
-    xl: number; /** Default brand colour; consuming projects override it via `ConfigProvider.primaryColor` */
+    xl: number;
     xxl: number;
 };
 /**

package/es/styles/tokens.js

@@ -28,8 +28,10 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 import raw from "./tokens.json";
 
 /**
- * 2.0 之前的字段名。CSS 变量那侧留了 `--cf-*` 别名，但这里的 TS 字段是直接改名的 ——
- * 消费方写 `lightTokens.canvas` 会直接拿到 undefined，且没有任何提示。补上映射。
+ * 2.0 之前的字段名。TS 字段是直接改名的，消费方写 `lightTokens.canvas` 会拿到
+ * undefined 且没有任何提示，所以这里补上映射。
+ *
+ * （CSS 变量那侧原本也有一层 `--cf-*` 别名，2.3.0 起已移除，见 docs/guide.md。）
  *
  * `headerBg` 在重命名时被整个删掉了（没有对应的新名），这里指回 `surface`：2.0 之前
  * 两者在浅色下同为 #ffffff、暗色下同为卡片底色，语义上就是「顶栏用的面」。

package/es/styles/tokens.scss

@@ -62,30 +62,6 @@
   --vita-screen-lg: 1024px;
   --vita-screen-xl: 1280px;
   --vita-screen-xxl: 1536px;
-
-  // ---- 兼容别名（2.0 前的 --cf-*，单向指向新名）----
-  --cf-canvas: var(--vita-background);
-  --cf-surface: var(--vita-surface);
-  --cf-subtle: var(--vita-muted);
-  --cf-border: var(--vita-border);
-  --cf-border-weak: var(--vita-border-weak);
-  --cf-text: var(--vita-foreground);
-  --cf-text-2: var(--vita-muted-foreground);
-  --cf-text-3: var(--vita-subtle-foreground);
-  --cf-row-hover: var(--vita-hover);
-  --cf-success: var(--vita-success);
-  --cf-warning: var(--vita-warning);
-  --cf-error: var(--vita-error);
-  --cf-font-family: var(--vita-font-family);
-  --cf-font-size-sm: var(--vita-font-size-sm);
-  --cf-font-size: var(--vita-font-size);
-  --cf-font-size-lg: var(--vita-font-size-lg);
-  --cf-radius-sm: var(--vita-radius-sm);
-  --cf-radius: var(--vita-radius);
-  --cf-radius-lg: var(--vita-radius-lg);
-  --cf-shadow-1: var(--vita-shadow-1);
-  --cf-shadow-2: var(--vita-shadow-2);
-  --cf-shadow-3: var(--vita-shadow-3);
 }
 
 html[data-theme="dark"],

package/lib/build/webpack.d.ts

@@ -0,0 +1,40 @@
+/**
+ * 给消费方 webpack 配置用的工具。**构建期模块，不要从应用代码里引**
+ * —— 它不依赖 React，也不该进运行时产物。
+ *
+ * ```js
+ * // webpack.config.js（CJS）
+ * const { excludeNodeModulesExceptHsuUi } = require("@hsu-react/ui/lib/build/webpack");
+ *
+ * { test: /\.scss$/, exclude: excludeNodeModulesExceptHsuUi, use: [...] }
+ * ```
+ */
+/**
+ * 判断一个模块路径「是否该被 loader 排除」：node_modules 一律排除，但放行本库。
+ *
+ * ## 为什么需要它
+ *
+ * 本库的 es / lib 产物里带着**未编译的 `.module.scss`** 和图片资源，要由消费方自己的
+ * loader 处理（这样 CSS Module 的类名哈希、`getLocalIdent` 等策略才由消费方说了算）。
+ * 于是每个 webpack 项目都得在 scss / 图片规则上开一个「排除 node_modules，但放行
+ * @hsu-react/ui」的例外。
+ *
+ * ## 为什么不能用正则
+ *
+ * 手写的版本几乎都是 `/node_modules\/(?!@hsu-react\/ui\/)/`。它只看**第一个**
+ * node_modules 后面跟着什么——扁平安装（yarn / npm）下确实是 `@hsu-react/ui/`，
+ * 但 pnpm 的真实路径是
+ *
+ * ```
+ * node_modules/.pnpm/@hsu-react+ui@<版本>/node_modules/@hsu-react/ui/es/...
+ * ```
+ *
+ * 跟着的是 `.pnpm/`，否定前瞻立刻失败，本库的 scss 与图片会被**全部排除**，
+ * 报「no loaders are configured to process this file」。这个坑在四个下游项目里
+ * 各踩过一次，所以把判定收进库里导出，消费方引用而不是各抄一份。
+ *
+ * 改按「整条路径里有没有 @hsu-react/ui」判断，扁平与嵌套两种布局都成立；
+ * 路径分隔符同时接受 `/` 与 `\`，Windows 下同样有效。
+ */
+export declare const excludeNodeModulesExceptHsuUi: (modulePath: string) => boolean;
+export default excludeNodeModulesExceptHsuUi;

package/lib/build/webpack.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.excludeNodeModulesExceptHsuUi = exports.default = void 0;
+/**
+ * 给消费方 webpack 配置用的工具。**构建期模块，不要从应用代码里引**
+ * —— 它不依赖 React，也不该进运行时产物。
+ *
+ * ```js
+ * // webpack.config.js（CJS）
+ * const { excludeNodeModulesExceptHsuUi } = require("@hsu-react/ui/lib/build/webpack");
+ *
+ * { test: /\.scss$/, exclude: excludeNodeModulesExceptHsuUi, use: [...] }
+ * ```
+ */
+
+/**
+ * 判断一个模块路径「是否该被 loader 排除」：node_modules 一律排除，但放行本库。
+ *
+ * ## 为什么需要它
+ *
+ * 本库的 es / lib 产物里带着**未编译的 `.module.scss`** 和图片资源，要由消费方自己的
+ * loader 处理（这样 CSS Module 的类名哈希、`getLocalIdent` 等策略才由消费方说了算）。
+ * 于是每个 webpack 项目都得在 scss / 图片规则上开一个「排除 node_modules，但放行
+ * @hsu-react/ui」的例外。
+ *
+ * ## 为什么不能用正则
+ *
+ * 手写的版本几乎都是 `/node_modules\/(?!@hsu-react\/ui\/)/`。它只看**第一个**
+ * node_modules 后面跟着什么——扁平安装（yarn / npm）下确实是 `@hsu-react/ui/`，
+ * 但 pnpm 的真实路径是
+ *
+ * ```
+ * node_modules/.pnpm/@hsu-react+ui@<版本>/node_modules/@hsu-react/ui/es/...
+ * ```
+ *
+ * 跟着的是 `.pnpm/`，否定前瞻立刻失败，本库的 scss 与图片会被**全部排除**，
+ * 报「no loaders are configured to process this file」。这个坑在四个下游项目里
+ * 各踩过一次，所以把判定收进库里导出，消费方引用而不是各抄一份。
+ *
+ * 改按「整条路径里有没有 @hsu-react/ui」判断，扁平与嵌套两种布局都成立；
+ * 路径分隔符同时接受 `/` 与 `\`，Windows 下同样有效。
+ */
+const excludeNodeModulesExceptHsuUi = modulePath => /node_modules/.test(modulePath) && !/@hsu-react[\\/]ui[\\/]/.test(modulePath);
+exports.excludeNodeModulesExceptHsuUi = excludeNodeModulesExceptHsuUi;
+var _default = exports.default = excludeNodeModulesExceptHsuUi;

package/lib/layout/Menu/_components/SecondaryHeader/index.module.scss

@@ -41,7 +41,7 @@
     text-overflow: ellipsis;
   }
 
-  // 明暗两套文字色由 --cf-text 一并承担，不再各写一份字面量
+  // 明暗两套文字色由 --vita-foreground 一并承担，不再各写一份字面量
   .back,
   .title {
     color: var(--vita-foreground);

package/lib/layout/Theme/index.d.ts

@@ -24,7 +24,7 @@ export interface ThemeProps {
  * - 自存一份主题色（原来固定是青色）                                -> antd useToken 里当前生效的 colorPrimary
  * - matchMedia 监听系统深色                                       -> useIsDark
  * - borderRadius / colorBorder / Table / Card / Button / Input 等成套 token 覆盖 -> toAntdTheme
- * - 在包裹元素上内联重定义 --cf-*：那会盖掉 tokens.scss 生成的值，属于主动帮倒忙
+ * - 在包裹元素上内联重定义 --vita-*：那会盖掉 tokens.scss 生成的值，属于主动帮倒忙
  */
 declare const Theme: React.FC<ThemeProps>;
 export default Theme;

package/lib/layout/Theme/index.js

@@ -32,7 +32,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  * - 自存一份主题色（原来固定是青色）                                -> antd useToken 里当前生效的 colorPrimary
  * - matchMedia 监听系统深色                                       -> useIsDark
  * - borderRadius / colorBorder / Table / Card / Button / Input 等成套 token 覆盖 -> toAntdTheme
- * - 在包裹元素上内联重定义 --cf-*：那会盖掉 tokens.scss 生成的值，属于主动帮倒忙
+ * - 在包裹元素上内联重定义 --vita-*：那会盖掉 tokens.scss 生成的值，属于主动帮倒忙
  */
 const Theme = (0, _mobxReactLite.observer)(props => {
   const {

package/lib/package.json

@@ -0,0 +1,3 @@
+{
+  "type": "commonjs"
+}

package/lib/styles/tokens.d.ts

@@ -38,8 +38,10 @@ export interface HsuThemeTokens {
     shadow3: string;
 }
 /**
- * 2.0 之前的字段名。CSS 变量那侧留了 `--cf-*` 别名，但这里的 TS 字段是直接改名的 ——
- * 消费方写 `lightTokens.canvas` 会直接拿到 undefined，且没有任何提示。补上映射。
+ * 2.0 之前的字段名。TS 字段是直接改名的，消费方写 `lightTokens.canvas` 会拿到
+ * undefined 且没有任何提示，所以这里补上映射。
+ *
+ * （CSS 变量那侧原本也有一层 `--cf-*` 别名，2.3.0 起已移除，见 docs/guide.md。）
  *
  * `headerBg` 在重命名时被整个删掉了（没有对应的新名），这里指回 `surface`：2.0 之前
  * 两者在浅色下同为 #ffffff、暗色下同为卡片底色，语义上就是「顶栏用的面」。
@@ -98,7 +100,7 @@ export declare const breakpoints: {
     sm: number;
     md: number;
     lg: number;
-    xl: number; /** Default brand colour; consuming projects override it via `ConfigProvider.primaryColor` */
+    xl: number;
     xxl: number;
 };
 /**

package/lib/styles/tokens.js

@@ -22,8 +22,10 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  */
 
 /**
- * 2.0 之前的字段名。CSS 变量那侧留了 `--cf-*` 别名，但这里的 TS 字段是直接改名的 ——
- * 消费方写 `lightTokens.canvas` 会直接拿到 undefined，且没有任何提示。补上映射。
+ * 2.0 之前的字段名。TS 字段是直接改名的，消费方写 `lightTokens.canvas` 会拿到
+ * undefined 且没有任何提示，所以这里补上映射。
+ *
+ * （CSS 变量那侧原本也有一层 `--cf-*` 别名，2.3.0 起已移除，见 docs/guide.md。）
  *
  * `headerBg` 在重命名时被整个删掉了（没有对应的新名），这里指回 `surface`：2.0 之前
  * 两者在浅色下同为 #ffffff、暗色下同为卡片底色，语义上就是「顶栏用的面」。

package/lib/styles/tokens.scss

@@ -62,30 +62,6 @@
   --vita-screen-lg: 1024px;
   --vita-screen-xl: 1280px;
   --vita-screen-xxl: 1536px;
-
-  // ---- 兼容别名（2.0 前的 --cf-*，单向指向新名）----
-  --cf-canvas: var(--vita-background);
-  --cf-surface: var(--vita-surface);
-  --cf-subtle: var(--vita-muted);
-  --cf-border: var(--vita-border);
-  --cf-border-weak: var(--vita-border-weak);
-  --cf-text: var(--vita-foreground);
-  --cf-text-2: var(--vita-muted-foreground);
-  --cf-text-3: var(--vita-subtle-foreground);
-  --cf-row-hover: var(--vita-hover);
-  --cf-success: var(--vita-success);
-  --cf-warning: var(--vita-warning);
-  --cf-error: var(--vita-error);
-  --cf-font-family: var(--vita-font-family);
-  --cf-font-size-sm: var(--vita-font-size-sm);
-  --cf-font-size: var(--vita-font-size);
-  --cf-font-size-lg: var(--vita-font-size-lg);
-  --cf-radius-sm: var(--vita-radius-sm);
-  --cf-radius: var(--vita-radius);
-  --cf-radius-lg: var(--vita-radius-lg);
-  --cf-shadow-1: var(--vita-shadow-1);
-  --cf-shadow-2: var(--vita-shadow-2);
-  --cf-shadow-3: var(--vita-shadow-3);
 }
 
 html[data-theme="dark"],

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hsu-react/ui",
-  "version": "2.2.15",
+  "version": "2.4.0",
   "description": "一套基于 React + Ant Design 的中后台业务组件库",
   "license": "MIT",
   "type": "module",
@@ -41,8 +41,8 @@
     "dev": "dumi dev",
     "docs:build": "dumi build",
     "docs:preview": "dumi preview",
-    "build": "node scripts/clean-dist.cjs && node scripts/gen-tokens-scss.cjs && father build && node scripts/check-heavy-deps.cjs",
-    "prepublishOnly": "node scripts/clean-dist.cjs && node scripts/gen-tokens-scss.cjs --check && father build && node scripts/check-heavy-deps.cjs",
+    "build": "node scripts/clean-dist.cjs && node scripts/gen-tokens-scss.cjs && father build && node scripts/mark-cjs.cjs && node scripts/check-heavy-deps.cjs",
+    "prepublishOnly": "node scripts/clean-dist.cjs && node scripts/gen-tokens-scss.cjs --check && father build && node scripts/mark-cjs.cjs && node scripts/check-heavy-deps.cjs",
     "check:deps": "node scripts/check-heavy-deps.cjs",
     "tokens": "node scripts/gen-tokens-scss.cjs",
     "check:tokens": "node scripts/gen-tokens-scss.cjs --check"

package/src/build/webpack.ts

@@ -0,0 +1,44 @@
+/**
+ * 给消费方 webpack 配置用的工具。**构建期模块，不要从应用代码里引**
+ * —— 它不依赖 React，也不该进运行时产物。
+ *
+ * ```js
+ * // webpack.config.js（CJS）
+ * const { excludeNodeModulesExceptHsuUi } = require("@hsu-react/ui/lib/build/webpack");
+ *
+ * { test: /\.scss$/, exclude: excludeNodeModulesExceptHsuUi, use: [...] }
+ * ```
+ */
+
+/**
+ * 判断一个模块路径「是否该被 loader 排除」：node_modules 一律排除，但放行本库。
+ *
+ * ## 为什么需要它
+ *
+ * 本库的 es / lib 产物里带着**未编译的 `.module.scss`** 和图片资源，要由消费方自己的
+ * loader 处理（这样 CSS Module 的类名哈希、`getLocalIdent` 等策略才由消费方说了算）。
+ * 于是每个 webpack 项目都得在 scss / 图片规则上开一个「排除 node_modules，但放行
+ * @hsu-react/ui」的例外。
+ *
+ * ## 为什么不能用正则
+ *
+ * 手写的版本几乎都是 `/node_modules\/(?!@hsu-react\/ui\/)/`。它只看**第一个**
+ * node_modules 后面跟着什么——扁平安装（yarn / npm）下确实是 `@hsu-react/ui/`，
+ * 但 pnpm 的真实路径是
+ *
+ * ```
+ * node_modules/.pnpm/@hsu-react+ui@<版本>/node_modules/@hsu-react/ui/es/...
+ * ```
+ *
+ * 跟着的是 `.pnpm/`，否定前瞻立刻失败，本库的 scss 与图片会被**全部排除**，
+ * 报「no loaders are configured to process this file」。这个坑在四个下游项目里
+ * 各踩过一次，所以把判定收进库里导出，消费方引用而不是各抄一份。
+ *
+ * 改按「整条路径里有没有 @hsu-react/ui」判断，扁平与嵌套两种布局都成立；
+ * 路径分隔符同时接受 `/` 与 `\`，Windows 下同样有效。
+ */
+export const excludeNodeModulesExceptHsuUi = (modulePath: string): boolean =>
+  /node_modules/.test(modulePath) &&
+  !/@hsu-react[\\/]ui[\\/]/.test(modulePath);
+
+export default excludeNodeModulesExceptHsuUi;

package/src/layout/Menu/_components/SecondaryHeader/index.module.scss

@@ -41,7 +41,7 @@
     text-overflow: ellipsis;
   }
 
-  // 明暗两套文字色由 --cf-text 一并承担，不再各写一份字面量
+  // 明暗两套文字色由 --vita-foreground 一并承担，不再各写一份字面量
   .back,
   .title {
     color: var(--vita-foreground);

package/src/layout/Theme/index.tsx

@@ -30,7 +30,7 @@ export interface ThemeProps {
  * - 自存一份主题色（原来固定是青色）                                -> antd useToken 里当前生效的 colorPrimary
  * - matchMedia 监听系统深色                                       -> useIsDark
  * - borderRadius / colorBorder / Table / Card / Button / Input 等成套 token 覆盖 -> toAntdTheme
- * - 在包裹元素上内联重定义 --cf-*：那会盖掉 tokens.scss 生成的值，属于主动帮倒忙
+ * - 在包裹元素上内联重定义 --vita-*：那会盖掉 tokens.scss 生成的值，属于主动帮倒忙
  */
 const Theme: React.FC<ThemeProps> = observer((props) => {
   const { children, navDarkColors } = props;

package/src/styles/tokens.scss

@@ -62,30 +62,6 @@
   --vita-screen-lg: 1024px;
   --vita-screen-xl: 1280px;
   --vita-screen-xxl: 1536px;
-
-  // ---- 兼容别名（2.0 前的 --cf-*，单向指向新名）----
-  --cf-canvas: var(--vita-background);
-  --cf-surface: var(--vita-surface);
-  --cf-subtle: var(--vita-muted);
-  --cf-border: var(--vita-border);
-  --cf-border-weak: var(--vita-border-weak);
-  --cf-text: var(--vita-foreground);
-  --cf-text-2: var(--vita-muted-foreground);
-  --cf-text-3: var(--vita-subtle-foreground);
-  --cf-row-hover: var(--vita-hover);
-  --cf-success: var(--vita-success);
-  --cf-warning: var(--vita-warning);
-  --cf-error: var(--vita-error);
-  --cf-font-family: var(--vita-font-family);
-  --cf-font-size-sm: var(--vita-font-size-sm);
-  --cf-font-size: var(--vita-font-size);
-  --cf-font-size-lg: var(--vita-font-size-lg);
-  --cf-radius-sm: var(--vita-radius-sm);
-  --cf-radius: var(--vita-radius);
-  --cf-radius-lg: var(--vita-radius-lg);
-  --cf-shadow-1: var(--vita-shadow-1);
-  --cf-shadow-2: var(--vita-shadow-2);
-  --cf-shadow-3: var(--vita-shadow-3);
 }
 
 html[data-theme="dark"],

package/src/styles/tokens.ts

@@ -42,8 +42,10 @@ export interface HsuThemeTokens {
 }
 
 /**
- * 2.0 之前的字段名。CSS 变量那侧留了 `--cf-*` 别名，但这里的 TS 字段是直接改名的 ——
- * 消费方写 `lightTokens.canvas` 会直接拿到 undefined，且没有任何提示。补上映射。
+ * 2.0 之前的字段名。TS 字段是直接改名的，消费方写 `lightTokens.canvas` 会拿到
+ * undefined 且没有任何提示，所以这里补上映射。
+ *
+ * （CSS 变量那侧原本也有一层 `--cf-*` 别名，2.3.0 起已移除，见 docs/guide.md。）
  *
  * `headerBg` 在重命名时被整个删掉了（没有对应的新名），这里指回 `surface`：2.0 之前
  * 两者在浅色下同为 #ffffff、暗色下同为卡片底色，语义上就是「顶栏用的面」。