@tmagic/editor 1.8.0-manmanyu.8 → 1.8.0

package/dist/es/fields/StyleSetter/pro/Layout.vue_vue_type_script_setup_true_lang.js

@@ -1,28 +1,10 @@
+import { createLayoutConfig } from "../configs.js";
 import Box_default from "../components/Box.js";
-import Center_default from "../icons/align-items/Center.js";
-import FlexEnd_default from "../icons/align-items/FlexEnd.js";
-import FlexStart_default from "../icons/align-items/FlexStart.js";
-import SpaceAround_default from "../icons/align-items/SpaceAround.js";
-import SpaceBetween_default from "../icons/align-items/SpaceBetween.js";
-import Block_default from "../icons/display/Block.js";
-import Flex_default from "../icons/display/Flex.js";
-import Inline_default from "../icons/display/Inline.js";
-import InlineBlock_default from "../icons/display/InlineBlock.js";
-import None_default from "../icons/display/None.js";
-import Column_default from "../icons/flex-direction/Column.js";
-import ColumnReverse_default from "../icons/flex-direction/ColumnReverse.js";
-import Row_default from "../icons/flex-direction/Row.js";
-import RowReverse_default from "../icons/flex-direction/RowReverse.js";
-import Center_default$1 from "../icons/justify-content/Center.js";
-import FlexEnd_default$1 from "../icons/justify-content/FlexEnd.js";
-import FlexStart_default$1 from "../icons/justify-content/FlexStart.js";
-import SpaceAround_default$1 from "../icons/justify-content/SpaceAround.js";
-import SpaceBetween_default$1 from "../icons/justify-content/SpaceBetween.js";
-import { MContainer, defineFormItem } from "@tmagic/form";
+import { MContainer } from "@tmagic/form";
 import { useTheme } from "@tmagic/design";
-import { Fragment, createElementBlock, createVNode, defineComponent, markRaw, openBlock, unref, vShow, withDirectives } from "vue";
+import { Fragment, computed, createBlock, createElementBlock, createVNode, defineComponent, openBlock, renderList, unref, vShow, withDirectives } from "vue";
 //#region packages/editor/src/fields/StyleSetter/pro/Layout.vue?vue&type=script&setup=true&lang.ts
