@v-c/trigger 1.0.5 → 1.0.7

package/dist/index.d.ts

@@ -25,7 +25,7 @@ export interface TriggerProps {
     onPopupVisibleChange?: (visible: boolean) => void;
     /** @deprecated Use `afterOpenChange` instead */
     afterPopupVisibleChange?: (visible: boolean) => void;
-    getPopupContainer?: (node: HTMLElement) => HTMLElement;
+    getPopupContainer?: (node: HTMLElement) => HTMLElement | false;
     forceRender?: boolean;
     autoDestroy?: boolean;
     mask?: boolean;

package/dist/index.js

@@ -298,7 +298,7 @@ function generateTrigger(PortalComponent = Portal) {
 		});
 		useResizeObserver(mergedOpen, targetEle, onTargetResize);
 		return () => {
-			const child = filterEmpty(slots?.default?.() ?? [])?.[0];
+			const child = filterEmpty(slots?.default?.({ open: mergedOpen.value }) ?? [])?.[0];
 			const mergedChildrenProps = {
 				...originChildProps,
 				...cloneProps.value

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@v-c/trigger",
   "type": "module",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "description": "",
   "publishConfig": {
     "access": "public"
@@ -15,7 +15,7 @@
     ".": {
       "types": "./dist/index.d.ts",
       "import": "./dist/index.js",
-      "require": "./dist/index.cjs"
+      "default": "./dist/index.js"
     },
     "./dist/*": "./dist/*",
     "./package.json": "./package.json"
@@ -29,9 +29,9 @@
     "vue": "^3.0.0"
   },
   "dependencies": {
-    "@v-c/resize-observer": "^1.0.6",
-    "@v-c/util": "^1.0.8",
-    "@v-c/portal": "^1.0.4"
+    "@v-c/portal": "^1.0.6",
+    "@v-c/resize-observer": "^1.0.8",
+    "@v-c/util": "^1.0.11"
   },
   "scripts": {
     "build": "vite build",

package/dist/Popup/Arrow.cjs

@@ -1,63 +0,0 @@
-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");
-const Arrow = /* @__PURE__ */ (0, vue.defineComponent)({
-	props: {
-		prefixCls: {
-			type: String,
-			required: true,
-			default: void 0
-		},
-		align: {
-			type: Object,
-			required: true,
-			default: void 0
-		},
-		arrow: {
-			type: Object,
-			required: true,
-			default: void 0
-		},
-		arrowPos: {
-			type: Object,
-			required: true,
-			default: void 0
-		}
-	},
-	name: "Arrow",
-	setup(props, { expose }) {
-		const arrowRef = (0, vue.shallowRef)();
-		expose({ arrowRef });
-		return () => {
-			const { prefixCls, align, arrow, arrowPos } = props;
-			const { className, content, style } = arrow || {};
-			const { x = 0, y = 0 } = arrowPos;
-			if (!align || !align.points) return null;
-			const alignStyle = { position: "absolute" };
-			if (align.autoArrow !== false) {
-				const popupPoints = align.points[0];
-				const targetPoints = align.points[1];
-				const popupTB = popupPoints[0];
-				const popupLR = popupPoints[1];
-				const targetTB = targetPoints[0];
-				const targetLR = targetPoints[1];
-				if (popupTB === targetTB || !["t", "b"].includes(popupTB)) alignStyle.top = `${y}px`;
-				else if (popupTB === "t") alignStyle.top = 0;
-				else alignStyle.bottom = 0;
-				if (popupLR === targetLR || !["l", "r"].includes(popupLR)) alignStyle.left = `${x}px`;
-				else if (popupLR === "l") alignStyle.left = 0;
-				else alignStyle.right = 0;
-			}
-			return (0, vue.createVNode)("div", {
-				"ref": arrowRef,
-				"class": (0, _v_c_util.classNames)(`${prefixCls}-arrow`, className),
-				"style": {
-					...alignStyle,
-					...style
-				}
-			}, [content]);
-		};
-	}
-});
-exports.Arrow = Arrow;

package/dist/Popup/Mask.cjs

@@ -1,58 +0,0 @@
-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");
-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", {
-			"style": { zIndex },
-			"class": [
-				`${prefixCls}-mask`,
-				mobile && `${prefixCls}-mask-mobile`,
-				attrs.class
-			]
-		}, null) : null] });
-	};
-}, {
-	props: {
-		prefixCls: {
-			type: String,
-			required: true,
-			default: void 0
-		},
-		open: {
-			type: Boolean,
-			required: false,
-			default: void 0
-		},
-		zIndex: {
-			type: Number,
-			required: false,
-			default: void 0
-		},
-		mask: {
-			type: Boolean,
-			required: false,
-			default: void 0
-		},
-		motion: {
-			type: Object,
-			required: false,
-			default: void 0
-		},
-		mobile: {
-			type: Boolean,
-			required: false,
-			default: void 0
-		}
-	},
-	inheritAttrs: false,
-	name: "PopupMask"
-});
-var Mask_default = Mask;
-exports.default = Mask_default;

