@webskill/sdk 0.10.0 → 0.11.0

package/dist/ui.js

@@ -1,4 +1,4 @@
-import { V as buildRenderResult } from "./dist-BViUeszk.js";
-import { $ as UI_CATALOG_PROMPT_BUDGET_BYTES, A as fromUiSurfaceActionDispatch, B as resolveColumnWidths, C as collectSpecActions, D as evaluateFieldCondition, E as ensureStyles, F as normalizeColumnWidths, G as toUiSurfaceActionDispatch, H as toA2uiSurfaceAction, I as qualifyFieldName, K as toVercelToolInvocation, L as renderBlocks, M as interactionToUiSpec, N as loadOpenUiPeers, O as fromA2uiSpecAction, P as loadWebSkillLitCatalog, Q as UI_CATALOG_GROUPS, R as renderMiniChart, S as collectScopedValues, T as createUiCatalogToolSource, U as toJsonRenderSpec, V as toA2uiSpecMessages, W as toOpenUiSpecLang, X as DEFAULT_INTERACTION_TEXTS, Y as A2UI_COMMON_TYPES, Z as DEFAULT_SURFACE_FORM_TEXTS, _ as WEBSKILL_SURFACE_ACTION, a as A2UI_VERSION, at as defineUiCatalog, b as chartToTable, c as MAX_CONDITION_DEPTH, ct as renderMiniMarkdown, d as SPEC_TABLE_MIN_COLUMN_WIDTH, dt as shapeInteractionValue, et as WEBSKILL_A2UI_CATALOG_ID, f as UI_PRESETS, ft as uiCatalog, g as WEBSKILL_STYLES_CSS, h as VercelUiBridge, i as A2UI_SURFACE_ACTION, it as chartSpecFromProps, j as fromVercelToolResult, k as fromA2uiSurfaceAction, l as RENDER_UI_TOOL, lt as resolveInteractionTexts, m as VERCEL_INTERACTION_TOOL_NAME, n as A2UI_SPEC_ACTION, nt as a2uiComponentShapes, o as CHART_PALETTE, ot as interactionToFormModel, p as UI_PRESET_NAMES, q as uiPreset, r as A2UI_SPEC_FORM_PATH, rt as buildA2uiCatalogDefinition, s as DESCRIBE_UI_PRESET_TOOL, st as mountEchart, t as A2UI_BASIC_CATALOG_ID, tt as a2uiComponentSchema, u as SPEC_TABLE_MIN_COLUMN_VAR, ut as resolveSurfaceFormTexts, v as WebFormBridge, w as collectValues, x as collectFormScopes, y as applySuggestion, z as renderRenderResult } from "./dist-1OFC-zax.js";
+import { Z as buildRenderResult } from "./dist-B-cOu08W.js";
+import { $ as uiPreset, A as ensureStyles, B as mountViewerComponents, C as applySuggestion, D as collectSpecActions, E as collectScopedValues, F as fromVercelToolResult, G as renderRenderResult, H as qualifyFieldName, I as gaugePercent, J as toA2uiSurfaceAction, K as resolveColumnWidths, L as interactionToUiSpec, M as fromA2uiSpecAction, N as fromA2uiSurfaceAction, O as collectValues, P as fromUiSurfaceActionDispatch, Q as toVercelToolInvocation, R as loadOpenUiPeers, S as WebFormBridge, St as uiCatalog, T as collectFormScopes, U as renderBlocks, V as normalizeColumnWidths, W as renderMiniChart, X as toOpenUiSpecLang, Y as toJsonRenderSpec, Z as toUiSurfaceActionDispatch, _ as VIEWER_FALLBACK_ATTR, _t as mountEchart, a as A2UI_VERSION, at as DEFAULT_INTERACTION_TEXTS, b as WEBSKILL_STYLES_CSS, bt as resolveSurfaceFormTexts, c as DOCUMENT_COMPONENTS, ct as UI_CATALOG_GROUPS, d as SPEC_TABLE_MIN_COLUMN_VAR, dt as a2uiComponentSchema, f as SPEC_TABLE_MIN_COLUMN_WIDTH, ft as a2uiComponentShapes, g as VIEWER_COMPONENT_ATTR, gt as interactionToFormModel, h as VERCEL_INTERACTION_TOOL_NAME, ht as defineUiCatalog, i as A2UI_SURFACE_ACTION, it as CATALOG_SCHEMA_MAX, j as evaluateFieldCondition, k as createUiCatalogToolSource, l as MAX_CONDITION_DEPTH, lt as UI_CATALOG_PROMPT_BUDGET_BYTES, m as UI_PRESET_NAMES, mt as chartSpecFromProps, n as A2UI_SPEC_ACTION, nt as CATALOG_BUDGET_STAGE, o as CHART_PALETTE, ot as DEFAULT_SURFACE_FORM_TEXTS, p as UI_PRESETS, pt as buildA2uiCatalogDefinition, q as toA2uiSpecMessages, r as A2UI_SPEC_FORM_PATH, rt as CATALOG_PROMPT_MAX, s as DESCRIBE_UI_PRESET_TOOL, st as PLANNED_INCREMENT, t as A2UI_BASIC_CATALOG_ID, tt as A2UI_COMMON_TYPES, u as RENDER_UI_TOOL, ut as WEBSKILL_A2UI_CATALOG_ID, v as VIEWER_PROPS_ATTR, vt as renderMiniMarkdown, w as chartToTable, x as WEBSKILL_SURFACE_ACTION, xt as shapeInteractionValue, y as VercelUiBridge, yt as resolveInteractionTexts, z as loadWebSkillLitCatalog } from "./dist-DTHZS2k1.js";
 
