fast-element-plus 1.0.21 → 2.0.0

package/dist/components/drawer/src/drawer.mjs

@@ -0,0 +1,297 @@
+import { useEmits } from "../../../utils/vue/emits.mjs";
+import { useExpose } from "../../../utils/vue/expose.mjs";
+import { callOptionalFunction } from "../../../utils/vue/func.mjs";
+import { definePropType, useProps } from "../../../utils/vue/props.mjs";
+import { useRender } from "../../../utils/vue/render.mjs";
+import { makeSlots } from "../../../utils/vue/slots.mjs";
+import isBoolean from "../../../node_modules/.pnpm/lodash-es@4.18.1/node_modules/lodash-es/isBoolean.mjs";
+import { FullScreen, FullScreenExit } from "@fast-element-plus/icons-vue";
+import { Fragment, computed, createVNode, defineComponent, mergeProps, nextTick, onBeforeUnmount, reactive, ref, resolveDirective, watch, withDirectives } from "vue";
+import { Close, Eleme, Refresh } from "@element-plus/icons-vue";
+import { ElButton, ElDrawer, ElIcon, ElMessage, ElMessageBox, ElScrollbar, drawerEmits, drawerProps, useGlobalSize } from "element-plus";
+//#region src/components/drawer/src/drawer.tsx
+/** FaDrawer 的运行时 Props 定义。 */
+const faDrawerProps = {
+	...drawerProps,
+	/** @description whether to append Dialog itself to body. A nested Dialog should have this attribute set to `true` */
+	appendToBody: {
+		type: Boolean,
+		default: true
+	},
+	/** @description enable dragging feature for Dialog */
+	draggable: {
+		type: Boolean,
+		default: true
+	},
+	/** @description destroy elements in Dialog when closed */
+	destroyOnClose: {
+		type: Boolean,
+		default: true
+	},
+	/** @description 显示刷新按钮 */
+	showRefresh: {
+		type: Boolean,
+		default: true
+	},
+	/** @description 显示全屏图标 */
+	showFullscreen: {
+		type: Boolean,
+		default: true
+	},
+	/** @description 显示关闭按钮 */
+	showCloseButton: {
+		type: Boolean,
+		default: true
+	},
+	/** @description 显示确认按钮 */
+	showConfirmButton: {
+		type: Boolean,
+		default: true
+	},
+	/** @description 禁用确认按钮 */
+	disabledConfirmButton: Boolean,
+	/** @description 关闭按钮文字，默认取消 */
+	closeButtonText: {
+		type: String,
+		default: "取消"
+	},
+	/** @description 确认按钮文字，默认确认 */
+	confirmButtonText: {
+		type: String,
+		default: "确认"
+	},
+	/** @description 隐藏底部操作 */
+	hideFooter: Boolean,
+	/** @description 显示关闭回调 */
+	showBeforeClose: Boolean,
+	/** @description 打开之后 */
+	afterOpen: { type: definePropType(Function) }
+};
+/** FaDrawer 的运行时 Emits 定义。 */
+const faDrawerEmits = {
+	...drawerEmits,
+	/** @description v-model 回调 */
+	"update:modelValue": (value) => isBoolean(value),
+	/** @description 确认按钮点击事件 */
+	confirmClick: () => true
+};
+var drawer_default = defineComponent({
+	name: "FaDrawer",
+	props: faDrawerProps,
+	emits: faDrawerEmits,
+	slots: makeSlots(),
+	setup(props, { slots, emit, expose }) {
+		const _globalSize = useGlobalSize();
+		const state = reactive({
+			loading: false,
+			visible: props.modelValue,
+			fullscreen: false,
+			size: props.size ?? "30%",
+			dragging: false,
+			refreshing: false
+		});
+		const drawerRef = ref();
+		let cacheOpenFunction;
+		const handleOpen = (openFunction) => {
+			state.visible = true;
+			cacheOpenFunction = openFunction;
+			nextTick(() => {
+				state.loading = true;
+				callOptionalFunction(props.afterOpen ?? openFunction).then(() => {
+					emit("open");
+				}).catch((error) => {
+					state.visible = false;
+					throw error;
+				}).finally(() => {
+					state.loading = false;
+				});
+			});
+		};
+		const handleClose = (closeFunction) => {
+			state.loading = true;
+			callOptionalFunction(closeFunction).then(() => {
+				emit("close");
+				state.visible = false;
+			}).finally(() => {
+				state.loading = false;
+			});
+		};
+		const handleLoading = (loadingFunction) => {
+			state.loading = true;
+			callOptionalFunction(loadingFunction).finally(() => {
+				state.loading = false;
+			});
+		};
+		const handleRefresh = () => {
+			state.refreshing = true;
+			state.loading = true;
+			setTimeout(() => {
+				state.refreshing = false;
+				handleOpen(cacheOpenFunction);
+				ElMessage.success("刷新成功");
+			}, 500);
+		};
+		const handleBeforeClose = (done) => {
+			if (state.loading) return;
+			if (document.querySelector(".el-image-viewer__wrapper")) return;
+			const newDone = () => {
+				return callOptionalFunction(props.beforeClose).then(() => {
+					emit("close");
+					done();
+				});
+			};
+			if (props.showBeforeClose) ElMessageBox.confirm("确定关闭？", { type: "warning" }).then(() => newDone());
+			else newDone();
+		};
+		const handleFullscreen = () => {
+			if (state.loading) return;
+			state.fullscreen = !state.fullscreen;
+		};
+		const handleConfirmClick = () => {
+			if (state.loading) return;
+			emit("confirmClick");
+		};
+		const handleCloseClick = () => {
+			if (state.loading) return;
+			handleClose();
+		};
+		watch(() => props.modelValue, (newValue) => {
+			if (state.visible !== newValue) state.visible = newValue;
+		});
+		watch(() => state.visible, (newValue) => {
+			if (props.modelValue !== newValue) emit("update:modelValue", newValue);
+		});
+		watch(() => props.size, (newValue) => {
+			if (newValue !== void 0) state.size = newValue;
+		});
+		const handleDraggablePointermove = (event) => {
+			const viewportSize = props.direction === "rtl" || props.direction === "ltr" ? document.documentElement.clientWidth : document.documentElement.clientHeight;
+			let nextSize;
+			switch (props.direction) {
+				case "ltr":
+					nextSize = event.clientX;
+					break;
+				case "ttb":
+					nextSize = event.clientY;
+					break;
+				case "btt":
+					nextSize = viewportSize - event.clientY;
+					break;
+				default: nextSize = viewportSize - event.clientX;
+			}
+			state.size = `${Math.min(Math.max(nextSize, viewportSize * .2), viewportSize * .95).toString()}px`;
+		};
+		const stopDraggable = () => {
+			state.dragging = false;
+			document.removeEventListener("pointermove", handleDraggablePointermove);
+			document.removeEventListener("pointerup", stopDraggable);
+		};
+		const handleDraggablePointerdown = (event) => {
+			event.preventDefault();
+			state.dragging = true;
+			document.addEventListener("pointermove", handleDraggablePointermove);
+			document.addEventListener("pointerup", stopDraggable, { once: true });
+		};
+		onBeforeUnmount(stopDraggable);
+		const elDrawerProps = useProps(props, drawerProps, [
+			"modelValue",
+			"size",
+			"showClose",
+			"beforeClose"
+		]);
+		const elDrawerEmits = useEmits(drawerEmits, emit, [
+			"open",
+			"close",
+			"update:modelValue"
+		]);
+		useRender(() => createVNode(ElDrawer, mergeProps(elDrawerProps.value, elDrawerEmits.value, {
+			"ref": drawerRef,
+			"class": [
+				"fa-drawer",
+				`fa-drawer-${_globalSize.value}`,
+				{
+					"fa-drawer__fullscreen": state.fullscreen,
+					"fa-drawer__dragging": state.dragging
+				}
+			],
+			"modelValue": state.visible,
+			"onUpdate:modelValue": ($event) => state.visible = $event,
+			"size": state.size,
+			"showClose": false,
+			"beforeClose": handleBeforeClose
+		}), {
+			header: ({ titleId, titleClass }) => createVNode(Fragment, null, [
+				createVNode("div", {
+					"id": titleId,
+					"class": ["fa-drawer__header-title", titleClass]
+				}, [slots.title?.({
+					loading: state.loading,
+					close: handleCloseClick,
+					titleId,
+					titleClass
+				}) ?? props.title, slots.header?.({
+					loading: state.loading,
+					close: handleCloseClick,
+					titleId,
+					titleClass
+				})]),
+				props.showRefresh && createVNode("div", {
+					"title": "刷新",
+					"class": ["fa-drawer__header-icon", state.loading ? "fa__click__disabled fa__click__disabled__cursor " : "fa__hover__twinkle"],
+					"onClick": handleRefresh
+				}, [createVNode(ElIcon, { "class": "icon" }, { default: () => [createVNode(Refresh, null, null)] })]),
+				props.showFullscreen && createVNode("div", {
+					"title": state.fullscreen ? "关闭全屏显示" : "全屏显示",
+					"class": ["fa-drawer__header-icon", state.loading ? "fa__click__disabled fa__click__disabled__cursor " : "fa__hover__twinkle"],
+					"onClick": handleFullscreen
+				}, [createVNode(ElIcon, null, { default: () => [state.fullscreen ? createVNode(FullScreenExit, null, null) : createVNode(FullScreen, null, null)] })]),
+				props.showClose && createVNode("div", {
+					"title": "关闭",
+					"class": ["fa-drawer__header-icon", state.loading ? "fa__click__disabled fa__click__disabled__cursor " : "fa__hover__twinkle"],
+					"onClick": handleCloseClick
+				}, [createVNode(ElIcon, { "class": "icon" }, { default: () => [createVNode(Close, null, null)] })])
+			]),
+			default: () => createVNode(Fragment, null, [props.draggable && createVNode("div", {
+				"class": "fa-drawer__draggable",
+				"onPointerdown": handleDraggablePointerdown
+			}, null), withDirectives(createVNode(ElScrollbar, { "element-loading-text": "加载中..." }, { default: () => [!state.refreshing && slots.default?.(state)] }), [[resolveDirective("loading"), state.loading]])]),
+			...!props.hideFooter && { footer: () => [createVNode(Fragment, null, [
+				slots.footer?.({
+					loading: state.loading,
+					close: handleCloseClick
+				}),
+				props.showCloseButton && createVNode(ElButton, {
+					"disabled": state.loading,
+					"onClick": handleCloseClick
+				}, { default: () => [props.closeButtonText] }),
+				props.showConfirmButton && createVNode(ElButton, {
+					"loading": state.loading,
+					"loadingIcon": Eleme,
+					"disabled": props.disabledConfirmButton,
+					"type": "primary",
+					"onClick": handleConfirmClick
+				}, { default: () => [state.loading ? "加载中..." : props.confirmButtonText] })
+			])] }
+		}));
+		return useExpose(expose, {
+			/** @description 用于关闭 Drawer, 该方法会调用传入的 before-close 方法 */
+			handleClose: computed(() => drawerRef.value?.handleClose),
+			/** @description 加载状态 */
+			loading: computed(() => state.loading),
+			/** @description 是否显示 */
+			visible: computed(() => state.visible),
+			/** @description 打开弹窗 */
+			open: handleOpen,
+			/** @description 关闭弹窗 */
+			close: handleClose,
+			/** @description 刷新弹窗 */
+			refresh: handleRefresh,
+			/** @description 弹窗加载 */
+			doLoading: handleLoading
+		});
+	}
+});
+//#endregion
+export { drawer_default as default, faDrawerEmits, faDrawerProps };
+
+//# sourceMappingURL=drawer.mjs.map

