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

package/dist/components/FormList/Field.js

@@ -0,0 +1,106 @@
+import { useProFormContextInject } from "../ProFormContext/index.js";
+import { useFormFieldContextInject } from "./FieldContext.js";
+import InternalField from "./InternalField.js";
+import { useFormListContextInject } from "./ListContext.js";
+import { computed, createVNode, defineComponent, mergeProps } from "vue";
+import { getNamePath } from "antdv-next/dist/form/utils/valueUtil";
+//#region src/components/FormList/Field.tsx
+const FormListField = /* @__PURE__ */ defineComponent((props, { slots }) => {
+	const fieldContext = useFormFieldContextInject();
+	const listContext = useFormListContextInject();
+	const { formRef } = useProFormContextInject();
+	const namePath = computed(() => props.name !== void 0 ? getNamePath(props.name) : void 0);
+	return () => {
+		const { name, ...restProps } = props;
+		const isMergedListField = restProps.isListField ?? !!listContext;
+		let key = "keep";
+		if (!isMergedListField) key = `_${(namePath.value || []).join("_")}`;
+		return createVNode(InternalField, mergeProps({ "key": key }, restProps, {
+			"isListField": isMergedListField,
+			"name": namePath.value,
+			"fieldContext": Object.keys(fieldContext).length ? fieldContext : formRef?.value
+		}), slots);
+	};
+}, {
+	props: {
+		dependencies: {
+			type: Array,
+			required: false
+		},
+		rules: {
+			type: Array,
+			required: false
+		},
+		messageVariables: {
+			type: Object,
+			required: false
+		},
+		initialValue: { required: false },
+		valuePropName: {
+			type: String,
+			required: false
+		},
+		validateTrigger: {
+			type: [
+				String,
+				Array,
+				Boolean
+			],
+			required: false,
+			default: void 0
+		},
+		getValueProps: {
+			type: Function,
+			required: false
+		},
+		getValueFromEvent: {
+			type: Function,
+			required: false
+		},
+		trigger: {
+			type: [String, Array],
+			required: false
+		},
+		isList: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		isListField: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		validateDebounce: {
+			type: Number,
+			required: false
+		},
+		validateFirst: {
+			type: [Boolean, String],
+			required: false,
+			default: void 0
+		},
+		normalize: {
+			type: Function,
+			required: false
+		},
+		preserve: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		onReset: {
+			type: Function,
+			required: false
+		},
+		onMetaChange: {
+			type: Function,
+			required: false
+		},
+		name: { required: false }
+	},
+	name: "FormListField",
+	inheritAttrs: false
+});
+//#endregion
+export { FormListField as default };

package/dist/components/FormList/FieldContext.d.ts

@@ -0,0 +1,15 @@
+import { InternalNamePath } from "./interface.js";
+import { ComputedRef, InjectionKey } from "vue";
+import { FormInstance } from "antdv-next";
+
+//#region src/components/FormList/FieldContext.d.ts
+type FieldContextProps = FormInstance & {
+  prefixName?: ComputedRef<InternalNamePath>;
+  el?: HTMLFormElement;
+  initialValue: any[];
+};
+declare const formFieldContextKey: InjectionKey<FieldContextProps>;
+declare function useFormFieldContextProvider(props: FieldContextProps): void;
+declare function useFormFieldContextInject(): FieldContextProps;
+//#endregion
+export { FieldContextProps, formFieldContextKey, useFormFieldContextInject, useFormFieldContextProvider };

package/dist/components/FormList/FieldContext.js

@@ -0,0 +1,11 @@
+import { inject, provide } from "vue";
+//#region src/components/FormList/FieldContext.ts
+const formFieldContextKey = Symbol("formFieldContext");
+function useFormFieldContextProvider(props) {
+	return provide(formFieldContextKey, props);
+}
+function useFormFieldContextInject() {
+	return inject(formFieldContextKey, {});
+}
+//#endregion
+export { formFieldContextKey, useFormFieldContextInject, useFormFieldContextProvider };

