@lmzhen/dsh-evolution-skill-health 0.25.3 → 0.25.5

package/lib/client.js

@@ -5,6 +5,36 @@ window.__ModuleLoader__.load({
 		var exports = module.exports;
 		Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 		let react = require("react");
+		//#region src/client/api.ts
+		/** Route paths, mirrored from the host half. */
+		const HOST_ROUTES = { rows: "/api/dsh-evolution/skill-health/rows" };
+		/**
+		* Read the scan result.
+		* @returns the payload, or the host's own refusal sentence.
+		*/
+		async function rows() {
+			try {
+				const response = await fetch(HOST_ROUTES.rows, { headers: { accept: "application/json" } });
+				const body = await response.json();
+				if (!response.ok) return {
+					ok: false,
+					message: body.message ?? "skill-health: the route refused the request"
+				};
+				return {
+					ok: true,
+					payload: {
+						rows: body.rows ?? [],
+						truncated: body.truncated === true
+					}
+				};
+			} catch (error) {
+				return {
+					ok: false,
+					message: "skill-health: " + String(error)
+				};
+			}
+		}
+		//#endregion
 		//#region src/client/seam.ts
 		/** The panel id. The row and the `main` body MUST share it: the sidebar resolves the body by it. */
 		const PANEL_ID = "skill-health";
@@ -116,10 +146,50 @@ window.__ModuleLoader__.load({
 		*/
 		function SkillHealthPanel(props) {
 			const t = props.locale.bind("evolution-skill-health");
-			const counts = new Map(KINDS.map((kind) => [kind, props.face.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))), props.face.truncated ? (0, react.createElement)("p", null, t("loading.failed")) : null, props.face.rows.length === 0 ? (0, react.createElement)("p", null, t("empty.noneReported")) : null, (0, react.createElement)("h3", null, t("group.byRule")), ruleTable(props.face, t), props.face.rows.filter((row) => row.verdict === "unreadable").map((row) => (0, react.createElement)("p", { key: row.name + ":unreadable" }, row.name + " — " + t("unreadable.note"))));
+			const [face, setFace] = (0, react.useState)(props.face);
+			const [failed, setFailed] = (0, react.useState)(void 0);
+			(0, react.useEffect)(() => {
+				const load = props.face.loadRows;
+				if (load === void 0) return;
+				let live = true;
+				load().then((outcome) => {
+					if (!live) return;
+					if (outcome.ok) setFace({
+						...props.face,
+						rows: outcome.payload.rows,
+						truncated: outcome.payload.truncated
+					});
+					else setFailed(outcome.message);
+				}).catch((error) => {
+					if (live) setFailed(String(error));
+				});
+				return () => {
+					live = false;
+				};
+			}, [props.face]);
+			const counts = new Map(KINDS.map((kind) => [kind, face.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))), face.truncated ? (0, react.createElement)("p", null, t("loading.failed")) : null, failed === void 0 ? null : (0, react.createElement)("p", null, failed), face.rows.length === 0 ? (0, react.createElement)("p", null, t("empty.noneReported")) : null, (0, react.createElement)("h3", null, t("group.byRule")), ruleTable(face, t), face.rows.filter((row) => row.verdict === "unreadable").map((row) => (0, react.createElement)("p", { key: row.name + ":unreadable" }, 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"];
@@ -127,6 +197,26 @@ window.__ModuleLoader__.load({
 		* Register the row and the body.
 		* @param ctx - the client context; it must carry the two seats above.
 		*/
+		/**
+		* The row glyph. The sidebar hands every `sidebar.panellist` occupant `{ size, active }` and owns the
+		* slot around it, so this is a plain line glyph drawn in `currentColor`.
+		* @param props - the seat-provided size and active flag.
+		* @returns the glyph element.
+		*/
+		function PanelIcon(props = {}) {
+			const size = typeof props.size === "number" && props.size > 0 ? props.size : 16;
+			return (0, react.createElement)("svg", {
+				"aria-hidden": "true",
+				width: String(size),
+				height: String(size),
+				viewBox: "0 0 16 16",
+				fill: "none",
+				stroke: "currentColor",
+				strokeWidth: "1.5",
+				strokeLinecap: "round",
+				strokeLinejoin: "round"
+			}, (0, react.createElement)("path", { d: "M2 8h3l1.5-3.5L9 11.5 10.5 8H14" }));
+		}
 		function apply(ctx) {
 			const seam = ctx;
 			let registered = false;
@@ -143,6 +233,18 @@ window.__ModuleLoader__.load({
 					return () => {};
 				}
 			}, "evolution-skill-health: locale");
+			ctx.effect(() => {
+				if (document.querySelector("style[data-plugin-css=\"dsh-evolution-skill-health\"]") === null) {
+					const tag = document.createElement("style");
+					tag.setAttribute("data-plugin-css", CSS_TAG_ID);
+					tag.textContent = CSS;
+					document.head.append(tag);
+					return () => {
+						tag.remove();
+					};
+				}
+				return () => {};
+			}, "evolution-skill-health: styles");
 			const label = () => {
 				const fallback = zh["entry.label"] ?? "技能健康";
 				if (!registered) return fallback;
@@ -158,13 +260,14 @@ window.__ModuleLoader__.load({
 					id: PANEL_ID,
 					order: 40,
 					label
-				}, () => (0, react.createElement)("span", null, label()));
+				}, PanelIcon);
 				yield seam.slots.register({
 					name: "main",
 					key: PANEL_ID,
 					inject: () => ({
 						rows: [],
-						truncated: false
+						truncated: false,
+						loadRows: rows
 					})
 				}, (props) => (0, react.createElement)(SkillHealthPanel, {
 					face: props.face,

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

@@ -8,6 +8,7 @@
  * @module @lmzhen/dsh-evolution-skill-health/client
  */
 import { type ReactNode } from 'react';
+import type { HealthOutcome } from './api.ts';
 import type { LocaleSeat } from './seam.ts';
 /** One finding, as the host reports it: `line` is null when the position cannot be named. */
 export interface HealthFinding {
@@ -30,6 +31,8 @@ export interface HealthFace {
     truncated: boolean;
     /** Opens the skill-history panel for one skill, when that panel is present. */
     openHistory?: (name: string) => void;
+    /** Reads the scan result from the host route. Absent faces render their seeded rows unchanged. */
+    loadRows?: () => Promise<HealthOutcome>;
 }
 /**
  * Render the panel.

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

@@ -0,0 +1,33 @@
+/**
+ * The host route this bundle reads, and the ONE place a request is made.
+ *
+ * The path mirrors the host half's `ROUTES.rows` in `src/routes.ts` (a spec asserts the two sides
+ * agree). A refusal arrives as `ok:false` with the host's own sentence, so the panel shows what the
+ * route actually said instead of inventing a second vocabulary.
+ * @module @lmzhen/dsh-evolution-skill-health/client
+ */
+import type { HealthRow } from './Panel.ts';
+/** Route paths, mirrored from the host half. */
+export declare const HOST_ROUTES: {
+    readonly rows: "/api/dsh-evolution/skill-health/rows";
+};
+/** One scan result, as the route reports it. */
+export interface HealthPayload {
+    rows: HealthRow[];
+    /** True when the host could not finish the scan: the counts below are then a lower bound. */
+    truncated: boolean;
+}
+/** Either the payload or the host's refusal sentence — never a thrown error the panel must guess at. */
+export type HealthOutcome = {
+    ok: true;
+    payload: HealthPayload;
+} | {
+    ok: false;
+    message: string;
+};
+/**
+ * Read the scan result.
+ * @returns the payload, or the host's own refusal sentence.
+ */
+export declare function rows(): Promise<HealthOutcome>;
+//# sourceMappingURL=api.d.ts.map

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

@@ -12,9 +12,5 @@ import { type HealthFace } from './Panel.ts';
 export declare const inject: string[];
 /** The host half hands the panel a way to read its rows (a read-only route on the host side). */
 export type HealthFaceLoader = () => Promise<HealthFace>;
-/**
- * Register the row and the body.
- * @param ctx - the client context; it must carry the two seats above.
- */
 export declare function apply(ctx: ClientContext): void;
 //# sourceMappingURL=index.d.ts.map

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

@@ -40,7 +40,7 @@ export interface LocaleSeat {
 /** The slot registry: a generator body may register (and is disposed when it unmounts). */
 export interface SlotsSeat {
     inject(name: string, body: () => Generator<() => void, void, void>): void;
-    register(options: PanelRowOptions | PanelBodyOptions, component: (props: unknown) => ReactNode): () => void;
+    register(options: PanelRowOptions | PanelBodyOptions, component: (props: never) => ReactNode): () => void;
 }
 /** Everything this bundle asks the shell for. */
 export interface ClientSeam {

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

@@ -0,0 +1,13 @@
+/**
+ * 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. */
+export declare const CSS_TAG_ID = "dsh-evolution-skill-health";
+/** The panel stylesheet text. */
+export declare const CSS: string;
+//# sourceMappingURL=styles.d.ts.map

package/package.json

@@ -11,7 +11,7 @@
       ]
     }
   },
-  "version": "0.25.3",
+  "version": "0.25.5",
   "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.3"
+    "@lmzhen/dsh-evolution-curator": "^0.25.5"
   },
   "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.3"
+    "@lmzhen/dsh-evolution-curator": "^0.25.5"
   }
 }