@v-c/select 1.0.8 → 1.0.9

package/dist/BaseSelect/index.cjs

@@ -115,7 +115,7 @@ const BaseSelect = /* @__PURE__ */ (0, vue.defineComponent)((props, { expose, at
 		return props.notFoundContent ?? "Not Found";
 	});
 	const emptyListContent = (0, vue.computed)(() => !props?.notFoundContent && props.emptyOptions);
-	const [mergedOpen, triggerOpen] = require_useOpen.default(open, (openVal) => {
+	const [mergedOpen, triggerOpen, lockOptions] = require_useOpen.default(open, (openVal) => {
 		props.onPopupVisibleChange?.(openVal);
 	}, (nextOpen) => {
 		return props.disabled || emptyListContent.value ? false : nextOpen;
@@ -202,6 +202,9 @@ const BaseSelect = /* @__PURE__ */ (0, vue.defineComponent)((props, { expose, at
 	const onInputBlur = () => {
 		keyLockRef.value = false;
 	};
+	const getSelectElements = () => [(0, _v_c_util_dist_Dom_findDOMNode.getDOM)(containerRef), triggerRef.value?.getPopupElement?.()];
+	require_useSelectTriggerControl.default(getSelectElements, mergedOpen, triggerOpen, (0, vue.computed)(() => !!mergedComponents.value.root));
+	const internalMouseDownRef = (0, vue.shallowRef)(false);
 	const onInternalFocus = (event) => {
 		focused.value = true;
 		if (!disabled.value) {
@@ -209,27 +212,31 @@ const BaseSelect = /* @__PURE__ */ (0, vue.defineComponent)((props, { expose, at
 			props?.onFocus?.(event);
 		}
 	};
+	const onRootBlur = () => {
+		if (mergedOpen.value && !internalMouseDownRef.value) triggerOpen(false, { cancelFun: () => require_useSelectTriggerControl.isInside(getSelectElements(), document.activeElement) });
+	};
 	const onInternalBlur = (event) => {
 		focused.value = false;
 		if (mergedSearchValue.value) {
 			if (mode.value === "tags") props?.onSearch?.(mergedSearchValue.value, { source: "submit" });
 			else if (mode.value === "multiple") props?.onSearch?.("", { source: "blur" });
 		}
-		if (!disabled.value) {
-			triggerOpen(false, { lazy: true });
-			props?.onBlur?.(event);
-		}
+		onRootBlur();
+		if (!disabled.value) props?.onBlur?.(event);
 	};
 	const onInternalMouseDown = (event) => {
 		const { target } = event;
-		if ((triggerRef?.value?.getPopupElement?.())?.contains?.(target) && triggerOpen) triggerOpen(true, { ignoreNext: true });
+		if ((triggerRef?.value?.getPopupElement?.())?.contains?.(target) && triggerOpen) triggerOpen(true);
 		props?.onMouseDown?.(event);
+		internalMouseDownRef.value = true;
+		require_useOpen.macroTask(() => {
+			internalMouseDownRef.value = false;
+		});
 	};
 	const forceState = (0, vue.shallowRef)({});
 	function onPopupMouseEnter() {
 		forceState.value = {};
 	}
-	require_useSelectTriggerControl.default(() => [(0, _v_c_util_dist_Dom_findDOMNode.getDOM)(containerRef), triggerRef.value?.getPopupElement?.()], mergedOpen, triggerOpen, (0, vue.computed)(() => !!mergedComponents.value.root));
 	require_useBaseProps.useBaseSelectProvider((0, vue.computed)(() => {
 		return {
 			...props,
@@ -237,7 +244,8 @@ const BaseSelect = /* @__PURE__ */ (0, vue.defineComponent)((props, { expose, at
 			open: mergedOpen.value,
 			triggerOpen: mergedOpen.value,
 			toggleOpen: triggerOpen,
-			multiple: multiple.value
+			multiple: multiple.value,
+			lockOptions: lockOptions.value
 		};
 	}));
 	const onClearMouseDown = () => {
@@ -334,7 +342,8 @@ const BaseSelect = /* @__PURE__ */ (0, vue.defineComponent)((props, { expose, at
 			"empty": emptyOptions,
 			"onPopupVisibleChange": onTriggerVisibleChange,
 			"onPopupMouseEnter": onPopupMouseEnter,
-			"onPopupMouseDown": onInternalMouseDown
+			"onPopupMouseDown": onInternalMouseDown,
+			"onPopupBlur": onRootBlur
 		}, _isSlot(renderNode) ? renderNode : { default: () => [_renderNode] });
 		return (0, vue.createVNode)(vue.Fragment, null, [(0, vue.createVNode)(require_Polite.default, {
 			"visible": focused.value && !mergedOpen.value,

package/dist/BaseSelect/index.js

@@ -3,8 +3,8 @@ import { getSeparatedContent, isValidCount } from "../utils/valueUtil.js";
 import { useAllowClear } from "../hooks/useAllowClear.js";
 import useComponents from "../hooks/useComponents.js";
 import useLock from "../hooks/useLock.js";
-import useOpen from "../hooks/useOpen.js";
-import useSelectTriggerControl from "../hooks/useSelectTriggerControl.js";
+import useOpen, { macroTask } from "../hooks/useOpen.js";
+import useSelectTriggerControl, { isInside } from "../hooks/useSelectTriggerControl.js";
 import "../hooks/index.js";
 import SelectInput_default from "../SelectInput/index.js";
 import SelectTrigger_default from "../SelectTrigger.js";
@@ -107,7 +107,7 @@ const BaseSelect = /* @__PURE__ */ defineComponent((props, { expose, attrs }) =>
 		return props.notFoundContent ?? "Not Found";
 	});
 	const emptyListContent = computed(() => !props?.notFoundContent && props.emptyOptions);
-	const [mergedOpen, triggerOpen] = useOpen(open, (openVal) => {
+	const [mergedOpen, triggerOpen, lockOptions] = useOpen(open, (openVal) => {
 		props.onPopupVisibleChange?.(openVal);
 	}, (nextOpen) => {
 		return props.disabled || emptyListContent.value ? false : nextOpen;
@@ -194,6 +194,9 @@ const BaseSelect = /* @__PURE__ */ defineComponent((props, { expose, attrs }) =>
 	const onInputBlur = () => {
 		keyLockRef.value = false;
 	};
+	const getSelectElements = () => [getDOM(containerRef), triggerRef.value?.getPopupElement?.()];
+	useSelectTriggerControl(getSelectElements, mergedOpen, triggerOpen, computed(() => !!mergedComponents.value.root));
+	const internalMouseDownRef = shallowRef(false);
 	const onInternalFocus = (event) => {
 		focused.value = true;
 		if (!disabled.value) {
@@ -201,27 +204,31 @@ const BaseSelect = /* @__PURE__ */ defineComponent((props, { expose, attrs }) =>
 			props?.onFocus?.(event);
 		}
 	};
+	const onRootBlur = () => {
+		if (mergedOpen.value && !internalMouseDownRef.value) triggerOpen(false, { cancelFun: () => isInside(getSelectElements(), document.activeElement) });
+	};
 	const onInternalBlur = (event) => {
 		focused.value = false;
 		if (mergedSearchValue.value) {
 			if (mode.value === "tags") props?.onSearch?.(mergedSearchValue.value, { source: "submit" });
 			else if (mode.value === "multiple") props?.onSearch?.("", { source: "blur" });
 		}
-		if (!disabled.value) {
-			triggerOpen(false, { lazy: true });
-			props?.onBlur?.(event);
-		}
+		onRootBlur();
+		if (!disabled.value) props?.onBlur?.(event);
 	};
 	const onInternalMouseDown = (event) => {
 		const { target } = event;
-		if ((triggerRef?.value?.getPopupElement?.())?.contains?.(target) && triggerOpen) triggerOpen(true, { ignoreNext: true });
+		if ((triggerRef?.value?.getPopupElement?.())?.contains?.(target) && triggerOpen) triggerOpen(true);
 		props?.onMouseDown?.(event);
+		internalMouseDownRef.value = true;
+		macroTask(() => {
+			internalMouseDownRef.value = false;
+		});
 	};
 	const forceState = shallowRef({});
 	function onPopupMouseEnter() {
 		forceState.value = {};
 	}
-	useSelectTriggerControl(() => [getDOM(containerRef), triggerRef.value?.getPopupElement?.()], mergedOpen, triggerOpen, computed(() => !!mergedComponents.value.root));
 	useBaseSelectProvider(computed(() => {
 		return {
 			...props,
@@ -229,7 +236,8 @@ const BaseSelect = /* @__PURE__ */ defineComponent((props, { expose, attrs }) =>
 			open: mergedOpen.value,
 			triggerOpen: mergedOpen.value,
 			toggleOpen: triggerOpen,
-			multiple: multiple.value
+			multiple: multiple.value,
+			lockOptions: lockOptions.value
 		};
 	}));
 	const onClearMouseDown = () => {
@@ -326,7 +334,8 @@ const BaseSelect = /* @__PURE__ */ defineComponent((props, { expose, attrs }) =>
 			"empty": emptyOptions,
 			"onPopupVisibleChange": onTriggerVisibleChange,
 			"onPopupMouseEnter": onPopupMouseEnter,
-			"onPopupMouseDown": onInternalMouseDown
+			"onPopupMouseDown": onInternalMouseDown,
+			"onPopupBlur": onRootBlur
 		}, _isSlot(renderNode) ? renderNode : { default: () => [_renderNode] });
 		return createVNode(Fragment, null, [createVNode(Polite_default, {
 			"visible": focused.value && !mergedOpen.value,

package/dist/SelectInput/Content/SingleContent.cjs

@@ -25,7 +25,7 @@ var SingleContent = /* @__PURE__ */ (0, vue.defineComponent)((props, { expose })
 	const optionProps = (0, vue.computed)(() => {
 		let restProps = {
 			class: `${selectInputContext.value?.prefixCls}-content-value`,
-			style: { visibility: mergedSearchValue.value ? "hidden" : "visible" }
+			style: mergedSearchValue.value ? { visibility: "hidden" } : {}
 		};
 		if (displayValue.value && selectContext.value?.flattenOptions) {
 			const option = selectContext.value.flattenOptions.find((opt) => opt.value === displayValue.value?.value);

package/dist/SelectInput/Content/SingleContent.js

@@ -20,7 +20,7 @@ var SingleContent_default = /* @__PURE__ */ defineComponent((props, { expose })
 	const optionProps = computed(() => {
 		let restProps = {
 			class: `${selectInputContext.value?.prefixCls}-content-value`,
-			style: { visibility: mergedSearchValue.value ? "hidden" : "visible" }
+			style: mergedSearchValue.value ? { visibility: "hidden" } : {}
 		};
 		if (displayValue.value && selectContext.value?.flattenOptions) {
 			const option = selectContext.value.flattenOptions.find((opt) => opt.value === displayValue.value?.value);

package/dist/SelectInput/index.cjs

@@ -64,7 +64,7 @@ var SelectInput = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, expo
 			_v_c_util_dist_KeyCode.default.LEFT,
 			_v_c_util_dist_KeyCode.default.RIGHT
 		].includes(keyCode)) return;
-		if (require_keyUtil.isValidateOpenKey(keyCode)) toggleOpen.value?.(true);
+		if (!(event.ctrlKey || event.altKey || event.metaKey) && require_keyUtil.isValidateOpenKey(keyCode)) toggleOpen.value?.(true);
 	};
 	expose({
 		focus: (options) => {
@@ -77,7 +77,9 @@ var SelectInput = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, expo
 	});
 	const onInternalMouseDown = (event) => {
 		if (!disabled.value) {
-			if (event.target !== (0, _v_c_util_dist_Dom_findDOMNode.getDOM)(inputRef.value?.input)) event.preventDefault();
+			const inputDOM = (0, _v_c_util_dist_Dom_findDOMNode.getDOM)(inputRef.value?.input);
+			event._ori_target = inputDOM;
+			if (inputDOM && event.target !== inputDOM && !inputDOM.contains(event.target)) event.preventDefault();
 			const shouldPreventClose = triggerOpen.value && !multiple.value && (mode.value === "combobox" || showSearch.value);
 			if (!event._select_lazy) {
 				inputRef.value?.input?.focus();
@@ -86,10 +88,6 @@ var SelectInput = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, expo
 		}
 		props?.onMouseDown?.(event);
 	};
-	const onInternalBlur = (event) => {
-		toggleOpen.value?.(false);
-		props?.onBlur?.(event);
-	};
 	require_context.useSelectInputProvider((0, vue.computed)(() => ({
 		...props,
 		onInputKeyDown: onInternalInputKeyDown
@@ -121,7 +119,7 @@ var SelectInput = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, expo
 			"onKeydown": props.onKeyDown,
 			"onKeyup": props.onKeyUp,
 			"onFocusin": props.onFocus,
-			"onFocusout": onInternalBlur
+			"onFocusout": props.onBlur
 		}), [
 			(0, vue.createVNode)(require_Affix.default, {
 				"class": (0, _v_c_util.clsx)(`${prefixCls.value}-prefix`, classNamesConfig.value?.prefix),

package/dist/SelectInput/index.js

@@ -57,7 +57,7 @@ var SelectInput_default = /* @__PURE__ */ defineComponent((props, { attrs, expos
 			KeyCode.LEFT,
 			KeyCode.RIGHT
 		].includes(keyCode)) return;
-		if (isValidateOpenKey(keyCode)) toggleOpen.value?.(true);
+		if (!(event.ctrlKey || event.altKey || event.metaKey) && isValidateOpenKey(keyCode)) toggleOpen.value?.(true);
 	};
 	expose({
 		focus: (options) => {
@@ -70,7 +70,9 @@ var SelectInput_default = /* @__PURE__ */ defineComponent((props, { attrs, expos
 	});
 	const onInternalMouseDown = (event) => {
 		if (!disabled.value) {
-			if (event.target !== getDOM(inputRef.value?.input)) event.preventDefault();
+			const inputDOM = getDOM(inputRef.value?.input);
+			event._ori_target = inputDOM;
+			if (inputDOM && event.target !== inputDOM && !inputDOM.contains(event.target)) event.preventDefault();
 			const shouldPreventClose = triggerOpen.value && !multiple.value && (mode.value === "combobox" || showSearch.value);
 			if (!event._select_lazy) {
 				inputRef.value?.input?.focus();
@@ -79,10 +81,6 @@ var SelectInput_default = /* @__PURE__ */ defineComponent((props, { attrs, expos
 		}
 		props?.onMouseDown?.(event);
 	};
-	const onInternalBlur = (event) => {
-		toggleOpen.value?.(false);
-		props?.onBlur?.(event);
-	};
 	useSelectInputProvider(computed(() => ({
 		...props,
 		onInputKeyDown: onInternalInputKeyDown
@@ -114,7 +112,7 @@ var SelectInput_default = /* @__PURE__ */ defineComponent((props, { attrs, expos
 			"onKeydown": props.onKeyDown,
 			"onKeyup": props.onKeyUp,
 			"onFocusin": props.onFocus,
-			"onFocusout": onInternalBlur
+			"onFocusout": props.onBlur
 		}), [
 			createVNode(Affix_default, {
 				"class": clsx(`${prefixCls.value}-prefix`, classNamesConfig.value?.prefix),

package/dist/SelectTrigger.cjs

@@ -60,7 +60,7 @@ var SelectTrigger = /* @__PURE__ */ (0, vue.defineComponent)((props, { slots, at
 	const triggerPopupRef = (0, vue.shallowRef)();
 	expose({ getPopupElement: () => triggerPopupRef.value?.popupElement });
 	return () => {
-		const { prefixCls, popupElement, popupRender, animation, transitionName, popupStyle, popupMatchSelectWidth, onPopupVisibleChange, placement, direction = "ltr", builtinPlacements, onPopupMouseEnter, onPopupMouseDown, popupAlign, visible, getPopupContainer, popupClassName, empty, ...restProps } = props;
+		const { prefixCls, popupElement, popupRender, animation, transitionName, popupStyle, popupMatchSelectWidth, onPopupVisibleChange, placement, direction = "ltr", builtinPlacements, onPopupMouseEnter, onPopupMouseDown, onPopupBlur, popupAlign, visible, getPopupContainer, popupClassName, empty, ...restProps } = props;
 		let popupNode = popupElement;
 		if (popupRender) popupNode = popupRender(popupElement);
 		const popupPrefixCls = `${prefixCls}-dropdown`;
@@ -74,8 +74,9 @@ var SelectTrigger = /* @__PURE__ */ (0, vue.defineComponent)((props, { slots, at
 			"builtinPlacements": mergedBuiltinPlacements.value,
 			"prefixCls": popupPrefixCls,
 			"popup": (0, vue.createVNode)("div", {
+				"onMouseenter": onPopupMouseEnter,
 				"onMousedown": onPopupMouseDown,
-				"onMouseenter": onPopupMouseEnter
+				"onBlur": onPopupBlur
 			}, [popupNode]),
 			"ref": triggerPopupRef,
 			"stretch": stretch.value,
@@ -183,6 +184,11 @@ var SelectTrigger = /* @__PURE__ */ (0, vue.defineComponent)((props, { slots, at
 			type: Function,
 			required: true,
 			default: void 0
+		},
+		onPopupBlur: {
+			type: Function,
+			required: false,
+			default: void 0
 		}
 	}, { direction: "ltr" }),
 	name: "SelectTrigger",

package/dist/SelectTrigger.d.ts

@@ -21,6 +21,7 @@ export interface SelectTriggerProps {
     onPopupVisibleChange?: ((visible: boolean) => void) | null;
     onPopupMouseEnter: () => void;
     onPopupMouseDown: (event: MouseEvent) => void;
+    onPopupBlur?: (event: FocusEvent) => void;
 }
 declare const SelectTrigger: import('vue').DefineSetupFnComponent<SelectTriggerProps, {}, {}, SelectTriggerProps & {}, import('vue').PublicProps>;
 export default SelectTrigger;

package/dist/SelectTrigger.js

@@ -54,7 +54,7 @@ var SelectTrigger_default = /* @__PURE__ */ defineComponent((props, { slots, att
 	const triggerPopupRef = shallowRef();
 	expose({ getPopupElement: () => triggerPopupRef.value?.popupElement });
 	return () => {
-		const { prefixCls, popupElement, popupRender, animation, transitionName, popupStyle, popupMatchSelectWidth, onPopupVisibleChange, placement, direction = "ltr", builtinPlacements, onPopupMouseEnter, onPopupMouseDown, popupAlign, visible, getPopupContainer, popupClassName, empty, ...restProps } = props;
+		const { prefixCls, popupElement, popupRender, animation, transitionName, popupStyle, popupMatchSelectWidth, onPopupVisibleChange, placement, direction = "ltr", builtinPlacements, onPopupMouseEnter, onPopupMouseDown, onPopupBlur, popupAlign, visible, getPopupContainer, popupClassName, empty, ...restProps } = props;
 		let popupNode = popupElement;
 		if (popupRender) popupNode = popupRender(popupElement);
 		const popupPrefixCls = `${prefixCls}-dropdown`;
@@ -68,8 +68,9 @@ var SelectTrigger_default = /* @__PURE__ */ defineComponent((props, { slots, att
 			"builtinPlacements": mergedBuiltinPlacements.value,
 			"prefixCls": popupPrefixCls,
 			"popup": createVNode("div", {
+				"onMouseenter": onPopupMouseEnter,
 				"onMousedown": onPopupMouseDown,
-				"onMouseenter": onPopupMouseEnter
+				"onBlur": onPopupBlur
 			}, [popupNode]),
 			"ref": triggerPopupRef,
 			"stretch": stretch.value,
@@ -177,6 +178,11 @@ var SelectTrigger_default = /* @__PURE__ */ defineComponent((props, { slots, att
 			type: Function,
 			required: true,
 			default: void 0
+		},
+		onPopupBlur: {
+			type: Function,
+			required: false,
+			default: void 0
 		}
 	}, { direction: "ltr" }),
 	name: "SelectTrigger",

package/dist/hooks/useBaseProps.d.ts

@@ -5,6 +5,7 @@ export interface BaseSelectContextProps extends BaseSelectProps {
     multiple: boolean;
     toggleOpen: (open?: boolean) => void;
     role?: string;
+    lockOptions: boolean;
 }
 export declare function useBaseSelectProvider(context: Ref<BaseSelectContextProps>): void;
 export default function useBaseProps(): Ref<BaseSelectContextProps | null>;

package/dist/hooks/useOpen.cjs

@@ -27,36 +27,37 @@ function useOpen(propOpen, onOpen, postOpen) {
 	(0, vue.watch)(propOpen, () => {
 		stateOpen.value = propOpen.value;
 	});
+	const lock = (0, vue.shallowRef)(false);
 	const ssrSafeOpen = (0, vue.computed)(() => rendered.value ? stateOpen.value : false);
 	const mergedOpen = (0, vue.computed)(() => postOpen(ssrSafeOpen.value));
 	const taskIdRef = (0, vue.shallowRef)(0);
-	const taskLockRef = (0, vue.shallowRef)(false);
 	const triggerEvent = (nextOpen) => {
 		if (onOpen && mergedOpen.value !== nextOpen) onOpen(nextOpen);
 		if (propOpen.value !== void 0) return;
 		stateOpen.value = nextOpen;
 	};
 	const toggleOpen = (nextOpen, config = {}) => {
-		const { ignoreNext = false, lazy = false } = config;
+		const { cancelFun } = config;
 		taskIdRef.value += 1;
 		const id = taskIdRef.value;
 		const nextOpenVal = typeof nextOpen === "boolean" ? nextOpen : !mergedOpen.value;
-		if (nextOpenVal !== lazy) {
-			if (!taskLockRef.value) {
+		lock.value = !nextOpenVal;
+		function triggerUpdate() {
+			if (id === taskIdRef.value && !cancelFun?.()) {
 				triggerEvent(nextOpenVal);
-				if (ignoreNext) {
-					taskLockRef.value = ignoreNext;
-					macroTask(() => {
-						taskLockRef.value = false;
-					}, 2);
-				}
+				lock.value = false;
 			}
-			return;
 		}
-		macroTask(() => {
-			if (id === taskIdRef.value && !taskLockRef.value) triggerEvent(nextOpenVal);
+		if (nextOpenVal) triggerUpdate();
+		else macroTask(() => {
+			triggerUpdate();
 		});
 	};
-	return [mergedOpen, toggleOpen];
+	return [
+		mergedOpen,
+		toggleOpen,
+		lock
+	];
 }
 exports.default = useOpen;
+exports.macroTask = macroTask;

package/dist/hooks/useOpen.d.ts

@@ -1,11 +1,11 @@
 import { Ref } from 'vue';
+export declare function macroTask(fn: VoidFunction, times?: number): void;
 /**
  * Trigger by latest open call, if nextOpen is undefined, means toggle.
  * ignoreNext will skip next call in the macro task queue.
  */
 export type TriggerOpenType = (nextOpen?: boolean, config?: {
-    ignoreNext?: boolean;
-    lazy?: boolean;
+    cancelFun?: () => boolean;
 }) => void;
 /**
  * When `open` is controlled, follow the controlled value;
@@ -16,4 +16,4 @@ export type TriggerOpenType = (nextOpen?: boolean, config?: {
  * SSR handling: During SSR, `open` is always false to avoid Portal issues.
  * On client-side hydration, it syncs with the actual open state.
  */
-export default function useOpen(propOpen: Ref<boolean>, onOpen: (nextOpen: boolean) => void, postOpen: (nextOpen: boolean) => boolean): readonly [import('vue').ComputedRef<boolean>, TriggerOpenType];
+export default function useOpen(propOpen: Ref<boolean>, onOpen: (nextOpen: boolean) => void, postOpen: (nextOpen: boolean) => boolean): readonly [import('vue').ComputedRef<boolean>, TriggerOpenType, import('vue').ShallowRef<boolean, boolean>];

package/dist/hooks/useOpen.js

@@ -22,36 +22,36 @@ function useOpen(propOpen, onOpen, postOpen) {
 	watch(propOpen, () => {
 		stateOpen.value = propOpen.value;
 	});
+	const lock = shallowRef(false);
 	const ssrSafeOpen = computed(() => rendered.value ? stateOpen.value : false);
 	const mergedOpen = computed(() => postOpen(ssrSafeOpen.value));
 	const taskIdRef = shallowRef(0);
-	const taskLockRef = shallowRef(false);
 	const triggerEvent = (nextOpen) => {
 		if (onOpen && mergedOpen.value !== nextOpen) onOpen(nextOpen);
 		if (propOpen.value !== void 0) return;
 		stateOpen.value = nextOpen;
 	};
 	const toggleOpen = (nextOpen, config = {}) => {
-		const { ignoreNext = false, lazy = false } = config;
+		const { cancelFun } = config;
 		taskIdRef.value += 1;
 		const id = taskIdRef.value;
 		const nextOpenVal = typeof nextOpen === "boolean" ? nextOpen : !mergedOpen.value;
-		if (nextOpenVal !== lazy) {
-			if (!taskLockRef.value) {
+		lock.value = !nextOpenVal;
+		function triggerUpdate() {
+			if (id === taskIdRef.value && !cancelFun?.()) {
 				triggerEvent(nextOpenVal);
-				if (ignoreNext) {
-					taskLockRef.value = ignoreNext;
-					macroTask(() => {
-						taskLockRef.value = false;
-					}, 2);
-				}
+				lock.value = false;
 			}
-			return;
 		}
-		macroTask(() => {
-			if (id === taskIdRef.value && !taskLockRef.value) triggerEvent(nextOpenVal);
+		if (nextOpenVal) triggerUpdate();
+		else macroTask(() => {
+			triggerUpdate();
 		});
 	};
-	return [mergedOpen, toggleOpen];
+	return [
+		mergedOpen,
+		toggleOpen,
+		lock
+	];
 }
-export { useOpen as default };
+export { useOpen as default, macroTask };

package/dist/hooks/useSelectTriggerControl.cjs

@@ -4,12 +4,16 @@ Object.defineProperties(exports, {
 });
 const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
 let vue = require("vue");
+function isInside(elements, target) {
+	return elements.filter((element) => element).some((element) => element.contains(target) || element === target);
+}
 function useSelectTriggerControl(elements, open, triggerOpen, customizedTrigger) {
 	const onGlobalMouseDown = (event) => {
 		if (customizedTrigger.value) return;
 		let target = event.target;
 		if (target.shadowRoot && event.composed) target = event.composedPath()[0] || target;
-		if (open.value && elements().filter((element) => element).every((element) => !element.contains(target) && element !== target)) triggerOpen(false);
+		if (event._ori_target) target = event._ori_target;
+		if (open.value && !isInside(elements(), target)) triggerOpen(false);
 	};
 	(0, vue.onMounted)(() => {
 		window.addEventListener("mousedown", onGlobalMouseDown);
@@ -19,3 +23,4 @@ function useSelectTriggerControl(elements, open, triggerOpen, customizedTrigger)
 	});
 }
 exports.default = useSelectTriggerControl;
+exports.isInside = isInside;

package/dist/hooks/useSelectTriggerControl.d.ts

@@ -1,2 +1,4 @@
 import { Ref } from 'vue';
-export default function useSelectTriggerControl(elements: () => (HTMLElement | SVGElement | undefined)[], open: Ref<boolean>, triggerOpen: (open: boolean) => void, customizedTrigger: Ref<boolean>): void;
+import { TriggerOpenType } from './useOpen';
+export declare function isInside(elements: (HTMLElement | SVGElement | undefined)[], target: HTMLElement): boolean;
+export default function useSelectTriggerControl(elements: () => (HTMLElement | SVGElement | undefined)[], open: Ref<boolean>, triggerOpen: TriggerOpenType, customizedTrigger: Ref<boolean>): void;

package/dist/hooks/useSelectTriggerControl.js

@@ -1,10 +1,14 @@
 import { onMounted, onUnmounted } from "vue";
+function isInside(elements, target) {
+	return elements.filter((element) => element).some((element) => element.contains(target) || element === target);
+}
 function useSelectTriggerControl(elements, open, triggerOpen, customizedTrigger) {
 	const onGlobalMouseDown = (event) => {
 		if (customizedTrigger.value) return;
 		let target = event.target;
 		if (target.shadowRoot && event.composed) target = event.composedPath()[0] || target;
-		if (open.value && elements().filter((element) => element).every((element) => !element.contains(target) && element !== target)) triggerOpen(false);
+		if (event._ori_target) target = event._ori_target;
+		if (open.value && !isInside(elements(), target)) triggerOpen(false);
 	};
 	onMounted(() => {
 		window.addEventListener("mousedown", onGlobalMouseDown);
@@ -13,4 +17,4 @@ function useSelectTriggerControl(elements, open, triggerOpen, customizedTrigger)
 		});
 	});
 }
-export { useSelectTriggerControl as default };
+export { useSelectTriggerControl as default, isInside };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@v-c/select",
   "type": "module",
-  "version": "1.0.8",
+  "version": "1.0.9",
   "description": "",
   "author": "",
   "license": "MIT",
@@ -29,10 +29,10 @@
     "vue": "^3.0.0"
   },
   "dependencies": {
-    "@v-c/overflow": "^1.0.1",
-    "@v-c/trigger": "^1.0.5",
-    "@v-c/util": "^1.0.8",
-    "@v-c/virtual-list": "^1.0.4"
+    "@v-c/overflow": "^1.0.3",
+    "@v-c/trigger": "^1.0.6",
+    "@v-c/util": "^1.0.9",
+    "@v-c/virtual-list": "^1.0.5"
   },
   "scripts": {
     "build": "vite build",