fast-element-plus 1.0.21 → 2.0.1

package/dist/components/inputDialogPage/src/inputDialogPage.mjs

@@ -0,0 +1,151 @@
+import { useExpose } from "../../../utils/vue/expose.mjs";
+import { definePropType } from "../../../utils/vue/props.mjs";
+import { useRender } from "../../../utils/vue/render.mjs";
+import { makeSlots } from "../../../utils/vue/slots.mjs";
+import { withDefineType } from "../../../utils/vue/with.mjs";
+import { FaDialog } from "../../dialog/index.mjs";
+import { FaTable } from "../../table/index.mjs";
+import { computed, createVNode, defineComponent, reactive, ref } from "vue";
+import { Delete, Search } from "@element-plus/icons-vue";
+import { ElButton, ElButtonGroup, ElInput } from "element-plus";
+import { isFunction, isNull, isNumber, isString } from "lodash-unified";
+import { useVModel } from "@vueuse/core";
+//#region src/components/inputDialogPage/src/inputDialogPage.tsx
+/** FaInputDialogPage 的运行时 Props 定义。 */
+const faInputDialogPageProps = {
+	/** @description key of row data, used for optimizing rendering. Required if `reserve-selection` is on or display tree data. When its type is String, multi-level access is supported, e.g. `user.info.id`, but `user.info[0].id` is not supported, in which case `Function` should be used */
+	rowKey: {
+		type: [String, Function],
+		default: "id"
+	},
+	/** @description v-model绑定值 */
+	modelValue: [String, Number],
+	/** @description v-model:label绑定值 */
+	label: String,
+	/** @description 输入框占位文本 */
+	placeholder: {
+		type: String,
+		default: "请选择"
+	},
+	/** @description 禁用 */
+	disabled: Boolean,
+	/** @description 标题 */
+	title: String,
+	/** @description 请求api */
+	requestApi: { type: definePropType(Function) },
+	/** 初始化参数 */
+	initParam: definePropType([
+		String,
+		Number,
+		Object
+	]),
+	/** @description 显示文本 Key */
+	labelKey: {
+		type: String,
+		default: "name"
+	}
+};
+/** FaInputDialogPage 的运行时 Emits 定义。 */
+const faInputDialogPageEmits = {
+	/** @description v-model 回调 */
+	"update:modelValue": (value) => isString(value) || isNumber(value) || isNull(value),
+	/** @description v-model:label 回调 */
+	"update:label": (value) => isString(value) || isNull(value),
+	/** @description 改变 */
+	change: (_data, _value) => true
+};
+var inputDialogPage_default = defineComponent({
+	name: "FaInputDialogPage",
+	props: faInputDialogPageProps,
+	emits: faInputDialogPageEmits,
+	slots: makeSlots(),
+	setup(props, { slots, emit, expose }) {
+		const modelValue = useVModel(props, "modelValue", emit, { passive: true });
+		const selectedLabel = useVModel(props, "label", emit, { passive: true });
+		const state = reactive({ selectionRow: withDefineType() });
+		const faDialogRef = ref();
+		const faTableRef = ref();
+		const handleDeleteClick = () => {
+			modelValue.value = null;
+			selectedLabel.value = null;
+			emit("change", null);
+		};
+		const handleSearchClick = () => {
+			faDialogRef.value?.open(() => {
+				const table = faTableRef.value;
+				if (table === void 0) return;
+				if (state.selectionRow) {
+					const rawRowKey = isFunction(props.rowKey) ? props.rowKey(state.selectionRow) : state.selectionRow[props.rowKey];
+					if (!((typeof rawRowKey === "string" || typeof rawRowKey === "number") && table.selectedListIds.includes(rawRowKey))) table.toggleRowSelection?.(state.selectionRow);
+				}
+			});
+		};
+		const handleConfirmClick = () => {
+			faDialogRef.value?.close(() => {
+				const table = faTableRef.value;
+				const selectedData = table?.selectedList[0];
+				if (table?.selected && selectedData) {
+					const selectedValue = isFunction(props.rowKey) ? props.rowKey(selectedData) : selectedData[props.rowKey];
+					modelValue.value = typeof selectedValue === "string" || typeof selectedValue === "number" ? selectedValue : null;
+					const label = selectedData[props.labelKey];
+					selectedLabel.value = typeof label === "string" ? label : null;
+					emit("change", selectedData, modelValue.value);
+				} else {
+					modelValue.value = null;
+					selectedLabel.value = null;
+					emit("change", null, null);
+				}
+			});
+		};
+		const handleTableRowDblclick = (row) => {
+			faTableRef.value?.clearSelection?.();
+			faTableRef.value?.toggleRowSelection?.(row);
+			state.selectionRow = row;
+			handleConfirmClick();
+		};
+		useRender(() => createVNode("div", { "class": "fa-input-dialog-page" }, [createVNode(ElInput, {
+			"modelValue": selectedLabel.value,
+			"onUpdate:modelValue": ($event) => selectedLabel.value = $event,
+			"placeholder": props.placeholder,
+			"disabled": props.disabled,
+			"readonly": true
+		}, { append: () => createVNode(ElButtonGroup, null, { default: () => [createVNode(ElButton, {
+			"disabled": props.disabled,
+			"icon": Delete,
+			"onClick": handleDeleteClick
+		}, null), createVNode(ElButton, {
+			"disabled": props.disabled,
+			"icon": Search,
+			"onClick": handleSearchClick
+		}, null)] }) }), createVNode(FaDialog, {
+			"ref": faDialogRef,
+			"style": "--height: 70%;",
+			"width": "50%",
+			"title": props.title,
+			"fullHeight": true,
+			"disabledConfirmButton": !faTableRef.value?.selected,
+			"onConfirmClick": handleConfirmClick
+		}, { default: () => [createVNode(FaTable, {
+			"ref": faTableRef,
+			"rowKey": props.rowKey,
+			"requestApi": props.requestApi,
+			"initParam": props.initParam,
+			"single": true,
+			"rowClickSelection": true,
+			"hideSearchTime": true,
+			"onRowDblclick": handleTableRowDblclick
+		}, { default: () => slots.default?.() })] })]));
+		return useExpose(expose, {
+			/** @description 选择行数据 */
+			selectionRow: computed(() => state.selectionRow),
+			/** @description 打开选择器弹窗 */
+			open: handleSearchClick,
+			/** @description 清除选择 */
+			clear: handleDeleteClick
+		});
+	}
+});
+//#endregion
+export { inputDialogPage_default as default, faInputDialogPageEmits, faInputDialogPageProps };
+
+//# sourceMappingURL=inputDialogPage.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"inputDialogPage.mjs","names":["update:modelValue","update:label"],"sources":["../../../../src/components/inputDialogPage/src/inputDialogPage.tsx"],"sourcesContent":["import { useVModel } from \"@vueuse/core\";\nimport { computed, defineComponent, reactive, ref } from \"vue\";\nimport { Delete, Search } from \"@element-plus/icons-vue\";\nimport { ElButton, ElButtonGroup, ElInput } from \"element-plus\";\nimport { isFunction, isNull, isNumber, isString } from \"lodash-unified\";\nimport { definePropType, makeSlots, useExpose, useRender, withDefineType } from \"../../../utils\";\nimport FaDialog from \"../../dialog\";\nimport { FaTable, type FaTableInstance, type PagedInput, type PagedResult } from \"../../table\";\nimport type { FaDialogInstance } from \"../../dialog\";\nimport type { TableProps } from \"element-plus\";\nimport type { PropType } from \"vue\";\n\n/** FaInputDialogPage 的运行时 Props 定义。 */\nexport const faInputDialogPageProps = {\n\t/** @description key of row data, used for optimizing rendering. Required if `reserve-selection` is on or display tree data. When its type is String, multi-level access is supported, e.g. `user.info.id`, but `user.info[0].id` is not supported, in which case `Function` should be used */\n\trowKey: {\n\t\ttype: [String, Function] as PropType<TableProps<Record<string, unknown>>[\"rowKey\"]>,\n\t\tdefault: \"id\",\n\t},\n\t/** @description v-model绑定值 */\n\tmodelValue: [String, Number] as PropType<string | number | null>,\n\t/** @description v-model:label绑定值 */\n\tlabel: String as PropType<string | null>,\n\t/** @description 输入框占位文本 */\n\tplaceholder: {\n\t\ttype: String,\n\t\tdefault: \"请选择\",\n\t},\n\t/** @description 禁用 */\n\tdisabled: Boolean,\n\t/** @description 标题 */\n\ttitle: String,\n\t/** @description 请求api */\n\trequestApi: {\n\t\ttype: definePropType<(params?: PagedInput) => Promise<PagedResult | Record<string, unknown>[]>>(Function),\n\t},\n\t/** 初始化参数 */\n\tinitParam: definePropType<unknown>([String, Number, Object]),\n\t/** @description 显示文本 Key */\n\tlabelKey: {\n\t\ttype: String,\n\t\tdefault: \"name\",\n\t},\n};\n\n/** FaInputDialogPage 的运行时 Emits 定义。 */\nexport const faInputDialogPageEmits = {\n\t/** @description v-model 回调 */\n\t\"update:modelValue\": (value: string | number | null): boolean => isString(value) || isNumber(value) || isNull(value),\n\t/** @description v-model:label 回调 */\n\t\"update:label\": (value: string | null): boolean => isString(value) || isNull(value),\n\t/** @description 改变 */\n\tchange: (_data: unknown, _value?: string | number | null): boolean => true,\n};\n\n/** FaInputDialogPage 的插槽参数。 */\nexport interface FaInputDialogPageSlots extends Record<string, unknown> {\n\t/** @description 默认内容插槽 */\n\tdefault: never;\n}\n\nexport default defineComponent({\n\tname: \"FaInputDialogPage\",\n\tprops: faInputDialogPageProps,\n\temits: faInputDialogPageEmits,\n\tslots: makeSlots<FaInputDialogPageSlots>(),\n\tsetup(props, { slots, emit, expose }) {\n\t\tconst modelValue = useVModel(props, \"modelValue\", emit, { passive: true });\n\t\tconst selectedLabel = useVModel(props, \"label\", emit, { passive: true });\n\n\t\tconst state = reactive({\n\t\t\tselectionRow: withDefineType<Record<string, unknown>>(),\n\t\t});\n\n\t\tconst faDialogRef = ref<FaDialogInstance>();\n\t\tconst faTableRef = ref<FaTableInstance>();\n\n\t\tconst handleDeleteClick = (): void => {\n\t\t\tmodelValue.value = null;\n\t\t\tselectedLabel.value = null;\n\t\t\temit(\"change\", null);\n\t\t};\n\n\t\tconst handleSearchClick = (): void => {\n\t\t\tfaDialogRef.value?.open(() => {\n\t\t\t\tconst table = faTableRef.value;\n\t\t\t\tif (table === undefined) return;\n\t\t\t\tif (state.selectionRow) {\n\t\t\t\t\t// 判断当前行是否选中\n\t\t\t\t\tconst rawRowKey = isFunction(props.rowKey) ? props.rowKey(state.selectionRow) : state.selectionRow[props.rowKey];\n\t\t\t\t\tconst rowSelected = (typeof rawRowKey === \"string\" || typeof rawRowKey === \"number\") && table.selectedListIds.includes(rawRowKey);\n\t\t\t\t\tif (!rowSelected) {\n\t\t\t\t\t\ttable.toggleRowSelection?.(state.selectionRow);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t});\n\t\t};\n\n\t\tconst handleConfirmClick = (): void => {\n\t\t\tfaDialogRef.value?.close(() => {\n\t\t\t\tconst table = faTableRef.value;\n\t\t\t\tconst selectedData = table?.selectedList[0];\n\t\t\t\tif (table?.selected && selectedData) {\n\t\t\t\t\tconst selectedValue = isFunction(props.rowKey) ? props.rowKey(selectedData) : selectedData[props.rowKey];\n\t\t\t\t\tmodelValue.value = typeof selectedValue === \"string\" || typeof selectedValue === \"number\" ? selectedValue : null;\n\t\t\t\t\tconst label = selectedData[props.labelKey];\n\t\t\t\t\tselectedLabel.value = typeof label === \"string\" ? label : null;\n\t\t\t\t\temit(\"change\", selectedData, modelValue.value);\n\t\t\t\t} else {\n\t\t\t\t\tmodelValue.value = null;\n\t\t\t\t\tselectedLabel.value = null;\n\t\t\t\t\temit(\"change\", null, null);\n\t\t\t\t}\n\t\t\t});\n\t\t};\n\n\t\tconst handleTableRowDblclick = (row: Record<string, unknown>): void => {\n\t\t\tfaTableRef.value?.clearSelection?.();\n\t\t\tfaTableRef.value?.toggleRowSelection?.(row);\n\t\t\tstate.selectionRow = row;\n\t\t\thandleConfirmClick();\n\t\t};\n\n\t\tuseRender(() => (\n\t\t\t<div class=\"fa-input-dialog-page\">\n\t\t\t\t<ElInput vModel={selectedLabel.value} placeholder={props.placeholder} disabled={props.disabled} readonly>\n\t\t\t\t\t{{\n\t\t\t\t\t\tappend: () => (\n\t\t\t\t\t\t\t<ElButtonGroup>\n\t\t\t\t\t\t\t\t<ElButton disabled={props.disabled} icon={Delete} onClick={handleDeleteClick} />\n\t\t\t\t\t\t\t\t<ElButton disabled={props.disabled} icon={Search} onClick={handleSearchClick} />\n\t\t\t\t\t\t\t</ElButtonGroup>\n\t\t\t\t\t\t),\n\t\t\t\t\t}}\n\t\t\t\t</ElInput>\n\t\t\t\t<FaDialog\n\t\t\t\t\tref={faDialogRef}\n\t\t\t\t\tstyle=\"--height: 70%;\"\n\t\t\t\t\twidth=\"50%\"\n\t\t\t\t\ttitle={props.title}\n\t\t\t\t\tfullHeight\n\t\t\t\t\tdisabledConfirmButton={!faTableRef.value?.selected}\n\t\t\t\t\tonConfirmClick={handleConfirmClick}\n\t\t\t\t>\n\t\t\t\t\t<FaTable\n\t\t\t\t\t\tref={faTableRef}\n\t\t\t\t\t\trowKey={props.rowKey}\n\t\t\t\t\t\trequestApi={props.requestApi}\n\t\t\t\t\t\tinitParam={props.initParam}\n\t\t\t\t\t\tsingle\n\t\t\t\t\t\trowClickSelection\n\t\t\t\t\t\thideSearchTime\n\t\t\t\t\t\tonRowDblclick={handleTableRowDblclick}\n\t\t\t\t\t>\n\t\t\t\t\t\t{{\n\t\t\t\t\t\t\tdefault: () => slots.default?.(),\n\t\t\t\t\t\t}}\n\t\t\t\t\t</FaTable>\n\t\t\t\t</FaDialog>\n\t\t\t</div>\n\t\t));\n\n\t\treturn useExpose(expose, {\n\t\t\t/** @description 选择行数据 */\n\t\t\tselectionRow: computed(() => state.selectionRow),\n\t\t\t/** @description 打开选择器弹窗 */\n\t\t\topen: handleSearchClick,\n\t\t\t/** @description 清除选择 */\n\t\t\tclear: handleDeleteClick,\n\t\t});\n\t},\n});\n"],"mappings":"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"}

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

