@matamt-dbg/dsh-studio 0.2.7 → 0.2.8

package/client.js

@@ -115,8 +115,7 @@ function parsePreviewRequest(value) {
 var import_react = __toESM(require("react"), 1);
 
 // src/ui-styles.ts
-var studioStyles = `/* Only this adapter references host tokens. Studio never installs a global theme. */
-.studio-ui {
+var adapter = `.studio-ui {
   --studio-bg: var(--dsw-alias-bg-base);
   --studio-surface: var(--dsw-alias-bg-layer-1);
   --studio-inset: var(--dsw-alias-bg-layer-2);
@@ -148,7 +147,9 @@ var studioStyles = `/* Only this adapter references host tokens. Studio never in
   min-width: 0;
   overflow-wrap: anywhere;
 }
-.studio-ui *, .studio-ui *::before, .studio-ui *::after { box-sizing: border-box; }
+`;
+var studioStyles = `/* Only this adapter references host tokens. Studio never installs a global theme. */
+${adapter}.studio-ui *, .studio-ui *::before, .studio-ui *::after { box-sizing: border-box; }
 .studio-ui .studio-tool-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 12px; }
 .studio-ui .studio-tool-card { display: flex; flex-direction: column; gap: 8px; padding: 14px; border: 1px solid var(--studio-line); border-radius: var(--studio-radius); cursor: pointer; min-width: 0; }
 .studio-ui .studio-tool-card[data-selected="true"] { background: var(--studio-hover); border-color: var(--studio-ink); }
@@ -217,6 +218,14 @@ var studioStyles = `/* Only this adapter references host tokens. Studio never in
 .studio-ui .studio-service-panel[hidden] { display: none; }
 .studio-ui .studio-service-panel > .studio-ui { max-width: 960px; margin: 0 auto; padding: 24px clamp(16px, 3vw, 40px) 48px; }
 .studio-ui .studio-layout { display: grid; grid-template-columns: 208px minmax(0, 1fr); height: 100%; }
+/* Version footer pinned to the bottom of the Studio navigation. */
+.studio-ui .studio-nav-footer { display: flex; align-items: center; gap: 6px; margin-top: auto; padding: 12px 10px 0; color: var(--studio-subtle); font-size: 12px; }
+.studio-ui .studio-icon-button { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 0; border: 0; border-radius: var(--studio-small-radius); background: none; color: var(--studio-info); cursor: pointer; }
+.studio-ui .studio-icon-button:hover:not(:disabled) { background: var(--studio-hover); }
+.studio-ui .studio-icon-button[data-tone=success] { color: var(--studio-success); }
+.studio-ui .studio-icon-button[data-tone=error] { color: var(--studio-error); }
+.studio-ui .studio-icon-button:disabled { cursor: default; opacity: 1; }
+.studio-ui .studio-icon-button[aria-busy=true] { opacity: .5; }
 .studio-ui nav.studio-nav { display: flex; flex-direction: column; flex-wrap: nowrap; gap: 2px; margin: 0; padding: 24px 12px; border-inline-end: .5px solid var(--studio-line); overflow-y: auto; }
 .studio-ui .studio-nav-head { display: grid; gap: 2px; padding: 0 10px 8px; }
 .studio-ui .studio-nav-title { font-size: 14px; }
@@ -607,6 +616,7 @@ var studioStyles = `/* Only this adapter references host tokens. Studio never in
   .studio-ui nav.studio-nav { flex-direction: row; overflow-x: auto; padding: 8px 12px; border-inline-end: 0; border-bottom: .5px solid var(--studio-line); }
   .studio-ui .studio-nav-title, .studio-ui .studio-nav-group { display: none; }
   .studio-ui .studio-nav-item { flex: 0 0 auto; }
+  .studio-ui .studio-nav-footer { margin: 0 0 0 auto; padding: 0 0 0 8px; }
   .studio-ui .studio-scroller { overflow: visible; }
 }
 @container studio-main (max-width: 560px) {
@@ -625,6 +635,13 @@ var studioStyles = `/* Only this adapter references host tokens. Studio never in
   .studio-ui dd { margin-bottom: 8px; }
 }
 `;
+var sidebarMarkStyles = `${adapter}
+.studio-ui.studio-sidebar-glyph { display: inline-flex; color: inherit; line-height: 0; }
+.studio-ui .studio-sidebar-dot { fill: var(--studio-info); }
+/* order keeps the mark last even if the sidebar later appends its own label. */
+.studio-ui.studio-sidebar-update { display: inline-flex; flex: none; align-items: center; order: 99; margin-left: auto; color: var(--studio-info); line-height: 0; }
+.studio-ui.studio-sidebar-update[data-phase=failed] { color: var(--studio-error); }
+`;
 
 // src/ui.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
@@ -702,6 +719,9 @@ function SplitButton({ label, onClick, primary = false, disabled = false, action
     }, children: action.label }, action.label)) })
   ] });
 }
+function IconButton({ label, tone = "info", disabled = false, busy = false, onClick, children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", className: "studio-icon-button", "data-tone": tone, title: label, "aria-label": label, "aria-busy": busy || void 0, disabled, onClick, children });
+}
 function DetailDialog({ open, title, subtitle, onClose, closeLabel, footer, wide = false, compact = false, children }) {
   const ref = import_react.default.useRef(null);
   const opener = import_react.default.useRef(null);
@@ -800,7 +820,7 @@ ${item.searchText ?? ""}`.toLowerCase().includes(text)));
 // src/role-editor.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
 function RoleEditor({ locale, roles, onChange, loadModels, defaultPersona = "", tools, hiddenTools = [], onHiddenToolsChange, delegates = true }) {
-  const t = (ko2, en2, zh2) => locale.startsWith("ko") ? ko2 : locale.startsWith("zh") ? zh2 : en2;
+  const t = (ko3, en3, zh3) => locale.startsWith("ko") ? ko3 : locale.startsWith("zh") ? zh3 : en3;
   const [selected, setSelected] = import_react3.default.useState();
   const [catalog, setCatalog] = import_react3.default.useState();
   const [error, setError] = import_react3.default.useState("");
@@ -984,7 +1004,7 @@ var import_react9 = __toESM(require("react"), 1);
 var import_react4 = __toESM(require("react"), 1);
 var import_jsx_runtime4 = require("react/jsx-runtime");
 function MasterExtensionsEditor({ locale, actions }) {
-  const t = (ko2, en2, zh2) => locale.startsWith("ko") ? ko2 : locale.startsWith("zh") ? zh2 : en2;
+  const t = (ko3, en3, zh3) => locale.startsWith("ko") ? ko3 : locale.startsWith("zh") ? zh3 : en3;
   const [text, setText] = import_react4.default.useState("[]");
   const [error, setError] = import_react4.default.useState("");
   const [busy, setBusy] = import_react4.default.useState(false);
@@ -1039,6 +1059,7 @@ var PACKAGE_NAME = "@matamt-dbg/dsh-studio";
 var POLICY_PLUGIN = `${PACKAGE_NAME}/policy`;
 var ROLE_PLUGIN = `${PACKAGE_NAME}/roles`;
 var BATCH_PLUGIN = `${PACKAGE_NAME}/batch`;
+var STUDIO_VERSION = "0.2.8";
 
 // src/delegation.ts
 var ROLE_TOOL = "subagent_role";
@@ -1467,7 +1488,7 @@ var import_react6 = __toESM(require("react"), 1);
 var import_jsx_runtime6 = require("react/jsx-runtime");
 var message = (error) => error instanceof Error ? error.message : String(error);
 function PresetList({ locale, api, revision, onEdit, onCopy }) {
-  const t = (ko2, en2, zh2) => locale.startsWith("ko") ? ko2 : locale.startsWith("zh") ? zh2 : en2;
+  const t = (ko3, en3, zh3) => locale.startsWith("ko") ? ko3 : locale.startsWith("zh") ? zh3 : en3;
   const [load, setLoad] = import_react6.default.useState({ phase: "loading" });
   const [action, setAction] = import_react6.default.useState();
   const [deleting, setDeleting] = import_react6.default.useState();
@@ -1629,7 +1650,7 @@ var import_react7 = __toESM(require("react"), 1);
 var import_jsx_runtime7 = require("react/jsx-runtime");
 var defaultProvidedTools = [];
 function PromptToolsPrototype({ locale, prompt, onPromptChange, provided, onProvidedChange, catalog, catalogError, onPreview, onRequestChange, initialRequest }) {
-  const t = (ko2, en2, zh2) => locale.startsWith("ko") ? ko2 : locale.startsWith("zh") ? zh2 : en2;
+  const t = (ko3, en3, zh3) => locale.startsWith("ko") ? ko3 : locale.startsWith("zh") ? zh3 : en3;
   const base = initialRequest?.preset ?? "studio-master";
   const [toolOverrides, setToolOverrides] = import_react7.default.useState(renameLegacyRoleKey(initialRequest?.toolOverrides) ?? {});
   const [sections, setSections] = import_react7.default.useState(initialRequest?.sections ?? {});
@@ -1841,7 +1862,7 @@ function parameterFields(schema, prefix = "") {
 // src/detail-layout.tsx
 var import_react8 = __toESM(require("react"), 1);
 var import_jsx_runtime8 = require("react/jsx-runtime");
-function DetailLayout({ title, subtitle, navigation, pages, selected, onSelect }) {
+function DetailLayout({ title, subtitle, navigation, pages, selected, onSelect, footer }) {
   const id = import_react8.default.useId();
   const scroller = import_react8.default.useRef(null);
   import_react8.default.useLayoutEffect(() => {
@@ -1866,7 +1887,8 @@ function DetailLayout({ title, subtitle, navigation, pages, selected, onSelect }
             children: page.label
           }
         )
-      ] }, page.id))
+      ] }, page.id)),
+      footer
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "studio-scroller", ref: scroller, "data-studio-scroller": "", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "studio-content", children: pages.map((page) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       "section",
@@ -1892,8 +1914,8 @@ var seeds = [
   { name: "Researcher", role: "research", model: "inherit", reasoning: "inherit", spawn: "fresh", persona: "Investigate primary sources and cite the evidence." },
   { name: "Reviewer", role: "review", model: "inherit", reasoning: "inherit", spawn: "fork", persona: "Review correctness and identify concrete risks." }
 ];
-function OptimizationPrototype({ locale, catalog, catalogError, onPreview, presetActions, extensionActions }) {
-  const t = (ko2, en2, zh2) => locale.startsWith("ko") ? ko2 : locale.startsWith("zh") ? zh2 : en2;
+function OptimizationPrototype({ locale, catalog, catalogError, onPreview, presetActions, extensionActions, navFooter }) {
+  const t = (ko3, en3, zh3) => locale.startsWith("ko") ? ko3 : locale.startsWith("zh") ? zh3 : en3;
   const [page, setPage] = import_react9.default.useState("list");
   const [common, setCommon] = import_react9.default.useState({ ...initial });
   const [agents, setAgents] = import_react9.default.useState(() => seeds.map((a) => ({ ...a })));
@@ -1936,9 +1958,9 @@ function OptimizationPrototype({ locale, catalog, catalogError, onPreview, prese
       setSaving(false);
     }
   };
-  const editPreset = (item, copy2 = false) => {
-    setEditing(copy2 ? { ...item, id: "" } : item);
-    setName(copy2 ? `${item.name} Copy` : item.name);
+  const editPreset = (item, copy3 = false) => {
+    setEditing(copy3 ? { ...item, id: "" } : item);
+    setName(copy3 ? `${item.name} Copy` : item.name);
     setDescription(item.description);
     setCommon({ ...initial, prompt: item.request.prompt, spill: item.conveniences?.spill ?? initial.spill });
     setProvided([...item.request.tools]);
@@ -1965,7 +1987,7 @@ function OptimizationPrototype({ locale, catalog, catalogError, onPreview, prese
     { id: "agents", label: t("\uC11C\uBE0C\uC5D0\uC774\uC804\uD2B8", "Subagent settings", "\u5B50\u4EE3\u7406\u8BBE\u7F6E"), content: agentPage }
   ];
   const tabId = import_react9.default.useId();
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(DetailLayout, { title: "DSH Studio", subtitle: t("\uC5D0\uC774\uC804\uD2B8 \uD504\uB9AC\uC14B \uD3B8\uC9D1\uAE30", "Agent preset editor", "\u4EE3\u7406\u9884\u8BBE\u7F16\u8F91\u5668"), navigation: t("Studio \uBA54\uB274", "Studio menu", "\u9884\u8BBE\u5BFC\u822A"), selected: page, onSelect: (next) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(DetailLayout, { footer: navFooter, title: "DSH Studio", subtitle: t("\uC5D0\uC774\uC804\uD2B8 \uD504\uB9AC\uC14B \uD3B8\uC9D1\uAE30", "Agent preset editor", "\u4EE3\u7406\u9884\u8BBE\u7F16\u8F91\u5668"), navigation: t("Studio \uBA54\uB274", "Studio menu", "\u9884\u8BBE\u5BFC\u822A"), selected: page, onSelect: (next) => {
     if (next === "create" && editing) {
       setEditing(void 0);
       setName("");
@@ -2006,7 +2028,7 @@ function OptimizationPrototype({ locale, catalog, catalogError, onPreview, prese
 }
 
 // src/shell.tsx
-var import_react11 = __toESM(require("react"), 1);
+var import_react12 = __toESM(require("react"), 1);
 var import_dsh_client_ui_slots = require("@deepseek-ai/dsh-client-ui-slots");
 
 // src/service-layout.tsx
@@ -2050,8 +2072,145 @@ function ServiceLayout({ locale, services, renderSlot }) {
   ] });
 }
 
-// src/shell.tsx
+// src/update-store.ts
+function createUpdateStore(actions, current) {
+  let state = { phase: "idle", current };
+  const listeners = /* @__PURE__ */ new Set();
+  const set = (next) => {
+    state = next;
+    listeners.forEach((listener) => listener());
+  };
+  return {
+    getSnapshot: () => state,
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => {
+        listeners.delete(listener);
+      };
+    },
+    async refresh(force = false) {
+      if (state.phase === "updating" || state.phase === "installed") return;
+      try {
+        const status = await actions.status(force);
+        const phase = () => state.phase;
+        if (phase() === "updating" || phase() === "installed") return;
+        if (status.installed) {
+          set({ phase: "installed", current: status.current, version: status.installed });
+          return;
+        }
+        const version = status.available && !status.blocked ? status.available : void 0;
+        set({ phase: "idle", current: status.current, ...version ? { version } : {} });
+      } catch {
+      }
+    },
+    async update() {
+      if (state.phase !== "idle" && state.phase !== "failed") return;
+      const version = state.version;
+      if (!version) return;
+      set({ phase: "updating", current: state.current, version });
+      try {
+        const result = await actions.update(version);
+        if (result.status === "restart-required" || result.status === "applied") set({ phase: "installed", current: state.current, version: result.version });
+        else set({ phase: "failed", current: state.current, version, message: result.message ?? result.status });
+      } catch (error) {
+        set({ phase: "failed", current: state.current, version, message: error instanceof Error ? error.message : String(error) });
+      }
+    }
+  };
+}
+
+// src/update-indicator.tsx
+var import_react11 = __toESM(require("react"), 1);
+var import_react_dom = require("react-dom");
 var import_jsx_runtime11 = require("react/jsx-runtime");
+var ko2 = {
+  available: (v) => `v${v}\uB85C \uC5C5\uB370\uC774\uD2B8`,
+  updating: (v) => `v${v} \uC124\uCE58 \uC911`,
+  installed: (v) => `v${v}\uB97C \uC124\uCE58\uD588\uC2B5\uB2C8\uB2E4. DSH\uB97C \uB2E4\uC2DC \uC2DC\uC791\uD558\uBA74 \uC801\uC6A9\uB429\uB2C8\uB2E4.`,
+  failed: (v, message2) => `v${v}\uB85C \uC5C5\uB370\uC774\uD2B8\uD558\uC9C0 \uBABB\uD588\uC2B5\uB2C8\uB2E4. \uB2E4\uC2DC \uC2DC\uB3C4\uD558\uB824\uBA74 \uB204\uB974\uC138\uC694. (${message2})`
+};
+var en2 = {
+  available: (v) => `Update to v${v}`,
+  updating: (v) => `Installing v${v}`,
+  installed: (v) => `Installed v${v}. Restart DSH to use it.`,
+  failed: (v, message2) => `Could not update to v${v}. Select to try again. (${message2})`
+};
+var zh2 = {
+  available: (v) => `\u66F4\u65B0\u5230 v${v}`,
+  updating: (v) => `\u6B63\u5728\u5B89\u88C5 v${v}`,
+  installed: (v) => `\u5DF2\u5B89\u88C5 v${v}\u3002\u91CD\u542F DSH \u540E\u751F\u6548`,
+  failed: (v, message2) => `\u65E0\u6CD5\u66F4\u65B0\u5230 v${v}\u3002\u70B9\u51FB\u91CD\u8BD5\uFF08${message2}\uFF09`
+};
+var copy2 = (locale) => locale.startsWith("ko") ? ko2 : locale.startsWith("zh") ? zh2 : en2;
+function useUpdateState(store) {
+  return import_react11.default.useSyncExternalStore(store.subscribe, store.getSnapshot);
+}
+function updateLabel(state, locale) {
+  const t = copy2(locale);
+  if (state.phase === "updating") return t.updating(state.version);
+  if (state.phase === "installed") return t.installed(state.version);
+  if (state.phase === "failed") return t.failed(state.version, state.message);
+  return state.version ? t.available(state.version) : void 0;
+}
+function UpdateGlyph({ phase, size = 14 }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("svg", { width: size, height: size, viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("circle", { cx: "8", cy: "8", r: "6.5" }),
+    phase === "installed" ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M5.2 8.2l1.9 1.9 3.7-4" }) : phase === "failed" ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M8 4.8v3.8M8 11.2v.01" }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M8 11V5.2M5.4 7.6L8 5l2.6 2.6" })
+  ] });
+}
+function VersionFooter({ store, locale }) {
+  const state = useUpdateState(store);
+  const label = updateLabel(state, locale);
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "studio-nav-footer", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("span", { className: "studio-mono", children: [
+      "v",
+      state.current
+    ] }),
+    label && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+      IconButton,
+      {
+        label,
+        tone: state.phase === "failed" ? "error" : state.phase === "installed" ? "success" : "info",
+        disabled: state.phase === "updating" || state.phase === "installed",
+        busy: state.phase === "updating",
+        onClick: () => {
+          void store.update();
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(UpdateGlyph, { phase: state.phase })
+      }
+    )
+  ] });
+}
+function SidebarIcon({ size = 20, store, locale }) {
+  const state = useUpdateState(store);
+  const label = updateLabel(state, locale);
+  const glyph = import_react11.default.useRef(null);
+  const [row, setRow] = import_react11.default.useState(null);
+  import_react11.default.useLayoutEffect(() => {
+    setRow(glyph.current?.closest("button") ?? null);
+  }, [size]);
+  const wide = size <= 16;
+  const marked = label !== void 0 && state.phase !== "installed";
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("span", { className: "studio-ui studio-sidebar-glyph", children: [
+      marked && !wide && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("style", { children: sidebarMarkStyles }),
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("svg", { ref: glyph, width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.7", "aria-hidden": "true", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("rect", { x: "3", y: "3", width: "7", height: "7", rx: "2" }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("rect", { x: "14", y: "3", width: "7", height: "7", rx: "2" }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("rect", { x: "3", y: "14", width: "7", height: "7", rx: "2" }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M17.5 14v7M14 17.5h7" }),
+        marked && !wide && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("circle", { className: "studio-sidebar-dot", cx: "21", cy: "3", r: "3", stroke: "none" })
+      ] })
+    ] }),
+    marked && wide && row && (0, import_react_dom.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("span", { className: "studio-ui studio-sidebar-update", "data-phase": state.phase, title: label, role: "img", "aria-label": label, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("style", { children: sidebarMarkStyles }),
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(UpdateGlyph, { phase: state.phase, size: 14 })
+    ] }), row)
+  ] });
+}
+
+// src/shell.tsx
+var import_jsx_runtime12 = require("react/jsx-runtime");
 var inject = ["slots", "locale", "remote"];
 var panel = "local-dsh-studio";
 async function apply(ctx) {
@@ -2072,7 +2231,18 @@ async function apply(ctx) {
     invocation: { kind: "direct" },
     parameters: [{ name: "request", wire: "request", source: "json", codec: { mode: "strict", typeSymbol: "PreviewRequest", create: () => ({ parse: parsePreviewRequest }) } }],
     result: { mode: "src-json" }
-  }, ...["listPresets", "savePreset", "applyPreset", "unapplyPreset", "roleModels", "deletePreset", "readExtensions", "saveExtensions"].map((method) => ({
+  }, ...["updateStatus", "updateStudio"].map((method) => ({
+    id: `${PACKAGE_NAME}#studioCatalog/${method}`,
+    service: "studioCatalog",
+    namespace: "studioCatalog",
+    method,
+    invocation: { kind: "direct" },
+    parameters: [{ name: method === "updateStatus" ? "force" : "version", wire: method === "updateStatus" ? "force" : "version", source: "json", codec: { mode: "strict", typeSymbol: "string", create: () => ({ parse: (value) => {
+      if (typeof value !== "string") throw new TypeError("Expected a string");
+      return value;
+    } }) } }],
+    result: { mode: "src-json" }
+  })), ...["listPresets", "savePreset", "applyPreset", "unapplyPreset", "roleModels", "deletePreset", "readExtensions", "saveExtensions"].map((method) => ({
     id: `${PACKAGE_NAME}#studioCatalog/${method}`,
     service: "studioCatalog",
     namespace: "studioCatalog",
@@ -2096,35 +2266,35 @@ async function apply(ctx) {
   };
   ctx.effect(() => ctx.slots.subscribe("local.dsh-studio.services", syncServices));
   ctx.effect(() => ctx.locale.subscribe(syncServices));
+  const updateActions = /* @__PURE__ */ (() => {
+    const call = async (method, arg) => {
+      const service = ctx.get("remote.studioCatalog");
+      const fn = service?.[method];
+      if (!fn) throw new Error("Studio update API unavailable");
+      const result = await fn(arg);
+      if (!result.ok) throw new Error(result.error?.message ?? "Update request failed");
+      return result.value;
+    };
+    return {
+      status: (force) => call("updateStatus", force ? "force" : ""),
+      update: (version) => call("updateStudio", version)
+    };
+  })();
+  const updates = createUpdateStore(updateActions, STUDIO_VERSION);
+  void updates.refresh();
   function StudioServices({ renderSlot }) {
-    const items = import_react11.default.useSyncExternalStore((listener) => {
+    const items = import_react12.default.useSyncExternalStore((listener) => {
       serviceListeners.add(listener);
       return () => {
         serviceListeners.delete(listener);
       };
     }, () => services);
-    const locale = import_react11.default.useSyncExternalStore((listener) => ctx.locale.subscribe(listener), () => ctx.locale.getLocale().active);
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(StudioSurface, { className: "studio-shell", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("main", { className: "studio-page", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ServiceLayout, { locale, services: items, renderSlot }) }) });
+    const locale = import_react12.default.useSyncExternalStore((listener) => ctx.locale.subscribe(listener), () => ctx.locale.getLocale().active);
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(StudioSurface, { className: "studio-shell", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("main", { className: "studio-page", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ServiceLayout, { locale, services: items, renderSlot }) }) });
   }
   function Icon({ size = 20 }) {
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
-      "svg",
-      {
-        width: size,
-        height: size,
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "currentColor",
-        strokeWidth: "1.7",
-        "aria-hidden": "true",
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("rect", { x: "3", y: "3", width: "7", height: "7", rx: "2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("rect", { x: "14", y: "3", width: "7", height: "7", rx: "2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("rect", { x: "3", y: "14", width: "7", height: "7", rx: "2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M17.5 14v7M14 17.5h7" })
-        ]
-      }
-    );
+    const locale = import_react12.default.useSyncExternalStore((listener) => ctx.locale.subscribe(listener), () => ctx.locale.getLocale().active);
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarIcon, { size, store: updates, locale });
   }
   ctx.slots.inject(
     "main",
@@ -2140,10 +2310,10 @@ async function apply(ctx) {
     )
   );
   function OptimizationPage() {
-    const locale = import_react11.default.useSyncExternalStore((listener) => ctx.locale.subscribe(listener), () => ctx.locale.getLocale().active);
-    const [catalog, setCatalog] = import_react11.default.useState();
-    const [catalogError, setCatalogError] = import_react11.default.useState("");
-    import_react11.default.useEffect(() => {
+    const locale = import_react12.default.useSyncExternalStore((listener) => ctx.locale.subscribe(listener), () => ctx.locale.getLocale().active);
+    const [catalog, setCatalog] = import_react12.default.useState();
+    const [catalogError, setCatalogError] = import_react12.default.useState("");
+    import_react12.default.useEffect(() => {
       let active = true;
       const remote2 = ctx.get("remote.studioCatalog");
       if (!remote2) {
@@ -2161,7 +2331,7 @@ async function apply(ctx) {
         active = false;
       };
     }, []);
-    const presetActions = import_react11.default.useMemo(() => {
+    const presetActions = import_react12.default.useMemo(() => {
       const call = async (method, ...args) => {
         const service = ctx.get("remote.studioCatalog");
         const result = await service[method](...args);
@@ -2177,7 +2347,7 @@ async function apply(ctx) {
         delete: (id) => call("deletePreset", id)
       };
     }, []);
-    const extensionActions = import_react11.default.useMemo(() => {
+    const extensionActions = import_react12.default.useMemo(() => {
       const call = async (method, ...args) => {
         const service = ctx.get("remote.studioCatalog");
         const result = await service[method](...args);
@@ -2188,7 +2358,10 @@ async function apply(ctx) {
         setCatalog(await call("saveExtensions", payload));
       } };
     }, []);
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(OptimizationPrototype, { extensionActions, presetActions, locale, catalog, catalogError, onPreview: async (request) => {
+    import_react12.default.useEffect(() => {
+      void updates.refresh();
+    }, []);
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(OptimizationPrototype, { navFooter: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(VersionFooter, { store: updates, locale }), extensionActions, presetActions, locale, catalog, catalogError, onPreview: async (request) => {
       const service = ctx.get("remote.studioCatalog");
       const response = await service.preview(request);
       if (!response.ok) throw new Error(response.error?.message ?? "Preview failed");

package/index.js

@@ -56,6 +56,7 @@ var BATCH_PLUGIN = `${PACKAGE_NAME}/batch`;
 function currentPluginName(name) {
   return name === LEGACY_PACKAGE_NAME || name.startsWith(`${LEGACY_PACKAGE_NAME}/`) ? PACKAGE_NAME + name.slice(LEGACY_PACKAGE_NAME.length) : name;
 }
+var STUDIO_VERSION = "0.2.8";
 
 // src/delegation.ts
 var ROLE_TOOL = "subagent_role";
@@ -383,7 +384,7 @@ var MasterExtensions = class {
 };
 
 // src/host/shell.ts
-import { dirname as dirname3, join as join2 } from "node:path";
+import { dirname as dirname3, join as join3 } from "node:path";
 import { randomUUID as randomUUID4 } from "node:crypto";
 import { Remote, TypertRemoteService } from "@deepseek-ai/dsh-typert-protocol";
 
@@ -1170,9 +1171,142 @@ var PresetStore = class {
   }
 };
 
+// src/host/studio-update.ts
+import { readFile as readFile3 } from "node:fs/promises";
+import { join as join2 } from "node:path";
+import { evaluatePluginCompatibility, getDshRuntimeVersion } from "@deepseek-ai/dsh-app-boot";
+
+// src/update-check.ts
+var STABLE = /^(\d+)\.(\d+)\.(\d+)$/;
+function compareStable(a, b) {
+  const x = STABLE.exec(a);
+  const y = STABLE.exec(b);
+  if (!x || !y) return Number(Boolean(x)) - Number(Boolean(y));
+  for (let i = 1; i <= 3; i++) {
+    const diff = Number(x[i]) - Number(y[i]);
+    if (diff) return Math.sign(diff);
+  }
+  return 0;
+}
+function isNewer(candidate, current) {
+  return STABLE.test(candidate) && compareStable(candidate, current.split("-")[0]) > 0;
+}
+function pickUpdate(document, current, compatible) {
+  const latest = document["dist-tags"]?.latest;
+  const candidates = Object.entries(document.versions ?? {}).filter(([version, manifest]) => isNewer(version, current) && !manifest.deprecated).sort(([a], [b]) => compareStable(b, a));
+  const available = candidates.find(([, manifest]) => compatible(manifest))?.[0];
+  const incompatibleLatest = latest !== void 0 && isNewer(latest, current) && latest !== available && candidates.some(([version]) => version === latest) ? latest : void 0;
+  return { ...latest ? { latest } : {}, ...available ? { available } : {}, ...incompatibleLatest ? { incompatibleLatest } : {} };
+}
+function packumentUrl(registry, name) {
+  return `${registry.replace(/\/+$/, "")}/${name.replace("/", "%2f")}`;
+}
+
+// src/host/studio-update.ts
+var DEFAULT_REGISTRY = "https://registry.npmjs.org";
+var CACHE_MS = 10 * 6e4;
+var StudioUpdater = class {
+  constructor(ctx, fetcher = globalThis.fetch) {
+    this.ctx = ctx;
+    this.fetcher = fetcher;
+  }
+  cached;
+  installing;
+  manager() {
+    return this.ctx.get("pluginManager");
+  }
+  /** Read the current status, reusing a recent registry answer unless `force`. */
+  status(force = false) {
+    if (!force && this.cached && Date.now() - this.cached.at < CACHE_MS) return this.cached.status;
+    const status = this.check();
+    this.cached = { at: Date.now(), status };
+    void status.catch(() => {
+      if (this.cached?.status === status) this.cached = void 0;
+    });
+    return status;
+  }
+  async check() {
+    const result = { current: STUDIO_VERSION };
+    let runtimeVersion;
+    try {
+      runtimeVersion = getDshRuntimeVersion();
+      result.runtimeVersion = runtimeVersion;
+    } catch {
+    }
+    const { source, installed } = await this.profilePackage();
+    if (source) result.source = source;
+    if (installed && installed !== STUDIO_VERSION) result.installed = installed;
+    const baseline = installed && isNewer(installed, STUDIO_VERSION) ? installed : STUDIO_VERSION;
+    const manager = this.manager();
+    if (!manager) result.blocked = "no-plugin-manager";
+    else if (!source) result.blocked = "not-profile-dependency";
+    try {
+      const registries = manager ? await manager.registries().catch(() => void 0) : void 0;
+      const registry = registries?.registry ?? registries?.resolved ?? DEFAULT_REGISTRY;
+      const response = await this.fetcher(packumentUrl(registry, PACKAGE_NAME), {
+        headers: { accept: "application/vnd.npm.install-v1+json; q=1.0, application/json; q=0.8" },
+        signal: AbortSignal.timeout(15e3)
+      });
+      if (!response.ok) throw new Error(`Registry answered ${response.status}`);
+      const document = await response.json();
+      Object.assign(result, pickUpdate(document, baseline, (manifest) => {
+        try {
+          return evaluatePluginCompatibility({ name: PACKAGE_NAME, version: "0.0.0", ...manifest }, {}, runtimeVersion) === void 0;
+        } catch {
+          return false;
+        }
+      }));
+    } catch (error) {
+      result.error = error instanceof Error ? error.message : String(error);
+    }
+    return result;
+  }
+  /** How the profile declares Studio and which version its files hold now. */
+  async profilePackage() {
+    const dir = this.ctx.get("profileContext")?.dir ?? process.env.DSH_PROFILE_DIR;
+    if (!dir) return {};
+    const json2 = async (path) => {
+      try {
+        return JSON.parse(await readFile3(path, "utf8"));
+      } catch {
+        return void 0;
+      }
+    };
+    const manifest = await json2(join2(dir, "package.json"));
+    const source = manifest?.dependencies?.[PACKAGE_NAME];
+    const installed = (await json2(join2(dir, "node_modules", ...PACKAGE_NAME.split("/"), "package.json")))?.version;
+    return { ...source ? { source } : {}, ...typeof installed === "string" ? { installed } : {} };
+  }
+  /**
+   * Install one exact version offered by {@link status}. The running Studio keeps its code until DSH restarts.
+   * @param version Exact version; must equal the current offer so arbitrary specs never reach pnpm.
+   */
+  update(version) {
+    if (this.installing) return this.installing;
+    const run = (async () => {
+      const status = await this.status();
+      if (status.available !== version) throw new Error(`Version ${version} is not the offered update`);
+      if (status.blocked) throw new Error(`Studio cannot update this install (${status.blocked})`);
+      const manager = this.manager();
+      const result = await manager.installBundle(`${PACKAGE_NAME}@${version}`, { enabled: true });
+      const installed = result.version ?? version;
+      if (result.application === "failed" || result.application === "cancelled") {
+        const detail = result.error?.diagnostic ?? result.error?.code ?? result.packageResult?.output?.trim().split("\n").slice(-3).join("\n");
+        return { status: result.application, version: installed, ...detail ? { message: detail } : {} };
+      }
+      this.cached = void 0;
+      return { status: result.application === "applied" ? "applied" : "restart-required", version: installed };
+    })();
+    this.installing = run;
+    return run.finally(() => {
+      this.installing = void 0;
+    });
+  }
+};
+
 // src/host/shell.ts
-var _preview_dec, _saveExtensions_dec, _readExtensions_dec, _read_dec, _deletePreset_dec, _roleModels_dec, _unapplyPreset_dec, _applyPreset_dec, _savePreset_dec, _listPresets_dec, _a, _init;
-var StudioCatalog = class extends (_a = TypertRemoteService, _listPresets_dec = [Remote], _savePreset_dec = [Remote], _applyPreset_dec = [Remote], _unapplyPreset_dec = [Remote], _roleModels_dec = [Remote], _deletePreset_dec = [Remote], _read_dec = [Remote], _readExtensions_dec = [Remote], _saveExtensions_dec = [Remote], _preview_dec = [Remote], _a) {
+var _preview_dec, _saveExtensions_dec, _readExtensions_dec, _read_dec, _deletePreset_dec, _updateStudio_dec, _updateStatus_dec, _roleModels_dec, _unapplyPreset_dec, _applyPreset_dec, _savePreset_dec, _listPresets_dec, _a, _init;
+var StudioCatalog = class extends (_a = TypertRemoteService, _listPresets_dec = [Remote], _savePreset_dec = [Remote], _applyPreset_dec = [Remote], _unapplyPreset_dec = [Remote], _roleModels_dec = [Remote], _updateStatus_dec = [Remote], _updateStudio_dec = [Remote], _deletePreset_dec = [Remote], _read_dec = [Remote], _readExtensions_dec = [Remote], _saveExtensions_dec = [Remote], _preview_dec = [Remote], _a) {
   constructor(ctx) {
     super(ctx, "studioCatalog");
     __runInitializers(_init, 5, this);
@@ -1182,8 +1316,9 @@ var StudioCatalog = class extends (_a = TypertRemoteService, _listPresets_dec =
     __publicField(this, "stopped", false);
     __publicField(this, "extensions");
     __publicField(this, "changes", Promise.resolve());
+    __publicField(this, "updater", new StudioUpdater(this.ctx));
     const storePath = studioStorePath(process.env, ctx.get("profileContext"));
-    this.extensions = new MasterExtensions(join2(dirname3(storePath), "master-extensions.json"));
+    this.extensions = new MasterExtensions(join3(dirname3(storePath), "master-extensions.json"));
     this.store = new PresetStore(ctx, storePath);
     this.snapshot = new Promise((resolve2) => {
       setImmediate(resolve2);
@@ -1219,6 +1354,12 @@ var StudioCatalog = class extends (_a = TypertRemoteService, _listPresets_dec =
     if (!service) throw new Error("Model catalog API unavailable");
     return service.modelCatalog();
   }
+  async updateStatus(force) {
+    return this.updater.status(force === "force");
+  }
+  async updateStudio(version) {
+    return this.updater.update(version);
+  }
   async deletePreset(id) {
     return this.store.delete(id);
   }
@@ -1319,6 +1460,8 @@ __decorateElement(_init, 1, "savePreset", _savePreset_dec, StudioCatalog);
 __decorateElement(_init, 1, "applyPreset", _applyPreset_dec, StudioCatalog);
 __decorateElement(_init, 1, "unapplyPreset", _unapplyPreset_dec, StudioCatalog);
 __decorateElement(_init, 1, "roleModels", _roleModels_dec, StudioCatalog);
+__decorateElement(_init, 1, "updateStatus", _updateStatus_dec, StudioCatalog);
+__decorateElement(_init, 1, "updateStudio", _updateStudio_dec, StudioCatalog);
 __decorateElement(_init, 1, "deletePreset", _deletePreset_dec, StudioCatalog);
 __decorateElement(_init, 1, "read", _read_dec, StudioCatalog);
 __decorateElement(_init, 1, "readExtensions", _readExtensions_dec, StudioCatalog);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@matamt-dbg/dsh-studio",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "description": "DSH Studio: build, edit and apply DeepSeek Harness agent presets — tools, prompts, Configs and role-based subagents — from the web GUI.",
   "keywords": [
     "deepseek-harness",