x-runtime-lib 0.8.190 → 0.8.192

package/dist/index.js

@@ -230,9 +230,109 @@ function toEventName(e, C) {
 	}
 	return joinNames(w, C, T);
 }
-const elements = {}, regElement = (e) => {
+function isExecutableMode(e) {
+	return e === "runtime" || e === "preview";
+}
+function isCircularReference(e, C) {
+	if (e.compId === C) return !0;
+	let w = e;
+	for (; w;) {
+		if (w.parent && w.compId === w.parent.compId) return !0;
+		w = w.parent;
+	}
+	return !1;
+}
+function initNode() {
+	return { basic: {
+		id: "",
+		key: ""
+	} };
+}
+function toNodeLite(e, C) {
+	return {
+		id: e.basic.id,
+		key: e.basic.key,
+		slotId: e.settings?.slot,
+		compId: e.settings?.comp,
+		children: C
+	};
+}
+function dataStringify({ type: e, version: C, view: w, code: T }) {
+	let E = (e, C) => {
+		let w = { id: C.id };
+		C.children && (w.children = [], C.children.forEach((e) => {
+			E(w.children, e);
+		})), e.push(w);
+	}, D = [];
+	w.nodeLites.forEach((e) => {
+		E(D, e);
+	});
+	let O = {
+		type: e,
+		version: C,
+		view: {
+			nodeLites: D,
+			nodes: w.nodes
+		},
+		code: T
+	};
+	return JSON.stringify(O);
+}
+function parseData(e) {
+	let C = JSON.parse(e), w = (e, T) => {
+		e.key = T.basic.key, e.alias = T.basic.alias, e.slotId = T.settings?.slot, e.compId = T.settings?.comp, e.children?.forEach((e) => {
+			w(e, C.view.nodes[e.id]);
+		});
+	};
+	return C.view.nodeLites.forEach((e) => {
+		w(e, C.view.nodes[e.id]);
+	}), C;
+}
+function metaStringify(e) {
+	return JSON.stringify(e);
+}
+function parseMeta(e) {
+	return JSON.parse(e);
+}
+const pageTypes = [
+	"ui",
+	"2d",
+	"3d"
+], compTypes = [
+	"ui",
+	"2d",
+	"3d"
+];
+function getTag(e, C) {
+	if (e === "page") {
+		if (!pageTypes.includes(C)) throw Error("invalid page type");
+	} else if (e === "comp") {
+		if (!compTypes.includes(C)) throw Error("invalid comp type");
+	} else throw Error("invalid type");
+	return `${e}${capitalize_default(C)}`;
+}
+const elementKeys = /* @__PURE__ */ "globality_v1.multiple_ref_v1.multiple_slot_v1.ref_v1.render_switch_v1.slot_v1.ui_badge_v1.ui_breadcrumbs_v1.ui_bar_chart_v1.ui_btn_v1.ui_btn_group_v1.ui_btn_toggle_v1.ui_card_v1.ui_checkbox_v1.ui_chip_v1.ui_chip_group_v1.ui_color_picker_v1.ui_combobox_v1.ui_container_v1.ui_data_table_v1.ui_date_picker_v1.ui_dialog_v1.ui_file_input_v1.ui_flex_layout_v1.ui_flex_layout_entry_v1.ui_form_v1.ui_icon_v1.ui_line_chart_v1.ui_menu_v1.ui_number_input_v1.ui_pagination_v1.ui_radio_v1.ui_radio_group_v1.ui_range_slider_v1.ui_rating_v1.ui_select_v1.ui_slider_v1.ui_stepper_v1.ui_stepper_header_v1.ui_stepper_item_v1.ui_stepper_window_v1.ui_stepper_window_item_v1.ui_switch_v1.ui_tab_v1.ui_table_v1.ui_tabs_v1.ui_text_v1.ui_textarea_v1.ui_text_field_v1.ui_timeline_v1.ui_timeline_item_v1.ui_window_v1.ui_window_item_v1.3d_ambient_light_v1.3d_box_geometry_v1.3d_directional_light_v1.3d_group_v1.3d_keyboard_controls_v1.3d_map_controls_v1.3d_mesh_v1.3d_mesh_basic_material_v1.3d_orbit_controls_v1.3d_orthographic_camera_v1.3d_perspective_camera_v1.3d_point_light_v1.3d_sphere_geometry_v1.3d_spot_light_v1".split(".");
+var elements = {};
+const regElement = (e) => {
 	elements[e.key] = e;
-}, alignTabsItemsV1 = [
+};
+function getAllElements() {
+	return elements;
+}
+function getElement(e) {
+	return elements[e];
+}
+function getElementMust(e) {
+	let C = elements[e];
+	if (!C) throw Error(`element not found key=${e}`);
+	return C;
+}
+function getProperties(e, C, w) {
+	let T = e.properties[getTag(C, w)];
+	if (!T) throw Error(`properties not found key=${e.key} type=${C} subtype=${w}`);
+	return T;
+}
+const alignTabsItemsV1 = [
 	{
 		title: "x-runtime-lib.title",
 		value: "title"
@@ -1403,91 +1503,9 @@ function useElementSlotProperty(e, C, w, T) {
 		E.hooks.onElementSlotPropertyChange(e.value.basic.id, e.value.basic.key, C, w, T, D);
 	}));
 }
-function isExecutableMode(e) {
-	return e === "runtime" || e === "preview";
-}
-function isCircularReference(e, C) {
-	if (e.compId === C) return !0;
-	let w = e;
-	for (; w;) {
-		if (w.parent && w.compId === w.parent.compId) return !0;
-		w = w.parent;
-	}
-	return !1;
-}
-function initNode() {
-	return { basic: {
-		id: "",
-		key: ""
-	} };
-}
-function toNodeLite(e, C) {
-	return {
-		id: e.basic.id,
-		key: e.basic.key,
-		slotId: e.settings?.slot,
-		compId: e.settings?.comp,
-		children: C
-	};
-}
-function dataStringify({ type: e, version: C, view: w, code: T }) {
-	let E = (e, C) => {
-		let w = { id: C.id };
-		C.children && (w.children = [], C.children.forEach((e) => {
-			E(w.children, e);
-		})), e.push(w);
-	}, D = [];
-	w.nodeLites.forEach((e) => {
-		E(D, e);
-	});
-	let O = {
-		type: e,
-		version: C,
-		view: {
-			nodeLites: D,
-			nodes: w.nodes
-		},
-		code: T
-	};
-	return JSON.stringify(O);
-}
-function parseData(e) {
-	let C = JSON.parse(e), w = (e, T) => {
-		e.key = T.basic.key, e.alias = T.basic.alias, e.slotId = T.settings?.slot, e.compId = T.settings?.comp, e.children?.forEach((e) => {
-			w(e, C.view.nodes[e.id]);
-		});
-	};
-	return C.view.nodeLites.forEach((e) => {
-		w(e, C.view.nodes[e.id]);
-	}), C;
-}
-function metaStringify(e) {
-	return JSON.stringify(e);
-}
-function parseMeta(e) {
-	return JSON.parse(e);
-}
-const pageTypes = [
-	"ui",
-	"2d",
-	"3d"
-], compTypes = [
-	"ui",
-	"2d",
-	"3d"
-];
-function getTag(e, C) {
-	if (e === "page") {
-		if (!pageTypes.includes(C)) throw Error("invalid page type");
-	} else if (e === "comp") {
-		if (!compTypes.includes(C)) throw Error("invalid comp type");
-	} else throw Error("invalid type");
-	return `${e}${capitalize_default(C)}`;
-}
-const elementKeys = /* @__PURE__ */ "globality_v1.multiple_ref_v1.multiple_slot_v1.ref_v1.render_switch_v1.slot_v1.ui_badge_v1.ui_breadcrumbs_v1.ui_bar_chart_v1.ui_btn_v1.ui_btn_group_v1.ui_btn_toggle_v1.ui_card_v1.ui_checkbox_v1.ui_chip_v1.ui_chip_group_v1.ui_color_picker_v1.ui_combobox_v1.ui_container_v1.ui_data_table_v1.ui_date_picker_v1.ui_dialog_v1.ui_file_input_v1.ui_flex_layout_v1.ui_flex_layout_entry_v1.ui_form_v1.ui_icon_v1.ui_line_chart_v1.ui_menu_v1.ui_number_input_v1.ui_pagination_v1.ui_radio_v1.ui_radio_group_v1.ui_range_slider_v1.ui_rating_v1.ui_select_v1.ui_slider_v1.ui_stepper_v1.ui_stepper_header_v1.ui_stepper_item_v1.ui_stepper_window_v1.ui_stepper_window_item_v1.ui_switch_v1.ui_tab_v1.ui_table_v1.ui_tabs_v1.ui_text_v1.ui_textarea_v1.ui_text_field_v1.ui_timeline_v1.ui_timeline_item_v1.ui_window_v1.ui_window_item_v1.3d_ambient_light_v1.3d_box_geometry_v1.3d_directional_light_v1.3d_group_v1.3d_keyboard_controls_v1.3d_map_controls_v1.3d_mesh_v1.3d_mesh_basic_material_v1.3d_orbit_controls_v1.3d_orthographic_camera_v1.3d_perspective_camera_v1.3d_point_light_v1.3d_sphere_geometry_v1.3d_spot_light_v1".split(".");
 function useElementSlotRender(e, C, w) {
 	function T(C) {
-		let w = elements[C.key];
+		let w = getElement(C.key);
 		if (!w) {
 			console.assert(!1, `element not found key=${C.key}`);
 			return;
@@ -2763,7 +2781,7 @@ var echarts_default = core_exports, v1_default$49 = /* @__PURE__ */ defineCompon
 		let C = injectMeta(), w = injectData(), T = computed(() => cloneDeep_default(C.value)), D = computed(() => cloneDeep_default(w.value));
 		provideData(D), useSandbox("multipleRef", e.nodeId, e.instance, injectSandbox(), T, D);
 		let O = (C) => {
-			let w = elements[C.key];
+			let w = getElement(C.key);
 			if (!w) {
 				console.assert(!1, `element not found key=${C.key}`);
 				return;
@@ -2900,7 +2918,7 @@ var echarts_default = core_exports, v1_default$49 = /* @__PURE__ */ defineCompon
 		let C = injectMeta(), w = injectData(), T = computed(() => cloneDeep_default(C.value)), D = computed(() => cloneDeep_default(w.value));
 		provideData(D), useSandbox("multipleCustomSlot", e.nodeId, e.instance, injectSandbox(), T, D);
 		let O = (C) => {
-			let w = elements[C.key];
+			let w = getElement(C.key);
 			if (!w) {
 				console.assert(!1, `element not found key=${C.key}`);
 				return;
@@ -3012,7 +3030,7 @@ var echarts_default = core_exports, v1_default$49 = /* @__PURE__ */ defineCompon
 			let e = {};
 			return D.value?.type === "ui" && A(e), e;
 		}), { position: M, rotation: N, scale: P } = useTransformV1(T), F = (e) => {
-			let C = elements[e.key];
+			let C = getElement(e.key);
 			if (!C) {
 				console.assert(!1, `element not found key=${e.key}`);
 				return;
@@ -3105,7 +3123,7 @@ var echarts_default = core_exports, v1_default$49 = /* @__PURE__ */ defineCompon
 			return k.value?.type === "ui" && A(e), e;
 		}), { position: M, rotation: N, scale: P } = useTransformV1(T);
 		function F(e) {
-			let C = elements[e.key];
+			let C = getElement(e.key);
 			if (!C) {
 				console.assert(!1, `element not found key=${e.key}`);
 				return;
@@ -3736,7 +3754,7 @@ var v1_default$40 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			});
 		};
 	}
-}), v1_default$26 = /* @__PURE__ */ defineComponent({
+}), v1_default$27 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -3760,7 +3778,7 @@ var v1_default$40 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 		});
 		return (e, C) => (openBlock(), createElementBlock("div", { style: normalizeStyle(F.value) }, [renderSlot(e.$slots, "default")], 4));
 	}