package/dist/components/FormList/InternalField.d.ts

@@ -0,0 +1,51 @@
+import { InternalNamePath, NamePath as NamePath$1, Store as Store$1, StoreValue as StoreValue$1 } from "./interface.js";
+import * as _$vue from "vue";
+import { ComputedRef, SlotsType } from "vue";
+import { FormInstance } from "antdv-next";
+import { Meta, Rule, TriggerType } from "antdv-next/dist/form/types";
+
+//#region src/components/FormList/InternalField.d.ts
+type MetaEvent = Meta & {
+  destroy?: boolean;
+};
+interface InternalFieldProps {
+  dependencies?: NamePath$1<string | number | boolean>[];
+  name?: NamePath$1<string | number | boolean>;
+  rules?: Rule[];
+  messageVariables?: Record<string, string>;
+  initialValue?: any;
+  valuePropName?: 'checked' | 'value' | 'fileList';
+  validateTrigger?: string | string[] | false;
+  getValueProps?: (value: StoreValue$1) => Record<string, unknown>;
+  getValueFromEvent?: (...args: any[]) => StoreValue$1;
+  trigger?: TriggerType | TriggerType[];
+  /** @private Passed by Form.List props. Do not use since it will break by path check. */
+  isList?: boolean;
+  isListField?: boolean;
+  /**
+   * Trigger will after configured milliseconds.
+   */
+  validateDebounce?: number;
+  validateFirst?: boolean | 'parallel';
+  normalize?: (value: StoreValue$1, prevValue: StoreValue$1, allValues: Store$1) => StoreValue$1;
+  fieldContext?: FormInstance & {
+    prefixName?: ComputedRef<InternalNamePath>;
+    initialValue?: any[];
+  } | null;
+  preserve?: boolean;
+  onReset?: () => void;
+  onMetaChange?: (meta: MetaEvent) => void;
+}
+interface ChildProps {
+  value?: any[];
+  onChange?: (...restParms: any[]) => void;
+  [key: string]: any;
+}
+declare const InternalField: _$vue.DefineSetupFnComponent<InternalFieldProps, {}, SlotsType<{
+  default?: (control: ChildProps, meta: Meta, form?: ((FormInstance & {
+    prefixName?: ComputedRef<InternalNamePath>;
+    initialValue?: any[];
+  }) | null)) => any;
+}>, InternalFieldProps & {}, _$vue.PublicProps>;
+//#endregion
+export { ChildProps, InternalFieldProps, MetaEvent, InternalField as default };

package/dist/components/FormList/InternalField.js

