@workflow-code/cli 0.2.4-20261013004.codex-studio-integration → 0.2.4-20261013006.codex-studio-integration

package/dist/web/kanban-workspace.js

@@ -12607,6 +12607,45 @@
     "{0}{1} \xB7 {2} items": "\u5DF2{0}{1} \xB7 {2} \u9879",
     "{1} in {0}": "{0} \u4E2D {1}",
     "Account balance ${0}": "\u8D26\u6237\u4F59\u989D ${0}",
+    "Account balance": "\u8D26\u6237\u4F59\u989D",
+    "Account changed. Refresh usage.": "\u8D26\u53F7\u5DF2\u5207\u6362\uFF0C\u8BF7\u91CD\u65B0\u83B7\u53D6\u7528\u91CF\u3002",
+    "AI usage": "AI \u7528\u91CF",
+    All: "\u5168\u90E8",
+    "Basic information": "\u57FA\u672C\u4FE1\u606F",
+    Declarations: "\u58F0\u660E",
+    "Default name": "\u9ED8\u8BA4\u540D\u79F0",
+    "Entrypoints granted": "\u5165\u53E3\u8C03\u7528\u6388\u6743",
+    "Knowledge read granted": "\u77E5\u8BC6\u5E93\u8BFB\u53D6\u6388\u6743",
+    "Knowledge write granted": "\u77E5\u8BC6\u5E93\u5199\u5165\u6388\u6743",
+    "KV read granted": "KV \u8BFB\u53D6\u6388\u6743",
+    "KV write granted": "KV \u5199\u5165\u6388\u6743",
+    "Limit reached": "\u989D\u5EA6\u5DF2\u7528\u5C3D",
+    "Loading usage...": "\u6B63\u5728\u52A0\u8F7D\u7528\u91CF...",
+    Local: "\u672C\u5730",
+    "Local and server": "\u672C\u5730\u4E0E\u670D\u52A1\u5668",
+    "Local path": "\u672C\u5730\u8DEF\u5F84",
+    "Localized names": "\u591A\u8BED\u8A00\u540D\u79F0",
+    "Multiple languages": "\u591A\u8BED\u8A00",
+    "Multiple platforms": "\u591A\u5E73\u53F0",
+    "Not allowed": "\u4E0D\u5141\u8BB8",
+    "Not available": "\u6682\u65E0\u6570\u636E",
+    "Not declared": "\u672A\u58F0\u660E",
+    "Platform independent": "\u5E73\u53F0\u65E0\u5173",
+    "Platform support": "\u5E73\u53F0\u652F\u6301",
+    Prefixes: "\u524D\u7F00",
+    "Project declarations": "\u9879\u76EE\u58F0\u660E",
+    "Project information": "\u9879\u76EE\u4FE1\u606F",
+    "Project type": "\u9879\u76EE\u7C7B\u578B",
+    "Project UUID": "\u9879\u76EE UUID",
+    "Related project: {0}": "\u5173\u8054\u9879\u76EE\uFF1A{0}",
+    "Storage location": "\u5B58\u50A8\u4F4D\u7F6E",
+    "Usage unavailable": "\u6682\u65F6\u65E0\u6CD5\u83B7\u53D6\u7528\u91CF",
+    Used: "\u5DF2\u4F7F\u7528",
+    Version: "\u7248\u672C",
+    "Working directory": "\u5DE5\u4F5C\u76EE\u5F55",
+    "{0} (default)": "{0}\uFF08\u9ED8\u8BA4\uFF09",
+    "{0} remaining": "\u5269\u4F59 {0}",
+    "{0} usage": "{0}\u7528\u91CF",
     "Add attachment": "\u6DFB\u52A0\u9644\u4EF6",
     "Agent run": "Agent \u8FD0\u884C",
     "All chats": "\u5168\u90E8\u804A\u5929",
@@ -16070,6 +16109,17 @@ ${state2.user?.avatarUrl ?? ""}`;
   }
 
   // src/web/workflow-types.ts
+  var projectTypeLabels = {
+    get conversation() {
+      return t2("Conversation");
+    },
+    get workflow() {
+      return t2("Workflow");
+    },
+    get kanban() {
+      return t2("Kanban");
+    }
+  };
   function workflowParamValue(field, value = field.defaultValue ?? "") {
     if (field.type === "file" || field.control === "audio" || !(field.multiple || field.control === "checkboxes") || Array.isArray(value)) {
       return value;
@@ -16171,11 +16221,20 @@ ${state2.user?.avatarUrl ?? ""}`;
         const label = document.createElement("span");
         label.className = "param-action-label";
         const view = { action: action2, button, label };
