@sparkelf/dsh-client-ui-skill-center 0.2.0-rc.14 → 0.2.0-rc.16

package/lib/client.js

@@ -4,11 +4,11 @@ window.__ModuleLoader__.load({
 		var module = { exports: {} };
 		var exports = module.exports;
 		Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+		let react_jsx_runtime = require("react/jsx-runtime");
 		let react = require("react");
 		let _deepseek_ai_dsh_client_ui_primitives = require("@deepseek-ai/dsh-client-ui-primitives");
-		let react_jsx_runtime = require("react/jsx-runtime");
 		//#region \0dsh-css:/root/projects/deepseek-harness-plus/packages/plus/ui-skill-center/src/client/SkillCenterPage.module.css.mjs
-		const css = ".DGiSta_page{box-sizing:border-box;height:100%;color:var(--dsw-alias-label-primary);flex-direction:column;align-items:center;gap:32px;padding:28px clamp(24px,4vw,48px) 48px;display:flex;overflow:auto}.DGiSta_page>*{width:100%;max-width:960px}.DGiSta_pageHead{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.DGiSta_pageTitle{margin:0;font-size:20px;font-weight:500;line-height:28px}.DGiSta_pageIntro{color:var(--dsw-alias-label-secondary);margin:4px 0 0;font-size:13px;line-height:20px}.DGiSta_toolbar{justify-content:flex-end;align-items:center;gap:16px;display:flex}.DGiSta_iconButton{width:28px;height:28px;color:var(--dsw-alias-label-caption);cursor:pointer;background:0 0;border:0;border-radius:28px;justify-content:center;align-items:center;display:inline-flex}.DGiSta_iconButton:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-secondary)}.DGiSta_iconButton:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:1px}.DGiSta_iconWrap{display:inline-flex}.DGiSta_button{border:.5px solid var(--dsw-alias-border-l3);height:32px;color:var(--dsw-alias-label-primary);cursor:pointer;background:0 0;border-radius:8px;padding:0 12px;font-size:13px}.DGiSta_button:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}.DGiSta_button:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:1px}.DGiSta_search{box-sizing:border-box;border:.5px solid var(--dsw-alias-border-l3);width:100%;height:36px;color:var(--dsw-alias-label-primary);background:0 0;border-radius:10px;padding:0 12px;font-size:13px}.DGiSta_search::placeholder{color:var(--dsw-alias-label-tertiary)}.DGiSta_group{margin-top:32px}.DGiSta_groupTitle{align-items:baseline;gap:8px;margin:0 0 4px;font-size:15px;font-weight:500;line-height:22px;display:flex}.DGiSta_groupCount{color:var(--dsw-alias-label-tertiary);font-size:13px;font-weight:400}.DGiSta_groupHint{color:var(--dsw-alias-label-caption);font-size:12px;font-weight:400}.DGiSta_cards{margin:0;padding:0;list-style:none}.DGiSta_card{border-radius:12px;min-width:0;margin:0 -8px}.DGiSta_card:hover{background:var(--dsw-alias-interactive-bg-hover)}.DGiSta_cardHead{align-items:center;gap:14px;padding:8px;display:flex}.DGiSta_cardIcon{border:.5px solid var(--dsw-alias-border-l3);width:48px;height:48px;color:var(--dsw-alias-label-secondary);border-radius:10px;flex:none;justify-content:center;align-items:center;display:inline-flex}.DGiSta_cardMain{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.DGiSta_cardTitle{text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:500;line-height:20px;overflow:hidden}.DGiSta_cardDesc{color:var(--dsw-alias-label-secondary);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:13px;line-height:18px;display:-webkit-box;overflow:hidden}.DGiSta_cardWhenToUse{color:var(--dsw-alias-label-caption);font-size:12px;line-height:18px}.DGiSta_cardMarks{flex-wrap:wrap;gap:6px;margin-top:2px;display:flex}.DGiSta_mark{border:.5px solid var(--dsw-alias-border-l3);color:var(--dsw-alias-label-tertiary);border-radius:4px;padding:1px 6px;font-size:11px;line-height:16px}.DGiSta_markOn{border-color:var(--dsw-alias-state-business-primary);color:var(--dsw-alias-state-business-primary)}.DGiSta_markOff{border-color:var(--dsw-alias-border-l4);color:var(--dsw-alias-label-caption)}.DGiSta_markDanger{border-color:var(--dsw-alias-state-error-primary);color:var(--dsw-alias-state-error-primary)}.DGiSta_cardEnd{flex:none;align-items:center;gap:8px;display:flex}.DGiSta_switch{background:var(--dsw-alias-border-l3);cursor:pointer;border:none;border-radius:10px;width:36px;height:20px;transition:background .12s;position:relative}.DGiSta_switch:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:1px}.DGiSta_switchOn{background:var(--dsw-alias-state-success-primary)}.DGiSta_switch:after{content:\"\";background:var(--dsw-alias-bg-layer-1);border-radius:50%;width:16px;height:16px;transition:transform .12s;position:absolute;top:2px;left:2px}.DGiSta_switchOn:after{transform:translate(16px)}.DGiSta_dialog{width:min(560px,100%)}.DGiSta_form{flex-direction:column;gap:12px;display:flex}.DGiSta_field{flex-direction:column;gap:4px;display:flex}.DGiSta_fieldLabel{color:var(--dsw-alias-label-secondary);font-size:12px;line-height:18px}.DGiSta_input{box-sizing:border-box;border:.5px solid var(--dsw-alias-border-l3);height:32px;color:var(--dsw-alias-label-primary);background:0 0;border-radius:8px;padding:0 10px;font-size:13px}.DGiSta_textarea{box-sizing:border-box;border:.5px solid var(--dsw-alias-border-l3);min-height:80px;color:var(--dsw-alias-label-primary);font-family:var(--dsw-font-markdown-code-block-small);resize:vertical;background:0 0;border-radius:8px;padding:8px 10px;font-size:12px}.DGiSta_status{text-align:center;color:var(--dsw-alias-label-tertiary);padding:32px 0;font-size:13px}.DGiSta_statusError{color:var(--dsw-alias-state-error-primary)}";
+		const css = ".DGiSta_page{box-sizing:border-box;height:100%;color:var(--dsw-alias-label-primary);flex-direction:column;align-items:center;gap:32px;padding:28px clamp(24px,4vw,48px) 48px;display:flex;overflow:auto}.DGiSta_page>*{width:100%;max-width:960px}.DGiSta_pageHead{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.DGiSta_pageTitle{margin:0;font-size:20px;font-weight:500;line-height:28px}.DGiSta_pageIntro{color:var(--dsw-alias-label-secondary);margin:4px 0 0;font-size:13px;line-height:20px}.DGiSta_toolbar{justify-content:flex-end;align-items:center;gap:16px;display:flex}.DGiSta_iconButton{width:28px;height:28px;color:var(--dsw-alias-label-caption);cursor:pointer;background:0 0;border:0;border-radius:28px;justify-content:center;align-items:center;display:inline-flex}.DGiSta_iconButton:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-secondary)}.DGiSta_iconButton:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:1px}.DGiSta_iconWrap{display:inline-flex}.DGiSta_button{border:.5px solid var(--dsw-alias-border-l3);height:32px;color:var(--dsw-alias-label-primary);cursor:pointer;background:0 0;border-radius:8px;padding:0 12px;font-size:13px}.DGiSta_button:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}.DGiSta_button:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:1px}.DGiSta_search{box-sizing:border-box;border:.5px solid var(--dsw-alias-border-l3);width:100%;height:36px;color:var(--dsw-alias-label-primary);background:0 0;border-radius:10px;padding:0 12px;font-size:13px}.DGiSta_search::placeholder{color:var(--dsw-alias-label-tertiary)}.DGiSta_group{margin-top:32px}.DGiSta_groupTitle{align-items:baseline;gap:8px;margin:0 0 4px;font-size:15px;font-weight:500;line-height:22px;display:flex}.DGiSta_groupCount{color:var(--dsw-alias-label-tertiary);font-size:13px;font-weight:400}.DGiSta_groupHint{color:var(--dsw-alias-label-caption);font-size:12px;font-weight:400}.DGiSta_cards{margin:0;padding:0;list-style:none}.DGiSta_card{border-radius:12px;min-width:0;margin:0 -8px}.DGiSta_card:hover{background:var(--dsw-alias-interactive-bg-hover)}.DGiSta_cardHead{align-items:center;gap:14px;padding:8px;display:flex}.DGiSta_cardIcon{border:.5px solid var(--dsw-alias-border-l3);width:48px;height:48px;color:var(--dsw-alias-label-secondary);border-radius:10px;flex:none;justify-content:center;align-items:center;display:inline-flex}.DGiSta_cardForeign{opacity:.72}.DGiSta_cardMain{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.DGiSta_workspaceBadge{background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-secondary);vertical-align:middle;border-radius:4px;margin-left:8px;padding:1px 6px;font-size:11px;font-weight:400;line-height:16px}.DGiSta_cardTitle{text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:500;line-height:20px;overflow:hidden}.DGiSta_cardDesc{color:var(--dsw-alias-label-secondary);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:13px;line-height:18px;display:-webkit-box;overflow:hidden}.DGiSta_cardWhenToUse{color:var(--dsw-alias-label-caption);font-size:12px;line-height:18px}.DGiSta_cardMarks{flex-wrap:wrap;gap:6px;margin-top:2px;display:flex}.DGiSta_mark{border:.5px solid var(--dsw-alias-border-l3);color:var(--dsw-alias-label-tertiary);border-radius:4px;padding:1px 6px;font-size:11px;line-height:16px}.DGiSta_markOn{border-color:var(--dsw-alias-state-business-primary);color:var(--dsw-alias-state-business-primary)}.DGiSta_markOff{border-color:var(--dsw-alias-border-l4);color:var(--dsw-alias-label-caption)}.DGiSta_markDanger{border-color:var(--dsw-alias-state-error-primary);color:var(--dsw-alias-state-error-primary)}.DGiSta_cardEnd{flex:none;align-items:center;gap:8px;display:flex}.DGiSta_switch{background:var(--dsw-alias-border-l3);cursor:pointer;border:none;border-radius:10px;width:36px;height:20px;transition:background .12s;position:relative}.DGiSta_switch:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:1px}.DGiSta_switchOn{background:var(--dsw-alias-state-success-primary)}.DGiSta_switch:after{content:\"\";background:var(--dsw-alias-bg-layer-1);border-radius:50%;width:16px;height:16px;transition:transform .12s;position:absolute;top:2px;left:2px}.DGiSta_switchOn:after{transform:translate(16px)}.DGiSta_dialog{width:min(560px,100%)}.DGiSta_form{flex-direction:column;gap:12px;display:flex}.DGiSta_field{flex-direction:column;gap:4px;display:flex}.DGiSta_fieldLabel{color:var(--dsw-alias-label-secondary);font-size:12px;line-height:18px}.DGiSta_input{box-sizing:border-box;border:.5px solid var(--dsw-alias-border-l3);height:32px;color:var(--dsw-alias-label-primary);background:0 0;border-radius:8px;padding:0 10px;font-size:13px}.DGiSta_textarea{box-sizing:border-box;border:.5px solid var(--dsw-alias-border-l3);min-height:80px;color:var(--dsw-alias-label-primary);font-family:var(--dsw-font-markdown-code-block-small);resize:vertical;background:0 0;border-radius:8px;padding:8px 10px;font-size:12px}.DGiSta_status{text-align:center;color:var(--dsw-alias-label-tertiary);padding:32px 0;font-size:13px}.DGiSta_statusError{color:var(--dsw-alias-state-error-primary)}";
 		const tagId = "@sparkelf/dsh-client-ui-skill-center/SkillCenterPage.module.css";
 		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId) + "]") === null) {
 			const tag = document.createElement("style");
@@ -22,6 +22,7 @@ window.__ModuleLoader__.load({
 			"card": "DGiSta_card",
 			"cardDesc": "DGiSta_cardDesc",
 			"cardEnd": "DGiSta_cardEnd",
+			"cardForeign": "DGiSta_cardForeign",
 			"cardHead": "DGiSta_cardHead",
 			"cardIcon": "DGiSta_cardIcon",
 			"cardMain": "DGiSta_cardMain",
@@ -54,10 +55,11 @@ window.__ModuleLoader__.load({
 			"switch": "DGiSta_switch",
 			"switchOn": "DGiSta_switchOn",
 			"textarea": "DGiSta_textarea",
-			"toolbar": "DGiSta_toolbar"
+			"toolbar": "DGiSta_toolbar",
+			"workspaceBadge": "DGiSta_workspaceBadge"
 		};
 		//#endregion
-		//#region src/client/api.ts
+		//#region lib/types/client/api.js
 		/**
 		* Skill center API client. Talks to the host route family over same-origin
 		* fetch; the host owns the trust fence.
@@ -129,7 +131,7 @@ window.__ModuleLoader__.load({
 			}
 		};
 		//#endregion
-		//#region src/client/SkillCenterPage.tsx
+		//#region lib/types/client/SkillCenterPage.js
 		/**
 		* Skill center page. Browses the loaded skills grouped by source, toggles model
 		* invocation, creates a skill, and deletes one into a recoverable trash.
@@ -145,9 +147,9 @@ window.__ModuleLoader__.load({
 		* @returns the labelled field.
 		*/
 		function DraftField({ label, children }) {
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			return (0, react_jsx_runtime.jsxs)("div", {
 				className: SkillCenterPage_module_css_default.field,
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				children: [(0, react_jsx_runtime.jsx)("span", {
 					className: SkillCenterPage_module_css_default.fieldLabel,
 					children: label
 				}), children]
@@ -159,42 +161,45 @@ window.__ModuleLoader__.load({
 		* @returns the row.
 		*/
 		function SkillCard({ skill, t, onToggle, onDelete }) {
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", {
-				className: SkillCenterPage_module_css_default.card,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			return (0, react_jsx_runtime.jsx)("li", {
+				className: skill.isActiveWorkspace === false && skill.workspaceName !== void 0 ? SkillCenterPage_module_css_default.card + " " + SkillCenterPage_module_css_default.cardForeign : SkillCenterPage_module_css_default.card,
+				children: (0, react_jsx_runtime.jsxs)("div", {
 					className: SkillCenterPage_module_css_default.cardHead,
 					children: [
-						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						(0, react_jsx_runtime.jsx)("span", {
 							className: SkillCenterPage_module_css_default.cardIcon,
-							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconSkillOutline16, { size: 22 })
+							children: (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconSkillOutline16, { size: 22 })
 						}),
-						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						(0, react_jsx_runtime.jsxs)("div", {
 							className: SkillCenterPage_module_css_default.cardMain,
 							children: [
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								(0, react_jsx_runtime.jsxs)("div", {
 									className: SkillCenterPage_module_css_default.cardTitle,
-									children: skill.name
+									children: [skill.name, skill.workspaceName === void 0 ? null : (0, react_jsx_runtime.jsx)("span", {
+										className: SkillCenterPage_module_css_default.workspaceBadge,
+										children: skill.workspaceName
+									})]
 								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								(0, react_jsx_runtime.jsx)("div", {
 									className: SkillCenterPage_module_css_default.cardDesc,
 									children: skill.description
 								}),
-								skill.whenToUse === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								skill.whenToUse === void 0 ? null : (0, react_jsx_runtime.jsx)("div", {
 									className: SkillCenterPage_module_css_default.cardWhenToUse,
 									children: skill.whenToUse
 								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								(0, react_jsx_runtime.jsxs)("div", {
 									className: SkillCenterPage_module_css_default.cardMarks,
 									children: [
-										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										(0, react_jsx_runtime.jsx)("span", {
 											className: skill.modelInvocable ? SkillCenterPage_module_css_default.mark + " " + SkillCenterPage_module_css_default.markOn : SkillCenterPage_module_css_default.mark + " " + SkillCenterPage_module_css_default.markOff,
 											children: t("skill.modelInvocable")
 										}),
-										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										(0, react_jsx_runtime.jsx)("span", {
 											className: skill.userInvocable ? SkillCenterPage_module_css_default.mark + " " + SkillCenterPage_module_css_default.markOn : SkillCenterPage_module_css_default.mark + " " + SkillCenterPage_module_css_default.markOff,
 											children: t("skill.userInvocable")
 										}),
-										skill.linked === true ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										skill.linked === true ? (0, react_jsx_runtime.jsx)("span", {
 											className: SkillCenterPage_module_css_default.mark + " " + SkillCenterPage_module_css_default.markDanger,
 											children: t("skill.linked")
 										}) : null
@@ -202,9 +207,9 @@ window.__ModuleLoader__.load({
 								})
 							]
 						}),
-						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						(0, react_jsx_runtime.jsxs)("div", {
 							className: SkillCenterPage_module_css_default.cardEnd,
-							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							children: [(0, react_jsx_runtime.jsx)("button", {
 								type: "button",
 								className: skill.modelInvocable ? SkillCenterPage_module_css_default.switch + " " + SkillCenterPage_module_css_default.switchOn : SkillCenterPage_module_css_default.switch,
 								"aria-label": skill.modelInvocable ? t("skill.disabled") : t("skill.enabled"),
@@ -212,7 +217,7 @@ window.__ModuleLoader__.load({
 								onClick: () => {
 									onToggle(skill, !skill.modelInvocable);
 								}
-							}), skill.path === void 0 || skill.linked === true ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							}), skill.path === void 0 || skill.linked === true ? null : (0, react_jsx_runtime.jsx)("button", {
 								type: "button",
 								className: SkillCenterPage_module_css_default.button,
 								onClick: () => {
@@ -227,10 +232,10 @@ window.__ModuleLoader__.load({
 		}
 		/**
 		* The skill center panel.
-		* @param props - the slot's runtime share, providing the dictionary resolver.
+		* @param props - the slot's runtime share: the dictionary resolver and the workspace rows.
 		* @returns the rendered panel.
 		*/
-		function SkillCenterPage({ t }) {
+		function SkillCenterPage({ t, ...runtime }) {
 			const api = (0, react.useMemo)(() => new SkillApi(), []);
 			const [state, setState] = (0, react.useState)({ kind: "loading" });
 			const [query, setQuery] = (0, react.useState)("");
@@ -242,11 +247,16 @@ window.__ModuleLoader__.load({
 				content: "",
 				root: "user"
 			});
+			const useWorkspaces = runtime.useWorkspaces;
+			const workspaces = useWorkspaces === void 0 ? [] : useWorkspaces((snapshot) => snapshot.items);
+			const scope = (0, react.useMemo)(() => {
+				return (workspaces.find((item) => item.sessionIds.length > 0) ?? workspaces[0])?.path;
+			}, [workspaces]);
 			const load = (0, react.useCallback)(async () => {
 				try {
 					setState({
 						kind: "ready",
-						payload: await api.list()
+						payload: await api.list(scope)
 					});
 				} catch (error) {
 					setState({
@@ -254,7 +264,7 @@ window.__ModuleLoader__.load({
 						message: error instanceof Error ? error.message : String(error)
 					});
 				}
-			}, [api]);
+			}, [api, scope]);
 			(0, react.useEffect)(() => {
 				load();
 			}, [load]);
@@ -334,20 +344,20 @@ window.__ModuleLoader__.load({
 				load
 			]);
 			const total = state.kind === "ready" ? state.payload.groups.reduce((n, g) => n + g.skills.length, 0) : 0;
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			return (0, react_jsx_runtime.jsxs)("div", {
 				className: SkillCenterPage_module_css_default.page,
 				children: [
-					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
+					(0, react_jsx_runtime.jsxs)("header", {
 						className: SkillCenterPage_module_css_default.pageHead,
-						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h1", {
+						children: [(0, react_jsx_runtime.jsxs)("div", { children: [(0, react_jsx_runtime.jsx)("h1", {
 							className: SkillCenterPage_module_css_default.pageTitle,
 							children: t("panel")
-						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						}), (0, react_jsx_runtime.jsx)("p", {
 							className: SkillCenterPage_module_css_default.pageIntro,
 							children: t("panel.intro")
-						})] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						})] }), (0, react_jsx_runtime.jsxs)("div", {
 							className: SkillCenterPage_module_css_default.toolbar,
-							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							children: [(0, react_jsx_runtime.jsx)("button", {
 								type: "button",
 								className: SkillCenterPage_module_css_default.iconButton,
 								"aria-label": t("action.refresh"),
@@ -355,15 +365,15 @@ window.__ModuleLoader__.load({
 								onClick: () => {
 									load();
 								},
-								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								children: (0, react_jsx_runtime.jsx)("span", {
 									className: SkillCenterPage_module_css_default.iconWrap,
 									"aria-hidden": "true",
-									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconRefreshOutline16, {})
+									children: (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconRefreshOutline16, {})
 								})
-							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
+							}), (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
 								variant: "primary",
 								size: "sm",
-								icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconPlusOutline16, { size: 13 }),
+								icon: (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconPlusOutline16, { size: 13 }),
 								onClick: () => {
 									setCreating((v) => !v);
 								},
@@ -371,7 +381,7 @@ window.__ModuleLoader__.load({
 							})]
 						})]
 					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Modal, {
+					(0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Modal, {
 						open: creating,
 						onClose: () => {
 							setCreating(false);
@@ -379,58 +389,58 @@ window.__ModuleLoader__.load({
 						title: t("create.title"),
 						closeLabel: t("action.cancel"),
 						className: SkillCenterPage_module_css_default.dialog,
-						footer: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
+						footer: (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [(0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
 							variant: "outline",
 							autoFocus: true,
 							onClick: () => {
 								setCreating(false);
 							},
 							children: t("action.cancel")
-						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
+						}), (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
 							variant: "primary",
 							onClick: () => {
 								submit();
 							},
 							children: t("action.confirm")
 						})] }),
-						children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						children: (0, react_jsx_runtime.jsxs)("div", {
 							className: SkillCenterPage_module_css_default.form,
 							children: [
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DraftField, {
+								(0, react_jsx_runtime.jsx)(DraftField, {
 									label: t("create.name"),
-									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+									children: (0, react_jsx_runtime.jsx)("input", {
 										className: SkillCenterPage_module_css_default.input,
 										value: draft.name,
 										onChange: set("name")
 									})
 								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DraftField, {
+								(0, react_jsx_runtime.jsx)(DraftField, {
 									label: t("create.description"),
-									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+									children: (0, react_jsx_runtime.jsx)("input", {
 										className: SkillCenterPage_module_css_default.input,
 										value: draft.description,
 										onChange: set("description")
 									})
 								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DraftField, {
+								(0, react_jsx_runtime.jsx)(DraftField, {
 									label: t("create.whenToUse"),
-									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+									children: (0, react_jsx_runtime.jsx)("input", {
 										className: SkillCenterPage_module_css_default.input,
 										value: draft.whenToUse,
 										onChange: set("whenToUse")
 									})
 								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DraftField, {
+								(0, react_jsx_runtime.jsx)(DraftField, {
 									label: t("create.content"),
-									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
+									children: (0, react_jsx_runtime.jsx)("textarea", {
 										className: SkillCenterPage_module_css_default.textarea,
 										value: draft.content,
 										onChange: set("content")
 									})
 								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DraftField, {
+								(0, react_jsx_runtime.jsx)(DraftField, {
 									label: t("create.root"),
-									children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("select", {
+									children: (0, react_jsx_runtime.jsxs)("select", {
 										className: SkillCenterPage_module_css_default.input,
 										value: draft.root,
 										onChange: (e) => {
@@ -439,10 +449,10 @@ window.__ModuleLoader__.load({
 												root: e.target.value === "project" ? "project" : "user"
 											}));
 										},
-										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+										children: [(0, react_jsx_runtime.jsx)("option", {
 											value: "user",
 											children: t("create.rootUser")
-										}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+										}), (0, react_jsx_runtime.jsx)("option", {
 											value: "project",
 											children: t("create.rootProject")
 										})]
@@ -451,7 +461,7 @@ window.__ModuleLoader__.load({
 							]
 						})
 					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+					(0, react_jsx_runtime.jsx)("input", {
 						className: SkillCenterPage_module_css_default.search,
 						placeholder: t("search.placeholder"),
 						value: query,
@@ -459,11 +469,11 @@ window.__ModuleLoader__.load({
 							setQuery(e.target.value);
 						}
 					}),
-					state.kind === "loading" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					state.kind === "loading" ? (0, react_jsx_runtime.jsx)("div", {
 						className: SkillCenterPage_module_css_default.status,
 						children: t("state.loading")
 					}) : null,
-					state.kind === "failed" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					state.kind === "failed" ? (0, react_jsx_runtime.jsxs)("div", {
 						className: SkillCenterPage_module_css_default.status + " " + SkillCenterPage_module_css_default.statusError,
 						children: [
 							t("state.failed"),
@@ -471,32 +481,32 @@ window.__ModuleLoader__.load({
 							state.message
 						]
 					}) : null,
-					state.kind === "ready" && groups.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					state.kind === "ready" && groups.length === 0 ? (0, react_jsx_runtime.jsx)("div", {
 						className: SkillCenterPage_module_css_default.status,
 						children: query.trim() === "" ? t("state.empty") : t("search.noMatches")
 					}) : null,
-					state.kind === "ready" && groups.length > 0 && total === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					state.kind === "ready" && groups.length > 0 && total === 0 ? (0, react_jsx_runtime.jsx)("div", {
 						className: SkillCenterPage_module_css_default.status,
 						children: t("state.empty")
 					}) : null,
-					groups.map((group) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					groups.map((group) => (0, react_jsx_runtime.jsxs)("div", {
 						className: SkillCenterPage_module_css_default.group,
-						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("h2", {
+						children: [(0, react_jsx_runtime.jsxs)("h2", {
 							className: SkillCenterPage_module_css_default.groupTitle,
 							children: [
 								group.title,
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								(0, react_jsx_runtime.jsx)("span", {
 									className: SkillCenterPage_module_css_default.groupCount,
 									children: group.skills.length
 								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								(0, react_jsx_runtime.jsx)("span", {
 									className: SkillCenterPage_module_css_default.groupHint,
 									children: group.hint
 								})
 							]
-						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ul", {
+						}), (0, react_jsx_runtime.jsx)("ul", {
 							className: SkillCenterPage_module_css_default.cards,
-							children: group.skills.map((skill) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SkillCard, {
+							children: group.skills.map((skill) => (0, react_jsx_runtime.jsx)(SkillCard, {
 								skill,
 								t,
 								onToggle: (s, enabled) => {
@@ -512,17 +522,23 @@ window.__ModuleLoader__.load({
 			});
 		}
 		//#endregion
-		//#region src/client/SkillCenterPanelIcon.tsx
+		//#region lib/types/client/SkillCenterPanelIcon.js
 		/**
 		* Render the glyph at the size the sidebar asks for.
 		* @param props - the sidebar's icon share: requested edge and selected state.
 		* @returns the icon element.
 		*/
 		function SkillCenterPanelIcon({ size }) {
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconSkillOutline16, { size });
+			return (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconSkillOutline16, { size });
 		}
 		//#endregion
-		//#region src/client/locales.ts
+		//#region lib/types/client/locales.js
+		/**
+		* Skill center dictionaries. Keys are typed so the panel and the sidebar entry
+		* cannot reference a string that does not exist in both languages.
+		*
+		* @module @sparkelf/dsh-client-ui-skill-center/client/locales
+		*/
 		/** Simplified Chinese dictionary. */
 		const zh = {
 			"panel": "技能中心",
@@ -584,7 +600,7 @@ window.__ModuleLoader__.load({
 			"delete.confirm": "Deleting moves it into .trash, where it can be restored. Delete?"
 		};
 		//#endregion
-		//#region src/client/index.ts
+		//#region lib/types/client/index.js
 		/** Dictionary namespace owned by this plugin. */
 		const NS = "skillCenter";
 		/** The id shared by the sidebar entry and the main panel it opens. */

package/lib/index.js

@@ -1,7 +1,7 @@
-import { existsSync } from "node:fs";
-import { mkdir, readFile, rename, writeFile } from "node:fs/promises";
+import { existsSync, lstatSync } from "node:fs";
+import { mkdir, readFile, readdir, rename, writeFile } from "node:fs/promises";
 import { homedir } from "node:os";
-import { dirname, join, resolve } from "node:path";
+import { basename, dirname, join, resolve } from "node:path";
 //#region lib/types/index.js
 /**
 * Skill center — host half. Serves the skill-center data source over the
@@ -40,37 +40,37 @@ const SOURCE_GROUPS = [
 	{
 		key: "bundled",
 		title: "系统内置",
-		hint: "随 Harness 一同安装，不能删除"
+		hint: "随 Harness 一同安装，对所有项目生效"
 	},
 	{
-		key: "runtime",
-		title: "运行时注册",
-		hint: "由已安装的插件在运行时注册"
+		key: "project-dsh",
+		title: "项目 .dsh/skills",
+		hint: "位于项目目录，仅对该工作区生效"
 	},
 	{
-		key: "user-agents",
-		title: "用户 ~/.agents/skills",
-		hint: "在用户 agents 目录下，对所有项目生效"
+		key: "project-agents",
+		title: "项目 .agents/skills",
+		hint: "位于项目目录，随项目提交，对协作者共享"
 	},
 	{
-		key: "user-dsh",
-		title: "用户 ~/.dsh/skills",
-		hint: "在用户 dsh 目录下，对所有项目生效"
+		key: "custom",
+		title: "自定义目录",
+		hint: "由本插件的 customSkillDirs 配置"
 	},
 	{
-		key: "project-agents",
-		title: "项目 .agents/skills",
-		hint: "随项目提交，对协作者共享"
+		key: "user-dsh",
+		title: "用户 ~/.dsh/skills",
+		hint: "在用户 dsh 目录下，对本机所有项目生效"
 	},
 	{
-		key: "project-dsh",
-		title: "项目 .dsh/skills",
-		hint: "项目本地技能，通常不提交"
+		key: "user-agents",
+		title: "用户 ~/.agents/skills",
+		hint: "在用户 agents 目录下，对本机所有项目生效"
 	},
 	{
-		key: "custom",
-		title: "自定义目录",
-		hint: "由本插件的 customSkillDirs 配置"
+		key: "runtime",
+		title: "运行时注册",
+		hint: "由已安装的插件在运行时注册"
 	}
 ];
 /**
@@ -124,6 +124,117 @@ function levelOfSource(source, provider) {
 	if (s.includes("runtime")) return "runtime";
 	return "custom";
 }
+/** The Markdown a skill directory may declare its bundle with. */
+const SKILL_FILE = "SKILL.md";
+/**
+* Read one root directory for skills.
+*
+* The web-app bundle disables the host `skill-filesystem` row and lets each preset
+* own local discovery, so the host registry carries only the bundled catalog: a
+* panel reading the registry alone shows the shipped skills and none of the
+* project or user ones the agent is actually running with. Reading the root
+* conventions here closes that gap without a second catalog authority — the
+* registry still owns discovery for anything it does serve, and this scan is
+* merged under it by name.
+*
+* Both layouts the harness accepts are read: a directory holding SKILL.md, and a
+* flat Markdown file.
+*
+* @param root - absolute root directory to scan.
+* @param level - the group key every skill under this root belongs to.
+* @returns the skills found, sorted by name; missing roots yield none.
+*/
+async function scanSkillRoot(root, level, workspace) {
+	let entries;
+	try {
+		entries = await readdir(root, { withFileTypes: true });
+	} catch {
+		return [];
+	}
+	const found = [];
+	for (const entry of entries) {
+		const path = entry.isDirectory() || entry.isSymbolicLink() ? join(root, entry.name, SKILL_FILE) : entry.name.endsWith(".md") ? join(root, entry.name) : void 0;
+		if (path === void 0 || !existsSync(path)) continue;
+		const name = entry.name.replace(/\.md$/u, "");
+		if (!/^[a-z0-9]+(?:-[a-z0-9]+)*$/u.test(name)) continue;
+		let source;
+		try {
+			source = await readFile(path, "utf8");
+		} catch {
+			continue;
+		}
+		const front = /^---\r?\n([\s\S]*?)\r?\n---/.exec(source)?.[1] ?? "";
+		const field = (key) => {
+			return new RegExp("^\\s*" + key + "\\s*:\\s*(.+?)\\s*$", "mu").exec(front)?.[1]?.replace(/^['"]|['"]$/gu, "");
+		};
+		const disabled = readDisabledFlag(source);
+		const invocation = field("invocation");
+		found.push({
+			name,
+			description: field("description") ?? "",
+			level,
+			path,
+			linked: lstatSyncSafe(path),
+			modelInvocable: disabled !== true && invocation !== "user",
+			userInvocable: invocation !== "model",
+			...field("when-to-use") === void 0 ? {} : { whenToUse: field("when-to-use") },
+			...workspace === void 0 ? {} : {
+				workspaceRoot: workspace.root,
+				workspaceName: workspace.name,
+				isActiveWorkspace: workspace.active
+			}
+		});
+	}
+	return found.sort((a, b) => a.name.localeCompare(b.name));
+}
+/** Whether a skill file is reached through a symlink, which makes deletion unsafe. */
+function lstatSyncSafe(path) {
+	try {
+		return lstatSync(path).isSymbolicLink() || lstatSync(dirname(path)).isSymbolicLink();
+	} catch {
+		return false;
+	}
+}
+/**
+* Every local skill root this deployment uses, with the group each belongs to.
+*
+* @param deps - the resolved configuration.
+* @param projectRoots - project roots whose skill directories are in scope.
+* @returns the roots to scan, in group order.
+*/
+function localSkillRoots(deps, projectRoots, activeRoot) {
+	const roots = [];
+	for (const projectRoot of projectRoots) {
+		const workspace = {
+			root: projectRoot,
+			name: basename(projectRoot) || projectRoot,
+			active: projectRoot === activeRoot
+		};
+		roots.push({
+			path: join(projectRoot, ".dsh", "skills"),
+			level: "project-dsh",
+			workspace
+		});
+		roots.push({
+			path: join(projectRoot, ".agents", "skills"),
+			level: "project-agents",
+			workspace
+		});
+	}
+	for (const dir of deps.customSkillDirs) roots.push({
+		path: dir,
+		level: "custom"
+	});
+	roots.push({
+		path: join(deps.dshHome, "skills"),
+		level: "user-dsh"
+	});
+	roots.push({
+		path: join(deps.agentsHome, "skills"),
+		level: "user-agents"
+	});
+	return roots;
+}
 /**
 * Read `disable-model-invocation` from a skill file.
 * @param source - the skill file's content.
@@ -196,11 +307,12 @@ async function readJson(req, maxBytes) {
 	if (typeof parsed !== "object" || parsed === null || Array.isArray(parsed)) throw new Error("request body must be a JSON object");
 	return parsed;
 }
-/** The list handler: group the registry snapshot by source. */
+/** The list handler: group the registry snapshot and the local roots together. */
 async function handleList(deps, cwd) {
 	const projectRoots = [...new Set(deps.activeSessionCwds().map(findProjectRoot).concat(findProjectRoot(cwd)))];
 	const snapshot = await deps.snapshotProject(cwd);
 	const byGroup = new Map(SOURCE_GROUPS.map((g) => [g.key, []]));
+	const seen = /* @__PURE__ */ new Set();
 	for (const skill of snapshot.skills) {
 		const level = levelOfSource(skill.source, skill.provider);
 		const entry = {
@@ -212,8 +324,26 @@ async function handleList(deps, cwd) {
 			userInvocable: skill.invocation.userInvocable,
 			...skill.whenToUse === void 0 ? {} : { whenToUse: skill.whenToUse }
 		};
+		seen.add(level + ":" + skill.name);
 		(byGroup.get(level) ?? byGroup.get("custom"))?.push(entry);
 	}
+	for (const root of localSkillRoots(deps, projectRoots, findProjectRoot(cwd))) for (const skill of await scanSkillRoot(root.path, root.level, root.workspace)) {
+		if (seen.has(root.level + ":" + skill.name)) continue;
+		seen.add(root.level + ":" + skill.name);
+		byGroup.get(root.level)?.push({
+			name: skill.name,
+			description: skill.description,
+			level: skill.level,
+			path: skill.path,
+			linked: skill.linked,
+			modelInvocable: skill.modelInvocable,
+			userInvocable: skill.userInvocable,
+			...skill.whenToUse === void 0 ? {} : { whenToUse: skill.whenToUse },
+			...skill.workspaceRoot === void 0 ? {} : { workspaceRoot: skill.workspaceRoot },
+			...skill.workspaceName === void 0 ? {} : { workspaceName: skill.workspaceName },
+			...skill.isActiveWorkspace === void 0 ? {} : { isActiveWorkspace: skill.isActiveWorkspace }
+		});
+	}
 	const groups = [];
 	for (const g of SOURCE_GROUPS) {
 		const skills = (byGroup.get(g.key) ?? []).sort((a, b) => a.name.localeCompare(b.name));
@@ -393,4 +523,4 @@ function apply(ctx, config = {}) {
 	for (const route of makeRoutes(deps)) ctx.effect(() => ctx.webServer.register(route), "ui-skill-center: route " + route.path);
 }
 //#endregion
-export { ROUTES, apply, buildSkillContent, findProjectRoot, inject, levelOfSource, makeRoutes, name, projectSkillRoot, readDisabledFlag, userSkillRoot, withDisabledFlag };
+export { ROUTES, apply, buildSkillContent, findProjectRoot, inject, levelOfSource, localSkillRoots, makeRoutes, name, projectSkillRoot, readDisabledFlag, scanSkillRoot, userSkillRoot, withDisabledFlag };

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

@@ -16,8 +16,8 @@ export interface SkillCenterPageProps {
 }
 /**
  * The skill center panel.
- * @param props - the slot's runtime share, providing the dictionary resolver.
+ * @param props - the slot's runtime share: the dictionary resolver and the workspace rows.
  * @returns the rendered panel.
  */
-export declare function SkillCenterPage({ t }: PropsRuntime<'main'> & SkillCenterPageProps): ReactNode;
+export declare function SkillCenterPage({ t, ...runtime }: PropsRuntime<'main'> & SkillCenterPageProps): ReactNode;
 //# sourceMappingURL=SkillCenterPage.d.ts.map

package/lib/types/index.d.ts

@@ -88,6 +88,62 @@ export declare function findProjectRoot(cwd: string): string;
  * @returns the group key.
  */
 export declare function levelOfSource(source: string, provider: string): string;
+/** One skill found by reading a root directory. */
+export interface ScannedSkill {
+    name: string;
+    description: string;
+    whenToUse?: string;
+    level: string;
+    path: string;
+    linked: boolean;
+    modelInvocable: boolean;
+    userInvocable: boolean;
+    /** The project a project-scoped skill came from; absent for user and bundled roots. */
+    workspaceRoot?: string;
+    workspaceName?: string;
+    isActiveWorkspace?: boolean;
+}
+/**
+ * Read one root directory for skills.
+ *
+ * The web-app bundle disables the host `skill-filesystem` row and lets each preset
+ * own local discovery, so the host registry carries only the bundled catalog: a
+ * panel reading the registry alone shows the shipped skills and none of the
+ * project or user ones the agent is actually running with. Reading the root
+ * conventions here closes that gap without a second catalog authority — the
+ * registry still owns discovery for anything it does serve, and this scan is
+ * merged under it by name.
+ *
+ * Both layouts the harness accepts are read: a directory holding SKILL.md, and a
+ * flat Markdown file.
+ *
+ * @param root - absolute root directory to scan.
+ * @param level - the group key every skill under this root belongs to.
+ * @returns the skills found, sorted by name; missing roots yield none.
+ */
+export declare function scanSkillRoot(root: string, level: string, workspace?: {
+    root: string;
+    name: string;
+    active: boolean;
+}): Promise<ScannedSkill[]>;
+/**
+ * Every local skill root this deployment uses, with the group each belongs to.
+ *
+ * @param deps - the resolved configuration.
+ * @param projectRoots - project roots whose skill directories are in scope.
+ * @returns the roots to scan, in group order.
+ */
+export declare function localSkillRoots(deps: Pick<SkillRoutesDeps, 'dshHome' | 'agentsHome'> & {
+    customSkillDirs: readonly string[];
+}, projectRoots: readonly string[], activeRoot?: string): {
+    path: string;
+    level: string;
+    workspace?: {
+        root: string;
+        name: string;
+        active: boolean;
+    };
+}[];
 /**
  * Read `disable-model-invocation` from a skill file.
  * @param source - the skill file's content.

package/package.json

@@ -61,5 +61,5 @@
   },
   "type": "module",
   "types": "lib/types/index.d.ts",
-  "version": "0.2.0-rc.14"
+  "version": "0.2.0-rc.16"
 }