@@ -0,0 +1,149 @@
+import { useProFormContextInject } from "../ProFormContext/index.js";
+import { defaultGetValueFromEvent } from "./utils/index.js";
+import { defineComponent } from "vue";
+import { getNamePath, getValue, setValue } from "antdv-next/dist/form/utils/valueUtil";
+import { useFormContext } from "antdv-next/dist/form/context";
+//#region src/components/FormList/InternalField.tsx
+const triggerKey = {
+	"change": "onChange",
+	"blur": "onBlur",
+	"focus": "onFocus"
+};
+const InternalField = /* @__PURE__ */ defineComponent((props, { slots }) => {
+	const { formRef } = useProFormContextInject();
+	const formContext = useFormContext();
+	const getNamePath$1 = () => {
+		const { name } = props;
+		return name !== void 0 ? [...props.fieldContext?.prefixName?.value || [], ...getNamePath(name)] : [];
+	};
+	const getFieldValue = (store) => {
+		const namePath = getNamePath$1();
+		return getValue(store || formContext.value.model, namePath);
+	};
+	if (props.initialValue !== void 0) {
+		const namePath = getNamePath$1();
+		if (namePath.length) {
+			if (getValue(formContext.value.model, namePath) === void 0 && namePath.length && formRef?.value) formRef.value.setFieldsValue(setValue(formContext.value.model, namePath, props.initialValue));
+		}
+	}
+	const triggerFn = (...args) => {
+		const { getValueFromEvent, normalize, valuePropName = "value" } = props;
+		const value = getFieldValue();
+		let newValue;
+		const namePath = getNamePath$1();
+		if (getValueFromEvent) newValue = getValueFromEvent(...args);
+		else newValue = defaultGetValueFromEvent(valuePropName, ...args);
+		if (normalize) newValue = normalize(newValue, value, formContext.value.model);
+		if (newValue !== value && formRef?.value) formRef.value.setFieldValue(namePath, newValue);
+	};
+	const mergedGetValueProps = props.getValueProps || ((val) => {
+		const { valuePropName = "value" } = props;
+		return {
+			[valuePropName]: val,
+			[`onUpdate:${valuePropName}`]: triggerFn
+		};
+	});
+	return () => {
+		const { trigger = "change", fieldContext } = props;
+		const value = getFieldValue();
+		const meta = {
+			touched: false,
+			validated: false,
+			validating: false,
+			name: getNamePath$1(),
+			errors: [],
+			warnings: []
+		};
+		const control = { ...props.name !== void 0 ? mergedGetValueProps(value) : {} };
+		(Array.isArray(trigger) ? trigger : [trigger]).forEach((key) => {
+			control[triggerKey[key]] = triggerFn;
+		});
+		return slots.default?.(control, meta, fieldContext);
+	};
+}, {
+	props: {
+		dependencies: {
+			type: Array,
+			required: false
+		},
+		name: { required: false },
+		rules: {
+			type: Array,
+			required: false
+		},
+		messageVariables: {
+			type: Object,
+			required: false
+		},
+		initialValue: { required: false },
+		valuePropName: {
+			type: String,
+			required: false
+		},
+		validateTrigger: {
+			type: [
+				String,
+				Array,
+				Boolean
+			],
+			required: false,
+			default: void 0
+		},
+		getValueProps: {
+			type: Function,
+			required: false
+		},
+		getValueFromEvent: {
+			type: Function,
+			required: false
+		},
+		trigger: {
+			type: [String, Array],
+			required: false
+		},
+		isList: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		isListField: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		validateDebounce: {
+			type: Number,
+			required: false
+		},
+		validateFirst: {
+			type: [Boolean, String],
+			required: false,
+			default: void 0
+		},
+		normalize: {
+			type: Function,
+			required: false
+		},
+		fieldContext: {
+			type: [Object, null],
+			required: false
+		},
+		preserve: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		onReset: {
+			type: Function,
+			required: false
+		},
+		onMetaChange: {
+			type: Function,
+			required: false
+		}
+	},
+	name: "InternalField",
+	inheritAttrs: false
+});
+//#endregion
+export { InternalField as default };

package/dist/components/FormList/ListContext.d.ts

@@ -0,0 +1,12 @@
+import { InternalNamePath } from "./interface.js";
+import { InjectionKey } from "vue";
+
+//#region src/components/FormList/ListContext.d.ts
+interface ListContextProps {
+  getKey: (namePath: InternalNamePath) => [InternalNamePath[number], InternalNamePath];
+}
+declare const formListContextKey: InjectionKey<ListContextProps>;
+declare function useFormListContextProvider(props: ListContextProps): void;
+declare function useFormListContextInject(): ListContextProps;
+//#endregion
+export { ListContextProps, formListContextKey, useFormListContextInject, useFormListContextProvider };

package/dist/components/FormList/ListContext.js

@@ -0,0 +1,11 @@
+import { inject, provide } from "vue";
+//#region src/components/FormList/ListContext.ts
+const formListContextKey = Symbol("formListContext");
+function useFormListContextProvider(props) {
+	return provide(formListContextKey, props);
+}
+function useFormListContextInject() {
+	return inject(formListContextKey, null);
+}
+//#endregion
+export { formListContextKey, useFormListContextInject, useFormListContextProvider };

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

