@dsh-workbench/module-tools 0.1.7 → 0.1.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dsh-workbench/module-tools",
-  "version": "0.1.7",
+  "version": "0.1.9",
   "description": "模块包的构建与门禁工具：build（单文件 ESM 宿主侧 + 套 loader 壳的浏览器侧）、check（契约/产物边界/源码边界/卡片渲染）。模块包不再各带一份构建脚本。",
   "license": "MIT",
   "type": "module",

package/src/checks/cards.mjs

@@ -64,7 +64,22 @@ function fakeKit() {
   const callable = () => anyStub('result');
   return {
     hooks: new Proxy({}, { get: () => callable }),
-    components: new Proxy({}, { get: () => (props) => ({ type: 'stub', props: props ?? {}, children: [] }) }),
+    // 组件替身**带上自己的名字**（`stub:Card`）：卡片壳现在是 `kit.components.Card` 这个组件，
+    // 产物里不会再出现 `wb-card` 这个类名 —— 判据要能认出"用了外壳给的卡壳"。
+    // children 要**往下传**：吞掉的话，卡片体内用 kit 组件写的内容就永远渲染不到（节点数会假少）。
+    components: new Proxy(
+      {},
+      {
+        get: (_target, key) => (props) => {
+          const kids = props?.children;
+          return {
+            type: `stub:${String(key)}`,
+            props: props ?? {},
+            children: kids === undefined ? [] : Array.isArray(kids) ? kids : [kids],
+          };
+        },
+      },
+    ),
     api: new Proxy({}, { get: () => callable }),
     lib: anyStub('lib'),
   };
@@ -114,6 +129,8 @@ function loadFace(clientFile) {
 
 // 递归**调用**函数组件 —— 不调用的话，树里只有最外层那个 `type`，
 // 卡片体内的代码一行都没跑（第一次写漏了这步，4 张卡片都只数出 3 个节点）。
+//
+// 顺手把**用到的类名**收集起来：卡片得自己套外壳的卡片契约类（见文件尾那条判据）。
 function render(node, depth, budget) {
   if (node === null || node === undefined || typeof node === 'boolean') return 0;
   if (typeof node === 'string' || typeof node === 'number') return 1;
@@ -127,6 +144,14 @@ function render(node, depth, budget) {
   budget.left -= 1;
   budget.maxDepth = Math.max(budget.maxDepth, depth);
 
+  const classes = node.props?.className;
+  if (typeof classes === 'string') {
+    for (const one of classes.split(/\s+/)) if (one !== '') budget.classNames.add(one);
+  }
+  if (typeof node.type === 'string' && node.type.startsWith('stub:')) {
+    budget.stubs.add(node.type.slice('stub:'.length));
+  }
+
   const children = [...(node.children ?? [])];
   if (typeof node.type === 'function') {
     if (depth > 40) throw new Error('组件递归超过 40 层（自引用？）');
@@ -217,7 +242,7 @@ for (const pkg of modulePackages()) {
     continue;
   }
 
-  const budget = { left: 20000, maxDepth: 0 };
+  const budget = { left: 20000, maxDepth: 0, classNames: new Set(), stubs: new Set() };
   let count;
   try {
     count = render(tree, 0, budget);
@@ -230,6 +255,20 @@ for (const pkg of modulePackages()) {
     problems.push(`${name}: 卡片只画出一个节点 —— 卡片体没跑（或什么都没画）`);
     continue;
   }
+  // 卡片得**套上外壳给的卡壳**：要么用 `kit.components.Card` 这个组件（推荐、也是 hello 现在的做法），
+  // 要么自己写契约类 `wb-card`（`board.css` 里那条，兄弟模块现在还是这么写的）。
+  //
+  // 用户实测（2026-10-09）："我们的 hello module 怎么不是卡片" —— 面板里那块内容既没有底色也没有
+  // 描边，看着就是标题加一段话。原因是卡片函数没套壳：当时用的是 `wb-view`（那是面板列布局），
+  // 更早那份装进 profile 的产物还自己搓过 `wb-hello*`。两种都查得出来：组件走 stub 名，类名走 classNames。
+  const shelled = budget.classNames.has('wb-card') || budget.stubs.has('Card');
+  if (!shelled) {
+    problems.push(
+      `${name}: 卡片没套外壳的卡壳 —— 用 kit.components.Card（推荐），或自己写契约类 wb-card + ` +
+        `wb-cardBody；裸内容在面板里看起来就"不是一张卡片"`,
+    );
+    continue;
+  }
   rows.push(`${name}: 空数据下画得出 ${count} 个节点（最深 ${budget.maxDepth} 层）`);
 }
 

package/src/checks/style.mjs

@@ -6,9 +6,20 @@ import { discoverModulePackages } from '../discover.mjs';
 const SHELL_SELECTOR = /(^|[\s,>+~])\.wb-[a-z0-9-]+/;
 const RULE = /\.wb-[a-z0-9-]+[^{}]*\{/;
 const CLASS_TOKEN = /(^|[^-\w])\.?(wb-[a-zA-Z0-9-]+)/g;
-const CONTRACT = fileURLToPath(
-  new URL('../../../workbench/src/shared/styles/board.css', import.meta.url),
-);
+// 契约 = 外壳**所有**声明了 `wb-*` 的样式表，不只是那份全局 `board.css`：
+// ADR-0029 要求组件的样式跟组件走，所以 `wb-card` / `wb-rows` / `wb-note` 这些已经搬进
+// `packages/shared/src/components/*.css`（谁渲染谁拥有）。契约跟着搬，模块借用它们才不误报。
+const CONTRACT_FILES = [
+  fileURLToPath(new URL('../../../workbench/src/shared/styles/board.css', import.meta.url)),
+  ...(() => {
+    const dir = fileURLToPath(new URL('../../../shared/src/components', import.meta.url));
+    return existsSync(dir)
+      ? readdirSync(dir)
+          .filter((name) => name.endsWith('.css'))
+          .map((name) => join(dir, name))
+      : [];
+  })(),
+];
 
 function walk(dir, acc = []) {
   for (const entry of readdirSync(dir)) {
@@ -24,9 +35,11 @@ function isTestSource(file) {
   return /(^|[\\/])__tests__[\\/]/.test(file) || /\.test\.[cm]?tsx?$/.test(file);
 }
 
-const contract = existsSync(CONTRACT)
+const contract = CONTRACT_FILES.some((file) => existsSync(file))
   ? new Set(
-      Array.from(readFileSync(CONTRACT, 'utf8').matchAll(CLASS_TOKEN), (match) => match[2]),
+      CONTRACT_FILES.filter((file) => existsSync(file)).flatMap((file) =>
+        Array.from(readFileSync(file, 'utf8').matchAll(CLASS_TOKEN), (match) => match[2]),
+      ),
     )
   : null;
 
@@ -124,7 +137,7 @@ if (borrowed.length > 0) {
 const contractNote =
   contract === null
     ? '契约文件不在（这次只查了"模块不许定义 wb-*"）'
-    : `借用的类都在 board.css 契约里`;
+    : `借用的类都在契约里（board.css + 外壳组件自己的样式表）`;
 console.log(
   `✔ 样式归属清楚：${modules.length} 个模块都没有定义外壳前缀（wb-*）的 CSS 规则；${contractNote}`,
 );