naive-ui 2.24.4 → 2.25.0

package/es/spin/src/Spin.js

@@ -39,7 +39,7 @@ export default defineComponent({
             });
         }
         const { mergedClsPrefixRef } = useConfig(props);
-        const themeRef = useTheme('Spin', 'Spin', style, spinLight, props, mergedClsPrefixRef);
+        const themeRef = useTheme('Spin', '-spin', style, spinLight, props, mergedClsPrefixRef);
         return {
             mergedClsPrefix: mergedClsPrefixRef,
             compitableShow: useCompitable(props, ['spinning', 'show']),

package/es/statistic/src/Statistic.js

@@ -8,7 +8,7 @@ export default defineComponent({
     props: statisticProps,
     setup(props) {
         const { mergedClsPrefixRef } = useConfig(props);
-        const themeRef = useTheme('Statistic', 'Statistic', style, statisticLight, props, mergedClsPrefixRef);
+        const themeRef = useTheme('Statistic', '-statistic', style, statisticLight, props, mergedClsPrefixRef);
         return {
             mergedClsPrefix: mergedClsPrefixRef,
             cssVars: computed(() => {

package/es/steps/src/Steps.js

@@ -28,7 +28,7 @@ export default defineComponent({
     props: stepsProps,
     setup(props, { slots }) {
         const { mergedClsPrefixRef } = useConfig(props);
-        const themeRef = useTheme('Steps', 'Steps', style, stepsLight, props, mergedClsPrefixRef);
+        const themeRef = useTheme('Steps', '-steps', style, stepsLight, props, mergedClsPrefixRef);
         provide(stepsInjectionKey, {
             props,
             mergedThemeRef: themeRef,

package/es/switch/src/Switch.js

@@ -42,7 +42,7 @@ export default defineComponent({
             });
         }
         const { mergedClsPrefixRef } = useConfig(props);
-        const themeRef = useTheme('Switch', 'Switch', style, switchLight, props, mergedClsPrefixRef);
+        const themeRef = useTheme('Switch', '-switch', style, switchLight, props, mergedClsPrefixRef);
         const formItem = useFormItem(props);
         const { mergedSizeRef, mergedDisabledRef } = formItem;
         const uncontrolledValueRef = ref(props.defaultValue);

package/es/table/src/Table.js

@@ -21,7 +21,7 @@ export default defineComponent({
     props: tableProps,
     setup(props) {
         const { mergedClsPrefixRef } = useConfig(props);
-        const themeRef = useTheme('Table', 'Table', style, tableLight, props, mergedClsPrefixRef);
+        const themeRef = useTheme('Table', '-table', style, tableLight, props, mergedClsPrefixRef);
         return {
             mergedClsPrefix: mergedClsPrefixRef,
             cssVars: computed(() => {

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

@@ -11,12 +11,13 @@ declare const tabsProps: {
         readonly default: "bar";
     };
     readonly closable: BooleanConstructor;
-    readonly justifyContent: PropType<"space-around" | "space-between" | "space-evenly">;
+    readonly justifyContent: PropType<"start" | "end" | "space-around" | "space-between" | "space-evenly" | "center">;
     readonly size: {
         readonly type: PropType<"small" | "medium" | "large">;
         readonly default: "medium";
     };
     readonly tabStyle: PropType<string | CSSProperties>;
+    readonly barWidth: NumberConstructor;
     readonly paneClass: StringConstructor;
     readonly paneStyle: PropType<string | CSSProperties>;
     readonly addable: PropType<Addable>;
@@ -228,12 +229,13 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: "bar";
     };
     readonly closable: BooleanConstructor;
-    readonly justifyContent: PropType<"space-around" | "space-between" | "space-evenly">;
+    readonly justifyContent: PropType<"start" | "end" | "space-around" | "space-between" | "space-evenly" | "center">;
     readonly size: {
         readonly type: PropType<"small" | "medium" | "large">;
         readonly default: "medium";
     };
     readonly tabStyle: PropType<string | CSSProperties>;
+    readonly barWidth: NumberConstructor;
     readonly paneClass: StringConstructor;
     readonly paneStyle: PropType<string | CSSProperties>;
     readonly addable: PropType<Addable>;
@@ -485,7 +487,7 @@ declare const _default: import("vue").DefineComponent<{
     addTabFixed: import("vue").Ref<boolean>;
     tabWrapperStyle: import("vue").ComputedRef<{
         display: string;
-        justifyContent: "space-around" | "space-between" | "space-evenly";
+        justifyContent: "start" | "end" | "space-around" | "space-between" | "space-evenly" | "center";
     } | undefined>;
     handleNavResize: import("lodash").DebouncedFunc<() => void>;
     mergedSize: import("vue").ComputedRef<"small" | "medium" | "large">;
@@ -523,12 +525,13 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: "bar";
     };
     readonly closable: BooleanConstructor;
-    readonly justifyContent: PropType<"space-around" | "space-between" | "space-evenly">;
+    readonly justifyContent: PropType<"start" | "end" | "space-around" | "space-between" | "space-evenly" | "center">;
     readonly size: {
         readonly type: PropType<"small" | "medium" | "large">;
         readonly default: "medium";
     };
     readonly tabStyle: PropType<string | CSSProperties>;
+    readonly barWidth: NumberConstructor;
     readonly paneClass: StringConstructor;
     readonly paneStyle: PropType<string | CSSProperties>;
     readonly addable: PropType<Addable>;

package/es/tabs/src/Tabs.js

@@ -14,7 +14,7 @@ const tabsProps = Object.assign(Object.assign({}, useTheme.props), { value: [Str
     }, closable: Boolean, justifyContent: String, size: {
         type: String,
         default: 'medium'
-    }, tabStyle: [String, Object], paneClass: String, paneStyle: [String, Object], addable: [Boolean, Object], tabsPadding: {
+    }, tabStyle: [String, Object], barWidth: Number, paneClass: String, paneStyle: [String, Object], addable: [Boolean, Object], tabsPadding: {
         type: Number,
         default: 0
     }, onBeforeLeave: Function, onAdd: Function, 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array], onClose: [Function, Array], 
@@ -39,7 +39,7 @@ export default defineComponent({
             });
         }
         const { mergedClsPrefixRef } = useConfig(props);
-        const themeRef = useTheme('Tabs', 'Tabs', style, tabsLight, props, mergedClsPrefixRef);
+        const themeRef = useTheme('Tabs', '-tabs', style, tabsLight, props, mergedClsPrefixRef);
         const tabsElRef = ref(null);
         const barElRef = ref(null);
         const scrollWrapperElRef = ref(null);
@@ -82,15 +82,23 @@ export default defineComponent({
                 return;
             if (tabEl) {
                 const disabledClassName = `${mergedClsPrefixRef.value}-tabs-bar--disabled`;
+                const { barWidth } = props;
                 if (tabEl.dataset.disabled === 'true') {
                     barEl.classList.add(disabledClassName);
                 }
                 else {
                     barEl.classList.remove(disabledClassName);
                 }
-                barEl.style.left = `${tabEl.offsetLeft}px`;
+                if (barWidth && tabEl.offsetWidth >= barWidth) {
+                    const offsetDiffLeft = Math.floor((tabEl.offsetWidth - barWidth) / 2) + tabEl.offsetLeft;
+                    barEl.style.left = `${offsetDiffLeft}px`;
+                    barEl.style.maxWidth = `${barWidth}px`;
+                }
+                else {
+                    barEl.style.left = `${tabEl.offsetLeft}px`;
+                    barEl.style.maxWidth = `${tabEl.offsetWidth}px`;
+                }
                 barEl.style.width = '8192px';
-                barEl.style.maxWidth = `${tabEl.offsetWidth + 1}px`;
             }
         }
         function updateCurrentBarStyle() {

package/es/tag/src/Tag.d.ts

@@ -26,7 +26,7 @@ declare const tagProps: {
     };
     color: PropType<import("./common-props").TagColor>;
     type: {
-        readonly type: PropType<"default" | "error" | "info" | "success" | "warning" | "primary">;
+        readonly type: PropType<"default" | "success" | "error" | "warning" | "info" | "primary">;
         readonly default: "default";
     };
     round: BooleanConstructor;
@@ -251,7 +251,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     color: PropType<import("./common-props").TagColor>;
     type: {
-        readonly type: PropType<"default" | "error" | "info" | "success" | "warning" | "primary">;
+        readonly type: PropType<"default" | "success" | "error" | "warning" | "info" | "primary">;
         readonly default: "default";
     };
     round: BooleanConstructor;
@@ -507,7 +507,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     color: PropType<import("./common-props").TagColor>;
     type: {
-        readonly type: PropType<"default" | "error" | "info" | "success" | "warning" | "primary">;
+        readonly type: PropType<"default" | "success" | "error" | "warning" | "info" | "primary">;
         readonly default: "default";
     };
     round: BooleanConstructor;
@@ -707,7 +707,7 @@ declare const _default: import("vue").DefineComponent<{
         closeMarginRtl: string;
     }, any>>>;
 }>>, {
-    type: "default" | "error" | "info" | "success" | "warning" | "primary";
+    type: "default" | "success" | "error" | "warning" | "info" | "primary";
     round: boolean;
     size: "small" | "medium" | "large";
     disabled: boolean | undefined;

package/es/tag/src/Tag.js

@@ -30,7 +30,7 @@ export default defineComponent({
     setup(props) {
         const contentRef = ref(null);
         const { mergedBorderedRef, mergedClsPrefixRef, NConfigProvider } = useConfig(props);
-        const themeRef = useTheme('Tag', 'Tag', style, tagLight, props, mergedClsPrefixRef);
+        const themeRef = useTheme('Tag', '-tag', style, tagLight, props, mergedClsPrefixRef);
         provide(tagInjectionKey, {
             roundRef: toRef(props, 'round')
         });

package/es/tag/src/common-props.d.ts

@@ -7,7 +7,7 @@ export interface TagColor {
 declare const _default: {
     readonly color: PropType<TagColor>;
     readonly type: {
-        readonly type: PropType<"default" | "error" | "info" | "success" | "warning" | "primary">;
+        readonly type: PropType<"default" | "success" | "error" | "warning" | "info" | "primary">;
         readonly default: "default";
     };
     readonly round: BooleanConstructor;

package/es/tag/src/styles/index.cssr.js

@@ -42,7 +42,7 @@ export default cB('tag', `
  color .3s var(--n-bezier),
  box-shadow .3s var(--n-bezier),
  opacity .3s var(--n-bezier);
- line-height: 1.2;
+ line-height: 1;
  height: var(--n-height);
  font-size: var(--n-font-size);
 `, [cE('border', `
@@ -76,19 +76,7 @@ export default cB('tag', `
  box-shadow: none;
  color: var(--n-text-color-checkable);
  background-color: var(--n-color-checkable);
- `, [cNotM('disabled', [c('&:hover', {
-  backgroundColor: 'var(--n-color-hover-checkable)'
-}, [cNotM('checked', {
-  color: 'var(--n-text-color-hover-checkable)'
-})]), c('&:active', {
-  backgroundColor: 'var(--n-color-pressed-checkable)'
-}, [cNotM('checked', {
-  color: 'var(--n-text-color-pressed-checkable)'
-})])]), cM('checked', {
-  color: 'var(--n-text-color-checked)',
-  backgroundColor: 'var(--n-color-checked)'
-}, [cNotM('disabled', [c('&:hover', {
-  backgroundColor: 'var(--n-color-checked-hover)'
-}), c('&:active', {
-  backgroundColor: 'var(--n-color-checked-pressed)'
-})])])])]);
+ `, [cNotM('disabled', [c('&:hover', 'background-color: var(--n-color-hover-checkable);', [cNotM('checked', 'color: var(--n-text-color-hover-checkable);')]), c('&:active', 'background-color: var(--n-color-pressed-checkable);', [cNotM('checked', 'color: var(--n-text-color-pressed-checkable);')])]), cM('checked', `
+ color: var(--n-text-color-checked);
+ background-color: 'var(--n-color-checked);
+ `, [cNotM('disabled', [c('&:hover', 'background-color: var(--n-color-checked-hover);'), c('&:active', 'background-color: var(--n-color-checked-pressed);')])])])]);

package/es/theme-editor/src/ThemeEditor.js

@@ -20,7 +20,7 @@ const ColorWandIcon = (h("svg", { viewBox: "0 0 16 16", fill: "none", xmlns: "ht
     h("path", { d: "M8.72956 4.56346C9.4771 3.81592 10.6891 3.81592 11.4367 4.56347C12.1842 5.31102 12.1842 6.52303 11.4367 7.27058L4.26679 14.4404C3.51924 15.1879 2.30723 15.1879 1.55968 14.4404C0.812134 13.6928 0.812138 12.4808 1.55969 11.7333L8.72956 4.56346ZM8.25002 6.4572L2.26679 12.4404C1.90977 12.7974 1.90977 13.3763 2.26679 13.7333C2.62381 14.0903 3.20266 14.0903 3.55968 13.7333L9.54292 7.75009L8.25002 6.4572ZM10.25 7.04299L10.7295 6.56347C11.0866 6.20645 11.0866 5.6276 10.7296 5.27057C10.3725 4.91355 9.79368 4.91355 9.43666 5.27057L8.95713 5.7501L10.25 7.04299Z", fill: "currentColor" })));
 // button colorOpacitySecondary var is not color
 const showColorPicker = (key) => {
-    if (key.includes('opacity'))
+    if (key.includes('pacity'))
         return false;
     if (key.includes('color') || key.includes('Color'))
         return true;

package/es/themes/dark.js

@@ -31,6 +31,7 @@ import { emptyDark } from '../empty/styles';
 import { formDark } from '../form/styles';
 import { gradientTextDark } from '../gradient-text/styles';
 import { iconDark } from '../icon/styles';
+import { iconWrapperDark } from '../icon-wrapper/styles';
 import { imageDark } from '../image/styles';
 import { inputDark } from '../input/styles';
 import { inputNumberDark } from '../input-number/styles';
@@ -74,6 +75,7 @@ import { typographyDark } from '../typography/styles';
 import { treeDark } from '../tree/styles';
 import { uploadDark } from '../upload/styles';
 export const darkTheme = {
+    name: 'dark',
     common: commonDark,
     Alert: alertDark,
     Anchor: anchorDark,
@@ -107,6 +109,7 @@ export const darkTheme = {
     Form: formDark,
     GradientText: gradientTextDark,
     Icon: iconDark,
+    IconWrapper: iconWrapperDark,
     Image: imageDark,
     Input: inputDark,
     InputNumber: inputNumberDark,

package/es/themes/light.js

@@ -33,6 +33,7 @@ import { emptyLight } from '../empty/styles';
 import { formLight } from '../form/styles';
 import { gradientTextLight } from '../gradient-text/styles';
 import { iconLight } from '../icon/styles';
+import { iconWrapperLight } from '../icon-wrapper/styles';
 import { imageLight } from '../image/styles';
 import { inputLight } from '../input/styles';
 import { inputNumberLight } from '../input-number/styles';
@@ -76,6 +77,7 @@ import { treeLight } from '../tree/styles';
 import { treeSelectLight } from '../tree-select/styles';
 import { uploadLight } from '../upload/styles';
 export const lightTheme = {
+    name: 'light',
     common: commonLight,
     Alert: alertLight,
     Anchor: anchorLight,
@@ -109,6 +111,7 @@ export const lightTheme = {
     Form: formLight,
     GradientText: gradientTextLight,
     Icon: iconLight,
+    IconWrapper: iconWrapperLight,
     Image: imageLight,
     Input: inputLight,
     InputNumber: inputNumberLight,

package/es/themes/utils.d.ts

@@ -1,5 +1,6 @@
 import { GlobalTheme } from '../config-provider';
-declare type ComponentKey = keyof GlobalTheme;
+declare type ComponentKey = Exclude<keyof GlobalTheme, 'name'>;
 declare type ComponentThemes = Array<Exclude<GlobalTheme[ComponentKey], undefined>>;
+export declare function createTheme(name: string, componentThemes: ComponentThemes): GlobalTheme;
 export declare function createTheme(componentThemes: ComponentThemes): GlobalTheme;
 export {};

package/es/themes/utils.js

@@ -1,7 +1,19 @@
-export function createTheme(componentThemes) {
-    const theme = {};
-    for (const cTheme of componentThemes) {
-        theme[cTheme.name] = cTheme;
+export function createTheme(name, componentThemes) {
+    const nameIsString = typeof name === 'string';
+    const theme = {
+        name: nameIsString ? name : 'customized-theme'
+    };
+    if (nameIsString) {
+        if (componentThemes) {
+            for (const cTheme of componentThemes) {
+                theme[cTheme.name] = cTheme;
+            }
+        }
+    }
+    else {
+        for (const cTheme of name) {
+            theme[cTheme.name] = cTheme;
+        }
     }
     return theme;
 }

package/es/thing/src/Thing.js

@@ -11,7 +11,7 @@ export default defineComponent({
     props: thingProps,
     setup(props, { slots }) {
         const { mergedClsPrefixRef } = useConfig(props);
-        const themeRef = useTheme('Thing', 'Thing', style, thingLight, props, mergedClsPrefixRef);
+        const themeRef = useTheme('Thing', '-thing', style, thingLight, props, mergedClsPrefixRef);
         const cssVarsRef = computed(() => {
             const { self: { titleTextColor, textColor, titleFontWeight, fontSize }, common: { cubicBezierEaseInOut } } = themeRef.value;
             return {

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

@@ -1,4 +1,5 @@
 import { PropType } from 'vue';
+import { FollowerPlacement } from 'vueuc';
 import type { MaybeArray, ExtractPublicPropTypes } from '../../_utils';
 import type { IsHourDisabled, IsMinuteDisabled, IsSecondDisabled, ItemValue, OnUpdateFormattedValue, OnUpdateValue, Size } from './interface';
 declare const timePickerProps: {
@@ -18,7 +19,7 @@ declare const timePickerProps: {
     defaultFormattedValue: StringConstructor;
     placeholder: StringConstructor;
     placement: {
-        type: StringConstructor;
+        type: PropType<FollowerPlacement>;
         default: string;
     };
     value: PropType<number | null>;
@@ -947,7 +948,7 @@ declare const _default: import("vue").DefineComponent<{
     defaultFormattedValue: StringConstructor;
     placeholder: StringConstructor;
     placement: {
-        type: StringConstructor;
+        type: PropType<FollowerPlacement>;
         default: string;
     };
     value: PropType<number | null>;
@@ -1858,6 +1859,7 @@ declare const _default: import("vue").DefineComponent<{
         }, any>;
     }>>>;
 }, {
+    mergedStatus: import("vue").ComputedRef<import("../../form/src/interface").FormValidationStatus | undefined>;
     mergedBordered: import("vue").ComputedRef<boolean>;
     mergedClsPrefix: import("vue").ComputedRef<string>;
     namespace: import("vue").ComputedRef<string | undefined>;
@@ -2407,7 +2409,7 @@ declare const _default: import("vue").DefineComponent<{
     defaultFormattedValue: StringConstructor;
     placeholder: StringConstructor;
     placement: {
-        type: StringConstructor;
+        type: PropType<FollowerPlacement>;
         default: string;
     };
     value: PropType<number | null>;
@@ -3322,9 +3324,9 @@ declare const _default: import("vue").DefineComponent<{
     disabled: boolean | undefined;
     format: string;
     to: string | boolean | HTMLElement;
-    placement: string;
-    showIcon: boolean;
     bordered: boolean | undefined;
+    showIcon: boolean;
+    placement: FollowerPlacement;
     clearable: boolean;
     defaultValue: number | null;
     stateful: boolean;

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

@@ -79,8 +79,8 @@ export default defineComponent({
         const { mergedBorderedRef, mergedClsPrefixRef, namespaceRef } = useConfig(props);
         const { localeRef, dateLocaleRef } = useLocale('TimePicker');
         const formItem = useFormItem(props);
-        const { mergedSizeRef, mergedDisabledRef } = formItem;
-        const themeRef = useTheme('TimePicker', 'TimePicker', style, timePickerLight, props, mergedClsPrefixRef);
+        const { mergedSizeRef, mergedDisabledRef, mergedStatusRef } = formItem;
+        const themeRef = useTheme('TimePicker', '-time-picker', style, timePickerLight, props, mergedClsPrefixRef);
         const keyboardState = useKeyboard();
         const inputInstRef = ref(null);
         const panelInstRef = ref(null);
@@ -513,7 +513,7 @@ export default defineComponent({
                 (_a = inputInstRef.value) === null || _a === void 0 ? void 0 : _a.blur();
             }
         };
-        return Object.assign(Object.assign({}, exposedMethods), { mergedBordered: mergedBorderedRef, mergedClsPrefix: mergedClsPrefixRef, namespace: namespaceRef, uncontrolledValue: uncontrolledValueRef, mergedValue: mergedValueRef, isMounted: useIsMounted(), inputInstRef,
+        return Object.assign(Object.assign({}, exposedMethods), { mergedStatus: mergedStatusRef, mergedBordered: mergedBorderedRef, mergedClsPrefix: mergedClsPrefixRef, namespace: namespaceRef, uncontrolledValue: uncontrolledValueRef, mergedValue: mergedValueRef, isMounted: useIsMounted(), inputInstRef,
             panelInstRef, adjustedTo: useAdjustedTo(props), mergedShow: mergedShowRef, localizedNow: localizedNowRef, localizedPlaceholder: localizedPlaceholderRef, localizedNegativeText: localizedNegativeTextRef, localizedPositiveText: localizedPositiveTextRef, hourInFormat: hourInFormatRef, minuteInFormat: minuteInFormatRef, secondInFormat: secondInFormatRef, mergedAttrSize: mergedAttrSizeRef, displayTimeString: displayTimeStringRef, mergedSize: mergedSizeRef, mergedDisabled: mergedDisabledRef, isValueInvalid: isValueInvalidRef, isHourInvalid: isHourInvalidRef, isMinuteInvalid: isMinuteInvalidRef, isSecondInvalid: isSecondInvalidRef, transitionDisabled: transitionDisabledRef, hourValue: hourValueRef, minuteValue: minuteValueRef, secondValue: secondValueRef, amPmValue: amPmValueRef, handleTimeInputFocus,
             handleTimeInputBlur,
             handleNowClick,
@@ -564,7 +564,7 @@ export default defineComponent({
             h(VBinder, null, {
                 default: () => [
                     h(VTarget, null, {
-                        default: () => (h(NInput, { ref: "inputInstRef", value: this.displayTimeString, bordered: this.mergedBordered, passivelyActivated: true, attrSize: this.mergedAttrSize, theme: this.mergedTheme.peers.Input, themeOverrides: this.mergedTheme.peerOverrides.Input, stateful: this.stateful, size: this.mergedSize, placeholder: this.localizedPlaceholder, clearable: this.clearable, disabled: this.mergedDisabled, textDecoration: this.isValueInvalid ? 'line-through' : undefined, onFocus: this.handleTimeInputFocus, onBlur: this.handleTimeInputBlur, onActivate: this.handleTimeInputActivate, onDeactivate: this.handleTimeInputDeactivate, onUpdateValue: this.handleTimeInputUpdateValue, onClear: this.handleTimeInputClear, internalDeactivateOnEnter: true, internalForceFocus: this.mergedShow, readonly: this.inputReadonly || this.mergedDisabled, onClick: this.handleTriggerClick }, this.showIcon
+                        default: () => (h(NInput, { ref: "inputInstRef", status: this.mergedStatus, value: this.displayTimeString, bordered: this.mergedBordered, passivelyActivated: true, attrSize: this.mergedAttrSize, theme: this.mergedTheme.peers.Input, themeOverrides: this.mergedTheme.peerOverrides.Input, stateful: this.stateful, size: this.mergedSize, placeholder: this.localizedPlaceholder, clearable: this.clearable, disabled: this.mergedDisabled, textDecoration: this.isValueInvalid ? 'line-through' : undefined, onFocus: this.handleTimeInputFocus, onBlur: this.handleTimeInputBlur, onActivate: this.handleTimeInputActivate, onDeactivate: this.handleTimeInputDeactivate, onUpdateValue: this.handleTimeInputUpdateValue, onClear: this.handleTimeInputClear, internalDeactivateOnEnter: true, internalForceFocus: this.mergedShow, readonly: this.inputReadonly || this.mergedDisabled, onClick: this.handleTriggerClick }, this.showIcon
                             ? {
                                 [this.clearable ? 'clear' : 'suffix']: () => (h(NBaseIcon, { clsPrefix: mergedClsPrefix, class: `${mergedClsPrefix}-time-picker-icon` }, {
                                     default: () => $slots.icon ? $slots.icon() : h(TimeIcon, null)
@@ -572,7 +572,7 @@ export default defineComponent({
                             }
                             : null))
                     }),
-                    h(VFollower, { teleportDisabled: this.adjustedTo === useAdjustedTo.tdkey, show: this.mergedShow, to: this.adjustedTo, containerClass: this.namespace, placement: "bottom-start" }, {
+                    h(VFollower, { teleportDisabled: this.adjustedTo === useAdjustedTo.tdkey, show: this.mergedShow, to: this.adjustedTo, containerClass: this.namespace, placement: this.placement }, {
                         default: () => (h(Transition, { name: "fade-in-scale-up-transition", appear: this.isMounted }, {
                             default: () => this.mergedShow
                                 ? withDirectives(h(Panel, { ref: "panelInstRef", actions: this.actions, style: this.cssVars, seconds: this.seconds, minutes: this.minutes, hours: this.hours, transitionDisabled: this.transitionDisabled, hourValue: this.hourValue, showHour: this.hourInFormat, isHourInvalid: this.isHourInvalid, isHourDisabled: this.isHourDisabled, minuteValue: this.minuteValue, showMinute: this.minuteInFormat, isMinuteInvalid: this.isMinuteInvalid, isMinuteDisabled: this.isMinuteDisabled, secondValue: this.secondValue, amPmValue: this.amPmValue, showSecond: this.secondInFormat, isSecondInvalid: this.isSecondInvalid, isSecondDisabled: this.isSecondDisabled, isValueInvalid: this.isValueInvalid, nowText: this.localizedNow, confirmText: this.localizedPositiveText, use12Hours: this.use12Hours, onFocusout: this.handleMenuFocusOut, onKeydown: this.handleMenuKeyDown, onHourClick: this.handleHourClick, onMinuteClick: this.handleMinuteClick, onSecondClick: this.handleSecondClick, onAmPmClick: this.handleAmPmClick, onNowClick: this.handleNowClick, onConfirmClick: this.handleConfirmClick, onFocusDetectorFocus: this.handleFocusDetectorFocus }), [[clickoutside, this.handleClickOutside]])

package/es/timeline/src/Timeline.js

@@ -16,7 +16,7 @@ export default defineComponent({
     props: timelineProps,
     setup(props, { slots }) {
         const { mergedClsPrefixRef } = useConfig(props);
-        const themeRef = useTheme('Timeline', 'Timeline', style, timelineLight, props, mergedClsPrefixRef);
+        const themeRef = useTheme('Timeline', '-timeline', style, timelineLight, props, mergedClsPrefixRef);
         provide(timelineInjectionKey, {
             props,
             mergedThemeRef: themeRef,

package/es/timeline/src/TimelineItem.d.ts

@@ -6,7 +6,7 @@ declare const timelineItemProps: {
     content: StringConstructor;
     color: StringConstructor;
     type: {
-        type: PropType<"default" | "error" | "info" | "success" | "warning">;
+        type: PropType<"default" | "success" | "error" | "warning" | "info">;
         default: string;
     };
 };
@@ -17,7 +17,7 @@ declare const _default: import("vue").DefineComponent<{
     content: StringConstructor;
     color: StringConstructor;
     type: {
-        type: PropType<"default" | "error" | "info" | "success" | "warning">;
+        type: PropType<"default" | "success" | "error" | "warning" | "info">;
         default: string;
     };
 }, {
@@ -42,10 +42,10 @@ declare const _default: import("vue").DefineComponent<{
     content: StringConstructor;
     color: StringConstructor;
     type: {
-        type: PropType<"default" | "error" | "info" | "success" | "warning">;
+        type: PropType<"default" | "success" | "error" | "warning" | "info">;
         default: string;
     };
 }>>, {
-    type: "default" | "error" | "info" | "success" | "warning";
+    type: "default" | "success" | "error" | "warning" | "info";
 }>;
 export default _default;

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

@@ -91,7 +91,7 @@ declare const tooltipProps: {
     };
     raw: BooleanConstructor;
     placement: {
-        type: import("vue").PropType<import("vueuc").FollowerPlacement>;
+        type: import("vue").PropType<import("vueuc/lib/binder/src/interface").Placement>;
         default: string;
     };
     x: NumberConstructor;
@@ -116,11 +116,15 @@ declare const tooltipProps: {
         default: undefined;
     };
     overlap: BooleanConstructor;
+    keepAliveOnHover: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    onClickoutside: import("vue").PropType<(e: MouseEvent) => void>;
     internalExtraClass: {
         type: import("vue").PropType<string[]>;
         default: () => never[];
     };
-    onClickoutside: import("vue").PropType<(e: MouseEvent) => void>;
     'onUpdate:show': import("vue").PropType<import("../../_utils").MaybeArray<(value: boolean) => void>>;
     onUpdateShow: import("vue").PropType<import("../../_utils").MaybeArray<(value: boolean) => void>>;
     zIndex: NumberConstructor;
@@ -234,7 +238,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     raw: BooleanConstructor;
     placement: {
-        type: import("vue").PropType<import("vueuc").FollowerPlacement>;
+        type: import("vue").PropType<import("vueuc/lib/binder/src/interface").Placement>;
         default: string;
     };
     x: NumberConstructor;
@@ -259,11 +263,15 @@ declare const _default: import("vue").DefineComponent<{
         default: undefined;
     };
     overlap: BooleanConstructor;
+    keepAliveOnHover: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    onClickoutside: import("vue").PropType<(e: MouseEvent) => void>;
     internalExtraClass: {
         type: import("vue").PropType<string[]>;
         default: () => never[];
     };
-    onClickoutside: import("vue").PropType<(e: MouseEvent) => void>;
     'onUpdate:show': import("vue").PropType<import("../../_utils").MaybeArray<(value: boolean) => void>>;
     onUpdateShow: import("vue").PropType<import("../../_utils").MaybeArray<(value: boolean) => void>>;
     zIndex: NumberConstructor;
@@ -524,7 +532,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     raw: BooleanConstructor;
     placement: {
-        type: import("vue").PropType<import("vueuc").FollowerPlacement>;
+        type: import("vue").PropType<import("vueuc/lib/binder/src/interface").Placement>;
         default: string;
     };
     x: NumberConstructor;
@@ -549,11 +557,15 @@ declare const _default: import("vue").DefineComponent<{
         default: undefined;
     };
     overlap: BooleanConstructor;
+    keepAliveOnHover: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    onClickoutside: import("vue").PropType<(e: MouseEvent) => void>;
     internalExtraClass: {
         type: import("vue").PropType<string[]>;
         default: () => never[];
     };
-    onClickoutside: import("vue").PropType<(e: MouseEvent) => void>;
     'onUpdate:show': import("vue").PropType<import("../../_utils").MaybeArray<(value: boolean) => void>>;
     onUpdateShow: import("vue").PropType<import("../../_utils").MaybeArray<(value: boolean) => void>>;
     zIndex: NumberConstructor;
@@ -583,12 +595,13 @@ declare const _default: import("vue").DefineComponent<{
     duration: number;
     to: string | boolean | HTMLElement;
     raw: boolean;
-    placement: import("vueuc").FollowerPlacement;
+    placement: import("vueuc/lib/binder/src/interface").Placement;
     overlap: boolean;
     trigger: import("../../popover").PopoverTrigger;
     showArrow: boolean;
     delay: number;
     displayDirective: "show" | "if";
+    keepAliveOnHover: boolean;
     internalTrapFocus: boolean;
     animated: boolean;
     defaultShow: boolean;

package/es/tooltip/src/Tooltip.js

@@ -10,7 +10,7 @@ export default defineComponent({
     props: tooltipProps,
     __popover__: true,
     setup(props) {
-        const themeRef = useTheme('Tooltip', 'Tooltip', undefined, tooltipLight, props);
+        const themeRef = useTheme('Tooltip', '-tooltip', undefined, tooltipLight, props);
         const popoverRef = ref(null);
         const tooltipExposedMethod = {
             syncPosition() {

package/es/transfer/src/Transfer.d.ts

@@ -3624,9 +3624,9 @@ declare const _default: import("vue").DefineComponent<{
     filter: Filter;
     disabled: boolean | undefined;
     onChange: MaybeArray<OnUpdateValue>;
+    options: Option[];
     virtualScroll: boolean;
     filterable: boolean;
-    options: Option[];
     defaultValue: OptionValue[] | null;
 }>;
 export default _default;

package/es/transfer/src/Transfer.js

@@ -47,7 +47,7 @@ export default defineComponent({
     props: transferProps,
     setup(props) {
         const { mergedClsPrefixRef } = useConfig(props);
-        const themeRef = useTheme('Transfer', 'Transfer', style, transferLight, props, mergedClsPrefixRef);
+        const themeRef = useTheme('Transfer', '-transfer', style, transferLight, props, mergedClsPrefixRef);
         const formItem = useFormItem(props);
         const { mergedSizeRef, mergedDisabledRef } = formItem;
         const itemSizeRef = computed(() => {