@kp-ui/lowcode-pc-v2 0.0.13 → 0.0.16

package/assets/styles/style.css

@@ -34,7 +34,7 @@
 @tailwind components;
 @tailwind utilities;
 /* 调试面板样式 */
-.debug-panel[data-v-db68aa3b] {
+.debug-panel[data-v-2ffcff6c] {
   position: absolute;
   top: 0;
   right: 0;
@@ -49,18 +49,18 @@
   border-top-left-radius: 8px;
   border-bottom-left-radius: 8px;
 }
-.debug-panel[data-v-db68aa3b] .jv-container .jv-code {
+.debug-panel[data-v-2ffcff6c] .jv-container .jv-code {
   padding: 0;
 }
-.debug-panel.collapsed[data-v-db68aa3b] {
+.debug-panel.collapsed[data-v-2ffcff6c] {
   transform: translateX(400px);
 }
-.debug-panel.collapsed .debug-toggle[data-v-db68aa3b] {
+.debug-panel.collapsed .debug-toggle[data-v-2ffcff6c] {
   left: -40px;
   border-radius: 8px 0 0 8px;
   width: 40px;
 }
-.debug-panel .debug-toggle[data-v-db68aa3b] {
+.debug-panel .debug-toggle[data-v-2ffcff6c] {
   position: absolute;
   left: -40px;
   top: 20px;
@@ -79,20 +79,20 @@
   padding: 8px 0;
   user-select: none;
 }
-.debug-panel .debug-content[data-v-db68aa3b] {
+.debug-panel .debug-content[data-v-2ffcff6c] {
   flex: 1;
   overflow: auto;
   padding: 16px;
   background-color: #f5f7fa;
 }
-.debug-panel .debug-content .debug-section[data-v-db68aa3b] {
+.debug-panel .debug-content .debug-section[data-v-2ffcff6c] {
   margin-bottom: 24px;
   background-color: #fff;
   border-radius: 8px;
   padding: 16px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
 }
-.debug-panel .debug-content .debug-section h3[data-v-db68aa3b] {
+.debug-panel .debug-content .debug-section h3[data-v-2ffcff6c] {
   margin: 0 0 12px 0;
   font-size: 14px;
   font-weight: 600;
@@ -100,18 +100,18 @@
   border-bottom: 1px solid #e8e8e8;
   padding-bottom: 8px;
 }
-.debug-panel .debug-content .debug-section .empty-state[data-v-db68aa3b] {
+.debug-panel .debug-content .debug-section .empty-state[data-v-2ffcff6c] {
   color: #999;
   font-size: 12px;
   text-align: center;
   padding: 20px;
 }
-.debug-panel .debug-content .debug-section .widget-list[data-v-db68aa3b] {
+.debug-panel .debug-content .debug-section .widget-list[data-v-2ffcff6c] {
   display: flex;
   flex-direction: column;
   gap: 2px;
 }
-.debug-panel .debug-content .debug-section .widget-list .widget-item[data-v-db68aa3b] {
+.debug-panel .debug-content .debug-section .widget-list .widget-item[data-v-2ffcff6c] {
   border: 1px solid #e8e8e8;
   border-radius: 4px;
   padding: 2px 4px;
@@ -119,12 +119,12 @@
   background-color: #fafafa;
   cursor: pointer;
 }
-.debug-panel .debug-content .debug-section .widget-list .widget-item .widget-key[data-v-db68aa3b] {
+.debug-panel .debug-content .debug-section .widget-list .widget-item .widget-key[data-v-2ffcff6c] {
   font-weight: 600;
   color: var(--ant-primary-color);
   font-size: 12px;
 }
-.debug-panel .debug-content pre[data-v-db68aa3b] {
+.debug-panel .debug-content pre[data-v-2ffcff6c] {
   margin: 0;
   font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
   font-size: 12px;
@@ -208,7 +208,7 @@
 }
 .ant-form-item .custom-label[data-v-254940bd] .svg-icon {
   flex: 0 0 auto;
-}.html-text-widget[data-v-af85686c] {
+}.html-text-widget--empty[data-v-c062aa8a] {
   padding: 8px 0;
 }.button-list-container[data-v-37429548] {
   flex: 1;
@@ -472,61 +472,60 @@
 }
 .vf-box-widget .vf-box-content[data-v-d52cfec5] {
   min-height: 60px;
-}.collapse-container[data-v-a9c6fa96] {
+}.collapse-container[data-v-92bfc73d] {
   display: flex;
   margin: 2px;
   width: 100%;
   flex-direction: column;
 }
-.collapse-container .form-widget-list[data-v-a9c6fa96] {
+.collapse-container .form-widget-list[data-v-92bfc73d] {
   min-height: 28px;
 }
-.collapse-container[data-v-a9c6fa96] .header-right .form-widget-list {
+.collapse-container[data-v-92bfc73d] .header-right .form-widget-list {
   min-width: 200px;
 }
-.tpf-like-collapse[data-v-a9c6fa96] {
+.tpf-like-collapse[data-v-92bfc73d] {
   width: 100%;
   background: transparent;
   border: 0;
   padding: 5px;
   box-sizing: border-box;
 }
-.tpf-like-collapse[data-v-a9c6fa96] .ant-collapse-item {
+.tpf-like-collapse[data-v-92bfc73d] .ant-collapse-item {
   border: 0;
   background: transparent;
   padding: 5px;
 }
-.tpf-like-collapse[data-v-a9c6fa96] .ant-collapse-header {
+.tpf-like-collapse[data-v-92bfc73d] .ant-collapse-header {
   padding: 10px 10px 10px 0 !important;
   box-sizing: border-box;
   background: #f7f8fa;
   align-items: center !important;
 }
-.tpf-like-collapse[data-v-a9c6fa96] .ant-collapse-header-text {
+.tpf-like-collapse[data-v-92bfc73d] .ant-collapse-header-text {
   min-width: 0;
 }
-.tpf-like-collapse[data-v-a9c6fa96] .ant-collapse-extra {
+.tpf-like-collapse[data-v-92bfc73d] .ant-collapse-extra {
   min-height: 30px;
 }
-.tpf-like-collapse[data-v-a9c6fa96] .ant-collapse-content {
+.tpf-like-collapse[data-v-92bfc73d] .ant-collapse-content {
   border: 0;
   background: transparent;
-  padding: 16px;
 }
-.tpf-like-collapse[data-v-a9c6fa96] .ant-collapse-content-box {
-  padding: 0;
+.tpf-like-collapse[data-v-92bfc73d] .ant-collapse-content .ant-collapse-content-box {
+  padding: 16px;
   border-radius: 6px;
   overflow: hidden;
   background-color: #fff;
 }
-.tpf-like-collapse .tpf-like-collapse-header-content[data-v-a9c6fa96] {
+.tpf-like-collapse .tpf-like-collapse-header-content[data-v-92bfc73d] {
   display: inline-flex;
   align-items: center;
   gap: 5px;
   min-width: 0;
   padding-left: 10px;
 }
-.tpf-like-collapse .tpf-like-collapse-header-content[data-v-a9c6fa96]::before {
+.tpf-like-collapse .tpf-like-collapse-header-content[data-v-92bfc73d]::before {
   content: '';
   background-color: var(--ant-primary-color);
   width: 4px;
@@ -536,22 +535,22 @@
   left: 0;
   transform: translateY(-50%);
 }
-.tpf-like-collapse .tpf-like-collapse-title[data-v-a9c6fa96] {
+.tpf-like-collapse .tpf-like-collapse-title[data-v-92bfc73d] {
   font-weight: 500;
   color: #1f2329;
   line-height: 24px;
   font-size: 16px;
 }
-.tpf-like-collapse .collapse-right[data-v-a9c6fa96] {
+.tpf-like-collapse .collapse-right[data-v-92bfc73d] {
   min-width: 200px;
   min-height: 30px;
   display: flex;
   justify-content: end;
 }
-.tpf-like-collapse .collapse-right[data-v-a9c6fa96] .ant-form-item {
+.tpf-like-collapse .collapse-right[data-v-92bfc73d] .ant-form-item {
   margin-bottom: 0;
 }
-.tpf-like-collapse[data-v-a9c6fa96] .tpf-collapse-content-wrapper {
+.tpf-like-collapse[data-v-92bfc73d] .tpf-collapse-content-wrapper {
   overflow: hidden;
   background-color: #fff;
 }
@@ -597,13 +596,14 @@
   border: 1px dashed #d9d9d9;
   border-radius: 4px;
   background: #fafafa;
-}.page-template-widget[data-v-dc2a06fa] {
+}.page-template-widget[data-v-61732f19] {
   min-height: 100%;
 }
-.page-template-widget[data-v-dc2a06fa] .addInfoLayout-content {
-  padding: 10px;
+.page-template-widget[data-v-61732f19] .addInfoLayout-content {
+  border: 10px solid #ebebeb;
+  background: var(--0c16b4be);
 }
-.page-template-widget[data-v-dc2a06fa] .addInfoLayout-footer .ant-form-item {
+.page-template-widget[data-v-61732f19] .addInfoLayout-footer .ant-form-item {
   margin-bottom: 0;
 }
 /*$vite$:1*/

package/core/src/components/common/render/Debugger.js

@@ -2,6 +2,6 @@ import _plugin_vue_export_helper_default from "../../../../../_virtual/_plugin-v
 import Debugger_vue_vue_type_script_setup_true_lang_default from "./Debugger.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                         */
 //#region ../core/src/components/common/render/Debugger.vue
-var Debugger_default = /* @__PURE__ */ _plugin_vue_export_helper_default(Debugger_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-db68aa3b"]]);
+var Debugger_default = /* @__PURE__ */ _plugin_vue_export_helper_default(Debugger_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-2ffcff6c"]]);
 //#endregion
 export { Debugger_default as default };

package/core/src/components/common/render/Debugger.vue_vue_type_script_setup_true_lang.js

@@ -1,12 +1,12 @@
-import { Fragment, createElementBlock, createElementVNode, createVNode, defineComponent, inject, normalizeClass, openBlock, ref, renderList, toDisplayString, unref, useModel } from "vue";
-import JsonViewer from "vue-json-viewer";
+import { Fragment, computed, createElementBlock, createElementVNode, defineComponent, inject, normalizeClass, openBlock, ref, renderList, toDisplayString, unref, useModel } from "vue";
 //#region ../core/src/components/common/render/Debugger.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "debug-content" };
 var _hoisted_2 = { class: "debug-section" };
-var _hoisted_3 = { class: "debug-section" };
-var _hoisted_4 = { class: "widget-list" };
-var _hoisted_5 = ["onClick"];
-var _hoisted_6 = { class: "widget-key" };
+var _hoisted_3 = { class: "json-viewer" };
+var _hoisted_4 = { class: "debug-section" };
+var _hoisted_5 = { class: "widget-list" };
+var _hoisted_6 = ["onClick"];
+var _hoisted_7 = { class: "widget-key" };
 var Debugger_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "Debugger",
 	props: {
@@ -19,22 +19,28 @@ var Debugger_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defin
 	emits: ["update:visible"],
 	setup(__props) {
 		const debugVisible = useModel(__props, "visible");
-		const formDataModel = inject("formData", {});
+		const injectedFormDataModel = inject("formData", ref({}));
+		const formDataModel = computed(() => {
+			const data = unref(injectedFormDataModel) || {};
+			try {
+				return JSON.parse(JSON.stringify(data));
+			} catch (_unused) {
+				return data;
+			}
+		});
+		const formDataJson = computed(() => JSON.stringify(formDataModel.value, null, 2));
 		const widgetRefList = inject("refList", ref(/* @__PURE__ */ new Map()));
 		inject("formConfig", ref({}));
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", { class: normalizeClass(["debug-panel", { collapsed: !debugVisible.value }]) }, [createElementVNode("div", {
 				class: "debug-toggle",
 				onClick: _cache[0] || (_cache[0] = ($event) => debugVisible.value = !debugVisible.value)
-			}, toDisplayString(debugVisible.value ? "收起" : "调试"), 1), createElementVNode("div", _hoisted_1, [createElementVNode("div", _hoisted_2, [_cache[1] || (_cache[1] = createElementVNode("h3", null, "Form Data Model", -1)), createVNode(unref(JsonViewer), {
-				value: unref(formDataModel),
-				"expand-depth": 5
-			}, null, 8, ["value"])]), createElementVNode("div", _hoisted_3, [createElementVNode("h3", null, "Widget Ref List (" + toDisplayString(unref(widgetRefList).size) + " widgets)", 1), createElementVNode("div", _hoisted_4, [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(widgetRefList), ([key, value]) => {
+			}, toDisplayString(debugVisible.value ? "收起" : "调试"), 1), createElementVNode("div", _hoisted_1, [createElementVNode("div", _hoisted_2, [_cache[1] || (_cache[1] = createElementVNode("h3", null, "Form Data Model", -1)), createElementVNode("pre", _hoisted_3, toDisplayString(formDataJson.value), 1)]), createElementVNode("div", _hoisted_4, [createElementVNode("h3", null, "Widget Ref List (" + toDisplayString(unref(widgetRefList).size) + " widgets)", 1), createElementVNode("div", _hoisted_5, [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(widgetRefList), ([key, value]) => {
 				return openBlock(), createElementBlock("div", {
 					onClick: ($event) => console.log(value),
 					key,
 					class: "widget-item"
-				}, [createElementVNode("div", _hoisted_6, toDisplayString(key), 1)], 8, _hoisted_5);
+				}, [createElementVNode("div", _hoisted_7, toDisplayString(key), 1)], 8, _hoisted_6);
 			}), 128))])])])], 2);
 		};
 	}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kp-ui/lowcode-pc-v2",
-  "version": "0.0.13",
+  "version": "0.0.16",
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"

package/src/hooks/useTableWidget.js

@@ -191,6 +191,17 @@ function useTableWidget({ widget, fieldModel, designState = false }) {
 	};
 	const rowKey = computed(() => widget.props.rowKey);
 	const tableData = computed(() => localData.value);
+	const rowSelection = computed(() => {
+		var _current$preserveSele;
+		const current = widget.props.rowSelection || {};
+		const legacy = widget.rowSelection || {};
+		return {
+			...current,
+			preserveSelectedRowKeys: (_current$preserveSele = current.preserveSelectedRowKeys) !== null && _current$preserveSele !== void 0 ? _current$preserveSele : legacy.preserveSelectedRowKeys,
+			checkMethod: current.checkMethod || legacy.checkMethod,
+			onChange: current.onChange || legacy.onChange
+		};
+	});
 	const syncTableValue = (value) => {
 		var _tableRef$value;
 		const tableValue = normalizeTableData(value);
@@ -199,7 +210,7 @@ function useTableWidget({ widget, fieldModel, designState = false }) {
 		(_tableRef$value = tableRef.value) === null || _tableRef$value === void 0 || _tableRef$value.loadData(tableValue);
 	};
 	const tableProps = computed(() => {
-		var _widget$props$rowSele;
+		var _rowSelection$value;
 		const { border = false, lineHeight = 50, colorRow = false, showPagination = true, treeConfig } = widget.props;
 		let _treeConfig = {};
 		if (treeConfig === null || treeConfig === void 0 ? void 0 : treeConfig.enabled) _treeConfig = {
@@ -223,12 +234,12 @@ function useTableWidget({ widget, fieldModel, designState = false }) {
 			},
 			customConfig: { storage: !designState },
 			checkboxConfig: {
-				reserve: (_widget$props$rowSele = widget.props.rowSelection) === null || _widget$props$rowSele === void 0 ? void 0 : _widget$props$rowSele.preserveSelectedRowKeys,
+				reserve: (_rowSelection$value = rowSelection.value) === null || _rowSelection$value === void 0 ? void 0 : _rowSelection$value.preserveSelectedRowKeys,
 				isShiftKey: (treeConfig === null || treeConfig === void 0 ? void 0 : treeConfig.enabled) ? true : false,
 				checkMethod: (_data) => {
-					var _widget$props$rowSele2;
+					var _rowSelection$value2;
 					return executeFunction({
-						functionBody: (_widget$props$rowSele2 = widget.props.rowSelection) === null || _widget$props$rowSele2 === void 0 ? void 0 : _widget$props$rowSele2.checkMethod,
+						functionBody: (_rowSelection$value2 = rowSelection.value) === null || _rowSelection$value2 === void 0 ? void 0 : _rowSelection$value2.checkMethod,
 						params: _data,
 						keys: ["row"]
 					});
@@ -274,8 +285,9 @@ function useTableWidget({ widget, fieldModel, designState = false }) {
 		});
 	};
 	const onCheckboxChange = (selectedRowInfo) => {
+		var _rowSelection$value3;
 		executeFunction({
-			functionBody: widget.props.rowSelection.onChange,
+			functionBody: (_rowSelection$value3 = rowSelection.value) === null || _rowSelection$value3 === void 0 ? void 0 : _rowSelection$value3.onChange,
 			keys: ["selectedRowKeys", "selectedRows"],
 			params: selectedRowInfo
 		});

package/src/widgets/base/html/index.js

@@ -2,6 +2,6 @@ import _plugin_vue_export_helper_default from "../../../../_virtual/_plugin-vue_
 import index_vue_vue_type_script_setup_true_lang_default from "./index.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                      */
 //#region src/widgets/base/html/index.vue
-var html_default = /* @__PURE__ */ _plugin_vue_export_helper_default(index_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-af85686c"]]);
+var html_default = /* @__PURE__ */ _plugin_vue_export_helper_default(index_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-c062aa8a"]]);
 //#endregion
 export { html_default as default };

package/src/widgets/base/html/index.vue_vue_type_script_setup_true_lang.js

@@ -2,7 +2,7 @@ import { ComponentNameEnum } from "../../../../core/src/constants/WidgetTypeEnum
 import { useField } from "../../../../core/src/hooks/useField.js";
 import { WidgetType, getWidgetName } from "../../widgetTypes.js";
 import form_item_wrapper_default from "../../wrapper/form-item-wrapper.js";
-import { createBlock, createElementVNode, defineComponent, normalizeClass, openBlock, withCtx } from "vue";
+import { computed, createBlock, createElementVNode, defineComponent, normalizeClass, openBlock, withCtx } from "vue";
 //#region src/widgets/base/html/index.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["innerHTML"];
 var index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
@@ -13,12 +13,16 @@ var index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
 	props: { widget: {} },
 	setup(__props) {
 		useField(__props.widget);
+		const isEmpty = computed(() => {
+			var _props$widget$props;
+			return !(((_props$widget$props = __props.widget.props) === null || _props$widget$props === void 0 ? void 0 : _props$widget$props.htmlContent) || "").replace(/<[^>]*>/g, "").replace(/&nbsp;/g, "").trim();
+		});
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(form_item_wrapper_default, { widget: _ctx.widget }, {
 				default: withCtx(() => {
 					var _ctx$widget$props, _ctx$widget$props2;
 					return [createElementVNode("div", {
-						class: normalizeClass(["html-text-widget", (_ctx$widget$props = _ctx.widget.props) === null || _ctx$widget$props === void 0 ? void 0 : _ctx$widget$props.customClass]),
+						class: normalizeClass(["html-text-widget", [(_ctx$widget$props = _ctx.widget.props) === null || _ctx$widget$props === void 0 ? void 0 : _ctx$widget$props.customClass, { "html-text-widget--empty": isEmpty.value }]]),
 						innerHTML: (_ctx$widget$props2 = _ctx.widget.props) === null || _ctx$widget$props2 === void 0 ? void 0 : _ctx$widget$props2.htmlContent
 					}, null, 10, _hoisted_1)];
 				}),

package/src/widgets/containers/collapse/index-render.js

@@ -3,6 +3,6 @@ import index_render_vue_vue_type_script_setup_true_lang_default from "./index-re
 /* empty css                                                             */
 /* empty css                                                             */
 //#region src/widgets/containers/collapse/index-render.vue
-var index_render_default = /* @__PURE__ */ _plugin_vue_export_helper_default(index_render_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-a9c6fa96"]]);
+var index_render_default = /* @__PURE__ */ _plugin_vue_export_helper_default(index_render_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-92bfc73d"]]);
 //#endregion
 export { index_render_default as default };

package/src/widgets/containers/flex/schema.js

@@ -15,7 +15,6 @@ var Flex = {
 	children: [],
 	props: {
 		name: "",
-		label: "flex",
 		hidden: false,
 		customClass: [],
 		heightMode: "inherit",

package/src/widgets/template/SecondaryPage/index-render.js

@@ -2,6 +2,6 @@ import _plugin_vue_export_helper_default from "../../../../_virtual/_plugin-vue_
 import index_render_vue_vue_type_script_setup_true_lang_default from "./index-render.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                             */
 //#region src/widgets/template/SecondaryPage/index-render.vue
-var index_render_default = /* @__PURE__ */ _plugin_vue_export_helper_default(index_render_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-dc2a06fa"]]);
+var index_render_default = /* @__PURE__ */ _plugin_vue_export_helper_default(index_render_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-61732f19"]]);
 //#endregion
 export { index_render_default as default };

package/src/widgets/template/SecondaryPage/index-render.vue_vue_type_script_setup_true_lang.js

@@ -2,7 +2,7 @@ import RenderWidgetList_default from "../../../../core/src/components/common/ren
 import { ComponentNameEnum } from "../../../../core/src/constants/WidgetTypeEnum.js";
 import { useField } from "../../../../core/src/hooks/useField.js";
 import { TOP_LEVEL_WIDGETS, WidgetType, getWidgetName } from "../../widgetTypes.js";
-import { createBlock, createVNode, defineComponent, openBlock, unref, withCtx } from "vue";
+import { computed, createBlock, createSlots, createVNode, defineComponent, openBlock, unref, useCssVars, withCtx } from "vue";
 import { TpfAddInfoLayout } from "tmgc2-share";
 //#region src/widgets/template/SecondaryPage/index-render.vue?vue&type=script&setup=true&lang.ts
 var index_render_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
@@ -12,19 +12,28 @@ var index_render_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ d
 	__name: "index-render",
 	props: { widget: {} },
 	setup(__props, { expose: __expose }) {
+		useCssVars((_ctx) => ({ "0c16b4be": contentBackground.value }));
 		const { defineExposed, getVfCtx } = useField(__props.widget);
+		const title = computed(() => {
+			var _props$widget$props;
+			return (_props$widget$props = __props.widget.props) === null || _props$widget$props === void 0 ? void 0 : _props$widget$props.title;
+		});
+		const contentBackground = computed(() => {
+			var _props$widget$props2;
+			return ((_props$widget$props2 = __props.widget.props) === null || _props$widget$props2 === void 0 ? void 0 : _props$widget$props2.color) || "#fafafa";
+		});
 		__expose({ ...defineExposed });
 		return (_ctx, _cache) => {
-			var _unref2;
+			var _unref2, _ctx$widget$titleChil;
 			return openBlock(), createBlock(unref(TpfAddInfoLayout), {
 				class: "page-template-widget",
-				title: _ctx.widget.props.title,
+				title: title.value,
 				type: (_unref2 = unref(getVfCtx)()) === null || _unref2 === void 0 ? void 0 : _unref2.type
-			}, {
+			}, createSlots({
 				footerLeft: withCtx(() => [createVNode(unref(RenderWidgetList_default), {
 					"not-allow-types": unref(TOP_LEVEL_WIDGETS),
 					list: _ctx.widget.footerLeftChildren,
-					"onUpdate:list": _cache[1] || (_cache[1] = ($event) => _ctx.widget.footerLeftChildren = $event),
+					"onUpdate:list": _cache[2] || (_cache[2] = ($event) => _ctx.widget.footerLeftChildren = $event),
 					parentWidget: _ctx.widget
 				}, null, 8, [
 					"not-allow-types",
@@ -34,7 +43,7 @@ var index_render_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ d
 				footerRight: withCtx(() => [createVNode(unref(RenderWidgetList_default), {
 					"not-allow-types": unref(TOP_LEVEL_WIDGETS),
 					list: _ctx.widget.footerRightChildren,
-					"onUpdate:list": _cache[2] || (_cache[2] = ($event) => _ctx.widget.footerRightChildren = $event),
+					"onUpdate:list": _cache[3] || (_cache[3] = ($event) => _ctx.widget.footerRightChildren = $event),
 					parentWidget: _ctx.widget
 				}, null, 8, [
 					"not-allow-types",
@@ -45,15 +54,28 @@ var index_render_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ d
 					class: "page-template-content",
 					"not-allow-types": unref(TOP_LEVEL_WIDGETS),
 					list: _ctx.widget.children,
-					"onUpdate:list": _cache[0] || (_cache[0] = ($event) => _ctx.widget.children = $event),
+					"onUpdate:list": _cache[1] || (_cache[1] = ($event) => _ctx.widget.children = $event),
 					parentWidget: _ctx.widget
 				}, null, 8, [
 					"not-allow-types",
 					"list",
 					"parentWidget"
 				])]),
-				_: 1
-			}, 8, ["title", "type"]);
+				_: 2
+			}, [((_ctx$widget$titleChil = _ctx.widget.titleChildren) === null || _ctx$widget$titleChil === void 0 ? void 0 : _ctx$widget$titleChil.length) ? {
+				name: "title",
+				fn: withCtx(() => [createVNode(unref(RenderWidgetList_default), {
+					"not-allow-types": unref(TOP_LEVEL_WIDGETS),
+					list: _ctx.widget.titleChildren,
+					"onUpdate:list": _cache[0] || (_cache[0] = ($event) => _ctx.widget.titleChildren = $event),
+					parentWidget: _ctx.widget
+				}, null, 8, [
+					"not-allow-types",
+					"list",
+					"parentWidget"
+				])]),
+				key: "0"
+			} : void 0]), 1032, ["title", "type"]);
 		};
 	}
 });

package/src/widgets/template/SecondaryPage/schema.js

@@ -10,6 +10,7 @@ var SecondaryPage = {
 		height: "100%"
 	},
 	events: { onMounted: "" },
+	titleChildren: [],
 	children: [],
 	footerLeftChildren: [],
 	footerRightChildren: [{