-export { A2UI_BASIC_CATALOG_ID, A2UI_COMMON_TYPES, A2UI_SPEC_ACTION, A2UI_SPEC_FORM_PATH, A2UI_SURFACE_ACTION, A2UI_VERSION, CHART_PALETTE, DEFAULT_INTERACTION_TEXTS, DEFAULT_SURFACE_FORM_TEXTS, DESCRIBE_UI_PRESET_TOOL, MAX_CONDITION_DEPTH, RENDER_UI_TOOL, SPEC_TABLE_MIN_COLUMN_VAR, SPEC_TABLE_MIN_COLUMN_WIDTH, UI_CATALOG_GROUPS, UI_CATALOG_PROMPT_BUDGET_BYTES, UI_PRESETS, UI_PRESET_NAMES, VERCEL_INTERACTION_TOOL_NAME, VercelUiBridge, WEBSKILL_A2UI_CATALOG_ID, WEBSKILL_STYLES_CSS, WEBSKILL_SURFACE_ACTION, WebFormBridge, a2uiComponentSchema, a2uiComponentShapes, applySuggestion, buildA2uiCatalogDefinition, buildRenderResult, chartSpecFromProps, chartToTable, collectFormScopes, collectScopedValues, collectSpecActions, collectValues, createUiCatalogToolSource, defineUiCatalog, ensureStyles, evaluateFieldCondition, fromA2uiSpecAction, fromA2uiSurfaceAction, fromUiSurfaceActionDispatch, fromVercelToolResult, interactionToFormModel, interactionToUiSpec, loadOpenUiPeers, loadWebSkillLitCatalog, mountEchart, normalizeColumnWidths, qualifyFieldName, renderBlocks, renderMiniChart, renderMiniMarkdown, renderRenderResult, resolveColumnWidths, resolveInteractionTexts, resolveSurfaceFormTexts, shapeInteractionValue, toA2uiSpecMessages, toA2uiSurfaceAction, toJsonRenderSpec, toOpenUiSpecLang, toUiSurfaceActionDispatch, toVercelToolInvocation, uiCatalog, uiPreset };
+export { A2UI_BASIC_CATALOG_ID, A2UI_COMMON_TYPES, A2UI_SPEC_ACTION, A2UI_SPEC_FORM_PATH, A2UI_SURFACE_ACTION, A2UI_VERSION, CATALOG_BUDGET_STAGE, CATALOG_PROMPT_MAX, CATALOG_SCHEMA_MAX, CHART_PALETTE, DEFAULT_INTERACTION_TEXTS, DEFAULT_SURFACE_FORM_TEXTS, DESCRIBE_UI_PRESET_TOOL, DOCUMENT_COMPONENTS, MAX_CONDITION_DEPTH, PLANNED_INCREMENT, RENDER_UI_TOOL, SPEC_TABLE_MIN_COLUMN_VAR, SPEC_TABLE_MIN_COLUMN_WIDTH, UI_CATALOG_GROUPS, UI_CATALOG_PROMPT_BUDGET_BYTES, UI_PRESETS, UI_PRESET_NAMES, VERCEL_INTERACTION_TOOL_NAME, VIEWER_COMPONENT_ATTR, VIEWER_FALLBACK_ATTR, VIEWER_PROPS_ATTR, VercelUiBridge, WEBSKILL_A2UI_CATALOG_ID, WEBSKILL_STYLES_CSS, WEBSKILL_SURFACE_ACTION, WebFormBridge, a2uiComponentSchema, a2uiComponentShapes, applySuggestion, buildA2uiCatalogDefinition, buildRenderResult, chartSpecFromProps, chartToTable, collectFormScopes, collectScopedValues, collectSpecActions, collectValues, createUiCatalogToolSource, defineUiCatalog, ensureStyles, evaluateFieldCondition, fromA2uiSpecAction, fromA2uiSurfaceAction, fromUiSurfaceActionDispatch, fromVercelToolResult, gaugePercent, interactionToFormModel, interactionToUiSpec, loadOpenUiPeers, loadWebSkillLitCatalog, mountEchart, mountViewerComponents, normalizeColumnWidths, qualifyFieldName, renderBlocks, renderMiniChart, renderMiniMarkdown, renderRenderResult, resolveColumnWidths, resolveInteractionTexts, resolveSurfaceFormTexts, shapeInteractionValue, toA2uiSpecMessages, toA2uiSurfaceAction, toJsonRenderSpec, toOpenUiSpecLang, toUiSurfaceActionDispatch, toVercelToolInvocation, uiCatalog, uiPreset };