package/dist/Popup/PopupContent.cjs

@@ -1,27 +0,0 @@
-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 }) => {
-	const cachedChildren = (0, vue.shallowRef)();
-	return () => {
-		const children = slots?.default?.();
-		if (!props.cache) {
-			cachedChildren.value = children;
-			return children;
-		}
-		if (!cachedChildren.value) cachedChildren.value = children;
-		return cachedChildren.value;
-	};
-}, {
-	props: { cache: {
-		type: Boolean,
-		required: false,
-		default: void 0
-	} },
-	name: "PopupContext"
-});
-var PopupContent_default = PopupContent;
-exports.default = PopupContent_default;

package/dist/Popup/index.cjs

@@ -1,318 +0,0 @@
-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");
-let vue = require("vue");
-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 { 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;
-	const mergedProps = (0, vue.computed)(() => {
-		const { mobile, mask, maskMotion, motion } = props;
-		if (mobile) return [
-			mobile.mask,
-			mobile.maskMotion,
-			mobile.motion
-		];
-		return [
-			mask,
-			maskMotion,
-			motion
-		];
-	});
-	const show = (0, vue.shallowRef)(!props.getPopupContainer || !getPopupContainerNeedParams);
-	(0, vue.watchEffect)(async () => {
-		await (0, vue.nextTick)();
-		const getPopupContainerNeedParams$1 = props?.getPopupContainer?.length > 0;
-		const target = props.target;
-		if (!show.value && getPopupContainerNeedParams$1 && target) show.value = true;
-	});
-	const onInternalResize = (size, element) => {
-		props?.onResize?.(size, element);
-		props?.onAlign?.();
-	};
-	const offsetStyle = require_useOffsetStyle.default(isMobile, ready, open, align, offsetR, offsetB, offsetX, offsetY);
-	const popupElementRef = (0, vue.shallowRef)();
-	expose({
-		getElement: () => popupElementRef.value,
-		nativeElement: popupElementRef
-	});
-	(0, _v_c_resize_observer.useResizeObserver)(open, popupElementRef, onInternalResize);
-	return () => {
-		if (!show.value) return null;
-		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`;
-			else if (stretch.includes("minHeight") && targetHeight) miscStyle.minHeight = `${targetHeight}px`;
-			if (stretch.includes("width") && targetWidth) miscStyle.width = `${targetWidth}px`;
-			else if (stretch.includes("minWidth") && targetWidth) miscStyle.minWidth = `${targetWidth}px`;
-		}
-		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) : {
-			appear: true,
-			...mergedPopupMotion || {}
-		};
-		const mergedTransitionProps = {
-			appear: true,
-			...baseTransitionProps,
-			onBeforeEnter: (element) => {
-				onPrepare?.();
-				baseTransitionProps?.onBeforeEnter?.(element);
-			},
-			onAfterEnter: (element) => {
-				baseTransitionProps?.onAfterEnter?.(element);
-				requestAnimationFrame(() => {
-					onVisibleChanged?.(true);
-				});
-			},
-			onAfterLeave: (element) => {
-				baseTransitionProps.onAfterLeave?.(element);
-				onVisibleChanged?.(false);
-			}
-		};
-		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,
-			"onEsc": onEsc
-		}, { default: () => [
-			(0, vue.createVNode)(require_Mask.default, {
-				"prefixCls": prefixCls,
-				"open": open.value,
-				"zIndex": zIndex,
-				"mask": mergedMask,
-				"motion": mergedMaskMotion,
-				"mobile": isMobile.value
-			}, null),
-			(0, vue.createVNode)(vue.Transition, mergedTransitionProps, { default: () => [(0, vue.withDirectives)((0, vue.createVNode)("div", (0, vue.mergeProps)({
-				"ref": popupElementRef,
-				"class": cls,
-				"style": [
-					{
-						"--arrow-x": `${arrowPos.x || 0}px`,
-						"--arrow-y": `${arrowPos.y || 0}px`
-					},
-					offsetStyle.value,
-					miscStyle,
-					{
-						boxSizing: "border-box",
-						zIndex
-					},
-					props.style
-				],
-				"onMouseenter": onMouseEnter,
-				"onMouseleave": onMouseLeave,
-				"onPointerenter": onPointerEnter,
-				"onClick": onClick
-			}, { onPointerdownCapture: onPointerDownCapture }), [!!arrow && (0, vue.createVNode)(require_Arrow.Arrow, {
-				"prefixCls": prefixCls,
-				"arrow": arrow === true ? {} : arrow,
-				"arrowPos": arrowPos,
-				"align": align$1
-			}, 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,
-		default: void 0
-	},
-	className: {
-		type: String,
-		required: false,
-		default: void 0
-	},
-	style: {
-		type: Object,
-		required: false,
-		default: void 0
-	},
-	popup: {
-		type: Function,
-		required: false,
-		skipCheck: true,
-		default: void 0
-	},
-	target: {
-		required: true,
-		default: void 0
-	},
-	onMouseEnter: {
-		type: Function,
-		required: false,
-		default: void 0
-	},
-	onMouseLeave: {
-		type: Function,
-		required: false,
-		default: void 0
-	},
-	onPointerEnter: {
-		type: Function,
-		required: false,
-		default: void 0
-	},
-	onPointerDownCapture: {
-		type: Function,
-		required: false,
-		default: void 0
-	},
-	zIndex: {
-		type: Number,
-		required: false,
-		default: void 0
-	},
-	mask: {
-		type: Boolean,
-		required: false,
-		default: void 0
-	},
-	onVisibleChanged: {
-		type: Function,
-		required: true,
-		default: void 0
-	},
-	align: {
-		type: Object,
-		required: false,
-		default: void 0
-	},
-	arrow: {
-		type: [Object, Boolean],
-		required: false,
-		default: void 0
-	},
-	arrowPos: {
-		type: Object,
-		required: true,
-		default: void 0
-	},
-	open: {
-		type: Boolean,
-		required: true,
-		default: void 0
-	},
-	keepDom: {
-		type: Boolean,
-		required: true,
-		default: void 0
-	},
-	fresh: {
-		type: Boolean,
-		required: false,
-		default: void 0
-	},
-	onClick: {
-		type: Function,
-		required: false,
-		default: void 0
-	},
-	motion: {
-		type: Object,
-		required: false,
-		default: void 0
-	},
-	maskMotion: {
-		type: Object,
-		required: false,
-		default: void 0
-	},
-	forceRender: {
-		type: Boolean,
-		required: false,
-		default: void 0
-	},
-	getPopupContainer: {
-		type: Function,
-		required: false,
-		default: void 0
-	},
-	autoDestroy: {
-		type: Boolean,
-		required: false,
-		default: void 0
-	},
-	portal: {
-		required: true,
-		default: void 0
-	},
-	ready: {
-		type: Boolean,
-		required: true,
-		default: void 0
-	},
-	offsetX: {
-		type: Number,
-		required: true,
-		default: void 0
-	},
-	offsetY: {
-		type: Number,
-		required: true,
-		default: void 0
-	},
-	offsetR: {
-		type: Number,
-		required: true,
-		default: void 0
-	},
-	offsetB: {
-		type: Number,
-		required: true,
-		default: void 0
-	},
-	onAlign: {
-		required: true,
-		default: void 0
-	},
-	onPrepare: {
-		type: Function,
-		required: true,
-		default: void 0
-	},
-	stretch: {
-		type: String,
-		required: false,
-		default: void 0
-	},
-	targetWidth: {
-		type: Number,
-		required: false,
-		default: void 0
-	},
-	targetHeight: {
-		type: Number,
-		required: false,
-		default: void 0
-	},
-	onResize: {
-		required: false,
-		default: void 0
-	},
-	mobile: {
-		type: Object,
-		required: false,
-		default: void 0
-	}
-}, { autoDestroy: true }) });
-var Popup_default = Popup;
-exports.default = Popup_default;

package/dist/UniqueProvider/UniqueContainer.cjs

@@ -1,134 +0,0 @@
-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");
-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 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;
-	});
-	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;
-		const sizeStyle = {};
-		if (popupSize) {
-			sizeStyle.width = `${popupSize.width}px`;
-			sizeStyle.height = `${popupSize.height}px`;
-		}
-		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,
-			onAfterEnter: (element) => {
-				motionVisible.value = true;
-				baseTransitionProps.onAfterEnter?.(element);
-			},
-			onAfterLeave: (element) => {
-				motionVisible.value = false;
-				baseTransitionProps.onAfterLeave?.(element);
-			}
-		}, { default: () => [(0, vue.withDirectives)((0, vue.createVNode)("div", {
-			"class": [
-				containerCls,
-				uniqueContainerClassName,
-				{
-					[`${containerCls}-visible`]: motionVisible.value,
-					[`${containerCls}-hidden`]: !open.value
-				}
-			],
-			"style": [
-				{
-					"--arrow-x": `${arrowPos?.x || 0}px`,
-					"--arrow-y": `${arrowPos?.y || 0}px`
-				},
-				mergedOffsetStyle.value,
-				sizeStyle,
-				uniqueContainerStyle
-			]
-		}, null), [[vue.vShow, open.value]])] });
-	};
-}, { props: {
-	prefixCls: {
-		type: String,
-		required: true,
-		default: void 0
-	},
-	isMobile: {
-		type: Boolean,
-		required: true,
-		default: void 0
-	},
-	ready: {
-		type: Boolean,
-		required: true,
-		default: void 0
-	},
-	open: {
-		type: Boolean,
-		required: true,
-		default: void 0
-	},
-	align: {
-		type: Object,
-		required: true,
-		default: void 0
-	},
-	offsetR: {
-		type: Number,
-		required: true,
-		default: void 0
-	},
-	offsetB: {
-		type: Number,
-		required: true,
-		default: void 0
-	},
-	offsetX: {
-		type: Number,
-		required: true,
-		default: void 0
-	},
-	offsetY: {
-		type: Number,
-		required: true,
-		default: void 0
-	},
-	arrowPos: {
-		type: Object,
-		required: false,
-		default: void 0
-	},
-	popupSize: {
-		type: Object,
-		required: false,
-		default: void 0
-	},
-	motion: {
-		type: Object,
-		required: false,
-		default: void 0
-	},
-	uniqueContainerClassName: {
-		type: String,
-		required: false,
-		default: void 0
-	},
-	uniqueContainerStyle: {
-		type: Object,
-		required: false,
-		default: void 0
-	}
-} });
-var UniqueContainer_default = UniqueContainer;
-exports.default = UniqueContainer_default;