-}), v1_default$27 = /* @__PURE__ */ defineComponent({
+}), v1_default$26 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -3774,7 +3792,7 @@ var v1_default$40 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 		});
 		return (e, C) => (openBlock(), createElementBlock("div", { style: normalizeStyle(A.value) }, [renderSlot(e.$slots, "default")], 4));
 	}
-}), v1_default$24 = /* @__PURE__ */ defineComponent({
+}), v1_default$25 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -3806,7 +3824,7 @@ var v1_default$40 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			]);
 		};
 	}
-}), v1_default$23 = /* @__PURE__ */ defineComponent({
+}), v1_default$24 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -3832,7 +3850,7 @@ var v1_default$40 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			]);
 		};
 	}
-}), _hoisted_1 = ["id"], v1_default$22 = /* @__PURE__ */ defineComponent({
+}), _hoisted_1 = ["id"], v1_default$23 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -3866,7 +3884,7 @@ var v1_default$40 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			}, 8, ["modelValue", "target"]);
 		};
 	}
-}), v1_default$21 = /* @__PURE__ */ defineComponent({
+}), v1_default$22 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -3953,7 +3971,7 @@ var v1_default$40 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			});
 		};
 	}
-}), v1_default$20 = /* @__PURE__ */ defineComponent({
+}), v1_default$21 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4001,7 +4019,7 @@ var v1_default$40 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			});
 		};
 	}
-}), v1_default$19 = /* @__PURE__ */ defineComponent({
+}), v1_default$20 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4031,7 +4049,7 @@ var v1_default$40 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			]);
 		};
 	}
-}), v1_default$18 = /* @__PURE__ */ defineComponent({
+}), v1_default$19 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4068,7 +4086,7 @@ var v1_default$40 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			});
 		};
 	}
-}), v1_default$17 = /* @__PURE__ */ defineComponent({
+}), v1_default$18 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4147,7 +4165,7 @@ var v1_default$40 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			});
 		};
 	}
-}), v1_default$16 = /* @__PURE__ */ defineComponent({
+}), v1_default$17 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4185,7 +4203,7 @@ var v1_default$40 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			});
 		};
 	}
-}), v1_default$15 = /* @__PURE__ */ defineComponent({
+}), v1_default$16 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4222,7 +4240,7 @@ var v1_default$40 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			});
 		};
 	}
-}), v1_default$14 = /* @__PURE__ */ defineComponent({
+}), v1_default$15 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4310,7 +4328,7 @@ var v1_default$40 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			});
 		};
 	}
-}), v1_default$9 = /* @__PURE__ */ defineComponent({
+}), v1_default$14 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4386,7 +4404,7 @@ var v1_default$11 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			}, 8, ["value"]);
 		};
 	}
-}), v1_default$8 = /* @__PURE__ */ defineComponent({
+}), v1_default$9 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4428,7 +4446,7 @@ var v1_default$11 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			});
 		};
 	}
-}), v1_default$7 = /* @__PURE__ */ defineComponent({
+}), v1_default$8 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4458,7 +4476,7 @@ var v1_default$11 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			});
 		};
 	}
-}), v1_default$6 = /* @__PURE__ */ defineComponent({
+}), v1_default$7 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4530,7 +4548,7 @@ var v1_default$11 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			});
 		};
 	}
-}), v1_default$5 = /* @__PURE__ */ defineComponent({
+}), v1_default$6 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4547,7 +4565,7 @@ var v1_default$11 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			_: 1
 		}));
 	}
-}), v1_default$4 = /* @__PURE__ */ defineComponent({
+}), v1_default$5 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4706,7 +4724,7 @@ var v1_default$11 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 		let { render: O } = useElementSlotRender(C.refContext, w, D);
 		return (e, C) => (openBlock(), createBlock(unref(O)));
 	}
-}), v1_default$25 = /* @__PURE__ */ defineComponent({
+}), v1_default$4 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4856,7 +4874,7 @@ var v1_default$11 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main
 			});
 		};
 	}
-}), v1_default$2 = /* @__PURE__ */ defineComponent({
+}), v1_default$3 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4931,7 +4949,7 @@ function _sfc_render$1(e, C) {
 		_: 3
 	});
 }