@@ -0,0 +1,36 @@
+import { StoreValue as StoreValue$1 } from "./interface.js";
+import * as _$vue from "vue";
+import { CustomSlotsType, VueNode } from "@v-c/util/dist/type";
+import { NamePath, ValidatorRule } from "antdv-next/dist/form/types";
+
+//#region src/components/FormList/index.d.ts
+interface FormListFieldData {
+  name?: number;
+  key: number;
+  isListField: boolean;
+  [key: string]: any;
+}
+interface FormListOperation {
+  add: (defaultValue?: StoreValue$1, insertIndex?: number) => void;
+  remove: (index: number | number[]) => void;
+  move: (from: number, to: number) => void;
+}
+interface FormListProps {
+  prefixCls?: string;
+  name?: NamePath<string | number | boolean>;
+  rules?: ValidatorRule[];
+  initialValue?: any[];
+  isListField?: boolean;
+}
+declare const FormList: _$vue.DefineSetupFnComponent<FormListProps & {
+  validateTrigger?: string | string[] | false;
+}, {}, CustomSlotsType<{
+  default?: (fields: FormListFieldData[], operation: FormListOperation, meta: {
+    errors: VueNode[];
+    warnings: VueNode[];
+  }) => VueNode;
+}>, FormListProps & {
+  validateTrigger?: string | string[] | false;
+} & {}, _$vue.PublicProps>;
+//#endregion
+export { FormListFieldData, FormListOperation, FormListProps, FormList as default };

package/dist/components/FormList/index.js