package/dist/components/drawer/src/drawer.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer.mjs","names":["update:modelValue"],"sources":["../../../../src/components/drawer/src/drawer.tsx"],"sourcesContent":["import { Fragment, computed, defineComponent, nextTick, onBeforeUnmount, reactive, ref, watch } from \"vue\";\nimport { Close, Eleme, Refresh } from \"@element-plus/icons-vue\";\nimport { ElButton, ElDrawer, ElIcon, ElMessage, ElMessageBox, ElScrollbar, drawerEmits, drawerProps, useGlobalSize } from \"element-plus\";\nimport { FullScreen, FullScreenExit } from \"@fast-element-plus/icons-vue\";\nimport { isBoolean } from \"lodash-unified\";\nimport { callOptionalFunction, definePropType, makeSlots, useEmits, useExpose, useProps, useRender } from \"../../../utils\";\nimport type { VNode } from \"vue\";\n\n/** FaDrawer 的运行时 Props 定义。 */\nexport const faDrawerProps = {\n\t...drawerProps,\n\t/** @description whether to append Dialog itself to body. A nested Dialog should have this attribute set to `true` */\n\tappendToBody: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description enable dragging feature for Dialog */\n\tdraggable: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description destroy elements in Dialog when closed */\n\tdestroyOnClose: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 显示刷新按钮 */\n\tshowRefresh: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 显示全屏图标 */\n\tshowFullscreen: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 显示关闭按钮 */\n\tshowCloseButton: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 显示确认按钮 */\n\tshowConfirmButton: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** @description 禁用确认按钮 */\n\tdisabledConfirmButton: Boolean,\n\t/** @description 关闭按钮文字，默认取消 */\n\tcloseButtonText: {\n\t\ttype: String,\n\t\tdefault: \"取消\",\n\t},\n\t/** @description 确认按钮文字，默认确认 */\n\tconfirmButtonText: {\n\t\ttype: String,\n\t\tdefault: \"确认\",\n\t},\n\t/** @description 隐藏底部操作 */\n\thideFooter: Boolean,\n\t/** @description 显示关闭回调 */\n\tshowBeforeClose: Boolean,\n\t/** @description 打开之后 */\n\tafterOpen: {\n\t\ttype: definePropType<() => void>(Function),\n\t},\n};\n\n/** FaDrawer 的运行时 Emits 定义。 */\nexport const faDrawerEmits = {\n\t...drawerEmits,\n\t/** @description v-model 回调 */\n\t\"update:modelValue\": (value: boolean): boolean => isBoolean(value),\n\t/** @description 确认按钮点击事件 */\n\tconfirmClick: (): boolean => true,\n};\n\n/** FaDrawer 的插槽参数。 */\nexport interface FaDrawerSlots extends Record<string, unknown> {\n\t/** @description 默认内容插槽 */\n\tdefault: { loading: boolean };\n\t/** @description 头部插槽 */\n\theader: { loading: boolean; close: () => void; titleId: string; titleClass: string };\n\t/** @description 标题插槽 */\n\ttitle: { loading: boolean; close: () => void; titleId: string; titleClass: string };\n\t/** @description 底部插槽 */\n\tfooter: { loading: boolean; close: () => void };\n}\n\nexport default defineComponent({\n\tname: \"FaDrawer\",\n\tprops: faDrawerProps,\n\temits: faDrawerEmits,\n\tslots: makeSlots<FaDrawerSlots>(),\n\tsetup(props, { slots, emit, expose }) {\n\t\tconst _globalSize = useGlobalSize();\n\n\t\tconst state = reactive({\n\t\t\tloading: false,\n\t\t\tvisible: props.modelValue,\n\t\t\tfullscreen: false,\n\t\t\tsize: props.size ?? \"30%\",\n\t\t\tdragging: false,\n\t\t\trefreshing: false,\n\t\t});\n\n\t\tconst drawerRef = ref<InstanceType<typeof ElDrawer>>();\n\n\t\tlet cacheOpenFunction: (() => void | Promise<void>) | undefined;\n\n\t\tconst handleOpen = (openFunction?: () => void | Promise<void>): void => {\n\t\t\tstate.visible = true;\n\t\t\tcacheOpenFunction = openFunction;\n\t\t\tvoid nextTick(() => {\n\t\t\t\tstate.loading = true;\n\t\t\t\tvoid callOptionalFunction(props.afterOpen ?? openFunction)\n\t\t\t\t\t.then(() => {\n\t\t\t\t\t\temit(\"open\");\n\t\t\t\t\t})\n\t\t\t\t\t.catch((error) => {\n\t\t\t\t\t\t// 打开回调失败时保持原有的自动关闭行为，并将异常继续交给运行时。\n\t\t\t\t\t\tstate.visible = false;\n\t\t\t\t\t\tthrow error;\n\t\t\t\t\t})\n\t\t\t\t\t.finally(() => {\n\t\t\t\t\t\tstate.loading = false;\n\t\t\t\t\t});\n\t\t\t});\n\t\t};\n\n\t\tconst handleClose = (closeFunction?: () => void | Promise<void>): void => {\n\t\t\tstate.loading = true;\n\t\t\tvoid callOptionalFunction(closeFunction)\n\t\t\t\t.then(() => {\n\t\t\t\t\temit(\"close\");\n\t\t\t\t\tstate.visible = false;\n\t\t\t\t})\n\t\t\t\t.finally(() => {\n\t\t\t\t\tstate.loading = false;\n\t\t\t\t});\n\t\t};\n\n\t\tconst handleLoading = (loadingFunction: () => void | Promise<void>): void => {\n\t\t\tstate.loading = true;\n\t\t\tvoid callOptionalFunction(loadingFunction).finally(() => {\n\t\t\t\tstate.loading = false;\n\t\t\t});\n\t\t};\n\n\t\tconst handleRefresh = (): void => {\n\t\t\tstate.refreshing = true;\n\t\t\tstate.loading = true;\n\t\t\tsetTimeout(() => {\n\t\t\t\tstate.refreshing = false;\n\t\t\t\thandleOpen(cacheOpenFunction);\n\t\t\t\tElMessage.success(\"刷新成功\");\n\t\t\t}, 500);\n\t\t};\n\n\t\tconst handleBeforeClose = (done: () => void): void => {\n\t\t\tif (state.loading) return;\n\t\t\t// 解决 image 预览摁下 ese 会关闭弹窗的问题\n\t\t\tif (document.querySelector(\".el-image-viewer__wrapper\")) return;\n\n\t\t\tconst newDone = (): Promise<void> => {\n\t\t\t\t// 组件对外约定为无参数完成钩子，不采用 Element Plus 的 done 回调签名。\n\t\t\t\treturn callOptionalFunction(props.beforeClose as unknown as (() => void | PromiseLike<void>) | undefined).then(() => {\n\t\t\t\t\temit(\"close\");\n\t\t\t\t\tdone();\n\t\t\t\t});\n\t\t\t};\n\n\t\t\tif (props.showBeforeClose) {\n\t\t\t\t// 用户取消关闭属于正常分支，无需继续执行 beforeClose。\n\t\t\t\tvoid ElMessageBox.confirm(\"确定关闭？\", { type: \"warning\" }).then(() => newDone());\n\t\t\t} else {\n\t\t\t\tvoid newDone();\n\t\t\t}\n\t\t};\n\n\t\tconst handleFullscreen = (): void => {\n\t\t\tif (state.loading) return;\n\t\t\tstate.fullscreen = !state.fullscreen;\n\t\t};\n\n\t\tconst handleConfirmClick = (): void => {\n\t\t\tif (state.loading) return;\n\t\t\temit(\"confirmClick\");\n\t\t};\n\n\t\tconst handleCloseClick = (): void => {\n\t\t\tif (state.loading) return;\n\t\t\thandleClose();\n\t\t};\n\n\t\twatch(\n\t\t\t() => props.modelValue,\n\t\t\t(newValue) => {\n\t\t\t\tif (state.visible !== newValue) state.visible = newValue;\n\t\t\t}\n\t\t);\n\n\t\twatch(\n\t\t\t() => state.visible,\n\t\t\t(newValue) => {\n\t\t\t\tif (props.modelValue !== newValue) emit(\"update:modelValue\", newValue);\n\t\t\t}\n\t\t);\n\n\t\twatch(\n\t\t\t() => props.size,\n\t\t\t(newValue) => {\n\t\t\t\tif (newValue !== undefined) state.size = newValue;\n\t\t\t}\n\t\t);\n\n\t\tconst handleDraggablePointermove = (event: PointerEvent): void => {\n\t\t\tconst horizontal = props.direction === \"rtl\" || props.direction === \"ltr\";\n\t\t\tconst viewportSize = horizontal ? document.documentElement.clientWidth : document.documentElement.clientHeight;\n\t\t\tlet nextSize: number;\n\t\t\tswitch (props.direction) {\n\t\t\t\tcase \"ltr\":\n\t\t\t\t\tnextSize = event.clientX;\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"ttb\":\n\t\t\t\t\tnextSize = event.clientY;\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"btt\":\n\t\t\t\t\tnextSize = viewportSize - event.clientY;\n\t\t\t\t\tbreak;\n\t\t\t\tdefault:\n\t\t\t\t\tnextSize = viewportSize - event.clientX;\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t\tstate.size = `${Math.min(Math.max(nextSize, viewportSize * 0.2), viewportSize * 0.95).toString()}px`;\n\t\t};\n\n\t\tconst stopDraggable = (): void => {\n\t\t\tstate.dragging = false;\n\t\t\tdocument.removeEventListener(\"pointermove\", handleDraggablePointermove);\n\t\t\tdocument.removeEventListener(\"pointerup\", stopDraggable);\n\t\t};\n\n\t\tconst handleDraggablePointerdown = (event: PointerEvent): void => {\n\t\t\tevent.preventDefault();\n\t\t\tstate.dragging = true;\n\t\t\tdocument.addEventListener(\"pointermove\", handleDraggablePointermove);\n\t\t\tdocument.addEventListener(\"pointerup\", stopDraggable, { once: true });\n\t\t};\n\n\t\tonBeforeUnmount(stopDraggable);\n\n\t\tconst elDrawerProps = useProps(props, drawerProps, [\"modelValue\", \"size\", \"showClose\", \"beforeClose\"]);\n\t\t// open、close 是 Fast 异步业务流程完成事件，不直接透传 Element Plus 的同名生命周期事件。\n\t\tconst elDrawerEmits = useEmits(drawerEmits, emit, [\"open\", \"close\", \"update:modelValue\"]);\n\n\t\tuseRender(() => (\n\t\t\t<ElDrawer\n\t\t\t\t{...elDrawerProps.value}\n\t\t\t\t{...elDrawerEmits.value}\n\t\t\t\tref={drawerRef}\n\t\t\t\tclass={[\n\t\t\t\t\t\"fa-drawer\",\n\t\t\t\t\t`fa-drawer-${_globalSize.value}`,\n\t\t\t\t\t{ \"fa-drawer__fullscreen\": state.fullscreen, \"fa-drawer__dragging\": state.dragging },\n\t\t\t\t]}\n\t\t\t\tvModel={state.visible}\n\t\t\t\tsize={state.size}\n\t\t\t\tshowClose={false}\n\t\t\t\tbeforeClose={handleBeforeClose}\n\t\t\t>\n\t\t\t\t{{\n\t\t\t\t\theader: ({ titleId, titleClass }: { close: () => void; titleId: string; titleClass: string }) => (\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t<div id={titleId} class={[\"fa-drawer__header-title\", titleClass]}>\n\t\t\t\t\t\t\t\t{slots.title?.({ loading: state.loading, close: handleCloseClick, titleId, titleClass }) ?? props.title}\n\t\t\t\t\t\t\t\t{slots.header?.({ loading: state.loading, close: handleCloseClick, titleId, titleClass })}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t{props.showRefresh && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\ttitle=\"刷新\"\n\t\t\t\t\t\t\t\t\tclass={[\n\t\t\t\t\t\t\t\t\t\t\"fa-drawer__header-icon\",\n\t\t\t\t\t\t\t\t\t\tstate.loading ? \"fa__click__disabled fa__click__disabled__cursor \" : \"fa__hover__twinkle\",\n\t\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t\t\tonClick={handleRefresh}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ElIcon class=\"icon\">\n\t\t\t\t\t\t\t\t\t\t<Refresh />\n\t\t\t\t\t\t\t\t\t</ElIcon>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{props.showFullscreen && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\ttitle={state.fullscreen ? \"关闭全屏显示\" : \"全屏显示\"}\n\t\t\t\t\t\t\t\t\tclass={[\n\t\t\t\t\t\t\t\t\t\t\"fa-drawer__header-icon\",\n\t\t\t\t\t\t\t\t\t\tstate.loading ? \"fa__click__disabled fa__click__disabled__cursor \" : \"fa__hover__twinkle\",\n\t\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t\t\tonClick={handleFullscreen}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ElIcon>{state.fullscreen ? <FullScreenExit /> : <FullScreen />}</ElIcon>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{props.showClose && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\ttitle=\"关闭\"\n\t\t\t\t\t\t\t\t\tclass={[\n\t\t\t\t\t\t\t\t\t\t\"fa-drawer__header-icon\",\n\t\t\t\t\t\t\t\t\t\tstate.loading ? \"fa__click__disabled fa__click__disabled__cursor \" : \"fa__hover__twinkle\",\n\t\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t\t\tonClick={handleCloseClick}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ElIcon class=\"icon\">\n\t\t\t\t\t\t\t\t\t\t<Close />\n\t\t\t\t\t\t\t\t\t</ElIcon>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t),\n\t\t\t\t\tdefault: () => (\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t{props.draggable && <div class=\"fa-drawer__draggable\" onPointerdown={handleDraggablePointerdown} />}\n\t\t\t\t\t\t\t<ElScrollbar vLoading={state.loading} element-loading-text=\"加载中...\">\n\t\t\t\t\t\t\t\t{!state.refreshing && slots.default?.(state)}\n\t\t\t\t\t\t\t</ElScrollbar>\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t),\n\t\t\t\t\t...(!props.hideFooter && {\n\t\t\t\t\t\tfooter: (): VNode[] => [\n\t\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t\t{slots.footer?.({ loading: state.loading, close: handleCloseClick })}\n\t\t\t\t\t\t\t\t{props.showCloseButton && (\n\t\t\t\t\t\t\t\t\t<ElButton disabled={state.loading} onClick={handleCloseClick}>\n\t\t\t\t\t\t\t\t\t\t{props.closeButtonText}\n\t\t\t\t\t\t\t\t\t</ElButton>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{props.showConfirmButton && (\n\t\t\t\t\t\t\t\t\t<ElButton\n\t\t\t\t\t\t\t\t\t\tloading={state.loading}\n\t\t\t\t\t\t\t\t\t\tloadingIcon={Eleme}\n\t\t\t\t\t\t\t\t\t\tdisabled={props.disabledConfirmButton}\n\t\t\t\t\t\t\t\t\t\ttype=\"primary\"\n\t\t\t\t\t\t\t\t\t\tonClick={handleConfirmClick}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{state.loading ? \"加载中...\" : props.confirmButtonText}\n\t\t\t\t\t\t\t\t\t</ElButton>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</Fragment>,\n\t\t\t\t\t\t],\n\t\t\t\t\t}),\n\t\t\t\t}}\n\t\t\t</ElDrawer>\n\t\t));\n\n\t\treturn useExpose(expose, {\n\t\t\t/** @description 用于关闭 Drawer, 该方法会调用传入的 before-close 方法 */\n\t\t\thandleClose: computed(() => drawerRef.value?.handleClose),\n\t\t\t/** @description 加载状态 */\n\t\t\tloading: computed(() => state.loading),\n\t\t\t/** @description 是否显示 */\n\t\t\tvisible: computed(() => state.visible),\n\t\t\t/** @description 打开弹窗 */\n\t\t\topen: handleOpen,\n\t\t\t/** @description 关闭弹窗 */\n\t\t\tclose: handleClose,\n\t\t\t/** @description 刷新弹窗 */\n\t\t\trefresh: handleRefresh,\n\t\t\t/** @description 弹窗加载 */\n\t\t\tdoLoading: handleLoading,\n\t\t});\n\t},\n});\n"],"mappings":";;;;;;;;;;;;;AASA,MAAa,gBAAgB;CAC5B,GAAG;;CAEH,cAAc;EACb,MAAM;EACN,SAAS;CACV;;CAEA,WAAW;EACV,MAAM;EACN,SAAS;CACV;;CAEA,gBAAgB;EACf,MAAM;EACN,SAAS;CACV;;CAEA,aAAa;EACZ,MAAM;EACN,SAAS;CACV;;CAEA,gBAAgB;EACf,MAAM;EACN,SAAS;CACV;;CAEA,iBAAiB;EAChB,MAAM;EACN,SAAS;CACV;;CAEA,mBAAmB;EAClB,MAAM;EACN,SAAS;CACV;;CAEA,uBAAuB;;CAEvB,iBAAiB;EAChB,MAAM;EACN,SAAS;CACV;;CAEA,mBAAmB;EAClB,MAAM;EACN,SAAS;CACV;;CAEA,YAAY;;CAEZ,iBAAiB;;CAEjB,WAAW,EACV,MAAM,eAA2B,QAAQ,EAC1C;AACD;;AAGA,MAAa,gBAAgB;CAC5B,GAAG;;CAEH,sBAAsB,UAA4B,UAAU,KAAK;;CAEjE,oBAA6B;AAC9B;AAcA,IAAA,iBAAe,gBAAgB;CAC9B,MAAM;CACN,OAAO;CACP,OAAO;CACP,OAAO,UAAyB;CAChC,MAAM,OAAO,EAAE,OAAO,MAAM,UAAU;EACrC,MAAM,cAAc,cAAc;EAElC,MAAM,QAAQ,SAAS;GACtB,SAAS;GACT,SAAS,MAAM;GACf,YAAY;GACZ,MAAM,MAAM,QAAQ;GACpB,UAAU;GACV,YAAY;EACb,CAAC;EAED,MAAM,YAAY,IAAmC;EAErD,IAAI;EAEJ,MAAM,cAAc,iBAAoD;GACvE,MAAM,UAAU;GAChB,oBAAoB;GACpB,eAAoB;IACnB,MAAM,UAAU;IAChB,qBAA0B,MAAM,aAAa,YAAY,CAAC,CACxD,WAAW;KACX,KAAK,MAAM;IACZ,CAAC,CAAC,CACD,OAAO,UAAU;KAEjB,MAAM,UAAU;KAChB,MAAM;IACP,CAAC,CAAC,CACD,cAAc;KACd,MAAM,UAAU;IACjB,CAAC;GACH,CAAC;EACF;EAEA,MAAM,eAAe,kBAAqD;GACzE,MAAM,UAAU;GAChB,qBAA0B,aAAa,CAAC,CACtC,WAAW;IACX,KAAK,OAAO;IACZ,MAAM,UAAU;GACjB,CAAC,CAAC,CACD,cAAc;IACd,MAAM,UAAU;GACjB,CAAC;EACH;EAEA,MAAM,iBAAiB,oBAAsD;GAC5E,MAAM,UAAU;GAChB,qBAA0B,eAAe,CAAC,CAAC,cAAc;IACxD,MAAM,UAAU;GACjB,CAAC;EACF;EAEA,MAAM,sBAA4B;GACjC,MAAM,aAAa;GACnB,MAAM,UAAU;GAChB,iBAAiB;IAChB,MAAM,aAAa;IACnB,WAAW,iBAAiB;IAC5B,UAAU,QAAQ,MAAM;GACzB,GAAG,GAAG;EACP;EAEA,MAAM,qBAAqB,SAA2B;GACrD,IAAI,MAAM,SAAS;GAEnB,IAAI,SAAS,cAAc,2BAA2B,GAAG;GAEzD,MAAM,gBAA+B;IAEpC,OAAO,qBAAqB,MAAM,WAAsE,CAAC,CAAC,WAAW;KACpH,KAAK,OAAO;KACZ,KAAK;IACN,CAAC;GACF;GAEA,IAAI,MAAM,iBAET,aAAkB,QAAQ,SAAS,EAAE,MAAM,UAAU,CAAC,CAAC,CAAC,WAAW,QAAQ,CAAC;QAE5E,QAAa;EAEf;EAEA,MAAM,yBAA+B;GACpC,IAAI,MAAM,SAAS;GACnB,MAAM,aAAa,CAAC,MAAM;EAC3B;EAEA,MAAM,2BAAiC;GACtC,IAAI,MAAM,SAAS;GACnB,KAAK,cAAc;EACpB;EAEA,MAAM,yBAA+B;GACpC,IAAI,MAAM,SAAS;GACnB,YAAY;EACb;EAEA,YACO,MAAM,aACX,aAAa;GACb,IAAI,MAAM,YAAY,UAAU,MAAM,UAAU;EACjD,CACD;EAEA,YACO,MAAM,UACX,aAAa;GACb,IAAI,MAAM,eAAe,UAAU,KAAK,qBAAqB,QAAQ;EACtE,CACD;EAEA,YACO,MAAM,OACX,aAAa;GACb,IAAI,aAAa,KAAA,GAAW,MAAM,OAAO;EAC1C,CACD;EAEA,MAAM,8BAA8B,UAA8B;GAEjE,MAAM,eADa,MAAM,cAAc,SAAS,MAAM,cAAc,QAClC,SAAS,gBAAgB,cAAc,SAAS,gBAAgB;GAClG,IAAI;GACJ,QAAQ,MAAM,WAAd;IACC,KAAK;KACJ,WAAW,MAAM;KACjB;IACD,KAAK;KACJ,WAAW,MAAM;KACjB;IACD,KAAK;KACJ,WAAW,eAAe,MAAM;KAChC;IACD,SACC,WAAW,eAAe,MAAM;GAElC;GACA,MAAM,OAAO,GAAG,KAAK,IAAI,KAAK,IAAI,UAAU,eAAe,EAAG,GAAG,eAAe,GAAI,CAAC,CAAC,SAAS,EAAC;EACjG;EAEA,MAAM,sBAA4B;GACjC,MAAM,WAAW;GACjB,SAAS,oBAAoB,eAAe,0BAA0B;GACtE,SAAS,oBAAoB,aAAa,aAAa;EACxD;EAEA,MAAM,8BAA8B,UAA8B;GACjE,MAAM,eAAe;GACrB,MAAM,WAAW;GACjB,SAAS,iBAAiB,eAAe,0BAA0B;GACnE,SAAS,iBAAiB,aAAa,eAAe,EAAE,MAAM,KAAK,CAAC;EACrE;EAEA,gBAAgB,aAAa;EAE7B,MAAM,gBAAgB,SAAS,OAAO,aAAa;GAAC;GAAc;GAAQ;GAAa;EAAa,CAAC;EAErG,MAAM,gBAAgB,SAAS,aAAa,MAAM;GAAC;GAAQ;GAAS;EAAmB,CAAC;EAExF,gBAAU,YAAA,UAAA,WAEJ,cAAc,OACd,cAAc,OAAK;GAAA,OAClB;GAAS,SACP;IACN;IACA,aAAa,YAAY;IACzB;KAAE,yBAAyB,MAAM;KAAY,uBAAuB,MAAM;IAAS;GAAC;GACpF,cACO,MAAM;GAAO,wBAAA,WAAb,MAAM,UAAO;GAAA,QACf,MAAM;GAAI,aACL;GAAK,eACH;EAAiB,CAAA,GAAA;GAG7B,SAAS,EAAE,SAAS,iBAAwE,YAAA,UAAA,MAAA;IAAA,YAAA,OAAA;KAAA,MAEjF;KAAO,SAAS,CAAC,2BAA2B,UAAU;IAAC,GAAA,CAC9D,MAAM,QAAQ;KAAE,SAAS,MAAM;KAAS,OAAO;KAAkB;KAAS;IAAW,CAAC,KAAK,MAAM,OACjG,MAAM,SAAS;KAAE,SAAS,MAAM;KAAS,OAAO;KAAkB;KAAS;IAAW,CAAC,CAAC,CAAA;IAEzF,MAAM,eAAW,YAAA,OAAA;KAAA,SAAA;KAAA,SAGT,CACN,0BACA,MAAM,UAAU,qDAAqD,oBAAoB;KACzF,WACQ;IAAa,GAAA,CAAA,YAAA,QAAA,EAAA,SAAA,OAAA,GAAA,EAAA,eAAA,CAAA,YAAA,SAAA,MAAA,IAAA,CAAA,EAAA,CAAA,CAAA,CAAA;IAOvB,MAAM,kBAAc,YAAA,OAAA;KAAA,SAEZ,MAAM,aAAa,WAAW;KAAM,SACpC,CACN,0BACA,MAAM,UAAU,qDAAqD,oBAAoB;KACzF,WACQ;IAAgB,GAAA,CAAA,YAAA,QAAA,MAAA,EAAA,eAAA,CAEhB,MAAM,aAAU,YAAA,gBAAA,MAAA,IAAA,IAAA,YAAA,YAAA,MAAA,IAAA,CAAsC,EAAA,CAAA,CAAA,CAAA;IAGhE,MAAM,aAAS,YAAA,OAAA;KAAA,SAAA;KAAA,SAGP,CACN,0BACA,MAAM,UAAU,qDAAqD,oBAAoB;KACzF,WACQ;IAAgB,GAAA,CAAA,YAAA,QAAA,EAAA,SAAA,OAAA,GAAA,EAAA,eAAA,CAAA,YAAA,OAAA,MAAA,IAAA,CAAA,EAAA,CAAA,CAAA,CAAA;GAM1B,CAAA;GAGH,eAAS,YAAA,UAAA,MAAA,CAEN,MAAM,aAAS,YAAA,OAAA;IAAA,SAAA;IAAA,iBAAqD;GAA0B,GAAA,IAAA,GAAI,eAAA,YAAA,aAAA,EAAA,wBAAA,SAAA,GAAA,EAAA,eAAA,CAEjG,CAAC,MAAM,cAAc,MAAM,UAAU,KAAK,CAAC,EAAA,CAAA,GAAA,CAAA,CAAA,iBAAA,SAAA,GADtB,MAAM,OAAO,CAAA,CAAA,CAAA,CAAA;GAKtC,GAAI,CAAC,MAAM,cAAc,EACxB,cAAuB,CAAA,YAAA,UAAA,MAAA;IAEpB,MAAM,SAAS;KAAE,SAAS,MAAM;KAAS,OAAO;IAAiB,CAAC;IAClE,MAAM,mBAAe,YAAA,UAAA;KAAA,YACD,MAAM;KAAO,WAAW;IAAgB,GAAA,EAAA,eAAA,CAC1D,MAAM,eAAe,EAAA,CAAA;IAGvB,MAAM,qBAAiB,YAAA,UAAA;KAAA,WAEb,MAAM;KAAO,eACT;KAAK,YACR,MAAM;KAAqB,QAAA;KAAA,WAE5B;IAAkB,GAAA,EAAA,eAAA,CAE1B,MAAM,UAAU,WAAW,MAAM,iBAAiB,EAAA,CAAA;GAEpD,CAAA,CAAA,EAGJ;EAAE,CAAA,CAGJ;EAED,OAAO,UAAU,QAAQ;;GAExB,aAAa,eAAe,UAAU,OAAO,WAAW;;GAExD,SAAS,eAAe,MAAM,OAAO;;GAErC,SAAS,eAAe,MAAM,OAAO;;GAErC,MAAM;;GAEN,OAAO;;GAEP,SAAS;;GAET,WAAW;EACZ,CAAC;CACF;AACD,CAAC"}

