antdv-next 0.0.0 → 1.0.0-alpha.1

package/dist/modal/Modal.d.ts

@@ -0,0 +1,10 @@
+import { ModalEmits, ModalProps, ModalSlots } from "./interface.js";
+import * as vue277 from "vue";
+import { SlotsType } from "vue";
+
+//#region src/modal/Modal.d.ts
+declare const Modal: vue277.DefineSetupFnComponent<ModalProps, ModalEmits, SlotsType<ModalSlots>, ModalProps & {
+  [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
+}, vue277.PublicProps>;
+//#endregion
+export { Modal };

package/dist/modal/Modal.js

@@ -0,0 +1,478 @@
+import { useBaseConfig, useComponentBaseConfig } from "../config-provider/context.js";
+import { useMergedMask } from "../_util/hooks/useMergedMask.js";
+import { getAttrStyleAndClass, useMergeSemantic, useToArr, useToProps } from "../_util/hooks/useMergeSemantic.js";
+import { devUseWarning, isDev } from "../_util/warning.js";
+import { ZIndexProvider } from "../_util/zindexContext.js";
+import { useZIndex } from "../_util/hooks/useZIndex.js";
+import "../_util/hooks/index.js";
+import { getSlotPropsFnRun, toPropsRefs } from "../_util/tools.js";
+import useCSSVarCls_default from "../config-provider/hooks/useCSSVarCls.js";
+import { ContextIsolator } from "../_util/ContextIsolator.js";
+import useClosable, { pickClosable } from "../_util/hooks/useClosable.js";
+import { canUseDocElement } from "../_util/styleChecker.js";
+import skeleton_default from "../skeleton/index.js";
+import { usePanelRef } from "../watermark/context.js";
+import { Footer, renderCloseIcon } from "./shared.js";
+import style_default from "./style/index.js";
+import { computed, createVNode, defineComponent, mergeDefaults, mergeProps } from "vue";
+import { clsx } from "@v-c/util";
+import { CloseOutlined } from "@antdv-next/icons";
+import { omit } from "es-toolkit";
+import { getTransitionName } from "@v-c/util/dist/utils/transition";
+import Dialog from "@v-c/dialog";
+
+//#region src/modal/Modal.tsx
+let mousePosition;
+function getClickPosition(e) {
+	mousePosition = {
+		x: e.pageX,
+		y: e.pageY
+	};
+	setTimeout(() => {
+		mousePosition = null;
+	}, 100);
+}
+if (canUseDocElement()) document.documentElement.addEventListener("click", getClickPosition, true);
+const Modal = /* @__PURE__ */ defineComponent((props, { slots, attrs, emit }) => {
+	const { getPopupContainer: getContextPopupContainer, getPrefixCls, prefixCls, direction, class: contextClassName, style: contextStyle, classes: contextClassNames, styles: contextStyles, centered: contextCentered, cancelButtonProps: contextCancelButtonProps, okButtonProps: contextOkButtonProps, mask: contextMask } = useComponentBaseConfig("modal", props, [
+		"centered",
+		"cancelButtonProps",
+		"okButtonProps",
+		"mask"
+	]);
+	const { mask: modalMask, classes, styles, zIndex: customZIndex, width: widthRef, rootClass: rootClassRef, rootStyle: rootStyleRef, panelRef: panelRefRef } = toPropsRefs(props, "mask", "classes", "styles", "zIndex", "width", "rootClass", "rootStyle", "panelRef");
+	const { modal: modalContext } = useBaseConfig();
+	const modalRenderRef = computed(() => slots.modalRender || props.modalRender);
+	const rootPrefixCls = computed(() => getPrefixCls());
+	const closableContext = computed(() => {
+		const { closable } = props;
+		if (typeof closable === "boolean") return [void 0, void 0];
+		return [closable?.afterClose, closable?.onClose];
+	});
+	const [mergedMask, maskBlurClassName] = useMergedMask(modalMask, contextMask, prefixCls);
+	const onClose = () => {
+		closableContext.value?.[1]?.();
+	};
+	const handleCancel = (e) => {
+		if (props.confirmLoading) return;
+		emit("cancel", e);
+		emit("update:open", false);
+		onClose();
+	};
+	const handleOk = (e) => {
+		emit("ok", e);
+		onClose();
+	};
+	if (isDev) {
+		const warning = devUseWarning("Modal");
+		[
+			["bodyStyle", "styles.body"],
+			["maskStyle", "styles.mask"],
+			["destroyOnClose", "destroyOnHidden"]
+		].forEach(([deprecatedName, newName]) => {
+			warning.deprecated(!(props[deprecatedName] !== void 0), deprecatedName, newName);
+		});
+	}
+	const rootCls = useCSSVarCls_default(prefixCls);
+	const [hashId, cssVarCls] = style_default(prefixCls, rootCls);
+	const closableIconContext = useClosable(pickClosable(computed(() => ({
+		...props,
+		closeIcon: getSlotPropsFnRun(slots, props, "closeIcon", false)
+	}))), pickClosable(modalContext), computed(() => {
+		return {
+			closable: true,
+			closeIcon: createVNode(CloseOutlined, { "class": `${prefixCls.value}-close-icon` }, null),
+			closeIconRender: (icon) => renderCloseIcon(prefixCls.value, icon)
+		};
+	}));
+	const [zIndex, contextZIndex] = useZIndex("Modal", customZIndex);
+	const mergedProps = computed(() => ({
+		...props,
+		mask: mergedMask.value,
+		zIndex: zIndex.value
+	}));
+	const [mergedClassNames, mergedStyles] = useMergeSemantic(useToArr(contextClassNames, classes, maskBlurClassName), useToArr(contextStyles, styles), useToProps(mergedProps));
+	const numWidth = computed(() => {
+		if (widthRef.value && typeof widthRef.value === "object") return;
+		return widthRef.value;
+	});
+	const responsiveWidth = computed(() => {
+		if (widthRef.value && typeof widthRef.value === "object") return widthRef.value;
+	});
+	const responsiveWidthVars = computed(() => {
+		const vars = {};
+		if (responsiveWidth.value) Object.keys(responsiveWidth.value).forEach((breakpoint) => {
+			const breakpointWidth = responsiveWidth.value?.[breakpoint];
+			if (breakpointWidth !== void 0) vars[`--${prefixCls.value}-${breakpoint}-width`] = typeof breakpointWidth === "number" ? `${breakpointWidth}px` : breakpointWidth;
+		});
+		return vars;
+	});
+	const innerPanelRef = usePanelRef(computed(() => `.${prefixCls.value}-${modalRenderRef.value ? "render" : "container"}`));
+	const mergedPanelRef = (instance) => {
+		innerPanelRef(instance);
+		const panelRef = panelRefRef?.value;
+		if (typeof panelRef === "function") panelRef(instance);
+		else if (panelRef && typeof panelRef === "object") panelRef.value = instance;
+	};
+	return () => {
+		const { wrapClassName, centered, loading, confirmLoading, destroyOnHidden, destroyOnClose, getContainer: customizeGetContainer } = props;
+		const { className, style: attrStyle, restAttrs } = getAttrStyleAndClass(attrs);
+		const wrapClassNameExtended = clsx(wrapClassName, {
+			[`${prefixCls.value}-centered`]: centered ?? contextCentered.value,
+			[`${prefixCls.value}-wrap-rtl`]: direction.value === "rtl"
+		});
+		const [rawClosable, mergedCloseIcon, closeBtnIsDisabled, ariaProps] = closableIconContext.value;
+		const [closableAfterclose] = closableContext.value;
+		const mergedClosable = rawClosable ? {
+			disabled: closeBtnIsDisabled,
+			closeIcon: mergedCloseIcon,
+			afterClose: () => {
+				closableAfterclose?.();
+			},
+			...ariaProps
+		} : false;
+		const mergedModalRender = modalRenderRef.value ? (node) => createVNode("div", { "class": `${prefixCls.value}-render` }, [getSlotPropsFnRun(slots, { modalRender: modalRenderRef.value }, "modalRender", true, node)]) : void 0;
+		const mergedOkButtonProps = {
+			...contextOkButtonProps.value,
+			...props.okButtonProps
+		};
+		const mergedCancelButtonProps = {
+			...contextCancelButtonProps.value,
+			...props.cancelButtonProps
+		};
+		const footer = slots?.footer ?? props?.footer;
+		const okText = slots?.okText ?? props?.okText;
+		const cancelText = slots?.cancelText ?? props?.cancelText;
+		const dialogFooter = props.footer !== null && !loading ? createVNode(Footer, {
+			"confirmLoading": confirmLoading,
+			"okType": props.okType,
+			"okText": okText,
+			"cancelText": cancelText,
+			"okButtonProps": mergedOkButtonProps,
+			"cancelButtonProps": mergedCancelButtonProps,
+			"footer": footer,
+			"onOk": handleOk,
+			"onCancel": handleCancel
+		}, null) : null;
+		const restProps = omit(props, [
+			"open",
+			"prefixCls",
+			"rootClass",
+			"rootStyle",
+			"wrapClassName",
+			"centered",
+			"width",
+			"footer",
+			"class",
+			"style",
+			"classes",
+			"styles",
+			"loading",
+			"confirmLoading",
+			"okButtonProps",
+			"cancelButtonProps",
+			"mask",
+			"zIndex",
+			"modalRender",
+			"closeIcon",
+			"destroyOnHidden",
+			"destroyOnClose",
+			"mousePosition",
+			"focusTriggerAfterClose",
+			"panelRef"
+		]);
+		const titleNode = getSlotPropsFnRun(slots, props, "title");
+		const mergedClassName = clsx(hashId.value, contextClassName.value, className);
+		const mergedRootClassName = clsx(hashId.value, rootClassRef.value, cssVarCls.value, rootCls.value, mergedClassNames.value.root);
+		const getContainer = customizeGetContainer === void 0 ? getContextPopupContainer : customizeGetContainer;
+		return createVNode(ContextIsolator, {
+			"form": true,
+			"space": true
+		}, { default: () => [createVNode(ZIndexProvider, { "value": contextZIndex.value }, { default: () => [createVNode(Dialog, mergeProps(omit(restAttrs, ["content"]), restProps, {
+			"width": numWidth.value,
+			"zIndex": zIndex.value,
+			"getContainer": getContainer,
+			"prefixCls": prefixCls.value,
+			"rootClassName": mergedRootClassName,
+			"rootStyle": {
+				...rootStyleRef.value,
+				...mergedStyles.value.root
+			},
+			"footer": dialogFooter,
+			"title": titleNode,
+			"visible": props.open,
+			"mousePosition": props.mousePosition ?? mousePosition,
+			"onClose": handleCancel,
+			"closable": mergedClosable,
+			"closeIcon": mergedCloseIcon,
+			"focusTriggerAfterClose": props.focusTriggerAfterClose ?? true,
+			"transitionName": getTransitionName(rootPrefixCls.value, "zoom", props.transitionName),
+			"maskTransitionName": getTransitionName(rootPrefixCls.value, "fade", props.maskTransitionName),
+			"mask": mergedMask.value,
+			"className": mergedClassName,
+			"style": {
+				...contextStyle.value,
+				...responsiveWidthVars.value,
+				...attrStyle
+			},
+			"classNames": {
+				...mergedClassNames.value,
+				wrapper: clsx(mergedClassNames.value.wrapper, wrapClassNameExtended)
+			},
+			"styles": mergedStyles.value,
+			"panelRef": mergedPanelRef,
+			"destroyOnHidden": destroyOnHidden ?? destroyOnClose,
+			"modalRender": mergedModalRender
+		}), { default: () => [loading ? createVNode(skeleton_default, {
+			"active": true,
+			"title": false,
+			"paragraph": { rows: 4 },
+			"class": `${prefixCls.value}-body-skeleton`
+		}, null) : slots.default?.()] })] })] });
+	};
+}, {
+	emits: [
+		"ok",
+		"cancel",
+		"update:open"
+	],
+	props: /* @__PURE__ */ mergeDefaults({
+		open: {
+			type: Boolean,
+			required: false
+		},
+		confirmLoading: {
+			type: Boolean,
+			required: false
+		},
+		title: {
+			type: [
+				Function,
+				Boolean,
+				String,
+				Number,
+				null,
+				Object
+			],
+			required: false
+		},
+		afterClose: {
+			type: Function,
+			required: false
+		},
+		afterOpenChange: {
+			type: Function,
+			required: false
+		},
+		centered: {
+			type: Boolean,
+			required: false
+		},
+		width: {
+			type: [
+				String,
+				Number,
+				Object
+			],
+			required: false
+		},
+		okText: {
+			type: [
+				Function,
+				Boolean,
+				String,
+				Number,
+				null,
+				Object
+			],
+			required: false
+		},
+		okType: {
+			type: String,
+			required: false
+		},
+		cancelText: {
+			type: [
+				Function,
+				Boolean,
+				String,
+				Number,
+				null,
+				Object
+			],
+			required: false
+		},
+		maskClosable: {
+			type: Boolean,
+			required: false
+		},
+		forceRender: {
+			type: Boolean,
+			required: false
+		},
+		okButtonProps: {
+			type: Object,
+			required: false
+		},
+		cancelButtonProps: {
+			type: Object,
+			required: false
+		},
+		destroyOnClose: {
+			type: Boolean,
+			required: false
+		},
+		destroyOnHidden: {
+			type: Boolean,
+			required: false
+		},
+		wrapClassName: {
+			type: String,
+			required: false
+		},
+		maskTransitionName: {
+			type: String,
+			required: false
+		},
+		transitionName: {
+			type: String,
+			required: false
+		},
+		rootClass: {
+			type: String,
+			required: false
+		},
+		rootStyle: {
+			type: Object,
+			required: false
+		},
+		getContainer: {
+			type: [
+				String,
+				Function,
+				Boolean
+			],
+			required: false,
+			skipCheck: true
+		},
+		zIndex: {
+			type: Number,
+			required: false
+		},
+		bodyStyle: {
+			type: Object,
+			required: false
+		},
+		maskStyle: {
+			type: Object,
+			required: false
+		},
+		mask: {
+			type: [Object, Boolean],
+			required: false
+		},
+		keyboard: {
+			type: Boolean,
+			required: false
+		},
+		wrapProps: { required: false },
+		prefixCls: {
+			type: String,
+			required: false
+		},
+		closeIcon: {
+			type: [
+				Function,
+				Boolean,
+				String,
+				Number,
+				null,
+				Object
+			],
+			required: false
+		},
+		modalRender: {
+			type: Function,
+			required: false
+		},
+		focusTriggerAfterClose: {
+			type: Boolean,
+			required: false
+		},
+		mousePosition: {
+			type: [Object, null],
+			required: false
+		},
+		loading: {
+			type: Boolean,
+			required: false
+		},
+		footer: {
+			type: [
+				Function,
+				Boolean,
+				String,
+				Number,
+				null,
+				Object
+			],
+			required: false
+		},
+		closable: {
+			type: [Boolean, Object],
+			required: false
+		},
+		classes: {
+			type: [Object, Function],
+			required: false
+		},
+		styles: {
+			type: [Object, Function],
+			required: false
+		},
+		className: {
+			type: String,
+			required: false
+		},
+		children: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false
+		},
+		visible: {
+			type: Boolean,
+			required: false
+		},
+		wrapStyle: {
+			type: Object,
+			required: false
+		},
+		height: {
+			type: [String, Number],
+			required: false
+		},
+		bodyProps: { required: false },
+		maskProps: { required: false },
+		rootClassName: {
+			type: String,
+			required: false
+		},
+		panelRef: { required: false }
+	}, {
+		focusTriggerAfterClose: true,
+		width: 520
+	}),
+	name: "AModal",
+	inheritAttrs: false
+});
+var Modal_default = Modal;
+
+//#endregion
+export { Modal_default as default };