package/dist/{webskillLitCatalog-BJrphK0y-SGmRXaaO.js → webskillLitCatalog-DME6PBkV-CmYNLlIT.js}

@@ -1,4 +1,4 @@
-import { J as A2UI_CHILDREN_PROP, Z as DEFAULT_SURFACE_FORM_TEXTS, ct as renderMiniMarkdown, et as WEBSKILL_A2UI_CATALOG_ID, ft as uiCatalog, it as chartSpecFromProps, nt as a2uiComponentShapes, st as mountEchart } from "./dist-1OFC-zax.js";
+import { St as uiCatalog, _t as mountEchart, et as A2UI_CHILDREN_PROP, ft as a2uiComponentShapes, mt as chartSpecFromProps, ot as DEFAULT_SURFACE_FORM_TEXTS, ut as WEBSKILL_A2UI_CATALOG_ID, vt as renderMiniMarkdown } from "./dist-DTHZS2k1.js";
 import { A2uiController, A2uiLitElement } from "@a2ui/lit/v0_9";
 import { Catalog } from "@a2ui/web_core/v0_9";
 import { z } from "zod/v3";
@@ -1419,7 +1419,7 @@ var f = class extends i {
 };
 
 //#endregion
-//#region ../ui/dist/webskillLitCatalog-BJrphK0y.js
+//#region ../ui/dist/webskillLitCatalog-DME6PBkV.js
 /**
 * Lit 元素上的 echarts 挂载指令。
 * A2UI 档的 catalog `Chart` 渲染在 shadow root 里，实例必须随元素断开而 dispose，
@@ -1460,6 +1460,37 @@ var EchartDirective = class extends f {
 const echart = e(EchartDirective);
 /** 自定义元素 tag 前缀（同一文档里与 A2UI Basic Catalog 的 `a2ui-basic-*` 互不冲突） */
 const WEBSKILL_A2UI_TAG_PREFIX = "webskill-a2ui";
