@kp-ui/lowcode-pc-v2 0.0.5 → 0.0.7

package/src/widgets/containers/flex/index-render.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,93 @@
+import RenderWidgetList_default from "../../../../core/src/components/common/render/RenderWidgetList.js";
+import { ComponentNameEnum } from "../../../../core/src/constants/WidgetTypeEnum.js";
+import { useField } from "../../../../core/src/hooks/useField.js";
+import { WidgetType, getWidgetName } from "../../widgetTypes.js";
+import { computed, createCommentVNode, createElementBlock, createVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, unref } from "vue";
+//#region src/widgets/containers/flex/index-render.vue?vue&type=script&setup=true&lang.ts
+var index_render_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	name: getWidgetName(WidgetType.Flex),
+	componentName: ComponentNameEnum.ContainerWidget,
+	__name: "index-render",
+	props: { widget: {} },
+	setup(__props, { expose: __expose }) {
+		const { handleHidden, defineExposed } = useField(__props.widget);
+		const flexHeight = computed(() => {
+			if (__props.widget.props.heightMode === "fixed") {
+				var _props$widget$props$f;
+				return `${(_props$widget$props$f = __props.widget.props.flexHeight) !== null && _props$widget$props$f !== void 0 ? _props$widget$props$f : 42}px`;
+			}
+			return "100%";
+		});
+		const getFlexItemStyle = (childWidget) => {
+			var _props$widget$props$f2, _ref, _config$mode;
+			const config = childWidget.id ? (_props$widget$props$f2 = __props.widget.props.flexItemWidths) === null || _props$widget$props$f2 === void 0 ? void 0 : _props$widget$props$f2[childWidget.id] : void 0;
+			const mode = (_ref = (_config$mode = config === null || config === void 0 ? void 0 : config.mode) !== null && _config$mode !== void 0 ? _config$mode : __props.widget.props.flexItemWidthMode) !== null && _ref !== void 0 ? _ref : "auto";
+			const size = (config === null || config === void 0 ? void 0 : config.width) || __props.widget.props.flexItemWidth || "240px";
+			const isColumn = __props.widget.props.flexDirection.includes("column");
+			if (isColumn) {
+				if (mode === "full") return {
+					width: "100%",
+					minHeight: 0,
+					flex: "1"
+				};
+				if (mode === "fixed") return {
+					width: "100%",
+					height: size,
+					flex: `0 0 ${size}`
+				};
+				return {
+					width: "100%",
+					flex: "0 1 auto"
+				};
+			}
+			if (mode === "full") {
+				if (!__props.widget.props.wrap) return {
+					width: 0,
+					minWidth: 0,
+					flex: "1 1 0"
+				};
+				return {
+					width: "100%",
+					flex: "0 0 100%"
+				};
+			}
+			if (mode === "fixed") return {
+				width: size,
+				flex: `0 0 ${size}`
+			};
+			return {
+				width: isColumn ? "100%" : "auto",
+				flex: "0 1 auto"
+			};
+		};
+		const flexStyle = computed(() => {
+			var _props$widget$props$g;
+			return {
+				...__props.widget.style,
+				height: flexHeight.value,
+				display: "flex",
+				flexDirection: __props.widget.props.flexDirection,
+				justifyContent: __props.widget.props.justifyContent,
+				alignItems: __props.widget.props.alignItems,
+				flexWrap: __props.widget.props.wrap ? "wrap" : "nowrap",
+				gap: `${(_props$widget$props$g = __props.widget.props.gap) !== null && _props$widget$props$g !== void 0 ? _props$widget$props$g : 0}px`
+			};
+		});
+		__expose({ ...defineExposed });
+		return (_ctx, _cache) => {
+			return !unref(handleHidden) ? (openBlock(), createElementBlock("div", {
+				class: normalizeClass(["flex-container", _ctx.widget.props.customClass]),
+				style: normalizeStyle(flexStyle.value),
+				key: _ctx.widget.id
+			}, [createVNode(unref(RenderWidgetList_default), {
+				list: _ctx.widget.children,
+				"onUpdate:list": _cache[0] || (_cache[0] = ($event) => _ctx.widget.children = $event),
+				parentWidget: _ctx.widget,
+				itemStyle: getFlexItemStyle
+			}, null, 8, ["list", "parentWidget"])], 6)) : createCommentVNode("", true);
+		};
+	}
+});
+//#endregion
+export { index_render_vue_vue_type_script_setup_true_lang_default as default };

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