+        if (action2.kind === "quick" && action2.id === "ai") {
+          button.classList.add("param-action-ai");
+          button.append(icon("sparkle"));
+        }
         if (action2.kind === "auxiliary") {
           button.append(icon("settings"));
           view.count = document.createElement("small");
         }
         button.append(label);
+        if (action2.kind === "quick") {
+          view.summary = document.createElement("span");
+          view.summary.className = "param-action-summary";
+          button.append(view.summary);
+        }
         if (view.count) {
           button.append(view.count);
         }
@@ -16232,14 +16291,17 @@ ${state2.user?.avatarUrl ?? ""}`;
           view.button.hidden = fields2.length === 0;
           view.button.disabled = disabled || (action2.kind === "auxiliary" ? loading : fields2.every((field) => states[field.name]?.disabled === true || this.visibleOptions(field).length === 0));
           const summaries = action2.summary?.map((name) => fields2.find((field) => field.name === name)).filter((field) => !!field && !!values2[field.name]?.length).map((field) => parameterSelectionLabel(field, values2[field.name], states[field.name])) ?? [];
-          view.label.textContent = action2.kind === "quick" && summaries.length ? `${action2.label}: ${summaries.join(" \xB7 ")}` : action2.label;
+          view.label.textContent = action2.label;
+          if (view.summary) {
+            view.summary.textContent = summaries.join(" \xB7 ");
+            view.summary.hidden = !summaries.length;
+          }
           if (view.count) {
             view.count.textContent = String(fields2.length);
           }
           view.button.setAttribute("aria-busy", String(loading));
         }
-        view.button.title = view.label.textContent || "";
-        view.button.ariaLabel = view.label.textContent || "";
+        view.button.title = view.button.ariaLabel = [view.label.textContent, view.summary?.textContent].filter(Boolean).join(": ");
       }
       if (this.active) {
         if (disabled || this.active.button.hidden) {
@@ -16676,15 +16738,101 @@ ${state2.user?.avatarUrl ?? ""}`;
     }
   };
 