package/dist/components/form/index.d.ts

@@ -0,0 +1,23 @@
+import Form, { faFormEmits, faFormProps } from "./src/form";
+import FormItem, { faFormItemProps } from "./src/formItem";
+import type { TSXWithInstall } from "../../utils";
+import type { ExtractPropTypes } from "vue";
+/** 支持响应式布局和表单项配置的业务表单组件。 */
+export declare const FaForm: TSXWithInstall<typeof Form> & {
+    FormItem: typeof FormItem;
+};
+export default FaForm;
+/** 可独立注册的 FaForm 表单项组件。 */
+export declare const FaFormItem: TSXWithInstall<typeof FormItem>;
+export { faFormEmits, faFormProps, faFormItemProps };
+export type { FaFormSlots } from "./src/form";
+export type { FaFormItemSlots } from "./src/formItem";
+/** FaForm 暴露的组件实例类型。 */
+export type FaFormInstance = InstanceType<typeof Form>;
+/** FaForm 的完整 Props 类型。 */
+export type FaFormProps = ExtractPropTypes<typeof faFormProps>;
+/** FaFormItem 暴露的组件实例类型。 */
+export type FaFormItemInstance = InstanceType<typeof FormItem>;
+/** FaFormItem 的完整 Props 类型。 */
+export type FaFormItemProps = ExtractPropTypes<typeof faFormItemProps>;
+export * from "./utils/form";

