@v-c/trigger 1.0.2 → 1.0.5

package/dist/Popup/Arrow.cjs

@@ -1,6 +1,7 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
 let vue = require("vue");
-let __v_c_util = require("@v-c/util");
+let _v_c_util = require("@v-c/util");
 const Arrow = /* @__PURE__ */ (0, vue.defineComponent)({
 	props: {
 		prefixCls: {
@@ -50,7 +51,7 @@ const Arrow = /* @__PURE__ */ (0, vue.defineComponent)({
 			}
 			return (0, vue.createVNode)("div", {
 				"ref": arrowRef,
-				"class": (0, __v_c_util.classNames)(`${prefixCls}-arrow`, className),
+				"class": (0, _v_c_util.classNames)(`${prefixCls}-arrow`, className),
 				"style": {
 					...alignStyle,
 					...style

package/dist/Popup/Mask.cjs

@@ -1,12 +1,15 @@
-Object.defineProperty(exports, "__esModule", { value: true });
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
 const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
 let vue = require("vue");
-let __v_c_util_dist_utils_transition = require("@v-c/util/dist/utils/transition");
+let _v_c_util_dist_utils_transition = require("@v-c/util/dist/utils/transition");
 var Mask = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs }) => {
 	return () => {
 		const { prefixCls, open, zIndex, mask, motion, mobile } = props;
 		if (!mask) return null;
-		return (0, vue.createVNode)(vue.Transition, (0, __v_c_util_dist_utils_transition.getTransitionProps)(motion?.name, motion), { default: () => [open ? (0, vue.createVNode)("div", {
+		return (0, vue.createVNode)(vue.Transition, (0, _v_c_util_dist_utils_transition.getTransitionProps)(motion?.name, motion), { default: () => [open ? (0, vue.createVNode)("div", {
 			"style": { zIndex },
 			"class": [
 				`${prefixCls}-mask`,

package/dist/Popup/PopupContent.cjs

@@ -1,4 +1,7 @@
-Object.defineProperty(exports, "__esModule", { value: true });
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
 const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
 let vue = require("vue");
 var PopupContent = /* @__PURE__ */ (0, vue.defineComponent)((props, { slots }) => {

package/dist/Popup/index.cjs

@@ -1,18 +1,18 @@
-Object.defineProperty(exports, "__esModule", { value: true });
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
 const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
 const require_useOffsetStyle = require("../hooks/useOffsetStyle.cjs");
 const require_Arrow = require("./Arrow.cjs");
 const require_Mask = require("./Mask.cjs");
-const require_PopupContent = require("./PopupContent.cjs");
 let vue = require("vue");
-let __v_c_resize_observer = require("@v-c/resize-observer");
-__v_c_resize_observer = require_rolldown_runtime.__toESM(__v_c_resize_observer);
-let __v_c_util = require("@v-c/util");
-let __v_c_util_dist_props_util = require("@v-c/util/dist/props-util");
-let __v_c_util_dist_utils_transition = require("@v-c/util/dist/utils/transition");
+let _v_c_resize_observer = require("@v-c/resize-observer");
+let _v_c_util = require("@v-c/util");
+let _v_c_util_dist_props_util = require("@v-c/util/dist/props-util");
+let _v_c_util_dist_utils_transition = require("@v-c/util/dist/utils/transition");
 var Popup = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, slots, expose }) => {
-	const popupContent = (0, vue.computed)(() => typeof props.popup === "function" ? props.popup() : props.popup);
-	const { offsetX, offsetR, offsetY, offsetB, open, ready, align } = (0, __v_c_util_dist_props_util.toPropsRefs)(props, "offsetX", "offsetB", "offsetY", "offsetR", "ready", "open", "align");
+	const { offsetX, offsetR, offsetY, offsetB, open, ready, align } = (0, _v_c_util_dist_props_util.toPropsRefs)(props, "offsetX", "offsetB", "offsetY", "offsetR", "ready", "open", "align");
 	const isNodeVisible = (0, vue.computed)(() => props.open || props.keepDom);
 	const isMobile = (0, vue.computed)(() => !!props.mobile);
 	const getPopupContainerNeedParams = props?.getPopupContainer?.length > 0;
@@ -46,9 +46,10 @@ var Popup = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, slots, exp
 		getElement: () => popupElementRef.value,
 		nativeElement: popupElementRef
 	});
+	(0, _v_c_resize_observer.useResizeObserver)(open, popupElementRef, onInternalResize);
 	return () => {
 		if (!show.value) return null;
-		const { stretch, targetHeight, targetWidth, portal: Portal, forceRender, getPopupContainer, target, autoDestroy, zIndex, prefixCls, arrow, arrowPos, align: align$1, onMouseEnter, onMouseLeave, onPointerEnter, onPointerDownCapture, onClick, fresh, onPrepare, onVisibleChanged } = props;
+		const { onEsc, stretch, targetHeight, targetWidth, portal: Portal, forceRender, getPopupContainer, target, autoDestroy, zIndex, prefixCls, arrow, arrowPos, align: align$1, onMouseEnter, onMouseLeave, onPointerEnter, onPointerDownCapture, onClick, onPrepare, onVisibleChanged } = props;
 		const miscStyle = {};
 		if (stretch) {
 			if (stretch.includes("height") && targetHeight) miscStyle.height = `${targetHeight}px`;
@@ -59,7 +60,7 @@ var Popup = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, slots, exp
 		if (!open.value) miscStyle.pointerEvents = "none";
 		const [mergedMask, mergedMaskMotion, mergedPopupMotion] = mergedProps.value;
 		const popupMotionName = mergedPopupMotion?.name ?? mergedPopupMotion?.motionName;
-		const baseTransitionProps = popupMotionName ? (0, __v_c_util_dist_utils_transition.getTransitionProps)(popupMotionName, mergedPopupMotion) : {
+		const baseTransitionProps = popupMotionName ? (0, _v_c_util_dist_utils_transition.getTransitionProps)(popupMotionName, mergedPopupMotion) : {
 			appear: true,
 			...mergedPopupMotion || {}
 		};
@@ -73,9 +74,7 @@ var Popup = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, slots, exp
 			onAfterEnter: (element) => {
 				baseTransitionProps?.onAfterEnter?.(element);
 				requestAnimationFrame(() => {
-					requestAnimationFrame(() => {
-						onVisibleChanged?.(true);
-					});
+					onVisibleChanged?.(true);
 				});
 			},
 			onAfterLeave: (element) => {
@@ -83,11 +82,12 @@ var Popup = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, slots, exp
 				onVisibleChanged?.(false);
 			}
 		};
-		const cls = (0, __v_c_util.classNames)(prefixCls, attrs.class, props.className, { [`${prefixCls}-mobile`]: isMobile.value });
+		const cls = (0, _v_c_util.classNames)(prefixCls, attrs.class, props.className, { [`${prefixCls}-mobile`]: isMobile.value });
 		return (0, vue.createVNode)(Portal, {
 			"open": forceRender || isNodeVisible.value,
 			"getContainer": getPopupContainer && (() => getPopupContainer(target)),
-			"autoDestroy": autoDestroy
+			"autoDestroy": autoDestroy,
+			"onEsc": onEsc
 		}, { default: () => [
 			(0, vue.createVNode)(require_Mask.default, {
 				"prefixCls": prefixCls,
@@ -97,10 +97,7 @@ var Popup = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, slots, exp
 				"motion": mergedMaskMotion,
 				"mobile": isMobile.value
 			}, null),
-			(0, vue.createVNode)(__v_c_resize_observer.default, {
-				"onResize": onInternalResize,
-				"disabled": !open.value
-			}, { default: () => [(0, vue.createVNode)(vue.Transition, mergedTransitionProps, { default: () => [(0, vue.withDirectives)((0, vue.createVNode)("div", (0, vue.mergeProps)({
+			(0, vue.createVNode)(vue.Transition, mergedTransitionProps, { default: () => [(0, vue.withDirectives)((0, vue.createVNode)("div", (0, vue.mergeProps)({
 				"ref": popupElementRef,
 				"class": cls,
 				"style": [
@@ -125,11 +122,15 @@ var Popup = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, slots, exp
 				"arrow": arrow === true ? {} : arrow,
 				"arrowPos": arrowPos,
 				"align": align$1
-			}, null), (0, vue.createVNode)(require_PopupContent.default, { "cache": !open.value && !fresh }, { default: () => [popupContent.value] })]), [[vue.vShow, open.value]])] })] }),
+			}, null), typeof props?.popup === "function" ? props.popup() : props.popup]), [[vue.vShow, open.value]])] }),
 			slots?.default?.()
 		] });
 	};
 }, { props: /* @__PURE__ */ (0, vue.mergeDefaults)({
+	onEsc: {
+		required: false,
+		default: void 0
+	},
 	prefixCls: {
 		type: String,
 		required: true,

package/dist/Popup/index.d.ts

@@ -1,3 +1,4 @@
+import { PortalProps } from '@v-c/portal';
 import { ResizeObserverProps } from '@v-c/resize-observer';
 import { CSSMotionProps } from '@v-c/util/dist/utils/transition';
 import { CSSProperties } from 'vue';
@@ -11,6 +12,7 @@ export interface MobileConfig {
     maskMotion?: CSSMotionProps;
 }
 export interface PopupProps {
+    onEsc?: PortalProps['onEsc'];
     prefixCls: string;
     className?: string;
     style?: CSSProperties;

package/dist/Popup/index.js

@@ -1,14 +1,12 @@
 import useOffsetStyle from "../hooks/useOffsetStyle.js";
 import { Arrow } from "./Arrow.js";
 import Mask_default from "./Mask.js";
-import PopupContent_default from "./PopupContent.js";
 import { Transition, computed, createVNode, defineComponent, mergeDefaults, mergeProps, nextTick, shallowRef, vShow, watchEffect, withDirectives } from "vue";
-import ResizeObserver from "@v-c/resize-observer";
+import { useResizeObserver } from "@v-c/resize-observer";
 import { classNames } from "@v-c/util";
 import { toPropsRefs } from "@v-c/util/dist/props-util";
 import { getTransitionProps } from "@v-c/util/dist/utils/transition";
 var Popup_default = /* @__PURE__ */ defineComponent((props, { attrs, slots, expose }) => {
-	const popupContent = computed(() => typeof props.popup === "function" ? props.popup() : props.popup);
 	const { offsetX, offsetR, offsetY, offsetB, open, ready, align } = toPropsRefs(props, "offsetX", "offsetB", "offsetY", "offsetR", "ready", "open", "align");
 	const isNodeVisible = computed(() => props.open || props.keepDom);
 	const isMobile = computed(() => !!props.mobile);
@@ -43,9 +41,10 @@ var Popup_default = /* @__PURE__ */ defineComponent((props, { attrs, slots, expo
 		getElement: () => popupElementRef.value,
 		nativeElement: popupElementRef
 	});
+	useResizeObserver(open, popupElementRef, onInternalResize);
 	return () => {
 		if (!show.value) return null;
-		const { stretch, targetHeight, targetWidth, portal: Portal, forceRender, getPopupContainer, target, autoDestroy, zIndex, prefixCls, arrow, arrowPos, align: align$1, onMouseEnter, onMouseLeave, onPointerEnter, onPointerDownCapture, onClick, fresh, onPrepare, onVisibleChanged } = props;
+		const { onEsc, stretch, targetHeight, targetWidth, portal: Portal, forceRender, getPopupContainer, target, autoDestroy, zIndex, prefixCls, arrow, arrowPos, align: align$1, onMouseEnter, onMouseLeave, onPointerEnter, onPointerDownCapture, onClick, onPrepare, onVisibleChanged } = props;
 		const miscStyle = {};
 		if (stretch) {
 			if (stretch.includes("height") && targetHeight) miscStyle.height = `${targetHeight}px`;
@@ -70,9 +69,7 @@ var Popup_default = /* @__PURE__ */ defineComponent((props, { attrs, slots, expo
 			onAfterEnter: (element) => {
 				baseTransitionProps?.onAfterEnter?.(element);
 				requestAnimationFrame(() => {
-					requestAnimationFrame(() => {
-						onVisibleChanged?.(true);
-					});
+					onVisibleChanged?.(true);
 				});
 			},
 			onAfterLeave: (element) => {
@@ -84,7 +81,8 @@ var Popup_default = /* @__PURE__ */ defineComponent((props, { attrs, slots, expo
 		return createVNode(Portal, {
 			"open": forceRender || isNodeVisible.value,
 			"getContainer": getPopupContainer && (() => getPopupContainer(target)),
-			"autoDestroy": autoDestroy
+			"autoDestroy": autoDestroy,
+			"onEsc": onEsc
 		}, { default: () => [
 			createVNode(Mask_default, {
 				"prefixCls": prefixCls,
@@ -94,10 +92,7 @@ var Popup_default = /* @__PURE__ */ defineComponent((props, { attrs, slots, expo
 				"motion": mergedMaskMotion,
 				"mobile": isMobile.value
 			}, null),
-			createVNode(ResizeObserver, {
-				"onResize": onInternalResize,
-				"disabled": !open.value
-			}, { default: () => [createVNode(Transition, mergedTransitionProps, { default: () => [withDirectives(createVNode("div", mergeProps({
+			createVNode(Transition, mergedTransitionProps, { default: () => [withDirectives(createVNode("div", mergeProps({
 				"ref": popupElementRef,
 				"class": cls,
 				"style": [
@@ -122,11 +117,15 @@ var Popup_default = /* @__PURE__ */ defineComponent((props, { attrs, slots, expo
 				"arrow": arrow === true ? {} : arrow,
 				"arrowPos": arrowPos,
 				"align": align$1
-			}, null), createVNode(PopupContent_default, { "cache": !open.value && !fresh }, { default: () => [popupContent.value] })]), [[vShow, open.value]])] })] }),
+			}, null), typeof props?.popup === "function" ? props.popup() : props.popup]), [[vShow, open.value]])] }),
 			slots?.default?.()
 		] });
 	};
 }, { props: /* @__PURE__ */ mergeDefaults({
+	onEsc: {
+		required: false,
+		default: void 0
+	},
 	prefixCls: {
 		type: String,
 		required: true,

package/dist/UniqueProvider/UniqueContainer.cjs

@@ -1,19 +1,23 @@
-Object.defineProperty(exports, "__esModule", { value: true });
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
 const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
 const require_useOffsetStyle = require("../hooks/useOffsetStyle.cjs");
 let vue = require("vue");
-let __v_c_util_dist_props_util = require("@v-c/util/dist/props-util");
-let __v_c_util_dist_utils_transition = require("@v-c/util/dist/utils/transition");
+let _v_c_util_dist_props_util = require("@v-c/util/dist/props-util");
+let _v_c_util_dist_utils_transition = require("@v-c/util/dist/utils/transition");
 var UniqueContainer = /* @__PURE__ */ (0, vue.defineComponent)((props) => {
 	const motionVisible = (0, vue.shallowRef)(false);
-	const { open, isMobile, align, ready, offsetR, offsetB, offsetX, offsetY } = (0, __v_c_util_dist_props_util.toPropsRefs)(props, "open", "isMobile", "align", "ready", "offsetR", "offsetB", "offsetX", "offsetY");
+	const { open, isMobile, align, ready, offsetR, offsetB, offsetX, offsetY } = (0, _v_c_util_dist_props_util.toPropsRefs)(props, "open", "isMobile", "align", "ready", "offsetR", "offsetB", "offsetX", "offsetY");
 	const offsetStyle = require_useOffsetStyle.default(isMobile, ready, open, align, offsetR, offsetB, offsetX, offsetY);
 	const cachedOffsetStyleRef = (0, vue.shallowRef)(offsetStyle.value);
 	(0, vue.watchEffect)(() => {
 		if (ready.value) cachedOffsetStyleRef.value = offsetStyle.value;
 	});
-	(0, vue.watch)(open, (nextVisible) => {
-		if (nextVisible) motionVisible.value = true;
+	const mergedOffsetStyle = (0, vue.computed)(() => {
+		if (cachedOffsetStyleRef.value && Object.keys(cachedOffsetStyleRef.value).length > 0) return cachedOffsetStyleRef.value;
+		return offsetStyle.value;
 	});
 	return () => {
 		const { popupSize, motion, prefixCls, uniqueContainerClassName, arrowPos, uniqueContainerStyle } = props;
@@ -22,36 +26,33 @@ var UniqueContainer = /* @__PURE__ */ (0, vue.defineComponent)((props) => {
 			sizeStyle.width = `${popupSize.width}px`;
 			sizeStyle.height = `${popupSize.height}px`;
 		}
-		const baseTransitionProps = (0, __v_c_util_dist_utils_transition.getTransitionProps)(motion?.name, motion);
-		const mergedTransitionProps = {
+		const baseTransitionProps = (0, _v_c_util_dist_utils_transition.getTransitionProps)(motion?.name, motion);
+		const containerCls = `${prefixCls}-unique-container`;
+		return (0, vue.createVNode)(vue.Transition, {
 			...baseTransitionProps,
-			onBeforeEnter: (element) => {
-				motionVisible.value = true;
-				baseTransitionProps.onBeforeEnter?.(element);
-			},
 			onAfterEnter: (element) => {
 				motionVisible.value = true;
 				baseTransitionProps.onAfterEnter?.(element);
 			},
 			onAfterLeave: (element) => {
 				motionVisible.value = false;
-				cachedOffsetStyleRef.value = {};
 				baseTransitionProps.onAfterLeave?.(element);
 			}
-		};
-		const containerCls = `${prefixCls}-unique-container`;
-		return (0, vue.createVNode)(vue.Transition, mergedTransitionProps, { default: () => [(0, vue.withDirectives)((0, vue.createVNode)("div", {
+		}, { default: () => [(0, vue.withDirectives)((0, vue.createVNode)("div", {
 			"class": [
 				containerCls,
 				uniqueContainerClassName,
-				{ [`${containerCls}-visible`]: motionVisible.value }
+				{
+					[`${containerCls}-visible`]: motionVisible.value,
+					[`${containerCls}-hidden`]: !open.value
+				}
 			],
 			"style": [
 				{
 					"--arrow-x": `${arrowPos?.x || 0}px`,
 					"--arrow-y": `${arrowPos?.y || 0}px`
 				},
-				cachedOffsetStyleRef.value,
+				mergedOffsetStyle.value,
 				sizeStyle,
 				uniqueContainerStyle
 			]

package/dist/UniqueProvider/UniqueContainer.js

@@ -1,5 +1,5 @@
 import useOffsetStyle from "../hooks/useOffsetStyle.js";
-import { Transition, createVNode, defineComponent, shallowRef, vShow, watch, watchEffect, withDirectives } from "vue";
+import { Transition, computed, createVNode, defineComponent, shallowRef, vShow, watchEffect, withDirectives } from "vue";
 import { toPropsRefs } from "@v-c/util/dist/props-util";
 import { getTransitionProps } from "@v-c/util/dist/utils/transition";
 var UniqueContainer_default = /* @__PURE__ */ defineComponent((props) => {
@@ -10,8 +10,9 @@ var UniqueContainer_default = /* @__PURE__ */ defineComponent((props) => {
 	watchEffect(() => {
 		if (ready.value) cachedOffsetStyleRef.value = offsetStyle.value;
 	});
-	watch(open, (nextVisible) => {
-		if (nextVisible) motionVisible.value = true;
+	const mergedOffsetStyle = computed(() => {
+		if (cachedOffsetStyleRef.value && Object.keys(cachedOffsetStyleRef.value).length > 0) return cachedOffsetStyleRef.value;
+		return offsetStyle.value;
 	});
 	return () => {
 		const { popupSize, motion, prefixCls, uniqueContainerClassName, arrowPos, uniqueContainerStyle } = props;
@@ -21,35 +22,32 @@ var UniqueContainer_default = /* @__PURE__ */ defineComponent((props) => {
 			sizeStyle.height = `${popupSize.height}px`;
 		}
 		const baseTransitionProps = getTransitionProps(motion?.name, motion);
-		const mergedTransitionProps = {
+		const containerCls = `${prefixCls}-unique-container`;
+		return createVNode(Transition, {
 			...baseTransitionProps,
-			onBeforeEnter: (element) => {
-				motionVisible.value = true;
-				baseTransitionProps.onBeforeEnter?.(element);
-			},
 			onAfterEnter: (element) => {
 				motionVisible.value = true;
 				baseTransitionProps.onAfterEnter?.(element);
 			},
 			onAfterLeave: (element) => {
 				motionVisible.value = false;
-				cachedOffsetStyleRef.value = {};
 				baseTransitionProps.onAfterLeave?.(element);
 			}
-		};
-		const containerCls = `${prefixCls}-unique-container`;
-		return createVNode(Transition, mergedTransitionProps, { default: () => [withDirectives(createVNode("div", {
+		}, { default: () => [withDirectives(createVNode("div", {
 			"class": [
 				containerCls,
 				uniqueContainerClassName,
-				{ [`${containerCls}-visible`]: motionVisible.value }
+				{
+					[`${containerCls}-visible`]: motionVisible.value,
+					[`${containerCls}-hidden`]: !open.value
+				}
 			],
 			"style": [
 				{
 					"--arrow-x": `${arrowPos?.x || 0}px`,
 					"--arrow-y": `${arrowPos?.y || 0}px`
 				},
-				cachedOffsetStyleRef.value,
+				mergedOffsetStyle.value,
 				sizeStyle,
 				uniqueContainerStyle
 			]

package/dist/UniqueProvider/index.cjs

@@ -1,4 +1,7 @@
-Object.defineProperty(exports, "__esModule", { value: true });
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
 const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
 const require_context = require("../context.cjs");
 const require_util = require("../util.cjs");
@@ -8,10 +11,10 @@ const require_index = require("../Popup/index.cjs");
 const require_UniqueContainer = require("./UniqueContainer.cjs");
 const require_useTargetState = require("./useTargetState.cjs");
 let vue = require("vue");
-let __v_c_portal = require("@v-c/portal");
-__v_c_portal = require_rolldown_runtime.__toESM(__v_c_portal);
-let __v_c_util = require("@v-c/util");
-let __v_c_util_dist_Dom_findDOMNode = require("@v-c/util/dist/Dom/findDOMNode");
+let _v_c_portal = require("@v-c/portal");
+_v_c_portal = require_rolldown_runtime.__toESM(_v_c_portal);
+let _v_c_util = require("@v-c/util");
+let _v_c_util_dist_Dom_findDOMNode = require("@v-c/util/dist/Dom/findDOMNode");
 var UniqueProvider = /* @__PURE__ */ (0, vue.defineComponent)((props, { slots }) => {
 	const [trigger, open, options, onTargetVisibleChanged] = require_useTargetState.default();
 	const mergedOptions = (0, vue.computed)(() => {
@@ -23,15 +26,15 @@ var UniqueProvider = /* @__PURE__ */ (0, vue.defineComponent)((props, { slots })
 	const externalPopupRef = (0, vue.shallowRef)(null);
 	const resolveToElement = (node) => {
 		if (!node) return null;
-		if ((0, __v_c_util_dist_Dom_findDOMNode.isDOM)(node)) return node;
+		if ((0, _v_c_util_dist_Dom_findDOMNode.isDOM)(node)) return node;
 		const exposed = node;
-		if ((0, __v_c_util_dist_Dom_findDOMNode.isDOM)(exposed?.$el)) return exposed.$el;
+		if ((0, _v_c_util_dist_Dom_findDOMNode.isDOM)(exposed?.$el)) return exposed.$el;
 		const nativeEl = exposed?.nativeElement;
-		if ((0, __v_c_util_dist_Dom_findDOMNode.isDOM)(nativeEl?.value)) return nativeEl.value;
-		if ((0, __v_c_util_dist_Dom_findDOMNode.isDOM)(nativeEl)) return nativeEl;
+		if ((0, _v_c_util_dist_Dom_findDOMNode.isDOM)(nativeEl?.value)) return nativeEl.value;
+		if ((0, _v_c_util_dist_Dom_findDOMNode.isDOM)(nativeEl)) return nativeEl;
 		if (typeof exposed?.getElement === "function") {
 			const el = exposed.getElement();
-			if ((0, __v_c_util_dist_Dom_findDOMNode.isDOM)(el)) return el;
+			if ((0, _v_c_util_dist_Dom_findDOMNode.isDOM)(el)) return el;
 		}
 		return null;
 	};
@@ -70,7 +73,7 @@ var UniqueProvider = /* @__PURE__ */ (0, vue.defineComponent)((props, { slots })
 	};
 	const alignedClassName = (0, vue.computed)(() => {
 		if (!mergedOptions.value) return "";
-		return (0, __v_c_util.classNames)(require_util.getAlignPopupClassName(mergedOptions.value?.builtinPlacements || {}, mergedOptions.value.prefixCls || "", alignInfo.value, false), mergedOptions.value?.getPopupClassNameFromAlign?.(alignInfo.value));
+		return (0, _v_c_util.classNames)(require_util.getAlignPopupClassName(mergedOptions.value?.builtinPlacements || {}, mergedOptions.value.prefixCls || "", alignInfo.value, false), mergedOptions.value?.getPopupClassNameFromAlign?.(alignInfo.value));
 	});
 	const contextValue = {
 		show,
@@ -96,10 +99,11 @@ var UniqueProvider = /* @__PURE__ */ (0, vue.defineComponent)((props, { slots })
 		const prefixCls = mergedOptions?.value?.prefixCls;
 		return (0, vue.createVNode)(require_context.UniqueContextProvider, contextValue, { default: () => [slots?.default?.(), !!mergedOptions.value && (0, vue.createVNode)(require_context.TriggerContextProvider, triggerContextValue.value, { default: () => [(0, vue.createVNode)(require_index.default, {
 			"ref": setPopupRef,
-			"portal": __v_c_portal.default,
+			"portal": _v_c_portal.default,
 			"prefixCls": prefixCls,
 			"popup": mergedOptions.value?.popup,
-			"className": (0, __v_c_util.classNames)(mergedOptions.value?.popupClassName, alignedClassName.value, `${prefixCls}-unique-controlled`),
+			"onEsc": mergedOptions.value?.onEsc,
+			"className": (0, _v_c_util.classNames)(mergedOptions.value?.popupClassName, alignedClassName.value, `${prefixCls}-unique-controlled`),
 			"style": mergedOptions.value?.popupStyle,
 			"target": mergedOptions.value?.target,
 			"open": open.value,
@@ -147,7 +151,7 @@ var UniqueProvider = /* @__PURE__ */ (0, vue.defineComponent)((props, { slots })
 			},
 			"popupSize": popupSize.value,
 			"motion": mergedOptions.value?.popupMotion,
-			"uniqueContainerClassName": (0, __v_c_util.classNames)(mergedOptions.value?.uniqueContainerClassName, alignedClassName.value),
+			"uniqueContainerClassName": (0, _v_c_util.classNames)(mergedOptions.value?.uniqueContainerClassName, alignedClassName.value),
 			"uniqueContainerStyle": mergedOptions?.value?.uniqueContainerStyle
 		}, null)] })] })] });
 	};

package/dist/UniqueProvider/index.js

@@ -96,6 +96,7 @@ var UniqueProvider_default = /* @__PURE__ */ defineComponent((props, { slots })
 			"portal": Portal,
 			"prefixCls": prefixCls,
 			"popup": mergedOptions.value?.popup,
+			"onEsc": mergedOptions.value?.onEsc,
 			"className": classNames(mergedOptions.value?.popupClassName, alignedClassName.value, `${prefixCls}-unique-controlled`),
 			"style": mergedOptions.value?.popupStyle,
 			"target": mergedOptions.value?.target,

package/dist/UniqueProvider/useTargetState.cjs

@@ -1,4 +1,7 @@
-Object.defineProperty(exports, "__esModule", { value: true });
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
 const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
 let vue = require("vue");
 function useTargetState() {

package/dist/context.cjs

@@ -1,3 +1,4 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_rolldown_runtime = require("./_virtual/rolldown_runtime.cjs");
 let vue = require("vue");
 var TriggerContextKey = Symbol("TriggerContextKey");

package/dist/context.d.ts

@@ -1,3 +1,4 @@
+import { PortalProps } from '@v-c/portal';
 import { CSSMotionProps } from '@v-c/util/dist/utils/transition';
 import { CSSProperties, InjectionKey, Ref } from 'vue';
 import { TriggerProps } from './index';
@@ -32,6 +33,7 @@ export interface UniqueShowOptions {
     arrow?: ArrowTypeOuter;
     getPopupContainer?: TriggerProps['getPopupContainer'];
     getPopupClassNameFromAlign?: (align: AlignType) => string;
+    onEsc?: PortalProps['onEsc'];
 }
 export interface UniqueContextProps {
     show: (options: UniqueShowOptions, isOpen: () => boolean) => void;

package/dist/hooks/useAction.cjs

@@ -1,4 +1,7 @@
-Object.defineProperty(exports, "__esModule", { value: true });
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
 const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
 let vue = require("vue");
 function toArray(val) {

package/dist/hooks/useAlign.cjs

@@ -1,10 +1,13 @@
-Object.defineProperty(exports, "__esModule", { value: true });
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
 const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
 const require_util = require("../util.cjs");
 let vue = require("vue");
-let __v_c_util_dist_Dom_findDOMNode = require("@v-c/util/dist/Dom/findDOMNode");
-let __v_c_util_dist_Dom_isVisible = require("@v-c/util/dist/Dom/isVisible");
-__v_c_util_dist_Dom_isVisible = require_rolldown_runtime.__toESM(__v_c_util_dist_Dom_isVisible);
+let _v_c_util_dist_Dom_findDOMNode = require("@v-c/util/dist/Dom/findDOMNode");
+let _v_c_util_dist_Dom_isVisible = require("@v-c/util/dist/Dom/isVisible");
+_v_c_util_dist_Dom_isVisible = require_rolldown_runtime.__toESM(_v_c_util_dist_Dom_isVisible);
 function getUnitOffset(size, offset = 0) {
 	const offsetStr = `${offset}`;
 	const cells = offsetStr.match(/^(.*)\%$/);
@@ -41,10 +44,12 @@ function reversePoints(points, index) {
 		l: "r",
 		r: "l"
 	};
-	return points.map((point, i) => {
-		if (i === index) return reverseMap[point] || "c";
-		return point;
-	}).join("");
+	const clone = [...points];
+	clone[index] = reverseMap[points[index]] || "c";
+	return clone;
+}
+function flatPoints(points) {
+	return points.join("");
 }
 function shouldSwitchPlacement(isOverflow, isVisibleFirst, newVisibleArea, originVisibleArea, newRecommendArea, originRecommendArea) {
 	if (isOverflow) return newVisibleArea > originVisibleArea || newVisibleArea === originVisibleArea && (!isVisibleFirst || newRecommendArea >= originRecommendArea);
@@ -169,7 +174,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
 			const popupMirrorRect = rawPopupMirrorRect;
 			const scaleX$1 = require_util.toNum(Math.round(popupWidth / parseFloat(width) * 1e3) / 1e3);
 			const scaleY$1 = require_util.toNum(Math.round(popupHeight / parseFloat(height) * 1e3) / 1e3);
-			if (scaleX$1 === 0 || scaleY$1 === 0 || (0, __v_c_util_dist_Dom_findDOMNode.isDOM)(target) && !(0, __v_c_util_dist_Dom_isVisible.default)(target)) return;
+			if (scaleX$1 === 0 || scaleY$1 === 0 || (0, _v_c_util_dist_Dom_findDOMNode.isDOM)(target) && !(0, _v_c_util_dist_Dom_isVisible.default)(target)) return;
 			const { offset, targetOffset } = placementInfo;
 			let [popupOffsetX, popupOffsetY] = getNumberOffset(popupRect, offset);
 			const [targetOffsetX, targetOffsetY] = getNumberOffset(targetRect, targetOffset);
@@ -181,6 +186,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
 			const targetAlignPoint = getAlignPoint(targetRect, targetPoints);
 			const popupAlignPoint = getAlignPoint(popupRect, popupPoints);
 			const nextAlignInfo = { ...placementInfo };
+			let nextPoints = [popupPoints, targetPoints];
 			let nextOffsetX = targetAlignPoint.x - popupAlignPoint.x + popupOffsetX;
 			let nextOffsetY = targetAlignPoint.y - popupAlignPoint.y + popupOffsetY;
 			function getIntersectionVisibleArea(offsetX$1, offsetY$1, area = visibleArea) {
@@ -227,7 +233,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
 					prevFlipRef.value.bt = true;
 					nextOffsetY = tmpNextOffsetY;
 					popupOffsetY = -popupOffsetY;
-					nextAlignInfo.points = [reversePoints(popupPoints, 0), reversePoints(targetPoints, 0)];
+					nextPoints = [reversePoints(nextPoints[0], 0), reversePoints(nextPoints[1], 0)];
 				} else prevFlipRef.value.bt = false;
 			}
 			const overflowTop = nextPopupY < adjustCheckVisibleArea.top;
@@ -239,7 +245,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
 					prevFlipRef.value.tb = true;
 					nextOffsetY = tmpNextOffsetY;
 					popupOffsetY = -popupOffsetY;
-					nextAlignInfo.points = [reversePoints(popupPoints, 0), reversePoints(targetPoints, 0)];
+					nextPoints = [reversePoints(nextPoints[0], 0), reversePoints(nextPoints[1], 0)];
 				} else prevFlipRef.value.tb = false;
 			}
 			const needAdjustX = supportAdjust(adjustX);
@@ -253,7 +259,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
 					prevFlipRef.value.rl = true;
 					nextOffsetX = tmpNextOffsetX;
 					popupOffsetX = -popupOffsetX;
-					nextAlignInfo.points = [reversePoints(popupPoints, 1), reversePoints(targetPoints, 1)];
+					nextPoints = [reversePoints(nextPoints[0], 1), reversePoints(nextPoints[1], 1)];
 				} else prevFlipRef.value.rl = false;
 			}
 			const overflowLeft = nextPopupX < adjustCheckVisibleArea.left;
@@ -265,9 +271,10 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
 					prevFlipRef.value.lr = true;
 					nextOffsetX = tmpNextOffsetX;
 					popupOffsetX = -popupOffsetX;
-					nextAlignInfo.points = [reversePoints(popupPoints, 1), reversePoints(targetPoints, 1)];
+					nextPoints = [reversePoints(nextPoints[0], 1), reversePoints(nextPoints[1], 1)];
 				} else prevFlipRef.value.lr = false;
 			}
+			nextAlignInfo.points = [flatPoints(nextPoints[0]), flatPoints(nextPoints[1])];
 			syncNextPopupPosition();
 			const numShiftX = shiftX === true ? 0 : shiftX;
 			if (typeof numShiftX === "number") {
@@ -305,12 +312,12 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
 			let offsetX4Right = popupMirrorRect.right - popupRect.x - (nextOffsetX + popupRect.width);
 			let offsetY4Bottom = popupMirrorRect.bottom - popupRect.y - (nextOffsetY + popupRect.height);
 			if (scaleX$1 === 1) {
-				nextOffsetX = Math.round(nextOffsetX);
-				offsetX4Right = Math.round(offsetX4Right);
+				nextOffsetX = Math.floor(nextOffsetX);
+				offsetX4Right = Math.floor(offsetX4Right);
 			}
 			if (scaleY$1 === 1) {
-				nextOffsetY = Math.round(nextOffsetY);
-				offsetY4Bottom = Math.round(offsetY4Bottom);
+				nextOffsetY = Math.floor(nextOffsetY);
+				offsetY4Bottom = Math.floor(offsetY4Bottom);
 			}
 			const nextOffsetInfo = {
 				ready: true,

package/dist/hooks/useAlign.js

@@ -38,10 +38,12 @@ function reversePoints(points, index) {
 		l: "r",
 		r: "l"
 	};
-	return points.map((point, i) => {
-		if (i === index) return reverseMap[point] || "c";
-		return point;
-	}).join("");
+	const clone = [...points];
+	clone[index] = reverseMap[points[index]] || "c";
+	return clone;
+}
+function flatPoints(points) {
+	return points.join("");
 }
 function shouldSwitchPlacement(isOverflow, isVisibleFirst, newVisibleArea, originVisibleArea, newRecommendArea, originRecommendArea) {
 	if (isOverflow) return newVisibleArea > originVisibleArea || newVisibleArea === originVisibleArea && (!isVisibleFirst || newRecommendArea >= originRecommendArea);
@@ -178,6 +180,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
 			const targetAlignPoint = getAlignPoint(targetRect, targetPoints);
 			const popupAlignPoint = getAlignPoint(popupRect, popupPoints);
 			const nextAlignInfo = { ...placementInfo };
+			let nextPoints = [popupPoints, targetPoints];
 			let nextOffsetX = targetAlignPoint.x - popupAlignPoint.x + popupOffsetX;
 			let nextOffsetY = targetAlignPoint.y - popupAlignPoint.y + popupOffsetY;
 			function getIntersectionVisibleArea(offsetX$1, offsetY$1, area = visibleArea) {
@@ -224,7 +227,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
 					prevFlipRef.value.bt = true;
 					nextOffsetY = tmpNextOffsetY;
 					popupOffsetY = -popupOffsetY;
-					nextAlignInfo.points = [reversePoints(popupPoints, 0), reversePoints(targetPoints, 0)];
+					nextPoints = [reversePoints(nextPoints[0], 0), reversePoints(nextPoints[1], 0)];
 				} else prevFlipRef.value.bt = false;
 			}
 			const overflowTop = nextPopupY < adjustCheckVisibleArea.top;
@@ -236,7 +239,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
 					prevFlipRef.value.tb = true;
 					nextOffsetY = tmpNextOffsetY;
 					popupOffsetY = -popupOffsetY;
-					nextAlignInfo.points = [reversePoints(popupPoints, 0), reversePoints(targetPoints, 0)];
+					nextPoints = [reversePoints(nextPoints[0], 0), reversePoints(nextPoints[1], 0)];
 				} else prevFlipRef.value.tb = false;
 			}
 			const needAdjustX = supportAdjust(adjustX);
@@ -250,7 +253,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
 					prevFlipRef.value.rl = true;
 					nextOffsetX = tmpNextOffsetX;
 					popupOffsetX = -popupOffsetX;
-					nextAlignInfo.points = [reversePoints(popupPoints, 1), reversePoints(targetPoints, 1)];
+					nextPoints = [reversePoints(nextPoints[0], 1), reversePoints(nextPoints[1], 1)];
 				} else prevFlipRef.value.rl = false;
 			}
 			const overflowLeft = nextPopupX < adjustCheckVisibleArea.left;
@@ -262,9 +265,10 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
 					prevFlipRef.value.lr = true;
 					nextOffsetX = tmpNextOffsetX;
 					popupOffsetX = -popupOffsetX;
-					nextAlignInfo.points = [reversePoints(popupPoints, 1), reversePoints(targetPoints, 1)];
+					nextPoints = [reversePoints(nextPoints[0], 1), reversePoints(nextPoints[1], 1)];
 				} else prevFlipRef.value.lr = false;
 			}
+			nextAlignInfo.points = [flatPoints(nextPoints[0]), flatPoints(nextPoints[1])];
 			syncNextPopupPosition();
 			const numShiftX = shiftX === true ? 0 : shiftX;
 			if (typeof numShiftX === "number") {
@@ -302,12 +306,12 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
 			let offsetX4Right = popupMirrorRect.right - popupRect.x - (nextOffsetX + popupRect.width);
 			let offsetY4Bottom = popupMirrorRect.bottom - popupRect.y - (nextOffsetY + popupRect.height);
 			if (scaleX$1 === 1) {
-				nextOffsetX = Math.round(nextOffsetX);
-				offsetX4Right = Math.round(offsetX4Right);
+				nextOffsetX = Math.floor(nextOffsetX);
+				offsetX4Right = Math.floor(offsetX4Right);
 			}
 			if (scaleY$1 === 1) {
-				nextOffsetY = Math.round(nextOffsetY);
-				offsetY4Bottom = Math.round(offsetY4Bottom);
+				nextOffsetY = Math.floor(nextOffsetY);
+				offsetY4Bottom = Math.floor(offsetY4Bottom);
 			}
 			const nextOffsetInfo = {
 				ready: true,

package/dist/hooks/useDelay.cjs

@@ -1,4 +1,7 @@
-Object.defineProperty(exports, "__esModule", { value: true });
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
 const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
 let vue = require("vue");
 function useDelay() {

package/dist/hooks/useOffsetStyle.cjs

@@ -1,4 +1,7 @@
-Object.defineProperty(exports, "__esModule", { value: true });
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
 const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
 let vue = require("vue");
 function useOffsetStyle(isMobile, ready, open, align, offsetR, offsetB, offsetX, offsetY) {
@@ -10,7 +13,6 @@ function useOffsetStyle(isMobile, ready, open, align, offsetR, offsetB, offsetX,
 			right: AUTO,
 			bottom: AUTO
 		};
-		if (!(offsetX.value > 0 || offsetY.value > 0 || offsetR.value > 0 || offsetB.value > 0)) return {};
 		if (!isMobile.value && (ready.value || !open.value)) {
 			const { points } = align.value ?? {};
 			const dynamicInset = align.value?.dynamicInset || align.value?._experimental?.dynamicInset;

package/dist/hooks/useOffsetStyle.js

@@ -8,7 +8,6 @@ function useOffsetStyle(isMobile, ready, open, align, offsetR, offsetB, offsetX,
 			right: AUTO,
 			bottom: AUTO
 		};
-		if (!(offsetX.value > 0 || offsetY.value > 0 || offsetR.value > 0 || offsetB.value > 0)) return {};
 		if (!isMobile.value && (ready.value || !open.value)) {
 			const { points } = align.value ?? {};
 			const dynamicInset = align.value?.dynamicInset || align.value?._experimental?.dynamicInset;

package/dist/hooks/useWatch.cjs

@@ -1,4 +1,7 @@
-Object.defineProperty(exports, "__esModule", { value: true });
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
 const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
 const require_util = require("../util.cjs");
 let vue = require("vue");
@@ -8,8 +11,8 @@ function useWatch(open, target, popup, onAlign, onScroll) {
 		target,
 		popup
 	], async (_n, _o, onCleanup) => {
-		await (0, vue.nextTick)();
 		if (open.value && target.value && popup.value) {
+			await (0, vue.nextTick)();
 			const targetElement = target.value;
 			const popupElement = popup.value;
 			const targetScrollList = require_util.collectScroller(targetElement);
@@ -36,6 +39,6 @@ function useWatch(open, target, popup, onAlign, onScroll) {
 				});
 			});
 		}
-	});
+	}, { flush: "post" });
 }
 exports.default = useWatch;

package/dist/hooks/useWatch.js

@@ -6,8 +6,8 @@ function useWatch(open, target, popup, onAlign, onScroll) {
 		target,
 		popup
 	], async (_n, _o, onCleanup) => {
-		await nextTick();
 		if (open.value && target.value && popup.value) {
+			await nextTick();
 			const targetElement = target.value;
 			const popupElement = popup.value;
 			const targetScrollList = collectScroller(targetElement);
@@ -34,6 +34,6 @@ function useWatch(open, target, popup, onAlign, onScroll) {
 				});
 			});
 		}
-	});
+	}, { flush: "post" });
 }
 export { useWatch as default };

package/dist/hooks/useWinClick.cjs

@@ -1,9 +1,12 @@
-Object.defineProperty(exports, "__esModule", { value: true });
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
 const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
 const require_util = require("../util.cjs");
 let vue = require("vue");
-let __v_c_util = require("@v-c/util");
-let __v_c_util_dist_Dom_shadow = require("@v-c/util/dist/Dom/shadow");
+let _v_c_util = require("@v-c/util");
+let _v_c_util_dist_Dom_shadow = require("@v-c/util/dist/Dom/shadow");
 function useWinClick(open, clickToHide, targetEle, popupEle, mask, maskClosable, inPopupOrChild, triggerOpen) {
 	const openRef = (0, vue.shallowRef)(open.value);
 	(0, vue.watchEffect)(() => {
@@ -28,7 +31,7 @@ function useWinClick(open, clickToHide, targetEle, popupEle, mask, maskClosable,
 			win.addEventListener("pointerdown", onPointerDown, true);
 			win.addEventListener("mousedown", onTriggerClose, true);
 			win.addEventListener("contextmenu", onTriggerClose, true);
-			const targetShadowRoot = (0, __v_c_util_dist_Dom_shadow.getShadowRoot)(targetEle$1);
+			const targetShadowRoot = (0, _v_c_util_dist_Dom_shadow.getShadowRoot)(targetEle$1);
 			if (targetShadowRoot) {
 				targetShadowRoot.addEventListener("mousedown", onTriggerClose, true);
 				targetShadowRoot.addEventListener("contextmenu", onTriggerClose, true);
@@ -36,7 +39,7 @@ function useWinClick(open, clickToHide, targetEle, popupEle, mask, maskClosable,
 			if (process.env.NODE_ENV !== "production" && targetEle$1) {
 				const targetRoot = targetEle$1.getRootNode?.();
 				const popupRoot = popupEle$1.getRootNode?.();
-				(0, __v_c_util.warning)(targetRoot === popupRoot, `trigger element and popup element should in same shadow root.`);
+				(0, _v_c_util.warning)(targetRoot === popupRoot, `trigger element and popup element should in same shadow root.`);
 			}
 			onCleanup(() => {
 				win.removeEventListener("pointerdown", onPointerDown, true);

package/dist/index.cjs

@@ -1,4 +1,7 @@
-Object.defineProperty(exports, "__esModule", { value: true });
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
 const require_rolldown_runtime = require("./_virtual/rolldown_runtime.cjs");
 const require_context = require("./context.cjs");
 const require_useAction = require("./hooks/useAction.cjs");
@@ -10,17 +13,13 @@ const require_useWinClick = require("./hooks/useWinClick.cjs");
 const require_index = require("./Popup/index.cjs");
 const require_index$1 = require("./UniqueProvider/index.cjs");
 let vue = require("vue");
-let __v_c_portal = require("@v-c/portal");
-__v_c_portal = require_rolldown_runtime.__toESM(__v_c_portal);
-let __v_c_resize_observer = require("@v-c/resize-observer");
-__v_c_resize_observer = require_rolldown_runtime.__toESM(__v_c_resize_observer);
-let __v_c_util = require("@v-c/util");
-let __v_c_util_dist_Dom_shadow = require("@v-c/util/dist/Dom/shadow");
-let __v_c_util_dist_props_util = require("@v-c/util/dist/props-util");
-let __v_c_util_dist_vnode = require("@v-c/util/dist/vnode");
-function _isSlot(s) {
-	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
-}
+let _v_c_portal = require("@v-c/portal");
+_v_c_portal = require_rolldown_runtime.__toESM(_v_c_portal);
+let _v_c_resize_observer = require("@v-c/resize-observer");
+let _v_c_util = require("@v-c/util");
+let _v_c_util_dist_Dom_shadow = require("@v-c/util/dist/Dom/shadow");
+let _v_c_util_dist_props_util = require("@v-c/util/dist/props-util");
+let _v_c_util_dist_vnode = require("@v-c/util/dist/vnode");
 var defaults = {
 	prefixCls: "vc-trigger-popup",
 	action: "hover",
@@ -30,7 +29,7 @@ var defaults = {
 	popupVisible: void 0,
 	defaultPopupVisible: void 0
 };
-function generateTrigger(PortalComponent = __v_c_portal.default) {
+function generateTrigger(PortalComponent = _v_c_portal.default) {
 	return /* @__PURE__ */ (0, vue.defineComponent)((props, { expose, slots, attrs }) => {
 		const mergedAutoDestroy = (0, vue.computed)(() => props.autoDestroy ?? false);
 		const openUncontrolled = (0, vue.computed)(() => props.popupVisible === void 0);
@@ -49,20 +48,20 @@ function generateTrigger(PortalComponent = __v_c_portal.default) {
 		const popupEle = (0, vue.shallowRef)(null);
 		const externalPopupRef = (0, vue.shallowRef)(null);
 		const setPopupRef = (node) => {
-			const element = (0, __v_c_util_dist_vnode.resolveToElement)(node);
+			const element = (0, _v_c_util_dist_vnode.resolveToElement)(node);
 			externalPopupRef.value = element;
 			if (popupEle.value !== element) popupEle.value = element;
 			parentContext?.value?.registerSubPopup(id, element ?? null);
 		};
-		const targetEle = (0, vue.shallowRef)(null);
+		const targetEle = (0, vue.shallowRef)();
 		const externalForwardRef = (0, vue.shallowRef)(null);
 		const setTargetRef = (node) => {
-			const element = (0, __v_c_util_dist_vnode.resolveToElement)(node);
+			const element = (0, _v_c_util_dist_vnode.resolveToElement)(node);
 			if (element && targetEle.value !== element) {
 				targetEle.value = element;
 				externalForwardRef.value = element;
 			} else if (!element) {
-				targetEle.value = null;
+				targetEle.value = void 0;
 				externalForwardRef.value = null;
 			}
 		};
@@ -75,7 +74,7 @@ function generateTrigger(PortalComponent = __v_c_portal.default) {
 		}));
 		const inPopupOrChild = (ele) => {
 			const childDOM = targetEle.value;
-			return childDOM?.contains(ele) || childDOM && (0, __v_c_util_dist_Dom_shadow.getShadowRoot)(childDOM)?.host === ele || ele === childDOM || popupEle.value?.contains(ele) || popupEle.value && (0, __v_c_util_dist_Dom_shadow.getShadowRoot)(popupEle.value)?.host === ele || ele === popupEle.value || Object.values(subPopupElements.value).some((subPopupEle) => subPopupEle?.contains(ele) || ele === subPopupEle);
+			return childDOM?.contains(ele) || childDOM && (0, _v_c_util_dist_Dom_shadow.getShadowRoot)(childDOM)?.host === ele || ele === childDOM || popupEle.value?.contains(ele) || popupEle.value && (0, _v_c_util_dist_Dom_shadow.getShadowRoot)(popupEle.value)?.host === ele || ele === popupEle.value || Object.values(subPopupElements.value).some((subPopupEle) => subPopupEle?.contains(ele) || ele === subPopupEle);
 		};
 		const innerArrow = (0, vue.computed)(() => {
 			return props.arrow ? { ...props?.arrow !== true ? props?.arrow : {} } : null;
@@ -85,9 +84,6 @@ function generateTrigger(PortalComponent = __v_c_portal.default) {
 		const mergedOpen = (0, vue.computed)(() => {
 			return props?.popupVisible ?? internalOpen.value;
 		});
-		const setMergedOpen = (nextOpen) => {
-			if (openUncontrolled.value) internalOpen.value = nextOpen;
-		};
 		const isOpen = () => mergedOpen.value;
 		(0, vue.watch)(() => props.popupVisible, async (nextVisible) => {
 			if (nextVisible !== void 0) {
@@ -116,7 +112,8 @@ function generateTrigger(PortalComponent = __v_c_portal.default) {
 				arrow: innerArrow.value,
 				getPopupContainer: props.getPopupContainer,
 				getPopupClassNameFromAlign: props.getPopupClassNameFromAlign,
-				id
+				id,
+				onEsc
 			};
 		};
 		(0, vue.watch)([mergedOpen, targetEle], () => {
@@ -126,16 +123,9 @@ function generateTrigger(PortalComponent = __v_c_portal.default) {
 			} else uniqueContext?.hide(props.mouseLeaveDelay || 0);
 		});
 		const openRef = (0, vue.shallowRef)(mergedOpen.value);
-		const lastTriggerRef = (0, vue.shallowRef)([]);
-		lastTriggerRef.value = [];
-		(0, vue.watchEffect)(() => {
-			openRef.value = mergedOpen.value;
-			if (!mergedOpen.value) lastTriggerRef.value = [];
-		});
 		const internalTriggerOpen = (nextOpen) => {
-			setMergedOpen(nextOpen);
-			if ((lastTriggerRef.value[lastTriggerRef.value.length - 1] ?? mergedOpen.value) !== nextOpen) {
-				lastTriggerRef.value.push(nextOpen);
+			if (mergedOpen.value !== nextOpen) {
+				internalOpen.value = nextOpen;
 				props?.onOpenChange?.(nextOpen);
 				props?.onPopupVisibleChange?.(nextOpen);
 			}
@@ -157,6 +147,9 @@ function generateTrigger(PortalComponent = __v_c_portal.default) {
 				internalTriggerOpen(nextOpen);
 			}, delay);
 		};
+		function onEsc({ top }) {
+			if (top) triggerOpen(false);
+		}
 		const inMotion = (0, vue.shallowRef)(false);
 		(0, vue.watch)(mergedOpen, () => {
 			if (mergedOpen.value) inMotion.value = true;
@@ -188,7 +181,7 @@ function generateTrigger(PortalComponent = __v_c_portal.default) {
 			if (mergedOpen.value && !builtinPlacements?.[popupPlacement]) triggerAlign();
 		});
 		const alignedClassName = (0, vue.computed)(() => {
-			return (0, __v_c_util.classNames)(require_util.getAlignPopupClassName(props.builtinPlacements, props.prefixCls, alignInfo.value, props.alignPoint), props?.getPopupClassNameFromAlign?.(alignInfo.value));
+			return (0, _v_c_util.classNames)(require_util.getAlignPopupClassName(props.builtinPlacements, props.prefixCls, alignInfo.value, props.alignPoint), props?.getPopupClassNameFromAlign?.(alignInfo.value));
 		});
 		expose({
 			nativeElement: externalForwardRef,
@@ -309,8 +302,9 @@ function generateTrigger(PortalComponent = __v_c_portal.default) {
 		(0, vue.watchEffect)(() => {
 			rendedRef.value ||= props.forceRender || mergedOpen.value || inMotion.value;
 		});
+		(0, _v_c_resize_observer.useResizeObserver)(mergedOpen, targetEle, onTargetResize);
 		return () => {
-			const child = (0, __v_c_util_dist_props_util.filterEmpty)(slots?.default?.() ?? [])?.[0];
+			const child = (0, _v_c_util_dist_props_util.filterEmpty)(slots?.default?.() ?? [])?.[0];
 			const mergedChildrenProps = {
 				...originChildProps,
 				...cloneProps.value
@@ -341,15 +335,12 @@ function generateTrigger(PortalComponent = __v_c_portal.default) {
 				ref: setTargetRef
 			});
 			const { unique, prefixCls, popup, popupClassName, popupStyle, zIndex, fresh, onPopupClick, mask, popupMotion, maskMotion, forceRender, getPopupContainer, stretch, mobile } = props;
-			return (0, vue.createVNode)(vue.Fragment, null, [(0, vue.createVNode)(__v_c_resize_observer.default, {
-				"disabled": !mergedOpen.value,
-				"onResize": onTargetResize
-			}, _isSlot(triggerNode) ? triggerNode : { default: () => [triggerNode] }), rendedRef.value && targetEle.value && (!uniqueContext || !unique) && (0, vue.createVNode)(require_context.TriggerContextProvider, context.value, { default: () => [(0, vue.createVNode)(require_index.default, {
+			return (0, vue.createVNode)(vue.Fragment, null, [triggerNode, rendedRef.value && targetEle.value && (!uniqueContext || !unique) && (0, vue.createVNode)(require_context.TriggerContextProvider, context.value, { default: () => [(0, vue.createVNode)(require_index.default, {
 				"portal": PortalComponent,
 				"ref": setPopupRef,
 				"prefixCls": prefixCls,
 				"popup": popup,
-				"className": (0, __v_c_util.classNames)(popupClassName, !isMobile.value && alignedClassName.value),
+				"className": (0, _v_c_util.classNames)(popupClassName, !isMobile.value && alignedClassName.value),
 				"style": popupStyle,
 				"target": targetEle.value,
 				"onMouseEnter": onPopupMouseEnter,
@@ -360,6 +351,7 @@ function generateTrigger(PortalComponent = __v_c_portal.default) {
 				"keepDom": inMotion.value,
 				"fresh": fresh,
 				"onClick": onPopupClick,
+				"onEsc": onEsc,
 				"onPointerDownCapture": onPopupPointerDown,
 				"mask": mask,
 				"motion": popupMotion,
@@ -590,7 +582,7 @@ function generateTrigger(PortalComponent = __v_c_portal.default) {
 		}
 	}, defaults) });
 }
-var Trigger = generateTrigger(__v_c_portal.default);
+var Trigger = generateTrigger(_v_c_portal.default);
 var src_default = Trigger;
 exports.Trigger = Trigger;
 exports.UniqueProvider = require_index$1.default;

package/dist/index.js

@@ -7,16 +7,13 @@ import useWatch from "./hooks/useWatch.js";
 import useWinClick from "./hooks/useWinClick.js";
 import Popup_default from "./Popup/index.js";
 import UniqueProvider_default from "./UniqueProvider/index.js";
-import { Fragment, computed, createVNode, defineComponent, isVNode, mergeDefaults, nextTick, reactive, ref, shallowRef, useId, watch, watchEffect } from "vue";
+import { Fragment, computed, createVNode, defineComponent, mergeDefaults, nextTick, reactive, ref, shallowRef, useId, watch, watchEffect } from "vue";
 import Portal from "@v-c/portal";
-import ResizeObserver from "@v-c/resize-observer";
+import { useResizeObserver } from "@v-c/resize-observer";
 import { classNames } from "@v-c/util";
 import { getShadowRoot } from "@v-c/util/dist/Dom/shadow";
 import { filterEmpty } from "@v-c/util/dist/props-util";
 import { resolveToElement } from "@v-c/util/dist/vnode";
-function _isSlot(s) {
-	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
-}
 var defaults = {
 	prefixCls: "vc-trigger-popup",
 	action: "hover",
@@ -50,7 +47,7 @@ function generateTrigger(PortalComponent = Portal) {
 			if (popupEle.value !== element) popupEle.value = element;
 			parentContext?.value?.registerSubPopup(id, element ?? null);
 		};
-		const targetEle = shallowRef(null);
+		const targetEle = shallowRef();
 		const externalForwardRef = shallowRef(null);
 		const setTargetRef = (node) => {
 			const element = resolveToElement(node);
@@ -58,7 +55,7 @@ function generateTrigger(PortalComponent = Portal) {
 				targetEle.value = element;
 				externalForwardRef.value = element;
 			} else if (!element) {
-				targetEle.value = null;
+				targetEle.value = void 0;
 				externalForwardRef.value = null;
 			}
 		};
@@ -81,9 +78,6 @@ function generateTrigger(PortalComponent = Portal) {
 		const mergedOpen = computed(() => {
 			return props?.popupVisible ?? internalOpen.value;
 		});
-		const setMergedOpen = (nextOpen) => {
-			if (openUncontrolled.value) internalOpen.value = nextOpen;
-		};
 		const isOpen = () => mergedOpen.value;
 		watch(() => props.popupVisible, async (nextVisible) => {
 			if (nextVisible !== void 0) {
@@ -112,7 +106,8 @@ function generateTrigger(PortalComponent = Portal) {
 				arrow: innerArrow.value,
 				getPopupContainer: props.getPopupContainer,
 				getPopupClassNameFromAlign: props.getPopupClassNameFromAlign,
-				id
+				id,
+				onEsc
 			};
 		};
 		watch([mergedOpen, targetEle], () => {
@@ -122,16 +117,9 @@ function generateTrigger(PortalComponent = Portal) {
 			} else uniqueContext?.hide(props.mouseLeaveDelay || 0);
 		});
 		const openRef = shallowRef(mergedOpen.value);
-		const lastTriggerRef = shallowRef([]);
-		lastTriggerRef.value = [];
-		watchEffect(() => {
-			openRef.value = mergedOpen.value;
-			if (!mergedOpen.value) lastTriggerRef.value = [];
-		});
 		const internalTriggerOpen = (nextOpen) => {
-			setMergedOpen(nextOpen);
-			if ((lastTriggerRef.value[lastTriggerRef.value.length - 1] ?? mergedOpen.value) !== nextOpen) {
-				lastTriggerRef.value.push(nextOpen);
+			if (mergedOpen.value !== nextOpen) {
+				internalOpen.value = nextOpen;
 				props?.onOpenChange?.(nextOpen);
 				props?.onPopupVisibleChange?.(nextOpen);
 			}
@@ -153,6 +141,9 @@ function generateTrigger(PortalComponent = Portal) {
 				internalTriggerOpen(nextOpen);
 			}, delay);
 		};
+		function onEsc({ top }) {
+			if (top) triggerOpen(false);
+		}
 		const inMotion = shallowRef(false);
 		watch(mergedOpen, () => {
 			if (mergedOpen.value) inMotion.value = true;
@@ -305,6 +296,7 @@ function generateTrigger(PortalComponent = Portal) {
 		watchEffect(() => {
 			rendedRef.value ||= props.forceRender || mergedOpen.value || inMotion.value;
 		});
+		useResizeObserver(mergedOpen, targetEle, onTargetResize);
 		return () => {
 			const child = filterEmpty(slots?.default?.() ?? [])?.[0];
 			const mergedChildrenProps = {
@@ -337,10 +329,7 @@ function generateTrigger(PortalComponent = Portal) {
 				ref: setTargetRef
 			});
 			const { unique, prefixCls, popup, popupClassName, popupStyle, zIndex, fresh, onPopupClick, mask, popupMotion, maskMotion, forceRender, getPopupContainer, stretch, mobile } = props;
-			return createVNode(Fragment, null, [createVNode(ResizeObserver, {
-				"disabled": !mergedOpen.value,
-				"onResize": onTargetResize
-			}, _isSlot(triggerNode) ? triggerNode : { default: () => [triggerNode] }), rendedRef.value && targetEle.value && (!uniqueContext || !unique) && createVNode(TriggerContextProvider, context.value, { default: () => [createVNode(Popup_default, {
+			return createVNode(Fragment, null, [triggerNode, rendedRef.value && targetEle.value && (!uniqueContext || !unique) && createVNode(TriggerContextProvider, context.value, { default: () => [createVNode(Popup_default, {
 				"portal": PortalComponent,
 				"ref": setPopupRef,
 				"prefixCls": prefixCls,
@@ -356,6 +345,7 @@ function generateTrigger(PortalComponent = Portal) {
 				"keepDom": inMotion.value,
 				"fresh": fresh,
 				"onClick": onPopupClick,
+				"onEsc": onEsc,
 				"onPointerDownCapture": onPopupPointerDown,
 				"mask": mask,
 				"motion": popupMotion,

package/dist/interface.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });

package/dist/util.cjs

@@ -1,6 +1,8 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 function isPointsEq(a1 = [], a2 = [], isAlignPoint) {
-	if (isAlignPoint) return a1[0] === a2[0];
-	return a1[0] === a2[0] && a1[1] === a2[1];
+	const getVal = (a, index) => a[index] || "";
+	if (isAlignPoint) return getVal(a1, 0) === getVal(a2, 0);
+	return getVal(a1, 0) === getVal(a2, 0) && getVal(a1, 1) === getVal(a2, 1);
 }
 function getAlignPopupClassName(builtinPlacements, prefixCls, align, isAlignPoint) {
 	const { points } = align;

package/dist/util.js

@@ -1,6 +1,7 @@
 function isPointsEq(a1 = [], a2 = [], isAlignPoint) {
-	if (isAlignPoint) return a1[0] === a2[0];
-	return a1[0] === a2[0] && a1[1] === a2[1];
+	const getVal = (a, index) => a[index] || "";
+	if (isAlignPoint) return getVal(a1, 0) === getVal(a2, 0);
+	return getVal(a1, 0) === getVal(a2, 0) && getVal(a1, 1) === getVal(a2, 1);
 }
 function getAlignPopupClassName(builtinPlacements, prefixCls, align, isAlignPoint) {
 	const { points } = align;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@v-c/trigger",
   "type": "module",
-  "version": "1.0.2",
+  "version": "1.0.5",
   "description": "",
   "publishConfig": {
     "access": "public"
@@ -29,9 +29,9 @@
     "vue": "^3.0.0"
   },
   "dependencies": {
-    "@v-c/portal": "^1.0.1",
-    "@v-c/resize-observer": "^1.0.3",
-    "@v-c/util": "^1.0.3"
+    "@v-c/resize-observer": "^1.0.6",
+    "@v-c/util": "^1.0.8",
+    "@v-c/portal": "^1.0.4"
   },
   "scripts": {
     "build": "vite build",