@@ -0,0 +1,17 @@
+import LayoutGrid from "./src/layoutGrid";
+import LayoutGridItem from "./src/layoutGridItem";
+import type { TSXWithInstall } from "../../utils";
+/** 根据断点和容器宽度排列内容的响应式布局组件。 */
+export declare const FaLayoutGrid: TSXWithInstall<typeof LayoutGrid> & {
+    LayoutGridItem: typeof LayoutGridItem;
+};
+export default FaLayoutGrid;
+/** 可独立注册的响应式布局项组件。 */
+export declare const FaLayoutGridItem: TSXWithInstall<typeof LayoutGridItem>;
+export * from "./src/layoutGrid.type";
+export type { FaLayoutGridSlots } from "./src/layoutGrid";
+export type { FaLayoutGridItemSlots } from "./src/layoutGridItem";
+/** FaLayoutGrid 暴露的组件实例类型。 */
+export type FaLayoutGridInstance = InstanceType<typeof LayoutGrid>;
+/** FaLayoutGridItem 暴露的组件实例类型。 */
+export type FaLayoutGridItemInstance = InstanceType<typeof LayoutGridItem>;

package/dist/components/layoutGrid/index.mjs

@@ -0,0 +1,12 @@
+import { withInstall, withNoopInstall } from "../../utils/vue/install.mjs";
+import layoutGrid_default from "./src/layoutGrid.mjs";
+import layoutGridItem_default from "./src/layoutGridItem.mjs";
+//#region src/components/layoutGrid/index.ts
+/** 根据断点和容器宽度排列内容的响应式布局组件。 */
+const FaLayoutGrid = withInstall(layoutGrid_default, { LayoutGridItem: layoutGridItem_default });
+/** 可独立注册的响应式布局项组件。 */
+const FaLayoutGridItem = withNoopInstall(layoutGridItem_default);
+//#endregion
+export { FaLayoutGrid, FaLayoutGrid as default, FaLayoutGridItem };
+
+//# sourceMappingURL=index.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["LayoutGrid","LayoutGridItem"],"sources":["../../../src/components/layoutGrid/index.ts"],"sourcesContent":["import { withInstall, withNoopInstall } from \"../../utils\";\nimport LayoutGrid from \"./src/layoutGrid\";\nimport LayoutGridItem from \"./src/layoutGridItem\";\nimport type { TSXWithInstall } from \"../../utils\";\n\n/** 根据断点和容器宽度排列内容的响应式布局组件。 */\nexport const FaLayoutGrid: TSXWithInstall<typeof LayoutGrid> & { LayoutGridItem: typeof LayoutGridItem } = withInstall(LayoutGrid, {\n\tLayoutGridItem,\n});\nexport default FaLayoutGrid;\n\n/** 可独立注册的响应式布局项组件。 */\nexport const FaLayoutGridItem: TSXWithInstall<typeof LayoutGridItem> = withNoopInstall(LayoutGridItem);\n\nexport * from \"./src/layoutGrid.type\";\nexport type { FaLayoutGridSlots } from \"./src/layoutGrid\";\nexport type { FaLayoutGridItemSlots } from \"./src/layoutGridItem\";\n\n/** FaLayoutGrid 暴露的组件实例类型。 */\nexport type FaLayoutGridInstance = InstanceType<typeof LayoutGrid>;\n\n/** FaLayoutGridItem 暴露的组件实例类型。 */\nexport type FaLayoutGridItemInstance = InstanceType<typeof LayoutGridItem>;\n"],"mappings":";;;;;AAMA,MAAa,eAA8F,YAAYA,oBAAY,EAClI,gBAAA,uBACD,CAAC;;AAID,MAAa,mBAA0D,gBAAgBC,sBAAc"}

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

