antdv-next 1.0.0-alpha.4 → 1.0.0-beta.1

package/dist/modal/interface.d.ts

@@ -6,6 +6,7 @@ import "../_util/hooks/index.js";
 import { ClosableType } from "../_util/hooks/useClosable.js";
 import { ButtonProps, LegacyButtonType } from "../button/Button.js";
 import "../button/index.js";
+import { FocusableConfig, OmitFocusType } from "../drawer/useFocusable.js";
 import { DirectionType } from "../config-provider/context.js";
 import { CSSProperties } from "vue";
 import { DialogProps } from "@v-c/dialog";
@@ -14,7 +15,7 @@ import { DialogProps } from "@v-c/dialog";
 type SemanticName = 'root' | 'header' | 'body' | 'footer' | 'container' | 'title' | 'wrapper' | 'mask';
 type ModalClassNamesType = SemanticClassNamesType<ModalProps, SemanticName>;
 type ModalStylesType = SemanticStylesType<ModalProps, SemanticName>;
-interface ModalCommonProps extends Omit<DialogProps, 'footer' | 'width' | 'onClose' | 'animation' | 'maskAnimation' | 'transitionName' | 'maskTransitionName' | 'mask' | 'classNames' | 'styles' | 'modalRender' | 'rootStyle' | 'style'> {
+interface ModalCommonProps extends Omit<DialogProps, 'footer' | 'width' | 'onClose' | 'animation' | 'maskAnimation' | 'transitionName' | 'maskTransitionName' | 'mask' | 'classNames' | 'styles' | 'modalRender' | 'rootStyle' | 'style' | OmitFocusType> {
   footer?: VueNode | ((params: {
     originNode: VueNode;
     extra: {
@@ -85,6 +86,7 @@ interface ModalProps extends ModalCommonProps {
    * @since 5.18.0
    */
   loading?: boolean;
+  focusable?: FocusableConfig;
 }
 interface ModalEmits {
   /** Specify a function that will be called when a user clicks the OK button */

package/dist/notification/PurePanel.d.ts

@@ -2,7 +2,7 @@ import { VueNode } from "../_util/type.js";
 import { SemanticClassNames, SemanticClassNamesType, SemanticStyles, SemanticStylesType } from "../_util/hooks/useMergeSemantic.js";
 import "../_util/hooks/index.js";
 import { IconType, NotificationSemantic } from "./interface.js";
-import * as vue335 from "vue";
+import * as vue340 from "vue";
 
 //#region src/notification/PurePanel.d.ts
 type PurePanelClassNamesType = SemanticClassNamesType<PurePanelProps, NotificationSemantic>;
@@ -36,6 +36,6 @@ interface PurePanelProps extends Omit<PureContentProps, 'prefixCls' | 'children'
   onClick?: (event: Event) => void;
 }
 /** @private Internal Component. Do not use in your production. */
-declare const PurePanel: vue335.DefineSetupFnComponent<PurePanelProps, {}, {}, PurePanelProps & {}, vue335.PublicProps>;
+declare const PurePanel: vue340.DefineSetupFnComponent<PurePanelProps, {}, {}, PurePanelProps & {}, vue340.PublicProps>;
 //#endregion
 export { PurePanel };

package/dist/notification/PurePanel.js

@@ -1,7 +1,7 @@
 import { useBaseConfig, useComponentBaseConfig } from "../config-provider/context.js";
 import { pureAttrs, useMergeSemantic, useToArr, useToProps } from "../_util/hooks/useMergeSemantic.js";
 import "../_util/hooks/index.js";
-import { toPropsRefs } from "../_util/tools.js";
+import { getSlotPropsFnRun, toPropsRefs } from "../_util/tools.js";
 import useCSSVarCls_default from "../config-provider/hooks/useCSSVarCls.js";
 import useClosable, { pickClosable } from "../_util/hooks/useClosable.js";
 import style_default from "./style/index.js";
@@ -152,7 +152,7 @@ const omitKeys = [
 	"closable"
 ];
 /** @private Internal Component. Do not use in your production. */
-const PurePanel = /* @__PURE__ */ defineComponent((props, { attrs }) => {
+const PurePanel = /* @__PURE__ */ defineComponent((props, { attrs, slots }) => {
 	const { classes: notificationClassNames, styles } = toPropsRefs(props, "classes", "styles");
 	const { getPrefixCls, class: contextClassName, style: contextStyle, classes: contextClassNames, styles: contextStyles } = useComponentBaseConfig("notification", props);
 	const { notification: notificationContext } = useBaseConfig("notification", props);
@@ -184,6 +184,7 @@ const PurePanel = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 		const notificationClassName = attrs.class;
 		const style = attrs.style;
 		const restProps = omit(props, omitKeys);
+		const actions = getSlotPropsFnRun(slots, props, "actions");
 		return createVNode("div", {
 			"class": clsx(`${noticePrefixCls}-pure-panel`, hashId.value, notificationClassName, cssVarCls.value, rootCls.value, mergedClassNames.value?.root),
 			"style": mergedStyles.value.root
@@ -204,7 +205,7 @@ const PurePanel = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 				"type": props.type,
 				"title": props.title,
 				"description": props.description,
-				"actions": props.actions
+				"actions": actions
 			}, null)
 		}), null)]);
 	};

package/dist/notification/style/index.d.ts

@@ -1,6 +1,6 @@
 import "../../theme/internal.js";
-import "vue";
 import { CSSObject } from "@antdv-next/cssinjs";
+import "vue";
 
 //#region src/notification/style/index.d.ts
 /** Component only token. Which will handle additional calculation of alias token */

package/dist/notification/useNotification.d.ts

@@ -1,8 +1,9 @@
 import { NotificationConfig, NotificationInstance } from "./interface.js";
+import { MaybeRef } from "@v-c/util/dist/type";
 import * as vue_jsx_runtime10 from "vue/jsx-runtime";
 
 //#region src/notification/useNotification.d.ts
 
-declare function useNotification(notificationConfig?: NotificationConfig): readonly [NotificationInstance, () => vue_jsx_runtime10.JSX.Element];
+declare function useNotification(notificationConfig?: MaybeRef<NotificationConfig>): readonly [NotificationInstance, () => vue_jsx_runtime10.JSX.Element];
 //#endregion
 export { useNotification };

package/dist/notification/useNotification.js

@@ -10,7 +10,7 @@ import { computeClosable, pickClosable } from "../_util/hooks/useClosable.js";
 import style_default from "./style/index.js";
 import { PureContent, getCloseIcon } from "./PurePanel.js";
 import { getCloseIconConfig, getMotion, getPlacementStyle } from "./util.js";
-import { computed, createVNode, defineComponent, isVNode, mergeDefaults, mergeProps, shallowRef } from "vue";
+import { computed, createVNode, defineComponent, isVNode, mergeDefaults, mergeProps, shallowRef, unref } from "vue";
 import { clsx } from "@v-c/util";
 import { useNotification, useNotificationProvider } from "@v-c/notification";
 
@@ -60,7 +60,7 @@ const Holder = /* @__PURE__ */ defineComponent((props, { expose }) => {
 	};
 	const getClassName = () => clsx({ [`${prefixCls.value}-rtl`]: props.rtl ?? direction.value === "rtl" });
 	const getNotificationMotion = () => getMotion(prefixCls.value);
-	const [api, holder] = useNotification({
+	const [api, holder] = useNotification(computed(() => ({
 		prefixCls: prefixCls.value,
 		style: getStyle,
 		className: getClassName,
@@ -78,7 +78,7 @@ const Holder = /* @__PURE__ */ defineComponent((props, { expose }) => {
 			offset: 8,
 			gap: token.value?.margin
 		}
-	});
+	})));
 	const mergedProps = computed(() => props);
 	const [mergedClassNames, mergedStyles] = useMergeSemantic(useToArr(contextClassNames, classes), useToArr(contextStyles, styles), useToProps(mergedProps));
 	expose({
@@ -195,9 +195,9 @@ function useInternalNotification(notificationConfig) {
 			const { title, description, icon, type, actions, class: className, style, role = "alert", closeIcon, closable, classes: configClassNames = {}, styles = {},...restConfig } = config;
 			const mergedTitle = title;
 			const mergedActions = actions;
-			const realCloseIcon = getCloseIcon(noticePrefixCls, getCloseIconConfig(closeIcon, notificationConfig, notification));
+			const realCloseIcon = getCloseIcon(noticePrefixCls, getCloseIconConfig(closeIcon, unref(notificationConfig), notification));
 			const [rawClosable, mergedCloseIcon, , ariaProps] = computeClosable(pickClosable(computed(() => ({
-				...notificationConfig || {},
+				...unref(notificationConfig) || {},
 				...config
 			}))), pickClosable(notificationContext), computed(() => ({
 				closable: true,
@@ -213,7 +213,7 @@ function useInternalNotification(notificationConfig) {
 			const mergedClassNames = mergeClassNames(void 0, originClassNames, semanticClassNames);
 			const mergedStyles = mergeStyles(originStyles, semanticStyles);
 			return originOpen({
-				placement: notificationConfig?.placement ?? DEFAULT_PLACEMENT,
+				placement: unref(notificationConfig)?.placement ?? DEFAULT_PLACEMENT,
 				...restConfig,
 				content: createVNode(PureContent, {
 					"prefixCls": noticePrefixCls,
@@ -257,7 +257,7 @@ function useInternalNotification(notificationConfig) {
 		return clone;
 	};
 	const holderContext = () => {
-		return createVNode(Holder, mergeProps({ "key": "notificaion-holder" }, notificationConfig, { "ref": holderRef }), null);
+		return createVNode(Holder, mergeProps({ "key": "notificaion-holder" }, unref(notificationConfig), { "ref": holderRef }), null);
 	};
 	return [wrapAPIFn(), holderContext];
 }

package/dist/package.d.ts

@@ -1,5 +1,145 @@
 //#region package.d.ts
-
-declare let version: string;
+declare const _exports: {
+  name: string;
+  type: string;
+  version: string;
+  description: string;
+  author: {
+    email: string;
+    name: string;
+  };
+  license: string;
+  exports: {
+    ".": {
+      types: string;
+      import: string;
+      default: string;
+    };
+    "./dist/*": {
+      types: string;
+      import: string;
+      default: string;
+    };
+    "./dist/locale/*": {
+      types: string;
+      import: string;
+      default: string;
+    };
+    "./locale/*": {
+      types: string;
+      import: string;
+      default: string;
+    };
+    "./date-picker/*": {
+      types: string;
+      import: string;
+      default: string;
+    };
+    "./date-picker/locale/*": {
+      types: string;
+      import: string;
+      default: string;
+    };
+    "./time-picker/*": {
+      types: string;
+      import: string;
+      default: string;
+    };
+    "./time-picker/locale/*": {
+      types: string;
+      import: string;
+      default: string;
+    };
+    "./date-picker/generate": {
+      types: string;
+      import: string;
+      default: string;
+    };
+    "./date-picker/generate/*": {
+      types: string;
+      import: string;
+      default: string;
+    };
+    "./global.d.ts": string;
+    "./global": string;
+    "./dist/reset.css": string;
+    "./web-types.json": string;
+    "./web-tags.json": string;
+    "./package.json": string;
+  };
+  unpkg: string;
+  jsdelivr: string;
+  files: string[];
+  contributes: {
+    html: {
+      customData: string[];
+    };
+  };
+  scripts: {
+    test: string;
+    build: string;
+    "build:esm": string;
+    "build:umd": string;
+    "build:web-types": string;
+    prepublish: string;
+    bump: string;
+  };
+  dependencies: {
+    "@ant-design/colors": string;
+    "@ant-design/fast-color": string;
+    "@antdv-next/cssinjs": string;
+    "@antdv-next/icons": string;
+    "@v-c/async-validator": string;
+    "@v-c/cascader": string;
+    "@v-c/checkbox": string;
+    "@v-c/collapse": string;
+    "@v-c/color-picker": string;
+    "@v-c/dialog": string;
+    "@v-c/drawer": string;
+    "@v-c/dropdown": string;
+    "@v-c/image": string;
+    "@v-c/input": string;
+    "@v-c/input-number": string;
+    "@v-c/mentions": string;
+    "@v-c/menu": string;
+    "@v-c/mutate-observer": string;
+    "@v-c/notification": string;
+    "@v-c/pagination": string;
+    "@v-c/picker": string;
+    "@v-c/progress": string;
+    "@v-c/qrcode": string;
+    "@v-c/rate": string;
+    "@v-c/resize-observer": string;
+    "@v-c/segmented": string;
+    "@v-c/select": string;
+    "@v-c/slick": string;
+    "@v-c/slider": string;
+    "@v-c/steps": string;
+    "@v-c/switch": string;
+    "@v-c/table": string;
+    "@v-c/tabs": string;
+    "@v-c/textarea": string;
+    "@v-c/tooltip": string;
+    "@v-c/tour": string;
+    "@v-c/tree": string;
+    "@v-c/tree-select": string;
+    "@v-c/trigger": string;
+    "@v-c/upload": string;
+    "@v-c/util": string;
+    "@v-c/virtual-list": string;
+    "@vueuse/core": string;
+    dayjs: string;
+    defu: string;
+    "es-toolkit": string;
+    "scroll-into-view-if-needed": string;
+    "throttle-debounce": string;
+  };
+  "web-types": string;
+  browserslist: string[];
+  devDependencies: {
+    "@types/throttle-debounce": string;
+  };
+};
+declare let _version2: typeof _exports["version"];
 //#endregion
-export { version };
+export { _version2 };

package/dist/package.js

@@ -1,5 +1,5 @@
 //#region package.json
-var version = "1.0.0-alpha.4";
+var version = "1.0.0-beta.1";
 
 //#endregion
 export { version };

package/dist/pagination/Pagination.d.ts

@@ -1,10 +1,10 @@
 import { PaginationEmits, PaginationProps, PaginationSlots } from "./interface.js";
-import * as vue222 from "vue";
+import * as vue365 from "vue";
 import { SlotsType } from "vue";
 
 //#region src/pagination/Pagination.d.ts
-declare const Pagination: vue222.DefineSetupFnComponent<PaginationProps, PaginationEmits, SlotsType<PaginationSlots>, PaginationProps & {
+declare const Pagination: vue365.DefineSetupFnComponent<PaginationProps, PaginationEmits, SlotsType<PaginationSlots>, PaginationProps & {
   [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
-}, vue222.PublicProps>;
+}, vue365.PublicProps>;
 //#endregion
 export { Pagination };

package/dist/pagination/Pagination.js

@@ -8,8 +8,8 @@ import { getSlotPropsFnRun, toPropsRefs } from "../_util/tools.js";
 import useCSSVarCls_default from "../config-provider/hooks/useCSSVarCls.js";
 import { useSize } from "../config-provider/hooks/useSize.js";
 import useLocale_default from "../locale/useLocale.js";
-import useBreakpoint_default from "../grid/hooks/useBreakpoint.js";
 import select_default from "../select/index.js";
+import useBreakpoint_default from "../grid/hooks/useBreakpoint.js";
 import style_default from "./style/index.js";
 import bordered_default from "./style/bordered.js";
 import resolveShowSizeChanger from "./useShowSizeChanger.js";

package/dist/pagination/style/index.js

@@ -1,5 +1,5 @@
 import { genFocusOutline, genFocusStyle, resetComponent } from "../../style/index.js";
-import { genStyleHooks } from "../../theme/util/genStyleUtils.js";
+import { genCssVar, genStyleHooks } from "../../theme/util/genStyleUtils.js";
 import { mergeToken } from "../../theme/internal.js";
 import { initComponentToken, initInputToken } from "../../input/style/token.js";
 import { genBaseOutlinedStyle, genDisabledStyle } from "../../input/style/variants.js";
@@ -63,23 +63,24 @@ const genPaginationDisabledStyle = (token) => {
 	};
 };
 const genPaginationMiniStyle = (token) => {
-	const { componentCls } = token;
+	const { componentCls, antCls } = token;
+	const [, varRef] = genCssVar(antCls, "pagination");
 	return {
 		[`&${componentCls}-mini ${componentCls}-total-text, &${componentCls}-mini ${componentCls}-simple-pager`]: {
-			height: token.itemSizeSM,
-			lineHeight: unit(token.itemSizeSM)
+			height: varRef("item-size-actual"),
+			lineHeight: varRef("item-size-actual")
 		},
 		[`&${componentCls}-mini ${componentCls}-item`]: {
-			minWidth: token.itemSizeSM,
-			height: token.itemSizeSM,
+			minWidth: varRef("item-size-actual"),
+			height: varRef("item-size-actual"),
 			margin: 0,
-			lineHeight: unit(token.calc(token.itemSizeSM).sub(2).equal())
+			lineHeight: unit(token.calc(varRef("item-size-actual")).sub(2).equal())
 		},
 		[`&${componentCls}-mini ${componentCls}-prev, &${componentCls}-mini ${componentCls}-next`]: {
-			minWidth: token.itemSizeSM,
-			height: token.itemSizeSM,
+			minWidth: varRef("item-size-actual"),
+			height: varRef("item-size-actual"),
 			margin: 0,
-			lineHeight: unit(token.itemSizeSM)
+			lineHeight: varRef("item-size-actual")
 		},
 		[`&${componentCls}-mini:not(${componentCls}-disabled)`]: { [`${componentCls}-prev, ${componentCls}-next`]: {
 			[`&:hover ${componentCls}-item-link`]: { backgroundColor: token.colorBgTextHover },
@@ -93,21 +94,21 @@ const genPaginationMiniStyle = (token) => {
 			"backgroundColor": "transparent",
 			"borderColor": "transparent",
 			"&::after": {
-				height: token.itemSizeSM,
-				lineHeight: unit(token.itemSizeSM)
+				height: varRef("item-size-actual"),
+				lineHeight: varRef("item-size-actual")
 			}
 		},
 		[`&${componentCls}-mini ${componentCls}-jump-prev, &${componentCls}-mini ${componentCls}-jump-next`]: {
-			height: token.itemSizeSM,
+			height: varRef("item-size-actual"),
 			marginInlineEnd: 0,
-			lineHeight: unit(token.itemSizeSM)
+			lineHeight: varRef("item-size-actual")
 		},
 		[`&${componentCls}-mini ${componentCls}-options`]: {
 			"marginInlineStart": token.paginationMiniOptionsMarginInlineStart,
 			"&-size-changer": { top: token.miniOptionsSizeChangerTop },
 			"&-quick-jumper": {
-				height: token.itemSizeSM,
-				lineHeight: unit(token.itemSizeSM),
+				height: varRef("item-size-actual"),
+				lineHeight: varRef("item-size-actual"),
 				input: {
 					...genInputSmallStyle(token),
 					width: token.paginationMiniQuickJumperInputWidth,
@@ -118,29 +119,30 @@ const genPaginationMiniStyle = (token) => {
 	};
 };
 const genPaginationSimpleStyle = (token) => {
-	const { componentCls } = token;
+	const { componentCls, antCls } = token;
+	const [, varRef] = genCssVar(antCls, "pagination");
 	return { [`&${componentCls}-simple`]: {
 		[`${componentCls}-prev, ${componentCls}-next`]: {
-			height: token.itemSize,
-			lineHeight: unit(token.itemSize),
+			height: varRef("item-size-actual"),
+			lineHeight: varRef("item-size-actual"),
 			verticalAlign: "top",
 			[`${componentCls}-item-link`]: {
-				"height": token.itemSize,
+				"height": varRef("item-size-actual"),
 				"backgroundColor": "transparent",
 				"border": 0,
 				"&:hover": { backgroundColor: token.colorBgTextHover },
 				"&:active": { backgroundColor: token.colorBgTextActive },
 				"&::after": {
-					height: token.itemSize,
-					lineHeight: unit(token.itemSize)
+					height: varRef("item-size-actual"),
+					lineHeight: varRef("item-size-actual")
 				}
 			}
 		},
 		[`${componentCls}-simple-pager`]: {
 			display: "inline-flex",
 			alignItems: "center",
-			height: token.itemSize,
-			marginInlineEnd: token.marginXS,
+			height: varRef("item-size-actual"),
+			marginInlineEnd: varRef("item-spacing-actual"),
 			input: {
 				"boxSizing": "border-box",
 				"height": "100%",
@@ -169,25 +171,26 @@ const genPaginationSimpleStyle = (token) => {
 		[`&${componentCls}-disabled`]: { [`${componentCls}-prev, ${componentCls}-next`]: { [`${componentCls}-item-link`]: { "&:hover, &:active": { backgroundColor: "transparent" } } } },
 		[`&${componentCls}-mini`]: {
 			[`${componentCls}-prev, ${componentCls}-next`]: {
-				height: token.itemSizeSM,
-				lineHeight: unit(token.itemSizeSM),
+				height: varRef("item-size-actual"),
+				lineHeight: varRef("item-size-actual"),
 				[`${componentCls}-item-link`]: {
-					"height": token.itemSizeSM,
+					"height": varRef("item-size-actual"),
 					"&::after": {
-						height: token.itemSizeSM,
-						lineHeight: unit(token.itemSizeSM)
+						height: varRef("item-size-actual"),
+						lineHeight: varRef("item-size-actual")
 					}
 				}
 			},
 			[`${componentCls}-simple-pager`]: {
-				height: token.itemSizeSM,
+				height: varRef("item-size-actual"),
 				input: { width: token.paginationMiniQuickJumperInputWidth }
 			}
 		}
 	} };
 };
 const genPaginationJumpStyle = (token) => {
-	const { componentCls } = token;
+	const { componentCls, antCls } = token;
+	const [, varRef] = genCssVar(antCls, "pagination");
 	return {
 		[`${componentCls}-jump-prev, ${componentCls}-jump-next`]: {
 			"outline": 0,
@@ -231,7 +234,7 @@ const genPaginationJumpStyle = (token) => {
     ${componentCls}-prev,
     ${componentCls}-jump-prev,
     ${componentCls}-jump-next
-    `]: { marginInlineEnd: token.marginXS },
+    `]: { marginInlineEnd: varRef("item-spacing-actual") },
 		[`
     ${componentCls}-prev,
     ${componentCls}-next,
@@ -239,11 +242,11 @@ const genPaginationJumpStyle = (token) => {
     ${componentCls}-jump-next
     `]: {
 			display: "inline-block",
-			minWidth: token.itemSize,
-			height: token.itemSize,
+			minWidth: varRef("item-size-actual"),
+			height: varRef("item-size-actual"),
 			color: token.colorText,
 			fontFamily: token.fontFamily,
-			lineHeight: unit(token.itemSize),
+			lineHeight: varRef("item-size-actual"),
 			textAlign: "center",
 			verticalAlign: "middle",
 			listStyle: "none",
@@ -286,9 +289,9 @@ const genPaginationJumpStyle = (token) => {
 			"&-size-changer": { width: "auto" },
 			"&-quick-jumper": {
 				display: "inline-block",
-				height: token.controlHeight,
-				marginInlineStart: token.marginXS,
-				lineHeight: unit(token.controlHeight),
+				height: varRef("item-size-actual"),
+				marginInlineStart: varRef("item-spacing-actual"),
+				lineHeight: varRef("item-size-actual"),
 				verticalAlign: "top",
 				input: {
 					...genBasicInputStyle(token),
@@ -300,25 +303,26 @@ const genPaginationJumpStyle = (token) => {
 					}),
 					"&[disabled]": { ...genDisabledStyle(token) },
 					"width": token.quickJumperInputWidth,
-					"height": token.controlHeight,
+					"height": varRef("item-size-actual"),
 					"boxSizing": "border-box",
 					"margin": 0,
-					"marginInlineStart": token.marginXS,
-					"marginInlineEnd": token.marginXS
+					"marginInlineStart": varRef("item-spacing-actual"),
+					"marginInlineEnd": varRef("item-spacing-actual")
 				}
 			}
 		}
 	};
 };
 const genPaginationItemStyle = (token) => {
-	const { componentCls } = token;
+	const { componentCls, antCls } = token;
+	const [, varRef] = genCssVar(antCls, "pagination");
 	return { [`${componentCls}-item`]: {
 		"display": "inline-block",
-		"minWidth": token.itemSize,
-		"height": token.itemSize,
-		"marginInlineEnd": token.marginXS,
+		"minWidth": varRef("item-size-actual"),
+		"height": varRef("item-size-actual"),
+		"marginInlineEnd": varRef("item-spacing-actual"),
 		"fontFamily": token.fontFamily,
-		"lineHeight": unit(token.calc(token.itemSize).sub(2).equal()),
+		"lineHeight": unit(token.calc(varRef("item-size-actual")).sub(2).equal()),
 		"textAlign": "center",
 		"verticalAlign": "middle",
 		"listStyle": "none",
@@ -352,9 +356,16 @@ const genPaginationItemStyle = (token) => {
 	} };
 };
 const genPaginationStyle = (token) => {
-	const { componentCls } = token;
+	const { componentCls, antCls } = token;
+	const [varName, varRef] = genCssVar(antCls, "pagination");
 	return {
 		[componentCls]: {
+			[varName("item-size-actual")]: unit(token.itemSize),
+			[varName("item-spacing-actual")]: unit(token.marginXS),
+			"&-mini": {
+				[varName("item-size-actual")]: unit(token.itemSizeSM),
+				[varName("item-spacing-actual")]: unit(token.marginXXS)
+			},
 			...resetComponent(token),
 			"display": "flex",
 			"&-start": { justifyContent: "start" },
@@ -375,9 +386,9 @@ const genPaginationStyle = (token) => {
 			},
 			[`${componentCls}-total-text`]: {
 				display: "inline-block",
-				height: token.itemSize,
-				marginInlineEnd: token.marginXS,
-				lineHeight: unit(token.calc(token.itemSize).sub(2).equal()),
+				height: varRef("item-size-actual"),
+				marginInlineEnd: varRef("item-spacing-actual"),
+				lineHeight: unit(token.calc(varRef("item-size-actual")).sub(2).equal()),
 				verticalAlign: "middle"
 			},
 			...genPaginationItemStyle(token),

package/dist/popconfirm/PurePanel.d.ts

@@ -2,7 +2,7 @@ import { SemanticClassNames, SemanticStyles } from "../_util/hooks/useMergeSeman
 import "../_util/hooks/index.js";
 import { PopoverSemanticName } from "../popover/index.js";
 import { PopconfirmProps } from "./index.js";
-import * as vue51 from "vue";
+import * as vue57 from "vue";
 import { CSSProperties } from "vue";
 
 //#region src/popconfirm/PurePanel.d.ts
@@ -23,6 +23,6 @@ interface PurePanelProps extends Omit<OverlayProps, 'prefixCls'>, Pick<Popconfir
   class?: string;
   style?: CSSProperties;
 }
-declare const PurePanel: vue51.DefineSetupFnComponent<PurePanelProps, {}, {}, PurePanelProps & {}, vue51.PublicProps>;
+declare const PurePanel: vue57.DefineSetupFnComponent<PurePanelProps, {}, {}, PurePanelProps & {}, vue57.PublicProps>;
 //#endregion
 export { PopconfirmLocale, PurePanel };

package/dist/popconfirm/PurePanel.js

@@ -7,6 +7,7 @@ import PurePanel_default from "../popover/PurePanel.js";
 import style_default from "./style/index.js";
 import { computed, createVNode, defineComponent, isVNode, mergeProps } from "vue";
 import { clsx } from "@v-c/util";
+import { ExclamationCircleFilled } from "@antdv-next/icons";
 
 //#region src/popconfirm/PurePanel.tsx
 function _isSlot(s) {
@@ -17,7 +18,7 @@ const Overlay = /* @__PURE__ */ defineComponent((props) => {
 	const btnPrefixCls = computed(() => config.value?.getPrefixCls?.("btn") ?? "ant-btn");
 	const [contextLocale] = useLocale_default("Popconfirm", en_US_default.Popconfirm);
 	return () => {
-		const { prefixCls, icon, title, description, cancelText, okText, okType = "primary", okButtonProps, cancelButtonProps, showCancel = true, close, onConfirm, onCancel, onPopupClick, classes, styles } = props;
+		const { prefixCls, icon = createVNode(ExclamationCircleFilled, null, null), title, description, cancelText, okText, okType = "primary", okButtonProps, cancelButtonProps, showCancel = true, close, onConfirm, onCancel, onPopupClick, classes, styles } = props;
 		const cancelButtonAttrs = {
 			size: "small",
 			...cancelButtonProps ?? {}

package/dist/popconfirm/index.d.ts

@@ -6,7 +6,7 @@ import { ButtonProps, LegacyButtonType } from "../button/Button.js";
 import "../button/index.js";
 import { PopoverProps, PopoverSemanticName } from "../popover/index.js";
 import { PurePanel } from "./PurePanel.js";
-import * as vue78 from "vue";
+import * as vue130 from "vue";
 import { App, SlotsType } from "vue";
 
 //#region src/popconfirm/index.d.ts
@@ -40,9 +40,9 @@ interface PopconfirmSlots {
   okText?: () => any;
   cancelText?: () => any;
 }
-declare const InternalPopconfirm: vue78.DefineSetupFnComponent<PopconfirmProps, PopconfirmEmits, SlotsType<PopconfirmSlots>, PopconfirmProps & {
+declare const InternalPopconfirm: vue130.DefineSetupFnComponent<PopconfirmProps, PopconfirmEmits, SlotsType<PopconfirmSlots>, PopconfirmProps & {
   [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
-}, vue78.PublicProps>;
+}, vue130.PublicProps>;
 type PopconfirmType = typeof InternalPopconfirm & {
   install: (app: App) => void;
   _InternalPanelDoNotUseOrYouWillBeFired: typeof PurePanel;

package/dist/popover/PurePanel.js

@@ -258,11 +258,13 @@ const RawPurePanel = /* @__PURE__ */ defineComponent((props, { slots, attrs }) =
 	name: "PopoverRawPurePanel",
 	inheritAttrs: false
 });
-const PurePanel = /* @__PURE__ */ defineComponent((props, { attrs }) => {
+const PurePanel = /* @__PURE__ */ defineComponent((props, { attrs, slots }) => {
 	const { prefixCls } = useComponentBaseConfig("popover", props);
 	const [hashId, cssVarCls] = style_default(prefixCls);
 	return () => {
+		const content = getSlotPropsFnRun(slots, props, "content");
 		return createVNode(RawPurePanel, mergeProps(omit(attrs, ["class"]), props, {
+			"content": content,
 			"prefixCls": prefixCls.value,
 			"hashId": hashId.value,
 			"class": clsx(attrs.class, cssVarCls.value)
@@ -430,4 +432,4 @@ const PurePanel = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 var PurePanel_default = PurePanel;
 
 //#endregion
-export { Overlay, PurePanel_default as default };
+export { Overlay, RawPurePanel, PurePanel_default as default };