@@ -0,0 +1,145 @@
+import { useProFormContextInject } from "../ProFormContext/index.js";
+import { useFormFieldContextInject, useFormFieldContextProvider } from "./FieldContext.js";
+import { move } from "./utils/index.js";
+import { useFormListContextInject, useFormListContextProvider } from "./ListContext.js";
+import FormListField from "./Field.js";
+import { computed, createVNode, defineComponent, reactive } from "vue";
+import { getNamePath } from "antdv-next/dist/form/utils/valueUtil";
+import warning from "antdv-next/dist/_util/warning";
+//#region src/components/FormList/index.tsx
+const FormList = /* @__PURE__ */ defineComponent((props, { slots }) => {
+	const { formRef } = useProFormContextInject();
+	const fieldContext = useFormFieldContextInject();
+	const wrapperListContext = useFormListContextInject();
+	const keyManager = reactive({
+		keys: [],
+		id: 0
+	});
+	const prefixName = computed(() => {
+		return [...getNamePath(fieldContext.prefixName?.value) || [], ...getNamePath(props.name)];
+	});
+	useFormFieldContextProvider({
+		...formRef?.value,
+		get nativeElement() {
+			return formRef.value?.nativeElement;
+		},
+		get el() {
+			return formRef.value?.nativeElement;
+		},
+		...fieldContext,
+		prefixName,
+		initialValue: props.initialValue || []
+	});
+	useFormListContextProvider({ getKey: (namePath) => {
+		const len = prefixName.value.length;
+		const pathName = namePath[len];
+		return [keyManager.keys[pathName], namePath.slice(len + 1)];
+	} });
+	return () => {
+		const { rules, validateTrigger, isListField, initialValue } = props;
+		return createVNode(FormListField, {
+			"name": [],
+			"rules": rules,
+			"validateTrigger": validateTrigger,
+			"initialValue": initialValue,
+			"isList": true,
+			"isListField": isListField ?? !!wrapperListContext
+		}, { default: ({ value = [], onChange }, meta) => {
+			const getNewValue = () => {
+				return formRef?.value?.getFieldValue(prefixName.value || []) || [];
+			};
+			/**
+			* Always get latsest value in case user update fields by `form` api.
+			*/
+			const operations = {
+				add: (defaultValue, index = 0) => {
+					const newValue = getNewValue();
+					if (index >= 0 && index <= newValue.length) {
+						keyManager.keys = [
+							...keyManager.keys.slice(0, index),
+							keyManager.id,
+							...keyManager.keys.slice(index)
+						];
+						onChange?.([
+							...newValue.slice(0, index),
+							defaultValue,
+							...newValue.slice(index)
+						]);
+					} else {
+						if (process.env.NODE_ENV !== "production" && (index < 0 || index > newValue.length)) warning(false, "The second parameter of the add function should be a valid positive number.");
+						keyManager.keys = [...keyManager.keys, keyManager.id];
+						onChange?.([...newValue, defaultValue]);
+					}
+					keyManager.id += 1;
+				},
+				remove: (index) => {
+					const newValue = getNewValue();
+					const indexSet = new Set(Array.isArray(index) ? index : [index]);
+					if (indexSet.size <= 0) return;
+					keyManager.keys = keyManager.keys.filter((_, keysIndex) => !indexSet.has(keysIndex));
+					onChange?.(newValue.filter((_, valueIndex) => !indexSet.has(valueIndex)));
+				},
+				move(from, to) {
+					if (from === to) return;
+					const newValue = getNewValue();
+					if (from < 0 || from >= newValue.length || to < 0 || to >= newValue.length) return;
+					keyManager.keys = move(keyManager.keys, from, to);
+					onChange?.(move(newValue, from, to));
+				}
+			};
+			let listValue = value || [];
+			if (!Array.isArray(listValue)) {
+				listValue = [];
+				if (process.env.NODE_ENV !== "production") warning(false, `Current value of '${prefixName.value.join(" > ")}' is not an array type.`);
+			}
+			return slots.default?.(listValue.map((__, index) => {
+				let key = keyManager.keys[index];
+				if (key === void 0) {
+					keyManager.keys[index] = keyManager.id;
+					key = keyManager.keys[index];
+					keyManager.id += 1;
+				}
+				return {
+					name: index,
+					key,
+					fieldKey: key,
+					isListField: true
+				};
+			}), operations, meta);
+		} });
+	};
+}, {
+	props: {
+		prefixCls: {
+			type: String,
+			required: false
+		},
+		name: { required: false },
+		rules: {
+			type: Array,
+			required: false
+		},
+		initialValue: {
+			type: Array,
+			required: false
+		},
+		isListField: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		validateTrigger: {
+			type: [
+				String,
+				Array,
+				Boolean
+			],
+			required: false,
+			default: void 0
+		}
+	},
+	name: "FormList",
+	inheritAttrs: false
+});
+//#endregion
+export { FormList as default };

package/dist/components/FormList/interface.d.ts

@@ -0,0 +1,9 @@
+import { DeepNamePath } from "./namePathType.js";
+
+//#region src/components/FormList/interface.d.ts
+type StoreValue = any;
+type Store = Record<string, StoreValue>;
+type InternalNamePath = (string | number)[];
+type NamePath<T = any> = DeepNamePath<T>;
+//#endregion
+export { InternalNamePath, NamePath, Store, StoreValue };

package/dist/components/FormList/interface.js

@@ -0,0 +1 @@
+export {};

package/dist/components/FormList/namePathType.d.ts

@@ -0,0 +1,9 @@
+//#region src/components/FormList/namePathType.d.ts
+type BaseNamePath = string | number | boolean | (string | number | boolean)[];
+/**
+ * Store: The store type from `FormInstance<Store>`
+ * ParentNamePath: Auto generate by nest logic. Do not fill manually.
+ */
+type DeepNamePath<Store = any, ParentNamePath extends any[] = []> = ParentNamePath['length'] extends 5 ? never : true extends (Store extends BaseNamePath ? true : false) ? ParentNamePath['length'] extends 0 ? Store | BaseNamePath : Store extends any[] ? [...ParentNamePath, number] : never : Store extends any[] ? [...ParentNamePath, number] | DeepNamePath<Store[number], [...ParentNamePath, number]> : keyof Store extends never ? Store : { [FieldKey in keyof Store]: Store[FieldKey] extends ((...arg: any[]) => any) ? never : (ParentNamePath['length'] extends 0 ? FieldKey : never) | [...ParentNamePath, FieldKey] | DeepNamePath<Required<Store>[FieldKey], [...ParentNamePath, FieldKey]> }[keyof Store];
+//#endregion
+export { DeepNamePath };