@@ -0,0 +1,61 @@
+import type { FaLayoutGridBreakPoint } from "./layoutGrid.type";
+/** FaLayoutGrid 的插槽参数。 */
+export interface FaLayoutGridSlots extends Record<string, unknown> {
+    /** @description 默认内容插槽 */
+    default: never;
+}
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    /** @description Grid布局列配置 */
+    cols: {
+        type: import("vue").PropType<string | number | Record<FaLayoutGridBreakPoint, number>>;
+        default: () => Record<FaLayoutGridBreakPoint, number>;
+    };
+    /** @description 折叠 */
+    collapsed: BooleanConstructor;
+    /** @description 折叠行数 */
+    collapsedRows: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    /** @description 间距，偏移 */
+    gap: {
+        type: import("vue").PropType<number | [number, number]>;
+        default: number;
+    };
+}>, {
+    /** @description 响应式断点 */
+    breakPoint: import("vue").Ref<FaLayoutGridBreakPoint, FaLayoutGridBreakPoint>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    /** @description 断点变化事件 */
+    breakPointChange: ({ breakPoint: _breakPoint }: {
+        breakPoint: FaLayoutGridBreakPoint;
+    }) => true;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /** @description Grid布局列配置 */
+    cols: {
+        type: import("vue").PropType<string | number | Record<FaLayoutGridBreakPoint, number>>;
+        default: () => Record<FaLayoutGridBreakPoint, number>;
+    };
+    /** @description 折叠 */
+    collapsed: BooleanConstructor;
+    /** @description 折叠行数 */
+    collapsedRows: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    /** @description 间距，偏移 */
+    gap: {
+        type: import("vue").PropType<number | [number, number]>;
+        default: number;
+    };
+}>> & Readonly<{
+    onBreakPointChange?: ((args_0: {
+        breakPoint: FaLayoutGridBreakPoint;
+    }) => any) | undefined;
+}>, {
+    collapsed: boolean;
+    cols: string | number | Record<FaLayoutGridBreakPoint, number>;
+    collapsedRows: string | number;
+    gap: number | [number, number];
+}, import("../../../utils").TypedSlotsDeclaration<FaLayoutGridSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/components/layoutGrid/src/layoutGrid.mjs