+/** 与 React 档 `specLayout.tsx` 同一组取值：语义档最小列宽与主次分栏比例 */
+const MIN_COLUMN_WIDTH = {
+	sm: "12rem",
+	md: "16rem",
+	lg: "22rem"
+};
+const SPLIT_RATIO = {
+	"1:1": "1fr 1fr",
+	"2:1": "2fr 1fr",
+	"3:1": "3fr 1fr",
+	"1:2": "1fr 2fr"
+};
+/** 与 React 档 `specLayout.tsx` 同一组字形：白名单外的名字降级为可读文本 */
+const ICON_GLYPH = {
+	info: "ℹ",
+	check: "✓",
+	alert: "⚠",
+	x: "✕",
+	clock: "◷",
+	calendar: "▤",
+	user: "☺",
+	star: "★",
+	search: "⌕",
+	settings: "⚙",
+	download: "↓",
+	link: "🔗",
+	chart: "▥",
+	file: "▢",
+	folder: "▤",
+	mail: "✉"
+};
 /**
 * ui-kit 设计 token 是 `:root` 上的 CSS 自定义属性，CSS 变量天然继承进 shadow root，
 * 因此这些元素直接消费 `var(--border)` 等 token，亮暗切换随宿主 `.dark` 生效。
@@ -1617,6 +1648,25 @@ const sharedStyles = i$4`
     display: grid;
     gap: 0.75rem;
   }
+  .split {
+    display: grid;
+    gap: 0.75rem;
+  }
+  /* 与 ui-kit 的 .webskill-spec-form__fields 同一判据（FR-11.6） */
+  .webskill-spec-form__fields {
+    display: grid;
+    gap: 0.75rem;
+    container-type: inline-size;
+  }
+  .webskill-spec-form__fields:has(> :nth-child(6)) {
+    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
+  }
+  /* 窄容器降级为纵向堆叠：surface 可能被塞进任意宽度的宿主容器 */
+  @container (max-width: 30rem) {
+    .split {
+      grid-template-columns: 1fr !important;
+    }
+  }
   ol.timeline {
     display: flex;
     flex-direction: column;
@@ -1663,23 +1713,30 @@ const renderers = {
       <div class="stack" data-direction="vertical">
         <div class="tabs" role="tablist">
           ${labels.map((label, index) => T`<button
-              type="button"
-              role="tab"
-              aria-selected=${index === active ? "true" : "false"}
-              @click=${() => {
+                type="button"
+                role="tab"
+                aria-selected=${index === active ? "true" : "false"}
+                @click=${() => {
 			host.view["tab"] = index;
 			host.refresh();
 		}}
-            >
-              ${label}
-            </button>`)}
+              >
+                ${label}
+              </button>`)}
         </div>
         ${panels[active] ? host.renderChild(panels[active]) : A}
       </div>
     `;
 	},
-	Grid: (props, host) => T`
-    <div class="grid" style=${`grid-template-columns: repeat(${Number(props["columns"] ?? 2)}, minmax(0, 1fr))`}>
+	Grid: (props, host) => {
+		const min = MIN_COLUMN_WIDTH[str(props, "minColumnWidth", "md")] ?? MIN_COLUMN_WIDTH["md"];
+		return T`<div class="grid" style=${`grid-template-columns: ${props["columns"] === "auto" ? `repeat(auto-fit, minmax(${min}, 1fr))` : `repeat(${Number(props["columns"] ?? 2)}, minmax(0, 1fr))`}`}>${children(props, host)}</div>`;
+	},
+	Split: (props, host) => T`
+    <div
+      class="split"
+      style=${`grid-template-columns: ${SPLIT_RATIO[str(props, "ratio", "1:1")] ?? SPLIT_RATIO["1:1"]}`}
+    >
       ${children(props, host)}
     </div>
   `,
@@ -1716,13 +1773,74 @@ const renderers = {
     </div>
   `,
 	Chart: (props) => T`<div class="chart" ${echart(chartSpecFromProps(props))}></div>`,
+	Icon: (props) => T`<span class="icon" role="img" aria-label=${str(props, "name")} data-palette=${str(props, "palette")}
+      >${ICON_GLYPH[str(props, "name")] ?? str(props, "name")}</span
+    >`,
+	Image: (props) => T`<img class="image" src=${str(props, "src")} alt=${str(props, "alt")} />`,
+	Quote: (props) => T`
+    <blockquote class="quote">
+      ${str(props, "text")}${props["by"] ? T`<footer class="muted">— ${str(props, "by")}</footer>` : A}
+    </blockquote>
+  `,
+	Callout: (props) => T`
+    <aside class="callout" data-palette=${str(props, "palette")}>
+      ${props["title"] ? T`<strong>${str(props, "title")}</strong>` : A}
+      <p>${str(props, "text")}</p>
+    </aside>
+  `,
+	KeyValue: (props) => T`
+    <dl class="keyvalue">
+      ${list(props["items"]).map((item) => T`<dt class="muted">${String(item["label"] ?? "")}</dt>
+            <dd>${String(item["value"] ?? "")}</dd>`)}
+    </dl>
+  `,
+	Gauge: (props) => {
+		const min = Number(props["min"] ?? 0);
+		const max = Number(props["max"] ?? 100);
+		const value = Number(props["value"] ?? min);
+		const span = max - min;
+		const percent = span > 0 ? Math.max(0, Math.min(100, (value - min) / span * 100)) : 0;
+		return T`
+      <div class="metric">
+        ${props["label"] ? T`<span class="muted">${str(props, "label")}</span>` : A}
+        <div
+          class="bar"
+          role="meter"
+          aria-valuenow=${value}
+          aria-valuemin=${min}
+          aria-valuemax=${max}
+          aria-label=${str(props, "label", "Gauge")}
+        >
+          <span style=${`width: ${percent}%`}></span>
+        </div>
+        <strong>${value}</strong>
+      </div>
+    `;
+	},
+	Accordion: (props) => T`
+    <div class="accordion">
+      ${list(props["items"]).map((item) => T`<details>
+            <summary>${String(item["title"] ?? "")}</summary>
+            <p>${String(item["text"] ?? "")}</p>
+          </details>`)}
+    </div>
+  `,
+	Carousel: (props) => T`
+    <div class="carousel" role="group" aria-label="Carousel">
+      ${list(props["items"]).map((item) => T`<figure>
+            ${item["src"] ? T`<img src=${String(item["src"])} alt=${String(item["title"] ?? "")} />` : A}
+            <figcaption>${String(item["title"] ?? "")}</figcaption>
+            ${item["text"] ? T`<p class="muted">${String(item["text"])}</p>` : A}
+          </figure>`)}
+    </div>
+  `,
 	Timeline: (props) => T`
     <ol class="timeline">
       ${list(props["items"]).map((item) => T`<li>
-          <strong>${String(item["title"] ?? "")}</strong>
-          ${item["time"] ? T`<p class="muted">${String(item["time"])}</p>` : A}
-          ${item["description"] ? T`<p>${String(item["description"])}</p>` : A}
-        </li>`)}
+            <strong>${String(item["title"] ?? "")}</strong>
+            ${item["time"] ? T`<p class="muted">${String(item["time"])}</p>` : A}
+            ${item["description"] ? T`<p>${String(item["description"])}</p>` : A}
+          </li>`)}
     </ol>
   `,
 	Progress: (props) => {
@@ -1746,7 +1864,8 @@ const renderers = {
 	FileLink: (props) => T`<p>${str(props, "label", str(props, "path"))}</p>`,
 	Form: (props, host) => T`
     <form @submit=${(event) => event.preventDefault()}>
-      ${props["title"] ? T`<h3>${str(props, "title")}</h3>` : A} ${children(props, host)}
+      ${props["title"] ? T`<h3>${str(props, "title")}</h3>` : A}
+      <div class="webskill-spec-form__fields">${children(props, host)}</div>
     </form>
   `,
 	FieldArray: (props, host) => T`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webskill/sdk",
-  "version": "0.10.0",
+  "version": "0.11.0",
   "description": "WebSkill — browser/Node agent skill runtime (skills, tools, MCP, governance, UI)",
   "license": "MIT",
   "type": "module",