@webskill/sdk 0.3.0 → 0.4.0

package/dist/{webskillLitCatalog-CNaUpasU-BslMcxRZ.js → webskillLitCatalog-CSTbhBe_-CYIs5BX8.js}

@@ -1,4 +1,4 @@
-import { dt as renderMiniMarkdown, et as A2UI_CHILDREN_PROP, ft as uiCatalog, it as WEBSKILL_A2UI_CATALOG_ID, ot as a2uiComponentShapes, ut as renderMiniChart } from "./dist-ZKaM8j06.js";
+import { G as mountEchart, I as A2UI_CHILDREN_PROP, K as renderMiniMarkdown, U as chartSpecFromProps, V as a2uiComponentShapes, q as uiCatalog, z as WEBSKILL_A2UI_CATALOG_ID } from "./dist-D9Lcn5Pp.js";
 import { A2uiController, A2uiLitElement } from "@a2ui/lit/v0_9";
 import { Catalog } from "@a2ui/web_core/v0_9";
 import { z } from "zod/v3";
@@ -677,21 +677,21 @@ const windowShim = new WindowShim(constructionToken);
 * Copyright 2019 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
 */
-const t$1 = globalThis;
-const e$1 = t$1.ShadowRoot && (void 0 === t$1.ShadyCSS || t$1.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype;
-const s$2 = Symbol();
-const o$3 = /* @__PURE__ */ new WeakMap();
-var n$2 = class {
+const t$3 = globalThis;
+const e$3 = t$3.ShadowRoot && (void 0 === t$3.ShadyCSS || t$3.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype;
+const s$4 = Symbol();
+const o$4 = /* @__PURE__ */ new WeakMap();
+var n$4 = class {
 	constructor(t, e, o) {
-		if (this._$cssResult$ = !0, o !== s$2) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+		if (this._$cssResult$ = !0, o !== s$4) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
 		this.cssText = t, this.t = e;
 	}
 	get styleSheet() {
 		let t = this.o;
 		const s = this.t;
-		if (e$1 && void 0 === t) {
+		if (e$3 && void 0 === t) {
 			const e = void 0 !== s && 1 === s.length;
-			e && (t = o$3.get(s)), void 0 === t && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), e && o$3.set(s, t));
+			e && (t = o$4.get(s)), void 0 === t && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), e && o$4.set(s, t));
 		}
 		return t;
 	}
@@ -699,41 +699,41 @@ var n$2 = class {
 		return this.cssText;
 	}
 };
