@lmzhen/dsh-evolution-skill-health 0.25.6 → 0.25.8

package/lib/client.js

@@ -74,10 +74,12 @@ window.__ModuleLoader__.load({
 			"line": "位置：{path}",
 			"line.unknown": "位置：未知",
 			"unreadable.note": "读不到内容，因此无法判断（不是「通过」）。",
-			"loading.failed": "读取失败——现在判断不了；点「刷新」重试。"
+			"loading.failed": "读取失败——现在判断不了；点「刷新」重试。",
+			"read.failed": "这次没读到数据（下面一行是原始信息）："
 		};
 		/** English dictionary. */
 		const en = {
+			"read.failed": "This read failed (raw message below):",
 			"entry.label": "Skill Health",
 			"title": "Skill Health",
 			"hint": "What the health engine found, aggregated by rule. A rule whose threshold is not calibrated yet is named without a number; skills that cannot be read are listed as unreadable, never as fine.",
@@ -102,6 +104,64 @@ window.__ModuleLoader__.load({
 			"loading.failed": "Reading failed — this cannot be judged right now; press Refresh to retry."
 		};
 		//#endregion
+		//#region src/client/styles.ts
+		/**
+		* The panel stylesheet. The bundle is built outside the platform CSS-Modules pipeline, so it carries
+		* the text itself and injects one tagged <style> element; the tag id keeps a hot reload from stacking
+		* copies. Only the panel body is styled — the sidebar owns the row and its glyph slot.
+		*
+		* Token discipline (the family gate `verify-client-tokens --strict` enforces it): every `--evo-*` name
+		* below is DECLARED in `packages/scripts/client-tokens.json` — the family scale — and every `--dsw-*`
+		* name is a platform semantic alias (packages/client/ui-theme/src/styles). No type step, space, radius,
+		* hairline or colour is invented here, and no pixel geometry literal appears.
+		*
+		* Metrics are COPIED from the platform’s own components rather than invented, each cited here:
+		*
+		* - hover and current-row fills (`--dsw-alias-interactive-bg-hover`) follow the platform sidebar row
+		*   (client/ui-sidebar/…/SidebarRoot.module.css), as the sibling panel does;
+		* - label steps (`--dsw-alias-label-primary/secondary/tertiary`) and the card hairline
+		*   (`--evo-hairline-width`, the scale’s copy of the platform’s 0.5px card border) come from
+		*   client/ui-chat/…/GenericCommandCard.module.css;
+		* - the control radius (`--evo-radius-control`, the scale’s copy of the platform field radius) comes
+		*   from client/ui-primitives/Input.module.css; the capsule uses `--evo-radius-pill`;
+		* - verdict colours are the platform STATE aliases (state-success / state-warn / state-error) plus the
+		*   scale’s `--evo-tone-quiet`; the validity bar is an inset shadow, not a border-width literal.
+		*
+		* Layout: four verdict cards, then the by-rule table as a grid (rule / skills / count) so numbers sit
+		* on tabular figures and long skill lists wrap into pills instead of ragged comma text.
+		* @module @lmzhen/dsh-evolution-skill-health/client
+		*/
+		/** Tag id for the injected <style>, so a hot reload replaces rather than stacks it. */
+		const CSS_TAG_ID = "dsh-evolution-skill-health";
+		/** The panel stylesheet text. */
+		const CSS = [
+			":where(.dsh-evolution-skill-health) { --evo-type-lg:calc(1em + 2px);--evo-type-body:1em;--evo-type-sm:calc(1em - 1px);--evo-type-xs:calc(1em - 2px);--evo-space-2:2px;--evo-space-4:4px;--evo-space-6:6px;--evo-space-8:8px;--evo-space-10:10px;--evo-space-12:12px;--evo-space-14:14px;--evo-space-16:16px;--evo-space-20:20px;--evo-radius-chip:4px;--evo-radius-control:8px;--evo-radius-surface:12px;--evo-radius-pill:999px;--evo-hairline-width:.5px;--evo-hairline-marker:2px;--evo-measure-read:80ch;--evo-leading-base:1.5;--evo-tone-quiet:var(--dsw-alias-label-secondary);--evo-tone-primary:var(--dsw-alias-brand-primary);--evo-tone-danger:var(--dsw-alias-state-error-primary);--evo-tone-success:var(--dsw-alias-state-success-primary);--evo-focus-ring:2px solid var(--dsw-alias-label-primary);--evo-focus-offset:-2px;--evo-cap-aside:280px;--evo-cap-block:260px }",
+			":where(.dsh-evolution-skill-health) { display: flex; flex-direction: column; gap: var(--evo-space-12); padding: var(--evo-space-16); color: var(--dsw-alias-label-primary); font-size: var(--evo-type-sm); line-height: var(--evo-leading-base); }",
+			":where(.dsh-evolution-skill-health [data-role=\"hint\"]) { margin: 0; color: var(--dsw-alias-label-secondary); }",
+			":where(.dsh-evolution-skill-health [data-role=\"stats\"]) { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--evo-space-8); }",
+			":where(.dsh-evolution-skill-health [data-role=\"stat\"]) { display: flex; flex-direction: column; gap: var(--evo-space-2); padding: var(--evo-space-8) var(--evo-space-10); border: var(--evo-hairline-width) solid var(--dsw-alias-border-l); border-radius: var(--evo-radius-control); }",
+			":where(.dsh-evolution-skill-health [data-role=\"stat\"][data-tone=\"ok\"]) { box-shadow: inset 2px 0 0 var(--dsw-alias-state-success-primary); }",
+			":where(.dsh-evolution-skill-health [data-role=\"stat\"][data-tone=\"warn\"]) { box-shadow: inset 2px 0 0 var(--dsw-alias-state-warn-primary); }",
+			":where(.dsh-evolution-skill-health [data-role=\"stat\"][data-tone=\"error\"]) { box-shadow: inset 2px 0 0 var(--dsw-alias-state-error-primary); }",
+			":where(.dsh-evolution-skill-health [data-role=\"stat\"][data-tone=\"unreadable\"]) { box-shadow: inset 2px 0 0 var(--evo-tone-quiet); }",
+			":where(.dsh-evolution-skill-health [data-role=\"stat-value\"]) { font-size: var(--evo-type-lg); font-variant-numeric: tabular-nums; line-height: 1; }",
+			":where(.dsh-evolution-skill-health [data-role=\"stat-label\"]) { color: var(--dsw-alias-label-tertiary); }",
+			":where(.dsh-evolution-skill-health [data-role=\"group-title\"]) { margin: 0; font-weight: 500; }",
+			":where(.dsh-evolution-skill-health [data-role=\"rule-table\"]) { display: flex; flex-direction: column; border: var(--evo-hairline-width) solid var(--dsw-alias-border-l); border-radius: var(--evo-radius-control); overflow: hidden; }",
+			":where(.dsh-evolution-skill-health [data-role=\"rule-row\"]) { display: grid; grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr) 4rem; gap: var(--evo-space-10); align-items: center; padding: var(--evo-space-6) var(--evo-space-10); border-top: var(--evo-hairline-width) solid var(--dsw-alias-border-l); }",
+			":where(.dsh-evolution-skill-health [data-role=\"rule-row\"][data-tone=\"warn\"]) { box-shadow: inset var(--evo-hairline-marker) 0 0 var(--dsw-alias-state-warn-primary); }",
+			":where(.dsh-evolution-skill-health [data-role=\"rule-row\"][data-tone=\"error\"]) { box-shadow: inset var(--evo-hairline-marker) 0 0 var(--dsw-alias-state-error-primary); }",
+			":where(.dsh-evolution-skill-health [data-role=\"rule-row\"][data-tone=\"unreadable\"]) { box-shadow: inset var(--evo-hairline-marker) 0 0 var(--evo-tone-quiet); }",
+			":where(.dsh-evolution-skill-health [data-role=\"rule-row\"]:hover) { background: var(--dsw-alias-interactive-bg-hover); }",
+			":where(.dsh-evolution-skill-health [data-role=\"rule-row\"]:focus-visible) { outline: var(--evo-focus-ring); outline-offset: var(--evo-focus-offset); }",
+			":where(.dsh-evolution-skill-health [data-role=\"rule-head\"]) { border-top: 0; color: var(--dsw-alias-label-tertiary); }",
+			":where(.dsh-evolution-skill-health [data-role=\"rule-name\"]) { overflow-wrap: anywhere; }",
+			":where(.dsh-evolution-skill-health [data-role=\"rule-count\"]) { text-align: right; font-variant-numeric: tabular-nums; color: var(--dsw-alias-label-secondary); }",
+			":where(.dsh-evolution-skill-health [data-role=\"skills\"]) { display: flex; flex-wrap: wrap; gap: var(--evo-space-4); }",
+			":where(.dsh-evolution-skill-health [data-role=\"skill-pill\"]) { padding: 0 var(--evo-space-6); border: var(--evo-hairline-width) solid var(--dsw-alias-border-l); border-radius: var(--evo-radius-pill); color: var(--dsw-alias-label-secondary); white-space: nowrap; }",
+			":where(.dsh-evolution-skill-health [data-role=\"note\"]) { margin: 0; color: var(--dsw-alias-label-secondary); }"
+		].join(String.fromCharCode(10));
+		//#endregion
 		//#region src/client/Panel.ts
 		/**
 		* The panel body: a four-state summary plus the list aggregated BY RULE.
@@ -134,10 +194,40 @@ window.__ModuleLoader__.load({
 			}
 			return [...table.values()].sort((a, b) => b.skills.length - a.skills.length || a.rule.localeCompare(b.rule));
 		}
-		/** The rule table: name always, count only when the threshold behind it is calibrated. */
+		/** The verdict a rule's row speaks in: the worst one among the skills that carry it. */
+		function worstVerdict(face, skills) {
+			const order = [
+				"error",
+				"warn",
+				"unreadable",
+				"ok"
+			];
+			let worst = "ok";
+			for (const row of face.rows) {
+				if (!skills.includes(row.name)) continue;
+				if (order.indexOf(row.verdict) < order.indexOf(worst)) worst = row.verdict;
+			}
+			return worst;
+		}
+		/** The rule table: a grid so counts line up, with a tone bar per row and skill pills. */
 		function ruleTable(face, t) {
 			const rows = byRule(face.rows);
-			return (0, react.createElement)("table", null, (0, react.createElement)("thead", null, (0, react.createElement)("tr", null, (0, react.createElement)("th", null, t("col.rule")), (0, react.createElement)("th", null, t("col.skills")), (0, react.createElement)("th", null, t("col.count")))), (0, react.createElement)("tbody", null, rows.map((entry) => (0, react.createElement)("tr", { key: entry.rule }, (0, react.createElement)("td", null, entry.rule), (0, react.createElement)("td", null, entry.skills.join(", ")), (0, react.createElement)("td", null, entry.count === 0 ? t("count.notCalibrated") : String(entry.count))))));
+			const cell = (role, children, key) => (0, react.createElement)("div", key === void 0 ? { "data-role": role } : {
+				"data-role": role,
+				key
+			}, children);
+			return (0, react.createElement)("div", { "data-role": "rule-table" }, (0, react.createElement)("div", {
+				"data-role": "rule-row",
+				"data-role-head": "true"
+			}, (0, react.createElement)("div", { "data-role": "rule-name" }, t("col.rule")), (0, react.createElement)("div", { "data-role": "skills" }, t("col.skills")), (0, react.createElement)("div", { "data-role": "rule-count" }, t("col.count"))), rows.map((entry) => (0, react.createElement)("div", {
+				key: entry.rule,
+				"data-role": "rule-row",
+				"data-tone": worstVerdict(face, entry.skills)
+			}, cell("rule-name", entry.rule), cell("skills", entry.skills.map((name, i) => (0, react.createElement)("span", {
+				"data-role": "skill-pill",
+				key: name + ":" + String(i),
+				title: name
+			}, name))), cell("rule-count", entry.count === 0 ? t("count.notCalibrated") : String(entry.count)))));
 		}
 		/**
 		* Render the panel.
@@ -168,28 +258,17 @@ window.__ModuleLoader__.load({
 				};
 			}, [face]);
 			const counts = new Map(KINDS.map((kind) => [kind, view.rows.filter((row) => row.verdict === kind).length]));
-			return (0, react.createElement)("section", null, (0, react.createElement)("p", null, t("counts").replace("{ok}", String(counts.get("ok") ?? 0)).replace("{warn}", String(counts.get("warn") ?? 0)).replace("{error}", String(counts.get("error") ?? 0)).replace("{unreadable}", String(counts.get("unreadable") ?? 0))), view.truncated ? (0, react.createElement)("p", null, t("loading.failed")) : null, failed === void 0 ? null : (0, react.createElement)("p", null, failed), view.rows.length === 0 ? (0, react.createElement)("p", null, t("empty.noneReported")) : null, (0, react.createElement)("h3", null, t("group.byRule")), ruleTable(view, t), view.rows.filter((row) => row.verdict === "unreadable").map((row) => (0, react.createElement)("p", { key: row.name + ":unreadable" }, row.name + " — " + t("unreadable.note"))));
+			const stats = (0, react.createElement)("div", { "data-role": "stats" }, KINDS.map((kind) => (0, react.createElement)("div", {
+				key: kind,
+				"data-role": "stat",
+				"data-tone": kind
+			}, (0, react.createElement)("div", { "data-role": "stat-value" }, String(counts.get(kind) ?? 0)), (0, react.createElement)("div", { "data-role": "stat-label" }, t("verdict." + kind)))));
+			return (0, react.createElement)("section", { className: CSS_TAG_ID }, (0, react.createElement)("p", { "data-role": "hint" }, t("hint")), stats, view.truncated ? (0, react.createElement)("p", { "data-role": "note" }, t("loading.failed")) : null, failed === void 0 ? null : (0, react.createElement)("p", { "data-role": "note" }, t("read.failed") + " " + failed), view.rows.length === 0 ? (0, react.createElement)("p", { "data-role": "note" }, t("empty.noneReported")) : null, (0, react.createElement)("h3", { "data-role": "group-title" }, t("group.byRule")), ruleTable(view, t), view.rows.filter((row) => row.verdict === "unreadable").map((row) => (0, react.createElement)("p", {
+				key: row.name + ":unreadable",
+				"data-role": "note"
+			}, row.name + " — " + t("unreadable.note"))));
 		}
 		//#endregion
-		//#region src/client/styles.ts
-		/**
-		* The panel stylesheet. The bundle is built outside the platform CSS-Modules pipeline, so it carries
-		* the text itself and injects one tagged <style> element; the tag id keeps a hot reload from stacking
-		* copies. Only the panel body is styled — the sidebar owns the row and its glyph slot.
-		*
-		* Every value comes from the generated family scale (`./tokens.ts`), so this file carries no literal.
-		* @module @lmzhen/dsh-evolution-skill-health/client
-		*/
-		/** Tag id for the injected <style>, so a hot reload replaces rather than stacks it. */
-		const CSS_TAG_ID = "dsh-evolution-skill-health";
-		/** The panel stylesheet text. */
-		const CSS = [
-			":where(.dsh-evolution-skill-health) { display: flex; flex-direction: column; gap: var(--evo-space-8); padding: var(--evo-space-12); }",
-			":where(.dsh-evolution-skill-health) { --evo-type-lg:calc(1em + 2px);--evo-type-body:1em;--evo-type-sm:calc(1em - 1px);--evo-type-xs:calc(1em - 2px);--evo-space-2:2px;--evo-space-4:4px;--evo-space-6:6px;--evo-space-8:8px;--evo-space-10:10px;--evo-space-12:12px;--evo-space-14:14px;--evo-space-16:16px;--evo-space-20:20px;--evo-radius-chip:4px;--evo-radius-control:8px;--evo-radius-surface:12px;--evo-radius-pill:999px;--evo-hairline-width:.5px;--evo-hairline-marker:2px;--evo-measure-read:80ch;--evo-leading-base:1.5;--evo-tone-quiet:var(--dsw-alias-label-secondary);--evo-tone-primary:var(--dsw-alias-brand-primary);--evo-tone-danger:var(--dsw-alias-state-error-primary);--evo-tone-success:var(--dsw-alias-state-success-primary);--evo-focus-ring:2px solid var(--dsw-alias-label-primary);--evo-focus-offset:-2px;--evo-cap-aside:280px;--evo-cap-block:260px }",
-			":where(.dsh-evolution-skill-health [data-role=\"row\"]) { display: flex; align-items: baseline; justify-content: space-between; gap: var(--evo-space-8); border-bottom: var(--evo-hairline-width) solid var(--evo-tone-quiet); }",
-			":where(.dsh-evolution-skill-health [data-role=\"note\"]) { color: var(--evo-tone-quiet); }"
-		].join(String.fromCharCode(10));
-		//#endregion
 		//#region src/client/index.ts
 		/** Required client services: the slot registry and the locale seat. */
 		const inject = ["slots", "locale"];

package/lib/types/client/styles.d.ts

@@ -3,7 +3,25 @@
  * the text itself and injects one tagged <style> element; the tag id keeps a hot reload from stacking
  * copies. Only the panel body is styled — the sidebar owns the row and its glyph slot.
  *
- * Every value comes from the generated family scale (`./tokens.ts`), so this file carries no literal.
+ * Token discipline (the family gate `verify-client-tokens --strict` enforces it): every `--evo-*` name
+ * below is DECLARED in `packages/scripts/client-tokens.json` — the family scale — and every `--dsw-*`
+ * name is a platform semantic alias (packages/client/ui-theme/src/styles). No type step, space, radius,
+ * hairline or colour is invented here, and no pixel geometry literal appears.
+ *
+ * Metrics are COPIED from the platform’s own components rather than invented, each cited here:
+ *
+ * - hover and current-row fills (`--dsw-alias-interactive-bg-hover`) follow the platform sidebar row
+ *   (client/ui-sidebar/…/SidebarRoot.module.css), as the sibling panel does;
+ * - label steps (`--dsw-alias-label-primary/secondary/tertiary`) and the card hairline
+ *   (`--evo-hairline-width`, the scale’s copy of the platform’s 0.5px card border) come from
+ *   client/ui-chat/…/GenericCommandCard.module.css;
+ * - the control radius (`--evo-radius-control`, the scale’s copy of the platform field radius) comes
+ *   from client/ui-primitives/Input.module.css; the capsule uses `--evo-radius-pill`;
+ * - verdict colours are the platform STATE aliases (state-success / state-warn / state-error) plus the
+ *   scale’s `--evo-tone-quiet`; the validity bar is an inset shadow, not a border-width literal.
+ *
+ * Layout: four verdict cards, then the by-rule table as a grid (rule / skills / count) so numbers sit
+ * on tabular figures and long skill lists wrap into pills instead of ragged comma text.
  * @module @lmzhen/dsh-evolution-skill-health/client
  */
 /** Tag id for the injected <style>, so a hot reload replaces rather than stacks it. */

package/package.json

@@ -11,7 +11,7 @@
       ]
     }
   },
-  "version": "0.25.6",
+  "version": "0.25.8",
   "publishConfig": {
     "access": "public"
   },
@@ -43,13 +43,13 @@
     "@deepseek-ai/cordis": "^4.0.1",
     "@deepseek-ai/dsh-host-webserver": "^0.2.0-rc.1",
     "react": "^18.2.0",
-    "@lmzhen/dsh-evolution-curator": "^0.25.6"
+    "@lmzhen/dsh-evolution-curator": "^0.25.8"
   },
   "devDependencies": {
     "@deepseek-ai/cordis": "^4.0.1",
     "@deepseek-ai/dsh-host-webserver": "^0.2.0-rc.1",
     "@types/react": "~18.3.1",
     "react": "^18.2.0",
-    "@lmzhen/dsh-evolution-curator": "^0.25.6"
+    "@lmzhen/dsh-evolution-curator": "^0.25.8"
   }
 }