@@ -0,0 +1,161 @@
+import { useExpose } from "../../../utils/vue/expose.mjs";
+import { definePropType } from "../../../utils/vue/props.mjs";
+import { useRender } from "../../../utils/vue/render.mjs";
+import { makeSlots } from "../../../utils/vue/slots.mjs";
+import { computed, createVNode, defineComponent, nextTick, onActivated, onDeactivated, onMounted, onUnmounted, provide, ref, watch } from "vue";
+import { isArray, isNumber, isObject } from "lodash-unified";
+//#region src/components/layoutGrid/src/layoutGrid.tsx
+var layoutGrid_default = defineComponent({
+	name: "FaLayoutGrid",
+	props: {
+		/** @description Grid布局列配置 */
+		cols: {
+			type: definePropType([
+				String,
+				Number,
+				Object
+			]),
+			default: () => ({
+				xs: 1,
+				sm: 2,
+				md: 3,
+				lg: 4,
+				xl: 5
+			})
+		},
+		/** @description 折叠 */
+		collapsed: Boolean,
+		/** @description 折叠行数 */
+		collapsedRows: {
+			type: [String, Number],
+			default: 1
+		},
+		/** @description 间距，偏移 */
+		gap: {
+			type: definePropType([Number, Array]),
+			default: 0
+		}
+	},
+	emits: { 
+	/** @description 断点变化事件 */
+breakPointChange: ({ breakPoint: _breakPoint }) => true },
+	slots: makeSlots(),
+	setup(props, { slots, emit, expose }) {
+		const divElRef = ref();
+		provide("gap", isArray(props.gap) ? props.gap[0] : props.gap);
+		const breakPoint = ref("xl");
+		provide("breakPoint", breakPoint);
+		const hiddenIndex = ref(-1);
+		provide("shouldHiddenIndex", hiddenIndex);
+		const cols = computed(() => {
+			if (isObject(props.cols)) return props.cols[breakPoint.value] ?? 1;
+			return props.cols;
+		});
+		provide("cols", cols);
+		const collapsedRows = isNumber(props.collapsedRows) ? props.collapsedRows : Number(props.collapsedRows);
+		const breakpoints = {
+			xs: {
+				min: 0,
+				max: 479
+			},
+			sm: {
+				min: 480,
+				max: 768
+			},
+			md: {
+				min: 768,
+				max: 1024
+			},
+			lg: {
+				min: 1024,
+				max: 1440
+			},
+			xl: {
+				min: 1440,
+				max: Infinity
+			}
+		};
+		const resize = (e) => {
+			if (e.length !== 1 || e[0] === void 0) throw new Error("FaLayoutGrid 监听到了非预期数量的布局容器。");
+			const width = e[0].target.scrollWidth;
+			for (const [key, { min, max }] of Object.entries(breakpoints)) if (width >= min && width <= max) {
+				breakPoint.value = key;
+				break;
+			}
+		};
+		let resizeObserver;
+		const observeResize = () => {
+			const element = divElRef.value;
+			if (!element) return;
+			resizeObserver?.disconnect();
+			resizeObserver = new ResizeObserver(resize);
+			resizeObserver.observe(element);
+		};
+		onMounted(() => {
+			nextTick(observeResize);
+			watch(() => breakPoint.value, (newValue) => {
+				emit("breakPointChange", { breakPoint: newValue });
+			}, { immediate: true });
+		});
+		onActivated(() => {
+			nextTick(observeResize);
+		});
+		onUnmounted(() => {
+			resizeObserver?.disconnect();
+		});
+		onDeactivated(() => {
+			resizeObserver?.disconnect();
+		});
+		const gap = computed(() => {
+			if (isNumber(props.gap)) return `${props.gap}px`;
+			if (isArray(props.gap)) return `${props.gap[1]}px ${props.gap[0]}px`;
+			return "unset";
+		});
+		const style = computed(() => {
+			return {
+				display: "grid",
+				gridGap: gap.value,
+				gridTemplateColumns: `repeat(${cols.value}, minmax(0, 1fr))`
+			};
+		});
+		useRender(() => {
+			const defaultSlot = slots.default?.() ?? [];
+			if (props.collapsed) {
+				const fields = [];
+				let suffix;
+				defaultSlot.forEach((slot) => {
+					if (typeof slot.type === "object" && slot.type !== null && "name" in slot.type && slot.type.name === "FaLayoutGridItem" && slot.props?.["suffix"] !== void 0) suffix = slot;
+					if (typeof slot.type === "symbol" && Array.isArray(slot?.children)) fields.push(...slot.children);
+				});
+				let suffixCols = 0;
+				if (suffix?.props) {
+					const breakPointProps = suffix.props[breakPoint.value];
+					suffixCols = (breakPointProps?.span ?? Number(suffix.props["span"] ?? 1)) + (breakPointProps?.offset ?? Number(suffix.props["offset"] ?? 0));
+				}
+				let occupiedCols = 0;
+				hiddenIndex.value = -1;
+				for (const [index, current] of fields.entries()) {
+					const currentProps = current.props;
+					if (currentProps === null) continue;
+					const breakPointProps = currentProps[breakPoint.value];
+					occupiedCols += (breakPointProps?.span ?? Number(currentProps["span"] ?? 1)) + (breakPointProps?.offset ?? Number(currentProps["offset"] ?? 0));
+					if (occupiedCols > collapsedRows * Number(cols.value) - suffixCols) {
+						hiddenIndex.value = index;
+						break;
+					}
+				}
+			} else hiddenIndex.value = -1;
+			return createVNode("div", {
+				"ref": divElRef,
+				"style": style.value
+			}, [defaultSlot]);
+		});
+		return useExpose(expose, { 
+		/** @description 响应式断点 */
+breakPoint });
+	}
+});
+//#endregion
+export { layoutGrid_default as default };
+
+//# sourceMappingURL=layoutGrid.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"layoutGrid.mjs","names":[],"sources":["../../../../src/components/layoutGrid/src/layoutGrid.tsx"],"sourcesContent":["import { computed, defineComponent, nextTick, onActivated, onDeactivated, onMounted, onUnmounted, provide, ref, watch } from \"vue\";\nimport { isArray, isNumber, isObject } from \"lodash-unified\";\nimport { definePropType, makeSlots, useExpose, useRender } from \"../../../utils\";\nimport type { FaLayoutGridBreakPoint, FaLayoutGridItemResponsive } from \"./layoutGrid.type\";\nimport type { VNode, VNodeArrayChildren } from \"vue\";\n\n/** FaLayoutGrid 的插槽参数。 */\nexport interface FaLayoutGridSlots extends Record<string, unknown> {\n\t/** @description 默认内容插槽 */\n\tdefault: never;\n}\n\nexport default defineComponent({\n\tname: \"FaLayoutGrid\",\n\tprops: {\n\t\t/** @description Grid布局列配置 */\n\t\tcols: {\n\t\t\ttype: definePropType<string | number | Record<FaLayoutGridBreakPoint, number>>([String, Number, Object]),\n\t\t\tdefault: (): Record<FaLayoutGridBreakPoint, number> => ({ xs: 1, sm: 2, md: 3, lg: 4, xl: 5 }),\n\t\t},\n\t\t/** @description 折叠 */\n\t\tcollapsed: Boolean,\n\t\t/** @description 折叠行数 */\n\t\tcollapsedRows: {\n\t\t\ttype: [String, Number],\n\t\t\tdefault: 1,\n\t\t},\n\t\t/** @description 间距，偏移 */\n\t\tgap: {\n\t\t\ttype: definePropType<number | [number, number]>([Number, Array]),\n\t\t\tdefault: 0,\n\t\t},\n\t},\n\temits: {\n\t\t/** @description 断点变化事件 */\n\t\tbreakPointChange: ({ breakPoint: _breakPoint }: { breakPoint: FaLayoutGridBreakPoint }) => true,\n\t},\n\tslots: makeSlots<FaLayoutGridSlots>(),\n\tsetup(props, { slots, emit, expose }) {\n\t\tconst divElRef = ref<HTMLElement>();\n\n\t\t// 注入 gap 间距\n\t\tprovide(\"gap\", isArray(props.gap) ? props.gap[0] : props.gap);\n\n\t\t// 注入响应式断点\n\t\tconst breakPoint = ref<FaLayoutGridBreakPoint>(\"xl\");\n\t\tprovide(\"breakPoint\", breakPoint);\n\n\t\t// 注入要开始折叠的 index\n\t\tconst hiddenIndex = ref(-1);\n\t\tprovide(\"shouldHiddenIndex\", hiddenIndex);\n\n\t\t// 注入 cols\n\t\tconst cols = computed<string | number>(() => {\n\t\t\tif (isObject(props.cols)) return props.cols[breakPoint.value] ?? 1;\n\t\t\treturn props.cols;\n\t\t});\n\t\tprovide(\"cols\", cols);\n\n\t\tconst collapsedRows = isNumber(props.collapsedRows) ? props.collapsedRows : Number(props.collapsedRows);\n\n\t\t// 断点映射\n\t\tconst breakpoints = {\n\t\t\t// 小于480屏幕（如手机）\n\t\t\txs: { min: 0, max: 479 },\n\t\t\t// 平板竖屏\n\t\t\tsm: { min: 480, max: 768 },\n\t\t\t// 平板横屏\n\t\t\tmd: { min: 768, max: 1024 },\n\t\t\t// 小型桌面\n\t\t\tlg: { min: 1024, max: 1440 },\n\t\t\t// 大型桌面\n\t\t\txl: { min: 1440, max: Infinity },\n\t\t};\n\n\t\t// 监听屏幕变化\n\t\tconst resize = (e: ResizeObserverEntry[]): void => {\n\t\t\t// 当前只监听布局容器，ResizeObserver 每次回调应当只有一个目标。\n\t\t\tif (e.length !== 1 || e[0] === undefined) throw new Error(\"FaLayoutGrid 监听到了非预期数量的布局容器。\");\n\t\t\tconst curEl = e[0];\n\t\t\tconst width = curEl.target.scrollWidth;\n\n\t\t\tfor (const [key, { min, max }] of Object.entries(breakpoints)) {\n\t\t\t\tif (width >= min && width <= max) {\n\t\t\t\t\tbreakPoint.value = key as FaLayoutGridBreakPoint;\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\n\t\tlet resizeObserver: ResizeObserver | undefined;\n\t\tconst observeResize = (): void => {\n\t\t\tconst element = divElRef.value;\n\t\t\tif (!element) return;\n\t\t\tresizeObserver?.disconnect();\n\t\t\tresizeObserver = new ResizeObserver(resize);\n\t\t\tresizeObserver.observe(element);\n\t\t};\n\n\t\tonMounted(() => {\n\t\t\tvoid nextTick(observeResize);\n\n\t\t\t// 断点变化时 执行 findIndex\n\t\t\twatch(\n\t\t\t\t() => breakPoint.value,\n\t\t\t\t(newValue) => {\n\t\t\t\t\temit(\"breakPointChange\", { breakPoint: newValue });\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\timmediate: true,\n\t\t\t\t}\n\t\t\t);\n\t\t});\n\n\t\tonActivated(() => {\n\t\t\tvoid nextTick(observeResize);\n\t\t});\n\n\t\tonUnmounted(() => {\n\t\t\tresizeObserver?.disconnect();\n\t\t});\n\n\t\tonDeactivated(() => {\n\t\t\tresizeObserver?.disconnect();\n\t\t});\n\n\t\t// 设置间距\n\t\tconst gap = computed(() => {\n\t\t\tif (isNumber(props.gap)) return `${props.gap}px`;\n\t\t\tif (isArray(props.gap)) return `${props.gap[1]}px ${props.gap[0]}px`;\n\t\t\treturn \"unset\";\n\t\t});\n\n\t\t// 设置 style\n\t\tconst style = computed(() => {\n\t\t\treturn {\n\t\t\t\tdisplay: \"grid\",\n\t\t\t\tgridGap: gap.value,\n\t\t\t\tgridTemplateColumns: `repeat(${cols.value}, minmax(0, 1fr))`,\n\t\t\t};\n\t\t});\n\n\t\tuseRender(() => {\n\t\t\tconst defaultSlot = slots.default?.() ?? [];\n\n\t\t\tif (props.collapsed) {\n\t\t\t\tconst fields: VNodeArrayChildren = [];\n\t\t\t\tlet suffix: VNode | undefined;\n\n\t\t\t\tdefaultSlot.forEach((slot) => {\n\t\t\t\t\t// suffix\n\t\t\t\t\tif (\n\t\t\t\t\t\ttypeof slot.type === \"object\" &&\n\t\t\t\t\t\tslot.type !== null &&\n\t\t\t\t\t\t\"name\" in slot.type &&\n\t\t\t\t\t\tslot.type.name === \"FaLayoutGridItem\" &&\n\t\t\t\t\t\tslot.props?.[\"suffix\"] !== undefined\n\t\t\t\t\t)\n\t\t\t\t\t\tsuffix = slot;\n\t\t\t\t\t// slot children\n\t\t\t\t\tif (typeof slot.type === \"symbol\" && Array.isArray(slot?.children)) fields.push(...slot.children);\n\t\t\t\t});\n\n\t\t\t\t// 计算 suffix 所占用的列\n\t\t\t\tlet suffixCols = 0;\n\t\t\t\tif (suffix?.props) {\n\t\t\t\t\tconst breakPointProps = suffix.props[breakPoint.value] as FaLayoutGridItemResponsive | undefined;\n\t\t\t\t\tsuffixCols =\n\t\t\t\t\t\t(breakPointProps?.span ?? Number(suffix.props[\"span\"] ?? 1)) +\n\t\t\t\t\t\t(breakPointProps?.offset ?? Number(suffix.props[\"offset\"] ?? 0));\n\t\t\t\t}\n\n\t\t\t\tlet occupiedCols = 0;\n\t\t\t\thiddenIndex.value = -1;\n\t\t\t\tfor (const [index, current] of fields.entries()) {\n\t\t\t\t\tconst currentVNode = current as VNode;\n\t\t\t\t\tconst currentProps = currentVNode.props;\n\t\t\t\t\tif (currentProps === null) continue;\n\t\t\t\t\tconst breakPointProps = currentProps[breakPoint.value] as FaLayoutGridItemResponsive | undefined;\n\t\t\t\t\toccupiedCols +=\n\t\t\t\t\t\t(breakPointProps?.span ?? Number(currentProps[\"span\"] ?? 1)) +\n\t\t\t\t\t\t(breakPointProps?.offset ?? Number(currentProps[\"offset\"] ?? 0));\n\t\t\t\t\tif (occupiedCols > collapsedRows * Number(cols.value) - suffixCols) {\n\t\t\t\t\t\thiddenIndex.value = index;\n\t\t\t\t\t\tbreak;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\thiddenIndex.value = -1;\n\t\t\t}\n\n\t\t\treturn (\n\t\t\t\t<div ref={divElRef} style={style.value}>\n\t\t\t\t\t{defaultSlot}\n\t\t\t\t</div>\n\t\t\t);\n\t\t});\n\n\t\treturn useExpose(expose, {\n\t\t\t/** @description 响应式断点 */\n\t\t\tbreakPoint,\n\t\t});\n\t},\n});\n"],"mappings":"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"}

