@tmagic/editor 1.8.0-beta.11 → 1.8.0-beta.12

package/dist/es/Editor.vue_vue_type_script_setup_true_lang.js

@@ -3,20 +3,20 @@ import history_default from "./services/history.js";
 import storage_default from "./services/storage.js";
 import editor_default from "./services/editor.js";
 import ui_default from "./services/ui.js";
+import codeBlock_default from "./services/codeBlock.js";
+import dataSource_default from "./services/dataSource.js";
+import events_default from "./services/events.js";
 import Framework_default from "./layouts/Framework.js";
 import NavMenu_default from "./layouts/NavMenu.js";
+import { ENABLE_PROPS_FORM_VALIDATE, defaultEditorProps } from "./editorProps.js";
 import PropsPanel_default from "./layouts/props-panel/PropsPanel.js";
 import keybinding_config_default from "./utils/keybinding-config.js";
 import Sidebar_default from "./layouts/sidebar/Sidebar.js";
 import Workspace_default from "./layouts/workspace/Workspace.js";
-import codeBlock_default from "./services/codeBlock.js";
 import componentList_default from "./services/componentList.js";
-import dataSource_default from "./services/dataSource.js";
 import dep_default from "./services/dep.js";
-import events_default from "./services/events.js";
 import keybinding_default from "./services/keybinding.js";
 import stageOverlay_default from "./services/stageOverlay.js";
-import { defaultEditorProps } from "./editorProps.js";
 import { initServiceEvents, initServiceState } from "./initService.js";
 import { createBlock, createVNode, defineComponent, mergeDefaults, openBlock, provide, ref, renderSlot, unref, withCtx } from "vue";
 import { EventEmitter } from "events";
@@ -56,6 +56,7 @@ var Editor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCom
 		disabledPageFragment: { type: Boolean },
 		disabledFlashTip: { type: Boolean },
 		disabledStageOverlay: { type: Boolean },
+		enablePropsFormValidate: { type: Boolean },
 		disabledShowSrc: { type: Boolean },
 		disabledDataSource: { type: Boolean },
 		disabledCodeBlock: { type: Boolean },
@@ -129,6 +130,8 @@ var Editor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCom
 		provide("services", services);
 		provide("codeOptions", props.codeOptions);
 		provide("stageOptions", stageOptions);
+		/** 是否启用「属性配置表单校验」联动能力，供 PropsPanel / FormPanel 判断校验失败时是否仍更新节点并记录错误 */
+		provide(ENABLE_PROPS_FORM_VALIDATE, props.enablePropsFormValidate ?? false);
 		/**
 		* 把顶层 `extendFormState` 提供给非 PropsPanel 链路上的组件使用（例如历史差异对话框 HistoryDiffDialog
 		* 内部的 CompareForm）。这样所有依赖业务上下文的表单 filterFunction 都能拿到一致的扩展状态，

package/dist/es/components/CodeBlockEditor.vue_vue_type_script_setup_true_lang.js

@@ -120,6 +120,7 @@ var CodeBlockEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 			changedValue.value = void 0;
 		};
 		const { boxPosition, calcBoxPosition } = useNextFloatBoxPosition(uiService, inject("parentFloating", ref(null)));
+		const frameworkWidth = computed(() => uiService.get("frameworkRect")?.width || 0);
 		watch(boxVisible, (visible) => {
 			nextTick(() => {
 				if (!visible) emit("close");
@@ -145,7 +146,9 @@ var CodeBlockEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 					"onUpdate:width": _cache[2] || (_cache[2] = ($event) => width.value = $event),
 					height: unref(codeBlockEditorHeight),
 					"onUpdate:height": _cache[3] || (_cache[3] = ($event) => isRef(codeBlockEditorHeight) ? codeBlockEditorHeight.value = $event : null),
+					"body-style": { padding: "0 16px" },
 					title: __props.content.name ? `${__props.disabled ? "查看" : "编辑"}${__props.content.name}` : "新增代码",
+					"framework-width": frameworkWidth.value,
 					position: unref(boxPosition),
 					"before-close": beforeClose
 				}, {
@@ -187,6 +190,7 @@ var CodeBlockEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 					"width",
 					"height",
 					"title",
+					"framework-width",
 					"position"
 				]),
 				(openBlock(), createBlock(Teleport, { to: "body" }, [createVNode(unref(TMagicDialog), {

package/dist/es/components/CodeParams.vue_vue_type_script_setup_true_lang.js

@@ -48,7 +48,8 @@ var CodeParams_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 		*/
 		const onParamsChangeHandler = async (v, eventData) => {
 			try {
-				emit("change", await formRef.value?.submitForm(true), eventData);
+				const value = await formRef.value?.submitForm(true);
+				emit("change", value, eventData);
 			} catch (e) {
 				error(e);
 			}

package/dist/es/components/CompareForm.vue_vue_type_script_setup_true_lang.js

@@ -21,6 +21,7 @@ var CompareForm_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 		},
 		baseFormState: {},
 		selfDiffFieldTypes: {},
