@yoyaflow/yoya-ui 0.3.2 → 0.4.0

package/dist/yoya.echart.js

@@ -1,643 +1,233 @@
-//#region src/core/node.js
-var e = /* @__PURE__ */ new Set([
-	"checked",
-	"disabled",
-	"readonly",
-	"selected"
-]), t = /* @__PURE__ */ new Set([
-	"area",
-	"base",
-	"br",
-	"col",
-	"embed",
-	"hr",
-	"img",
-	"input",
-	"link",
-	"meta",
-	"param",
-	"source",
-	"track",
-	"wbr"
-]);
-function n(e) {
-	return typeof e == "string" ? document.querySelector(e) : e;
-}
-function r(e) {
-	return String(e).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
-}
-function i(t) {
-	return e.has(t);
-}
-function a(e, t, n) {
-	if (n == null || n === !1) {
-		if (e.removeAttribute(t), t in e) try {
-			e[t] = !1;
-		} catch {}
-		return;
-	}
-	if (n === !0 || i(t)) {
-		if (e.setAttribute(t, t), t in e) try {
-			e[t] = !0;
-		} catch {}
-		return;
-	}
-	if (e.setAttribute(t, String(n)), t in e) try {
-		e[t] = n;
-	} catch {}
-}
-function o(e) {
-	return Object.entries(e).filter(([, e]) => e != null && e !== "").map(([e, t]) => `${s(e)}:${r(t)}`).join("; ");
-}
-function s(e) {
-	return String(e).replace(/[A-Z]/g, (e) => `-${e.toLowerCase()}`);
-}
-var c = class e {
-	constructor(e = null) {
-		this._children = [], this._events = /* @__PURE__ */ new Map(), this._cleanup = [], this._states = {}, this._stateTypes = {}, this._stateHandlers = /* @__PURE__ */ new Map(), this._pendingRemovals = /* @__PURE__ */ new Set(), this._childrenDirty = !1, this._deleted = !1, e !== null && this.setup(e);
-	}
-	setup(t) {
-		return typeof t == "function" ? t(this) : t instanceof e ? this.child(t) : typeof t == "string" || typeof t == "number" ? this.text(t) : t && typeof t == "object" && this._setupObject(t), this;
-	}
-	_setupObject(e) {
-		e.children && this.child(e.children);
-	}
-	children() {
-		return [...this._children];
-	}
-	clearChildren() {
-		return this._children.forEach((e) => {
-			this._pendingRemovals.add(e);
-		}), this._children = [], this._childrenDirty = !0, this;
-	}
-	child(...e) {
-		return e.flat(Infinity).forEach((e) => {
-			if (e == null) return;
-			let t = d(e);
-			this._pendingRemovals.delete(t), this._children.push(t), this._childrenDirty = !0;
-		}), this;
-	}
-	text(e) {
-		return this.child(new l(e));
-	}
-	on(e, t, n) {
-		return this._events.has(e) || this._events.set(e, []), this._events.get(e).push({
-			handler: t,
-			options: n
-		}), this._el && (this._el.addEventListener(e, t, n), this._cleanup.push(() => this._el.removeEventListener(e, t, n))), this;
-	}
-	registerStateAttrs(...e) {
-		return e.forEach((e) => {
-			if (typeof e == "string") {
-				this._stateTypes[e] = "boolean";
-				return;
-			}
-			e && typeof e == "object" && Object.entries(e).forEach(([e, t]) => {
-				this._stateTypes[e] = t || "boolean";
-			});
-		}), this;
-	}
-	registerStateHandler(e, t) {
-		return this._stateHandlers.has(e) || this._stateHandlers.set(e, []), this._stateHandlers.get(e).push(t), this;
-	}
-	setState(e, t = !0) {
-		let n = this._states[e];
-		return this._states[e] = t, (this._stateHandlers.get(e) || []).forEach((e) => e(t, this, n)), this;
-	}
-	getState(e) {
-		return this._states[e];
-	}
-	getBooleanState(e) {
-		return !!this.getState(e);
-	}
-	getStringState(e) {
-		let t = this.getState(e);
-		return t == null ? "" : String(t);
-	}
-	getNumberState(e) {
-		return Number(this.getState(e) || 0);
-	}
-	renderDom() {
-		return null;
-	}
-	commit() {
-		return this.renderDom();
-	}
-	_commitChildren() {
-		this._pendingRemovals.forEach((e) => e.destroy()), this._pendingRemovals.clear(), this._childrenDirty = !1;
-	}
-	bindTo(e) {
-		let t = n(e), r = this.renderDom();
-		return t && r && t.appendChild(r), this;
-	}
-	destroy() {
-		return this._deleted = !0, this._cleanup.forEach((e) => e()), this._cleanup = [], this._children.forEach((e) => e.destroy()), this._pendingRemovals.forEach((e) => e.destroy()), this._pendingRemovals.clear(), this._children = [], this._el?.parentNode && this._el.parentNode.removeChild(this._el), this;
-	}
-	toHTML() {
-		return "";
-	}
-	hydrateSnapshot() {
-		return this;
-	}
-}, l = class extends c {
-	constructor(e = "") {
-		super(null), this._content = String(e), this._textNode = null;
-	}
-	textContent(e) {
-		return e === void 0 ? this._content : (this._content = String(e), this._textNode && (this._textNode.textContent = this._content), this);
-	}
-	renderDom() {
-		return this._deleted ? null : (this._textNode || (this._textNode = document.createTextNode(this._content), this._el = this._textNode), this._textNode);
-	}
-	toHTML() {
-		return this._deleted ? "" : r(this._content);
-	}
-}, u = class extends c {
-	constructor(e) {
-		super(null), this._component = e, this._resolved = null;
-	}
-	_resolve() {
-		if (this._resolved) return this._resolved;
-		let e = typeof this._component == "function" ? this._component() : this._component.render();
-		if (!(e instanceof c)) throw TypeError("Component render must return a ViewNode");
-		return this._resolved = e, e;
-	}
-	children() {
-		return this._resolved ? this._resolved.children() : [];
-	}
-	textContent() {
-		let e = this._resolve();
-		return typeof e.textContent == "function" ? e.textContent() : "";
-	}
-	renderDom() {
-		if (this._deleted) return null;
-		let e = this._resolve().renderDom();
-		return this._el = e, e;
-	}
-	toHTML() {
-		return this._deleted ? "" : this._resolve().toHTML();
-	}
-	destroy() {
-		return this._resolved && this._resolved.destroy(), super.destroy();
-	}
-};
-function d(e) {
-	if (e instanceof c) return e;
-	if (typeof e == "function" || e && typeof e == "object" && typeof e.render == "function") return new u(e);
-	if (typeof e == "string" || typeof e == "number") return new l(e);
-	throw TypeError("ViewNode child must be a ViewNode, component, string, or number");
-}
-function f(e = null, t = null, n = null) {
-	return typeof t == "function" && n == null ? {
-		first: e,
-		options: null,
-		callback: t
-	} : {
-		first: e,
-		options: t,
-		callback: n
-	};
-}
-function p(e, t) {
-	return !t || typeof t != "object" || Array.isArray(t) ? e : (t.attrs && typeof e.attr == "function" && e.attr(t.attrs), t.style && typeof e.styles == "function" && e.styles(t.style), e);
-}
-var m = class extends c {
-	constructor(e, t = null) {
-		super(null), this._tagName = e, this._attrs = {}, this._styles = {}, this._classes = /* @__PURE__ */ new Set(), this._el = null, t !== null && this.setup(t);
-	}
-	_setupObject(e) {
-		Object.entries(e).forEach(([e, t]) => {
-			if (e === "class" || e === "className") {
-				this.className(t);
-				return;
-			}
-			if (e === "attrs") {
-				this.attr(t);
-				return;
-			}
-			if (e === "style") {
-				this.styles(t);
-				return;
-			}
-			if (e === "children") {
-				this.child(t);
-				return;
-			}
-			if (e.startsWith("on") && typeof t == "function") {
-				this.on(e.slice(2).toLowerCase(), t);
-				return;
-			}
-			if (typeof this[e] == "function") {
-				this[e](t);
-				return;
-			}
-			typeof t != "function" && this.attr(e, t);
-		});
-	}
-	tagName() {
-		return this._tagName;
-	}
-	textContent() {
-		return this._children.map((e) => typeof e.textContent == "function" ? e.textContent() : "").join("");
-	}
-	attr(e, t) {
-		return t === void 0 && typeof e == "string" ? this._attrs[e] : e && typeof e == "object" ? (Object.entries(e).forEach(([e, t]) => this.attr(e, t)), this) : (t == null || t === !1 ? delete this._attrs[e] : this._attrs[e] = t, this._el && a(this._el, e, t), this);
-	}
-	id(e) {
-		return e === void 0 ? this.attr("id") : this.attr("id", e);
-	}
-	name(e) {
-		return e === void 0 ? this.attr("name") : this.attr("name", e);
-	}
-	className(...e) {
-		return e.length === 0 ? [...this._classes].join(" ") : (e.flat(Infinity).forEach((e) => {
-			e && String(e).split(/\s+/).filter(Boolean).forEach((e) => this._classes.add(e));
-		}), this._syncClassName(), this);
-	}
-	class(...e) {
-		return this.className(...e);
-	}
-	replaceClassName(e, t, n = !1) {
-		return !e || !t || e === t ? this : this._classes.has(e) ? (this._classes.delete(e), this.className(t)) : n ? this.className(t) : this;
-	}
-	style(e, t) {
-		return t === void 0 && typeof e == "string" ? this._styles[e] : e && typeof e == "object" ? this.styles(e) : (t == null || t === "" ? delete this._styles[e] : this._styles[e] = t, this._el && (this._el.style[e] = t || ""), this);
-	}
-	styles(e) {
-		return Object.entries(e || {}).forEach(([e, t]) => this.style(e, t)), this;
-	}
-	child(...e) {
-		return e.flat(Infinity).forEach((e) => {
-			if (e == null) return;
-			let t = d(e);
-			if (this._pendingRemovals.delete(t), this._children.push(t), this._childrenDirty = !0, this._el) {
-				let e = t.renderDom();
-				e && e.parentNode !== this._el && this._el.appendChild(e);
-			}
-		}), this;
-	}
-	renderDom() {
-		return this._deleted ? null : (this._el || (this._el = document.createElement(this._tagName), this._applySnapshotToElement()), this._commitChildren(), this._children.forEach((e) => {
-			let t = e.renderDom();
-			t && t.parentNode !== this._el && this._el.appendChild(t);
-		}), this._el);
-	}
-	toHTML() {
-		if (this._deleted) return "";
-		let e = this._serializeAttributes(), n = e ? `<${this._tagName} ${e}>` : `<${this._tagName}>`;
-		return t.has(this._tagName) ? n : `${n}${this._children.map((e) => e.toHTML()).join("")}</${this._tagName}>`;
-	}
-	_applyBindingsToElement() {
-		Object.entries(this._attrs).forEach(([e, t]) => a(this._el, e, t)), this._syncClassName(), Object.entries(this._styles).forEach(([e, t]) => {
-			this._el.style[e] = t;
-		}), this._events.forEach((e, t) => {
-			e.forEach(({ handler: e, options: n }) => {
-				this._el.addEventListener(t, e, n), this._cleanup.push(() => this._el.removeEventListener(t, e, n));
-			});
-		});
-	}
-	_applySnapshotToElement() {
-		this._applyBindingsToElement(), this._children.forEach((e) => {
-			let t = e.renderDom();
-			t && this._el.appendChild(t);
-		});
-	}
-	_syncClassName() {
-		let e = [...this._classes].join(" ");
-		e ? this._attrs.class = e : delete this._attrs.class, this._el && (e ? this._el.className = e : this._el.removeAttribute("class"));
-	}
-	_serializeAttributes() {
-		let e = { ...this._attrs }, t = this._serializeStyles();
-		return t && (e.style = e.style ? `${e.style}; ${t}` : t), Object.entries(e).filter(([, e]) => e != null && e !== !1).map(([e, t]) => t === !0 || i(e) ? `${e}="${e}"` : `${e}="${r(t)}"`).join(" ");
-	}
-	_serializeStyles() {
-		return o(this._styles);
-	}
-};
-function h(e, t = m) {
-	return function(n = null, r = null, i = null) {
-		let a = f(n, r, i), o = new t(e, a.first);
-		return p(o, a.options), typeof a.callback == "function" && a.callback(o), o;
-	};
-}
-function g(e, t, n = {}) {
-	let { override: r = !1 } = n;
-	Object.entries(t).forEach(([t, n]) => {
-		!r && e.prototype[t] || (e.prototype[t] = function(...e) {
-			return this.child(n(...e));
-		});
-	});
-}
-//#endregion
-//#region src/html/index.js
-var _ = class extends m {}, v = [
-	"a",
-	"abbr",
-	"address",
-	"area",
-	"article",
-	"aside",
-	"audio",
-	"b",
-	"base",
-	"bdi",
-	"bdo",
-	"blockquote",
-	"body",
-	"br",
-	"button",
-	"canvas",
-	"caption",
-	"cite",
-	"code",
-	"col",
-	"colgroup",
-	"data",
-	"datalist",
-	"dd",
-	"del",
-	"details",
-	"dfn",
-	"dialog",
-	"div",
-	"dl",
-	"dt",
-	"em",
-	"embed",
-	"fieldset",
-	"figcaption",
-	"figure",
-	"footer",
-	"form",
-	"h1",
-	"h2",
-	"h3",
-	"h4",
-	"h5",
-	"h6",
-	"head",
-	"header",
-	"hgroup",
-	"hr",
-	"html",
-	"i",
-	"iframe",
-	"img",
-	"input",
-	"ins",
-	"kbd",
-	"label",
-	"legend",
-	"li",
-	"link",
-	"main",
-	"map",
-	"mark",
-	"menu",
-	"meta",
-	"meter",
-	"nav",
-	"noscript",
-	"object",
-	"ol",
-	"optgroup",
-	"option",
-	"output",
-	"p",
-	"picture",
-	"pre",
-	"progress",
-	"q",
-	"rp",
-	"rt",
-	"ruby",
-	"s",
-	"samp",
-	"script",
-	"search",
-	"section",
-	"select",
-	"selectedcontent",
-	"slot",
-	"small",
-	"source",
-	"span",
-	"strong",
-	{
-		name: "style",
-		tagName: "style",
-		aliases: ["styleTag"]
-	},
-	"sub",
-	"summary",
-	"sup",
-	"table",
-	"tbody",
-	"td",
-	"template",
-	"textarea",
-	"tfoot",
-	"th",
-	"thead",
-	"time",
-	"title",
-	"tr",
-	"track",
-	"u",
-	"ul",
-	{
-		name: "varTag",
-		tagName: "var"
-	},
-	"video",
-	"wbr"
-];
-function y() {
-	return v.reduce((e, t) => {
-		let { aliases: n = [], name: r, tagName: i } = W(t), a = h(i, _);
-		return e[r] = a, n.forEach((t) => {
-			e[t] = a;
-		}), e;
-	}, {});
-}
-var b = y();
-g(_, b);
-var { a: ee, abbr: te, address: ne, area: re, article: ie, aside: ae, audio: oe, b: se, base: ce, bdi: le, bdo: ue, blockquote: de, body: x, br: S, button: C, canvas: w, caption: T, cite: E, code: D, col: O, colgroup: k, data: A, datalist: j, dd: M, del: N, details: P, dfn: F, dialog: I, div: L, dl: R, dt: z, em: B, embed: V, fieldset: H, figcaption: fe, figure: pe, footer: me, form: he, h1: ge, h2: _e, h3: ve, h4: ye, h5: be, h6: xe, head: Se, header: Ce, hgroup: we, hr: Te, html: Ee, i: De, iframe: Oe, img: ke, input: Ae, ins: je, kbd: Me, label: Ne, legend: Pe, li: Fe, link: Ie, main: Le, map: Re, mark: ze, menu: Be, meta: Ve, meter: He, nav: Ue, noscript: We, object: Ge, ol: Ke, optgroup: qe, option: Je, output: Ye, p: Xe, picture: Ze, pre: Qe, progress: $e, q: et, rp: tt, rt: nt, ruby: rt, s: it, samp: at, script: ot, search: st, section: ct, select: lt, selectedcontent: ut, slot: dt, small: ft, source: pt, span: mt, strong: ht, style: gt, styleTag: _t, sub: vt, summary: yt, sup: bt, table: xt, tbody: St, td: Ct, template: wt, textarea: Tt, tfoot: Et, th: Dt, thead: Ot, time: kt, title: At, tr: jt, track: Mt, u: Nt, ul: Pt, varTag: Ft, video: It, wbr: U } = b;
-function W(e) {
-	return typeof e == "string" ? {
-		name: e,
-		tagName: e
-	} : e;
-}
-//#endregion
-//#region src/core/document-events.js
-function G(e, t, n = void 0) {
-	return typeof window > "u" ? () => {} : (window.addEventListener(e, t, n), () => {
-		window.removeEventListener(e, t, n);
-	});
-}
-//#endregion
-//#region src/components/shared.js
-var K = "yoya-component";
-function q(e = null, t = null, n = null) {
-	return f(e, t, n);
-}
-function J(e, t) {
-	return typeof e.attr == "function" || typeof e.styles == "function" ? p(e, t) : (typeof e.render == "function" && p(e.render(), t), e);
-}
-function Y(e, t = null, n = null) {
-	return J(e, t), typeof n == "function" && n(e), e;
-}
-function X(e, t = null, n = null, r = null) {
-	let { first: i, options: a, callback: o } = q(t, n, r);
-	return Y(i instanceof e ? i : new e(i), a, o);
-}
-function Z(e) {
-	if (Object.prototype.toString.call(e) !== "[object Object]") return !1;
-	let t = Object.getPrototypeOf(e);
-	return t === Object.prototype || t === null;
-}
-//#endregion
+import { Mi as registerChildFactories, Tt as HtmlElementNode, g as createComponentFactory, h as componentClass, v as isPlainObject, vi as bindWindowEvent } from "./yoya.core.chunk.js";
+
 //#region src/chart/echart.js
