@sparkelf/dsh-client-ui-skill-center 0.2.0-rc.45 → 0.2.0-rc.46

package/lib/client.js

@@ -4,9 +4,9 @@ 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_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";
@@ -59,7 +59,7 @@ window.__ModuleLoader__.load({
 			"workspaceBadge": "DGiSta_workspaceBadge"
 		};
 		//#endregion
-		//#region lib/types/client/api.js
+		//#region src/client/api.ts
 		/**
 		* Skill center API client. Talks to the host route family over same-origin
 		* fetch; the host owns the trust fence.
@@ -131,7 +131,7 @@ window.__ModuleLoader__.load({
 			}
 		};
 		//#endregion
-		//#region lib/types/client/SkillCenterPage.js
+		//#region src/client/SkillCenterPage.tsx
 		/**
 		* Skill center page. Browses the loaded skills grouped by source, toggles model
 		* invocation, creates a skill, and deletes one into a recoverable trash.
@@ -147,9 +147,9 @@ window.__ModuleLoader__.load({
 		* @returns the labelled field.
 		*/
 		function DraftField({ label, children }) {
-			return (0, react_jsx_runtime.jsxs)("div", {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: SkillCenterPage_module_css_default.field,
-				children: [(0, react_jsx_runtime.jsx)("span", {
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 					className: SkillCenterPage_module_css_default.fieldLabel,
 					children: label
 				}), children]
@@ -161,45 +161,45 @@ window.__ModuleLoader__.load({
 		* @returns the row.
 		*/
 		function SkillCard({ skill, t, onToggle, onDelete }) {
-			return (0, react_jsx_runtime.jsx)("li", {
+			return /* @__PURE__ */ (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", {
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 					className: SkillCenterPage_module_css_default.cardHead,
 					children: [
-						(0, react_jsx_runtime.jsx)("span", {
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 							className: SkillCenterPage_module_css_default.cardIcon,
-							children: (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconSkillOutlineRegular, { size: 22 })
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconSkillOutlineRegular, { size: 22 })
 						}),
-						(0, react_jsx_runtime.jsxs)("div", {
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							className: SkillCenterPage_module_css_default.cardMain,
 							children: [
-								(0, react_jsx_runtime.jsxs)("div", {
+								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 									className: SkillCenterPage_module_css_default.cardTitle,
-									children: [skill.name, skill.workspaceName === void 0 ? null : (0, react_jsx_runtime.jsx)("span", {
+									children: [skill.name, skill.workspaceName === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 										className: SkillCenterPage_module_css_default.workspaceBadge,
 										children: skill.workspaceName
 									})]
 								}),
-								(0, react_jsx_runtime.jsx)("div", {
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 									className: SkillCenterPage_module_css_default.cardDesc,
 									children: skill.description
 								}),
-								skill.whenToUse === void 0 ? null : (0, react_jsx_runtime.jsx)("div", {
+								skill.whenToUse === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 									className: SkillCenterPage_module_css_default.cardWhenToUse,
 									children: skill.whenToUse
 								}),
-								(0, react_jsx_runtime.jsxs)("div", {
+								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 									className: SkillCenterPage_module_css_default.cardMarks,
 									children: [
-										(0, react_jsx_runtime.jsx)("span", {
+										/* @__PURE__ */ (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")
 										}),
-										(0, react_jsx_runtime.jsx)("span", {
+										/* @__PURE__ */ (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 ? (0, react_jsx_runtime.jsx)("span", {
+										skill.linked === true ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 											className: SkillCenterPage_module_css_default.mark + " " + SkillCenterPage_module_css_default.markDanger,
 											children: t("skill.linked")
 										}) : null
@@ -207,9 +207,9 @@ window.__ModuleLoader__.load({
 								})
 							]
 						}),
-						(0, react_jsx_runtime.jsxs)("div", {
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							className: SkillCenterPage_module_css_default.cardEnd,
-							children: [(0, react_jsx_runtime.jsx)("button", {
+							children: [/* @__PURE__ */ (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"),
@@ -217,7 +217,7 @@ window.__ModuleLoader__.load({
 								onClick: () => {
 									onToggle(skill, !skill.modelInvocable);
 								}
-							}), skill.path === void 0 || skill.linked === true ? null : (0, react_jsx_runtime.jsx)("button", {
+							}), skill.path === void 0 || skill.linked === true ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 								type: "button",
 								className: SkillCenterPage_module_css_default.button,
 								onClick: () => {
@@ -235,7 +235,7 @@ window.__ModuleLoader__.load({
 		* @param props - the slot's runtime share: the dictionary resolver and the workspace rows.
 		* @returns the rendered panel.
 		*/
-		function SkillCenterPage({ t, ...runtime }) {
+		function SkillCenterPage({ t, renderSlot, ...runtime }) {
 			const api = (0, react.useMemo)(() => new SkillApi(), []);
 			const [state, setState] = (0, react.useState)({ kind: "loading" });
 			const [query, setQuery] = (0, react.useState)("");
@@ -344,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 (0, react_jsx_runtime.jsxs)("div", {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: SkillCenterPage_module_css_default.page,
 				children: [
-					(0, react_jsx_runtime.jsxs)("header", {
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
 						className: SkillCenterPage_module_css_default.pageHead,
-						children: [(0, react_jsx_runtime.jsxs)("div", { children: [(0, react_jsx_runtime.jsx)("h1", {
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h1", {
 							className: SkillCenterPage_module_css_default.pageTitle,
 							children: t("panel")
-						}), (0, react_jsx_runtime.jsx)("p", {
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 							className: SkillCenterPage_module_css_default.pageIntro,
 							children: t("panel.intro")
-						})] }), (0, react_jsx_runtime.jsxs)("div", {
+						})] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							className: SkillCenterPage_module_css_default.toolbar,
-							children: [(0, react_jsx_runtime.jsx)("button", {
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 								type: "button",
 								className: SkillCenterPage_module_css_default.iconButton,
 								"aria-label": t("action.refresh"),
@@ -365,15 +365,15 @@ window.__ModuleLoader__.load({
 								onClick: () => {
 									load();
 								},
-								children: (0, react_jsx_runtime.jsx)("span", {
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 									className: SkillCenterPage_module_css_default.iconWrap,
 									"aria-hidden": "true",
-									children: (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconRefreshOutlineRegular, {})
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconRefreshOutlineRegular, {})
 								})
-							}), (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
 								variant: "primary",
 								size: "sm",
-								icon: (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconPlusOutlineRegular, { size: 13 }),
+								icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconPlusOutlineRegular, { size: 13 }),
 								onClick: () => {
 									setCreating((v) => !v);
 								},
@@ -381,7 +381,7 @@ window.__ModuleLoader__.load({
 							})]
 						})]
 					}),
-					(0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Modal, {
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Modal, {
 						open: creating,
 						onClose: () => {
 							setCreating(false);
@@ -389,58 +389,58 @@ window.__ModuleLoader__.load({
 						title: t("create.title"),
 						closeLabel: t("action.cancel"),
 						className: SkillCenterPage_module_css_default.dialog,
-						footer: (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [(0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
+						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, {
 							variant: "outline",
 							autoFocus: true,
 							onClick: () => {
 								setCreating(false);
 							},
 							children: t("action.cancel")
-						}), (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
 							variant: "primary",
 							onClick: () => {
 								submit();
 							},
 							children: t("action.confirm")
 						})] }),
-						children: (0, react_jsx_runtime.jsxs)("div", {
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							className: SkillCenterPage_module_css_default.form,
 							children: [
-								(0, react_jsx_runtime.jsx)(DraftField, {
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DraftField, {
 									label: t("create.name"),
-									children: (0, react_jsx_runtime.jsx)("input", {
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
 										className: SkillCenterPage_module_css_default.input,
 										value: draft.name,
 										onChange: set("name")
 									})
 								}),
-								(0, react_jsx_runtime.jsx)(DraftField, {
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DraftField, {
 									label: t("create.description"),
-									children: (0, react_jsx_runtime.jsx)("input", {
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
 										className: SkillCenterPage_module_css_default.input,
 										value: draft.description,
 										onChange: set("description")
 									})
 								}),
-								(0, react_jsx_runtime.jsx)(DraftField, {
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DraftField, {
 									label: t("create.whenToUse"),
-									children: (0, react_jsx_runtime.jsx)("input", {
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
 										className: SkillCenterPage_module_css_default.input,
 										value: draft.whenToUse,
 										onChange: set("whenToUse")
 									})
 								}),
-								(0, react_jsx_runtime.jsx)(DraftField, {
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DraftField, {
 									label: t("create.content"),
-									children: (0, react_jsx_runtime.jsx)("textarea", {
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
 										className: SkillCenterPage_module_css_default.textarea,
 										value: draft.content,
 										onChange: set("content")
 									})
 								}),
-								(0, react_jsx_runtime.jsx)(DraftField, {
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DraftField, {
 									label: t("create.root"),
-									children: (0, react_jsx_runtime.jsxs)("select", {
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("select", {
 										className: SkillCenterPage_module_css_default.input,
 										value: draft.root,
 										onChange: (e) => {
@@ -449,10 +449,10 @@ window.__ModuleLoader__.load({
 												root: e.target.value === "project" ? "project" : "user"
 											}));
 										},
-										children: [(0, react_jsx_runtime.jsx)("option", {
+										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
 											value: "user",
 											children: t("create.rootUser")
-										}), (0, react_jsx_runtime.jsx)("option", {
+										}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
 											value: "project",
 											children: t("create.rootProject")
 										})]
@@ -461,7 +461,7 @@ window.__ModuleLoader__.load({
 							]
 						})
 					}),
-					(0, react_jsx_runtime.jsx)("input", {
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
 						className: SkillCenterPage_module_css_default.search,
 						placeholder: t("search.placeholder"),
 						value: query,
@@ -469,11 +469,11 @@ window.__ModuleLoader__.load({
 							setQuery(e.target.value);
 						}
 					}),
-					state.kind === "loading" ? (0, react_jsx_runtime.jsx)("div", {
+					state.kind === "loading" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 						className: SkillCenterPage_module_css_default.status,
 						children: t("state.loading")
 					}) : null,
-					state.kind === "failed" ? (0, react_jsx_runtime.jsxs)("div", {
+					state.kind === "failed" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 						className: SkillCenterPage_module_css_default.status + " " + SkillCenterPage_module_css_default.statusError,
 						children: [
 							t("state.failed"),
@@ -481,32 +481,32 @@ window.__ModuleLoader__.load({
 							state.message
 						]
 					}) : null,
-					state.kind === "ready" && groups.length === 0 ? (0, react_jsx_runtime.jsx)("div", {
+					state.kind === "ready" && groups.length === 0 ? /* @__PURE__ */ (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 ? (0, react_jsx_runtime.jsx)("div", {
+					state.kind === "ready" && groups.length > 0 && total === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 						className: SkillCenterPage_module_css_default.status,
 						children: t("state.empty")
 					}) : null,
-					groups.map((group) => (0, react_jsx_runtime.jsxs)("div", {
+					groups.map((group) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 						className: SkillCenterPage_module_css_default.group,
-						children: [(0, react_jsx_runtime.jsxs)("h2", {
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("h2", {
 							className: SkillCenterPage_module_css_default.groupTitle,
 							children: [
 								group.title,
-								(0, react_jsx_runtime.jsx)("span", {
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 									className: SkillCenterPage_module_css_default.groupCount,
 									children: group.skills.length
 								}),
-								(0, react_jsx_runtime.jsx)("span", {
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 									className: SkillCenterPage_module_css_default.groupHint,
 									children: group.hint
 								})
 							]
-						}), (0, react_jsx_runtime.jsx)("ul", {
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ul", {
 							className: SkillCenterPage_module_css_default.cards,
-							children: group.skills.map((skill) => (0, react_jsx_runtime.jsx)(SkillCard, {
+							children: group.skills.map((skill) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SkillCard, {
 								skill,
 								t,
 								onToggle: (s, enabled) => {
@@ -517,28 +517,23 @@ window.__ModuleLoader__.load({
 								}
 							}, group.key + ":" + skill.name))
 						})]
-					}, group.key))
+					}, group.key)),
+					renderSlot("skill-center.section", {})
 				]
 			});
 		}
 		//#endregion
-		//#region lib/types/client/SkillCenterPanelIcon.js
+		//#region src/client/SkillCenterPanelIcon.tsx
 		/**
 		* 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 (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconSkillOutlineRegular, { size });
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconSkillOutlineRegular, { size });
 		}
 		//#endregion
-		//#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
-		*/
+		//#region src/client/locales.ts
 		/** Simplified Chinese dictionary. */
 		const zh = {
 			"panel": "技能中心",
@@ -600,7 +595,7 @@ window.__ModuleLoader__.load({
 			"delete.confirm": "Deleting moves it into .trash, where it can be restored. Delete?"
 		};
 		//#endregion
-		//#region lib/types/client/index.js
+		//#region src/client/index.ts
 		/** Dictionary namespace owned by this plugin. */
 		const NS = "skillCenter";
 		/** The id shared by the sidebar entry and the main panel it opens. */
@@ -620,7 +615,11 @@ window.__ModuleLoader__.load({
 			ctx.slots.inject("main", () => ctx.slots.register({
 				name: "main",
 				key: PANEL_ID,
-				locale: NS
+				locale: NS,
+				children: { "skill-center.section": {
+					kind: "list",
+					scope: "root"
+				} }
 			}, SkillCenterPage));
 			ctx.slots.inject("sidebar.panellist", () => ctx.slots.register({
 				name: "sidebar.panellist",

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

@@ -8,7 +8,7 @@
  * @module @sparkelf/dsh-client-ui-skill-center/client/SkillCenterPage
  */
 import { type ReactNode } from 'react';
-import type { PropsRuntime } from '@deepseek-ai/dsh-client-ui-slots';
+import type { PropsRenderSlots, PropsRuntime } from '@deepseek-ai/dsh-client-ui-slots';
 import type { SkillCenterLocaleKey } from './locales.ts';
 /** What the panel needs from its slot: the dictionary resolver. */
 export interface SkillCenterPageProps {
@@ -19,5 +19,5 @@ export interface SkillCenterPageProps {
  * @param props - the slot's runtime share: the dictionary resolver and the workspace rows.
  * @returns the rendered panel.
  */
-export declare function SkillCenterPage({ t, ...runtime }: PropsRuntime<'main'> & SkillCenterPageProps): ReactNode;
+export declare function SkillCenterPage({ t, renderSlot, ...runtime }: PropsRuntime<'main'> & PropsRenderSlots<'skill-center.section'> & SkillCenterPageProps): ReactNode;
 //# sourceMappingURL=SkillCenterPage.d.ts.map

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

@@ -8,6 +8,7 @@
  */
 import type { Context } from '@deepseek-ai/cordis';
 import type { MainPanelId } from '@deepseek-ai/dsh-client-ui-layout/client';
+export type { SkillCenterSectionOwnerProps } from './slot-contract.ts';
 import { type SkillCenterLocaleKey } from './locales.ts';
 declare module '@deepseek-ai/dsh-client-ui-slots' {
     interface LocaleNamespaceMap {

package/lib/types/client/slot-contract.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Owner props a contributed section receives. The slot passes none today; the type exists so a
+ * consumer can name the slot's owner share without importing the page.
+ */
+export interface SkillCenterSectionOwnerProps {
+    /** Reserved for an owner share the panel may add; currently empty. */
+    readonly reserved?: never;
+}
+declare module '@deepseek-ai/dsh-client-ui-slots' {
+    interface SlotMap {
+        /** A section contributed to the skill center page, below the skill list. */
+        'skill-center.section': {
+            kind: 'list';
+            scope: 'root';
+        };
+    }
+}
+//# sourceMappingURL=slot-contract.d.ts.map

package/package.json

@@ -1,20 +1,28 @@
 {
+  "name": "@sparkelf/dsh-client-ui-skill-center",
+  "version": "0.2.0-rc.46",
   "description": "Skill center for the dsh web client: browses loaded skills grouped by source, enables or disables model invocation, creates skills, and deletes them into a recoverable trash",
-  "devDependencies": {
-    "@deepseek-ai/cordis": "^4.0.2",
-    "@deepseek-ai/dsh-client-locale": "^0.1.6-alpha.1",
-    "@deepseek-ai/dsh-client-ui-layout": "^0.1.6-alpha.1",
-    "@deepseek-ai/dsh-client-ui-primitives": "^0.1.6-alpha.1",
-    "@deepseek-ai/dsh-client-ui-renderer": "^0.1.6-alpha.1",
-    "@deepseek-ai/dsh-client-ui-sidebar": "^0.1.6-alpha.1",
-    "@deepseek-ai/dsh-client-ui-slots": "^0.1.6-alpha.1",
-    "@deepseek-ai/dsh-host-webserver": "^0.1.6-alpha.1",
-    "@deepseek-ai/dsh-session": "^0.1.6-alpha.1",
-    "@deepseek-ai/dsh-skill": "^0.1.6-alpha.1",
-    "@types/react": "~18.3.1",
-    "@types/react-dom": "~18.3.0",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/deepseek-ai/deepseek-harness.git",
+    "directory": "packages/plus/ui-skill-center"
+  },
+  "type": "module",
+  "main": "lib/index.js",
+  "types": "lib/types/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./lib/types/index.d.ts",
+      "default": "./lib/index.js"
+    },
+    "./client": {
+      "types": "./lib/types/client/index.d.ts",
+      "default": "./lib/client.js"
+    },
+    "./package.json": "./package.json"
   },
   "dsh": {
     "client": {
@@ -25,16 +33,9 @@
       "platform": "web"
     }
   },
-  "exports": {
-    ".": {
-      "default": "./lib/index.js",
-      "types": "./lib/types/index.d.ts"
-    },
-    "./client": {
-      "default": "./lib/client.js",
-      "types": "./lib/types/client/index.d.ts"
-    },
-    "./package.json": "./package.json"
+  "scripts": {
+    "bundle": "tsdown",
+    "watch": "tsdown --watch"
   },
   "files": [
     "lib/index.js",
@@ -42,24 +43,23 @@
     "lib/types/**/*.d.ts"
   ],
   "license": "MIT",
-  "main": "lib/index.js",
-  "name": "@sparkelf/dsh-client-ui-skill-center",
   "peerDependencies": {
     "@deepseek-ai/cordis": ">=4.0.1"
   },
-  "publishConfig": {
-    "access": "public"
-  },
-  "repository": {
-    "directory": "packages/plus/ui-skill-center",
-    "type": "git",
-    "url": "git+https://github.com/deepseek-ai/deepseek-harness.git"
-  },
-  "scripts": {
-    "bundle": "tsdown",
-    "watch": "tsdown --watch"
-  },
-  "type": "module",
-  "types": "lib/types/index.d.ts",
-  "version": "0.2.0-rc.45"
+  "devDependencies": {
+    "@deepseek-ai/cordis": "workspace:^",
+    "@deepseek-ai/dsh-client-locale": "workspace:^",
+    "@deepseek-ai/dsh-client-ui-layout": "workspace:^",
+    "@deepseek-ai/dsh-client-ui-primitives": "workspace:^",
+    "@deepseek-ai/dsh-client-ui-renderer": "workspace:^",
+    "@deepseek-ai/dsh-client-ui-sidebar": "workspace:^",
+    "@deepseek-ai/dsh-client-ui-slots": "workspace:^",
+    "@deepseek-ai/dsh-host-webserver": "workspace:^",
+    "@deepseek-ai/dsh-session": "workspace:^",
+    "@deepseek-ai/dsh-skill": "workspace:^",
+    "@types/react": "~18.3.1",
+    "@types/react-dom": "~18.3.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  }
 }

package/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2026 DeepSeek
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.