+		size: {},
 		loadConfig: {},
 		services: {}
 	},
@@ -181,13 +182,15 @@ var CompareForm_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 				"label-width": __props.labelWidth,
 				"extend-state": mergedExtendState,
 				"show-diff": showDiff,
-				"self-diff-field-types": __props.selfDiffFieldTypes
+				"self-diff-field-types": __props.selfDiffFieldTypes,
+				size: __props.size
 			}, null, 8, [
 				"config",
 				"init-values",
 				"last-values",
 				"label-width",
-				"self-diff-field-types"
+				"self-diff-field-types",
+				"size"
 			])) : createCommentVNode("v-if", true)], 4);
 		};
 	}

package/dist/es/components/FloatingBox.vue_vue_type_script_setup_true_lang.js

@@ -1,7 +1,6 @@
-import { useServices } from "../hooks/use-services.js";
 import Icon_default from "./Icon.js";
 import { TMagicButton, useZIndex } from "@tmagic/design";
-import { Teleport, computed, createBlock, createCommentVNode, createElementVNode, createVNode, defineComponent, mergeModels, nextTick, normalizeStyle, onBeforeUnmount, openBlock, provide, ref, renderSlot, toDisplayString, unref, useModel, useTemplateRef, watch, withCtx } from "vue";
+import { Teleport, computed, createBlock, createCommentVNode, createElementVNode, createVNode, defineComponent, mergeModels, mergeProps, nextTick, normalizeStyle, onBeforeUnmount, openBlock, provide, ref, renderSlot, toDisplayString, unref, useModel, useTemplateRef, watch, withCtx } from "vue";
 import { Close } from "@element-plus/icons-vue";
 import VanillaMoveable from "moveable";
 //#region packages/editor/src/components/FloatingBox.vue?vue&type=script&setup=true&lang.ts
@@ -17,6 +16,9 @@ var FloatingBox_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 			top: 0
 		}) },
 		title: { default: "" },
+		bodyStyle: {},
+		initialStyle: { default: () => ({}) },
+		frameworkWidth: { default: 0 },
 		beforeClose: {}
 	}, {
 		"width": { default: 0 },
@@ -49,19 +51,51 @@ var FloatingBox_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 			if (targetEl.value) return targetEl.value.clientHeight - titleHeight.value;
 			return "auto";
 		});
-		const { uiService } = useServices();
-		const frameworkWidth = computed(() => uiService.get("frameworkRect").width || 0);
 		const style = computed(() => {
 			let { left } = props.position;
-			if (width.value) left = left + width.value > frameworkWidth.value ? frameworkWidth.value - width.value : left;
+			const frameworkWidth = props.frameworkWidth || globalThis.window?.innerWidth || 0;
+			if (width.value && frameworkWidth) left = left + width.value > frameworkWidth ? frameworkWidth - width.value : left;
 			return {
 				left: `${left}px`,
 				top: `${props.position.top}px`,
 				width: width.value ? `${width.value}px` : "auto",
-				height: height.value ? `${height.value}px` : "auto"
+				height: height.value ? `${height.value}px` : "auto",
+				...props.initialStyle
 			};
 		});
 		let moveable = null;