+  // src/web/ui/project-information.ts
+  function access(rule) {
+    if (rule?.mode === "all") {
+      return t2("All");
+    }
+    if (rule?.mode === "none") {
+      return t2("Not allowed");
+    }
+    if (rule?.mode === "prefixes") {
+      return `${t2("Prefixes")}: ${rule.prefixes.join(", ")}`;
+    }
+    return t2("Not declared");
+  }
+  function projectInformation(project2) {
+    const info = project2.projectInfo;
+    const storage = { local: t2("Local"), server: t2("Server"), both: t2("Local and server") };
+    const declarations = { multilingual: t2("Multiple languages"), multiplatform: t2("Multiple platforms") };
+    const platforms = { macos: "macOS", windows: "Windows", web: "Web" };
+    const sections = [{
+      title: t2("Basic information"),
+      expanded: true,
+      rows: [
+        { label: t2("Default name"), value: project2.manifest?.name || project2.name },
+        { label: t2("Project type"), value: projectTypeLabels[project2.projectType] },
+        { label: t2("Version"), value: project2.manifest?.version || t2("Not declared") },
+        { label: t2("Project UUID"), value: project2.id },
+        { label: project2.assistant ? t2("Working directory") : t2("Local path"), value: project2.assistant?.workdir || project2.folderPath }
+      ]
+    }, {
+      title: t2("Project declarations"),
+      expanded: true,
+      rows: [
+        { label: t2("Storage location"), value: info?.dataStorage ? storage[info.dataStorage.mode] : t2("Not declared") },
+        { label: t2("Platform support"), value: info?.platformSupport.mode === "specific" ? info.platformSupport.platforms.map((id) => platforms[id] || id).join(", ") : t2("Platform independent") },
+        { label: t2("Declarations"), value: info?.declarations.map((id) => declarations[id] || id).join(", ") || t2("Not declared") }
+      ]
+    }];
+    if (info && Object.keys(info.localizedNames).length) {
+      sections.push({ title: t2("Localized names"), rows: Object.entries(info.localizedNames).map(([label, value]) => ({ label, value })) });
+    }
+    for (const relation of info?.relatedProjects ?? []) {
+      const grant = relation.grantToRelatedProject;
+      sections.push({ title: t2("Related project: {0}", relation.alias), rows: [
+        { label: t2("Project UUID"), value: relation.projectId },
+        { label: t2("KV read granted"), value: access(grant.read) },
+        { label: t2("KV write granted"), value: access(grant.write) },
+        { label: t2("Knowledge read granted"), value: access(grant.knowledge?.read) },
+        { label: t2("Knowledge write granted"), value: access(grant.knowledge?.write) },
+        { label: t2("Entrypoints granted"), value: access(grant.entrypoints) }
+      ] });
+    }
+    if (project2.entrypoints.length) {
+      sections.push({ title: t2("Entrypoints"), rows: project2.entrypoints.map((entry) => ({
+        label: entry.title || entry.id,
+        value: entry.id === project2.defaultEntrypoint ? t2("{0} (default)", entry.id) : entry.id
+      })) });
+    }
+    return sections;
+  }
+
+  // src/web/ui/ai-usage.ts
+  function usageAmount(value) {
+    return value != null && Number.isFinite(Number(value)) ? `$${Math.max(0, Number(value)).toFixed(2)}` : t2("Not available");
+  }
+  function usagePeriods(subscription) {
+    const labels = { daily: t2("Daily"), weekly: t2("Weekly"), monthly: t2("Monthly") };
+    return ["daily", "weekly", "monthly"].map((period) => {
+      const rawUsed = subscription[`${period}UsageUsd`], rawLimit = subscription[`${period}LimitUsd`];
+      const used = Number.isFinite(Number(rawUsed)) && rawUsed != null ? Math.max(0, Number(rawUsed)) : void 0;
+      const limit = rawLimit === null ? null : Number.isFinite(Number(rawLimit)) && rawLimit !== void 0 ? Math.max(0, Number(rawLimit)) : void 0;
+      const ratio = used !== void 0 && limit !== null && limit !== void 0 ? limit > 0 ? used / limit : 1 : void 0;
+      return {
+        period,
+        label: labels[period],
+        used,
+        limit,
+        ratio,
+        status: ratio === void 0 ? "" : ratio >= 1 ? "exhausted" : ratio >= 0.8 ? "near-limit" : "",
+        remaining: used !== void 0 && limit !== null && limit !== void 0 ? Math.max(0, limit - used) : void 0
+      };
+    });
+  }
+
   // src/web/ui/conversation-tools.ts
   var ConversationTools = class {
     dialog = document.createElement("dialog");
     body = document.createElement("div");
     title = document.createElement("h2");
     usageOpen = false;
+    usageRequestId;
     refresh;
     constructor() {
       this.dialog.className = "conversation-dialog";
+      this.title.id = "conversation-dialog-title";
+      this.dialog.setAttribute("aria-labelledby", this.title.id);
       const header = document.createElement("header");
       header.append(this.title, iconButton("close", t2("Close"), () => this.close()));
       this.body.className = "dialog-body";
@@ -16698,6 +16846,7 @@ ${state2.user?.avatarUrl ?? ""}`;
           }
         }
       });
+      this.dialog.addEventListener("cancel", () => this.close());
     }
     get open() {
       return this.dialog.open;
@@ -16705,13 +16854,20 @@ ${state2.user?.avatarUrl ?? ""}`;
     close() {
       this.dialog.close();
       this.usageOpen = false;
+      this.usageRequestId = void 0;
       this.refresh?.remove();
       this.refresh = void 0;
     }
+    closeUsage() {
+      if (this.usageOpen) {
+        this.close();
+      }
+    }
     show(title) {
       this.close();
       this.title.textContent = title;
       this.body.replaceChildren();
+      this.body.setAttribute("aria-busy", "false");
       this.dialog.showModal();
     }
     plan(content) {
@@ -16729,6 +16885,35 @@ ${state2.user?.avatarUrl ?? ""}`;
       image.className = "image-preview";
       this.body.append(image);
     }
+    projectInfo(project2) {
+      this.show(t2("Project information"));
+      const heading = document.createElement("h3");
+      heading.className = "project-information-name";
+      heading.textContent = project2.name;
+      this.body.append(heading);
+      if (project2.manifest?.description) {
+        const description = document.createElement("p");
+        description.className = "project-information-description";
+        description.textContent = project2.manifest.description;
+        this.body.append(description);
+      }
+      for (const section of projectInformation(project2)) {
+        const details = document.createElement("details");
+        details.className = "project-information-section";
+        details.open = !!section.expanded;
+        const summary = document.createElement("summary");
+        summary.innerHTML = `${iconHtml("chevron-right")}<span>${escapeHtml(section.title)}</span>`;
+        const list = document.createElement("dl");
+        for (const row of section.rows) {
+          const label = document.createElement("dt"), value = document.createElement("dd");
+          label.textContent = row.label;
+          value.textContent = row.value;
+          list.append(label, value);
+        }
+        details.append(summary, list);
+        this.body.append(details);
+      }
+    }
     permissions(parameters, policies, changed) {
       this.show(t2("Tool permissions"));
       const tools = parameters.tools ?? [];
@@ -16772,35 +16957,46 @@ ${state2.user?.avatarUrl ?? ""}`;
       }
     }
     usage(load) {
-      this.show(t2("System AI"));
+      this.show(t2("AI usage"));
       this.usageOpen = true;
-      const refresh = this.refresh = iconButton("refresh", t2("Refresh usage"), () => {
-        this.body.textContent = t2("Loading...");
-        load();
-      });
+      const refresh = this.refresh = iconButton("refresh", t2("Refresh usage"), () => this.loadUsage(load));
       this.dialog.querySelector("header").insertBefore(refresh, this.dialog.querySelector("header > button:last-child"));
-      this.body.textContent = t2("Loading...");
-      load();
+      this.loadUsage(load);
     }
-    usageResult(data, error) {
-      if (!this.usageOpen) {
-        return;
+    loadUsage(load) {
+      this.body.innerHTML = `<div class="usage-status" role="status">${iconHtml("loading")}<span>${t2("Loading usage...")}</span></div>`;
+      this.body.setAttribute("aria-busy", "true");
+      if (this.refresh) {
+        this.refresh.disabled = true;
       }
-      this.body.replaceChildren();
-      if (error) {
-        this.body.textContent = error;
+      this.usageRequestId = crypto.randomUUID();
+      load(this.usageRequestId);
+    }
+    usageResult(requestId, data, error) {
+      if (!this.usageOpen || requestId !== this.usageRequestId) {
         return;
       }
-      if (!data) {
+      this.body.replaceChildren();
+      this.body.setAttribute("aria-busy", "false");
+      if (this.refresh) {
+        this.refresh.disabled = false;
+      }
+      if (error || !data) {
+        const status = document.createElement("p");
+        status.className = error ? "error usage-status" : "usage-status";
+        status.setAttribute("role", error ? "alert" : "status");
+        status.textContent = error || t2("Usage unavailable");
+        this.body.append(status);
         return;
       }
-      const balance = document.createElement("p");
-      balance.textContent = t2("Account balance ${0}", Number(data.balance ?? 0).toFixed(2));
+      const balance = document.createElement("div");
+      balance.className = "usage-balance";
+      balance.innerHTML = `<span>${t2("Account balance")}</span><strong>${escapeHtml(usageAmount(data.balance))}</strong><small>USD</small>`;
       this.body.append(balance);
-      const labels = { daily: t2("Daily"), weekly: t2("Weekly"), monthly: t2("Monthly") };
       const plans = data.groups.filter((group) => group.subscriptionType === "subscription" && group.subscription?.status === "active");
       if (!plans.length) {
         const empty = document.createElement("p");
+        empty.className = "usage-status";
         empty.textContent = t2("No active subscriptions");
         this.body.append(empty);
       }
@@ -16810,19 +17006,24 @@ ${state2.user?.avatarUrl ?? ""}`;
         const title = document.createElement("h3");
         title.textContent = plan.name;
         section.append(title);
-        for (const period of ["daily", "weekly", "monthly"]) {
-          const limit = plan.subscription[`${period}LimitUsd`];
-          const used = Number(plan.subscription[`${period}UsageUsd`] ?? 0);
+        for (const period of usagePeriods(plan.subscription)) {
           const row = document.createElement("div");
-          const label = document.createElement("span");
-          label.textContent = `${labels[period]} $${used.toFixed(2)} / ${limit === null ? t2("Unlimited") : `$${Number(limit).toFixed(2)}`}`;
-          row.append(label);
-          if (limit !== null && limit > 0) {
+          row.className = "usage-period";
+          row.dataset.status = period.status;
+          const used = period.used === void 0 ? t2("Not available") : usageAmount(period.used);
+          const limit = period.limit === null ? t2("Unlimited") : period.limit === void 0 ? t2("Not available") : usageAmount(period.limit);
+          row.innerHTML = `<div class="usage-period-heading"><span>${period.label}</span><strong>${period.ratio === void 0 ? escapeHtml(limit) : `${Math.round(period.ratio * 100)}%`}</strong></div><div class="usage-period-amount"><strong>${escapeHtml(used)}</strong><span>/ ${escapeHtml(limit)}</span></div>`;
+          if (period.ratio !== void 0) {
             const progress = document.createElement("progress");
-            progress.max = limit;
-            progress.value = used;
+            progress.max = 1;
+            progress.value = Math.min(1, period.ratio);
+            progress.ariaLabel = t2("{0} usage", period.label);
             row.append(progress);
           }
+          const remaining = document.createElement("span");
+          remaining.className = "usage-period-remaining";
+          remaining.textContent = period.status === "exhausted" ? t2("Limit reached") : period.remaining === void 0 ? t2("Used") : t2("{0} remaining", usageAmount(period.remaining));
+          row.append(remaining);
           section.append(row);
         }
         this.body.append(section);
@@ -17243,7 +17444,7 @@ ${state2.user?.avatarUrl ?? ""}`;
   var host = acquireWorkflowHost();
   app.classList.add("kanban-app");
   app.innerHTML = `
-<header class="toolbar"><div class="project-title"><button id="menu-toggle" class="icon-button" aria-label="${t2("Show Kanban configurations")}" title="${t2("Show Kanban configurations")}">${iconHtml("layout-sidebar-left")}</button><span class="project-icon">${iconHtml("layout")}</span><h1 id="kanban-title">Kanban</h1></div><div class="toolbar-actions"><div id="preview-modes" class="kanban-modes" role="group" aria-label="${t2("Preview size")}"></div><button id="dimensions" class="icon-button" title="${t2("Resize preview")}" aria-label="${t2("Resize preview")}" hidden>${iconHtml("settings")}</button><button id="refresh" class="icon-button" title="${t2("Refresh Kanban")}" aria-label="${t2("Refresh Kanban")}">${iconHtml("refresh")}</button><button id="usage" class="icon-button" title="${t2("System AI usage")}" aria-label="${t2("System AI usage")}" hidden>${iconHtml("dashboard")}</button><button id="methods" class="icon-button" title="${t2("Page methods")}" aria-label="${t2("Page methods")}">${iconHtml("tools")}</button></div></header>
+<header class="toolbar"><div class="project-title"><button id="menu-toggle" class="icon-button" aria-label="${t2("Show Kanban configurations")}" title="${t2("Show Kanban configurations")}">${iconHtml("layout-sidebar-left")}</button><button id="project-info" class="icon-button" title="${t2("Project information")}" aria-label="${t2("Project information")}" aria-haspopup="dialog">${iconHtml("info")}</button><span class="project-icon">${iconHtml("layout")}</span><h1 id="kanban-title">Kanban</h1></div><div class="toolbar-actions"><div id="preview-modes" class="kanban-modes" role="group" aria-label="${t2("Preview size")}"></div><button id="dimensions" class="icon-button" title="${t2("Resize preview")}" aria-label="${t2("Resize preview")}" hidden>${iconHtml("settings")}</button><button id="refresh" class="icon-button" title="${t2("Refresh Kanban")}" aria-label="${t2("Refresh Kanban")}">${iconHtml("refresh")}</button><button id="usage" class="icon-button usage-button" title="${t2("System AI usage")}" aria-label="${t2("System AI usage")}" aria-haspopup="dialog" hidden>${iconHtml("dashboard")}<span>${t2("AI usage")}</span></button><button id="methods" class="icon-button" title="${t2("Page methods")}" aria-label="${t2("Page methods")}">${iconHtml("tools")}</button></div></header>
 <aside id="project-menu" class="project-menu" aria-label="${t2("Kanban configurations")}"><div class="menu-heading"><span>${t2("Kanban configurations")}</span><button id="hide-menu" class="icon-button" title="${t2("Hide Kanban configurations")}" aria-label="${t2("Hide Kanban configurations")}">${iconHtml("chevron-left")}</button></div><div id="configuration-editor"><div class="kanban-configuration-controls"><select id="configuration" aria-label="${t2("Current configuration")}"></select><button id="create" class="icon-button" title="${t2("New configuration")}" aria-label="${t2("New configuration")}">${iconHtml("add")}</button><button id="configuration-actions" class="icon-button" title="${t2("Configuration actions")}" aria-label="${t2("Configuration actions")}">${iconHtml("ellipsis")}</button></div><div id="save-error" class="error" hidden role="alert"><span></span><button id="retry-save" class="icon-button" title="${t2("Retry save")}" aria-label="${t2("Retry save")}">${iconHtml("refresh")}</button></div><div id="kanban-fields"></div><div id="parameter-actions"></div></div></aside>
 <main><div id="error" class="error" hidden role="alert"></div><div id="related-warning" class="kanban-warning" hidden role="status"></div><div id="preview-stage"><div id="preview-viewport"><iframe id="kanban-preview" title="Kanban" sandbox="allow-scripts"></iframe><button id="resize-preview" class="kanban-resize" title="${t2("Resize preview")}" aria-label="${t2("Resize preview")}" hidden>${iconHtml("arrow-both")}</button></div><div id="preview-status" class="kanban-status" role="status"><span class="codicon codicon-loading"></span><span>${t2("Loading Kanban")}</span><button id="retry-preview" class="icon-button" title="${t2("Retry")}" aria-label="${t2("Retry")}" hidden>${iconHtml("refresh")}</button></div><div id="preview-offline" hidden></div></div></main>
 <dialog id="configuration-dialog" class="conversation-dialog"><header><h2>${t2("Configuration actions")}</h2><button id="close-configurations" class="icon-button" title="${t2("Close")}" aria-label="${t2("Close")}">${iconHtml("close")}</button></header><div class="dialog-body configuration-command-list"></div></dialog>
@@ -17656,7 +17857,12 @@ ${state2.user?.avatarUrl ?? ""}`;
       controls();
     }
   };
-  element("usage").onclick = () => dialogs.usage(() => host.postMessage({ type: "usage" }));
+  element("usage").onclick = () => dialogs.usage((requestId) => host.postMessage({ type: "usage", requestId }));
+  element("project-info").onclick = () => {
+    if (project) {
+      dialogs.projectInfo(project);
+    }
+  };
   window.addEventListener("message", (event) => {
     const message = event.data;
     if (event.source === frame.contentWindow) {
@@ -17736,6 +17942,7 @@ ${state2.user?.avatarUrl ?? ""}`;
           saveTimer = setTimeout(() => void save().catch(showError), 250);
         }
       } else {
+        dialogs.closeUsage();
         for (const waiting of pending.values()) {
           clearTimeout(waiting.timer);
           waiting.reject(new Error(t2("Connection interrupted.")));
@@ -17752,15 +17959,16 @@ ${state2.user?.avatarUrl ?? ""}`;
       if (authRevision !== message.authenticationRevision) {
         authRevision = message.authenticationRevision;
         previewKey = "";
+        dialogs.closeUsage();
       }
       element("usage").hidden = message.account.status !== "authenticated";
       update(message.kanban);
     }
     if (message.type === "usage") {
-      dialogs.usageResult(message.usage);
+      dialogs.usageResult(message.requestId, message.usage);
     }
     if (message.type === "error" && message.requestType === "usage") {
-      dialogs.usageResult(void 0, message.message);
+      dialogs.usageResult(message.requestId, void 0, message.message);
       return;
     }
     if (message.type === "error" && !message.silent && !message.requestId) {