@antdv-vue/pro-utils 0.0.0-stage → 2.1.1

package/dist/useEditableArray/index.js

@@ -0,0 +1,584 @@
+import { useEffect } from "../hooks/useEffect/index.js";
+import { useDebounceFn } from "../hooks/useDebounceFn/index.js";
+import { usePrevious } from "../usePrevious/index.js";
+import CancelEditableAction, { normalizeNamePath, recordKeyToString } from "./components/CancelEditableAction.js";
+import DeleteEditableAction from "./components/DeleteEditableAction.js";
+import SaveEditableAction from "./components/SaveEditableAction.js";
+import { computed, createVNode, isVNode, mergeProps, shallowRef } from "vue";
+import { get, useMergedState } from "@v-c/util";
+import { message } from "antdv-next";
+import { useIntl } from "@antdv-vue/pro-provider";
+import { noteOnce } from "@v-c/util/dist/warning";
+import useLazyKVMap from "antdv-next/dist/table/hooks/useLazyKVMap";
+//#region src/useEditableArray/index.tsx
+/**
+* 扁平化记录树结构为 Map
+*/
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+function flattenRecordsToMap(records, getRowKey, childrenColumnName, parentKey, parentIndex) {
+	const kvMap = /* @__PURE__ */ new Map();
+	records.forEach((record, index) => {
+		const eachIndex = (parentIndex || 0) * 10 + index;
+		const recordKey = getRowKey(record, eachIndex).toString();
+		if (record && typeof record === "object" && childrenColumnName in record) flattenRecordsToMap(record[childrenColumnName] || [], getRowKey, childrenColumnName, recordKey, eachIndex).forEach((value, key) => kvMap.set(key, value));
+		const newRecord = {
+			...record,
+			map_row_key: recordKey,
+			map_row_parentKey: parentKey
+		};
+		delete newRecord.children;
+		if (!parentKey) delete newRecord.map_row_parentKey;
+		kvMap.set(recordKey, newRecord);
+	});
+	return kvMap;
+}
+/**
+* 重建树结构
+*/
+function rebuildTreeStructure(map, childrenColumnName, action) {
+	const childrenMap = /* @__PURE__ */ new Map();
+	const result = [];
+	const addNewRecordToChildren = (fillChildren) => {
+		map.forEach((value) => {
+			if (value.map_row_parentKey != null && !value.map_row_key) {
+				const { map_row_parentKey, ...rest } = value;
+				const parentKeyStr = String(map_row_parentKey);
+				if (!childrenMap.has(parentKeyStr)) childrenMap.set(parentKeyStr, []);
+				if (fillChildren) childrenMap.get(parentKeyStr)?.push(rest);
+			}
+		});
+	};
+	addNewRecordToChildren(action === "top");
+	map.forEach((value) => {
+		if (value.map_row_parentKey != null && value.map_row_key) {
+			const { map_row_parentKey, map_row_key, isNewRecord, ...rest } = value;
+			const record = {
+				...rest,
+				map_row_key
+			};
+			const parentKeyStr = map_row_parentKey != null ? String(map_row_parentKey) : null;
+			if (!parentKeyStr) return;
+			if (!childrenMap.has(parentKeyStr)) childrenMap.set(parentKeyStr, []);
+			if (isNewRecord && action === "top") childrenMap.get(parentKeyStr)?.unshift(record);
+			else childrenMap.get(parentKeyStr)?.push(record);
+		}
+	});
+	map.forEach((value) => {
+		if (value.map_row_parentKey != null && value.map_row_key) {
+			const { map_row_parentKey, map_row_key } = value;
+			const parentKeyStr = map_row_parentKey != null ? String(map_row_parentKey) : null;
+			if (!parentKeyStr) return;
+			const children = childrenMap.get(parentKeyStr);
+			if (children && children.length > 0) {
+				const recordIndex = children.findIndex((r) => {
+					const recordKey = r.map_row_key || r.id;
+					return String(recordKey) === String(map_row_key);
+				});
+				if (recordIndex >= 0 && childrenMap.has(map_row_key)) children[recordIndex] = {
+					...children[recordIndex],
+					[childrenColumnName]: childrenMap.get(map_row_key)
+				};
+			}
+		}
+	});
+	addNewRecordToChildren(action === "update");
+	map.forEach((value) => {
+		if (!value.map_row_parentKey) {
+			const { map_row_key, ...rest } = value;
+			const record = map_row_key && childrenMap.has(map_row_key) ? {
+				...rest,
+				[childrenColumnName]: childrenMap.get(map_row_key)
+			} : rest;
+			result.push(record);
+		}
+	});
+	return result;
+}
+/**
+* 使用map 来删除数据，性能一般 但是准确率比较高
+*
+*/
+function editableRowByKey(keyProps, action) {
+	const { getRowKey, row, data, childrenColumnName = "children" } = keyProps;
+	const key = recordKeyToString(keyProps.key)?.toString();
+	const kvMap = flattenRecordsToMap(data, getRowKey, childrenColumnName);
+	if (action === "delete") kvMap.delete(key);
+	else if (action === "top" || action === "update") {
+		const existingRecord = kvMap.get(key);
+		if (existingRecord) kvMap.set(key, {
+			...existingRecord,
+			...row
+		});
+		else kvMap.set(key, {
+			...row,
+			map_row_key: key,
+			map_row_parentKey: row.map_row_parentKey,
+			isNewRecord: true
+		});
+	}
+	return rebuildTreeStructure(kvMap, childrenColumnName, action);
+}
+function defaultActionRender(row, config) {
+	const { recordKey, newLineConfig, saveText, cancelText, deleteText } = config;
+	const saveRef = shallowRef();
+	return {
+		save: createVNode(SaveEditableAction, mergeProps({ "key": `save${recordKey}` }, config, {
+			"row": row,
+			"ref": saveRef
+		}), _isSlot(saveText) ? saveText : { default: () => [saveText] }),
+		delete: newLineConfig?.options.recordKey !== recordKey && deleteText ? createVNode(DeleteEditableAction, mergeProps({ "key": `delete${recordKey}` }, config, { "row": row }), _isSlot(deleteText) ? deleteText : { default: () => [deleteText] }) : void 0,
+		cancel: createVNode(CancelEditableAction, mergeProps({ "key": `cancel${recordKey}` }, config, { "row": row }), _isSlot(cancelText) ? cancelText : { default: () => [cancelText] }),
+		saveRef
+	};
+}
+/**
+* 一个方便的hooks 用于维护编辑的状态
+*
+* @param props
+*/
+function useEditableArray(props) {
+	const intl = useIntl();
+	const [messageApi, ContextHolder] = message.useMessage();
+	/**
+	* 点击开始编辑之前的保存数据用的
+	*/
+	const preEditRow = shallowRef(null);
+	const preEditRows = shallowRef(/* @__PURE__ */ new Map());
+	const newLineRecordCache = shallowRef(void 0);
+	const dataSourceFormKeyMapRef = shallowRef(/* @__PURE__ */ new Map());
+	const getBusinessRowKey = (record) => props.getRowKey.value(record, -1);
+	/**
+	* 构建数据源 key 索引映射表
+	*/
+	const buildDataSourceKeyIndexMap = () => {
+		const map = /* @__PURE__ */ new Map();
+		const formKeyMap = /* @__PURE__ */ new Map();
+		const loopGetKey = (dataSource, parentKey) => {
+			dataSource?.forEach((record, index) => {
+				const indexKey = parentKey == null ? index.toString() : `${parentKey}_${index}`;
+				const recordKey = recordKeyToString(props.getRowKey.value(record, -1));
+				if (recordKey == null) return;
+				map.set(indexKey, recordKey);
+				map.set(recordKey.toString(), indexKey);
+				formKeyMap.set(recordKey.toString(), indexKey);
+				const children = props.childrenColumnName?.value && record?.[props.childrenColumnName.value];
+				if (children) loopGetKey(children, indexKey);
+			});
+		};
+		loopGetKey(props.dataSource.value);
+		dataSourceFormKeyMapRef.value = formKeyMap;
+		return map;
+	};
+	const dataSourceKeyIndexMapRef = shallowRef(computed(() => buildDataSourceKeyIndexMap()).value);
+	const resolveFormRecordKey = (recordKey, fallbackIndex) => {
+		if (!props.tableName?.value) return recordKey;
+		const normalizedRecordKey = recordKeyToString(recordKey);
+		if (fallbackIndex != null) return fallbackIndex;
+		const cachedFormRecordKey = dataSourceFormKeyMapRef.value.get(normalizedRecordKey);
+		if (cachedFormRecordKey != null) return cachedFormRecordKey;
+		dataSourceKeyIndexMapRef.value = buildDataSourceKeyIndexMap();
+		return dataSourceFormKeyMapRef.value.get(normalizedRecordKey) ?? recordKey;
+	};
+	const newLineRecordRef = shallowRef(void 0);
+	useEffect(() => {
+		dataSourceKeyIndexMapRef.value = buildDataSourceKeyIndexMap();
+	}, [() => props.dataSource.value]);
+	useEffect(() => {
+		newLineRecordRef.value = newLineRecordCache.value;
+	}, [() => newLineRecordCache.value]);
+	const editableType = computed(() => props.type?.value || "single");
+	const [getRecordByKey] = useLazyKVMap(props.dataSource, "children", props.getRowKey);
+	const [editableKeys, setEditableRowKeys] = useMergedState([], {
+		value: computed(() => props.editableKeys.value),
+		onChange: props.onChange ? (keys) => {
+			props?.onChange?.(keys?.filter((key) => key !== void 0) ?? [], keys?.map((key) => getRecordByKey?.(key)).filter((key) => key !== void 0) ?? []);
+		} : void 0
+	});
+	const editableKeysRef = usePrevious(editableKeys);
+	/**
+	* 检查 key 是否在编辑列表中
+	*/
+	const checkKeyInEditableList = (key, keysList) => keysList.includes(key);
+	/** 这行是不是编辑状态 */
+	const isEditable = (row) => {
+		const { getRowKey } = props;
+		const recordKeyWithIndex = getRowKey.value(row, row.index)?.toString?.();
+		const recordKey = getRowKey.value(row, -1)?.toString?.();
+		const stringEditableKeys = editableKeys.value?.map((key) => key?.toString());
+		const stringEditableKeysRef = editableKeysRef.value?.map((key) => key?.toString()) || [];
+		const preIsEditable = checkKeyInEditableList(recordKey, stringEditableKeysRef) || checkKeyInEditableList(recordKeyWithIndex, stringEditableKeysRef);
+		return {
+			recordKey,
+			isEditable: checkKeyInEditableList(recordKey, stringEditableKeys) || checkKeyInEditableList(recordKeyWithIndex, stringEditableKeys),
+			preIsEditable
+		};
+	};
+	/**
+	* 验证是否可以开始编辑
+	*/
+	const validateCanStartEdit = () => {
+		if (editableKeys.value && editableKeys.value.length > 0 && editableType.value === "single" && props.onlyOneLineEditorAlertMessage !== false) {
+			messageApi.warning(props.onlyOneLineEditorAlertMessage || intl.value.getMessage({
+				id: "editableTable.onlyOneLineEditor",
+				defaultMessage: "只能同时编辑一行"
+			}));
+			return false;
+		}
+		return true;
+	};
+	/**
+	* 查找记录
+	*/
+	const findRecordByKey = (recordKey) => {
+		const normalizedRecordKey = recordKeyToString(recordKey)?.toString();
+		return props.dataSource.value?.find((recordData) => {
+			return recordKeyToString(getBusinessRowKey(recordData))?.toString() === normalizedRecordKey;
+		}) ?? null;
+	};
+	/**
+	* 进入编辑状态
+	*
+	* @param recordKey
+	* @param record
+	*/
+	const startEditable = async (recordKey, record) => {
+		if (!validateCanStartEdit()) return false;
+		if (!editableKeys.value?.some((key) => key === recordKey || key?.toString() === recordKey?.toString())) setEditableRowKeys(editableKeys.value ? [...editableKeys.value || [], recordKey] : [recordKey]);
+		preEditRow.value = record ?? findRecordByKey(recordKey) ?? null;
+		const recordKeyStr = recordKeyToString(recordKey)?.toString();
+		if (recordKeyStr) preEditRows.value.set(recordKeyStr, preEditRow.value);
+		return true;
+	};
+	/**
+	* 清理编辑状态
+	*/
+	const clearEditableState = (recordKey) => {
+		const relayKey = recordKeyToString(recordKey);
+		const relayKeyStr = relayKey != null ? relayKey.toString() : null;
+		if (relayKeyStr == null) return;
+		setEditableRowKeys(editableKeys.value?.filter((key) => key?.toString() !== relayKeyStr && key !== relayKey) ?? []);
+	};
+	/**
+	* 保存或删除完成后仅结束编辑，不执行取消回调，也不恢复编辑前数据。
+	*/
+	const finishEditable = async (recordKey) => {
+		const recordKeyStr = recordKeyToString(recordKey)?.toString();
+		const cacheRecordKey = newLineRecordCache.value?.options.recordKey;
+		const cacheRecordKeyStr = recordKeyToString(cacheRecordKey)?.toString();
+		if (recordKeyStr != null && cacheRecordKeyStr === recordKeyStr) newLineRecordCache.value = void 0;
+		if (recordKeyStr != null) preEditRows.value.delete(recordKeyStr);
+		if (preEditRow.value && recordKeyToString(props.getRowKey.value(preEditRow.value, -1))?.toString() === recordKeyStr) preEditRow.value = null;
+		clearEditableState(recordKey);
+		return true;
+	};
+	/**
+	* 退出编辑状态
+	*
+	* @param recordKey
+	* @param needReTry
+	*/
+	const cancelEditable = async (recordKey, needReTry) => {
+		const relayKey = recordKeyToString(recordKey);
+		const relayKeyStr = relayKey != null ? relayKey.toString() : null;
+		const mappedKey = relayKeyStr != null ? dataSourceKeyIndexMapRef.value.get(relayKeyStr) : void 0;
+		const isInEditableSet = editableKeys.value?.some((key) => {
+			if (relayKeyStr == null) return false;
+			return key?.toString() === relayKeyStr || key === relayKey;
+		});
+		if (!isInEditableSet && mappedKey && (needReTry ?? true) && props.tableName?.value) return await cancelEditable(mappedKey, false);
+		if (props.onCancel && isInEditableSet) {
+			const record = findRecordByKey(Array.isArray(recordKey) ? recordKey[0] : recordKey);
+			const originRow = preEditRow.value;
+			const cacheRecordKey = newLineRecordCache.value?.options?.recordKey;
+			const cacheKey = cacheRecordKey != null ? recordKeyToString(cacheRecordKey) : null;
+			const cacheKeyStr = cacheKey != null ? cacheKey.toString() : null;
+			const newLineConfig = newLineRecordCache.value != null && cacheRecordKey != null && (cacheRecordKey === recordKey || cacheKeyStr != null && relayKeyStr != null && cacheKeyStr === relayKeyStr || cacheRecordKey?.toString() === recordKey?.toString() || String(cacheRecordKey) === String(recordKey)) ? newLineRecordCache.value : void 0;
+			try {
+				await props.onCancel(recordKey, record || newLineConfig?.defaultValue || {}, originRow || record || newLineConfig?.defaultValue || {}, newLineConfig);
+			} catch (error) {
+				console.error("onCancel error:", error);
+			}
+		}
+		if (newLineRecordCache.value) {
+			const cacheRecordKey = newLineRecordCache.value?.options.recordKey;
+			const cacheKeyStr = cacheRecordKey != null ? recordKeyToString(cacheRecordKey)?.toString() : null;
+			if (cacheRecordKey === recordKey || cacheKeyStr != null && relayKeyStr != null && cacheKeyStr === relayKeyStr || cacheRecordKey?.toString() === recordKey?.toString() || String(cacheRecordKey) === String(recordKey)) newLineRecordCache.value = void 0;
+		}
+		const originRow = preEditRow.value;
+		if (originRow && props.getRowKey.value(originRow, -1) === recordKey && isInEditableSet) {
+			try {
+				const form = (props.formProps?.formRef)?.value || props.form;
+				if (form) if (props.tableName?.value) {
+					const namePath = normalizeNamePath(props.tableName.value, resolveFormRecordKey(recordKey));
+					form.setFieldValue(namePath, originRow);
+				} else {
+					const recordKeyStr = recordKeyToString(recordKey)?.toString();
+					if (recordKeyStr) try {
+						form.resetFields([[recordKeyStr]]);
+						form.setFieldsValue({ [recordKeyStr]: void 0 });
+					} catch (error) {
+						console.warn("Failed to clear form fields in cancelEditable:", error);
+					}
+				}
+			} catch (error) {
+				console.warn("Failed to reset form fields in cancelEditable:", error);
+			}
+			preEditRow.value = null;
+		}
+		clearEditableState(recordKey);
+		return true;
+	};
+	const propsOnValuesChange = useDebounceFn(async (...rest) => {
+		props.onValuesChange?.(...rest);
+	}, 64);
+	/**
+	* 构建表单字段路径
+	*/
+	const buildFormFieldPath = (recordKey) => {
+		return normalizeNamePath(props.tableName?.value, resolveFormRecordKey(recordKey));
+	};
+	/**
+	* 更新数据源中的编辑行
+	*/
+	const updateDataSourceWithEditableRows = (dataSource, values) => {
+		let updatedDataSource = dataSource;
+		editableKeys.value?.forEach((eachRecordKey) => {
+			if (newLineRecordCache.value?.options.recordKey === eachRecordKey) return;
+			const recordKey = eachRecordKey.toString();
+			const editRow = get(values, buildFormFieldPath(recordKey));
+			if (!editRow) return;
+			updatedDataSource = editableRowByKey({
+				data: updatedDataSource,
+				getRowKey: getBusinessRowKey,
+				row: editRow,
+				key: recordKey,
+				childrenColumnName: props.childrenColumnName?.value || "children"
+			}, "update");
+		});
+		return updatedDataSource;
+	};
+	/**
+	* 获取当前编辑的行数据
+	*/
+	const getCurrentEditRow = (value, values, dataSource) => {
+		const valueKeys = Object.keys(value || {});
+		if (valueKeys.length === 0) return newLineRecordCache.value?.defaultValue || {};
+		const recordKey = valueKeys.pop()?.toString() || "";
+		if (!recordKey) return newLineRecordCache.value?.defaultValue || {};
+		const fieldPath = buildFormFieldPath(recordKey);
+		const newLineRecordData = {
+			...newLineRecordCache.value?.defaultValue,
+			...get(values, fieldPath)
+		};
+		if (dataSourceKeyIndexMapRef.value.has(recordKeyToString(recordKey))) return dataSource.find((item, index) => {
+			return props.getRowKey.value(item, index)?.toString() === recordKey;
+		}) || newLineRecordData;
+		return newLineRecordData;
+	};
+	const onValuesChange = (value, values) => {
+		if (!props.onValuesChange) return;
+		const updatedDataSource = updateDataSourceWithEditableRows(props.dataSource.value, values);
+		const editRow = getCurrentEditRow(value, values, updatedDataSource);
+		propsOnValuesChange.run(editRow, updatedDataSource);
+	};
+	const saveRefsMap = shallowRef(/* @__PURE__ */ new Map());
+	/** 一个用来标志的set 提供了方便的 api 来去重什么的 */
+	useEffect(() => {
+		const editableKeysSet = new Set(editableKeys.value?.map((key) => key?.toString()) ?? []);
+		saveRefsMap.value.forEach((_, key) => {
+			if (!editableKeysSet.has(key?.toString())) saveRefsMap.value.delete(key);
+		});
+	}, [editableKeys]);
+	/**
+	* 获取保存引用
+	*/
+	const getSaveRef = (recordKey) => {
+		const relayKey = recordKeyToString(recordKey);
+		return saveRefsMap.value.get(relayKey) || saveRefsMap.value.get(relayKey.toString());
+	};
+	/**
+	* 保存编辑行
+	*
+	* @param recordKey
+	* @param needReTry
+	*/
+	const saveEditable = async (recordKey, needReTry) => {
+		const relayKey = recordKeyToString(recordKey);
+		const relayKeyStr = relayKey?.toString();
+		const mappedKey = dataSourceKeyIndexMapRef.value.get(relayKeyStr);
+		if (!editableKeys.value?.some((key) => key?.toString() === relayKeyStr || key === relayKey) && mappedKey && (needReTry ?? true) && props.tableName?.value) return await saveEditable(mappedKey, false);
+		const saveRef = getSaveRef(recordKey);
+		if (!saveRef?.value) return false;
+		await saveRef.value.save();
+		clearEditableState(recordKey);
+		return true;
+	};
+	/**
+	* 验证是否可以新增记录
+	*/
+	const validateCanAddRecord = (options) => {
+		if (options?.parentKey && !dataSourceKeyIndexMapRef.value.has(recordKeyToString(typeof options?.parentKey === "function" ? options?.parentKey() : options?.parentKey).toString())) {
+			console.warn("can't find record by key", options?.parentKey);
+			return false;
+		}
+		if (newLineRecordRef.value && props.onlyAddOneLineAlertMessage !== false) {
+			messageApi.warning(props.onlyAddOneLineAlertMessage || intl.value.getMessage({
+				id: "editableTable.onlyAddOneLine",
+				defaultMessage: "只能新增一行"
+			}));
+			return false;
+		}
+		if (!validateCanStartEdit()) return false;
+		return true;
+	};
+	/**
+	* 验证记录 key 是否有效
+	*/
+	const validateRecordKey = (recordKey) => {
+		if (recordKey == null && recordKey !== 0 && recordKey !== "") {
+			noteOnce(false, "请设置 recordCreatorProps.record 并返回一个唯一的key  \n  https://procomponents.ant.design/components/editable-table#editable-%E6%96%B0%E5%BB%BA%E8%A1%8C");
+			throw new Error("请设置 recordCreatorProps.record 并返回一个唯一的key");
+		}
+	};
+	const addEditRecord = async (row, options) => {
+		if (!validateCanAddRecord(options)) return false;
+		const recordKey = props.getRowKey.value(row, -1);
+		validateRecordKey(recordKey);
+		const recordKeyStr = recordKeyToString(recordKey)?.toString();
+		if (recordKeyStr) preEditRows.value.set(recordKeyStr, null);
+		if (!editableKeys.value?.some((key) => key === recordKey || key?.toString() === recordKey?.toString())) setEditableRowKeys(editableKeys.value ? [...editableKeys.value, recordKey] : [recordKey]);
+		const parentKeyValue = typeof options?.parentKey === "function" ? options.parentKey() : options?.parentKey;
+		if (options?.newRecordType === "dataSource" || props.tableName?.value && options?.newRecordType !== "cache") {
+			const actionProps = {
+				data: props.dataSource.value,
+				getRowKey: getBusinessRowKey,
+				row: {
+					...row,
+					map_row_parentKey: parentKeyValue ? recordKeyToString(parentKeyValue)?.toString() : void 0
+				},
+				key: recordKey,
+				childrenColumnName: props.childrenColumnName?.value || "children"
+			};
+			props.setDataSource(editableRowByKey(actionProps, options?.position === "top" ? "top" : "update"));
+		} else newLineRecordCache.value = {
+			defaultValue: row,
+			options: {
+				...options,
+				parentKey: parentKeyValue,
+				recordKey
+			}
+		};
+		return true;
+	};
+	const saveText = props?.saveText || intl.value.getMessage({
+		id: "editableTable.action.save",
+		defaultMessage: "保存"
+	});
+	const deleteText = props?.deleteText || intl.value.getMessage({
+		id: "editableTable.action.delete",
+		defaultMessage: "删除"
+	});
+	const cancelText = props?.cancelText || intl.value.getMessage({
+		id: "editableTable.action.cancel",
+		defaultMessage: "取消"
+	});
+	const actionSave = async (recordKey, editRow, originRow, newLine) => {
+		const res = await props?.onSave?.(recordKey, editRow, originRow, newLine);
+		if (res === false) return res;
+		const { options } = newLine || newLineRecordRef.value || {};
+		if (!options?.parentKey && options?.recordKey === recordKey) if (options?.position === "top") props.setDataSource([editRow, ...props.dataSource.value]);
+		else props.setDataSource([...props.dataSource.value, editRow]);
+		else {
+			const actionProps = {
+				data: props.dataSource.value,
+				getRowKey: getBusinessRowKey,
+				row: options ? {
+					...editRow,
+					map_row_parentKey: recordKeyToString((typeof options?.parentKey === "function" ? options.parentKey() : options?.parentKey) || "")?.toString()
+				} : editRow,
+				key: recordKey,
+				childrenColumnName: props.childrenColumnName?.value || "children"
+			};
+			props.setDataSource(editableRowByKey(actionProps, options?.position === "top" ? "top" : "update"));
+		}
+		await finishEditable(recordKey);
+		return res;
+	};
+	const actionDelete = async (recordKey, editRow) => {
+		const actionProps = {
+			data: props.dataSource.value,
+			getRowKey: getBusinessRowKey,
+			row: editRow,
+			key: recordKey,
+			childrenColumnName: props.childrenColumnName?.value || "children"
+		};
+		const res = await props?.onDelete?.(recordKey, editRow);
+		if (res === false) return false;
+		await finishEditable(recordKey);
+		props.setDataSource(editableRowByKey(actionProps, "delete"));
+		return res;
+	};
+	const actionCancel = async (recordKey, editRow, originRow, newLine) => await props?.onCancel?.(recordKey, editRow, originRow, newLine);
+	const existCustomActionRender = props.actionRender && typeof props.actionRender === "function";
+	const customActionRender = existCustomActionRender ? props.actionRender : () => {};
+	const actionRender = (row) => {
+		const key = props.getRowKey.value(row, -1);
+		const config = {
+			saveText,
+			cancelText,
+			deleteText,
+			addEditRecord,
+			recordKey: key,
+			formRecordKey: resolveFormRecordKey(key, row.index),
+			cancelEditable,
+			finishEditable,
+			index: row.index,
+			tableName: props.tableName?.value,
+			newLineConfig: newLineRecordCache.value,
+			onCancel: actionCancel,
+			onDelete: actionDelete,
+			onSave: actionSave,
+			editableKeys: editableKeys.value,
+			setEditableRowKeys,
+			preEditRow: preEditRow.value,
+			"onUpdate:preEditRow": (_preEditRow) => preEditRow.value = _preEditRow,
+			preEditRows: preEditRows.value,
+			deletePopconfirmMessage: props.deletePopconfirmMessage || `${intl.value.getMessage({
+				id: "deleteThisLine",
+				defaultMessage: "删除此项"
+			})}?`
+		};
+		const renderResult = defaultActionRender(row, config);
+		if (props.tableName?.value) saveRefsMap.value.set(dataSourceKeyIndexMapRef.value.get(recordKeyToString(key)) || recordKeyToString(key), renderResult.saveRef);
+		else saveRefsMap.value.set(recordKeyToString(key), renderResult.saveRef);
+		if (existCustomActionRender) return customActionRender?.(row, config, {
+			save: renderResult.save,
+			delete: renderResult.delete,
+			cancel: renderResult.cancel
+		});
+		return [
+			renderResult.save,
+			renderResult.delete,
+			renderResult.cancel
+		];
+	};
+	return {
+		messageContextHolder: ContextHolder,
+		editableKeys,
+		setEditableRowKeys,
+		isEditable,
+		actionRender,
+		startEditable,
+		cancelEditable,
+		addEditRecord,
+		saveEditable,
+		newLineRecord: newLineRecordCache,
+		preEditableKeys: editableKeysRef,
+		onValuesChange,
+		getRealIndex: props.getRealIndex
+	};
+}
+//#endregion
+export { defaultActionRender, editableRowByKey, recordKeyToString, useEditableArray };