+		let dragMask = null;
+		let dragMaskVisible = false;
+		const bindDragMaskSafety = () => {
+			globalThis.window?.addEventListener("pointerup", hideDragMask, true);
+			globalThis.window?.addEventListener("blur", hideDragMask);
+			globalThis.document?.addEventListener("visibilitychange", hideDragMask);
+		};
+		const unbindDragMaskSafety = () => {
+			globalThis.window?.removeEventListener("pointerup", hideDragMask, true);
+			globalThis.window?.removeEventListener("blur", hideDragMask);
+			globalThis.document?.removeEventListener("visibilitychange", hideDragMask);
+		};
+		const showDragMask = () => {
+			if (dragMaskVisible) return;
+			if (!dragMask) {
+				dragMask = globalThis.document.createElement("div");
+				dragMask.className = "m-editor-float-box-drag-mask";
+			}
+			globalThis.document.body.appendChild(dragMask);
+			dragMaskVisible = true;
+			bindDragMaskSafety();
+			const setMaskZIndex = () => {
+				if (dragMask) dragMask.style.zIndex = `${curZIndex.value + 1}`;
+			};
+			setMaskZIndex();
+			nextTick(setMaskZIndex);
+		};
+		const hideDragMask = () => {
+			unbindDragMaskSafety();
+			dragMask?.parentNode?.removeChild(dragMask);
+			dragMaskVisible = false;
+		};
 		const initMoveable = () => {
 			moveable = new VanillaMoveable(globalThis.document.body, {
 				className: "m-editor-floating-box-moveable",
@@ -84,6 +118,10 @@ var FloatingBox_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 					position: "css"
 				}
 			});
+			moveable.on("drag", showDragMask);
+			moveable.on("resize", showDragMask);
+			moveable.on("dragEnd", hideDragMask);
+			moveable.on("resizeEnd", hideDragMask);
 			moveable.on("drag", (e) => {
 				e.target.style.transform = e.transform;
 			});
@@ -96,6 +134,7 @@ var FloatingBox_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 			});
 		};
 		const destroyMoveable = () => {
+			hideDragMask();
 			moveable?.destroy();
 			moveable = null;
 		};
@@ -109,7 +148,10 @@ var FloatingBox_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 					height.value = targetRect.height;
 					initMoveable();
 				}
-				if (titleEl.value) titleHeight.value = titleEl.value.getBoundingClientRect().height;
+				if (titleEl.value) {
+					const titleRect = titleEl.value.getBoundingClientRect();
+					titleHeight.value = titleRect.height;
+				}
 			} else destroyMoveable();
 		}, { immediate: true });
 		onBeforeUnmount(() => {
@@ -135,15 +177,16 @@ var FloatingBox_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 			return visible.value ? (openBlock(), createBlock(Teleport, {
 				key: 0,
 				to: "body"
-			}, [createElementVNode("div", {
+			}, [createElementVNode("div", mergeProps({
 				ref: "target",
-				class: "m-editor-float-box",
-				style: normalizeStyle({
+				class: "m-editor-float-box"
+			}, _ctx.$attrs, {
+				style: {
 					...style.value,
 					zIndex: curZIndex.value
-				}),
+				},
 				onMousedown: nextZIndex
-			}, [createElementVNode("div", _hoisted_1, [renderSlot(_ctx.$slots, "title", {}, () => [createElementVNode("span", null, toDisplayString(__props.title), 1)]), createElementVNode("div", null, [createVNode(unref(TMagicButton), {
+			}), [createElementVNode("div", _hoisted_1, [renderSlot(_ctx.$slots, "title", {}, () => [createElementVNode("span", null, toDisplayString(__props.title), 1)]), createElementVNode("div", null, [createVNode(unref(TMagicButton), {
 				link: "",
 				size: "small",
 				onClick: closeHandler
@@ -152,8 +195,11 @@ var FloatingBox_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 				_: 1
 			})])], 512), createElementVNode("div", {
 				class: "m-editor-float-box-body",
-				style: normalizeStyle({ height: `${bodyHeight.value}px` })
-			}, [renderSlot(_ctx.$slots, "body")], 4)], 36)])) : createCommentVNode("v-if", true);
+				style: normalizeStyle({
+					height: `${bodyHeight.value}px`,
+					...__props.bodyStyle
+				})
+			}, [renderSlot(_ctx.$slots, "body")], 4)], 16)])) : createCommentVNode("v-if", true);
 		};
 	}
 });

package/dist/es/components/ScrollBar.js