-var Q = class extends _ {
-	constructor(e = null) {
-		super("div", null), this._autoResize = !0, this._chartInstance = null, this._devicePixelRatio = null, this._echartsLib = null, this._height = "400px", this._loading = !1, this._loadingText = "加载中...", this._onReadyCallbacks = [], this._onResizeCallbacks = [], this._option = null, this._renderer = "canvas", this._resizeObserver = null, this._theme = null, this._width = "100%", this.className(K, "yoya-vechart"), this.styles({
+var VEchart = class extends HtmlElementNode {
+	constructor(setup = null) {
+		super("div", null);
+		this._autoResize = true;
+		this._chartInstance = null;
+		this._devicePixelRatio = null;
+		this._echartsLib = null;
+		this._height = "400px";
+		this._loading = false;
+		this._loadingText = "加载中...";
+		this._onReadyCallbacks = [];
+		this._onResizeCallbacks = [];
+		this._option = null;
+		this._renderer = "canvas";
+		this._resizeObserver = null;
+		this._theme = null;
+		this._width = "100%";
+		this.className(componentClass, "yoya-vechart");
+		this.styles({
 			height: this._height,
 			overflow: "hidden",
 			position: "relative",
 			width: this._width
-		}), this._setupEchart(e);
+		});
+		this._setupEchart(setup);
 	}
-	echartsLib(e) {
-		return e ? this._echartsLib = e : typeof window < "u" && window.echarts && (this._echartsLib = window.echarts), this;
+	echartsLib(lib) {
+		if (lib) this._echartsLib = lib;
+		else if (typeof window !== "undefined" && window.echarts) this._echartsLib = window.echarts;
+		return this;
 	}
-	option(e) {
-		return e === void 0 ? this._option : (this._option = e || null, this._chartInstance && this._echartsLib && this._chartInstance.setOption(this._option, !0), this);
+	option(value) {
+		if (value === void 0) return this._option;
+		this._option = value || null;
+		if (this._chartInstance && this._echartsLib) this._chartInstance.setOption(this._option, true);
+		return this;
 	}
-	width(e) {
-		return e === void 0 ? this._width : (this._width = e, this.style("width", e), this);
+	width(value) {
+		if (value === void 0) return this._width;
+		this._width = value;
+		this.style("width", value);
+		return this;
 	}
-	height(e) {
-		return e === void 0 ? this._height : (this._height = e, this.style("height", e), this);
+	height(value) {
+		if (value === void 0) return this._height;
+		this._height = value;
+		this.style("height", value);
+		return this;
 	}
-	theme(e) {
-		return e === void 0 ? this._theme : (this._theme = e, this);
+	theme(value) {
+		if (value === void 0) return this._theme;
+		this._theme = value;
+		return this;
 	}
-	renderer(e) {
-		return e === void 0 ? this._renderer : (this._renderer = e === "svg" ? "svg" : "canvas", this);
+	renderer(value) {
+		if (value === void 0) return this._renderer;
+		this._renderer = value === "svg" ? "svg" : "canvas";
+		return this;
 	}
-	devicePixelRatio(e) {
-		return e === void 0 ? this._devicePixelRatio : (this._devicePixelRatio = e, this);
+	devicePixelRatio(value) {
+		if (value === void 0) return this._devicePixelRatio;
+		this._devicePixelRatio = value;
+		return this;
 	}
-	autoResize(e) {
-		return e === void 0 ? this._autoResize : (this._autoResize = !!e, this);
+	autoResize(value) {
+		if (value === void 0) return this._autoResize;
+		this._autoResize = Boolean(value);
+		return this;
 	}
-	loading(e, t = "加载中...") {
-		return this._loading = !!e, this._loadingText = t, this._chartInstance && (this._loading ? this._chartInstance.showLoading({
-			color: "var(--yoya-color-primary, #2563eb)",
-			lineWidth: 2,
-			maskColor: "rgba(255, 255, 255, 0.8)",
-			text: t,
-			textColor: "var(--yoya-color-text, #172033)"
-		}) : this._chartInstance.hideLoading()), this;
+	loading(value, text = "加载中...") {
+		this._loading = Boolean(value);
+		this._loadingText = text;
+		if (this._chartInstance) {
+			if (this._loading) this._chartInstance.showLoading({
+				color: "var(--yoya-color-primary, #2563eb)",
+				lineWidth: 2,
+				maskColor: "rgba(255, 255, 255, 0.8)",
+				text,
+				textColor: "var(--yoya-color-text, #172033)"
+			});
+			else this._chartInstance.hideLoading();
+		}
+		return this;
 	}
-	onChartReady(e) {
-		return typeof e == "function" && (this._chartInstance ? e(this._chartInstance) : this._onReadyCallbacks.push(e)), this;
+	onChartReady(callback) {
+		if (typeof callback === "function") {
+			if (this._chartInstance) callback(this._chartInstance);
+			else this._onReadyCallbacks.push(callback);
+		}
+		return this;
 	}
-	onChartResize(e) {
-		return typeof e == "function" && this._onResizeCallbacks.push(e), this;
+	onChartResize(callback) {
+		if (typeof callback === "function") this._onResizeCallbacks.push(callback);
+		return this;
 	}
 	getChartInstance() {
 		return this._chartInstance;
 	}
-	resize(e = {}) {
-		return this._chartInstance && this._chartInstance.resize(e), this;
+	resize(opts = {}) {
+		if (this._chartInstance) this._chartInstance.resize(opts);
+		return this;
 	}
 	clear() {
-		return this._chartInstance && this._chartInstance.clear(), this;
+		if (this._chartInstance) this._chartInstance.clear();
+		return this;
 	}
 	dispose() {
-		return this._disposeChart(), this;
+		this._disposeChart();
+		return this;
 	}
 	destroy() {
-		return this._disposeChart(), super.destroy();
+		this._disposeChart();
+		return super.destroy();
 	}
 	renderDom() {
-		let e = super.renderDom();
-		return e && !this._chartInstance && requestAnimationFrame(() => this._initChart()), e;
-	}
-	_setupEchart(e) {
-		if (e != null) {
-			if (typeof e == "function") {
-				e(this);
-				return;
-			}
-			if (Z(e)) {
-				let { autoResize: t, devicePixelRatio: n, echartsLib: r, height: i, loading: a, loadingText: o, onChartReady: s, onChartResize: c, option: l, renderer: u, theme: d, width: f, ...p } = e;
-				Object.keys(p).length > 0 && this.setup(p), r !== void 0 && this.echartsLib(r), f !== void 0 && this.width(f), i !== void 0 && this.height(i), d !== void 0 && this.theme(d), u !== void 0 && this.renderer(u), n !== void 0 && this.devicePixelRatio(n), t !== void 0 && this.autoResize(t), o !== void 0 && (this._loadingText = o), s !== void 0 && this.onChartReady(s), c !== void 0 && this.onChartResize(c), l !== void 0 && this.option(l), a !== void 0 && this.loading(a, this._loadingText);
-				return;
-			}
-			this.child(e);
+		const element = super.renderDom();
+		if (element && !this._chartInstance) requestAnimationFrame(() => this._initChart());
+		return element;
+	}
+	_setupEchart(setup) {
+		if (setup === null || setup === void 0) return;
+		if (typeof setup === "function") {
+			setup(this);
+			return;
 		}
+		if (isPlainObject(setup)) {
+			const { autoResize, devicePixelRatio, echartsLib, height, loading, loadingText, onChartReady, onChartResize, option, renderer, theme, width, ...elementConfig } = setup;
+			if (Object.keys(elementConfig).length > 0) this.setup(elementConfig);
+			if (echartsLib !== void 0) this.echartsLib(echartsLib);
+			if (width !== void 0) this.width(width);
+			if (height !== void 0) this.height(height);
+			if (theme !== void 0) this.theme(theme);
+			if (renderer !== void 0) this.renderer(renderer);
+			if (devicePixelRatio !== void 0) this.devicePixelRatio(devicePixelRatio);
+			if (autoResize !== void 0) this.autoResize(autoResize);
+			if (loadingText !== void 0) this._loadingText = loadingText;
+			if (onChartReady !== void 0) this.onChartReady(onChartReady);
+			if (onChartResize !== void 0) this.onChartResize(onChartResize);
+			if (option !== void 0) this.option(option);
+			if (loading !== void 0) this.loading(loading, this._loadingText);
+			return;
+		}
+		this.child(setup);
 	}
 	_initChart() {
-		if (!this._deleted) {
-			if (this._echartsLib || this.echartsLib(), !this._echartsLib) {
-				console.warn("[VEchart] ECharts library not provided. Call echartsLib() first.");
-				return;
-			}
-			if (!(this._chartInstance || !this._el)) try {
-				this._chartInstance = this._echartsLib.init(this._el, this._theme, {
-					devicePixelRatio: this._devicePixelRatio,
-					renderer: this._renderer
-				}), this._option && this._chartInstance.setOption(this._option, !0), this._loading && this.loading(!0, this._loadingText), setTimeout(() => {
-					this._chartInstance && !this._chartInstance.isDisposed() && this._chartInstance.resize();
-				}, 100), this._executeReadyCallbacks(), this._autoResize && this._initResizeObserver();
-			} catch (e) {
-				console.error("[VEchart] Failed to initialize chart:", e);
-			}
+		if (this._deleted) return;
+		if (!this._echartsLib) this.echartsLib();
+		if (!this._echartsLib) {
+			console.warn("[VEchart] ECharts library not provided. Call echartsLib() first.");
+			return;
+		}
+		if (this._chartInstance || !this._el) return;
+		try {
+			this._chartInstance = this._echartsLib.init(this._el, this._theme, {
+				devicePixelRatio: this._devicePixelRatio,
+				renderer: this._renderer
+			});
+			if (this._option) this._chartInstance.setOption(this._option, true);
+			if (this._loading) this.loading(true, this._loadingText);
+			setTimeout(() => {
+				if (this._chartInstance && !this._chartInstance.isDisposed()) this._chartInstance.resize();
+			}, 100);
+			this._executeReadyCallbacks();
+			if (this._autoResize) this._initResizeObserver();
+		} catch (error) {
+			console.error("[VEchart] Failed to initialize chart:", error);
 		}
 	}
 	_executeReadyCallbacks() {
-		this._chartInstance && (this._onReadyCallbacks.forEach((e) => {
+		if (!this._chartInstance) return;
+		this._onReadyCallbacks.forEach((callback) => {
 			try {
-				e(this._chartInstance);
-			} catch (e) {
-				console.error("[VEchart] Error in onChartReady callback:", e);
+				callback(this._chartInstance);
+			} catch (error) {
+				console.error("[VEchart] Error in onChartReady callback:", error);
 			}
-		}), this._onReadyCallbacks = []);
+		});
+		this._onReadyCallbacks = [];
 	}
 	_initResizeObserver() {
-		if (typeof ResizeObserver < "u") {
-			this._resizeObserver = new ResizeObserver((e) => {
-				for (let t of e) {
-					let { height: e, width: n } = t.contentRect;
-					this._handleResize(n, e);
+		if (typeof ResizeObserver !== "undefined") {
+			this._resizeObserver = new ResizeObserver((entries) => {
+				for (const entry of entries) {
+					const { height, width } = entry.contentRect;
+					this._handleResize(width, height);
 				}
-			}), this._el && this._resizeObserver.observe(this._el);
+			});
+			if (this._el) this._resizeObserver.observe(this._el);
 			return;
 		}
-		this._resizeHandler = () => this._handleResize(), this._resizeUnbind = G("resize", this._resizeHandler);
+		this._resizeHandler = () => this._handleResize();
+		this._resizeUnbind = bindWindowEvent("resize", this._resizeHandler);
 	}
-	_handleResize(e, t) {
-		this._chartInstance && (this._chartInstance.resize(), this._onResizeCallbacks.forEach((n) => {
+	_handleResize(width, height) {
+		if (!this._chartInstance) return;
+		this._chartInstance.resize();
+		this._onResizeCallbacks.forEach((callback) => {
 			try {
-				n({
-					height: t,
-					width: e
+				callback({
+					height,
+					width
 				});
-			} catch (e) {
-				console.error("[VEchart] Error in onChartResize callback:", e);
+			} catch (error) {
+				console.error("[VEchart] Error in onChartResize callback:", error);
 			}
-		}));
+		});
 	}
 	_disposeChart() {
-		this._resizeObserver &&= (this._resizeObserver.disconnect(), null), this._resizeHandler && (this._resizeUnbind?.(), this._resizeHandler = null, this._resizeUnbind = null), this._chartInstance &&= (this._chartInstance.dispose(), null);
+		if (this._resizeObserver) {
+			this._resizeObserver.disconnect();
+			this._resizeObserver = null;
+		}
+		if (this._resizeHandler) {
+			this._resizeUnbind?.();
+			this._resizeHandler = null;
+			this._resizeUnbind = null;
+		}
+		if (this._chartInstance) {
+			this._chartInstance.dispose();
+			this._chartInstance = null;
+		}
 	}
 };
-function $(e = null, t = null, n = null) {
-	return X(Q, e, t, n);
+function vEchart(first = null, second = null, third = null) {
+	return createComponentFactory(VEchart, first, second, third);
 }
-g(_, { vEchart: $ });
+registerChildFactories(HtmlElementNode, { vEchart });
+
 //#endregion
-export { Q as VEchart, $ as vEchart };
+export { VEchart, vEchart };