package/dist/modal/components/ConfirmCancelBtn.js

@@ -0,0 +1,35 @@
+import { getSlotPropsFnRun } from "../../_util/tools.js";
+import ActionButton_default from "../../_util/ActionButton.js";
+import { useModalContext } from "../context.js";
+import { createVNode, defineComponent, isVNode } from "vue";
+
+//#region src/modal/components/ConfirmCancelBtn.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const ConfirmCancelBtn = /* @__PURE__ */ defineComponent(() => {
+	const context = useModalContext();
+	return () => {
+		const { autoFocusButton, cancelButtonProps, isSilent, mergedOkCancel, rootPrefixCls, close, onCancel, onConfirm, onClose } = context.value;
+		const cancelTextLocale = getSlotPropsFnRun({}, context.value, "cancelTextLocale");
+		return mergedOkCancel ? createVNode(ActionButton_default, {
+			"isSilent": isSilent,
+			"actionFn": onCancel,
+			"close": (...args) => {
+				close?.(...args);
+				onConfirm?.(false);
+				onClose?.();
+			},
+			"autoFocus": autoFocusButton === "cancel",
+			"buttonProps": cancelButtonProps,
+			"prefixCls": `${rootPrefixCls}-btn`
+		}, _isSlot(cancelTextLocale) ? cancelTextLocale : { default: () => [cancelTextLocale] }) : null;
+	};
+}, {
+	name: "ConfirmCancelBtn",
+	inheritAttrs: false
+});
+var ConfirmCancelBtn_default = ConfirmCancelBtn;
+
+//#endregion
+export { ConfirmCancelBtn_default as default };

