naive-ui 2.23.2 → 2.24.0

package/lib/select/src/Select.js

@@ -62,34 +62,26 @@ const selectProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), {
         default: true
     }, renderLabel: Function, renderOption: Function, renderTag: Function, 'onUpdate:value': [Function, Array], inputProps: Object, 
     // for jsx
-    onUpdateValue: [Function, Array], onBlur: [Function, Array], onClear: [Function, Array], onFocus: [Function, Array], onScroll: [Function, Array], onSearch: [Function, Array], onUpdateShow: [Function, Array], 'onUpdate:show': [Function, Array], 
-    /** deprecated */
-    onChange: {
-        type: [Function, Array],
-        validator: () => {
-            if (process.env.NODE_ENV !== 'production') {
-                (0, _utils_1.warn)('select', '`on-change` is deprecated, please use `on-update:value` instead.');
-            }
-            return true;
-        },
-        default: undefined
-    }, items: {
-        type: Array,
-        validator: () => {
-            if (process.env.NODE_ENV !== 'production') {
-                (0, _utils_1.warn)('select', '`items` is deprecated, please use `options` instead.');
-            }
-            return true;
-        },
-        default: undefined
-    }, displayDirective: {
+    onUpdateValue: [Function, Array], onBlur: [Function, Array], onClear: [Function, Array], onFocus: [Function, Array], onScroll: [Function, Array], onSearch: [Function, Array], onUpdateShow: [Function, Array], 'onUpdate:show': [Function, Array], displayDirective: {
         type: String,
         default: 'show'
-    } });
+    }, 
+    /** deprecated */
+    onChange: [Function, Array], items: Array });
 exports.default = (0, vue_1.defineComponent)({
     name: 'Select',
     props: selectProps,
     setup(props) {
+        if (process.env.NODE_ENV !== 'production') {
+            (0, vue_1.watchEffect)(() => {
+                if (props.items !== undefined) {
+                    (0, _utils_1.warnOnce)('select', '`items` is deprecated, please use `options` instead.');
+                }
+                if (props.onChange !== undefined) {
+                    (0, _utils_1.warnOnce)('select', '`on-change` is deprecated, please use `on-update:value` instead.');
+                }
+            });
+        }
         const { mergedClsPrefixRef, mergedBorderedRef, namespaceRef } = (0, _mixins_1.useConfig)(props);
         const themeRef = (0, _mixins_1.useTheme)('Select', 'Select', index_cssr_1.default, styles_1.selectLight, props, mergedClsPrefixRef);
         const uncontrolledValueRef = (0, vue_1.ref)(props.defaultValue);

package/lib/slider/src/Slider.d.ts

@@ -1,4 +1,4 @@
-import { PropType } from 'vue';
+import { PropType, CSSProperties } from 'vue';
 import { FollowerPlacement } from 'vueuc';
 import { MaybeArray, ExtractPublicPropTypes } from '../../_utils';
 export interface ClosestMark {
@@ -279,9 +279,7 @@ declare const _default: import("vue").DefineComponent<{
     markInfos: import("vue").ComputedRef<{
         active: boolean;
         label: string;
-        style: {
-            [x: string]: string;
-        };
+        style: CSSProperties;
     }[]>;
     isShowTooltip: (index: number) => boolean;
     isSkipCSSDetection: (index: number) => boolean;

package/lib/tabs/index.d.ts

@@ -4,3 +4,4 @@ export { default as NTabPane } from './src/TabPane';
 export type { TabPaneProps } from './src/TabPane';
 export { default as NTab } from './src/Tab';
 export type { TabProps } from './src/Tab';
+export type { TabsInst } from './src/interface';

package/lib/tabs/src/Tabs.d.ts

@@ -2,8 +2,7 @@
 import { PropType, CSSProperties, ComponentPublicInstance, nextTick } from 'vue';
 import { VXScrollInst } from 'vueuc';
 import type { MaybeArray, ExtractPublicPropTypes } from '../../_utils';
-import { Addable, OnClose, OnBeforeLeave, TabsType } from './interface';
-import type { OnUpdateValue } from './interface';
+import type { Addable, OnClose, OnBeforeLeave, TabsType, OnUpdateValue } from './interface';
 declare const tabsProps: {
     readonly value: PropType<string | number>;
     readonly defaultValue: PropType<string | number>;
@@ -437,6 +436,7 @@ declare const _default: import("vue").DefineComponent<{
         panePaddingLarge: string;
     }, any>>>;
 }, {
+    syncBarPosition: () => void;
     mergedClsPrefix: import("vue").ComputedRef<string>;
     mergedValue: import("vue").ComputedRef<string | number | null>;
     renderedNames: Set<string | number>;

package/lib/tabs/src/Tabs.js

@@ -11,8 +11,8 @@ const _mixins_1 = require("../../_mixins");
 const _utils_1 = require("../../_utils");
 const styles_1 = require("../styles");
 const interface_1 = require("./interface");
-const index_cssr_1 = __importDefault(require("./styles/index.cssr"));
 const Tab_1 = __importDefault(require("./Tab"));
+const index_cssr_1 = __importDefault(require("./styles/index.cssr"));
 const tabsProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { value: [String, Number], defaultValue: [String, Number], type: {
         type: String,
         default: 'bar'
@@ -59,9 +59,6 @@ exports.default = (0, vue_1.defineComponent)({
             : null));
         const mergedValueRef = (0, vooks_1.useMergedState)(compitableValueRef, uncontrolledValueRef);
         const tabChangeIdRef = { id: 0 };
-        (0, vue_1.watch)(mergedValueRef, () => {
-            tabChangeIdRef.id = 0;
-        });
         const tabWrapperStyleRef = (0, vue_1.computed)(() => {
             if (!props.justifyContent || props.type === 'card')
                 return undefined;
@@ -71,6 +68,7 @@ exports.default = (0, vue_1.defineComponent)({
             };
         });
         (0, vue_1.watch)(mergedValueRef, () => {
+            tabChangeIdRef.id = 0;
             updateCurrentBarStyle();
         });
         function getCurrentEl() {
@@ -235,22 +233,17 @@ exports.default = (0, vue_1.defineComponent)({
                 el.classList.add(shadowAfterClass);
             }
         });
-        return {
-            mergedClsPrefix: mergedClsPrefixRef,
-            mergedValue: mergedValueRef,
-            renderedNames: new Set(),
-            tabsElRef,
+        const exposedMethods = {
+            syncBarPosition: () => {
+                updateCurrentBarStyle();
+            }
+        };
+        return Object.assign({ mergedClsPrefix: mergedClsPrefixRef, mergedValue: mergedValueRef, renderedNames: new Set(), tabsElRef,
             barElRef,
             addTabInstRef,
             xScrollInstRef,
-            scrollWrapperElRef,
-            addTabFixed: addTabFixedRef,
-            tabWrapperStyle: tabWrapperStyleRef,
-            handleNavResize,
-            mergedSize: compitableSizeRef,
-            handleScroll,
-            handleTabsResize,
-            cssVars: (0, vue_1.computed)(() => {
+            scrollWrapperElRef, addTabFixed: addTabFixedRef, tabWrapperStyle: tabWrapperStyleRef, handleNavResize, mergedSize: compitableSizeRef, handleScroll,
+            handleTabsResize, cssVars: (0, vue_1.computed)(() => {
                 const { value: size } = compitableSizeRef;
                 const { type } = props;
                 const typeSuffix = {
@@ -285,8 +278,7 @@ exports.default = (0, vue_1.defineComponent)({
                     '--font-weight-strong': fontWeightStrong,
                     '--tab-color-segment': tabColorSegment
                 };
-            })
-        };
+            }) }, exposedMethods);
     },
     render() {
         const { mergedClsPrefix, type, addTabFixed, addable, mergedSize, $slots: { default: defaultSlot, prefix: prefixSlot, suffix: suffixSlot } } = this;
@@ -344,7 +336,7 @@ exports.default = (0, vue_1.defineComponent)({
                                     mergedJustifyContent ? null : ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-tabs-scroll-padding`, style: { width: `${this.tabsPadding}px` } })),
                                     showPane
                                         ? tabPaneChildren.map((tabPaneVNode, index) => {
-                                            return ((0, vue_1.h)(Tab_1.default, Object.assign({}, tabPaneVNode.props, { internalLeftPadded: index !== 0 && !mergedJustifyContent }), tabPaneVNode.children
+                                            return justifyTabDynamicProps((0, vue_1.h)(Tab_1.default, Object.assign({}, tabPaneVNode.props, { internalLeftPadded: index !== 0 && !mergedJustifyContent }), tabPaneVNode.children
                                                 ? {
                                                     default: tabPaneVNode.children.tab
                                                 }
@@ -353,10 +345,10 @@ exports.default = (0, vue_1.defineComponent)({
                                         : tabChildren.map((tabVNode, index) => {
                                             if (index !== 0 &&
                                                 !mergedJustifyContent) {
-                                                return createLeftPaddedTabVNode(tabVNode);
+                                                return justifyTabDynamicProps(createLeftPaddedTabVNode(tabVNode));
                                             }
                                             else {
-                                                return tabVNode;
+                                                return justifyTabDynamicProps(tabVNode);
                                             }
                                         }),
                                     !addTabFixed && addable && isCard
@@ -422,3 +414,14 @@ function createLeftPaddedTabVNode(tabVNode) {
     }
     return modifiedVNode;
 }
+function justifyTabDynamicProps(tabVNode) {
+    if (Array.isArray(tabVNode.dynamicProps)) {
+        if (!tabVNode.dynamicProps.includes('internalLeftPadded')) {
+            tabVNode.dynamicProps.push('internalLeftPadded');
+        }
+    }
+    else {
+        tabVNode.dynamicProps = ['internalLeftPadded'];
+    }
+    return tabVNode;
+}

package/lib/tabs/src/interface.d.ts

@@ -26,3 +26,6 @@ export declare type Addable = boolean | {
     disabled?: boolean;
 };
 export declare const tabsInjectionKey: InjectionKey<TabsInjection>;
+export interface TabsInst {
+    syncBarPosition: () => void;
+}

package/lib/time-picker/src/TimePicker.d.ts

@@ -1,6 +1,6 @@
 import { PropType } from 'vue';
-import { MaybeArray, ExtractPublicPropTypes } from '../../_utils';
-import { IsHourDisabled, IsMinuteDisabled, IsSecondDisabled, ItemValue, OnUpdateValue, Size } from './interface';
+import type { MaybeArray, ExtractPublicPropTypes } from '../../_utils';
+import { IsHourDisabled, IsMinuteDisabled, IsSecondDisabled, ItemValue, OnUpdateFormattedValue, OnUpdateValue, Size } from './interface';
 declare const timePickerProps: {
     to: {
         type: PropType<string | boolean | HTMLElement>;
@@ -15,6 +15,7 @@ declare const timePickerProps: {
         type: PropType<number | null>;
         default: null;
     };
+    defaultFormattedValue: StringConstructor;
     placeholder: StringConstructor;
     placement: {
         type: StringConstructor;
@@ -25,6 +26,8 @@ declare const timePickerProps: {
         type: StringConstructor;
         default: string;
     };
+    valueFormat: StringConstructor;
+    formattedValue: PropType<string | null>;
     isHourDisabled: PropType<IsHourDisabled>;
     size: PropType<Size>;
     isMinuteDisabled: PropType<IsMinuteDisabled>;
@@ -33,6 +36,8 @@ declare const timePickerProps: {
     clearable: BooleanConstructor;
     'onUpdate:value': PropType<MaybeArray<OnUpdateValue>>;
     onUpdateValue: PropType<MaybeArray<OnUpdateValue>>;
+    onUpdateFormattedValue: PropType<MaybeArray<OnUpdateFormattedValue>>;
+    'onUpdate:formattedValue': PropType<MaybeArray<OnUpdateFormattedValue>>;
     onBlur: PropType<MaybeArray<(e: FocusEvent) => void>>;
     onFocus: PropType<MaybeArray<(e: FocusEvent) => void>>;
     stateful: {
@@ -939,6 +944,7 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<number | null>;
         default: null;
     };
+    defaultFormattedValue: StringConstructor;
     placeholder: StringConstructor;
     placement: {
         type: StringConstructor;
@@ -949,6 +955,8 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    valueFormat: StringConstructor;
+    formattedValue: PropType<string | null>;
     isHourDisabled: PropType<IsHourDisabled>;
     size: PropType<Size>;
     isMinuteDisabled: PropType<IsMinuteDisabled>;
@@ -957,6 +965,8 @@ declare const _default: import("vue").DefineComponent<{
     clearable: BooleanConstructor;
     'onUpdate:value': PropType<MaybeArray<OnUpdateValue>>;
     onUpdateValue: PropType<MaybeArray<OnUpdateValue>>;
+    onUpdateFormattedValue: PropType<MaybeArray<OnUpdateFormattedValue>>;
+    'onUpdate:formattedValue': PropType<MaybeArray<OnUpdateFormattedValue>>;
     onBlur: PropType<MaybeArray<(e: FocusEvent) => void>>;
     onFocus: PropType<MaybeArray<(e: FocusEvent) => void>>;
     stateful: {
@@ -2371,10 +2381,13 @@ declare const _default: import("vue").DefineComponent<{
     bordered?: unknown;
     actions?: unknown;
     defaultValue?: unknown;
+    defaultFormattedValue?: unknown;
     placeholder?: unknown;
     placement?: unknown;
     value?: unknown;
     format?: unknown;
+    valueFormat?: unknown;
+    formattedValue?: unknown;
     isHourDisabled?: unknown;
     size?: unknown;
     isMinuteDisabled?: unknown;
@@ -2383,6 +2396,8 @@ declare const _default: import("vue").DefineComponent<{
     clearable?: unknown;
     'onUpdate:value'?: unknown;
     onUpdateValue?: unknown;
+    onUpdateFormattedValue?: unknown;
+    'onUpdate:formattedValue'?: unknown;
     onBlur?: unknown;
     onFocus?: unknown;
     stateful?: unknown;
@@ -3281,6 +3296,11 @@ declare const _default: import("vue").DefineComponent<{
     hours?: MaybeArray<number> | undefined;
     minutes?: MaybeArray<number> | undefined;
     seconds?: MaybeArray<number> | undefined;
+    defaultFormattedValue?: string | undefined;
+    formattedValue?: string | null | undefined;
+    valueFormat?: string | undefined;
+    "onUpdate:formattedValue"?: MaybeArray<OnUpdateFormattedValue> | undefined;
+    onUpdateFormattedValue?: MaybeArray<OnUpdateFormattedValue> | undefined;
     isHourDisabled?: IsHourDisabled | undefined;
     isMinuteDisabled?: IsMinuteDisabled | undefined;
     isSecondDisabled?: IsSecondDisabled | undefined;

package/lib/time-picker/src/TimePicker.js

@@ -38,13 +38,13 @@ const timePickerProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props
     }, actions: Array, defaultValue: {
         type: Number,
         default: null
-    }, placeholder: String, placement: {
+    }, defaultFormattedValue: String, placeholder: String, placement: {
         type: String,
         default: 'bottom-start'
     }, value: Number, format: {
         type: String,
         default: 'HH:mm:ss'
-    }, isHourDisabled: Function, size: String, isMinuteDisabled: Function, isSecondDisabled: Function, inputReadonly: Boolean, clearable: Boolean, 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array], onBlur: [Function, Array], onFocus: [Function, Array], 
+    }, valueFormat: String, formattedValue: String, isHourDisabled: Function, size: String, isMinuteDisabled: Function, isSecondDisabled: Function, inputReadonly: Boolean, clearable: Boolean, 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array], onUpdateFormattedValue: [Function, Array], 'onUpdate:formattedValue': [Function, Array], onBlur: [Function, Array], onFocus: [Function, Array], 
     // private
     stateful: {
         type: Boolean,
@@ -89,14 +89,31 @@ exports.default = (0, vue_1.defineComponent)({
         const keyboardState = (0, vooks_1.useKeyboard)();
         const inputInstRef = (0, vue_1.ref)(null);
         const panelInstRef = (0, vue_1.ref)(null);
-        const uncontrolledValueRef = (0, vue_1.ref)(props.defaultValue);
-        const controlledValueRef = (0, vue_1.toRef)(props, 'value');
-        const mergedValueRef = (0, vooks_1.useMergedState)(controlledValueRef, uncontrolledValueRef);
         const dateFnsOptionsRef = (0, vue_1.computed)(() => {
             return {
                 locale: dateLocaleRef.value.locale
             };
         });
+        function getTimestampFromFormattedValue(value) {
+            if (value === null)
+                return null;
+            return (0, utils_1.strictParse)(value, props.valueFormat || props.format, new Date(), dateFnsOptionsRef.value).getTime();
+        }
+        const { defaultValue, defaultFormattedValue } = props;
+        const uncontrolledValueRef = (0, vue_1.ref)(defaultFormattedValue !== undefined
+            ? getTimestampFromFormattedValue(defaultFormattedValue)
+            : defaultValue);
+        const mergedValueRef = (0, vue_1.computed)(() => {
+            const { formattedValue } = props;
+            if (formattedValue !== undefined) {
+                return getTimestampFromFormattedValue(formattedValue);
+            }
+            const { value } = props;
+            if (value !== undefined) {
+                return value;
+            }
+            return uncontrolledValueRef.value;
+        });
         const { value: mergedValue } = mergedValueRef;
         const displayTimeStringRef = (0, vue_1.ref)(mergedValue === null
             ? ''
@@ -197,15 +214,28 @@ exports.default = (0, vue_1.defineComponent)({
                 return null;
             return Number((0, date_fns_1.format)(value, 'ss', dateFnsOptionsRef.value));
         });
-        function doChange(value) {
+        function doUpdateFormattedValue(value, timestampValue) {
+            const { onUpdateFormattedValue, 'onUpdate:formattedValue': _onUpdateFormattedValue } = props;
+            if (onUpdateFormattedValue) {
+                (0, _utils_1.call)(onUpdateFormattedValue, value, timestampValue);
+            }
+            if (_onUpdateFormattedValue) {
+                (0, _utils_1.call)(_onUpdateFormattedValue, value, timestampValue);
+            }
+        }
+        function doUpdateValue(value) {
             const { onUpdateValue, 'onUpdate:value': _onUpdateValue, onChange } = props;
             const { nTriggerFormChange, nTriggerFormInput } = formItem;
-            if (onUpdateValue)
-                (0, _utils_1.call)(onUpdateValue, value);
-            if (_onUpdateValue)
-                (0, _utils_1.call)(_onUpdateValue, value);
+            const formattedValue = value === null ? null : (0, date_fns_1.format)(value, props.valueFormat || props.format);
+            if (onUpdateValue) {
+                (0, _utils_1.call)(onUpdateValue, value, formattedValue);
+            }
+            if (_onUpdateValue) {
+                (0, _utils_1.call)(_onUpdateValue, value, formattedValue);
+            }
             if (onChange)
-                (0, _utils_1.call)(onChange, value);
+                (0, _utils_1.call)(onChange, value, formattedValue);
+            doUpdateFormattedValue(formattedValue, value);
             uncontrolledValueRef.value = value;
             nTriggerFormChange();
             nTriggerFormInput();
@@ -226,7 +256,7 @@ exports.default = (0, vue_1.defineComponent)({
         }
         function handleTimeInputClear(e) {
             e.stopPropagation();
-            doChange(null);
+            doUpdateValue(null);
             deriveInputValue(null);
         }
         function handleFocusDetectorFocus() {
@@ -269,30 +299,30 @@ exports.default = (0, vue_1.defineComponent)({
             if (typeof hour === 'string')
                 return;
             if (mergedValueRef.value === null) {
-                doChange((0, date_fns_1.getTime)((0, date_fns_1.setHours)((0, date_fns_1.startOfHour)(new Date()), hour)));
+                doUpdateValue((0, date_fns_1.getTime)((0, date_fns_1.setHours)((0, date_fns_1.startOfHour)(new Date()), hour)));
             }
             else {
-                doChange((0, date_fns_1.getTime)((0, date_fns_1.setHours)(mergedValueRef.value, hour)));
+                doUpdateValue((0, date_fns_1.getTime)((0, date_fns_1.setHours)(mergedValueRef.value, hour)));
             }
         }
         function handleMinuteClick(minute) {
             if (typeof minute === 'string')
                 return;
             if (mergedValueRef.value === null) {
-                doChange((0, date_fns_1.getTime)((0, date_fns_1.setMinutes)((0, date_fns_1.startOfMinute)(new Date()), minute)));
+                doUpdateValue((0, date_fns_1.getTime)((0, date_fns_1.setMinutes)((0, date_fns_1.startOfMinute)(new Date()), minute)));
             }
             else {
-                doChange((0, date_fns_1.getTime)((0, date_fns_1.setMinutes)(mergedValueRef.value, minute)));
+                doUpdateValue((0, date_fns_1.getTime)((0, date_fns_1.setMinutes)(mergedValueRef.value, minute)));
             }
         }
         function handleSecondClick(second) {
             if (typeof second === 'string')
                 return;
             if (mergedValueRef.value === null) {
-                doChange((0, date_fns_1.getTime)((0, date_fns_1.setSeconds)((0, date_fns_1.startOfSecond)(new Date()), second)));
+                doUpdateValue((0, date_fns_1.getTime)((0, date_fns_1.setSeconds)((0, date_fns_1.startOfSecond)(new Date()), second)));
             }
             else {
-                doChange((0, date_fns_1.getTime)((0, date_fns_1.setSeconds)(mergedValueRef.value, second)));
+                doUpdateValue((0, date_fns_1.getTime)((0, date_fns_1.setSeconds)(mergedValueRef.value, second)));
             }
         }
         function handleAmPmClick(amPm) {
@@ -301,20 +331,20 @@ exports.default = (0, vue_1.defineComponent)({
                 const now = new Date();
                 const hours = (0, date_fns_1.getHours)(now);
                 if (amPm === 'pm' && hours < 12) {
-                    doChange((0, date_fns_1.getTime)((0, date_fns_1.setHours)(now, hours + 12)));
+                    doUpdateValue((0, date_fns_1.getTime)((0, date_fns_1.setHours)(now, hours + 12)));
                 }
                 else if (amPm === 'am' && hours >= 12) {
-                    doChange((0, date_fns_1.getTime)((0, date_fns_1.setHours)(now, hours - 12)));
+                    doUpdateValue((0, date_fns_1.getTime)((0, date_fns_1.setHours)(now, hours - 12)));
                 }
-                doChange((0, date_fns_1.getTime)(now));
+                doUpdateValue((0, date_fns_1.getTime)(now));
             }
             else {
                 const hours = (0, date_fns_1.getHours)(mergedValue);
                 if (amPm === 'pm' && hours < 12) {
-                    doChange((0, date_fns_1.getTime)((0, date_fns_1.setHours)(mergedValue, hours + 12)));
+                    doUpdateValue((0, date_fns_1.getTime)((0, date_fns_1.setHours)(mergedValue, hours + 12)));
                 }
                 else if (amPm === 'am' && hours >= 12) {
-                    doChange((0, date_fns_1.getTime)((0, date_fns_1.setHours)(mergedValue, hours - 12)));
+                    doUpdateValue((0, date_fns_1.getTime)((0, date_fns_1.setHours)(mergedValue, hours - 12)));
                 }
             }
         }
@@ -413,7 +443,7 @@ exports.default = (0, vue_1.defineComponent)({
         }
         function handleTimeInputUpdateValue(v) {
             if (v === '') {
-                doChange(null);
+                doUpdateValue(null);
                 return;
             }
             const time = (0, utils_1.strictParse)(v, props.format, new Date(), dateFnsOptionsRef.value);
@@ -426,15 +456,15 @@ exports.default = (0, vue_1.defineComponent)({
                         minutes: (0, date_fns_1.getMinutes)(time),
                         seconds: (0, date_fns_1.getSeconds)(time)
                     });
-                    doChange((0, date_fns_1.getTime)(newTime));
+                    doUpdateValue((0, date_fns_1.getTime)(newTime));
                 }
                 else {
-                    doChange((0, date_fns_1.getTime)(time));
+                    doUpdateValue((0, date_fns_1.getTime)(time));
                 }
             }
         }
         function handleCancelClick() {
-            doChange(memorizedValueRef.value);
+            doUpdateValue(memorizedValueRef.value);
             doUpdateShow(false);
         }
         function handleNowClick() {
@@ -448,7 +478,7 @@ exports.default = (0, vue_1.defineComponent)({
                 ? getNowTime[i](now)
                 : (0, utils_2.findSimilarTime)(getNowTime[i](now), i, props[i]));
             const newValue = (0, date_fns_1.setSeconds)((0, date_fns_1.setMinutes)((0, date_fns_1.setHours)(mergedValueRef.value ? mergedValueRef.value : (0, date_fns_1.getTime)(now), mergeHours), mergeMinutes), mergeSeconds);
-            doChange((0, date_fns_1.getTime)(newValue));
+            doUpdateValue((0, date_fns_1.getTime)(newValue));
         }
         function handleConfirmClick() {
             deriveInputValue();
@@ -471,7 +501,7 @@ exports.default = (0, vue_1.defineComponent)({
         });
         (0, vue_1.watch)(mergedShowRef, () => {
             if (isValueInvalidRef.value) {
-                doChange(memorizedValueRef.value);
+                doUpdateValue(memorizedValueRef.value);
             }
         });
         (0, vue_1.provide)(interface_1.timePickerInjectionKey, {

package/lib/time-picker/src/interface.d.ts

@@ -20,8 +20,10 @@ export interface PanelRef {
     secondScrollRef?: ScrollbarInst;
     amPmScrollRef?: ScrollbarInst;
 }
-export declare type OnUpdateValue = <T extends number & (number | null)>(value: T) => void;
-export declare type OnUpdateValueImpl = (value: number | null) => void;
+export declare type OnUpdateValue = ((value: number, formattedValue: string) => void) & ((value: number | null, formattedValue: string | null) => void);
+export declare type OnUpdateValueImpl = (value: number | null, formattedValue: string | null) => void;
+export declare type OnUpdateFormattedValue = ((value: string, timestampValue: number) => void) & ((value: string | null, timestampValue: number | null) => void);
+export declare type OnUpdateFormattedValueImpl = (value: string | null, timestampValue: number | null) => void;
 export declare type IsHourDisabled = (hour: number) => boolean;
 export declare type IsMinuteDisabled = (minute: number, hour: number | null) => boolean;
 export declare type IsSecondDisabled = (second: number, minute: number | null, hour: number | null) => boolean;

package/lib/tooltip/src/Tooltip.d.ts

@@ -133,6 +133,7 @@ declare const tooltipProps: {
         type: import("vue").PropType<import("../../popover/src/Popover").TriggerEventHandlers[]>;
         default: () => never[];
     };
+    internalTrapFocus: BooleanConstructor;
     onShow: import("vue").PropType<import("../../_utils").MaybeArray<(value: boolean) => void> | undefined>;
     onHide: import("vue").PropType<import("../../_utils").MaybeArray<(value: boolean) => void> | undefined>;
     arrow: {
@@ -275,6 +276,7 @@ declare const _default: import("vue").DefineComponent<{
         type: import("vue").PropType<import("../../popover/src/Popover").TriggerEventHandlers[]>;
         default: () => never[];
     };
+    internalTrapFocus: BooleanConstructor;
     onShow: import("vue").PropType<import("../../_utils").MaybeArray<(value: boolean) => void> | undefined>;
     onHide: import("vue").PropType<import("../../_utils").MaybeArray<(value: boolean) => void> | undefined>;
     arrow: {
@@ -462,6 +464,7 @@ declare const _default: import("vue").DefineComponent<{
     to?: unknown;
     internalSyncTargetWithParent?: unknown;
     internalInheritedEventHandlers?: unknown;
+    internalTrapFocus?: unknown;
     onShow?: unknown;
     onHide?: unknown;
     arrow?: unknown;
@@ -478,6 +481,7 @@ declare const _default: import("vue").DefineComponent<{
     showArrow: boolean;
     delay: number;
     displayDirective: "show" | "if";
+    internalTrapFocus: boolean;
     animated: boolean;
     defaultShow: boolean;
     internalExtraClass: string[];
@@ -580,6 +584,7 @@ declare const _default: import("vue").DefineComponent<{
     showArrow: boolean;
     delay: number;
     displayDirective: "show" | "if";
+    internalTrapFocus: boolean;
     animated: boolean;
     defaultShow: boolean;
     internalExtraClass: string[];

package/lib/tree/src/Tree.d.ts

@@ -1,7 +1,7 @@
 import { PropType } from 'vue';
 import { TreeMate, TreeMateOptions, CheckStrategy } from 'treemate';
 import type { ExtractPublicPropTypes, MaybeArray } from '../../_utils';
-import { TreeDragInfo, TreeDropInfo, TreeOptions, Key, TreeOption, AllowDrop } from './interface';
+import { TreeDragInfo, TreeDropInfo, TreeOptions, Key, TreeOption, AllowDrop, RenderSwitcherIcon } from './interface';
 import { defaultAllowDrop } from './dnd';
 export declare function createTreeMateOptions<T>(keyField: string, childrenField: string): TreeMateOptions<T, T, T>;
 declare type OnUpdateKeys = (value: Key[], option: Array<TreeOption | null>) => void;
@@ -133,6 +133,7 @@ declare const treeProps: {
     readonly renderLabel: PropType<({ option, checked, selected }: import("./interface").TreeRenderProps) => import("vue").VNodeChild>;
     readonly renderPrefix: PropType<({ option, checked, selected }: import("./interface").TreeRenderProps) => import("vue").VNodeChild>;
     readonly renderSuffix: PropType<({ option, checked, selected }: import("./interface").TreeRenderProps) => import("vue").VNodeChild>;
+    readonly renderSwitcherIcon: PropType<RenderSwitcherIcon>;
     readonly onDragenter: PropType<MaybeArray<(e: TreeDragInfo) => void>>;
     readonly onDragleave: PropType<MaybeArray<(e: TreeDragInfo) => void>>;
     readonly onDragend: PropType<MaybeArray<(e: TreeDragInfo) => void>>;
@@ -381,6 +382,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly renderLabel: PropType<({ option, checked, selected }: import("./interface").TreeRenderProps) => import("vue").VNodeChild>;
     readonly renderPrefix: PropType<({ option, checked, selected }: import("./interface").TreeRenderProps) => import("vue").VNodeChild>;
     readonly renderSuffix: PropType<({ option, checked, selected }: import("./interface").TreeRenderProps) => import("vue").VNodeChild>;
+    readonly renderSwitcherIcon: PropType<RenderSwitcherIcon>;
     readonly onDragenter: PropType<MaybeArray<(e: TreeDragInfo) => void>>;
     readonly onDragleave: PropType<MaybeArray<(e: TreeDragInfo) => void>>;
     readonly onDragend: PropType<MaybeArray<(e: TreeDragInfo) => void>>;
@@ -1023,6 +1025,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly renderLabel?: unknown;
     readonly renderPrefix?: unknown;
     readonly renderSuffix?: unknown;
+    readonly renderSwitcherIcon?: unknown;
     readonly onDragenter?: unknown;
     readonly onDragleave?: unknown;
     readonly onDragend?: unknown;
@@ -1228,6 +1231,7 @@ declare const _default: import("vue").DefineComponent<{
     onUpdateIndeterminateKeys?: MaybeArray<OnUpdateKeys> | undefined;
     "onUpdate:indeterminateKeys"?: MaybeArray<OnUpdateKeys> | undefined;
     selectedKeys?: Key[] | undefined;
+    renderSwitcherIcon?: RenderSwitcherIcon | undefined;
     onUpdateCheckedKeys?: MaybeArray<OnUpdateKeys> | undefined;
     "onUpdate:checkedKeys"?: MaybeArray<OnUpdateKeys> | undefined;
     onUpdateSelectedKeys?: MaybeArray<OnUpdateKeys> | undefined;

package/lib/tree/src/Tree.js

@@ -104,7 +104,7 @@ const treeProps = Object.assign(Object.assign(Object.assign(Object.assign({}, _m
     }, animated: {
         type: Boolean,
         default: true
-    }, virtualScroll: Boolean, watchProps: Array, renderLabel: Function, renderPrefix: Function, renderSuffix: Function, onDragenter: [Function, Array], onDragleave: [Function, Array], onDragend: [Function, Array], onDragstart: [Function, Array], onDragover: [Function, Array], onDrop: [Function, Array], onUpdateCheckedKeys: [Function, Array], 'onUpdate:checkedKeys': [Function, Array], onUpdateSelectedKeys: [Function, Array], 'onUpdate:selectedKeys': [Function, Array] }), exports.treeSharedProps), { 
+    }, virtualScroll: Boolean, watchProps: Array, renderLabel: Function, renderPrefix: Function, renderSuffix: Function, renderSwitcherIcon: Function, onDragenter: [Function, Array], onDragleave: [Function, Array], onDragend: [Function, Array], onDragstart: [Function, Array], onDragover: [Function, Array], onDrop: [Function, Array], onUpdateCheckedKeys: [Function, Array], 'onUpdate:checkedKeys': [Function, Array], onUpdateSelectedKeys: [Function, Array], 'onUpdate:selectedKeys': [Function, Array] }), exports.treeSharedProps), { 
     // internal props for tree-select
     internalScrollable: Boolean, internalScrollablePadding: String, 
     // use it to do check
@@ -961,6 +961,7 @@ exports.default = (0, vue_1.defineComponent)({
             renderLabelRef: (0, vue_1.toRef)(props, 'renderLabel'),
             renderPrefixRef: (0, vue_1.toRef)(props, 'renderPrefix'),
             renderSuffixRef: (0, vue_1.toRef)(props, 'renderSuffix'),
+            renderSwitcherIconRef: (0, vue_1.toRef)(props, 'renderSwitcherIcon'),
             labelFieldRef: (0, vue_1.toRef)(props, 'labelField'),
             handleSwitcherClick,
             handleDragEnd,
@@ -1003,11 +1004,12 @@ exports.default = (0, vue_1.defineComponent)({
             }) }, exposedMethods);
     },
     render() {
-        const { mergedClsPrefix, blockNode, blockLine, draggable, disabled, internalFocusable, handleKeyup, handleKeydown, handleFocusout } = this;
+        const { mergedClsPrefix, blockNode, blockLine, draggable, disabled, internalFocusable, checkable, handleKeyup, handleKeydown, handleFocusout } = this;
         const mergedFocusable = internalFocusable && !disabled;
         const tabindex = mergedFocusable ? '0' : undefined;
         const treeClass = [
             `${mergedClsPrefix}-tree`,
+            checkable && `${mergedClsPrefix}-tree--checkable`,
             (blockLine || blockNode) && `${mergedClsPrefix}-tree--block-node`,
             blockLine && `${mergedClsPrefix}-tree--block-line`
         ];

package/lib/tree/src/TreeNodeSwitcher.d.ts

@@ -8,7 +8,7 @@ declare const _default: import("vue").DefineComponent<{
     hide: BooleanConstructor;
     loading: BooleanConstructor;
     onClick: PropType<(e: MouseEvent) => void>;
-}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     clsPrefix?: unknown;
     expanded?: unknown;
     hide?: unknown;