antdv-next 0.0.111 → 1.0.0-alpha.1

package/dist/upload/Dragger.js

@@ -0,0 +1,194 @@
+import { getAttrStyleAndClass } from "../_util/hooks/useMergeSemantic.js";
+import "../_util/hooks/index.js";
+import Upload_default from "./Upload.js";
+import { computed, createVNode, defineComponent, mergeProps, shallowRef } from "vue";
+
+//#region src/upload/Dragger.tsx
+const Dragger = /* @__PURE__ */ defineComponent((props, { slots, attrs, expose }) => {
+	const uploadRef = shallowRef();
+	expose({
+		onBatchStart: (...args) => uploadRef.value?.onBatchStart?.(...args),
+		onSuccess: (...args) => uploadRef.value?.onSuccess?.(...args),
+		onProgress: (...args) => uploadRef.value?.onProgress?.(...args),
+		onError: (...args) => uploadRef.value?.onError?.(...args),
+		fileList: computed(() => uploadRef.value?.fileList ?? []),
+		upload: computed(() => uploadRef.value?.upload ?? null),
+		nativeElement: computed(() => uploadRef.value?.nativeElement ?? null)
+	});
+	return () => {
+		const { height, hasControlInside = false,...restProps } = props;
+		const { className, style, restAttrs } = getAttrStyleAndClass(attrs);
+		const mergedStyle = {
+			...style,
+			height
+		};
+		return createVNode(Upload_default, mergeProps(restAttrs, restProps, {
+			"ref": uploadRef,
+			"class": className,
+			"style": mergedStyle,
+			"hasControlInside": hasControlInside,
+			"type": "drag"
+		}), { default: () => [slots.default?.()] });
+	};
+}, {
+	props: {
+		type: {
+			type: String,
+			required: false
+		},
+		name: {
+			type: String,
+			required: false
+		},
+		defaultFileList: {
+			type: Array,
+			required: false
+		},
+		fileList: {
+			type: Array,
+			required: false
+		},
+		action: {
+			type: [String, Function],
+			required: false
+		},
+		directory: {
+			type: Boolean,
+			required: false
+		},
+		data: {
+			type: [Object, Function],
+			required: false
+		},
+		method: {
+			type: String,
+			required: false
+		},
+		headers: {
+			type: Object,
+			required: false
+		},
+		showUploadList: {
+			type: [Boolean, Object],
+			required: false
+		},
+		multiple: {
+			type: Boolean,
+			required: false
+		},
+		accept: {
+			type: [String, Object],
+			required: false
+		},
+		beforeUpload: {
+			type: Function,
+			required: false
+		},
+		listType: {
+			type: String,
+			required: false
+		},
+		classes: {
+			type: [Object, Function],
+			required: false
+		},
+		styles: {
+			type: [Object, Function],
+			required: false
+		},
+		rootClass: {
+			type: String,
+			required: false
+		},
+		supportServerRender: {
+			type: Boolean,
+			required: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false
+		},
+		prefixCls: {
+			type: String,
+			required: false
+		},
+		customRequest: {
+			type: Function,
+			required: false
+		},
+		withCredentials: {
+			type: Boolean,
+			required: false
+		},
+		openFileDialogOnClick: {
+			type: Boolean,
+			required: false
+		},
+		locale: {
+			type: Object,
+			required: false
+		},
+		id: {
+			type: String,
+			required: false
+		},
+		previewFile: {
+			type: Function,
+			required: false
+		},
+		iconRender: {
+			type: Function,
+			required: false
+		},
+		isImageUrl: {
+			type: Function,
+			required: false
+		},
+		progress: {
+			type: Object,
+			required: false
+		},
+		itemRender: {
+			type: Function,
+			required: false
+		},
+		maxCount: {
+			type: Number,
+			required: false
+		},
+		onRemove: {
+			type: Function,
+			required: false
+		},
+		onPreview: {
+			type: Function,
+			required: false
+		},
+		onDownload: {
+			type: Function,
+			required: false
+		},
+		capture: {
+			type: [String, Boolean],
+			required: false
+		},
+		hasControlInside: {
+			type: Boolean,
+			required: false
+		},
+		pastable: {
+			type: Boolean,
+			required: false
+		},
+		height: {
+			type: Number,
+			required: false
+		}
+	},
+	name: "AUploadDragger",
+	inheritAttrs: false
+});
+var Dragger_default = Dragger;
+
+//#endregion
+export { Dragger_default as default };