-var v1_default$3 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main$1, [["render", _sfc_render$1]]), v1_default = /* @__PURE__ */ defineComponent({
+var v1_default$2 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main$1, [["render", _sfc_render$1]]), v1_default$1 = /* @__PURE__ */ defineComponent({
 	__name: "index",
 	props: {
 		nodeId: {},
@@ -4975,7 +4993,7 @@ function _sfc_render(e, C) {
 		_: 3
 	});
 }
-var v1_default$1 = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main, [["render", _sfc_render]]);
+var v1_default = /* @__PURE__ */ __plugin_vue_export_helper_default(_sfc_main, [["render", _sfc_render]]);
 const basicV1 = {
 	key: "basic",
 	name: "x-runtime-lib.basic",
@@ -5565,8 +5583,8 @@ const orbitControlsV1 = {
 };
 regElement(orbitControlsV1);
 function spawn$16(e, C) {
-	let w = getTag(e, C), T = meshV1.properties[w], E = initNode();
-	initProperties(E, T), E.basic.id = genId(16), E.basic.key = meshV1.key, E.transform = {
+	let w = getElementMust("3d_mesh_v1"), T = getProperties(w, e, C), E = initNode();
+	initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, E.transform = {
 		position: {
 			x: 0,
 			y: 0,
@@ -5594,8 +5612,8 @@ function spawn$16(e, C) {
 	};
 }
 function spawnBoxGeometry(e, C) {
-	let w = getTag(e, C), T = boxGeometryV1.properties[w], E = initNode();
-	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = boxGeometryV1.key, E.settings = {
+	let w = getElementMust("3d_box_geometry_v1"), T = getProperties(w, e, C), E = initNode();
+	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, E.settings = {
 		width: 1,
 		height: 1,
 		depth: 1,
@@ -5608,8 +5626,8 @@ function spawnBoxGeometry(e, C) {
 	};
 }
 function spawnMeshBasicMaterial$1(e, C) {
-	let w = getTag(e, C), T = meshBasicMaterialV1.properties[w], E = initNode();
-	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = meshBasicMaterialV1.key, {
+	let w = getElementMust("3d_mesh_basic_material_v1"), T = getProperties(w, e, C), E = initNode();
+	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, {
 		nodeLite: toNodeLite(E),
 		nodes: { [E.basic.id]: E }
 	};
@@ -5675,8 +5693,8 @@ const boxGeometryV1 = {
 };
 regElement(boxGeometryV1);
 function spawn$15(e, C) {
-	let w = getTag(e, C), T = meshV1.properties[w], E = initNode();
-	initProperties(E, T), E.basic.id = genId(16), E.basic.key = meshV1.key, E.transform = {
+	let w = getElementMust("3d_mesh_v1"), T = getProperties(w, e, C), E = initNode();
+	initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, E.transform = {
 		position: {
 			x: 0,
 			y: 0,
@@ -5704,8 +5722,8 @@ function spawn$15(e, C) {
 	};
 }
 function spawnSphereGeometry(e, C) {
-	let w = getTag(e, C), T = sphereGeometryV1.properties[w], E = initNode();
-	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = sphereGeometryV1.key, E.settings = {
+	let w = getElementMust("3d_sphere_geometry_v1"), T = getProperties(w, e, C), E = initNode();
+	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, E.settings = {
 		radius: 1,
 		widthSegements: 32,
 		heightSegements: 16,
@@ -5719,8 +5737,8 @@ function spawnSphereGeometry(e, C) {
 	};
 }
 function spawnMeshBasicMaterial(e, C) {
-	let w = getTag(e, C), T = meshBasicMaterialV1.properties[w], E = initNode();
-	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = meshBasicMaterialV1.key, {
+	let w = getElementMust("3d_mesh_basic_material_v1"), T = getProperties(w, e, C), E = initNode();
+	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, {
 		nodeLite: toNodeLite(E),
 		nodes: { [E.basic.id]: E }
 	};
@@ -6021,8 +6039,8 @@ const meshV1 = {
 };
 regElement(meshV1);
 function spawn$14(e, C) {
-	let w = getTag(e, C), T = barChartV1.properties[w], E = initNode();
-	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = barChartV1.key, E.size.height = "300px", E.xAxis.data = [
+	let w = getElementMust("ui_bar_chart_v1"), T = getProperties(w, e, C), E = initNode();
+	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, E.size.height = "300px", E.xAxis.data = [
 		"Mon",
 		"Tue",
 		"Wed",
@@ -6094,8 +6112,8 @@ const barChartV1 = {
 };
 regElement(barChartV1);
 function spawn$13(e, C) {
-	let w = getTag(e, C), T = lineChartV1.properties[w], E = initNode();
-	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = lineChartV1.key, E.size.height = "300px", E.xAxis.data = [
+	let w = getElementMust("ui_line_chart_v1"), T = getProperties(w, e, C), E = initNode();
+	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, E.size.height = "300px", E.xAxis.data = [
 		"Mon",
 		"Tue",
 		"Wed",
@@ -6486,8 +6504,8 @@ const badgeV1 = {
 };
 regElement(badgeV1);
 function spawn$12(e, C) {
-	let w = getTag(e, C), T = btnV1.properties[w], E = initNode();
-	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = btnV1.key, E.settings.text = "button", {
+	let w = getElementMust("ui_btn_v1"), T = getProperties(w, e, C), E = initNode();
+	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, E.settings.text = "button", {
 		nodeLite: toNodeLite(E),
 		nodes: { [E.basic.id]: E }
 	};
@@ -6684,8 +6702,8 @@ const btnToggleV1 = {
 };
 regElement(btnToggleV1);
 function spawn$11(e, C) {
-	let w = getTag(e, C), T = cardV1.properties[w], E = initNode();
-	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = cardV1.key, E.children = [], E.settings.title = "title", E.settings.subtitle = "subtitle", E.settings.text = "text", {
+	let w = getElementMust("ui_card_v1"), T = getProperties(w, e, C), E = initNode();
+	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, E.children = [], E.settings.title = "title", E.settings.subtitle = "subtitle", E.settings.text = "text", {
 		nodeLite: toNodeLite(E),
 		nodes: { [E.basic.id]: E }
 	};
@@ -6879,8 +6897,8 @@ const chipV1 = {
 };
 regElement(chipV1);
 function spawn$10(e, C) {
-	let w = getTag(e, C), T = chipGroupV1.properties[w], E = initNode();
-	initProperties(E, T), E.basic.id = genId(16), E.basic.key = chipGroupV1.key;
+	let w = getElementMust("ui_chip_group_v1"), T = getProperties(w, e, C), E = initNode();
+	initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key;
 	let D = spawnChip(e, C, "chip1", "chip 1"), O = spawnChip(e, C, "chip2", "chip 2"), k = spawnChip(e, C, "chip3", "chip 3"), A = spawnChip(e, C, "chip4", "chip 4"), j = spawnChip(e, C, "chip5", "chip 5"), M = spawnChip(e, C, "chip6", "chip 6");
 	return {
 		nodeLite: toNodeLite(E, [
@@ -6903,8 +6921,8 @@ function spawn$10(e, C) {
 	};
 }
 function spawnChip(e, C, w, T) {
-	let E = getTag(e, C), D = chipV1.properties[E], O = initNode();
-	return initProperties(O, D), O.basic.id = genId(16), O.basic.key = chipV1.key, O.settings.value = w, O.settings.text = T, {
+	let E = getElementMust("ui_chip_v1"), D = getProperties(E, e, C), O = initNode();
+	return initProperties(O, D), O.basic.id = genId(16), O.basic.key = E.key, O.settings.value = w, O.settings.text = T, {
 		nodeLite: toNodeLite(O),
 		nodes: { [O.basic.id]: O }
 	};
@@ -7295,42 +7313,9 @@ const fileInputV1 = {
 	},
 	leaf: !0
 };
-var settings$21 = {
-	key: "settings",
-	name: "x-runtime-lib.settings",
-	children: [{
-		key: "grow",
-		name: "x-runtime-lib.grow",
-		ui: "switch",
-		default: !1
-	}, {
-		key: "shrink",
-		name: "x-runtime-lib.shrink",
-		ui: "switch",
-		default: !1
-	}]
-};
-const flexLayoutEntryV1 = {
-	key: "ui_flex_layout_entry_v1",
-	name: "x-runtime-lib.flexLayoutEntry",
-	comp: v1_default$27,
-	properties: {
-		pageUi: [
-			basicV1,
-			sizeV1,
-			settings$21
-		],
-		compUi: [
-			basicV1,
-			sizeV1,
-			settings$21
-		]
-	}
-};
-regElement(flexLayoutEntryV1);
 function spawn$9(e, C) {
-	let w = getTag(e, C), T = flexLayoutV1.properties[w], E = initNode();
-	initProperties(E, T), E.basic.id = genId(16), E.basic.key = flexLayoutV1.key;
+	let w = getElementMust("ui_flex_layout_v1"), T = getProperties(w, e, C), E = initNode();
+	initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key;
 	let D = spawnContainer(e, C, "#ff0000", "40px", void 0, void 0, "40px", void 0, void 0), O = spawnContainer(e, C, "#00ff00", "60px", void 0, void 0, "60px", void 0, void 0), k = spawnEntry$3(e, C);
 	return {
 		nodeLite: toNodeLite(E, [
@@ -7347,8 +7332,8 @@ function spawn$9(e, C) {
 	};
 }
 function spawnEntry$3(e, C) {
-	let w = getTag(e, C), T = flexLayoutEntryV1.properties[w], E = initNode();
-	initProperties(E, T), E.basic.id = genId(16), E.basic.key = flexLayoutEntryV1.key;
+	let w = getElementMust("ui_flex_layout_entry_v1"), T = getProperties(w, e, C), E = initNode();
+	initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key;
 	let D = spawnContainer(e, C, "#0000ff", void 0, "80px", void 0, void 0, "80px", void 0);
 	return {
 		nodeLite: toNodeLite(E, [D.nodeLite]),
@@ -7359,15 +7344,15 @@ function spawnEntry$3(e, C) {
 	};
 }
 function spawnContainer(e, C, w, T, E, D, O, k, A) {
-	let j = getTag(e, C), M = containerV1.properties[j], N = initNode();
-	return initProperties(N, M), N.basic.id = genId(16), N.basic.key = containerV1.key, T && (N.size.width = T), E && (N.size.minWidth = E), D && (N.size.maxWidth = D), O && (N.size.height = O), k && (N.size.minHeight = k), A && (N.size.maxHeight = A), w && (N.settings.backgroundColor.mode = "custom", N.settings.backgroundColor.custom.light = w, N.settings.backgroundColor.custom.dark = w), {
+	let j = getElementMust("ui_container_v1"), M = getProperties(j, e, C), N = initNode();
+	return initProperties(N, M), N.basic.id = genId(16), N.basic.key = j.key, T && (N.size.width = T), E && (N.size.minWidth = E), D && (N.size.maxWidth = D), O && (N.size.height = O), k && (N.size.minHeight = k), A && (N.size.maxHeight = A), w && (N.settings.backgroundColor.mode = "custom", N.settings.backgroundColor.custom.light = w, N.settings.backgroundColor.custom.dark = w), {
 		nodeLite: toNodeLite(N, []),
 		nodes: { [N.basic.id]: N }
 	};
 }
 var backgroundColor$1 = cloneDeep_default(colorV1);
 backgroundColor$1.key = "backgroundColor", backgroundColor$1.name = "x-runtime-lib.backgroundColor";
-var settings$20 = {
+var settings$21 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [
@@ -7541,7 +7526,7 @@ var settings$20 = {
 const flexLayoutV1 = {
 	key: "ui_flex_layout_v1",
 	name: "x-runtime-lib.flexLayout",
-	comp: v1_default$26,
+	comp: v1_default$27,
 	properties: {
 		pageUi: [
 			basicV1,
@@ -7549,7 +7534,7 @@ const flexLayoutV1 = {
 			borderV1,
 			marginV1,
 			paddingV1,
-			settings$20
+			settings$21
 		],
 		compUi: [
 			basicV1,
@@ -7557,7 +7542,7 @@ const flexLayoutV1 = {
 			borderV1,
 			marginV1,
 			paddingV1,
-			settings$20
+			settings$21
 		]
 	},
 	events: [{
@@ -7567,263 +7552,42 @@ const flexLayoutV1 = {
 	spawn: spawn$9
 };
 regElement(flexLayoutV1);
-var settings$19 = {
+var settings$20 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
-	children: [
-		{
-			key: "disabled",
-			name: "x-runtime-lib.disabled",
-			ui: "switch",
-			default: !1
-		},
-		{
-			key: "readonly",
-			name: "x-runtime-lib.readonly",
-			ui: "switch",
-			default: !1
-		},
-		{
-			key: "loading",
-			name: "x-runtime-lib.loading",
-			ui: "switch",
-			default: !1
-		},
-		{
-			key: "value",
-			name: "x-runtime-lib.value",
-			ui: "strInput",
-			default: ""
-		},
-		{
-			key: "variant",
-			name: "x-runtime-lib.variant",
-			ui: "select",
-			items: "fieldVariantItemsV1",
-			default: "filled"
-		},
-		{
-			key: "density",
-			name: "x-runtime-lib.density",
-			ui: "select",
-			items: "densityItemsV1",
-			default: "default"
-		},
-		{
-			key: "label",
-			name: "x-runtime-lib.label",
-			ui: "strInput",
-			default: "label"
-		},
-		{
-			key: "placeholder",
-			name: "x-runtime-lib.placeholder",
-			ui: "strInput",
-			default: ""
-		},
-		{
-			key: "hideDetails",
-			name: "x-runtime-lib.hideDetails",
-			ui: "switch",
-			default: !1
-		},
-		{
-			key: "singleLine",
-			name: "x-runtime-lib.singleLine",
-			ui: "switch",
-			default: !1
-		},
-		{
-			key: "autofocus",
-			name: "x-runtime-lib.autofocus",
-			ui: "switch",
-			default: !1
-		},
-		{
-			key: "clearable",
-			name: "x-runtime-lib.clearable",
-			ui: "switch",
-			default: !1
-		},
-		{
-			key: "prefix",
-			name: "x-runtime-lib.prefix",
-			ui: "strInput",
-			default: ""
-		},
-		{
-			key: "suffix",
-			name: "x-runtime-lib.suffix",
-			ui: "strInput",
-			default: ""
-		},
-		{
-			key: "reverse",
-			name: "x-runtime-lib.reverse",
-			ui: "switch",
-			default: !1
-		},
-		{
-			key: "appendIcon",
-			name: "x-runtime-lib.appendIcon",
-			ui: "strInput",
-			default: ""
-		},
-		{
-			key: "appendInnerIcon",
-			name: "x-runtime-lib.appendInnerIcon",
-			ui: "strInput",
-			default: ""
-		},
-		{
-			key: "prependIcon",
-			name: "x-runtime-lib.prependIcon",
-			ui: "strInput",
-			default: ""
-		},
-		{
-			key: "prependInnerIcon",
-			name: "x-runtime-lib.prependInnerIcon",
-			ui: "strInput",
-			default: ""
-		}
-	]
-}, slots$1 = {
-	key: "slots",
-	name: "x-runtime-lib.slots",
-	children: [
-		{
-			key: "append",
-			name: "x-runtime-lib.append",
-			ui: "selectComp",
-			default: void 0
-		},
-		{
-			key: "appendInner",
-			name: "x-runtime-lib.appendInner",
-			ui: "selectComp",
-			default: void 0
-		},
-		{
-			key: "prepend",
-			name: "x-runtime-lib.prepend",
-			ui: "selectComp",
-			default: void 0
-		},
-		{
-			key: "prependInner",
-			name: "x-runtime-lib.prependInner",
-			ui: "selectComp",
-			default: void 0
-		}
-	]
+	children: [{
+		key: "grow",
+		name: "x-runtime-lib.grow",
+		ui: "switch",
+		default: !1
+	}, {
+		key: "shrink",
+		name: "x-runtime-lib.shrink",
+		ui: "switch",
+		default: !1
+	}]
 };
-const textFieldV1 = {
-	key: "ui_text_field_v1",
-	name: "x-runtime-lib.textField",
-	comp: v1_default$25,
+const flexLayoutEntryV1 = {
+	key: "ui_flex_layout_entry_v1",
+	name: "x-runtime-lib.flexLayoutEntry",
+	comp: v1_default$26,
 	properties: {
 		pageUi: [
 			basicV1,
-			settings$19,
-			slots$1
+			sizeV1,
+			settings$20
 		],
 		compUi: [
 			basicV1,
-			settings$19,
-			slots$1
+			sizeV1,
+			settings$20
 		]
-	},
-	events: [],
-	methods: [],
-	slots: [
-		{
-			key: "append",
-			name: "x-runtime-lib.append",
-			methods: [
-				{
-					key: "reset",
-					name: "x-runtime-lib.reset"
-				},
-				{
-					key: "resetValidation",
-					name: "x-runtime-lib.resetValidation"
-				},
-				{
-					key: "validate",
-					name: "x-runtime-lib.validate"
-				}
-			]
-		},
-		{
-			key: "appendInner",
-			name: "x-runtime-lib.appendInner",
-			properties: [{
-				key: "isActive",
-				name: "x-runtime-lib.isActive",
-				type: "boolean",
-				readonly: !0
-			}, {
-				key: "isFocused",
-				name: "x-runtime-lib.isFocused",
-				type: "boolean",
-				readonly: !0
-			}],
-			methods: [{
-				key: "focus",
-				name: "x-runtime-lib.focus"
-			}, {
-				key: "blur",
-				name: "x-runtime-lib.blur"
-			}]
-		},
-		{
-			key: "prepend",
-			name: "x-runtime-lib.prepend",
-			methods: [
-				{
-					key: "reset",
-					name: "x-runtime-lib.reset"
-				},
-				{
-					key: "resetValidation",
-					name: "x-runtime-lib.resetValidation"
-				},
-				{
-					key: "validate",
-					name: "x-runtime-lib.validate"
-				}
-			]
-		},
-		{
-			key: "prependInner",
-			name: "x-runtime-lib.prependInner",
-			properties: [{
-				key: "isActive",
-				name: "x-runtime-lib.isActive",
-				type: "boolean",
-				readonly: !0
-			}, {
-				key: "isFocused",
-				name: "x-runtime-lib.isFocused",
-				type: "boolean",
-				readonly: !0
-			}],
-			methods: [{
-				key: "focus",
-				name: "x-runtime-lib.focus"
-			}, {
-				key: "blur",
-				name: "x-runtime-lib.blur"
-			}]
-		}
-	],
-	leaf: !0
+	}
 };
-regElement(textFieldV1);
+regElement(flexLayoutEntryV1);
 function spawn$8(e, C) {
-	let w = getTag(e, C), T = formV1.properties[w], E = initNode();
-	initProperties(E, T), E.basic.id = genId(16), E.basic.key = formV1.key;
+	let w = getElementMust("ui_form_v1"), T = getProperties(w, e, C), E = initNode();
+	initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key;
 	let D = spawnTextField(e, C);
 	return {
 		nodeLite: toNodeLite(E, [D.nodeLite]),
@@ -7834,13 +7598,13 @@ function spawn$8(e, C) {
 	};
 }
 function spawnTextField(e, C) {
-	let w = getTag(e, C), T = textFieldV1.properties[w], E = initNode();
-	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = textFieldV1.key, {
+	let w = getElementMust("ui_text_field_v1"), T = getProperties(w, e, C), E = initNode();
+	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, {
 		nodeLite: toNodeLite(E),
 		nodes: { [E.basic.id]: E }
 	};
 }
-var settings$18 = {
+var settings$19 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [{
@@ -7859,7 +7623,7 @@ var settings$18 = {
 const formV1 = {
 	key: "ui_form_v1",
 	name: "x-runtime-lib.form",
-	comp: v1_default$24,
+	comp: v1_default$25,
 	properties: {
 		pageUi: [
 			basicV1,
@@ -7867,7 +7631,7 @@ const formV1 = {
 			borderV1,
 			marginV1,
 			paddingV1,
-			settings$18
+			settings$19
 		],
 		compUi: [
 			basicV1,
@@ -7875,7 +7639,7 @@ const formV1 = {
 			borderV1,
 			marginV1,
 			paddingV1,
-			settings$18
+			settings$19
 		]
 	},
 	events: [{
@@ -7885,7 +7649,7 @@ const formV1 = {
 	spawn: spawn$8
 };
 regElement(formV1);
-var settings$17 = {
+var settings$18 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [
@@ -7914,10 +7678,10 @@ var settings$17 = {
 const iconV1 = {
 	key: "ui_icon_v1",
 	name: "x-runtime-lib.icon",
-	comp: v1_default$23,
+	comp: v1_default$24,
 	properties: {
-		pageUi: [basicV1, settings$17],
-		compUi: [basicV1, settings$17]
+		pageUi: [basicV1, settings$18],
+		compUi: [basicV1, settings$18]
 	},
 	leaf: !0
 };
@@ -7925,7 +7689,7 @@ regElement(iconV1);
 const menuV1 = {
 	key: "ui_menu_v1",
 	name: "x-runtime-lib.menu",
-	comp: v1_default$22,
+	comp: v1_default$23,
 	properties: {
 		pageUi: [basicV1],
 		compUi: [basicV1]
@@ -7941,8 +7705,8 @@ const menuV1 = {
 };
 regElement(menuV1);
 function spawn$7(e, C) {
-	let w = getTag(e, C), T = numberInputV1.properties[w], E = initNode();
-	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = numberInputV1.key, E.settings.label = "label", E.settings.placeholder = "placeholder", {
+	let w = getElementMust("ui_number_input_v1"), T = getProperties(w, e, C), E = initNode();
+	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, E.settings.label = "label", E.settings.placeholder = "placeholder", {
 		nodeLite: toNodeLite(E),
 		nodes: { [E.basic.id]: E }
 	};
@@ -7973,7 +7737,7 @@ var size = {
 			default: ""
 		}
 	]
-}, settings$16 = {
+}, settings$17 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [
@@ -8118,17 +7882,17 @@ var size = {
 const numberInputV1 = {
 	key: "ui_number_input_v1",
 	name: "x-runtime-lib.numberInput",
-	comp: v1_default$21,
+	comp: v1_default$22,
 	properties: {
 		pageUi: [
 			basicV1,
 			size,
-			settings$16
+			settings$17
 		],
 		compUi: [
 			basicV1,
 			size,
-			settings$16
+			settings$17
 		]
 	},
 	events: [
@@ -8157,7 +7921,7 @@ const numberInputV1 = {
 	spawn: spawn$7
 };
 regElement(numberInputV1);
-var settings$15 = {
+var settings$16 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [
@@ -8224,15 +7988,15 @@ var settings$15 = {
 const paginationV1 = {
 	key: "ui_pagination_v1",
 	name: "x-runtime-lib.pagination",
-	comp: v1_default$20,
+	comp: v1_default$21,
 	properties: {
-		pageUi: [basicV1, settings$15],
-		compUi: [basicV1, settings$15]
+		pageUi: [basicV1, settings$16],
+		compUi: [basicV1, settings$16]
 	},
 	leaf: !0
 };
 regElement(paginationV1);
-var settings$14 = {
+var settings$15 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [
@@ -8273,17 +8037,17 @@ var settings$14 = {
 const radioV1 = {
 	key: "ui_radio_v1",
 	name: "x-runtime-lib.radio",
-	comp: v1_default$19,
+	comp: v1_default$20,
 	properties: {
-		pageUi: [basicV1, settings$14],
-		compUi: [basicV1, settings$14]
+		pageUi: [basicV1, settings$15],
+		compUi: [basicV1, settings$15]
 	},
 	leaf: !0
 };
 regElement(radioV1);
 function spawn$6(e, C) {
-	let w = getTag(e, C), T = radioGroupV1.properties[w], E = initNode();
-	initProperties(E, T), E.basic.id = genId(16), E.basic.key = radioGroupV1.key, E.settings.value = "option1";
+	let w = getElementMust("ui_radio_group_v1"), T = getProperties(w, e, C), E = initNode();
+	initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, E.settings.value = "option1";
 	let D = spawnEntry$2(e, C, "option1", "Option 1"), O = spawnEntry$2(e, C, "option2", "Option 2"), k = spawnEntry$2(e, C, "option3", "Option 3");
 	return {
 		nodeLite: toNodeLite(E, [
@@ -8300,13 +8064,13 @@ function spawn$6(e, C) {
 	};
 }
 function spawnEntry$2(e, C, w, T) {
-	let E = getTag(e, C), D = radioV1.properties[E], O = initNode();
-	return initProperties(O, D), O.basic.id = genId(16), O.basic.key = radioV1.key, O.settings.value = w, O.settings.label = T, {
+	let E = getElementMust("ui_radio_v1"), D = getProperties(E, e, C), O = initNode();
+	return initProperties(O, D), O.basic.id = genId(16), O.basic.key = E.key, O.settings.value = w, O.settings.label = T, {
 		nodeLite: toNodeLite(O),
 		nodes: { [O.basic.id]: O }
 	};
 }
-var settings$13 = {
+var settings$14 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [
@@ -8353,15 +8117,15 @@ var settings$13 = {
 const radioGroupV1 = {
 	key: "ui_radio_group_v1",
 	name: "x-runtime-lib.radioGroup",
-	comp: v1_default$18,
+	comp: v1_default$19,
 	properties: {
-		pageUi: [basicV1, settings$13],
-		compUi: [basicV1, settings$13]
+		pageUi: [basicV1, settings$14],
+		compUi: [basicV1, settings$14]
 	},
 	spawn: spawn$6
 };
 regElement(radioGroupV1);
-var settings$12 = {
+var settings$13 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [
@@ -8473,15 +8237,15 @@ var settings$12 = {
 const rangeSliderV1 = {
 	key: "ui_range_slider_v1",
 	name: "x-runtime-lib.rangeSlider",
-	comp: v1_default$17,
+	comp: v1_default$18,
 	properties: {
-		pageUi: [basicV1, settings$12],
-		compUi: [basicV1, settings$12]
+		pageUi: [basicV1, settings$13],
+		compUi: [basicV1, settings$13]
 	},
 	leaf: !0
 };
 regElement(rangeSliderV1);
-var settings$11 = {
+var settings$12 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [
@@ -8540,15 +8304,15 @@ var settings$11 = {
 const ratingV1 = {
 	key: "ui_rating_v1",
 	name: "x-runtime-lib.rating",
-	comp: v1_default$16,
+	comp: v1_default$17,
 	properties: {
-		pageUi: [basicV1, settings$11],
-		compUi: [basicV1, settings$11]
+		pageUi: [basicV1, settings$12],
+		compUi: [basicV1, settings$12]
 	},
 	leaf: !0
 };
 regElement(ratingV1);
-var settings$10 = {
+var settings$11 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [
@@ -8593,10 +8357,10 @@ var settings$10 = {
 const selectV1 = {
 	key: "ui_select_v1",
 	name: "x-runtime-lib.select",
-	comp: v1_default$15,
+	comp: v1_default$16,
 	properties: {
-		pageUi: [basicV1, settings$10],
-		compUi: [basicV1, settings$10]
+		pageUi: [basicV1, settings$11],
+		compUi: [basicV1, settings$11]
 	},
 	leaf: !0
 };
@@ -8607,7 +8371,7 @@ var trackColor = cloneDeep_default(colorV1);
 trackColor.key = "trackColor", trackColor.name = "x-runtime-lib.trackColor";
 var thumbColor = cloneDeep_default(colorV1);
 thumbColor.key = "thumbColor", thumbColor.name = "x-runtime-lib.thumbColor";
-var settings$9 = {
+var settings$10 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [
@@ -8713,7 +8477,7 @@ var settings$9 = {
 		trackColor,
 		thumbColor
 	]
-}, slots = {
+}, slots$1 = {
 	key: "slots",
 	name: "x-runtime-lib.slots",
 	children: [{
@@ -8731,85 +8495,25 @@ var settings$9 = {
 const sliderV1 = {
 	key: "ui_slider_v1",
 	name: "x-runtime-lib.slider",
-	comp: v1_default$14,
+	comp: v1_default$15,
 	properties: {
 		pageUi: [
 			basicV1,
-			settings$9,
-			slots
+			settings$10,
+			slots$1
 		],
 		compUi: [
 			basicV1,
-			settings$9,
-			slots
+			settings$10,
+			slots$1
 		]
 	},
 	leaf: !0
 };
 regElement(sliderV1);
-const stepperHeaderV1 = {
-	key: "ui_stepper_header_v1",
-	name: "x-runtime-lib.stepperHeader",
-	comp: v1_default$13,
-	properties: {
-		pageUi: [basicV1],
-		compUi: [basicV1]
-	}
-};
-regElement(stepperHeaderV1);
-var settings$8 = {
-	key: "settings",
-	name: "x-runtime-lib.settings",
-	children: [{
-		key: "value",
-		name: "x-runtime-lib.value",
-		ui: "strInput",
-		default: ""
-	}]
-};
-const stepperItemV1 = {
-	key: "ui_stepper_item_v1",
-	name: "x-runtime-lib.stepperItem",
-	comp: v1_default$12,
-	properties: {
-		pageUi: [basicV1, settings$8],
-		compUi: [basicV1, settings$8]
-	}
-};
-regElement(stepperItemV1);
-const stepperWindowV1 = {
-	key: "ui_stepper_window_v1",
-	name: "x-runtime-lib.stepperWindow",
-	comp: v1_default$11,
-	properties: {
-		pageUi: [basicV1],
-		compUi: [basicV1]
-	}
-};
-regElement(stepperWindowV1);
-var settings$7 = {
-	key: "settings",
-	name: "x-runtime-lib.settings",
-	children: [{
-		key: "value",
-		name: "x-runtime-lib.value",
-		ui: "strInput",
-		default: ""
-	}]
-};
-const stepperWindowItemV1 = {
-	key: "ui_stepper_window_item_v1",
-	name: "x-runtime-lib.stepperWindowItem",
-	comp: v1_default$10,
-	properties: {
-		pageUi: [basicV1, settings$7],
-		compUi: [basicV1, settings$7]
-	}
-};
-regElement(stepperWindowItemV1);
 function spawn$5(e, C) {
-	let w = getTag(e, C), T = stepperV1.properties[w], E = initNode();
-	initProperties(E, T), E.basic.id = genId(16), E.basic.key = stepperV1.key;
+	let w = getElementMust("ui_stepper_v1"), T = getProperties(w, e, C), E = initNode();
+	initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key;
 	let D = spawnHeader(e, C), O = spawnWindow(e, C);
 	return {
 		nodeLite: toNodeLite(E, [D.nodeLite, O.nodeLite]),
@@ -8821,8 +8525,8 @@ function spawn$5(e, C) {
 	};
 }
 function spawnHeader(e, C) {
-	let w = getTag(e, C), T = stepperHeaderV1.properties[w], E = initNode();
-	initProperties(E, T), E.basic.id = genId(16), E.basic.key = stepperHeaderV1.key;
+	let w = getElementMust("ui_stepper_header_v1"), T = getProperties(w, e, C), E = initNode();
+	initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key;
 	let D = spawnItem(e, C, "step1"), O = spawnItem(e, C, "step2"), k = spawnItem(e, C, "step3");
 	return {
 		nodeLite: toNodeLite(E, [
@@ -8839,15 +8543,15 @@ function spawnHeader(e, C) {
 	};
 }
 function spawnItem(e, C, w) {
-	let T = getTag(e, C), E = stepperItemV1.properties[T], D = initNode();
-	return initProperties(D, E), D.basic.id = genId(16), D.basic.key = stepperItemV1.key, D.settings.value = w, {
+	let T = getElementMust("ui_stepper_item_v1"), E = getProperties(T, e, C), D = initNode();
+	return initProperties(D, E), D.basic.id = genId(16), D.basic.key = T.key, D.settings.value = w, {
 		nodeLite: toNodeLite(D, []),
 		nodes: { [D.basic.id]: D }
 	};
 }
 function spawnWindow(e, C) {
-	let w = getTag(e, C), T = stepperWindowV1.properties[w], E = initNode();
-	initProperties(E, T), E.basic.id = genId(16), E.basic.key = stepperWindowV1.key;
+	let w = getElementMust("ui_stepper_window_v1"), T = getProperties(w, e, C), E = initNode();
+	initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key;
 	let D = spawnWindowItem(e, C, "step1", "step 1"), O = spawnWindowItem(e, C, "step2", "step 2"), k = spawnWindowItem(e, C, "step3", "step 3");
 	return {
 		nodeLite: toNodeLite(E, [
@@ -8864,8 +8568,8 @@ function spawnWindow(e, C) {
 	};
 }
 function spawnWindowItem(e, C, w, T) {
-	let E = getTag(e, C), D = stepperWindowItemV1.properties[E], O = initNode();
-	initProperties(O, D), O.basic.id = genId(16), O.basic.key = stepperWindowItemV1.key, O.settings.value = w;
+	let E = getElementMust("ui_stepper_window_item_v1"), D = getProperties(E, e, C), O = initNode();
+	initProperties(O, D), O.basic.id = genId(16), O.basic.key = E.key, O.settings.value = w;
 	let k = spawnCard(e, C, T);
 	return {
 		nodeLite: toNodeLite(O, [k.nodeLite]),
@@ -8876,13 +8580,13 @@ function spawnWindowItem(e, C, w, T) {
 	};
 }
 function spawnCard(e, C, w) {
-	let T = getTag(e, C), E = cardV1.properties[T], D = initNode();
-	return initProperties(D, E), D.basic.id = genId(16), D.basic.key = cardV1.key, D.settings.title = w, {
+	let T = getElementMust("ui_card_v1"), E = getProperties(T, e, C), D = initNode();
+	return initProperties(D, E), D.basic.id = genId(16), D.basic.key = T.key, D.settings.title = w, {
 		nodeLite: toNodeLite(D, []),
 		nodes: { [D.basic.id]: D }
 	};
 }
-var settings$6 = {
+var settings$9 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [{
@@ -8900,18 +8604,78 @@ var settings$6 = {
 const stepperV1 = {
 	key: "ui_stepper_v1",
 	name: "x-runtime-lib.stepper",
-	comp: v1_default$9,
+	comp: v1_default$14,
 	properties: {
-		pageUi: [basicV1, settings$6],
-		compUi: [basicV1, settings$6]
+		pageUi: [basicV1, settings$9],
+		compUi: [basicV1, settings$9]
 	},
 	spawn: spawn$5
 };
 regElement(stepperV1);
+const stepperHeaderV1 = {
+	key: "ui_stepper_header_v1",
+	name: "x-runtime-lib.stepperHeader",
+	comp: v1_default$13,
+	properties: {
+		pageUi: [basicV1],
+		compUi: [basicV1]
+	}
+};
+regElement(stepperHeaderV1);
+var settings$8 = {
+	key: "settings",
+	name: "x-runtime-lib.settings",
+	children: [{
+		key: "value",
+		name: "x-runtime-lib.value",
+		ui: "strInput",
+		default: ""
+	}]
+};
+const stepperItemV1 = {
+	key: "ui_stepper_item_v1",
+	name: "x-runtime-lib.stepperItem",
+	comp: v1_default$12,
+	properties: {
+		pageUi: [basicV1, settings$8],
+		compUi: [basicV1, settings$8]
+	}
+};
+regElement(stepperItemV1);
+const stepperWindowV1 = {
+	key: "ui_stepper_window_v1",
+	name: "x-runtime-lib.stepperWindow",
+	comp: v1_default$11,
+	properties: {
+		pageUi: [basicV1],
+		compUi: [basicV1]
+	}
+};
+regElement(stepperWindowV1);
+var settings$7 = {
+	key: "settings",
+	name: "x-runtime-lib.settings",
+	children: [{
+		key: "value",
+		name: "x-runtime-lib.value",
+		ui: "strInput",
+		default: ""
+	}]
+};
+const stepperWindowItemV1 = {
+	key: "ui_stepper_window_item_v1",
+	name: "x-runtime-lib.stepperWindowItem",
+	comp: v1_default$10,
+	properties: {
+		pageUi: [basicV1, settings$7],
+		compUi: [basicV1, settings$7]
+	}
+};
+regElement(stepperWindowItemV1);
 const switchV1 = {
 	key: "ui_switch_v1",
 	name: "x-runtime-lib.switch",
-	comp: v1_default$8,
+	comp: v1_default$9,
 	properties: {
 		pageUi: [basicV1],
 		compUi: [basicV1]
@@ -8919,7 +8683,7 @@ const switchV1 = {
 	leaf: !0
 };
 regElement(switchV1);
-var settings$5 = {
+var settings$6 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [{
@@ -8937,17 +8701,17 @@ var settings$5 = {
 const tabV1 = {
 	key: "ui_tab_v1",
 	name: "x-runtime-lib.tab",
-	comp: v1_default$7,
+	comp: v1_default$8,
 	properties: {
-		pageUi: [basicV1, settings$5],
-		compUi: [basicV1, settings$5]
+		pageUi: [basicV1, settings$6],
+		compUi: [basicV1, settings$6]
 	},
 	leaf: !0
 };
 regElement(tabV1);
 function spawn$4(e, C) {
-	let w = getTag(e, C), T = tabsV1.properties[w], E = initNode();
-	initProperties(E, T), E.basic.id = genId(16), E.basic.key = tabsV1.key;
+	let w = getElementMust("ui_tabs_v1"), T = getProperties(w, e, C), E = initNode();
+	initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key;
 	let D = spawnTab(e, C, "tab1", "tab 1"), O = spawnTab(e, C, "tab2", "tab 2"), k = spawnTab(e, C, "tab3", "tab 3");
 	return {
 		nodeLite: toNodeLite(E, [
@@ -8964,8 +8728,8 @@ function spawn$4(e, C) {
 	};
 }
 function spawnTab(e, C, w, T) {
-	let E = getTag(e, C), D = tabV1.properties[E], O = initNode();
-	return initProperties(O, D), O.basic.id = genId(16), O.basic.key = tabV1.key, O.settings.value = w, O.settings.text = T, {
+	let E = getElementMust("ui_tab_v1"), D = getProperties(E, e, C), O = initNode();
+	return initProperties(O, D), O.basic.id = genId(16), O.basic.key = E.key, O.settings.value = w, O.settings.text = T, {
 		nodeLite: toNodeLite(O),
 		nodes: { [O.basic.id]: O }
 	};
@@ -8976,7 +8740,7 @@ var selectedColor = cloneDeep_default(colorV1);
 selectedColor.key = "selectedColor", selectedColor.name = "x-runtime-lib.selectedColor";
 var sliderColor = cloneDeep_default(colorV1);
 sliderColor.key = "sliderColor", sliderColor.name = "x-runtime-lib.sliderColor";
-var settings$4 = {
+var settings$5 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [
@@ -9063,22 +8827,22 @@ var settings$4 = {
 const tabsV1 = {
 	key: "ui_tabs_v1",
 	name: "x-runtime-lib.tabs",
-	comp: v1_default$6,
+	comp: v1_default$7,
 	properties: {
-		pageUi: [basicV1, settings$4],
-		compUi: [basicV1, settings$4]
+		pageUi: [basicV1, settings$5],
+		compUi: [basicV1, settings$5]
 	},
 	spawn: spawn$4
 };
 regElement(tabsV1);
 function spawn$3(e, C) {
-	let w = getTag(e, C), T = textV1.properties[w], E = initNode();
-	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = textV1.key, E.settings.text = "text", {
+	let w = getElementMust("ui_text_v1"), T = getProperties(w, e, C), E = initNode();
+	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, E.settings.text = "text", {
 		nodeLite: toNodeLite(E),
 		nodes: { [E.basic.id]: E }
 	};
 }
-var settings$3 = {
+var settings$4 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
 	children: [
@@ -9168,22 +8932,106 @@ var settings$3 = {
 const textV1 = {
 	key: "ui_text_v1",
 	name: "x-runtime-lib.text",
+	comp: v1_default$6,
+	properties: {
+		pageUi: [basicV1, settings$4],
+		compUi: [basicV1, settings$4]
+	},
+	leaf: !0,
+	spawn: spawn$3
+};
+regElement(textV1);
+function spawn$2(e, C) {
+	let w = getElementMust("ui_textarea_v1"), T = getProperties(w, e, C), E = initNode();
+	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key, E.settings.label = "label", {
+		nodeLite: toNodeLite(E),
+		nodes: { [E.basic.id]: E }
+	};
+}
+var settings$3 = {
+	key: "settings",
+	name: "x-runtime-lib.settings",
+	children: [
+		{
+			key: "disabled",
+			name: "x-runtime-lib.disabled",
+			ui: "switch",
+			default: !1
+		},
+		{
+			key: "readonly",
+			name: "x-runtime-lib.readonly",
+			ui: "switch",
+			default: !1
+		},
+		{
+			key: "loading",
+			name: "x-runtime-lib.loading",
+			ui: "switch",
+			default: !1
+		},
+		{
+			key: "value",
+			name: "x-runtime-lib.value",
+			ui: "strInput",
+			default: ""
+		},
+		{
+			key: "label",
+			name: "x-runtime-lib.label",
+			ui: "strInput",
+			default: ""
+		},
+		{
+			key: "placeholder",
+			name: "x-runtime-lib.placeholder",
+			ui: "strInput",
+			default: ""
+		},
+		{
+			key: "reverse",
+			name: "x-runtime-lib.reverse",
+			ui: "switch",
+			default: !1
+		},
+		{
+			key: "clearable",
+			name: "x-runtime-lib.clearable",
+			ui: "switch",
+			default: !1
+		},
+		{
+			key: "rows",
+			name: "x-runtime-lib.rows",
+			ui: "numInput",
+			default: 5
+		},
+		{
+			key: "autoGrow",
+			name: "x-runtime-lib.autoGrow",
+			ui: "switch",
+			default: !1
+		},
+		{
+			key: "maxRows",
+			name: "x-runtime-lib.maxRows",
+			ui: "numInput",
+			default: 0
+		}
+	]
+};
+const textareaV1 = {
+	key: "ui_textarea_v1",
+	name: "x-runtime-lib.textarea",
 	comp: v1_default$5,
 	properties: {
 		pageUi: [basicV1, settings$3],
 		compUi: [basicV1, settings$3]
 	},
 	leaf: !0,
-	spawn: spawn$3
+	spawn: spawn$2
 };
-regElement(textV1);
-function spawn$2(e, C) {
-	let w = getTag(e, C), T = textareaV1.properties[w], E = initNode();
-	return initProperties(E, T), E.basic.id = genId(16), E.basic.key = textareaV1.key, E.settings.label = "label", {
-		nodeLite: toNodeLite(E),
-		nodes: { [E.basic.id]: E }
-	};
-}
+regElement(textareaV1);
 var settings$2 = {
 	key: "settings",
 	name: "x-runtime-lib.settings",
@@ -9212,11 +9060,25 @@ var settings$2 = {
 			ui: "strInput",
 			default: ""
 		},
+		{
+			key: "variant",
+			name: "x-runtime-lib.variant",
+			ui: "select",
+			items: "fieldVariantItemsV1",
+			default: "filled"
+		},
+		{
+			key: "density",
+			name: "x-runtime-lib.density",
+			ui: "select",
+			items: "densityItemsV1",
+			default: "default"
+		},
 		{
 			key: "label",
 			name: "x-runtime-lib.label",
 			ui: "strInput",
-			default: ""
+			default: "label"
 		},
 		{
 			key: "placeholder",
@@ -9225,8 +9087,20 @@ var settings$2 = {
 			default: ""
 		},
 		{
-			key: "reverse",
-			name: "x-runtime-lib.reverse",
+			key: "hideDetails",
+			name: "x-runtime-lib.hideDetails",
+			ui: "switch",
+			default: !1
+		},
+		{
+			key: "singleLine",
+			name: "x-runtime-lib.singleLine",
+			ui: "switch",
+			default: !1
+		},
+		{
+			key: "autofocus",
+			name: "x-runtime-lib.autofocus",
 			ui: "switch",
 			default: !1
 		},
@@ -9237,50 +9111,184 @@ var settings$2 = {
 			default: !1
 		},
 		{
-			key: "rows",
-			name: "x-runtime-lib.rows",
-			ui: "numInput",
-			default: 5
+			key: "prefix",
+			name: "x-runtime-lib.prefix",
+			ui: "strInput",
+			default: ""
 		},
 		{
-			key: "autoGrow",
-			name: "x-runtime-lib.autoGrow",
+			key: "suffix",
+			name: "x-runtime-lib.suffix",
+			ui: "strInput",
+			default: ""
+		},
+		{
+			key: "reverse",
+			name: "x-runtime-lib.reverse",
 			ui: "switch",
 			default: !1
 		},
 		{
-			key: "maxRows",
-			name: "x-runtime-lib.maxRows",
-			ui: "numInput",
-			default: 0
+			key: "appendIcon",
+			name: "x-runtime-lib.appendIcon",
+			ui: "strInput",
+			default: ""
+		},
+		{
+			key: "appendInnerIcon",
+			name: "x-runtime-lib.appendInnerIcon",
+			ui: "strInput",
+			default: ""
+		},
+		{
+			key: "prependIcon",
+			name: "x-runtime-lib.prependIcon",
+			ui: "strInput",
+			default: ""
+		},
+		{
+			key: "prependInnerIcon",
+			name: "x-runtime-lib.prependInnerIcon",
+			ui: "strInput",
+			default: ""
+		}
+	]
+}, slots = {
+	key: "slots",
+	name: "x-runtime-lib.slots",
+	children: [
+		{
+			key: "append",
+			name: "x-runtime-lib.append",
+			ui: "selectComp",
+			default: void 0
+		},
+		{
+			key: "appendInner",
+			name: "x-runtime-lib.appendInner",
+			ui: "selectComp",
+			default: void 0
+		},
+		{
+			key: "prepend",
+			name: "x-runtime-lib.prepend",
+			ui: "selectComp",
+			default: void 0
+		},
+		{
+			key: "prependInner",
+			name: "x-runtime-lib.prependInner",
+			ui: "selectComp",
+			default: void 0
 		}
 	]
 };
-const textareaV1 = {
-	key: "ui_textarea_v1",
-	name: "x-runtime-lib.textarea",
+const textFieldV1 = {
+	key: "ui_text_field_v1",
+	name: "x-runtime-lib.textField",
 	comp: v1_default$4,
 	properties: {
-		pageUi: [basicV1, settings$2],
-		compUi: [basicV1, settings$2]
+		pageUi: [
+			basicV1,
+			settings$2,
+			slots
+		],
+		compUi: [
+			basicV1,
+			settings$2,
+			slots
+		]
 	},
-	leaf: !0,
-	spawn: spawn$2
-};
-regElement(textareaV1);
-const timelineItemV1 = {
-	key: "ui_timeline_item_v1",
-	name: "x-runtime-lib.timelineItem",
-	comp: v1_default$3,
-	properties: {
-		pageUi: [basicV1],
-		compUi: [basicV1]
-	}
+	events: [],
+	methods: [],
+	slots: [
+		{
+			key: "append",
+			name: "x-runtime-lib.append",
+			methods: [
+				{
+					key: "reset",
+					name: "x-runtime-lib.reset"
+				},
+				{
+					key: "resetValidation",
+					name: "x-runtime-lib.resetValidation"
+				},
+				{
+					key: "validate",
+					name: "x-runtime-lib.validate"
+				}
+			]
+		},
+		{
+			key: "appendInner",
+			name: "x-runtime-lib.appendInner",
+			properties: [{
+				key: "isActive",
+				name: "x-runtime-lib.isActive",
+				type: "boolean",
+				readonly: !0
+			}, {
+				key: "isFocused",
+				name: "x-runtime-lib.isFocused",
+				type: "boolean",
+				readonly: !0
+			}],
+			methods: [{
+				key: "focus",
+				name: "x-runtime-lib.focus"
+			}, {
+				key: "blur",
+				name: "x-runtime-lib.blur"
+			}]
+		},
+		{
+			key: "prepend",
+			name: "x-runtime-lib.prepend",
+			methods: [
+				{
+					key: "reset",
+					name: "x-runtime-lib.reset"
+				},
+				{
+					key: "resetValidation",
+					name: "x-runtime-lib.resetValidation"
+				},
+				{
+					key: "validate",
+					name: "x-runtime-lib.validate"
+				}
+			]
+		},
+		{
+			key: "prependInner",
+			name: "x-runtime-lib.prependInner",
+			properties: [{
+				key: "isActive",
+				name: "x-runtime-lib.isActive",
+				type: "boolean",
+				readonly: !0
+			}, {
+				key: "isFocused",
+				name: "x-runtime-lib.isFocused",
+				type: "boolean",
+				readonly: !0
+			}],
+			methods: [{
+				key: "focus",
+				name: "x-runtime-lib.focus"
+			}, {
+				key: "blur",
+				name: "x-runtime-lib.blur"
+			}]
+		}
+	],
+	leaf: !0
 };
-regElement(timelineItemV1);
+regElement(textFieldV1);
 function spawn$1(e, C) {
-	let w = getTag(e, C), T = timelineV1.properties[w], E = initNode();
-	initProperties(E, T), E.basic.id = genId(16), E.basic.key = timelineV1.key;
+	let w = getElementMust("ui_timeline_v1"), T = getProperties(w, e, C), E = initNode();
+	initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key;
 	let D = spawnEntry$1(e, C, "timeline 1"), O = spawnEntry$1(e, C, "timeline 2"), k = spawnEntry$1(e, C, "timeline 3");
 	return {
 		nodeLite: toNodeLite(E, [
@@ -9297,8 +9305,8 @@ function spawn$1(e, C) {
 	};
 }
 function spawnEntry$1(e, C, w) {
-	let T = getTag(e, C), E = timelineItemV1.properties[T], D = initNode();
-	initProperties(D, E), D.basic.id = genId(16), D.basic.key = timelineItemV1.key;
+	let T = getElementMust("ui_timeline_item_v1"), E = getProperties(T, e, C), D = initNode();
+	initProperties(D, E), D.basic.id = genId(16), D.basic.key = T.key;
 	let O = spawnText$1(e, C, w);
 	return {
 		nodeLite: toNodeLite(D, [O.nodeLite]),
@@ -9309,8 +9317,8 @@ function spawnEntry$1(e, C, w) {
 	};
 }
 function spawnText$1(e, C, w) {
-	let T = getTag(e, C), E = textV1.properties[T], D = initNode();
-	return initProperties(D, E), D.basic.id = genId(16), D.basic.key = textV1.key, D.settings.text = w, {
+	let T = getElementMust("ui_text_v1"), E = getProperties(T, e, C), D = initNode();
+	return initProperties(D, E), D.basic.id = genId(16), D.basic.key = T.key, D.settings.text = w, {
 		nodeLite: toNodeLite(D),
 		nodes: { [D.basic.id]: D }
 	};
@@ -9394,7 +9402,7 @@ var dotColor = cloneDeep_default(colorV1), lineColor = cloneDeep_default(colorV1
 const timelineV1 = {
 	key: "ui_timeline_v1",
 	name: "x-runtime-lib.timeline",
-	comp: v1_default$2,
+	comp: v1_default$3,
 	properties: {
 		pageUi: [basicV1, settings$1],
 		compUi: [basicV1, settings$1]
@@ -9402,19 +9410,19 @@ const timelineV1 = {
 	spawn: spawn$1
 };
 regElement(timelineV1);
-const windowItemV1 = {
-	key: "ui_window_item_v1",
-	name: "x-runtime-lib.windowItem",
-	comp: v1_default$1,
+const timelineItemV1 = {
+	key: "ui_timeline_item_v1",
+	name: "x-runtime-lib.timelineItem",
+	comp: v1_default$2,
 	properties: {
 		pageUi: [basicV1],
 		compUi: [basicV1]
 	}
 };
-regElement(windowItemV1);
+regElement(timelineItemV1);
 function spawn(e, C) {
-	let w = getTag(e, C), T = windowV1.properties[w], E = initNode();
-	initProperties(E, T), E.basic.id = genId(16), E.basic.key = windowV1.key;
+	let w = getElementMust("ui_window_v1"), T = getProperties(w, e, C), E = initNode();
+	initProperties(E, T), E.basic.id = genId(16), E.basic.key = w.key;
 	let D = spawnEntry(e, C, "window 1"), O = spawnEntry(e, C, "window 2"), k = spawnEntry(e, C, "window 3");
 	return {
 		nodeLite: toNodeLite(E, [
@@ -9431,8 +9439,8 @@ function spawn(e, C) {
 	};
 }
 function spawnEntry(e, C, w) {
-	let T = getTag(e, C), E = windowItemV1.properties[T], D = initNode();
-	initProperties(D, E), D.basic.id = genId(16), D.basic.key = windowItemV1.key;
+	let T = getElementMust("ui_window_item_v1"), E = getProperties(T, e, C), D = initNode();
+	initProperties(D, E), D.basic.id = genId(16), D.basic.key = T.key;
 	let O = spawnFlexLayout(e, C, w);
 	return {
 		nodeLite: toNodeLite(D, [O.nodeLite]),
@@ -9443,8 +9451,8 @@ function spawnEntry(e, C, w) {
 	};
 }
 function spawnFlexLayout(e, C, w) {
-	let T = getTag(e, C), E = flexLayoutV1.properties[T], D = initNode();
-	initProperties(D, E), D.basic.id = genId(16), D.basic.key = flexLayoutV1.key, D.size.height = "200px", D.settings.mainAlign.xs = "center", D.settings.crossAlign.xs = "center", D.settings.backgroundColor.mode = "theme", D.settings.backgroundColor.theme = "background2";
+	let T = getElementMust("ui_flex_layout_v1"), E = getProperties(T, e, C), D = initNode();
+	initProperties(D, E), D.basic.id = genId(16), D.basic.key = T.key, D.size.height = "200px", D.settings.mainAlign.xs = "center", D.settings.crossAlign.xs = "center", D.settings.backgroundColor.mode = "theme", D.settings.backgroundColor.theme = "background2";
 	let O = spawnText(e, C, w);
 	return {
 		nodeLite: toNodeLite(D, [O.nodeLite]),
@@ -9455,8 +9463,8 @@ function spawnFlexLayout(e, C, w) {
 	};
 }
 function spawnText(e, C, w) {
-	let T = getTag(e, C), E = textV1.properties[T], D = initNode();
-	return initProperties(D, E), D.basic.id = genId(16), D.basic.key = textV1.key, D.settings.text = w, D.settings.style.xs = "h6", {
+	let T = getElementMust("ui_text_v1"), E = getProperties(T, e, C), D = initNode();
+	return initProperties(D, E), D.basic.id = genId(16), D.basic.key = T.key, D.settings.text = w, D.settings.style.xs = "h6", {
 		nodeLite: toNodeLite(D),
 		nodes: { [D.basic.id]: D }
 	};
@@ -9513,7 +9521,7 @@ var settings = {
 const windowV1 = {
 	key: "ui_window_v1",
 	name: "x-runtime-lib.window",
-	comp: v1_default,
+	comp: v1_default$1,
 	properties: {
 		pageUi: [basicV1, settings],
 		compUi: [basicV1, settings]
@@ -9521,6 +9529,16 @@ const windowV1 = {
 	spawn
 };
 regElement(windowV1);
+const windowItemV1 = {
+	key: "ui_window_item_v1",
+	name: "x-runtime-lib.windowItem",
+	comp: v1_default,
+	properties: {
+		pageUi: [basicV1],
+		compUi: [basicV1]
+	}
+};
+regElement(windowItemV1);
 function convertProperties(e) {
 	let C = [], w = (e, T, D) => {
 		if (T !== "" && (T += "."), T += e.key, D = cloneDeep_default(D), D.push(e.name), !e.ui && !e.array) e.children.forEach((e) => w(e, T, D));
@@ -9539,11 +9557,11 @@ function convertProperties(e) {
 	}), C;
 }
 function buildProperties() {
-	let e = {};
-	for (let C in elements) {
-		let w = {}, T = elements[C];
-		for (let e in T.properties) w[e] = convertProperties(T.properties[e]);
-		e[C] = w;
+	let e = {}, C = getAllElements();
+	for (let w in C) {
+		let T = {}, E = C[w];
+		for (let e in E.properties) T[e] = convertProperties(E.properties[e]);
+		e[w] = T;
 	}
 	return e;
 }
@@ -9582,7 +9600,7 @@ function spawnNode(e, C, w, T, E) {
 			console.error(`spawnNode [ref] element not found in pkg, ${D}`);
 			return;
 		}
-		let w = elements[e];
+		let w = getElement(e);
 		if (!w) {
 			console.error(`spawnNode [ref] element not found in global, ${D}`);
 			return;
@@ -9603,7 +9621,7 @@ function spawnNode(e, C, w, T, E) {
 			console.error(`spawnNode [key] element not found in pkg, ${D}`);
 			return;
 		}
-		let T = elements[w];
+		let T = getElement(w);
 		if (!T) {
 			console.error(`spawnNode [key] element not found in global, ${D}`);
 			return;
@@ -9867,7 +9885,7 @@ function unwrapTriggerId(e) {
 	if (C.length < 1) throw Error("unwrap trigger id failed");
 	let w = C[0];
 	if (w === "property") {
-		if (C.length < 2) throw Error("unwrap trigger id of property failed");
+		if (C.length !== 3) throw Error("unwrap trigger id of property failed");
 		return {
 			type: w,
 			propertyId: C[1],
@@ -10375,7 +10393,7 @@ var PromiseManager = class {
 		isEqual_default(w, D) || (setField(E, C, w), this.hooks.onElementPropertyChange(E.basic.id, C, w, D), await nextTick());
 	}
 	isValidOfElementSlotProperty(e) {
-		let { elementKey: C, slotKey: w, propertyKey: T } = unwrapPropertyKeyOfElementSlot(e), E = elements[C];
+		let { elementKey: C, slotKey: w, propertyKey: T } = unwrapPropertyKeyOfElementSlot(e), E = getElement(C);
 		if (!E || !E.slots) return !1;
 		let D = E.slots.find((e) => e.key === w);
 		return !(!D || !D.properties || !D.properties.find((e) => e.key === T));
@@ -10389,7 +10407,7 @@ var PromiseManager = class {
 		this.eventBus.emit(`${E}/set`, C), await nextTick();
 	}
 	isValidOfMultipleElementSlotProperty(e) {
-		let { elementKey: C, slotKey: w, propertyKey: T } = unwrapPropertyKeyOfElementSlot(e), E = elements[C];
+		let { elementKey: C, slotKey: w, propertyKey: T } = unwrapPropertyKeyOfElementSlot(e), E = getElement(C);
 		if (!E || !E.slots) return !1;
 		let D = E.slots.find((e) => e.key === w);
 		return !(!D || !D.multiple || !D.properties || !D.properties.find((e) => e.key === T));
@@ -10509,7 +10527,8 @@ function useSandbox(e, C, w, E, D, O, k) {
 			}
 			await L.callFunctionAsync("__triggerEventV1__", makeEventId("elementPropertyChangeEvent", e, toDotString(C)), "", w, E ?? w), O.value?.code.reactivity && triggerReactivity(L, O.value.code.reactivity, makeTriggerId({
 				type: "property",
-				propertyId: toDotString(C)
+				propertyId: toDotString(C),
+				spec: ""
 			}), w, E);
 		}
 	}
@@ -10524,19 +10543,22 @@ function useSandbox(e, C, w, E, D, O, k) {
 	async function W(e, C, w) {
 		L.vm && O.value?.code.reactivity && triggerReactivity(L, O.value.code.reactivity, makeTriggerId({
 			type: "property",
-			propertyId: e
+			propertyId: e,
+			spec: ""
 		}), C, w);
 	}
 	async function G(e, C, w, T) {
 		L.vm && O.value?.code.reactivity && triggerReactivity(L, O.value.code.reactivity, makeTriggerId({
 			type: "property",
-			propertyId: C
+			propertyId: C,
+			spec: ""
 		}), w, T);
 	}
 	async function K(e, C, w) {
 		L.vm && (await L.callFunctionAsync("__triggerEventV1__", makeEventId("customPropertyChangeEvent", "globality", e), "", C, w ?? C), O.value?.code.reactivity && triggerReactivity(L, O.value.code.reactivity, makeTriggerId({
 			type: "property",
-			propertyId: e
+			propertyId: e,
+			spec: ""
 		}), C, w), await L.parent.callFunctionAsync("__triggerEventV1__", makeEventId("refPropertyChangeEvent", L.nodeId, e), "", C, w ?? C), await L.parent.callFunctionAsync("__triggerEventV1__", makeEventId("multipleRefPropertyChangeEvent", L.nodeId, e), "", C, w ?? C));
 	}
 	async function q(e, C, w) {
@@ -10569,4 +10591,4 @@ async function loadLocaleMessageRuntime(e) {
 		"./locales/zhHans/index.ts": () => import("./zhHans.fnhe4fpm.js")
 	}, `./locales/${e}/index.ts`, 4)).default;
 }
-export { addIndent, ambientLightV1, badgeV1, barChartV1, boxGeometryV1, breakpoints, btnGroupV1, btnToggleV1, btnV1, calcBreakpoint, cardV1, checkboxV1, chipGroupV1, chipV1, colorPickerV1, comboboxV1, compTypes, containerV1, dataStringify, dataTableV1, datePickerV1, dialogV1, directionalLightV1, duplicateNodePair, duplicateNodePairs, elementKeys, elements, fileInputV1, finalProperties, flexLayoutEntryV1, flexLayoutV1, formV1, fromDotString, genId, getBreakpointProp, getField, getImplementMethodName, getIndexOfBreakpoint, getNodeLite, getPropertyDefault, getTag, globalityV1, groupV1, hasComp, hasSlot, iconV1, initNode, initProperties, injectDark, injectData, injectDepends, injectDevice, injectEnv, injectId, injectMeta, injectMode, injectNode, injectOrg, injectRuntime, injectSandbox, injectType, isCircularReference, isExecutableMode, isLeafOfPropertyKeys, isPercentStr, isPixelStr, keyboardControlsV1, lineChartV1, loadLocaleMessageRuntime, makeEventId, makeEventKeyOfCustomSlot, makeEventKeyOfElementSlot, makeMethodId, makeMethodKeyOfCustomSlot, makeMethodKeyOfElementSlot, makePropertyId, makePropertyKeyOfCustomSlot, makePropertyKeyOfElementSlot, makeSlotId, makeTriggerId, mapControlsV1, menuV1, meshBasicMaterialV1, meshV1, metaStringify, multipleRefV1, multipleSlotV1, numberInputV1, orbitControlsV1, orthographicCameraV1, pageTypes, paginationV1, parseData, parseMeta, parsePercentStr, parsePixelStr, perspectiveCameraV1, pkgs, pointLightV1, provideDark, provideData, provideDepends, provideDevice, provideEnv, provideId, provideMeta, provideMode, provideNode, provideOrg, provideRuntime, provideSandbox, provideType, radioGroupV1, radioV1, rangeSliderV1, ratingV1, referenceV1, regElement, renderSwitchV1, reverseBreakpoints, selectV1, setField, sliderV1, slotV1, spawnNode, sphereGeometryV1, spotLightV1, stepperHeaderV1, stepperItemV1, stepperV1, stepperWindowItemV1, stepperWindowV1, switchV1, tabV1, tabsV1, textFieldV1, textV1, textareaV1, timelineItemV1, timelineV1, toDotString, toEventName, toMethodName, toNodeLite, toPropertyName, triggerReactivity, unwrapEventId, unwrapEventKeyOfCustomSlot, unwrapEventKeyOfElementSlot, unwrapMethodId, unwrapMethodKeyOfCustomSlot, unwrapMethodKeyOfElementSlot, unwrapPropertyId, unwrapPropertyKeyOfCustomSlot, unwrapPropertyKeyOfElementSlot, unwrapSlotId, unwrapTriggerId, useDepend, useRuntime, useSandbox, useTheme, windowItemV1, windowV1 };
+export { addIndent, ambientLightV1, badgeV1, barChartV1, boxGeometryV1, breakpoints, btnGroupV1, btnToggleV1, btnV1, calcBreakpoint, cardV1, checkboxV1, chipGroupV1, chipV1, colorPickerV1, comboboxV1, compTypes, containerV1, dataStringify, dataTableV1, datePickerV1, dialogV1, directionalLightV1, duplicateNodePair, duplicateNodePairs, elementKeys, fileInputV1, finalProperties, flexLayoutEntryV1, flexLayoutV1, formV1, fromDotString, genId, getAllElements, getBreakpointProp, getElement, getElementMust, getField, getImplementMethodName, getIndexOfBreakpoint, getNodeLite, getProperties, getPropertyDefault, getTag, globalityV1, groupV1, hasComp, hasSlot, iconV1, initNode, initProperties, injectDark, injectData, injectDepends, injectDevice, injectEnv, injectId, injectMeta, injectMode, injectNode, injectOrg, injectRuntime, injectSandbox, injectType, isCircularReference, isExecutableMode, isLeafOfPropertyKeys, isPercentStr, isPixelStr, keyboardControlsV1, lineChartV1, loadLocaleMessageRuntime, makeEventId, makeEventKeyOfCustomSlot, makeEventKeyOfElementSlot, makeMethodId, makeMethodKeyOfCustomSlot, makeMethodKeyOfElementSlot, makePropertyId, makePropertyKeyOfCustomSlot, makePropertyKeyOfElementSlot, makeSlotId, makeTriggerId, mapControlsV1, menuV1, meshBasicMaterialV1, meshV1, metaStringify, multipleRefV1, multipleSlotV1, numberInputV1, orbitControlsV1, orthographicCameraV1, pageTypes, paginationV1, parseData, parseMeta, parsePercentStr, parsePixelStr, perspectiveCameraV1, pkgs, pointLightV1, provideDark, provideData, provideDepends, provideDevice, provideEnv, provideId, provideMeta, provideMode, provideNode, provideOrg, provideRuntime, provideSandbox, provideType, radioGroupV1, radioV1, rangeSliderV1, ratingV1, referenceV1, regElement, renderSwitchV1, reverseBreakpoints, selectV1, setField, sliderV1, slotV1, spawnNode, sphereGeometryV1, spotLightV1, stepperHeaderV1, stepperItemV1, stepperV1, stepperWindowItemV1, stepperWindowV1, switchV1, tabV1, tabsV1, textFieldV1, textV1, textareaV1, timelineItemV1, timelineV1, toDotString, toEventName, toMethodName, toNodeLite, toPropertyName, triggerReactivity, unwrapEventId, unwrapEventKeyOfCustomSlot, unwrapEventKeyOfElementSlot, unwrapMethodId, unwrapMethodKeyOfCustomSlot, unwrapMethodKeyOfElementSlot, unwrapPropertyId, unwrapPropertyKeyOfCustomSlot, unwrapPropertyKeyOfElementSlot, unwrapSlotId, unwrapTriggerId, useDepend, useRuntime, useSandbox, useTheme, windowItemV1, windowV1 };