@@ -1,5 +1,4 @@
 import ScrollBar_vue_vue_type_script_setup_true_lang_default from "./ScrollBar.vue_vue_type_script_setup_true_lang.js";
-/* empty css                                          */
 //#region packages/editor/src/components/ScrollBar.vue
 var ScrollBar_default = ScrollBar_vue_vue_type_script_setup_true_lang_default;
 //#endregion

package/dist/es/editorProps.js

@@ -1,6 +1,11 @@
 import { CONTAINER_HIGHLIGHT_CLASS_NAME, ContainerHighlightType, RenderType } from "@tmagic/stage";
 import { getIdFromEl } from "@tmagic/utils";
 //#region packages/editor/src/editorProps.ts
+/**
+* 「属性配置表单校验」联动能力的 provide/inject 注入键。
+* 使用 Symbol 避免与其它字符串键冲突，供 PropsPanel / FormPanel 注入判断校验失败时是否仍更新节点并记录错误。
+*/
+var ENABLE_PROPS_FORM_VALIDATE = Symbol("enablePropsFormValidate");
 var defaultEditorProps = {
 	renderType: RenderType.IFRAME,
 	disabledMultiSelect: false,
@@ -34,4 +39,4 @@ var defaultEditorProps = {
 	customContentMenu: (menus) => menus
 };
 //#endregion
-export { defaultEditorProps };
+export { ENABLE_PROPS_FORM_VALIDATE, defaultEditorProps };

package/dist/es/fields/CodeSelect.vue_vue_type_script_setup_true_lang.js

@@ -70,7 +70,11 @@ var CodeSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 							value: HookCodeType.DATA_SOURCE_METHOD,
 							text: "数据源方法"
 						}],
-						defaultValue: "code",
+						rules: [{
+							typeMatch: true,
+							trigger: "change"
+						}],
+						defaultValue: HookCodeType.CODE,
 						onChange: (_mForm, v, { setModel }) => {
 							if (v === HookCodeType.DATA_SOURCE_METHOD) setModel("codeId", []);
 							else setModel("codeId", "");
@@ -83,7 +87,11 @@ var CodeSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 						span: 18,
 						labelWidth: 0,
 						display: (_mForm, { model }) => model.codeType !== HookCodeType.DATA_SOURCE_METHOD,
-						notEditable: () => !codeBlockService.getEditStatus()
+						notEditable: () => !codeBlockService.getEditStatus(),
+						rules: [{
+							typeMatch: true,
+							trigger: "change"
+						}]
 					},
 					{
 						type: "data-source-method-select",
@@ -91,7 +99,11 @@ var CodeSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 						span: 18,
 						labelWidth: 0,
 						display: (_mForm, { model }) => model.codeType === HookCodeType.DATA_SOURCE_METHOD,
-						notEditable: () => !dataSourceService.get("editable")
+						notEditable: () => !dataSourceService.get("editable"),
+						rules: [{
+							typeMatch: true,
+							trigger: "change"
+						}]
 					}
 				]
 			}]

package/dist/es/fields/CondOpSelect.vue_vue_type_script_setup_true_lang.js

@@ -1,4 +1,4 @@
-import { arrayOptions, eqOptions, numberOptions } from "../utils/props.js";
+import { getCondOpOptionsByFieldType } from "../utils/props.js";
 import { useServices } from "../hooks/use-services.js";
 import { getFieldType } from "../utils/data-source/index.js";
 import { TMagicSelect, getDesignConfig } from "@tmagic/design";