package/dist/components/form/index.mjs

@@ -0,0 +1,13 @@
+import { withInstall, withNoopInstall } from "../../utils/vue/install.mjs";
+import { formUtil } from "./utils/form.mjs";
+import form_default, { faFormEmits, faFormProps } from "./src/form.mjs";
+import formItem_default, { faFormItemProps } from "./src/formItem.mjs";
+//#region src/components/form/index.ts
+/** 支持响应式布局和表单项配置的业务表单组件。 */
+const FaForm = withInstall(form_default, { FormItem: formItem_default });
+/** 可独立注册的 FaForm 表单项组件。 */
+const FaFormItem = withNoopInstall(formItem_default);
+//#endregion
+export { FaForm, FaForm as default, FaFormItem, faFormEmits, faFormItemProps, faFormProps, formUtil };
+
+//# sourceMappingURL=index.mjs.map

package/dist/components/form/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["Form","FormItem"],"sources":["../../../src/components/form/index.ts"],"sourcesContent":["import { withInstall, withNoopInstall } from \"../../utils\";\nimport Form, { faFormEmits, faFormProps } from \"./src/form\";\nimport FormItem, { faFormItemProps } from \"./src/formItem\";\nimport type { TSXWithInstall } from \"../../utils\";\nimport type { ExtractPropTypes } from \"vue\";\n\n/** 支持响应式布局和表单项配置的业务表单组件。 */\nexport const FaForm: TSXWithInstall<typeof Form> & { FormItem: typeof FormItem } = withInstall(Form, {\n\tFormItem,\n});\nexport default FaForm;\n\n/** 可独立注册的 FaForm 表单项组件。 */\nexport const FaFormItem: TSXWithInstall<typeof FormItem> = withNoopInstall(FormItem);\n\nexport { faFormEmits, faFormProps, faFormItemProps };\nexport type { FaFormSlots } from \"./src/form\";\nexport type { FaFormItemSlots } from \"./src/formItem\";\n\n/** FaForm 暴露的组件实例类型。 */\nexport type FaFormInstance = InstanceType<typeof Form>;\n\n/** FaForm 的完整 Props 类型。 */\nexport type FaFormProps = ExtractPropTypes<typeof faFormProps>;\n\n/** FaFormItem 暴露的组件实例类型。 */\nexport type FaFormItemInstance = InstanceType<typeof FormItem>;\n\n/** FaFormItem 的完整 Props 类型。 */\nexport type FaFormItemProps = ExtractPropTypes<typeof faFormItemProps>;\n\nexport * from \"./utils/form\";\n"],"mappings":";;;;;;AAOA,MAAa,SAAsE,YAAYA,cAAM,EACpG,UAAA,iBACD,CAAC;;AAID,MAAa,aAA8C,gBAAgBC,gBAAQ"}