-const r$2 = (t) => new n$2("string" == typeof t ? t : t + "", void 0, s$2);
-const i$2 = (t, ...e) => {
+const r$4 = (t) => new n$4("string" == typeof t ? t : t + "", void 0, s$4);
+const i$4 = (t, ...e) => {
 	const o = 1 === t.length ? t[0] : e.reduce((e, s, o) => e + ((t) => {
 		if (!0 === t._$cssResult$) return t.cssText;
 		if ("number" == typeof t) return t;
 		throw Error("Value passed to 'css' function must be a 'css' function result: " + t + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.");
 	})(s) + t[o + 1], t[0]);
-	return new n$2(o, t, s$2);
+	return new n$4(o, t, s$4);
 };
 const S$1 = (s, o) => {
-	if (e$1) s.adoptedStyleSheets = o.map((t) => t instanceof CSSStyleSheet ? t : t.styleSheet);
+	if (e$3) s.adoptedStyleSheets = o.map((t) => t instanceof CSSStyleSheet ? t : t.styleSheet);
 	else for (const e of o) {
-		const o = document.createElement("style"), n = t$1.litNonce;
+		const o = document.createElement("style"), n = t$3.litNonce;
 		void 0 !== n && o.setAttribute("nonce", n), o.textContent = e.cssText, s.appendChild(o);
 	}
 };
-const c$2 = e$1 || void 0 === t$1.CSSStyleSheet ? (t) => t : (t) => t instanceof CSSStyleSheet ? ((t) => {
+const c$4 = e$3 || void 0 === t$3.CSSStyleSheet ? (t) => t : (t) => t instanceof CSSStyleSheet ? ((t) => {
 	let e = "";
 	for (const s of t.cssRules) e += s.cssText;
-	return r$2(e);
+	return r$4(e);
 })(t) : t;
 
 //#endregion
 //#region ../../node_modules/.pnpm/@lit+reactive-element@2.1.2/node_modules/@lit/reactive-element/node/reactive-element.js
-const { is: h$1, defineProperty: r$1, getOwnPropertyDescriptor: o$2, getOwnPropertyNames: n$1, getOwnPropertySymbols: a$1, getPrototypeOf: c$1 } = Object, l$1 = globalThis;
-l$1.customElements ??= customElements$1;
-const p$1 = l$1.trustedTypes;
-const d$1 = p$1 ? p$1.emptyScript : "";
-const u$1 = l$1.reactiveElementPolyfillSupport;
-const f$1 = (t, s) => t;
+const { is: h$3, defineProperty: r$3, getOwnPropertyDescriptor: o$3, getOwnPropertyNames: n$3, getOwnPropertySymbols: a$1, getPrototypeOf: c$3 } = Object, l$2 = globalThis;
+l$2.customElements ??= customElements$1;
+const p$2 = l$2.trustedTypes;
+const d$2 = p$2 ? p$2.emptyScript : "";
+const u$2 = l$2.reactiveElementPolyfillSupport;
+const f$3 = (t, s) => t;
 const b$1 = {
 	toAttribute(t, s) {
 		switch (s) {
 			case Boolean:
-				t = t ? d$1 : null;
+				t = t ? d$2 : null;
 				break;
 			case Object:
 			case Array: t = null == t ? t : JSON.stringify(t);
@@ -759,16 +759,16 @@ const b$1 = {
 		return i;
 	}
 };
-const m$1 = (t, s) => !h$1(t, s);
+const m$2 = (t, s) => !h$3(t, s);
 const y$1 = {
 	attribute: !0,
 	type: String,
 	converter: b$1,
 	reflect: !1,
 	useDefault: !1,
-	hasChanged: m$1
+	hasChanged: m$2
 };
-Symbol.metadata ??= Symbol("metadata"), l$1.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap();
+Symbol.metadata ??= Symbol("metadata"), l$2.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap();
 var g$1 = class extends (globalThis.HTMLElement ?? HTMLElementShimWithRealType) {
 	static addInitializer(t) {
 		this._$Ei(), (this.l ??= []).push(t);
@@ -779,11 +779,11 @@ var g$1 = class extends (globalThis.HTMLElement ?? HTMLElementShimWithRealType)
 	static createProperty(t, s = y$1) {
 		if (s.state && (s.attribute = !1), this._$Ei(), this.prototype.hasOwnProperty(t) && ((s = Object.create(s)).wrapped = !0), this.elementProperties.set(t, s), !s.noAccessor) {
 			const i = Symbol(), e = this.getPropertyDescriptor(t, i, s);
-			void 0 !== e && r$1(this.prototype, t, e);
+			void 0 !== e && r$3(this.prototype, t, e);
 		}
 	}
 	static getPropertyDescriptor(t, s, i) {
-		const { get: e, set: h } = o$2(this.prototype, t) ?? {
+		const { get: e, set: h } = o$3(this.prototype, t) ?? {
 			get() {
 				return this[s];
 			},
@@ -805,14 +805,14 @@ var g$1 = class extends (globalThis.HTMLElement ?? HTMLElementShimWithRealType)
 		return this.elementProperties.get(t) ?? y$1;
 	}
 	static _$Ei() {
-		if (this.hasOwnProperty(f$1("elementProperties"))) return;
-		const t = c$1(this);
+		if (this.hasOwnProperty(f$3("elementProperties"))) return;
+		const t = c$3(this);
 		t.finalize(), void 0 !== t.l && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
 	}
 	static finalize() {
-		if (this.hasOwnProperty(f$1("finalized"))) return;
-		if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(f$1("properties"))) {
-			const t = this.properties, s = [...n$1(t), ...a$1(t)];
+		if (this.hasOwnProperty(f$3("finalized"))) return;
+		if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(f$3("properties"))) {
+			const t = this.properties, s = [...n$3(t), ...a$1(t)];
 			for (const i of s) this.createProperty(i, t[i]);
 		}
 		const t = this[Symbol.metadata];
@@ -831,8 +831,8 @@ var g$1 = class extends (globalThis.HTMLElement ?? HTMLElementShimWithRealType)
 		const s = [];
 		if (Array.isArray(t)) {
 			const e = new Set(t.flat(Infinity).reverse());
-			for (const t of e) s.unshift(c$2(t));
-		} else void 0 !== t && s.push(c$2(t));
+			for (const t of e) s.unshift(c$4(t));
+		} else void 0 !== t && s.push(c$4(t));
 		return s;
 	}
 	static _$Eu(t, s) {
@@ -889,7 +889,7 @@ var g$1 = class extends (globalThis.HTMLElement ?? HTMLElementShimWithRealType)
 	requestUpdate(t, s, i, e = !1, h) {
 		if (void 0 !== t) {
 			const r = this.constructor;
-			if (!1 === e && (h = this[t]), i ??= r.getPropertyOptions(t), !((i.hasChanged ?? m$1)(h, s) || i.useDefault && i.reflect && h === this._$Ej?.get(t) && !this.hasAttribute(r._$Eu(t, i)))) return;
+			if (!1 === e && (h = this[t]), i ??= r.getPropertyOptions(t), !((i.hasChanged ?? m$2)(h, s) || i.useDefault && i.reflect && h === this._$Ej?.get(t) && !this.hasAttribute(r._$Eu(t, i)))) return;
 			this.C(t, s, i);
 		}
 		!1 === this.isUpdatePending && (this._$ES = this._$EP());
@@ -954,7 +954,7 @@ var g$1 = class extends (globalThis.HTMLElement ?? HTMLElementShimWithRealType)
 	updated(t) {}
 	firstUpdated(t) {}
 };
-g$1.elementStyles = [], g$1.shadowRootOptions = { mode: "open" }, g$1[f$1("elementProperties")] = /* @__PURE__ */ new Map(), g$1[f$1("finalized")] = /* @__PURE__ */ new Map(), u$1?.({ ReactiveElement: g$1 }), (l$1.reactiveElementVersions ??= []).push("2.1.2");
+g$1.elementStyles = [], g$1.shadowRootOptions = { mode: "open" }, g$1[f$3("elementProperties")] = /* @__PURE__ */ new Map(), g$1[f$3("finalized")] = /* @__PURE__ */ new Map(), u$2?.({ ReactiveElement: g$1 }), (l$2.reactiveElementVersions ??= []).push("2.1.2");
 
 //#endregion
 //#region ../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/node/lit-html.js
@@ -963,24 +963,24 @@ g$1.elementStyles = [], g$1.shadowRootOptions = { mode: "open" }, g$1[f$1("eleme
 * Copyright 2017 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
 */
-const t = globalThis;
-const i$1 = (t) => t;
-const s$1 = t.trustedTypes;
-const e = s$1 ? s$1.createPolicy("lit-html", { createHTML: (t) => t }) : void 0;
-const h = "$lit$";
-const o$1 = `lit$${Math.random().toFixed(9).slice(2)}$`;
-const n = "?" + o$1;
-const r = `<${n}>`;
-const l = void 0 === t.document ? { createTreeWalker: () => ({}) } : document;
-const c = () => l.createComment("");
+const t$2 = globalThis;
+const i$3 = (t) => t;
+const s$3 = t$2.trustedTypes;
+const e$2 = s$3 ? s$3.createPolicy("lit-html", { createHTML: (t) => t }) : void 0;
+const h$2 = "$lit$";
+const o$2 = `lit$${Math.random().toFixed(9).slice(2)}$`;
+const n$2 = "?" + o$2;
+const r$2 = `<${n$2}>`;
+const l$1 = void 0 === t$2.document ? { createTreeWalker: () => ({}) } : document;
+const c$2 = () => l$1.createComment("");
 const a = (t) => null === t || "object" != typeof t && "function" != typeof t;
-const u = Array.isArray;
-const d = (t) => u(t) || "function" == typeof t?.[Symbol.iterator];
-const f = "[ 	\n\f\r]";
-const v = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g;
+const u$1 = Array.isArray;
+const d$1 = (t) => u$1(t) || "function" == typeof t?.[Symbol.iterator];
+const f$2 = "[ 	\n\f\r]";
+const v$1 = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g;
 const _ = /-->/g;
-const m = />/g;
-const p = RegExp(`>|${f}(?:([^\\s"'>=/]+)(${f}*=${f}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`, "g");
+const m$1 = />/g;
+const p$1 = RegExp(`>|${f$2}(?:([^\\s"'>=/]+)(${f$2}*=${f$2}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`, "g");
 const g = /'/g;
 const $ = /"/g;
 const y = /^(?:script|style|textarea|title)$/i;
@@ -995,20 +995,20 @@ const w = x(3);
 const E = Symbol.for("lit-noChange");
 const A = Symbol.for("lit-nothing");
 const C = /* @__PURE__ */ new WeakMap();
-const P = l.createTreeWalker(l, 129);
+const P = l$1.createTreeWalker(l$1, 129);
 function V(t, i) {
-	if (!u(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
-	return void 0 !== e ? e.createHTML(i) : i;
+	if (!u$1(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
+	return void 0 !== e$2 ? e$2.createHTML(i) : i;
 }
 const N = (t, i) => {
 	const s = t.length - 1, e = [];
-	let n, l = 2 === i ? "<svg>" : 3 === i ? "<math>" : "", c = v;
+	let n, l = 2 === i ? "<svg>" : 3 === i ? "<math>" : "", c = v$1;
 	for (let i = 0; i < s; i++) {
 		const s = t[i];
 		let a, u, d = -1, f = 0;
-		for (; f < s.length && (c.lastIndex = f, u = c.exec(s), null !== u);) f = c.lastIndex, c === v ? "!--" === u[1] ? c = _ : void 0 !== u[1] ? c = m : void 0 !== u[2] ? (y.test(u[2]) && (n = RegExp("</" + u[2], "g")), c = p) : void 0 !== u[3] && (c = p) : c === p ? ">" === u[0] ? (c = n ?? v, d = -1) : void 0 === u[1] ? d = -2 : (d = c.lastIndex - u[2].length, a = u[1], c = void 0 === u[3] ? p : "\"" === u[3] ? $ : g) : c === $ || c === g ? c = p : c === _ || c === m ? c = v : (c = p, n = void 0);
-		const x = c === p && t[i + 1].startsWith("/>") ? " " : "";
-		l += c === v ? s + r : d >= 0 ? (e.push(a), s.slice(0, d) + h + s.slice(d) + o$1 + x) : s + o$1 + (-2 === d ? i : x);
+		for (; f < s.length && (c.lastIndex = f, u = c.exec(s), null !== u);) f = c.lastIndex, c === v$1 ? "!--" === u[1] ? c = _ : void 0 !== u[1] ? c = m$1 : void 0 !== u[2] ? (y.test(u[2]) && (n = RegExp("</" + u[2], "g")), c = p$1) : void 0 !== u[3] && (c = p$1) : c === p$1 ? ">" === u[0] ? (c = n ?? v$1, d = -1) : void 0 === u[1] ? d = -2 : (d = c.lastIndex - u[2].length, a = u[1], c = void 0 === u[3] ? p$1 : "\"" === u[3] ? $ : g) : c === $ || c === g ? c = p$1 : c === _ || c === m$1 ? c = v$1 : (c = p$1, n = void 0);
+		const x = c === p$1 && t[i + 1].startsWith("/>") ? " " : "";
+		l += c === v$1 ? s + r$2 : d >= 0 ? (e.push(a), s.slice(0, d) + h$2 + s.slice(d) + o$2 + x) : s + o$2 + (-2 === d ? i : x);
 	}
 	return [V(t, l + (t[s] || "<?>") + (2 === i ? "</svg>" : 3 === i ? "</math>" : "")), e];
 };
@@ -1024,8 +1024,8 @@ var S = class S {
 		}
 		for (; null !== (r = P.nextNode()) && d.length < u;) {
 			if (1 === r.nodeType) {
-				if (r.hasAttributes()) for (const t of r.getAttributeNames()) if (t.endsWith(h)) {
-					const i = v[a++], s = r.getAttribute(t).split(o$1), e = /([.?@])?(.*)/.exec(i);
+				if (r.hasAttributes()) for (const t of r.getAttributeNames()) if (t.endsWith(h$2)) {
+					const i = v[a++], s = r.getAttribute(t).split(o$2), e = /([.?@])?(.*)/.exec(i);
 					d.push({
 						type: 1,
 						index: l,
@@ -1033,45 +1033,45 @@ var S = class S {
 						strings: s,
 						ctor: "." === e[1] ? I : "?" === e[1] ? L : "@" === e[1] ? z$1 : H
 					}), r.removeAttribute(t);
-				} else t.startsWith(o$1) && (d.push({
+				} else t.startsWith(o$2) && (d.push({
 					type: 6,
 					index: l
 				}), r.removeAttribute(t));
 				if (y.test(r.tagName)) {
-					const t = r.textContent.split(o$1), i = t.length - 1;
+					const t = r.textContent.split(o$2), i = t.length - 1;
 					if (i > 0) {
-						r.textContent = s$1 ? s$1.emptyScript : "";
-						for (let s = 0; s < i; s++) r.append(t[s], c()), P.nextNode(), d.push({
+						r.textContent = s$3 ? s$3.emptyScript : "";
+						for (let s = 0; s < i; s++) r.append(t[s], c$2()), P.nextNode(), d.push({
 							type: 2,
 							index: ++l
 						});
-						r.append(t[i], c());
+						r.append(t[i], c$2());
 					}
 				}
-			} else if (8 === r.nodeType) if (r.data === n) d.push({
+			} else if (8 === r.nodeType) if (r.data === n$2) d.push({
 				type: 2,
 				index: l
 			});
 			else {
 				let t = -1;
-				for (; -1 !== (t = r.data.indexOf(o$1, t + 1));) d.push({
+				for (; -1 !== (t = r.data.indexOf(o$2, t + 1));) d.push({
 					type: 7,
 					index: l
-				}), t += o$1.length - 1;
+				}), t += o$2.length - 1;
 			}
 			l++;
 		}
 	}
 	static createElement(t, i) {
-		const s = l.createElement("template");
+		const s = l$1.createElement("template");
 		return s.innerHTML = t, s;
 	}
 };
-function M(t, i, s = t, e) {
+function M$1(t, i, s = t, e) {
 	if (i === E) return i;
 	let h = void 0 !== e ? s._$Co?.[e] : s._$Cl;
 	const o = a(i) ? void 0 : i._$litDirective$;
-	return h?.constructor !== o && (h?._$AO?.(!1), void 0 === o ? h = void 0 : (h = new o(t), h._$AT(t, s, e)), void 0 !== e ? (s._$Co ??= [])[e] = h : s._$Cl = h), void 0 !== h && (i = M(t, h._$AS(t, i.values), h, e)), i;
+	return h?.constructor !== o && (h?._$AO?.(!1), void 0 === o ? h = void 0 : (h = new o(t), h._$AT(t, s, e)), void 0 !== e ? (s._$Co ??= [])[e] = h : s._$Cl = h), void 0 !== h && (i = M$1(t, h._$AS(t, i.values), h, e)), i;
 }
 var k = class {
 	constructor(t, i) {
@@ -1084,7 +1084,7 @@ var k = class {
 		return this._$AM._$AU;
 	}
 	u(t) {
-		const { el: { content: i }, parts: s } = this._$AD, e = (t?.creationScope ?? l).importNode(i, !0);
+		const { el: { content: i }, parts: s } = this._$AD, e = (t?.creationScope ?? l$1).importNode(i, !0);
 		P.currentNode = e;
 		let h = P.nextNode(), o = 0, n = 0, r = s[0];
 		for (; void 0 !== r;) {
@@ -1094,7 +1094,7 @@ var k = class {
 			}
 			o !== r?.index && (h = P.nextNode(), o++);
 		}
-		return P.currentNode = l, e;
+		return P.currentNode = l$1, e;
 	}
 	p(t) {
 		let i = 0;
@@ -1120,7 +1120,7 @@ var R = class R {
 		return this._$AB;
 	}
 	_$AI(t, i = this) {
-		t = M(this, t, i), a(t) ? t === A || null == t || "" === t ? (this._$AH !== A && this._$AR(), this._$AH = A) : t !== this._$AH && t !== E && this._(t) : void 0 !== t._$litType$ ? this.$(t) : void 0 !== t.nodeType ? this.T(t) : d(t) ? this.k(t) : this._(t);
+		t = M$1(this, t, i), a(t) ? t === A || null == t || "" === t ? (this._$AH !== A && this._$AR(), this._$AH = A) : t !== this._$AH && t !== E && this._(t) : void 0 !== t._$litType$ ? this.$(t) : void 0 !== t.nodeType ? this.T(t) : d$1(t) ? this.k(t) : this._(t);
 	}
 	O(t) {
 		return this._$AA.parentNode.insertBefore(t, this._$AB);
@@ -1129,7 +1129,7 @@ var R = class R {
 		this._$AH !== t && (this._$AR(), this._$AH = this.O(t));
 	}
 	_(t) {
-		this._$AH !== A && a(this._$AH) ? this._$AA.nextSibling.data = t : this.T(l.createTextNode(t)), this._$AH = t;
+		this._$AH !== A && a(this._$AH) ? this._$AA.nextSibling.data = t : this.T(l$1.createTextNode(t)), this._$AH = t;
 	}
 	$(t) {
 		const { values: i, _$litType$: s } = t, e = "number" == typeof s ? this._$AC(t) : (void 0 === s.el && (s.el = S.createElement(V(s.h, s.h[0]), this.options)), s);
@@ -1144,16 +1144,16 @@ var R = class R {
 		return void 0 === i && C.set(t.strings, i = new S(t)), i;
 	}
 	k(t) {
-		u(this._$AH) || (this._$AH = [], this._$AR());
+		u$1(this._$AH) || (this._$AH = [], this._$AR());
 		const i = this._$AH;
 		let s, e = 0;
-		for (const h of t) e === i.length ? i.push(s = new R(this.O(c()), this.O(c()), this, this.options)) : s = i[e], s._$AI(h), e++;
+		for (const h of t) e === i.length ? i.push(s = new R(this.O(c$2()), this.O(c$2()), this, this.options)) : s = i[e], s._$AI(h), e++;
 		e < i.length && (this._$AR(s && s._$AB.nextSibling, e), i.length = e);
 	}
 	_$AR(t = this._$AA.nextSibling, s) {
 		for (this._$AP?.(!1, !0, s); t !== this._$AB;) {
-			const s = i$1(t).nextSibling;
-			i$1(t).remove(), t = s;
+			const s = i$3(t).nextSibling;
+			i$3(t).remove(), t = s;
 		}
 	}
 	setConnected(t) {
@@ -1173,11 +1173,11 @@ var H = class {
 	_$AI(t, i = this, s, e) {
 		const h = this.strings;
 		let o = !1;
-		if (void 0 === h) t = M(this, t, i, 0), o = !a(t) || t !== this._$AH && t !== E, o && (this._$AH = t);
+		if (void 0 === h) t = M$1(this, t, i, 0), o = !a(t) || t !== this._$AH && t !== E, o && (this._$AH = t);
 		else {
 			const e = t;
 			let n, r;
-			for (t = h[0], n = 0; n < h.length - 1; n++) r = M(this, e[s + n], i, n), r === E && (r = this._$AH[n]), o ||= !a(r) || r !== this._$AH[n], r === A ? t = A : t !== A && (t += (r ?? "") + h[n + 1]), this._$AH[n] = r;
+			for (t = h[0], n = 0; n < h.length - 1; n++) r = M$1(this, e[s + n], i, n), r === E && (r = this._$AH[n]), o ||= !a(r) || r !== this._$AH[n], r === A ? t = A : t !== A && (t += (r ?? "") + h[n + 1]), this._$AH[n] = r;
 		}
 		o && !e && this.j(t);
 	}
@@ -1206,7 +1206,7 @@ var z$1 = class extends H {
 		super(t, i, s, e, h), this.type = 5;
 	}
 	_$AI(t, i = this) {
-		if ((t = M(this, t, i, 0) ?? A) === E) return;
+		if ((t = M$1(this, t, i, 0) ?? A) === E) return;
 		const s = this._$AH, e = t === A && s !== A || t.capture !== s.capture || t.once !== s.once || t.passive !== s.passive, h = t !== A && (s === A || e);
 		e && this.element.removeEventListener(this.name, this, s), h && this.element.addEventListener(this.name, this, t), this._$AH = t;
 	}
@@ -1222,17 +1222,33 @@ var W = class {
 		return this._$AM._$AU;
 	}
 	_$AI(t) {
-		M(this, t);
+		M$1(this, t);
 	}
 };
-const j = t.litHtmlPolyfillSupport;
-j?.(S, R), (t.litHtmlVersions ??= []).push("3.3.3");
+const Z = {
+	M: h$2,
+	P: o$2,
+	A: n$2,
+	C: 1,
+	L: N,
+	R: k,
+	D: d$1,
+	V: M$1,
+	I: R,
+	H,
+	N: L,
+	U: z$1,
+	B: I,
+	F: W
+};
+const j$1 = t$2.litHtmlPolyfillSupport;
+j$1?.(S, R), (t$2.litHtmlVersions ??= []).push("3.3.3");
 const B = (t, i, s) => {
 	const e = s?.renderBefore ?? i;
 	let h = e._$litPart$;
 	if (void 0 === h) {
 		const t = s?.renderBefore ?? null;
-		e._$litPart$ = h = new R(i.insertBefore(c(), t), t, void 0, s ?? {});
+		e._$litPart$ = h = new R(i.insertBefore(c$2(), t), t, void 0, s ?? {});
 	}
 	return h._$AI(t), h;
 };
@@ -1243,8 +1259,8 @@ const B = (t, i, s) => {
 * @license
 * Copyright 2017 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
-*/ const s = globalThis;
-var i = class extends g$1 {
+*/ const s$2 = globalThis;
+var i$2 = class extends g$1 {
 	constructor() {
 		super(...arguments), this.renderOptions = { host: this }, this._$Do = void 0;
 	}
@@ -1266,20 +1282,189 @@ var i = class extends g$1 {
 		return E;
 	}
 };
-i._$litElement$ = !0, i["finalized"] = !0, s.litElementHydrateSupport?.({ LitElement: i });
-const o = s.litElementPolyfillSupport;
-o?.({ LitElement: i });
-(s.litElementVersions ??= []).push("4.2.2");
+i$2._$litElement$ = !0, i$2["finalized"] = !0, s$2.litElementHydrateSupport?.({ LitElement: i$2 });
+const o$1 = s$2.litElementPolyfillSupport;
+o$1?.({ LitElement: i$2 });
+(s$2.litElementVersions ??= []).push("4.2.2");
 
 //#endregion
-//#region ../ui/dist/webskillLitCatalog-CNaUpasU.js
+//#region ../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/node/directive-helpers.js
+/**
+* @license
+* Copyright 2020 Google LLC
+* SPDX-License-Identifier: BSD-3-Clause
+*/ const { I: t$1 } = Z, i$1 = (o) => o, n$1 = (o) => null === o || "object" != typeof o && "function" != typeof o, e$1 = {
+	HTML: 1,
+	SVG: 2,
+	MATHML: 3
+}, l = (o, t) => void 0 === t ? void 0 !== o?._$litType$ : o?._$litType$ === t, d = (o) => null != o?._$litType$?.h, c$1 = (o) => void 0 !== o?._$litDirective$, f$1 = (o) => o?._$litDirective$, r$1 = (o) => void 0 === o.strings, s$1 = () => document.createComment(""), v = (o, n, e) => {
+	const l = o._$AA.parentNode, d = void 0 === n ? o._$AB : n._$AA;
+	if (void 0 === e) {
+		const i = l.insertBefore(s$1(), d), n = l.insertBefore(s$1(), d);
+		e = new t$1(i, n, o, o.options);
+	} else {
+		const t = e._$AB.nextSibling, n = e._$AM, c = n !== o;
+		if (c) {
+			let t;
+			e._$AQ?.(o), e._$AM = o, void 0 !== e._$AP && (t = o._$AU) !== n._$AU && e._$AP(t);
+		}
+		if (t !== d || c) {
+			let o = e._$AA;
+			for (; o !== t;) {
+				const t = i$1(o).nextSibling;
+				i$1(l).insertBefore(o, d), o = t;
+			}
+		}
+	}
+	return e;
+}, u = (o, t, i = o) => (o._$AI(t, i), o), m = {}, p = (o, t = m) => o._$AH = t, M = (o) => o._$AH, h$1 = (o) => {
+	o._$AR(), o._$AA.remove();
+}, j = (o) => {
+	o._$AR();
+};
+
+//#endregion
+//#region ../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/node/directive.js
+/**
+* @license
+* Copyright 2017 Google LLC
+* SPDX-License-Identifier: BSD-3-Clause
+*/
+const t = {
+	ATTRIBUTE: 1,
+	CHILD: 2,
+	PROPERTY: 3,
+	BOOLEAN_ATTRIBUTE: 4,
+	EVENT: 5,
+	ELEMENT: 6
+};
+const e = (t) => (...e) => ({
+	_$litDirective$: t,
+	values: e
+});
+var i = class {
+	constructor(t) {}
+	get _$AU() {
+		return this._$AM._$AU;
+	}
+	_$AT(t, e, i) {
+		this._$Ct = t, this._$AM = e, this._$Ci = i;
+	}
+	_$AS(t, e) {
+		return this.update(t, e);
+	}
+	update(t, e) {
+		return this.render(...e);
+	}
+};
+
+//#endregion
+//#region ../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/node/async-directive.js
+/**
+* @license
+* Copyright 2017 Google LLC
+* SPDX-License-Identifier: BSD-3-Clause
+*/ const s = (i, t) => {
+	const e = i._$AN;
+	if (void 0 === e) return !1;
+	for (const i of e) i._$AO?.(t, !1), s(i, t);
+	return !0;
+};
+const o = (i) => {
+	let t, e;
+	do {
+		if (void 0 === (t = i._$AM)) break;
+		e = t._$AN, e.delete(i), i = t;
+	} while (0 === e?.size);
+};
+const r = (i) => {
+	for (let t; t = i._$AM; i = t) {
+		let e = t._$AN;
+		if (void 0 === e) t._$AN = e = /* @__PURE__ */ new Set();
+		else if (e.has(i)) break;
+		e.add(i), c(t);
+	}
+};
+function h(i) {
+	void 0 !== this._$AN ? (o(this), this._$AM = i, r(this)) : this._$AM = i;
+}
+function n(i, t = !1, e = 0) {
+	const r = this._$AH, h = this._$AN;
+	if (void 0 !== h && 0 !== h.size) if (t) if (Array.isArray(r)) for (let i = e; i < r.length; i++) s(r[i], !1), o(r[i]);
+	else null != r && (s(r, !1), o(r));
+	else s(this, i);
+}
+const c = (i) => {
+	i.type == t.CHILD && (i._$AP ??= n, i._$AQ ??= h);
+};
+var f = class extends i {
+	constructor() {
+		super(...arguments), this._$AN = void 0;
+	}
+	_$AT(i, t, e) {
+		super._$AT(i, t, e), r(this), this.isConnected = i._$AU;
+	}
+	_$AO(i, t = !0) {
+		i !== this.isConnected && (this.isConnected = i, i ? this.reconnected?.() : this.disconnected?.()), t && (s(this, i), o(this));
+	}
+	setValue(t) {
+		if (r$1(this._$Ct)) this._$Ct._$AI(t, this);
+		else {
+			const i = [...this._$Ct._$AH];
+			i[this._$Ci] = t, this._$Ct._$AI(i, this, 0);
+		}
+	}
+	disconnected() {}
+	reconnected() {}
+};
+
+//#endregion
+//#region ../ui/dist/webskillLitCatalog-CSTbhBe_.js
+/**
+* Lit 元素上的 echarts 挂载指令。
+* A2UI 档的 catalog `Chart` 渲染在 shadow root 里，实例必须随元素断开而 dispose，
+* 否则每次声明树重渲染都会留下一个仍在监听 resize 的 echarts 实例。
+*/
+var EchartDirective = class extends f {
+	#element;
+	#handle;
+	#chart;
+	constructor(partInfo) {
+		super(partInfo);
+		if (partInfo.type !== t.ELEMENT) throw new Error("echart() must be used as an element directive");
+	}
+	render(_chart) {
+		return A;
+	}
+	update(part, [chart]) {
+		const element = part.element;
+		if (this.#element !== element) {
+			this.#handle?.dispose();
+			this.#element = element;
+			this.#handle = mountEchart(element);
+		}
+		this.#chart = chart;
+		this.#handle?.setChart(chart);
+		return A;
+	}
+	disconnected() {
+		this.#handle?.dispose();
+		this.#handle = void 0;
+	}
+	reconnected() {
+		if (!this.#element || !this.#chart) return;
+		this.#handle = mountEchart(this.#element);
+		this.#handle.setChart(this.#chart);
+	}
+};
+const echart = e(EchartDirective);
 /** 自定义元素 tag 前缀（同一文档里与 A2UI Basic Catalog 的 `a2ui-basic-*` 互不冲突） */
 const WEBSKILL_A2UI_TAG_PREFIX = "webskill-a2ui";
 /**
 * ui-kit 设计 token 是 `:root` 上的 CSS 自定义属性，CSS 变量天然继承进 shadow root，
 * 因此这些元素直接消费 `var(--border)` 等 token，亮暗切换随宿主 `.dark` 生效。
 */
-const sharedStyles = i$2`
+const sharedStyles = i$4`
   :host {
     display: block;
     color: var(--foreground);
@@ -1342,13 +1527,28 @@ const sharedStyles = i$2`
   .metric strong {
     font-size: 1.125rem;
   }
-  table {
+  /* 与 native 档的 .webskill-surface__chart 同尺寸：echarts 需要容器有显式高度才能测量 */
+  .chart {
     width: 100%;
+    height: 20rem;
+    min-height: 14rem;
+  }
+  /* 与 native 档的 DataTable 同构：外框拥有边框与横向溢出，单元格宽度下限一致 */
+  .table-frame {
+    max-height: 22.5rem;
+    overflow: auto;
+    border: 1px solid var(--border);
+    border-radius: var(--radius);
+  }
+  table {
+    width: max-content;
+    min-width: 100%;
     border-collapse: collapse;
     font-size: 0.8125rem;
   }
   th,
   td {
+    min-width: 8rem;
     border-bottom: 1px solid var(--border);
     padding: 0.375rem 0.5rem;
     text-align: left;
@@ -1404,18 +1604,6 @@ const list = (value) => Array.isArray(value) ? value : [];
 function children(props, host) {
 	return (props.children ?? []).map((ref) => host.renderChild(ref));
 }
-function chartSpec(props) {
-	const series = list(props["series"]);
-	return {
-		kind: str(props, "type", "bar"),
-		labels: list(props["labels"]),
-		series: series.map((item) => ({
-			name: item.name,
-			data: item.values
-		})),
-		...props["title"] ? { title: str(props, "title") } : {}
-	};
-}
 /**
 * 16 个组件的 Lit 渲染实现。语义（标题层级、table/th/td、label、button、role=alert）
 * 与 React 三档共用的 `catalogComponentImpls` 对齐——像素可不同，语义不可不同。
@@ -1447,20 +1635,22 @@ const renderers = {
     </div>
   `,
 	Table: (props) => T`
-    <table aria-label=${str(props, "title", "Data")}>
-      <thead>
-        <tr>
-          ${list(props["columns"]).map((column) => T`<th scope="col">${column}</th>`)}
-        </tr>
-      </thead>
-      <tbody>
-        ${list(props["rows"]).map((row) => T`<tr>
-              ${list(row).map((cell) => T`<td>${String(cell ?? "")}</td>`)}
-            </tr>`)}
-      </tbody>
-    </table>
+    <div class="table-frame" data-webskill-data-table="">
+      <table aria-label=${str(props, "title", "Data")}>
+        <thead>
+          <tr>
+            ${list(props["columns"]).map((column) => T`<th scope="col">${column}</th>`)}
+          </tr>
+        </thead>
+        <tbody>
+          ${list(props["rows"]).map((row) => T`<tr>
+                ${list(row).map((cell) => T`<td>${String(cell ?? "")}</td>`)}
+              </tr>`)}
+        </tbody>
+      </table>
+    </div>
   `,
-	Chart: (props) => renderMiniChart(chartSpec(props), document),
+	Chart: (props) => T`<div class="chart" ${echart(chartSpecFromProps(props))}></div>`,
 	FileLink: (props) => T`<p>${str(props, "label", str(props, "path"))}</p>`,
 	Form: (props, host) => T`
     <form @submit=${(event) => event.preventDefault()}>