package/dist/upload/Upload.d.ts

@@ -0,0 +1,12 @@
+import { UploadEmits, UploadProps, UploadSlots } from "./interface.js";
+import * as vue289 from "vue";
+import { SlotsType } from "vue";
+import "@v-c/upload";
+
+//#region src/upload/Upload.d.ts
+
+declare const InternalUpload: vue289.DefineSetupFnComponent<UploadProps<any>, UploadEmits<any>, SlotsType<UploadSlots<any>>, UploadProps<any> & {
+  [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
+}, vue289.PublicProps>;
+//#endregion
+export { InternalUpload };

package/dist/upload/Upload.js

@@ -0,0 +1,491 @@
+import { useComponentBaseConfig } from "../config-provider/context.js";
+import { getAttrStyleAndClass as getAttrStyleAndClass$1, useMergeSemantic, useToArr, useToProps } from "../_util/hooks/useMergeSemantic.js";
+import { devUseWarning, isDev } from "../_util/warning.js";
+import "../_util/hooks/index.js";
+import { toPropsRefs } from "../_util/tools.js";
+import useCSSVarCls_default from "../config-provider/hooks/useCSSVarCls.js";
+import { useDisabledContext } from "../config-provider/DisabledContext.js";
+import useLocale_default from "../locale/useLocale.js";
+import style_default from "./style/index.js";
+import { file2Obj, getFileItem, removeFileItem, updateFileList } from "./utils.js";
+import UploadList_default from "./UploadList/index.js";
+import { computed, createVNode, defineComponent, isVNode, mergeDefaults, mergeProps, nextTick, shallowRef, watch } from "vue";
+import { clsx } from "@v-c/util";
+import { filterEmpty } from "@v-c/util/dist/props-util";
+import VcUpload from "@v-c/upload";
+
+//#region src/upload/Upload.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const LIST_IGNORE = `__LIST_IGNORE_${Date.now()}__`;
+const InternalUpload = /* @__PURE__ */ defineComponent((props, { slots, attrs, expose, emit }) => {
+	const { prefixCls, direction, class: contextClassName, style: contextStyle, classes: contextClassNames, styles: contextStyles, customRequest: contextCustomRequest } = useComponentBaseConfig("upload", props, ["customRequest"]);
+	const { disabled: customDisabled, classes, styles, rootClass } = toPropsRefs(props, "disabled", "classes", "styles", "rootClass");
+	const disabled = useDisabledContext();
+	const mergedDisabled = computed(() => customDisabled.value ?? disabled.value);
+	const customRequest = computed(() => props?.customRequest ?? contextCustomRequest.value);
+	const internalFileList = shallowRef(props?.fileList ?? props?.defaultFileList ?? []);
+	watch(() => props.fileList, () => {
+		if (props.fileList !== void 0) internalFileList.value = props?.fileList ?? [];
+	});
+	const mergedFileList = computed(() => props?.fileList ?? internalFileList.value ?? []);
+	const dragState = shallowRef("drop");
+	const upload = shallowRef();
+	const wrapRef = shallowRef(null);
+	if (isDev) devUseWarning("Upload")(props.fileList !== void 0 || !("value" in attrs), "usage", "`value` is not a valid prop, do you mean `fileList`?");
+	watch(() => props?.fileList, () => {
+		const timestamp = Date.now();
+		(props?.fileList || []).forEach((file, index) => {
+			if (!file.uid && !Object.isFrozen(file)) file.uid = `__AUTO__${timestamp}_${index}__`;
+		});
+	}, { immediate: true });
+	const onInternalChange = (file, changedFileList, event) => {
+		const { maxCount } = props;
+		let cloneList = [...changedFileList];
+		let exceedMaxCount = false;
+		if (maxCount === 1) cloneList = cloneList.slice(-1);
+		else if (maxCount) {
+			exceedMaxCount = cloneList.length > maxCount;
+			cloneList = cloneList.slice(0, maxCount);
+		}
+		if (props.fileList === void 0) internalFileList.value = cloneList;
+		nextTick(() => {
+			emit("update:fileList", cloneList);
+		});
+		const changeInfo = {
+			file,
+			fileList: cloneList
+		};
+		if (event) changeInfo.event = event;
+		if (!exceedMaxCount || file.status === "removed" || cloneList.some((f) => f.uid === file.uid)) nextTick(() => {
+			emit("change", changeInfo);
+		});
+	};
+	const mergedBeforeUpload = async (file, fileListArgs) => {
+		const { beforeUpload } = props;
+		let parsedFile = file;
+		if (beforeUpload) {
+			const result = await beforeUpload(file, fileListArgs);
+			if (result === false) return false;
+			delete file[LIST_IGNORE];
+			if (result === LIST_IGNORE) {
+				Object.defineProperty(file, LIST_IGNORE, {
+					value: true,
+					configurable: true
+				});
+				return false;
+			}
+			if (typeof result === "object" && result) parsedFile = result;
+		}
+		return parsedFile;
+	};
+	const onBatchStart = (batchFileInfoList) => {
+		const filteredFileInfoList = batchFileInfoList.filter((info) => !info.file[LIST_IGNORE]);
+		if (!filteredFileInfoList.length) return;
+		const objectFileList = filteredFileInfoList.map((info) => file2Obj(info.file));
+		let newFileList = [...mergedFileList.value];
+		objectFileList.forEach((fileObj) => {
+			newFileList = updateFileList(fileObj, newFileList);
+		});
+		objectFileList.forEach((fileObj, index) => {
+			let triggerFileObj = fileObj;
+			if (!filteredFileInfoList?.[index]?.parsedFile) {
+				const { originFileObj } = fileObj;
+				let clone;
+				try {
+					clone = new File([originFileObj], originFileObj.name, { type: originFileObj.type });
+				} catch {
+					clone = new Blob([originFileObj], { type: originFileObj.type });
+					clone.name = originFileObj.name;
+					clone.lastModifiedDate = /* @__PURE__ */ new Date();
+					clone.lastModified = (/* @__PURE__ */ new Date()).getTime();
+				}
+				clone.uid = fileObj.uid;
+				triggerFileObj = clone;
+			} else fileObj.status = "uploading";
+			onInternalChange(triggerFileObj, newFileList);
+		});
+	};
+	const onSuccess = (response, file, xhr) => {
+		let parsedResponse = response;
+		try {
+			if (typeof response === "string") parsedResponse = JSON.parse(response);
+		} catch {
+			parsedResponse = response;
+		}
+		if (!getFileItem(file, mergedFileList.value)) return;
+		const targetItem = file2Obj(file);
+		targetItem.status = "done";
+		targetItem.percent = 100;
+		targetItem.response = parsedResponse;
+		targetItem.xhr = xhr;
+		onInternalChange(targetItem, updateFileList(targetItem, mergedFileList.value));
+	};
+	const onProgress = (e, file) => {
+		if (!getFileItem(file, mergedFileList.value)) return;
+		const targetItem = file2Obj(file);
+		targetItem.status = "uploading";
+		targetItem.percent = e.percent;
+		onInternalChange(targetItem, updateFileList(targetItem, mergedFileList.value), e);
+	};
+	const onError = (error, response, file) => {
+		if (!getFileItem(file, mergedFileList.value)) return;
+		const targetItem = file2Obj(file);
+		targetItem.error = error;
+		targetItem.response = response;
+		targetItem.status = "error";
+		onInternalChange(targetItem, updateFileList(targetItem, mergedFileList.value));
+	};
+	const handleRemove = (file) => {
+		let currentFile;
+		Promise.resolve(typeof props.onRemove === "function" ? props.onRemove(file) : props.onRemove).then((ret) => {
+			if (ret === false) return;
+			const removedFileList = removeFileItem(file, mergedFileList.value);
+			if (removedFileList) {
+				currentFile = {
+					...file,
+					status: "removed"
+				};
+				mergedFileList.value?.forEach((item) => {
+					const matchKey = currentFile.uid !== void 0 ? "uid" : "name";
+					if (item[matchKey] === currentFile[matchKey] && !Object.isFrozen(item)) item.status = "removed";
+				});
+				upload.value?.abort?.(currentFile);
+				onInternalChange(currentFile, removedFileList);
+			}
+		});
+	};
+	const onFileDrop = (e) => {
+		dragState.value = e.type;
+		if (e.type === "drop") emit("drop", e);
+	};
+	expose({
+		onBatchStart,
+		onSuccess,
+		onProgress,
+		onError,
+		fileList: computed(() => mergedFileList.value),
+		upload: computed(() => upload.value ?? null),
+		nativeElement: computed(() => wrapRef.value ?? null)
+	});
+	const listType = computed(() => props.listType ?? "text");
+	const showUploadList = computed(() => props.showUploadList ?? true);
+	const rootCls = useCSSVarCls_default(prefixCls);
+	const [hashId, cssVarCls] = style_default(prefixCls, rootCls);
+	const mergedProps = computed(() => {
+		return {
+			...props,
+			listType: listType.value,
+			showUploadList: showUploadList.value,
+			type: props.type ?? "select",
+			multiple: props.multiple ?? false,
+			hasControlInside: props.hasControlInside ?? true,
+			supportServerRender: props.supportServerRender ?? true,
+			disabled: mergedDisabled.value
+		};
+	});
+	const [mergedClassNames, mergedStyles] = useMergeSemantic(useToArr(contextClassNames, classes), useToArr(contextStyles, styles), useToProps(mergedProps));
+	const [contextLocale] = useLocale_default("Upload");
+	const mergedLocale = computed(() => ({
+		...contextLocale?.value,
+		...props.locale ?? {}
+	}));
+	const renderUploadList = (button, buttonVisible) => {
+		if (!showUploadList.value) return button ?? null;
+		const { showRemoveIcon, showPreviewIcon, showDownloadIcon, removeIcon, previewIcon, downloadIcon, extra } = typeof showUploadList.value === "boolean" ? {} : showUploadList.value;
+		const realShowRemoveIcon = typeof showRemoveIcon === "undefined" ? !mergedDisabled.value : showRemoveIcon;
+		const iconRender = slots.iconRender ? (file, currentListType) => slots.iconRender?.({
+			file,
+			listType: currentListType
+		}) : props.iconRender;
+		const itemRender = slots.itemRender ? (originNode, file, fileList, actions) => slots.itemRender?.({
+			originNode,
+			file,
+			fileList,
+			actions
+		}) : props.itemRender;
+		return createVNode(UploadList_default, {
+			"classes": mergedClassNames.value,
+			"styles": mergedStyles.value,
+			"prefixCls": prefixCls.value,
+			"listType": listType.value,
+			"items": mergedFileList.value,
+			"previewFile": props.previewFile,
+			"onPreview": (file) => {
+				if (props?.onPreview) props?.onPreview?.(file);
+			},
+			"onDownload": (file) => {
+				if (props.onDownload) props?.onDownload?.(file);
+				else if (file.url) window.open(file.url);
+			},
+			"onRemove": handleRemove,
+			"showRemoveIcon": realShowRemoveIcon,
+			"showPreviewIcon": showPreviewIcon,
+			"showDownloadIcon": showDownloadIcon,
+			"removeIcon": removeIcon,
+			"previewIcon": previewIcon,
+			"downloadIcon": downloadIcon,
+			"iconRender": iconRender,
+			"extra": extra,
+			"locale": mergedLocale.value,
+			"isImageUrl": props.isImageUrl,
+			"progress": props.progress,
+			"appendAction": button,
+			"appendActionVisible": buttonVisible,
+			"itemRender": itemRender,
+			"disabled": mergedDisabled.value
+		}, null);
+	};
+	return () => {
+		const { type, multiple, action, accept, supportServerRender, hasControlInside, openFileDialogOnClick, withCredentials, id, name } = props;
+		const children = filterEmpty(slots.default?.() ?? []);
+		const hasChildren = children.length > 0;
+		const { className, style, restAttrs } = getAttrStyleAndClass$1(attrs);
+		const mergedStyle = {
+			...contextStyle.value,
+			...style
+		};
+		const rcUploadProps = {
+			onBatchStart,
+			onError,
+			onProgress,
+			onSuccess,
+			...props,
+			customRequest: customRequest.value,
+			data: props.data ?? {},
+			multiple: multiple ?? false,
+			action: action ?? "",
+			accept: accept ?? "",
+			supportServerRender: supportServerRender ?? true,
+			prefixCls: prefixCls.value,
+			disabled: mergedDisabled.value,
+			beforeUpload: mergedBeforeUpload,
+			onChange: void 0,
+			hasControlInside: hasControlInside ?? true,
+			openFileDialogOnClick,
+			withCredentials,
+			id,
+			name
+		};
+		if (!hasChildren || mergedDisabled.value) delete rcUploadProps.id;
+		const mergedRootCls = clsx(`${prefixCls.value}-wrapper`, contextClassName.value, mergedClassNames.value.root, rootClass.value, cssVarCls.value, rootCls.value, hashId.value, {
+			[`${prefixCls.value}-rtl`]: direction.value === "rtl",
+			[`${prefixCls.value}-picture-card-wrapper`]: listType.value === "picture-card",
+			[`${prefixCls.value}-picture-circle-wrapper`]: listType.value === "picture-circle"
+		}, className);
+		const mergedRootStyle = { ...mergedStyles.value.root };
+		if (type === "drag") {
+			const dragCls = clsx(hashId.value, prefixCls.value, `${prefixCls.value}-drag`, {
+				[`${prefixCls.value}-drag-uploading`]: mergedFileList.value.some((file) => file.status === "uploading"),
+				[`${prefixCls.value}-drag-hover`]: dragState.value === "dragover",
+				[`${prefixCls.value}-disabled`]: mergedDisabled.value,
+				[`${prefixCls.value}-rtl`]: direction.value === "rtl"
+			});
+			return createVNode("span", mergeProps(restAttrs, {
+				"class": mergedRootCls,
+				"ref": wrapRef,
+				"style": mergedRootStyle
+			}), [createVNode("div", {
+				"class": dragCls,
+				"style": mergedStyle,
+				"onDrop": onFileDrop,
+				"onDragover": onFileDrop,
+				"onDragleave": onFileDrop
+			}, [createVNode(VcUpload, mergeProps(rcUploadProps, {
+				"ref": upload,
+				"className": `${prefixCls.value}-btn`
+			}), { default: () => [createVNode("div", { "class": `${prefixCls.value}-drag-container` }, [children])] })]), renderUploadList()]);
+		}
+		const uploadBtnCls = clsx(prefixCls.value, `${prefixCls.value}-select`, {
+			[`${prefixCls.value}-disabled`]: mergedDisabled.value,
+			[`${prefixCls.value}-hidden`]: !hasChildren
+		});
+		const uploadButton = createVNode("div", {
+			"class": uploadBtnCls,
+			"style": mergedStyle
+		}, [createVNode(VcUpload, mergeProps(rcUploadProps, { "ref": upload }), _isSlot(children) ? children : { default: () => [children] })]);
+		if (listType.value === "picture-card" || listType.value === "picture-circle") return createVNode("span", mergeProps(restAttrs, {
+			"class": mergedRootCls,
+			"ref": wrapRef,
+			"style": mergedRootStyle
+		}), [renderUploadList(uploadButton, hasChildren)]);
+		return createVNode("span", mergeProps(restAttrs, {
+			"class": mergedRootCls,
+			"ref": wrapRef,
+			"style": mergedRootStyle
+		}), [uploadButton, renderUploadList()]);
+	};
+}, {
+	emits: [
+		"change",
+		"drop",
+		"update:fileList"
+	],
+	props: /* @__PURE__ */ mergeDefaults({
+		type: {
+			type: String,
+			required: false
+		},
+		name: {
+			type: String,
+			required: false
+		},
+		defaultFileList: {
+			type: Array,
+			required: false
+		},
+		fileList: {
+			type: Array,
+			required: false
+		},
+		action: {
+			type: [String, Function],
+			required: false
+		},
+		directory: {
+			type: Boolean,
+			required: false
+		},
+		data: {
+			type: [Object, Function],
+			required: false
+		},
+		method: {
+			type: String,
+			required: false
+		},
+		headers: {
+			type: Object,
+			required: false
+		},
+		showUploadList: {
+			type: [Boolean, Object],
+			required: false
+		},
+		multiple: {
+			type: Boolean,
+			required: false
+		},
+		accept: {
+			type: [String, Object],
+			required: false
+		},
+		beforeUpload: {
+			type: Function,
+			required: false
+		},
+		listType: {
+			type: String,
+			required: false
+		},
+		classes: {
+			type: [Object, Function],
+			required: false
+		},
+		styles: {
+			type: [Object, Function],
+			required: false
+		},
+		rootClass: {
+			type: String,
+			required: false
+		},
+		supportServerRender: {
+			type: Boolean,
+			required: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false
+		},
+		prefixCls: {
+			type: String,
+			required: false
+		},
+		customRequest: {
+			type: Function,
+			required: false
+		},
+		withCredentials: {
+			type: Boolean,
+			required: false
+		},
+		openFileDialogOnClick: {
+			type: Boolean,
+			required: false
+		},
+		locale: {
+			type: Object,
+			required: false
+		},
+		id: {
+			type: String,
+			required: false
+		},
+		previewFile: {
+			type: Function,
+			required: false
+		},
+		iconRender: {
+			type: Function,
+			required: false
+		},
+		isImageUrl: {
+			type: Function,
+			required: false
+		},
+		progress: {
+			type: Object,
+			required: false
+		},
+		itemRender: {
+			type: Function,
+			required: false
+		},
+		maxCount: {
+			type: Number,
+			required: false
+		},
+		onRemove: {
+			type: Function,
+			required: false
+		},
+		onPreview: {
+			type: Function,
+			required: false
+		},
+		onDownload: {
+			type: Function,
+			required: false
+		},
+		capture: {
+			type: [String, Boolean],
+			required: false
+		},
+		hasControlInside: {
+			type: Boolean,
+			required: false
+		},
+		pastable: {
+			type: Boolean,
+			required: false
+		}
+	}, {
+		showUploadList: true,
+		listType: "text",
+		type: "select",
+		data: {},
+		multiple: false,
+		accept: "",
+		hasControlInside: true,
+		action: "",
+		supportServerRender: true
+	}),
+	name: "AUpload",
+	inheritAttrs: false
+});
+var Upload_default = InternalUpload;
+
+//#endregion
+export { LIST_IGNORE, Upload_default as default };