package/dist/modal/components/ConfirmOkBtn.js

@@ -0,0 +1,36 @@
+import { getSlotPropsFnRun } from "../../_util/tools.js";
+import ActionButton_default from "../../_util/ActionButton.js";
+import { useModalContext } from "../context.js";
+import { createVNode, defineComponent, isVNode } from "vue";
+
+//#region src/modal/components/ConfirmOkBtn.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const ConfirmOkBtn = /* @__PURE__ */ defineComponent(() => {
+	const context = useModalContext();
+	return () => {
+		const { autoFocusButton, close, isSilent, okButtonProps, rootPrefixCls, okType, onConfirm, onOk, onClose } = context.value;
+		const okTextLocale = getSlotPropsFnRun({}, context.value, "okTextLocale");
+		return createVNode(ActionButton_default, {
+			"isSilent": isSilent,
+			"type": okType || "primary",
+			"actionFn": onOk,
+			"close": (...args) => {
+				close?.(...args);
+				onConfirm?.(true);
+				onClose?.();
+			},
+			"autoFocus": autoFocusButton === "ok",
+			"buttonProps": okButtonProps,
+			"prefixCls": `${rootPrefixCls}-btn`
+		}, _isSlot(okTextLocale) ? okTextLocale : { default: () => [okTextLocale] });
+	};
+}, {
+	name: "ConfirmOkBtn",
+	inheritAttrs: false
+});
+var ConfirmOkBtn_default = ConfirmOkBtn;
+
+//#endregion
+export { ConfirmOkBtn_default as default };