package/dist/components/form/src/form.d.ts

@@ -0,0 +1,208 @@
+import type { FaLayoutGridBreakPoint } from "../../layoutGrid";
+import type { FormItemContext, FormValidateCallback, FormValidationResult } from "element-plus";
+/** FaForm 的运行时 Props 定义。 */
+export declare const faFormProps: {
+    /** @description Width of label, e.g. `'50px'`. All its direct child form items will inherit this value. `auto` is supported. */
+    labelWidth: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    /** @description Suffix of the label. */
+    labelSuffix: {
+        type: StringConstructor;
+        default: string;
+    };
+    /** @description When validation fails, scroll to the first error form entry. */
+    scrollToError: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** @description 详情From，会删除 FormItem 的 paddinfa-bottom */
+    detailForm: BooleanConstructor;
+    /** @description Grid布局*/
+    grid: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** @description Grid布局列配置 */
+    cols: {
+        type: import("vue").PropType<string | number | Record<FaLayoutGridBreakPoint, number>>;
+        default: () => Record<FaLayoutGridBreakPoint, number>;
+    };
+    model: ObjectConstructor;
+    rules: {
+        readonly type: import("vue").PropType<Partial<Record<string, Record<string, any> | import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>>>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    labelPosition: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<StringConstructor, "left" | "right" | "top", unknown, "right", boolean>;
+    requireAsteriskPosition: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<StringConstructor, "left" | "right", unknown, "left", boolean>;
+    inline: BooleanConstructor;
+    inlineMessage: BooleanConstructor;
+    statusIcon: BooleanConstructor;
+    showMessage: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    validateOnRuleChange: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    hideRequiredAsterisk: BooleanConstructor;
+    scrollIntoViewOptions: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<(new (...args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions) | (((new (...args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions)) | null)[], unknown, unknown, true, boolean>;
+    size: {
+        readonly type: import("vue").PropType<import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    disabled: BooleanConstructor;
+};
+/** FaForm 的运行时事件定义。 */
+export declare const faFormEmits: {
+    validate: (prop: import("element-plus").FormItemProp, isValid: boolean, message: string) => boolean;
+};
+/** FaForm 的插槽参数。 */
+export interface FaFormSlots extends Record<string, unknown> {
+    /** @description 默认内容插槽 */
+    default: unknown;
+}
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    /** @description Width of label, e.g. `'50px'`. All its direct child form items will inherit this value. `auto` is supported. */
+    labelWidth: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    /** @description Suffix of the label. */
+    labelSuffix: {
+        type: StringConstructor;
+        default: string;
+    };
+    /** @description When validation fails, scroll to the first error form entry. */
+    scrollToError: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** @description 详情From，会删除 FormItem 的 paddinfa-bottom */
+    detailForm: BooleanConstructor;
+    /** @description Grid布局*/
+    grid: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** @description Grid布局列配置 */
+    cols: {
+        type: import("vue").PropType<string | number | Record<FaLayoutGridBreakPoint, number>>;
+        default: () => Record<FaLayoutGridBreakPoint, number>;
+    };
+    model: ObjectConstructor;
+    rules: {
+        readonly type: import("vue").PropType<Partial<Record<string, Record<string, any> | import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>>>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    labelPosition: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<StringConstructor, "left" | "right" | "top", unknown, "right", boolean>;
+    requireAsteriskPosition: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<StringConstructor, "left" | "right", unknown, "left", boolean>;
+    inline: BooleanConstructor;
+    inlineMessage: BooleanConstructor;
+    statusIcon: BooleanConstructor;
+    showMessage: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    validateOnRuleChange: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    hideRequiredAsterisk: BooleanConstructor;
+    scrollIntoViewOptions: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<(new (...args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions) | (((new (...args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions)) | null)[], unknown, unknown, true, boolean>;
+    size: {
+        readonly type: import("vue").PropType<import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    disabled: BooleanConstructor;
+}>, {
+    /** @description 对整个表单的内容进行验证。 接收一个回调函数，或返回 Promise。 */
+    validate: (callback?: FormValidateCallback) => FormValidationResult;
+    /** @description 验证具体的某个字段。 */
+    validateField: import("vue").ComputedRef<((props?: import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemProp>, callback?: FormValidateCallback) => FormValidationResult) | undefined>;
+    /** @description 重置该表单项，将其值重置为初始值，并移除校验结果 */
+    resetFields: import("vue").ComputedRef<((props?: import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemProp>) => void) | undefined>;
+    /** @description 清理某个字段的表单验证信息。 */
+    clearValidate: import("vue").ComputedRef<((props?: import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemProp>) => void) | undefined>;
+    /** @description 滚动到指定的字段 */
+    scrollToField: import("vue").ComputedRef<((prop: import("element-plus").FormItemProp) => void) | undefined>;
+    /** @description 获取所有字段的 context */
+    fields: import("vue").ComputedRef<FormItemContext[]>;
+    /** @description 获取指定字段的 context。 */
+    getField: import("vue").ComputedRef<((prop: import("element-plus").FormItemProp) => FormItemContext | undefined) | undefined>;
+    /** @description 设置表单字段的初始值。 */
+    setInitialValues: import("vue").ComputedRef<((initModel: Record<string, any>) => void) | undefined>;
+    /** @description 对整个表单的内容进行验证，带滚动。 接收一个回调函数，或返回 Promise。 */
+    validateScrollToField: () => FormValidationResult;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    validate: (prop: import("element-plus").FormItemProp, isValid: boolean, message: string) => boolean;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /** @description Width of label, e.g. `'50px'`. All its direct child form items will inherit this value. `auto` is supported. */
+    labelWidth: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    /** @description Suffix of the label. */
+    labelSuffix: {
+        type: StringConstructor;
+        default: string;
+    };
+    /** @description When validation fails, scroll to the first error form entry. */
+    scrollToError: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** @description 详情From，会删除 FormItem 的 paddinfa-bottom */
+    detailForm: BooleanConstructor;
+    /** @description Grid布局*/
+    grid: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** @description Grid布局列配置 */
+    cols: {
+        type: import("vue").PropType<string | number | Record<FaLayoutGridBreakPoint, number>>;
+        default: () => Record<FaLayoutGridBreakPoint, number>;
+    };
+    model: ObjectConstructor;
+    rules: {
+        readonly type: import("vue").PropType<Partial<Record<string, Record<string, any> | import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>>>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    labelPosition: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<StringConstructor, "left" | "right" | "top", unknown, "right", boolean>;
+    requireAsteriskPosition: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<StringConstructor, "left" | "right", unknown, "left", boolean>;
+    inline: BooleanConstructor;
+    inlineMessage: BooleanConstructor;
+    statusIcon: BooleanConstructor;
+    showMessage: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    validateOnRuleChange: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    hideRequiredAsterisk: BooleanConstructor;
+    scrollIntoViewOptions: import("element-plus/es/utils/vue/props/types.mjs").EpPropFinalized<(new (...args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions) | (((new (...args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions)) | null)[], unknown, unknown, true, boolean>;
+    size: {
+        readonly type: import("vue").PropType<import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    disabled: BooleanConstructor;
+}>> & Readonly<{
+    onValidate?: ((prop: import("element-plus").FormItemProp, isValid: boolean, message: string) => any) | undefined;
+}>, {
+    disabled: boolean;
+    grid: boolean;
+    cols: string | number | Record<FaLayoutGridBreakPoint, number>;
+    inline: boolean;
+    labelPosition: import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<StringConstructor, "top" | "left" | "right", unknown>;
+    requireAsteriskPosition: import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<StringConstructor, "left" | "right", unknown>;
+    labelWidth: string | number;
+    labelSuffix: string;
+    inlineMessage: boolean;
+    statusIcon: boolean;
+    showMessage: import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+    validateOnRuleChange: import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+    hideRequiredAsterisk: boolean;
+    scrollToError: boolean;
+    scrollIntoViewOptions: import("element-plus/es/utils/vue/props/types.mjs").EpPropMergeType<(new (...args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions) | ((new (...args: any[]) => boolean | ScrollIntoViewOptions) | (() => boolean | ScrollIntoViewOptions) | null)[], unknown, unknown>;
+    detailForm: boolean;
+}, import("../../../utils").TypedSlotsDeclaration<FaFormSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;