-var Layout_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var Layout_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "Layout",
 	props: {
 		values: {},
@@ -30,292 +12,42 @@ var Layout_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineC
 		isCompare: { type: Boolean },
 		disabled: { type: Boolean },
 		size: {},
-		theme: {}
+		theme: {},
+		prop: {}
 	},
 	emits: ["change", "addDiffCount"],
 	setup(__props, { emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
 		const displayTheme = useTheme(props);
-		const config = defineFormItem({ items: [
-			{
-				name: "display",
-				text: "模式",
-				type: "radioGroup",
-				childType: displayTheme.value !== "magic-admin" ? "button" : "default",
-				labelWidth: "68px",
-				options: [
-					{
-						value: "inline",
-						icon: displayTheme.value !== "magic-admin" ? markRaw(Inline_default) : void 0,
-						tooltip: "内联布局 inline",
-						text: "内联布局\n inline"
-					},
-					{
-						value: "flex",
-						icon: displayTheme.value !== "magic-admin" ? markRaw(Flex_default) : void 0,
-						tooltip: "弹性布局 flex",
-						text: "弹性布局\n flex"
-					},
-					{
-						value: "block",
-						icon: displayTheme.value !== "magic-admin" ? markRaw(Block_default) : void 0,
-						tooltip: "块级布局 block",
-						text: "块级布局\n block"
-					},
-					{
-						value: "inline-block",
-						icon: displayTheme.value !== "magic-admin" ? markRaw(InlineBlock_default) : void 0,
-						tooltip: "内联块布局 inline-block",
-						text: "内联块布局\n inline-block"
-					},
-					{
-						value: "none",
-						icon: displayTheme.value !== "magic-admin" ? markRaw(None_default) : void 0,
-						tooltip: "隐藏 none",
-						text: "隐藏\n none"
-					}
-				]
-			},
-			{
-				name: "flexDirection",
-				text: "主轴方向",
-				type: "radioGroup",
-				childType: "button",
-				labelWidth: "68px",
-				options: [
-					{
-						value: "row",
-						icon: markRaw(Row_default),
-						tooltip: "水平方向 起点在左侧 row",
-						text: "左起点"
-					},
-					{
-						value: "row-reverse",
-						icon: markRaw(RowReverse_default),
-						tooltip: "水平方向 起点在右侧 row-reverse",
-						text: "右起点"
-					},
-					{
-						value: "column",
-						icon: markRaw(Column_default),
-						tooltip: "垂直方向 起点在上沿 column",
-						text: "顶部起点"
-					},
-					{
-						value: "column-reverse",
-						icon: markRaw(ColumnReverse_default),
-						tooltip: "垂直方向 起点在下沿 column-reverse",
-						text: "底部起点"
-					}
-				],
-				display: (_mForm, { model }) => model.display === "flex"
-			},
-			{
-				name: "justifyContent",
-				text: "主轴对齐",
-				type: "radioGroup",
-				childType: "button",
-				labelWidth: "68px",
-				options: [
-					{
-						value: "flex-start",
-						icon: markRaw(FlexStart_default$1),
-						tooltip: "左对齐 flex-start",
-						text: "左对齐"
-					},
-					{
-						value: "flex-end",
-						icon: markRaw(FlexEnd_default$1),
-						tooltip: "右对齐 flex-end",
-						text: "右对齐"
-					},
-					{
-						value: "center",
-						icon: markRaw(Center_default$1),
-						tooltip: "居中 center",
-						text: "居中"
-					},
-					{
-						value: "space-between",
-						icon: markRaw(SpaceBetween_default$1),
-						tooltip: "两端对齐 space-between",
-						text: "左右对齐"
-					},
-					{
-						value: "space-around",
-						icon: markRaw(SpaceAround_default$1),
-						tooltip: "横向平分 space-around",
-						text: "横向等分"
-					}
-				],
-				display: (_mForm, { model }) => model.display === "flex"
-			},
-			{
-				name: "alignItems",
-				text: "辅轴对齐",
-				type: "radioGroup",
-				childType: "button",
-				labelWidth: "68px",
-				options: [
-					{
-						value: "flex-start",
-						icon: markRaw(FlexStart_default),
-						tooltip: "左对齐 flex-start",
-						text: "上对齐"
-					},
-					{
-						value: "flex-end",
-						icon: markRaw(FlexEnd_default),
-						tooltip: "右对齐 flex-end",
-						text: "下对齐"
-					},
-					{
-						value: "center",
-						icon: markRaw(Center_default),
-						tooltip: "居中 center",
-						text: "居中"
-					},
-					{
-						value: "space-between",
-						icon: markRaw(SpaceBetween_default),
-						tooltip: "两端对齐 space-between",
-						text: "上下对齐"
-					},
-					{
-						value: "space-around",
-						icon: markRaw(SpaceAround_default),
-						tooltip: "横向平分 space-around",
-						text: "纵向等分"
-					}
-				],
-				display: (_mForm, { model }) => model.display === "flex"
-			},
-			{
-				name: "flexWrap",
-				text: "换行",
-				type: "radioGroup",
-				childType: displayTheme.value !== "magic-admin" ? "button" : "default",
-				labelWidth: "68px",
-				options: [
-					{
-						value: "nowrap",
-						text: "不换行",
-						tooltip: "不换行 nowrap"
-					},
-					{
-						value: "wrap",
-						text: "正换行",
-						tooltip: "第一行在上方 wrap"
-					},
-					{
-						value: "wrap-reverse",
-						text: "逆换行",
-						tooltip: "第一行在下方 wrap-reverse"
-					}
-				],
-				display: (_mForm, { model }) => model.display === "flex"
-			},
-			{
-				type: "row",
-				items: [{
-					name: "width",
-					text: "宽度（px）",
-					labelWidth: "90px",
-					type: "data-source-field-select",
-					fieldConfig: { type: "text" }
-				}]
-			},
-			{
-				type: "row",
-				items: [{
-					name: "height",
-					text: "高度（px）",
-					labelWidth: "90px",
-					type: "data-source-field-select",
-					fieldConfig: { type: "text" }
-				}]
-			},
-			{
-				type: "row",
-				items: [{
-					type: "data-source-field-select",
-					text: "overflow",
-					name: "overflow",
-					labelWidth: "90px",
-					checkStrictly: false,
-					dataSourceFieldType: ["string"],
-					fieldConfig: {
-						type: "select",
-						clearable: true,
-						allowCreate: true,
-						options: [
-							{
-								text: "visible",
-								value: "visible"
-							},
-							{
-								text: "hidden",
-								value: "hidden"
-							},
-							{
-								text: "clip",
-								value: "clip"
-							},
-							{
-								text: "scroll",
-								value: "scroll"
-							},
-							{
-								text: "auto",
-								value: "auto"
-							},
-							{
-								text: "overlay",
-								value: "overlay"
-							},
-							{
-								text: "initial",
-								value: "initial"
-							}
-						]
-					}
-				}]
-			},
-			{
-				type: "row",
-				items: [{
-					type: "data-source-field-select",
-					text: "透明度（%）",
-					name: "opacity",
-					labelWidth: "90px",
-					dataSourceFieldType: ["string", "number"],
-					fieldConfig: { type: "text" }
-				}]
-			}
-		] });
+		const formConfig = computed(() => createLayoutConfig(displayTheme.value));
 		const change = (value, eventData) => {
 			emit("change", value, eventData);
 		};
 		const onAddDiffCount = () => emit("addDiffCount");
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock(Fragment, null, [createVNode(unref(MContainer), {
-				config: unref(config),
-				model: __props.values,
-				"last-values": __props.lastValues,
-				"is-compare": __props.isCompare,
-				size: __props.size,
-				disabled: __props.disabled,
-				onChange: change,
-				onAddDiffCount
-			}, null, 8, [
-				"config",
-				"model",
-				"last-values",
-				"is-compare",
-				"size",
-				"disabled"
-			]), withDirectives(createVNode(Box_default, {
+			return openBlock(), createElementBlock(Fragment, null, [(openBlock(true), createElementBlock(Fragment, null, renderList(formConfig.value, (item) => {
+				return openBlock(), createBlock(unref(MContainer), {
+					prop: __props.prop,
+					key: item.name,
+					config: item,
+					model: __props.values,
+					"last-values": __props.lastValues,
+					"is-compare": __props.isCompare,
+					size: __props.size,
+					disabled: __props.disabled,
+					onChange: change,
+					onAddDiffCount
+				}, null, 8, [
+					"prop",
+					"config",
+					"model",
+					"last-values",
+					"is-compare",
+					"size",
+					"disabled"
+				]);
+			}), 128)), withDirectives(createVNode(Box_default, {
 				model: __props.values,
 				"last-values": __props.lastValues,
 				"is-compare": __props.isCompare,

package/dist/es/fields/StyleSetter/pro/Position.vue_vue_type_script_setup_true_lang.js

@@ -1,102 +1,49 @@
-import { MContainer, defineFormItem } from "@tmagic/form";
-import { createBlock, defineComponent, openBlock, unref } from "vue";
+import { createPositionConfig } from "../configs.js";
+import { MContainer } from "@tmagic/form";
+import { Fragment, computed, createBlock, createElementBlock, defineComponent, openBlock, renderList, unref } from "vue";
 //#region packages/editor/src/fields/StyleSetter/pro/Position.vue?vue&type=script&setup=true&lang.ts
-var Position_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var Position_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "Position",
 	props: {
 		values: {},
 		lastValues: {},
 		isCompare: { type: Boolean },
 		disabled: { type: Boolean },
-		size: {}
+		size: {},
+		prop: {}
 	},
 	emits: ["change", "addDiffCount"],
 	setup(__props, { emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
-		const positionText = {
-			static: "不定位",
-			relative: "相对定位",
-			absolute: "绝对定位",
-			fixed: "固定定位",
-			sticky: "粘性定位"
-		};
-		const config = defineFormItem({ items: [
-			{
-				name: "position",
-				text: "定位",
-				labelWidth: "68px",
-				type: "data-source-field-select",
-				fieldConfig: {
-					type: "select",
-					options: Object.keys(positionText).map((item) => ({
-						value: item,
-						text: `${item}(${positionText[item]})`
-					}))
-				}
-			},
-			{
-				type: "row",
-				labelWidth: "68px",
-				display: () => props.values.position !== "static",
-				items: [{
-					name: "left",
-					type: "data-source-field-select",
-					text: "left",
-					fieldConfig: { type: "text" }
-				}, {
-					name: "top",
-					type: "data-source-field-select",
-					text: "top",
-					fieldConfig: { type: "text" }
-				}]
-			},
-			{
-				type: "row",
-				labelWidth: "68px",
-				display: () => props.values.position !== "static",
-				items: [{
-					name: "right",
-					type: "data-source-field-select",
-					text: "right",
-					fieldConfig: { type: "text" }
-				}, {
-					name: "bottom",
-					type: "data-source-field-select",
-					text: "bottom",
-					fieldConfig: { type: "text" }
-				}]
-			},
-			{
-				labelWidth: "68px",
-				name: "zIndex",
-				text: "zIndex",
-				type: "data-source-field-select",
-				fieldConfig: { type: "text" }
-			}
-		] });
+		const formConfig = computed(() => createPositionConfig(props.values));
 		const change = (value, eventData) => {
 			emit("change", value, eventData);
 		};
 		const onAddDiffCount = () => emit("addDiffCount");
 		return (_ctx, _cache) => {
-			return openBlock(), createBlock(unref(MContainer), {
-				config: unref(config),
-				model: __props.values,
-				"last-values": __props.lastValues,
-				"is-compare": __props.isCompare,
-				size: __props.size,
-				disabled: __props.disabled,
-				onChange: change,
-				onAddDiffCount
-			}, null, 8, [
-				"config",
-				"model",
-				"last-values",
-				"is-compare",
-				"size",
-				"disabled"
-			]);
+			return openBlock(true), createElementBlock(Fragment, null, renderList(formConfig.value, (item, index) => {
+				return openBlock(), createBlock(unref(MContainer), {
+					prop: __props.prop,
+					key: index,
+					config: item,
+					model: __props.values,
+					"last-values": __props.lastValues,
+					"is-compare": __props.isCompare,
+					size: __props.size,
+					disabled: __props.disabled,
+					onChange: change,
+					onAddDiffCount
+				}, null, 8, [
+					"prop",
+					"config",
+					"model",
+					"last-values",
+					"is-compare",
+					"size",
+					"disabled"
+				]);
+			}), 128);
 		};
 	}
 });

package/dist/es/fields/StyleSetter/pro/Transform.vue_vue_type_script_setup_true_lang.js

@@ -1,45 +1,28 @@
-import { MContainer, defineFormItem } from "@tmagic/form";
+import { transformConfig } from "../configs.js";
+import { MContainer } from "@tmagic/form";
 import { createBlock, defineComponent, openBlock, unref } from "vue";
 //#region packages/editor/src/fields/StyleSetter/pro/Transform.vue?vue&type=script&setup=true&lang.ts
-var Transform_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var Transform_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "Transform",
 	props: {
 		values: {},
 		lastValues: {},
 		isCompare: { type: Boolean },
 		disabled: { type: Boolean },
-		size: {}
+		size: {},
+		prop: {}
 	},
 	emits: ["change", "addDiffCount"],
 	setup(__props, { emit: __emit }) {
 		const emit = __emit;
-		const config = defineFormItem({ items: [{
-			name: "transform",
-			items: [{
-				name: "rotate",
-				text: "旋转角度",
-				labelWidth: "68px",
-				type: "data-source-field-select",
-				checkStrictly: false,
-				dataSourceFieldType: ["string", "number"],
-				fieldConfig: { type: "text" }
-			}, {
-				name: "scale",
-				text: "缩放",
-				labelWidth: "68px",
-				type: "data-source-field-select",
-				checkStrictly: false,
-				dataSourceFieldType: ["string", "number"],
-				fieldConfig: { type: "text" }
-			}]
-		}] });
 		const change = (value, eventData) => {
 			emit("change", value, eventData);
 		};
 		const onAddDiffCount = () => emit("addDiffCount");
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(MContainer), {
-				config: unref(config),
+				prop: __props.prop,
+				config: unref(transformConfig),
 				model: __props.values,
 				"last-values": __props.lastValues,
 				"is-compare": __props.isCompare,
@@ -48,6 +31,7 @@ var Transform_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
 				onChange: change,
 				onAddDiffCount
 			}, null, 8, [
+				"prop",
 				"config",
 				"model",
 				"last-values",

package/dist/es/fields/UISelect.js

@@ -1,5 +1,4 @@
 import UISelect_vue_vue_type_script_setup_true_lang_default from "./UISelect.vue_vue_type_script_setup_true_lang.js";
-/* empty css                                         */
 //#region packages/editor/src/fields/UISelect.vue
 var UISelect_default = UISelect_vue_vue_type_script_setup_true_lang_default;
 //#endregion

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

@@ -11,7 +11,7 @@ var _hoisted_1 = {
 	class: "m-fields-ui-select",
 	style: { "display": "flex" }
 };
-var UISelect_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var UISelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "MFieldsUISelect",
 	__name: "UISelect",
 	props: {

package/dist/es/fields/configs/codeSelect.js

@@ -0,0 +1,98 @@
+import codeBlock_default from "../../services/codeBlock.js";
+import dataSource_default from "../../services/dataSource.js";
+import { stickyAddButton } from "./stickyAddButton.js";
+import { HookCodeType, HookType } from "@tmagic/core";
+import { isEmpty } from "lodash-es";
+//#region packages/editor/src/fields/configs/codeSelect.ts
+/**
+* `fields/CodeSelect.vue` 内部渲染的钩子列表配置。
+*
+* 由组件与无渲染校验的嵌套配置共用：组件用它渲染，嵌套配置用它让父表单校验到这些字段。
+*/
+var createCodeSelectConfig = (config) => {
+	return {
+		type: "group-list",
+		name: "hookData",
+		enableToggleMode: false,
+		expandAll: true,
+		defaultAdd: () => ({
+			codeType: HookCodeType.CODE,
+			codeId: ""
+		}),
+		...stickyAddButton(`添加${config.text || ""}`),
+		title: (_mForm, { model, index }) => {
+			if (model.codeType === HookCodeType.DATA_SOURCE_METHOD) {
+				if (Array.isArray(model.codeId)) {
+					if (model.codeId.length < 2) return index;
+					return `${dataSource_default.getDataSourceById(model.codeId[0])?.title} / ${model.codeId[1]}`;
+				}
+				return Array.isArray(model.codeId) ? model.codeId.join("/") : index;
+			}
+			const codeContent = codeBlock_default.getCodeContentById(model.codeId);
+			if (codeContent) return codeContent.name;
+			return model.codeId || index;
+		},
+		titlePrefix: config.name === void 0 ? void 0 : String(config.name),
+		items: [
+			{
+				text: "代码类型",
+				type: "select",
+				name: "codeType",
+				rules: [{
+					typeMatch: true,
+					trigger: "change"
+				}],
+				options: [{
+					value: HookCodeType.CODE,
+					text: "代码块"
+				}, {
+					value: HookCodeType.DATA_SOURCE_METHOD,
+					text: "数据源方法"
+				}],
+				defaultValue: HookCodeType.CODE,
+				onChange: (_mForm, v, { setModel }) => {
+					if (v === HookCodeType.DATA_SOURCE_METHOD) setModel("codeId", []);
+					else setModel("codeId", "");
+					return v;
+				}
+			},
+			{
+				type: "code-select-col",
+				name: "codeId",
+				text: "代码块",
+				rules: [{
+					typeMatch: true,
+					trigger: "change"
+				}],
+				display: (_mForm, { model }) => model.codeType !== HookCodeType.DATA_SOURCE_METHOD,
+				notEditable: () => !codeBlock_default.getEditStatus()
+			},
+			{
+				type: "data-source-method-select",
+				name: "codeId",
+				text: "数据源字段",
+				rules: [{
+					typeMatch: true,
+					trigger: "change"
+				}],
+				display: (_mForm, { model }) => model.codeType === HookCodeType.DATA_SOURCE_METHOD,
+				notEditable: () => !dataSource_default.get("editable")
+			}
+		]
+	};
+};
+/**
+* `code-select` 的旧数据兼容：钩子值可能是空值或空数组，改写成 `{ hookType, hookData }`。
+*
+* 表单值初始化时由 `code-select` 的 `effect` 执行（`applyMountValueEffects`）；
+* 组件里的 `watch`（无 immediate）只兜运行期被置空。必须幂等。
+*/
+var normalizeCodeSelectValue = (model, name) => {
+	if (!model) return;
+	if (isEmpty(model[name])) model[name] = {
+		hookType: HookType.CODE,
+		hookData: []
+	};
+};
+//#endregion
+export { createCodeSelectConfig, normalizeCodeSelectValue };