package/dist/components/FormList/namePathType.js

@@ -0,0 +1 @@
+export {};

package/dist/components/FormList/utils/index.d.ts

@@ -0,0 +1,15 @@
+//#region src/components/FormList/utils/index.d.ts
+/**
+ * Moves an array item from one position in an array to another.
+ *
+ * Note: This is a pure function so a new array will be returned, instead
+ * of altering the array argument.
+ *
+ * @param array         Array in which to move an item.         (required)
+ * @param moveIndex     The index of the item to move.          (required)
+ * @param toIndex       The index to move item at moveIndex to. (required)
+ */
+declare function move<T>(array: T[], moveIndex: number, toIndex: number): (T | undefined)[];
+declare function defaultGetValueFromEvent(valuePropName: string, ...args: any[]): any;
+//#endregion
+export { defaultGetValueFromEvent, move };

package/dist/components/FormList/utils/index.js

@@ -0,0 +1,37 @@
+//#region src/components/FormList/utils/index.ts
+/**
+* Moves an array item from one position in an array to another.
+*
+* Note: This is a pure function so a new array will be returned, instead
+* of altering the array argument.
+*
+* @param array         Array in which to move an item.         (required)
+* @param moveIndex     The index of the item to move.          (required)
+* @param toIndex       The index to move item at moveIndex to. (required)
+*/
+function move(array, moveIndex, toIndex) {
+	const { length } = array;
+	if (moveIndex < 0 || moveIndex >= length || toIndex < 0 || toIndex >= length) return array;
+	const item = array[moveIndex];
+	const diff = moveIndex - toIndex;
+	if (diff > 0) return [
+		...array.slice(0, toIndex),
+		item,
+		...array.slice(toIndex, moveIndex),
+		...array.slice(moveIndex + 1, length)
+	];
+	if (diff < 0) return [
+		...array.slice(0, moveIndex),
+		...array.slice(moveIndex + 1, toIndex + 1),
+		item,
+		...array.slice(toIndex + 1, length)
+	];
+	return array;
+}
+function defaultGetValueFromEvent(valuePropName, ...args) {
+	const event = args[0];
+	if (event && event.target && typeof event.target === "object" && valuePropName in event.target) return event.target[valuePropName];
+	return event;
+}
+//#endregion
+export { defaultGetValueFromEvent, move };

package/dist/components/InlineErrorFormItem/InlineErrorFormItemPopover.d.ts

@@ -0,0 +1,21 @@
+import { FormItemProps as FormItemProps$1 } from "../FormItem/index.js";
+import * as _$vue from "vue";
+import { VNode } from "vue";
+import { VueNode } from "@v-c/util";
+import { PopoverProps } from "antdv-next";
+
+//#region src/components/InlineErrorFormItem/InlineErrorFormItemPopover.d.ts
+interface InlineErrorFormItemPopoverProps {
+  prefixCls?: string;
+  inputProps: FormItemProps$1 & {
+    errors?: VueNode[];
+    warnings?: VueNode[];
+  };
+  input?: VNode | null;
+  errorList?: VNode | null;
+  extra?: VNode | null;
+  popoverProps?: PopoverProps;
+}
+declare const InlineErrorFormItemPopover: _$vue.DefineSetupFnComponent<InlineErrorFormItemPopoverProps, {}, {}, InlineErrorFormItemPopoverProps & {}, _$vue.PublicProps>;
+//#endregion
+export { InlineErrorFormItemPopoverProps, InlineErrorFormItemPopover as default };