naive-ui 2.30.3 → 2.30.4

package/lib/_internal/select-menu/src/SelectMenu.d.ts

@@ -1,7 +1,7 @@
 import { PropType } from 'vue';
 import { TreeNode } from 'treemate';
 import type { SelectOption, SelectGroupOption, SelectIgnoredOption, Value, SelectTreeMate } from '../../../select/src/interface';
-import type { RenderLabel, Size, RenderOption } from './interface';
+import type { RenderLabel, Size, RenderOption, NodeProps } from './interface';
 declare const _default: import("vue").DefineComponent<{
     clsPrefix: {
         type: StringConstructor;
@@ -24,7 +24,6 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<Value | null>;
         default: null;
     };
-    width: (StringConstructor | NumberConstructor)[];
     autoPending: BooleanConstructor;
     virtualScroll: {
         type: BooleanConstructor;
@@ -46,6 +45,7 @@ declare const _default: import("vue").DefineComponent<{
     focusable: BooleanConstructor;
     renderLabel: PropType<RenderLabel>;
     renderOption: PropType<RenderOption>;
+    nodeProps: PropType<NodeProps>;
     showCheckmark: {
         type: BooleanConstructor;
         default: boolean;
@@ -483,7 +483,6 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<Value | null>;
         default: null;
     };
-    width: (StringConstructor | NumberConstructor)[];
     autoPending: BooleanConstructor;
     virtualScroll: {
         type: BooleanConstructor;
@@ -505,6 +504,7 @@ declare const _default: import("vue").DefineComponent<{
     focusable: BooleanConstructor;
     renderLabel: PropType<RenderLabel>;
     renderOption: PropType<RenderOption>;
+    nodeProps: PropType<NodeProps>;
     showCheckmark: {
         type: BooleanConstructor;
         default: boolean;

package/lib/_internal/select-menu/src/SelectMenu.js

@@ -36,7 +36,7 @@ exports.default = (0, vue_1.defineComponent)({
         }, value: {
             type: [String, Number, Array],
             default: null
-        }, width: [Number, String], autoPending: Boolean, virtualScroll: {
+        }, autoPending: Boolean, virtualScroll: {
             type: Boolean,
             default: true
         }, 
@@ -50,7 +50,7 @@ exports.default = (0, vue_1.defineComponent)({
         }, valueField: {
             type: String,
             default: 'value'
-        }, loading: Boolean, focusable: Boolean, renderLabel: Function, renderOption: Function, showCheckmark: { type: Boolean, default: true }, onMousedown: Function, onScroll: Function, onFocus: Function, onBlur: Function, onKeyup: Function, onKeydown: Function, onTabOut: Function, onMouseenter: Function, onMouseleave: Function, onResize: Function, resetMenuOnOptionsChange: {
+        }, loading: Boolean, focusable: Boolean, renderLabel: Function, renderOption: Function, nodeProps: Function, showCheckmark: { type: Boolean, default: true }, onMousedown: Function, onScroll: Function, onFocus: Function, onBlur: Function, onKeyup: Function, onKeydown: Function, onTabOut: Function, onMouseenter: Function, onMouseleave: Function, onResize: Function, resetMenuOnOptionsChange: {
             type: Boolean,
             default: true
         }, inlineThemeDisabled: Boolean, 
@@ -247,12 +247,13 @@ exports.default = (0, vue_1.defineComponent)({
             handleOptionMouseEnter,
             handleOptionClick,
             valueSetRef,
+            pendingTmNodeRef: pendingNodeRef,
+            nodePropsRef: (0, vue_1.toRef)(props, 'nodeProps'),
             showCheckmarkRef: (0, vue_1.toRef)(props, 'showCheckmark'),
             multipleRef: (0, vue_1.toRef)(props, 'multiple'),
             valueRef: (0, vue_1.toRef)(props, 'value'),
             renderLabelRef: (0, vue_1.toRef)(props, 'renderLabel'),
             renderOptionRef: (0, vue_1.toRef)(props, 'renderOption'),
-            pendingTmNodeRef: pendingNodeRef,
             labelFieldRef: (0, vue_1.toRef)(props, 'labelField'),
             valueFieldRef: (0, vue_1.toRef)(props, 'valueField')
         });
@@ -327,10 +328,7 @@ exports.default = (0, vue_1.defineComponent)({
                 `${clsPrefix}-base-select-menu`,
                 themeClass,
                 this.multiple && `${clsPrefix}-base-select-menu--multiple`
-            ], style: [
-                { width: (0, _utils_1.formatLength)(this.width) },
-                this.cssVars
-            ], onFocusin: this.handleFocusin, onFocusout: this.handleFocusout, onKeyup: this.handleKeyUp, onKeydown: this.handleKeyDown, onMousedown: this.handleMouseDown, onMouseenter: this.onMouseenter, onMouseleave: this.onMouseleave },
+            ], style: this.cssVars, onFocusin: this.handleFocusin, onFocusout: this.handleFocusout, onKeyup: this.handleKeyUp, onKeydown: this.handleKeyDown, onMousedown: this.handleMouseDown, onMouseenter: this.onMouseenter, onMouseleave: this.onMouseleave },
             this.loading ? ((0, vue_1.h)("div", { class: `${clsPrefix}-base-select-menu__loading` },
                 (0, vue_1.h)(loading_1.default, { clsPrefix: clsPrefix, strokeWidth: 20 }))) : !this.empty ? ((0, vue_1.h)(scrollbar_1.NScrollbar, { ref: "scrollbarRef", theme: mergedTheme.peers.Scrollbar, themeOverrides: mergedTheme.peerOverrides.Scrollbar, scrollable: this.scrollable, container: virtualScroll ? this.virtualListContainer : undefined, content: virtualScroll ? this.virtualListContent : undefined, onScroll: virtualScroll ? undefined : this.doScroll }, {
                 default: () => {

package/lib/_internal/select-menu/src/SelectOption.d.ts

@@ -15,6 +15,7 @@ declare const _default: import("vue").DefineComponent<{
     multiple: Ref<boolean>;
     isGrouped: import("vue").ComputedRef<boolean | null>;
     showCheckmark: Ref<boolean>;
+    nodeProps: Ref<import("./interface").NodeProps | undefined>;
     isPending: import("vue").ComputedRef<boolean>;
     isSelected: import("vue").ComputedRef<boolean>;
     labelField: Ref<string>;

package/lib/_internal/select-menu/src/SelectOption.js

@@ -27,7 +27,7 @@ exports.default = (0, vue_1.defineComponent)({
         }
     },
     setup(props) {
-        const { valueRef, pendingTmNodeRef, multipleRef, valueSetRef, renderLabelRef, renderOptionRef, labelFieldRef, valueFieldRef, showCheckmarkRef, handleOptionClick, handleOptionMouseEnter
+        const { valueRef, pendingTmNodeRef, multipleRef, valueSetRef, renderLabelRef, renderOptionRef, labelFieldRef, valueFieldRef, showCheckmarkRef, nodePropsRef, handleOptionClick, handleOptionMouseEnter
         // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
          } = (0, vue_1.inject)(interface_1.internalSelectionMenuInjectionKey);
         const isPendingRef = (0, vooks_1.useMemo)(() => {
@@ -63,6 +63,7 @@ exports.default = (0, vue_1.defineComponent)({
                 return parent && parent.rawNode.type === 'group';
             }),
             showCheckmark: showCheckmarkRef,
+            nodeProps: nodePropsRef,
             isPending: isPendingRef,
             isSelected: (0, vooks_1.useMemo)(() => {
                 const { value } = valueRef;
@@ -87,7 +88,7 @@ exports.default = (0, vue_1.defineComponent)({
         };
     },
     render() {
-        const { clsPrefix, tmNode: { rawNode }, isSelected, isPending, isGrouped, showCheckmark, renderOption, renderLabel, handleClick, handleMouseEnter, handleMouseMove } = this;
+        const { clsPrefix, tmNode: { rawNode }, isSelected, isPending, isGrouped, showCheckmark, nodeProps, renderOption, renderLabel, handleClick, handleMouseEnter, handleMouseMove } = this;
         const checkmark = renderCheckMark(isSelected, clsPrefix);
         const children = renderLabel
             ? [renderLabel(rawNode, isSelected), showCheckmark && checkmark]
@@ -95,9 +96,11 @@ exports.default = (0, vue_1.defineComponent)({
                 (0, _utils_1.render)(rawNode[this.labelField], rawNode, isSelected),
                 showCheckmark && checkmark
             ];
-        const node = ((0, vue_1.h)("div", { class: [
+        const attrs = nodeProps === null || nodeProps === void 0 ? void 0 : nodeProps(rawNode);
+        const node = ((0, vue_1.h)("div", Object.assign({}, attrs, { class: [
                 `${clsPrefix}-base-select-option`,
                 rawNode.class,
+                attrs === null || attrs === void 0 ? void 0 : attrs.class,
                 {
                     [`${clsPrefix}-base-select-option--disabled`]: rawNode.disabled,
                     [`${clsPrefix}-base-select-option--selected`]: isSelected,
@@ -105,7 +108,10 @@ exports.default = (0, vue_1.defineComponent)({
                     [`${clsPrefix}-base-select-option--pending`]: isPending,
                     [`${clsPrefix}-base-select-option--show-checkmark`]: showCheckmark
                 }
-            ], style: rawNode.style, onClick: handleClick, onMouseenter: handleMouseEnter, onMousemove: handleMouseMove },
+            ], style: [(attrs === null || attrs === void 0 ? void 0 : attrs.style) || '', rawNode.style || ''], onClick: (0, _utils_1.mergeEventHandlers)([handleClick, attrs === null || attrs === void 0 ? void 0 : attrs.onClick]), onMouseenter: (0, _utils_1.mergeEventHandlers)([
+                handleMouseEnter,
+                attrs === null || attrs === void 0 ? void 0 : attrs.onMouseenter
+            ]), onMousemove: (0, _utils_1.mergeEventHandlers)([handleMouseMove, attrs === null || attrs === void 0 ? void 0 : attrs.onMousemove]) }),
             (0, vue_1.h)("div", { class: `${clsPrefix}-base-select-option__content` }, children)));
         return rawNode.render
             ? rawNode.render({ node, option: rawNode, selected: isSelected })

package/lib/_internal/select-menu/src/interface.d.ts

@@ -1,4 +1,4 @@
-import { VNodeChild, Ref, UnwrapRef, VNode } from 'vue';
+import { VNodeChild, Ref, UnwrapRef, VNode, HTMLAttributes } from 'vue';
 import { TreeNode } from 'treemate';
 import type { SelectBaseOption, SelectGroupOption, SelectIgnoredOption } from '../../../select/src/interface';
 export declare type Size = 'small' | 'medium' | 'large' | 'huge';
@@ -14,6 +14,7 @@ export declare type RenderOptionImpl = (info: {
     option: SelectBaseOption | SelectGroupOption | SelectIgnoredOption;
     selected: boolean;
 }) => VNodeChild;
+export declare type NodeProps = (option: SelectBaseOption | SelectGroupOption) => HTMLAttributes & Record<string, unknown>;
 export interface InternalSelectMenuInjection {
     handleOptionMouseEnter: (e: MouseEvent, tmNode: TreeNode<SelectBaseOption>) => void;
     handleOptionClick: (e: MouseEvent, tmNode: TreeNode<SelectBaseOption>) => void;
@@ -26,6 +27,7 @@ export interface InternalSelectMenuInjection {
     renderOptionRef: Ref<RenderOption | undefined>;
     labelFieldRef: Ref<string>;
     valueFieldRef: Ref<string>;
+    nodePropsRef: Ref<NodeProps | undefined>;
 }
 export interface InternalExposedProps {
     selfRef: Ref<HTMLElement | null>;

package/lib/_internal/selection/src/Selection.d.ts

@@ -58,7 +58,6 @@ declare const _default: import("vue").DefineComponent<{
     inputProps: PropType<InputHTMLAttributes>;
     focused: BooleanConstructor;
     renderTag: PropType<RenderTag>;
-    onKeyup: PropType<(e: KeyboardEvent) => void>;
     onKeydown: PropType<(e: KeyboardEvent) => void>;
     onClick: PropType<(e: MouseEvent) => void>;
     onBlur: PropType<(e: FocusEvent) => void>;
@@ -608,7 +607,6 @@ declare const _default: import("vue").DefineComponent<{
     inputProps: PropType<InputHTMLAttributes>;
     focused: BooleanConstructor;
     renderTag: PropType<RenderTag>;
-    onKeyup: PropType<(e: KeyboardEvent) => void>;
     onKeydown: PropType<(e: KeyboardEvent) => void>;
     onClick: PropType<(e: MouseEvent) => void>;
     onBlur: PropType<(e: FocusEvent) => void>;

package/lib/_internal/selection/src/Selection.js

@@ -39,7 +39,7 @@ exports.default = (0, vue_1.defineComponent)({
         }, loading: Boolean, autofocus: Boolean, showArrow: {
             type: Boolean,
             default: true
-        }, inputProps: Object, focused: Boolean, renderTag: Function, onKeyup: Function, onKeydown: Function, onClick: Function, onBlur: Function, onFocus: Function, onDeleteOption: Function, maxTagCount: [String, Number], onClear: Function, onPatternInput: Function, onPatternFocus: Function, onPatternBlur: Function, renderLabel: Function, status: String, inlineThemeDisabled: Boolean, onResize: Function }),
+        }, inputProps: Object, focused: Boolean, renderTag: Function, onKeydown: Function, onClick: Function, onBlur: Function, onFocus: Function, onDeleteOption: Function, maxTagCount: [String, Number], onClear: Function, onPatternInput: Function, onPatternFocus: Function, onPatternBlur: Function, renderLabel: Function, status: String, inlineThemeDisabled: Boolean, onResize: Function }),
     setup(props) {
         const patternInputMirrorRef = (0, vue_1.ref)(null);
         const patternInputRef = (0, vue_1.ref)(null);
@@ -566,7 +566,7 @@ exports.default = (0, vue_1.defineComponent)({
                     // many redundant codes.
                     [`${clsPrefix}-base-selection--focus`]: this.focused
                 }
-            ], style: this.cssVars, onClick: this.onClick, onMouseenter: this.handleMouseEnter, onMouseleave: this.handleMouseLeave, onKeyup: this.onKeyup, onKeydown: this.onKeydown, onFocusin: this.handleFocusin, onFocusout: this.handleFocusout, onMousedown: this.handleMouseDown },
+            ], style: this.cssVars, onClick: this.onClick, onMouseenter: this.handleMouseEnter, onMouseleave: this.handleMouseLeave, onKeydown: this.onKeydown, onFocusin: this.handleFocusin, onFocusout: this.handleFocusout, onMousedown: this.handleMouseDown },
             body,
             bordered ? ((0, vue_1.h)("div", { class: `${clsPrefix}-base-selection__border` })) : null,
             bordered ? ((0, vue_1.h)("div", { class: `${clsPrefix}-base-selection__state-border` })) : null));

package/lib/_mixins/use-theme.js

@@ -62,7 +62,7 @@ function useTheme(resolveId, mountId, style, defaultTheme, props, clsPrefixRef)
             common: mergedCommon,
             self: mergedSelf,
             peers: (0, lodash_1.merge)({}, defaultTheme.peers, globalPeers, peers),
-            peerOverrides: (0, lodash_1.merge)({}, globalPeersOverrides, peersOverrides)
+            peerOverrides: (0, lodash_1.merge)({}, builtinOverrides.peers, globalPeersOverrides, peersOverrides)
         };
     });
     return mergedThemeRef;

package/lib/_utils/composable/index.d.ts

@@ -1,10 +1,8 @@
-import { Ref, InjectionKey } from 'vue';
-export declare function useInjectionInstanceCollection(injectionName: string | InjectionKey<unknown>, collectionKey: string, registerKeyRef: Ref<any>): void;
-export declare function useInjectionCollection(injectionName: string | InjectionKey<unknown>, collectionKey: string, valueRef: Ref<any>): void;
-export declare function useInjectionElementCollection(injectionName: string | InjectionKey<unknown>, collectionKey: string, getElement: () => HTMLElement | null): void;
-export declare function useDeferredTrue(valueRef: Ref<any>, delay: number, shouldDelayRef: Ref<boolean>): Ref<boolean>;
+export { useInjectionCollection, useInjectionElementCollection, useInjectionInstanceCollection } from './use-collection';
+export { useDeferredTrue } from './use-deferred-true';
 export { useAdjustedTo } from './use-adjusted-to';
 export { useHoudini } from './use-houdini';
 export { useOnResize } from './use-resize';
 export { useLockHtmlScroll, lockHtmlScrollRightCompensationRef } from './use-lock-html-scroll';
 export { useIsComposing } from './use-is-composing';
+export { useReactivated } from './use-reactivated';

package/lib/_utils/composable/index.js

@@ -1,121 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useIsComposing = exports.lockHtmlScrollRightCompensationRef = exports.useLockHtmlScroll = exports.useOnResize = exports.useHoudini = exports.useAdjustedTo = exports.useDeferredTrue = exports.useInjectionElementCollection = exports.useInjectionCollection = exports.useInjectionInstanceCollection = void 0;
-const vue_1 = require("vue");
-// injection.collection {
-//   key1: [insta, instb]
-//   key2: [instc]
-// }
-function useInjectionInstanceCollection(injectionName, collectionKey, registerKeyRef) {
-    var _a;
-    const injection = (0, vue_1.inject)(injectionName, null);
-    if (injection === null)
-        return;
-    const vm = (_a = (0, vue_1.getCurrentInstance)()) === null || _a === void 0 ? void 0 : _a.proxy;
-    (0, vue_1.watch)(registerKeyRef, registerInstance);
-    registerInstance(registerKeyRef.value);
-    (0, vue_1.onBeforeUnmount)(() => {
-        registerInstance(undefined, registerKeyRef.value);
-    });
-    function registerInstance(key, oldKey) {
-        const collection = injection[collectionKey];
-        if (oldKey !== undefined)
-            removeInstance(collection, oldKey);
-        if (key !== undefined)
-            addInstance(collection, key);
-    }
-    function removeInstance(collection, key) {
-        if (!collection[key])
-            collection[key] = [];
-        collection[key].splice(collection[key].findIndex((instance) => instance === vm), 1);
-    }
-    function addInstance(collection, key) {
-        if (!collection[key])
-            collection[key] = [];
-        if (!~collection[key].findIndex((instance) => instance === vm)) {
-            collection[key].push(vm);
-        }
-    }
-}
-exports.useInjectionInstanceCollection = useInjectionInstanceCollection;
-// injection.collection {
-//   key1: [insta.value, instb.value]
-//   key2: [instc.value]
-// }
-function useInjectionCollection(injectionName, collectionKey, valueRef) {
-    const injection = (0, vue_1.inject)(injectionName, null);
-    if (injection === null)
-        return;
-    if (!(collectionKey in injection)) {
-        injection[collectionKey] = [];
-    }
-    injection[collectionKey].push(valueRef.value);
-    (0, vue_1.watch)(valueRef, (value, prevValue) => {
-        const collectionArray = injection[collectionKey];
-        const index = collectionArray.findIndex((collectionValue) => collectionValue === prevValue);
-        if (~index)
-            collectionArray.splice(index, 1);
-        collectionArray.push(value);
-    });
-    (0, vue_1.onBeforeUnmount)(() => {
-        const collectionArray = injection[collectionKey];
-        const index = collectionArray.findIndex((collectionValue) => collectionValue === valueRef.value);
-        if (~index)
-            collectionArray.splice(index, 1);
-    });
-}
-exports.useInjectionCollection = useInjectionCollection;
-// injection.collection {
-//   key1: [insta.$el, instb.$el]
-//   key2: [instc.$el]
-// }
-function useInjectionElementCollection(injectionName, collectionKey, getElement) {
-    const injection = (0, vue_1.inject)(injectionName, null);
-    if (injection === null)
-        return;
-    if (!(collectionKey in injection)) {
-        injection[collectionKey] = [];
-    }
-    (0, vue_1.onMounted)(() => {
-        const el = getElement();
-        if (!el)
-            return;
-        injection[collectionKey].push(el);
-    });
-    (0, vue_1.onBeforeUnmount)(() => {
-        const collectionArray = injection[collectionKey];
-        const element = getElement();
-        const index = collectionArray.findIndex((collectionElement) => collectionElement === element);
-        if (~index)
-            collectionArray.splice(index, 1);
-    });
-}
-exports.useInjectionElementCollection = useInjectionElementCollection;
-function useDeferredTrue(valueRef, delay, shouldDelayRef) {
-    if (!delay)
-        return valueRef;
-    const delayedRef = (0, vue_1.ref)(valueRef.value);
-    let timerId = null;
-    (0, vue_1.watch)(valueRef, (value) => {
-        if (timerId !== null)
-            window.clearTimeout(timerId);
-        if (value === true) {
-            if (shouldDelayRef && !shouldDelayRef.value) {
-                delayedRef.value = true;
-            }
-            else {
-                timerId = window.setTimeout(() => {
-                    delayedRef.value = true;
-                }, delay);
-            }
-        }
-        else {
-            delayedRef.value = false;
-        }
-    });
-    return delayedRef;
-}
-exports.useDeferredTrue = useDeferredTrue;
+exports.useReactivated = exports.useIsComposing = exports.lockHtmlScrollRightCompensationRef = exports.useLockHtmlScroll = exports.useOnResize = exports.useHoudini = exports.useAdjustedTo = exports.useDeferredTrue = exports.useInjectionInstanceCollection = exports.useInjectionElementCollection = exports.useInjectionCollection = void 0;
+var use_collection_1 = require("./use-collection");
+Object.defineProperty(exports, "useInjectionCollection", { enumerable: true, get: function () { return use_collection_1.useInjectionCollection; } });
+Object.defineProperty(exports, "useInjectionElementCollection", { enumerable: true, get: function () { return use_collection_1.useInjectionElementCollection; } });
+Object.defineProperty(exports, "useInjectionInstanceCollection", { enumerable: true, get: function () { return use_collection_1.useInjectionInstanceCollection; } });
+var use_deferred_true_1 = require("./use-deferred-true");
+Object.defineProperty(exports, "useDeferredTrue", { enumerable: true, get: function () { return use_deferred_true_1.useDeferredTrue; } });
 var use_adjusted_to_1 = require("./use-adjusted-to");
 Object.defineProperty(exports, "useAdjustedTo", { enumerable: true, get: function () { return use_adjusted_to_1.useAdjustedTo; } });
 var use_houdini_1 = require("./use-houdini");
@@ -127,3 +18,5 @@ Object.defineProperty(exports, "useLockHtmlScroll", { enumerable: true, get: fun
 Object.defineProperty(exports, "lockHtmlScrollRightCompensationRef", { enumerable: true, get: function () { return use_lock_html_scroll_1.lockHtmlScrollRightCompensationRef; } });
 var use_is_composing_1 = require("./use-is-composing");
 Object.defineProperty(exports, "useIsComposing", { enumerable: true, get: function () { return use_is_composing_1.useIsComposing; } });
+var use_reactivated_1 = require("./use-reactivated");
+Object.defineProperty(exports, "useReactivated", { enumerable: true, get: function () { return use_reactivated_1.useReactivated; } });

package/lib/_utils/composable/use-collection.d.ts

@@ -0,0 +1,4 @@
+import { Ref, InjectionKey } from 'vue';
+export declare function useInjectionInstanceCollection(injectionName: string | InjectionKey<unknown>, collectionKey: string, registerKeyRef: Ref<any>): void;
+export declare function useInjectionCollection(injectionName: string | InjectionKey<unknown>, collectionKey: string, valueRef: Ref<any>): void;
+export declare function useInjectionElementCollection(injectionName: string | InjectionKey<unknown>, collectionKey: string, getElement: () => HTMLElement | null): void;

package/lib/_utils/composable/use-collection.js

@@ -0,0 +1,93 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useInjectionElementCollection = exports.useInjectionCollection = exports.useInjectionInstanceCollection = void 0;
+const vue_1 = require("vue");
+// injection.collection {
+//   key1: [insta, instb]
+//   key2: [instc]
+// }
+function useInjectionInstanceCollection(injectionName, collectionKey, registerKeyRef) {
+    var _a;
+    const injection = (0, vue_1.inject)(injectionName, null);
+    if (injection === null)
+        return;
+    const vm = (_a = (0, vue_1.getCurrentInstance)()) === null || _a === void 0 ? void 0 : _a.proxy;
+    (0, vue_1.watch)(registerKeyRef, registerInstance);
+    registerInstance(registerKeyRef.value);
+    (0, vue_1.onBeforeUnmount)(() => {
+        registerInstance(undefined, registerKeyRef.value);
+    });
+    function registerInstance(key, oldKey) {
+        const collection = injection[collectionKey];
+        if (oldKey !== undefined)
+            removeInstance(collection, oldKey);
+        if (key !== undefined)
+            addInstance(collection, key);
+    }
+    function removeInstance(collection, key) {
+        if (!collection[key])
+            collection[key] = [];
+        collection[key].splice(collection[key].findIndex((instance) => instance === vm), 1);
+    }
+    function addInstance(collection, key) {
+        if (!collection[key])
+            collection[key] = [];
+        if (!~collection[key].findIndex((instance) => instance === vm)) {
+            collection[key].push(vm);
+        }
+    }
+}
+exports.useInjectionInstanceCollection = useInjectionInstanceCollection;
+// injection.collection {
+//   key1: [insta.value, instb.value]
+//   key2: [instc.value]
+// }
+function useInjectionCollection(injectionName, collectionKey, valueRef) {
+    const injection = (0, vue_1.inject)(injectionName, null);
+    if (injection === null)
+        return;
+    if (!(collectionKey in injection)) {
+        injection[collectionKey] = [];
+    }
+    injection[collectionKey].push(valueRef.value);
+    (0, vue_1.watch)(valueRef, (value, prevValue) => {
+        const collectionArray = injection[collectionKey];
+        const index = collectionArray.findIndex((collectionValue) => collectionValue === prevValue);
+        if (~index)
+            collectionArray.splice(index, 1);
+        collectionArray.push(value);
+    });
+    (0, vue_1.onBeforeUnmount)(() => {
+        const collectionArray = injection[collectionKey];
+        const index = collectionArray.findIndex((collectionValue) => collectionValue === valueRef.value);
+        if (~index)
+            collectionArray.splice(index, 1);
+    });
+}
+exports.useInjectionCollection = useInjectionCollection;
+// injection.collection {
+//   key1: [insta.$el, instb.$el]
+//   key2: [instc.$el]
+// }
+function useInjectionElementCollection(injectionName, collectionKey, getElement) {
+    const injection = (0, vue_1.inject)(injectionName, null);
+    if (injection === null)
+        return;
+    if (!(collectionKey in injection)) {
+        injection[collectionKey] = [];
+    }
+    (0, vue_1.onMounted)(() => {
+        const el = getElement();
+        if (!el)
+            return;
+        injection[collectionKey].push(el);
+    });
+    (0, vue_1.onBeforeUnmount)(() => {
+        const collectionArray = injection[collectionKey];
+        const element = getElement();
+        const index = collectionArray.findIndex((collectionElement) => collectionElement === element);
+        if (~index)
+            collectionArray.splice(index, 1);
+    });
+}
+exports.useInjectionElementCollection = useInjectionElementCollection;

package/lib/_utils/composable/use-deferred-true.d.ts

@@ -0,0 +1,2 @@
+import { Ref } from 'vue';
+export declare function useDeferredTrue(valueRef: Ref<any>, delay: number, shouldDelayRef: Ref<boolean>): Ref<boolean>;

package/lib/_utils/composable/use-deferred-true.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDeferredTrue = void 0;
+const vue_1 = require("vue");
+function useDeferredTrue(valueRef, delay, shouldDelayRef) {
+    if (!delay)
+        return valueRef;
+    const delayedRef = (0, vue_1.ref)(valueRef.value);
+    let timerId = null;
+    (0, vue_1.watch)(valueRef, (value) => {
+        if (timerId !== null)
+            window.clearTimeout(timerId);
+        if (value === true) {
+            if (shouldDelayRef && !shouldDelayRef.value) {
+                delayedRef.value = true;
+            }
+            else {
+                timerId = window.setTimeout(() => {
+                    delayedRef.value = true;
+                }, delay);
+            }
+        }
+        else {
+            delayedRef.value = false;
+        }
+    });
+    return delayedRef;
+}
+exports.useDeferredTrue = useDeferredTrue;

package/lib/_utils/composable/use-reactivated.d.ts

@@ -0,0 +1,3 @@
+export declare function useReactivated(callback: () => void): {
+    isDeactivated: boolean;
+};

package/lib/_utils/composable/use-reactivated.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useReactivated = void 0;
+const vue_1 = require("vue");
+function useReactivated(callback) {
+    const isDeactivatedRef = { isDeactivated: false };
+    let activateStateInitialized = false;
+    (0, vue_1.onActivated)(() => {
+        isDeactivatedRef.isDeactivated = false;
+        if (!activateStateInitialized) {
+            activateStateInitialized = true;
+            return;
+        }
+        callback();
+    });
+    (0, vue_1.onDeactivated)(() => {
+        isDeactivatedRef.isDeactivated = true;
+        if (!activateStateInitialized) {
+            activateStateInitialized = true;
+        }
+    });
+    return isDeactivatedRef;
+}
+exports.useReactivated = useReactivated;

package/lib/_utils/event/index.d.ts

@@ -0,0 +1,2 @@
+export declare function markEventEffectPerformed(event: Event): void;
+export declare function eventEffectNotPerformed(event: Event): boolean;

package/lib/_utils/event/index.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.eventEffectNotPerformed = exports.markEventEffectPerformed = void 0;
+const eventSet = new WeakSet();
+function markEventEffectPerformed(event) {
+    eventSet.add(event);
+}
+exports.markEventEffectPerformed = markEventEffectPerformed;
+function eventEffectNotPerformed(event) {
+    return !eventSet.has(event);
+}
+exports.eventEffectNotPerformed = eventEffectNotPerformed;

package/lib/_utils/index.d.ts

@@ -1,4 +1,4 @@
-export { call, keep, omit, flatten, getSlot, getVNodeChildren, keysOf, render, getFirstSlotVNode, createDataKey, createRefSetter, createInjectionKey, resolveSlot, resolveSlotWithProps, resolveWrappedSlot, isSlotEmpty } from './vue';
+export { call, keep, omit, flatten, getSlot, getVNodeChildren, keysOf, render, getFirstSlotVNode, createDataKey, createRefSetter, createInjectionKey, resolveSlot, resolveSlotWithProps, resolveWrappedSlot, isSlotEmpty, mergeEventHandlers } from './vue';
 export type { MaybeArray } from './vue';
 export { warn, warnOnce, throwError, smallerSize, largerSize, getTitleAttribute } from './naive';
 export type { ExtractPublicPropTypes, ExtractInternalPropTypes, Mutable } from './naive';
@@ -6,4 +6,5 @@ export { formatLength, color2Class } from './css';
 export { createKey } from './cssr';
 export { isJsdom } from './env/is-jsdom';
 export { isBrowser } from './env/is-browser';
+export { eventEffectNotPerformed, markEventEffectPerformed } from './event';
 export * from './composable';

package/lib/_utils/index.js

@@ -14,7 +14,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isBrowser = exports.isJsdom = exports.createKey = exports.color2Class = exports.formatLength = exports.getTitleAttribute = exports.largerSize = exports.smallerSize = exports.throwError = exports.warnOnce = exports.warn = exports.isSlotEmpty = exports.resolveWrappedSlot = exports.resolveSlotWithProps = exports.resolveSlot = exports.createInjectionKey = exports.createRefSetter = exports.createDataKey = exports.getFirstSlotVNode = exports.render = exports.keysOf = exports.getVNodeChildren = exports.getSlot = exports.flatten = exports.omit = exports.keep = exports.call = void 0;
+exports.markEventEffectPerformed = exports.eventEffectNotPerformed = exports.isBrowser = exports.isJsdom = exports.createKey = exports.color2Class = exports.formatLength = exports.getTitleAttribute = exports.largerSize = exports.smallerSize = exports.throwError = exports.warnOnce = exports.warn = exports.mergeEventHandlers = exports.isSlotEmpty = exports.resolveWrappedSlot = exports.resolveSlotWithProps = exports.resolveSlot = exports.createInjectionKey = exports.createRefSetter = exports.createDataKey = exports.getFirstSlotVNode = exports.render = exports.keysOf = exports.getVNodeChildren = exports.getSlot = exports.flatten = exports.omit = exports.keep = exports.call = void 0;
 var vue_1 = require("./vue");
 Object.defineProperty(exports, "call", { enumerable: true, get: function () { return vue_1.call; } });
 Object.defineProperty(exports, "keep", { enumerable: true, get: function () { return vue_1.keep; } });
@@ -32,6 +32,7 @@ Object.defineProperty(exports, "resolveSlot", { enumerable: true, get: function
 Object.defineProperty(exports, "resolveSlotWithProps", { enumerable: true, get: function () { return vue_1.resolveSlotWithProps; } });
 Object.defineProperty(exports, "resolveWrappedSlot", { enumerable: true, get: function () { return vue_1.resolveWrappedSlot; } });
 Object.defineProperty(exports, "isSlotEmpty", { enumerable: true, get: function () { return vue_1.isSlotEmpty; } });
+Object.defineProperty(exports, "mergeEventHandlers", { enumerable: true, get: function () { return vue_1.mergeEventHandlers; } });
 var naive_1 = require("./naive");
 Object.defineProperty(exports, "warn", { enumerable: true, get: function () { return naive_1.warn; } });
 Object.defineProperty(exports, "warnOnce", { enumerable: true, get: function () { return naive_1.warnOnce; } });
@@ -48,4 +49,7 @@ var is_jsdom_1 = require("./env/is-jsdom");
 Object.defineProperty(exports, "isJsdom", { enumerable: true, get: function () { return is_jsdom_1.isJsdom; } });
 var is_browser_1 = require("./env/is-browser");
 Object.defineProperty(exports, "isBrowser", { enumerable: true, get: function () { return is_browser_1.isBrowser; } });
+var event_1 = require("./event");
+Object.defineProperty(exports, "eventEffectNotPerformed", { enumerable: true, get: function () { return event_1.eventEffectNotPerformed; } });
+Object.defineProperty(exports, "markEventEffectPerformed", { enumerable: true, get: function () { return event_1.markEventEffectPerformed; } });
 __exportStar(require("./composable"), exports);

package/lib/_utils/vue/index.d.ts

@@ -12,3 +12,4 @@ export { createRefSetter } from './create-ref-setter';
 export { createInjectionKey } from './create-injection-key';
 export { resolveSlot, resolveWrappedSlot, resolveSlotWithProps, isSlotEmpty } from './resolve-slot';
 export type { MaybeArray } from './call';
+export { mergeEventHandlers } from './merge-handlers';

package/lib/_utils/vue/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isSlotEmpty = exports.resolveSlotWithProps = exports.resolveWrappedSlot = exports.resolveSlot = exports.createInjectionKey = exports.createRefSetter = exports.createDataKey = exports.getFirstSlotVNode = exports.render = exports.keysOf = exports.call = exports.flatten = exports.omit = exports.keep = exports.getVNodeChildren = exports.getSlot = void 0;
+exports.mergeEventHandlers = exports.isSlotEmpty = exports.resolveSlotWithProps = exports.resolveWrappedSlot = exports.resolveSlot = exports.createInjectionKey = exports.createRefSetter = exports.createDataKey = exports.getFirstSlotVNode = exports.render = exports.keysOf = exports.call = exports.flatten = exports.omit = exports.keep = exports.getVNodeChildren = exports.getSlot = void 0;
 var get_slot_1 = require("./get-slot");
 Object.defineProperty(exports, "getSlot", { enumerable: true, get: function () { return get_slot_1.getSlot; } });
 var get_v_node_children_1 = require("./get-v-node-children");
@@ -30,3 +30,5 @@ Object.defineProperty(exports, "resolveSlot", { enumerable: true, get: function
 Object.defineProperty(exports, "resolveWrappedSlot", { enumerable: true, get: function () { return resolve_slot_1.resolveWrappedSlot; } });
 Object.defineProperty(exports, "resolveSlotWithProps", { enumerable: true, get: function () { return resolve_slot_1.resolveSlotWithProps; } });
 Object.defineProperty(exports, "isSlotEmpty", { enumerable: true, get: function () { return resolve_slot_1.isSlotEmpty; } });
+var merge_handlers_1 = require("./merge-handlers");
+Object.defineProperty(exports, "mergeEventHandlers", { enumerable: true, get: function () { return merge_handlers_1.mergeEventHandlers; } });

package/lib/_utils/vue/merge-handlers.d.ts

@@ -0,0 +1 @@
+export declare function mergeEventHandlers<T>(handlers: Array<undefined | ((e: T) => void)>): undefined | ((e: T) => void);

package/lib/_utils/vue/merge-handlers.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mergeEventHandlers = void 0;
+function mergeEventHandlers(handlers) {
+    const filteredHandlers = handlers.filter((handler) => handler !== undefined);
+    if (filteredHandlers.length === 0)
+        return undefined;
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    if (filteredHandlers.length === 1)
+        return filteredHandlers[0];
+    return (e) => {
+        handlers.forEach((handler) => {
+            if (handler) {
+                handler(e);
+            }
+        });
+    };
+}
+exports.mergeEventHandlers = mergeEventHandlers;