package/dist/modal/components/NormalCancelBtn.js

@@ -0,0 +1,22 @@
+import button_default from "../../button/index.js";
+import { useModalContext } from "../context.js";
+import { createVNode, defineComponent, isVNode, mergeProps } from "vue";
+
+//#region src/modal/components/NormalCancelBtn.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const NormalCancelBtn = /* @__PURE__ */ defineComponent(() => {
+	const context = useModalContext();
+	return () => {
+		const { onCancel, cancelTextLocale, cancelButtonProps } = context.value;
+		return createVNode(button_default, mergeProps({ "onClick": onCancel }, cancelButtonProps), _isSlot(cancelTextLocale) ? cancelTextLocale : { default: () => [cancelTextLocale] });
+	};
+}, {
+	name: "NormalCancelBtn",
+	inheritAttrs: false
+});
+var NormalCancelBtn_default = NormalCancelBtn;
+
+//#endregion
+export { NormalCancelBtn_default as default };

package/dist/modal/components/NormalOkBtn.js

@@ -0,0 +1,28 @@
+import { getSlotPropsFnRun } from "../../_util/tools.js";
+import { convertLegacyProps } from "../../button/Button.js";
+import button_default from "../../button/index.js";
+import { useModalContext } from "../context.js";
+import { createVNode, defineComponent, isVNode, mergeProps } from "vue";
+
+//#region src/modal/components/NormalOkBtn.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const NormalOkBtn = /* @__PURE__ */ defineComponent(() => {
+	const context = useModalContext();
+	return () => {
+		const { okType, confirmLoading, okButtonProps, onOk } = context.value;
+		const okTextLocale = getSlotPropsFnRun({}, { okTextLocale: context.value.okTextLocale }, "okTextLocale");
+		return createVNode(button_default, mergeProps(convertLegacyProps(okType), {
+			"loading": confirmLoading,
+			"onClick": onOk
+		}, okButtonProps), _isSlot(okTextLocale) ? okTextLocale : { default: () => [okTextLocale] });
+	};
+}, {
+	name: "NormalOkBtn",
+	inheritAttrs: false
+});
+var NormalOkBtn_default = NormalOkBtn;
+
+//#endregion
+export { NormalOkBtn_default as default };

package/dist/modal/confirm.d.ts

@@ -0,0 +1,20 @@
+import { ModalFuncProps } from "./interface.js";
+
+//#region src/modal/confirm.d.ts
+type ConfigUpdate = ModalFuncProps | ((prevConfig: ModalFuncProps) => ModalFuncProps);
+type ModalFunc = (props: ModalFuncProps) => {
+  destroy: () => void;
+  update: (configUpdate: ConfigUpdate) => void;
+};
+type ModalStaticFunctions = Record<NonNullable<ModalFuncProps['type']>, ModalFunc>;
+declare function confirm(config: ModalFuncProps): {
+  destroy: (...args: any[]) => void;
+  update: (configUpdate: ConfigUpdate) => void;
+};
+declare function modalGlobalConfig({
+  rootPrefixCls
+}: {
+  rootPrefixCls: string;
+}): void;
+//#endregion
+export { ModalFunc, ModalStaticFunctions, confirm, modalGlobalConfig };