@@ -0,0 +1,35 @@
+import { WidgetType } from "../../widgetTypes.js";
+//#region src/widgets/containers/flex/schema.ts
+var Flex = {
+	id: "",
+	type: WidgetType.Flex,
+	category: "container",
+	style: {
+		width: "100%",
+		minHeight: "42px"
+	},
+	events: {
+		onMounted: "",
+		onHidden: "//return false"
+	},
+	children: [],
+	props: {
+		name: "",
+		label: "flex",
+		hidden: false,
+		customClass: [],
+		heightMode: "inherit",
+		flexHeight: 42,
+		flexDirection: "row",
+		justifyContent: "flex-start",
+		alignItems: "stretch",
+		gap: 8,
+		wrap: true,
+		flexItemWidthMode: "auto",
+		flexItemWidth: "240px",
+		flexItemWidths: {},
+		componentSort: true
+	}
+};
+//#endregion
+export { Flex };

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

@@ -3,6 +3,7 @@ import { WidgetType } from "../../widgetTypes.js";
 var Space = {
 	id: "",
 	type: WidgetType.Space,
+	internal: true,
 	category: "container",
 	style: {},
 	events: {

package/src/widgets/render.js

@@ -62,6 +62,7 @@ import { Collapse } from "./containers/collapse/schema.js";
 import { Dialog } from "./containers/dialog/schema.js";
 import { Form } from "./containers/form/schema.js";
 import { Space } from "./containers/space/schema.js";
+import { Flex } from "./containers/flex/schema.js";
 import { List } from "./containers/list/schema.js";
 import { SecondaryPage } from "./template/SecondaryPage/schema.js";
 import index_render_default from "./containers/grid-col/index-render.js";
@@ -73,8 +74,9 @@ import index_render_default$5 from "./containers/collapse/index-render.js";
 import index_render_default$6 from "./containers/dialog/index-render.js";
 import index_render_default$7 from "./containers/form/index-render.js";
 import index_render_default$8 from "./containers/space/index-render.js";
-import index_render_default$9 from "./containers/list/index-render.js";
-import index_render_default$10 from "./template/SecondaryPage/index-render.js";
+import index_render_default$9 from "./containers/flex/index-render.js";
+import index_render_default$10 from "./containers/list/index-render.js";
+import index_render_default$11 from "./template/SecondaryPage/index-render.js";
 //#region src/widgets/render.ts
 var renderSchemas = [
 	Input,
@@ -113,6 +115,7 @@ var renderSchemas = [
 	Dialog,
 	Form,
 	Space,
+	Flex,
 	List,
 	SecondaryPage
 ];
@@ -154,7 +157,8 @@ var renderComponents = [
 	index_render_default$7,
 	index_render_default$8,
 	index_render_default$9,
-	index_render_default$10
+	index_render_default$10,
+	index_render_default$11
 ];
 new Map(renderSchemas.map((schema) => [schema.type, schema]));
 var renderRegistryComponents = new Map(renderComponents.map((component) => [component.name, component]));

package/src/widgets/widgetTypes.js

@@ -40,6 +40,7 @@ var WidgetType = /* @__PURE__ */ function(WidgetType) {
 	WidgetType["Dialog"] = "dialog";
 	WidgetType["GridSubForm"] = "grid-sub-form";
 	WidgetType["Space"] = "space";
+	WidgetType["Flex"] = "flex";
 	WidgetType["List"] = "list";
 	WidgetType["SecondaryPage"] = "secondary-page";
 	return WidgetType;

package/src/widgets/wrapper/form-item-wrapper.js

@@ -2,6 +2,6 @@ import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_exp
 import form_item_wrapper_vue_vue_type_script_setup_true_lang_default from "./form-item-wrapper.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                                  */
 //#region src/widgets/wrapper/form-item-wrapper.vue
-var form_item_wrapper_default = /* @__PURE__ */ _plugin_vue_export_helper_default(form_item_wrapper_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-9c668962"]]);
+var form_item_wrapper_default = /* @__PURE__ */ _plugin_vue_export_helper_default(form_item_wrapper_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-254940bd"]]);
 //#endregion
 export { form_item_wrapper_default as default };

package/src/widgets/wrapper/form-item-wrapper.vue_vue_type_script_setup_true_lang.js

@@ -4,16 +4,12 @@ import { FormItem } from "ant-design-vue";
 import { SvgIcon } from "tmgc2-share";
 //#region src/widgets/wrapper/form-item-wrapper.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = {
-	key: 0,
-	class: "label-box"
-};
-var _hoisted_2 = {
 	key: 0,
 	class: "custom-label"
 };
-var _hoisted_3 = { class: "label-text" };
-var _hoisted_4 = { class: "label-text" };
-var _hoisted_5 = {
+var _hoisted_2 = ["title"];
+var _hoisted_3 = ["title"];
+var _hoisted_4 = {
 	key: 1,
 	class: "label-text"
 };
@@ -68,13 +64,22 @@ var form_item_wrapper_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 				name: unref(getPropName),
 				labelAlign: labelAlign.value
 			}, {
-				label: withCtx(() => [!labelHidden.value ? (openBlock(), createElementBlock("div", _hoisted_1, [labelIconClass.value ? (openBlock(), createElementBlock("span", _hoisted_2, [labelIconPosition.value === "front" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createVNode(_component_a_tooltip, { title: labelIconTooltip.value }, {
+				label: withCtx(() => [!labelHidden.value ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					class: normalizeClass(["label-box", `label-box--${labelAlign.value}`])
+				}, [labelIconClass.value ? (openBlock(), createElementBlock("span", _hoisted_1, [labelIconPosition.value === "front" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createVNode(_component_a_tooltip, { title: labelIconTooltip.value }, {
 					default: withCtx(() => [createVNode(unref(SvgIcon), { "icon-class": labelIconClass.value }, null, 8, ["icon-class"])]),
 					_: 1
-				}, 8, ["title"]), createElementVNode("span", _hoisted_3, toDisplayString(unref(label)), 1)], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createElementVNode("span", _hoisted_4, toDisplayString(unref(label)), 1), createVNode(_component_a_tooltip, { title: labelIconTooltip.value }, {
+				}, 8, ["title"]), createElementVNode("span", {
+					class: "label-text",
+					title: unref(label)
+				}, toDisplayString(unref(label)), 9, _hoisted_2)], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createElementVNode("span", {
+					class: "label-text",
+					title: unref(label)
+				}, toDisplayString(unref(label)), 9, _hoisted_3), createVNode(_component_a_tooltip, { title: labelIconTooltip.value }, {
 					default: withCtx(() => [createVNode(unref(SvgIcon), { "icon-class": labelIconClass.value }, null, 8, ["icon-class"])]),
 					_: 1
-				}, 8, ["title"])], 64))])) : (openBlock(), createElementBlock("span", _hoisted_5, toDisplayString(unref(label)), 1))])) : createCommentVNode("", true)]),
+				}, 8, ["title"])], 64))])) : (openBlock(), createElementBlock("span", _hoisted_4, toDisplayString(unref(label)), 1))], 2)) : createCommentVNode("", true)]),
 				default: withCtx(() => [renderSlot(_ctx.$slots, "default", {}, void 0, true)]),
 				_: 3
 			}, 8, [