package/dist/components/layoutGrid/src/layoutGrid.type.d.ts

@@ -0,0 +1,7 @@
+/** 响应式布局断点；从 xs 到 xl 依次表示最小、小、中、大和最大容器。 */
+export type FaLayoutGridBreakPoint = "xs" | "sm" | "md" | "lg" | "xl";
+/** 布局项在不同断点下的栅格跨度。 */
+export interface FaLayoutGridItemResponsive {
+    span?: number;
+    offset?: number;
+}

package/dist/components/layoutGrid/src/layoutGridItem.d.ts

@@ -0,0 +1,101 @@
+import type { FaLayoutGridItemResponsive } from "./layoutGrid.type";
+/** FaLayoutGridItem 的插槽参数。 */
+export interface FaLayoutGridItemSlots extends Record<string, unknown> {
+    /** @description 默认内容插槽 */
+    default: never;
+}
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    /** @description 偏移 */
+    offset: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    /** @description 占位 */
+    span: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    /** @description 后缀 */
+    suffix: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** @description 响应式，小于480px屏幕配置 */
+    xs: {
+        type: import("vue").PropType<FaLayoutGridItemResponsive>;
+        default: undefined;
+    };
+    /** @description 响应式，平板竖屏配置 */
+    sm: {
+        type: import("vue").PropType<FaLayoutGridItemResponsive>;
+        default: undefined;
+    };
+    /** @description 响应式，平板横屏配置 */
+    md: {
+        type: import("vue").PropType<FaLayoutGridItemResponsive>;
+        default: undefined;
+    };
+    /** @description 响应式，小型桌面配置 */
+    lg: {
+        type: import("vue").PropType<FaLayoutGridItemResponsive>;
+        default: undefined;
+    };
+    /** @description 响应式，大型桌面配置 */
+    xl: {
+        type: import("vue").PropType<FaLayoutGridItemResponsive>;
+        default: undefined;
+    };
+}>, {
+    show: boolean;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /** @description 偏移 */
+    offset: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    /** @description 占位 */
+    span: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    /** @description 后缀 */
+    suffix: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** @description 响应式，小于480px屏幕配置 */
+    xs: {
+        type: import("vue").PropType<FaLayoutGridItemResponsive>;
+        default: undefined;
+    };
+    /** @description 响应式，平板竖屏配置 */
+    sm: {
+        type: import("vue").PropType<FaLayoutGridItemResponsive>;
+        default: undefined;
+    };
+    /** @description 响应式，平板横屏配置 */
+    md: {
+        type: import("vue").PropType<FaLayoutGridItemResponsive>;
+        default: undefined;
+    };
+    /** @description 响应式，小型桌面配置 */
+    lg: {
+        type: import("vue").PropType<FaLayoutGridItemResponsive>;
+        default: undefined;
+    };
+    /** @description 响应式，大型桌面配置 */
+    xl: {
+        type: import("vue").PropType<FaLayoutGridItemResponsive>;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    span: string | number;
+    offset: string | number;
+    xs: FaLayoutGridItemResponsive;
+    sm: FaLayoutGridItemResponsive;
+    md: FaLayoutGridItemResponsive;
+    lg: FaLayoutGridItemResponsive;
+    xl: FaLayoutGridItemResponsive;
+    suffix: boolean;
+}, import("../../../utils").TypedSlotsDeclaration<FaLayoutGridItemSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/components/layoutGrid/src/layoutGridItem.mjs

@@ -0,0 +1,85 @@
+import { useExpose } from "../../../utils/vue/expose.mjs";
+import { definePropType } from "../../../utils/vue/props.mjs";
+import { useRender } from "../../../utils/vue/render.mjs";
+import { makeSlots } from "../../../utils/vue/slots.mjs";
+import { computed, createVNode, defineComponent, inject, reactive, ref, vShow, watch, withDirectives } from "vue";
+import { isNumber } from "lodash-unified";
+//#region src/components/layoutGrid/src/layoutGridItem.tsx
+var layoutGridItem_default = defineComponent({
+	name: "FaLayoutGridItem",
+	props: {
+		/** @description 偏移 */
+		offset: {
+			type: [String, Number],
+			default: 0
+		},
+		/** @description 占位 */
+		span: {
+			type: [String, Number],
+			default: 1
+		},
+		/** @description 后缀 */
+		suffix: {
+			type: Boolean,
+			default: false
+		},
+		/** @description 响应式，小于480px屏幕配置 */
+		xs: {
+			type: definePropType(Object),
+			default: void 0
+		},
+		/** @description 响应式，平板竖屏配置 */
+		sm: {
+			type: definePropType(Object),
+			default: void 0
+		},
+		/** @description 响应式，平板横屏配置 */
+		md: {
+			type: definePropType(Object),
+			default: void 0
+		},
+		/** @description 响应式，小型桌面配置 */
+		lg: {
+			type: definePropType(Object),
+			default: void 0
+		},
+		/** @description 响应式，大型桌面配置 */
+		xl: {
+			type: definePropType(Object),
+			default: void 0
+		}
+	},
+	slots: makeSlots(),
+	setup(props, { attrs, slots, expose }) {
+		const state = reactive({ show: true });
+		const attrsObj = attrs;
+		const breakPoint = inject("breakPoint", ref("xl"));
+		const shouldHiddenIndex = inject("shouldHiddenIndex", ref(-1));
+		watch(() => [shouldHiddenIndex.value, breakPoint.value], (n) => {
+			const index = Number(attrsObj["data-index"] ?? attrsObj["index"]);
+			if (Number.isInteger(index)) state.show = !(n[0] !== -1 && index >= Number(n[0]));
+		}, { immediate: true });
+		const gap = inject("gap", 0);
+		const cols = inject("cols", ref(5));
+		const style = computed(() => {
+			const breakPointObk = props[breakPoint.value];
+			const span = breakPointObk?.span ?? (isNumber(props.span) ? props.span : Number(props.span));
+			const offset = breakPointObk?.offset ?? (isNumber(props.offset) ? props.offset : Number(props.offset));
+			if (props.suffix) return {
+				gridColumnStart: cols.value - span - offset + 1,
+				gridColumnEnd: `span ${span + offset}`,
+				marginLeft: offset !== 0 ? `calc(((100% + ${gap}px) / ${span + offset}) * ${offset})` : "unset"
+			};
+			else return {
+				gridColumn: `span ${span + offset > cols.value ? cols.value : span + offset}/span ${span + offset > cols.value ? cols.value : span + offset}`,
+				marginLeft: offset !== 0 ? `calc(((100% + ${gap}px) / ${span + offset}) * ${offset})` : "unset"
+			};
+		});
+		useRender(() => withDirectives(createVNode("div", { "style": style.value }, [slots.default?.()]), [[vShow, state.show]]));
+		return useExpose(expose, { show: state.show });
+	}
+});
+//#endregion
+export { layoutGridItem_default as default };
+
+//# sourceMappingURL=layoutGridItem.mjs.map