@@ -27,22 +27,7 @@ var CondOpSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 		const optionComponent = getDesignConfig("components")?.option;
 		const options = computed(() => {
 			const [id, ...fieldNames] = [...props.config.parentFields || [], ...props.model.field];
-			const type = getFieldType(dataSourceService.getDataSourceById(id), fieldNames);
-			if (type === "array") return arrayOptions;
-			if (type === "boolean" || type === "null") return [{
-				text: "是",
-				value: "is"
-			}, {
-				text: "不是",
-				value: "not"
-			}];
-			if (type === "number") return [...eqOptions, ...numberOptions];
-			if (type === "string") return [...arrayOptions, ...eqOptions];
-			return [
-				...arrayOptions,
-				...eqOptions,
-				...numberOptions
-			];
+			return getCondOpOptionsByFieldType(getFieldType(dataSourceService.getDataSourceById(id), fieldNames));
 		});
 		const fieldChangeHandler = (v) => {
 			emit("change", v);

package/dist/es/fields/DataSourceFieldSelect/FieldSelect.vue_vue_type_script_setup_true_lang.js

@@ -49,7 +49,8 @@ var FieldSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 		const selectFieldsId = ref([]);
 		watch(modelValue, (value) => {
 			if (props.dataSourceId) {
-				selectDataSourceId.value = valueIsKey.value ? props.dataSourceId : `${DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX}${props.dataSourceId}`;
+				const dsIdValue = valueIsKey.value ? props.dataSourceId : `${DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX}${props.dataSourceId}`;
+				selectDataSourceId.value = dsIdValue;
 				selectFieldsId.value = Array.isArray(value) ? value : [];
 			} else if (Array.isArray(value) && value.length) {
 				const [dsId, ...fields] = value;

package/dist/es/fields/DataSourceFields.vue_vue_type_script_setup_true_lang.js

@@ -313,6 +313,7 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 		const addFromJsonDialogVisible = useModel(__props, "visible1");
 		const { height: editorHeight } = useEditorContentHeight();
 		const { boxPosition, calcBoxPosition } = useNextFloatBoxPosition(uiService, inject("parentFloating", ref(null)));
+		const frameworkWidth = computed(() => uiService.get("frameworkRect")?.width || 0);
 		/**
 		* 由 DataSourceConfigPanel 注入：打开数据源详情后需要直接打开的字段路径（字段名数组）。
 		* 当前层消费 path[0]，并把剩余路径下发给嵌套字段，实现逐层打开。
@@ -353,6 +354,7 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 					_: 1
 				}, 8, ["disabled"])])) : createCommentVNode("v-if", true),
 				createVNode(FloatingBox_default, {
+					"body-style": { padding: "0 16px" },
 					visible: addDialogVisible.value,
 					"onUpdate:visible": _cache[2] || (_cache[2] = ($event) => addDialogVisible.value = $event),
 					width: width.value,
@@ -360,6 +362,7 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 					height: unref(editorHeight),
 					"onUpdate:height": _cache[4] || (_cache[4] = ($event) => isRef(editorHeight) ? editorHeight.value = $event : null),
 					title: fieldTitle.value,
+					"framework-width": frameworkWidth.value,
 					position: unref(boxPosition)
 				}, {
 					body: withCtx(() => [createVNode(unref(MFormBox), {
@@ -382,9 +385,11 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 					"width",
 					"height",
 					"title",
+					"framework-width",
 					"position"
 				]),
 				createVNode(FloatingBox_default, {
+					"body-style": { padding: "0 16px" },
 					visible: addFromJsonDialogVisible.value,
 					"onUpdate:visible": _cache[5] || (_cache[5] = ($event) => addFromJsonDialogVisible.value = $event),
 					width: width.value,
@@ -392,6 +397,7 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 					height: unref(editorHeight),
 					"onUpdate:height": _cache[7] || (_cache[7] = ($event) => isRef(editorHeight) ? editorHeight.value = $event : null),
 					title: "快速添加数据定义",
+					"framework-width": frameworkWidth.value,
 					position: unref(boxPosition)
 				}, {
 					body: withCtx(() => [createVNode(unref(MFormBox), {
@@ -405,6 +411,7 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 					"visible",
 					"width",
 					"height",
+					"framework-width",
 					"position"
 				])
 			]);

package/dist/es/fields/DataSourceInput.vue_vue_type_script_setup_true_lang.js

@@ -1,8 +1,8 @@
 import { useServices } from "../hooks/use-services.js";
-import { getDisplayField } from "../utils/data-source/index.js";
+import { getDisplayField, resolveFieldByPath } from "../utils/data-source/index.js";
 import Icon_default from "../components/Icon.js";
 import { TMagicInput, TMagicTag, getDesignConfig } from "@tmagic/design";
-import { getKeysArray, isNumber } from "@tmagic/utils";
+import { getKeysArray } from "@tmagic/utils";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeProps, nextTick, normalizeClass, openBlock, ref, renderList, resolveDynamicComponent, toDisplayString, unref, useTemplateRef, watch, withCtx } from "vue";
 import { Coin } from "@element-plus/icons-vue";
 //#region packages/editor/src/fields/DataSourceInput.vue?vue&type=script&setup=true&lang.ts
@@ -132,23 +132,11 @@ var DataSourceInput_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 				cb([]);
 				return;
 			}
-			let fields = ds.fields || [];
-			let key = keys.shift();
-			while (key) {
-				if (isNumber(key)) {
-					key = keys.shift();
-					continue;
-				}
-				for (const field of fields) if (field.name === key) {
-					fields = field.fields || [];
-					key = keys.shift();
-					break;
-				}
-			}
-			if (curCharIsDot(dotIndex)) result = fields || [];
+			const { fields } = resolveFieldByPath(ds.fields, keys, { skipNumberIndices: true });
+			if (curCharIsDot(dotIndex)) result = fields;
 			else if (dotIndex > -1) {
 				const queryName = queryString.substring(dotIndex + 1).toLowerCase();
-				result = fields.filter((field) => field.name?.toLowerCase().includes(queryName) || field.title?.toLowerCase().includes(queryName)) || [];
+				result = fields.filter((field) => field.name?.toLowerCase().includes(queryName) || field.title?.toLowerCase().includes(queryName));
 			}
 			cb(result.map((field) => ({
 				value: field.name,

package/dist/es/fields/DataSourceMocks.vue_vue_type_script_setup_true_lang.js

@@ -213,6 +213,7 @@ var DataSourceMocks_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 		const addDialogVisible = useModel(__props, "visible");
 		const { height: editorHeight } = useEditorContentHeight();
 		const { boxPosition, calcBoxPosition } = useNextFloatBoxPosition(uiService, inject("parentFloating", ref(null)));
+		const frameworkWidth = computed(() => uiService.get("frameworkRect")?.width || 0);
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", _hoisted_1, [
 				createVNode(unref(MagicTable), {
@@ -230,6 +231,7 @@ var DataSourceMocks_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 					_: 1
 				}, 8, ["disabled"])])) : createCommentVNode("v-if", true),
 				createVNode(FloatingBox_default, {
+					"body-style": { padding: "0 16px" },
 					visible: addDialogVisible.value,
 					"onUpdate:visible": _cache[1] || (_cache[1] = ($event) => addDialogVisible.value = $event),
 					width: width.value,
@@ -237,6 +239,7 @@ var DataSourceMocks_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 					height: unref(editorHeight),
 					"onUpdate:height": _cache[3] || (_cache[3] = ($event) => isRef(editorHeight) ? editorHeight.value = $event : null),
 					title: drawerTitle.value,
+					"framework-width": frameworkWidth.value,
 					position: unref(boxPosition)
 				}, {
 					body: withCtx(() => [createVNode(unref(MFormBox), {
@@ -257,6 +260,7 @@ var DataSourceMocks_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 					"width",
 					"height",
 					"title",
+					"framework-width",
 					"position"
 				])
 			]);

package/dist/es/fields/DisplayConds.vue_vue_type_script_setup_true_lang.js

@@ -70,7 +70,16 @@ var DisplayConds_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 						value: "key",
 						label: "字段",
 						checkStrictly: false,
-						onChange: fieldOnChange
+						onChange: fieldOnChange,
+						defaultValue: () => [],
+						rules: [{
+							required: true,
+							trigger: "blur",
+							message: "请选择字段"
+						}, {
+							typeMatch: true,
+							trigger: "change"
+						}]
 					} : {
 						type: "data-source-field-select",
 						name: "field",
@@ -83,14 +92,31 @@ var DisplayConds_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 							"boolean",
 							"any"
 						],
-						onChange: fieldOnChange
+						onChange: fieldOnChange,
+						defaultValue: () => [],
+						rules: [{
+							required: true,
+							trigger: "blur",
+							message: "请选择字段"
+						}, {
+							typeMatch: true,
+							trigger: "change"
+						}]
 					},
 					{
 						type: "cond-op-select",
 						parentFields: parentFields.value,
 						label: "条件",
 						width: 140,
-						name: "op"
+						name: "op",
+						rules: [{
+							required: true,
+							trigger: "blur",
+							message: "请选择条件"
+						}, {
+							typeMatch: true,
+							trigger: "change"
+						}]
 					},
 					{
 						label: "值",