naive-ui 2.32.0 → 2.32.2

package/lib/thing/src/Thing.d.ts

@@ -1,26 +1,26 @@
+import { CSSProperties, PropType } from 'vue';
 import type { ExtractPublicPropTypes } from '../../_utils';
 export declare const thingProps: {
     title: StringConstructor;
     titleExtra: StringConstructor;
     description: StringConstructor;
+    descriptionStyle: PropType<string | CSSProperties>;
     content: StringConstructor;
-    contentIndented: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    theme: import("vue").PropType<import("../../_mixins").Theme<"Thing", {
+    contentStyle: PropType<string | CSSProperties>;
+    contentIndented: BooleanConstructor;
+    theme: PropType<import("../../_mixins").Theme<"Thing", {
         fontSize: string;
         titleTextColor: string;
         textColor: string;
         titleFontWeight: string;
     }, any>>;
-    themeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Thing", {
+    themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Thing", {
         fontSize: string;
         titleTextColor: string;
         textColor: string;
         titleFontWeight: string;
     }, any>>>;
-    builtinThemeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Thing", {
+    builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Thing", {
         fontSize: string;
         titleTextColor: string;
         textColor: string;
@@ -32,24 +32,23 @@ declare const _default: import("vue").DefineComponent<{
     title: StringConstructor;
     titleExtra: StringConstructor;
     description: StringConstructor;
+    descriptionStyle: PropType<string | CSSProperties>;
     content: StringConstructor;
-    contentIndented: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    theme: import("vue").PropType<import("../../_mixins").Theme<"Thing", {
+    contentStyle: PropType<string | CSSProperties>;
+    contentIndented: BooleanConstructor;
+    theme: PropType<import("../../_mixins").Theme<"Thing", {
         fontSize: string;
         titleTextColor: string;
         textColor: string;
         titleFontWeight: string;
     }, any>>;
-    themeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Thing", {
+    themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Thing", {
         fontSize: string;
         titleTextColor: string;
         textColor: string;
         titleFontWeight: string;
     }, any>>>;
-    builtinThemeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Thing", {
+    builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Thing", {
         fontSize: string;
         titleTextColor: string;
         textColor: string;
@@ -59,24 +58,23 @@ declare const _default: import("vue").DefineComponent<{
     title: StringConstructor;
     titleExtra: StringConstructor;
     description: StringConstructor;
+    descriptionStyle: PropType<string | CSSProperties>;
     content: StringConstructor;
-    contentIndented: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    theme: import("vue").PropType<import("../../_mixins").Theme<"Thing", {
+    contentStyle: PropType<string | CSSProperties>;
+    contentIndented: BooleanConstructor;
+    theme: PropType<import("../../_mixins").Theme<"Thing", {
         fontSize: string;
         titleTextColor: string;
         textColor: string;
         titleFontWeight: string;
     }, any>>;
-    themeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Thing", {
+    themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Thing", {
         fontSize: string;
         titleTextColor: string;
         textColor: string;
         titleFontWeight: string;
     }, any>>>;
-    builtinThemeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Thing", {
+    builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Thing", {
         fontSize: string;
         titleTextColor: string;
         textColor: string;

package/lib/thing/src/Thing.js

@@ -8,10 +8,7 @@ const vue_1 = require("vue");
 const _mixins_1 = require("../../_mixins");
 const styles_1 = require("../styles");
 const index_cssr_1 = __importDefault(require("./styles/index.cssr"));
-exports.thingProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { title: String, titleExtra: String, description: String, content: String, contentIndented: {
-        type: Boolean,
-        default: false
-    } });
+exports.thingProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { title: String, titleExtra: String, description: String, descriptionStyle: [String, Object], content: String, contentStyle: [String, Object], contentIndented: Boolean });
 exports.default = (0, vue_1.defineComponent)({
     name: 'Thing',
     props: exports.thingProps,
@@ -62,7 +59,7 @@ exports.default = (0, vue_1.defineComponent)({
                                 slots['header-extra'] || props.titleExtra ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-thing-header__extra` }, slots['header-extra']
                                     ? slots['header-extra']()
                                     : props.titleExtra)) : null),
-                            slots.description || props.description ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-thing-main__description` }, slots.description
+                            slots.description || props.description ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-thing-main__description`, style: props.descriptionStyle }, slots.description
                                 ? slots.description()
                                 : props.description)) : null)) : null)) : ((0, vue_1.h)(vue_1.Fragment, null,
                         slots.header ||
@@ -73,10 +70,10 @@ exports.default = (0, vue_1.defineComponent)({
                             slots['header-extra'] || props.titleExtra ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-thing-header__extra` }, slots['header-extra']
                                 ? slots['header-extra']()
                                 : props.titleExtra)) : null)) : null,
-                        slots.description || props.description ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-thing-main__description` }, slots.description
+                        slots.description || props.description ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-thing-main__description`, style: props.descriptionStyle }, slots.description
                             ? slots.description()
                             : props.description)) : null)),
-                    slots.default || props.content ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-thing-main__content` }, slots.default ? slots.default() : props.content)) : null,
+                    slots.default || props.content ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-thing-main__content`, style: props.contentStyle }, slots.default ? slots.default() : props.content)) : null,
                     slots.footer ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-thing-main__footer` }, slots.footer())) : null,
                     slots.action ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-thing-main__action` }, slots.action())) : null)));
         };

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

@@ -409,6 +409,7 @@ declare const _default: import("vue").DefineComponent<{
                 rippleDuration: string;
             }, any>;
             Input: import("../../_mixins").Theme<"Input", {
+                countTextColorDisabled: string;
                 countTextColor: string;
                 heightTiny: string;
                 heightSmall: string;

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

@@ -304,6 +304,7 @@ export declare const timePickerProps: {
             rippleDuration: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -590,6 +591,7 @@ export declare const timePickerProps: {
             rippleDuration: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -876,6 +878,7 @@ export declare const timePickerProps: {
             rippleDuration: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -1239,6 +1242,7 @@ declare const _default: import("vue").DefineComponent<{
             rippleDuration: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -1525,6 +1529,7 @@ declare const _default: import("vue").DefineComponent<{
             rippleDuration: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -1811,6 +1816,7 @@ declare const _default: import("vue").DefineComponent<{
             rippleDuration: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -2318,6 +2324,7 @@ declare const _default: import("vue").DefineComponent<{
                 rippleDuration: string;
             }, any>;
             Input: import("../../_mixins").Theme<"Input", {
+                countTextColorDisabled: string;
                 countTextColor: string;
                 heightTiny: string;
                 heightSmall: string;
@@ -2397,8 +2404,8 @@ declare const _default: import("vue").DefineComponent<{
         };
     }>;
     triggerCssVars: import("vue").ComputedRef<{
-        '--n-icon-color': string;
-        '--n-icon-color-disabled': string;
+        '--n-icon-color-override': string;
+        '--n-icon-color-disabled-override': string;
         '--n-bezier': string;
     }> | undefined;
     triggerThemeClass: import("vue").Ref<string> | undefined;
@@ -2722,6 +2729,7 @@ declare const _default: import("vue").DefineComponent<{
             rippleDuration: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -3008,6 +3016,7 @@ declare const _default: import("vue").DefineComponent<{
             rippleDuration: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -3294,6 +3303,7 @@ declare const _default: import("vue").DefineComponent<{
             rippleDuration: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;

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

@@ -478,7 +478,7 @@ exports.default = (0, vue_1.defineComponent)({
         function handleClickOutside(e) {
             var _a, _b;
             if (mergedShowRef.value &&
-                !((_b = (_a = inputInstRef.value) === null || _a === void 0 ? void 0 : _a.wrapperElRef) === null || _b === void 0 ? void 0 : _b.contains(e.target))) {
+                !((_b = (_a = inputInstRef.value) === null || _a === void 0 ? void 0 : _a.wrapperElRef) === null || _b === void 0 ? void 0 : _b.contains((0, seemly_1.getPreciseEventTarget)(e)))) {
                 closePanel({
                     returnFocus: false
                 });
@@ -575,8 +575,8 @@ exports.default = (0, vue_1.defineComponent)({
         const triggerCssVarsRef = (0, vue_1.computed)(() => {
             const { common: { cubicBezierEaseInOut }, self: { iconColor, iconColorDisabled } } = themeRef.value;
             return {
-                '--n-icon-color': iconColor,
-                '--n-icon-color-disabled': iconColorDisabled,
+                '--n-icon-color-override': iconColor,
+                '--n-icon-color-disabled-override': iconColorDisabled,
                 '--n-bezier': cubicBezierEaseInOut
             };
         });

package/lib/time-picker/src/styles/index.cssr.js

@@ -7,8 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 const cssr_1 = require("../../../_utils/cssr");
 
 const fade_in_scale_up_cssr_1 = require("../../../_styles/transitions/fade-in-scale-up.cssr"); // vars:
-// --n-icon-color
-// --n-icon-color-disabled
+// --n-icon-color-override
+// --n-icon-color-disabled-override
 // --n-bezier
 // --n-border-radius
 // --n-item-color-hover
@@ -29,11 +29,11 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('time-picker', `
  z-index: auto;
  position: relative;
  `, [(0, cssr_1.cB)('time-picker-icon', `
- color: var(--n-icon-color);
+ color: var(--n-icon-color-override);
  transition: color .3s var(--n-bezier);
- `), (0, cssr_1.cM)('disabled', [(0, cssr_1.cB)('time-picker-icon', {
-  color: 'var(--n-icon-color-disabled)'
-})])]), (0, cssr_1.cB)('time-picker-panel', `
+ `), (0, cssr_1.cM)('disabled', [(0, cssr_1.cB)('time-picker-icon', `
+ color: var(--n-icon-color-disabled-override);
+ `)])]), (0, cssr_1.cB)('time-picker-panel', `
  transition:
  box-shadow .3s var(--n-bezier),
  background-color .3s var(--n-bezier);
@@ -62,9 +62,9 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('time-picker', `
  height: calc(var(--n-item-height) * 6);
  flex-direction: column;
  transition: box-shadow .3s var(--n-bezier);
- `, [(0, cssr_1.cM)('transition-disabled', [(0, cssr_1.cE)('item', 'transition: none;', [(0, cssr_1.c)('&::before', 'transition: none;')])]), (0, cssr_1.cE)('padding', {
-  height: 'calc(var(--n-item-height) * 5)'
-}), (0, cssr_1.c)('&:first-child', 'min-width: calc(var(--n-item-width) + 4px);', [(0, cssr_1.cE)('item', [(0, cssr_1.c)('&::before', 'left: 4px;')])]), (0, cssr_1.cE)('item', `
+ `, [(0, cssr_1.cM)('transition-disabled', [(0, cssr_1.cE)('item', 'transition: none;', [(0, cssr_1.c)('&::before', 'transition: none;')])]), (0, cssr_1.cE)('padding', `
+ height: calc(var(--n-item-height) * 5);
+ `), (0, cssr_1.c)('&:first-child', 'min-width: calc(var(--n-item-width) + 4px);', [(0, cssr_1.cE)('item', [(0, cssr_1.c)('&::before', 'left: 4px;')])]), (0, cssr_1.cE)('item', `
  cursor: pointer;
  height: var(--n-item-height);
  display: flex;
@@ -92,9 +92,9 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('time-picker', `
  top: 4px;
  bottom: 0;
  border-radius: var(--n-item-border-radius);
- `), (0, cssr_1.cNotM)('disabled', [(0, cssr_1.c)('&:hover::before', {
-  backgroundColor: 'var(--n-item-color-hover)'
-})]), (0, cssr_1.cM)('active', `
+ `), (0, cssr_1.cNotM)('disabled', [(0, cssr_1.c)('&:hover::before', `
+ background-color: var(--n-item-color-hover);
+ `)]), (0, cssr_1.cM)('active', `
  color: var(--n-item-text-color-active);
  `, [(0, cssr_1.c)('&::before', `
  background-color: var(--n-item-color-hover);

package/lib/time-picker/styles/light.d.ts

@@ -243,6 +243,7 @@ declare const timePickerLight: import("../../_mixins").Theme<"TimePicker", {
         rippleDuration: string;
     }, any>;
     Input: import("../../_mixins").Theme<"Input", {
+        countTextColorDisabled: string;
         countTextColor: string;
         heightTiny: string;
         heightSmall: string;

package/lib/timeline/src/TimelineItem.js

@@ -74,7 +74,7 @@ exports.default = (0, vue_1.defineComponent)({
             (0, vue_1.h)("div", { class: `${mergedClsPrefix}-timeline-item-timeline` },
                 (0, vue_1.h)("div", { class: `${mergedClsPrefix}-timeline-item-timeline__line` }),
                 (0, _utils_1.resolveWrappedSlot)($slots.icon, (children) => {
-                    return children ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-timeline-item-timeline__icon`, style: { color: color } }, children)) : ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-timeline-item-timeline__circle`, style: { borderColor: color } }));
+                    return children ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-timeline-item-timeline__icon`, style: { color } }, children)) : ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-timeline-item-timeline__circle`, style: { borderColor: color } }));
                 })),
             (0, vue_1.h)("div", { class: `${mergedClsPrefix}-timeline-item-content` },
                 (0, _utils_1.resolveWrappedSlot)($slots.header, (children) => {

package/lib/tooltip/styles/dark.js

@@ -14,7 +14,7 @@ const tooltipDark = {
     },
     self(vars) {
         const { borderRadius, boxShadow2, popoverColor, textColor2 } = vars;
-        return Object.assign(Object.assign({}, _common_1.default), { borderRadius: borderRadius, boxShadow: boxShadow2, color: popoverColor, textColor: textColor2 });
+        return Object.assign(Object.assign({}, _common_1.default), { borderRadius, boxShadow: boxShadow2, color: popoverColor, textColor: textColor2 });
     }
 };
 exports.default = tooltipDark;

package/lib/tooltip/styles/light.js

@@ -10,7 +10,7 @@ const use_theme_1 = require("../../_mixins/use-theme");
 const seemly_1 = require("seemly");
 const self = (vars) => {
     const { borderRadius, boxShadow2, baseColor } = vars;
-    return Object.assign(Object.assign({}, _common_1.default), { borderRadius: borderRadius, boxShadow: boxShadow2, color: (0, seemly_1.composite)(baseColor, 'rgba(0, 0, 0, .85)'), textColor: baseColor });
+    return Object.assign(Object.assign({}, _common_1.default), { borderRadius, boxShadow: boxShadow2, color: (0, seemly_1.composite)(baseColor, 'rgba(0, 0, 0, .85)'), textColor: baseColor });
 };
 const tooltipLight = (0, use_theme_1.createTheme)({
     name: 'Tooltip',

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

@@ -19,7 +19,12 @@ export declare const transferProps: {
     readonly virtualScroll: BooleanConstructor;
     readonly sourceTitle: StringConstructor;
     readonly targetTitle: StringConstructor;
-    readonly filterable: BooleanConstructor;
+    readonly filterable: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    readonly sourceFilterable: BooleanConstructor;
+    readonly targetFilterable: BooleanConstructor;
     readonly sourceFilterPlaceholder: StringConstructor;
     readonly targetFilterPlaceholder: StringConstructor;
     readonly filter: {
@@ -104,6 +109,7 @@ export declare const transferProps: {
             colorHover: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -452,6 +458,7 @@ export declare const transferProps: {
             colorHover: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -800,6 +807,7 @@ export declare const transferProps: {
             colorHover: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -1096,7 +1104,12 @@ declare const _default: import("vue").DefineComponent<{
     readonly virtualScroll: BooleanConstructor;
     readonly sourceTitle: StringConstructor;
     readonly targetTitle: StringConstructor;
-    readonly filterable: BooleanConstructor;
+    readonly filterable: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    readonly sourceFilterable: BooleanConstructor;
+    readonly targetFilterable: BooleanConstructor;
     readonly sourceFilterPlaceholder: StringConstructor;
     readonly targetFilterPlaceholder: StringConstructor;
     readonly filter: {
@@ -1181,6 +1194,7 @@ declare const _default: import("vue").DefineComponent<{
             colorHover: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -1529,6 +1543,7 @@ declare const _default: import("vue").DefineComponent<{
             colorHover: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -1877,6 +1892,7 @@ declare const _default: import("vue").DefineComponent<{
             colorHover: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -2337,6 +2353,7 @@ declare const _default: import("vue").DefineComponent<{
                 colorHover: string;
             }, any>;
             Input: import("../../_mixins").Theme<"Input", {
+                countTextColorDisabled: string;
                 countTextColor: string;
                 heightTiny: string;
                 heightSmall: string;
@@ -2643,12 +2660,16 @@ declare const _default: import("vue").DefineComponent<{
         };
     }>;
     filteredSrcOpts: import("vue").ComputedRef<Option[]>;
-    tgtOpts: import("vue").ComputedRef<Option[]>;
+    filteredTgtOpts: import("vue").ComputedRef<Option[]>;
     srcPattern: import("vue").Ref<string>;
+    tgtPattern: import("vue").Ref<string>;
     mergedSize: import("vue").ComputedRef<"small" | "medium" | "large">;
+    mergedSrcFilterable: import("vue").ComputedRef<Boolean>;
     handleSrcFilterUpdateValue: (value: string | null) => void;
-    handleCheckedAll: () => void;
-    handleClearAll: () => void;
+    handleTgtFilterUpdateValue: (value: string | null) => void;
+    handleSourceCheckAll: () => void;
+    handleSourceUncheckAll: () => void;
+    handleTargetClearAll: () => void;
     handleItemCheck: (checked: boolean, optionValue: OptionValue) => void;
     handleChecked: (optionValueList: OptionValue[]) => void;
     cssVars: import("vue").ComputedRef<{
@@ -2695,7 +2716,12 @@ declare const _default: import("vue").DefineComponent<{
     readonly virtualScroll: BooleanConstructor;
     readonly sourceTitle: StringConstructor;
     readonly targetTitle: StringConstructor;
-    readonly filterable: BooleanConstructor;
+    readonly filterable: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    readonly sourceFilterable: BooleanConstructor;
+    readonly targetFilterable: BooleanConstructor;
     readonly sourceFilterPlaceholder: StringConstructor;
     readonly targetFilterPlaceholder: StringConstructor;
     readonly filter: {
@@ -2780,6 +2806,7 @@ declare const _default: import("vue").DefineComponent<{
             colorHover: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -3128,6 +3155,7 @@ declare const _default: import("vue").DefineComponent<{
             colorHover: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -3476,6 +3504,7 @@ declare const _default: import("vue").DefineComponent<{
             colorHover: string;
         }, any>;
         Input: import("../../_mixins").Theme<"Input", {
+            countTextColorDisabled: string;
             countTextColor: string;
             heightTiny: string;
             heightSmall: string;
@@ -3760,5 +3789,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly virtualScroll: boolean;
     readonly filterable: boolean;
     readonly defaultValue: OptionValue[] | null;
+    readonly sourceFilterable: boolean;
+    readonly targetFilterable: boolean;
 }>;
 export default _default;

package/lib/transfer/src/Transfer.js

@@ -27,7 +27,10 @@ exports.transferProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props
     }, disabled: {
         type: Boolean,
         default: undefined
-    }, virtualScroll: Boolean, sourceTitle: String, targetTitle: String, filterable: Boolean, sourceFilterPlaceholder: String, targetFilterPlaceholder: String, filter: {
+    }, virtualScroll: Boolean, sourceTitle: String, targetTitle: String, filterable: {
+        type: Boolean,
+        default: undefined
+    }, sourceFilterable: Boolean, targetFilterable: Boolean, sourceFilterPlaceholder: String, targetFilterPlaceholder: String, filter: {
         type: Function,
         default: (pattern, option) => {
             if (!pattern)
@@ -46,6 +49,9 @@ exports.default = (0, vue_1.defineComponent)({
                 if (props.onChange !== undefined) {
                     (0, _utils_1.warnOnce)('transfer', '`on-change` is deprecated, please use `on-update:value` instead.');
                 }
+                if (props.filterable !== undefined) {
+                    (0, _utils_1.warnOnce)('transfer', '`filterable` is deprecated, please use `source-filterable` or `target-filterable` instead.');
+                }
             });
         }
         const { mergedClsPrefixRef } = (0, _mixins_1.useConfig)(props);
@@ -57,7 +63,7 @@ exports.default = (0, vue_1.defineComponent)({
             const { self: { [(0, cssr_1.createKey)('itemHeight', size)]: itemSize } } = themeRef.value;
             return (0, seemly_1.depx)(itemSize);
         });
-        const { uncontrolledValueRef, mergedValueRef, targetValueSetRef, valueSetForSelectAllRef, valueSetForUnselectAllRef, targetOptionsRef, filteredSrcOptionsRef, canNotSelectAnythingRef, canBeClearedRef, allCheckedRef, srcPatternRef, handleSrcFilterUpdateValue } = (0, use_transfer_data_1.useTransferData)(props);
+        const { uncontrolledValueRef, mergedValueRef, targetValueSetRef, valueSetForCheckAllRef, valueSetForUncheckAllRef, valueSetForClearRef, filteredTgtOptionsRef, filteredSrcOptionsRef, targetOptionsRef, canNotSelectAnythingRef, canBeClearedRef, allCheckedRef, srcPatternRef, tgtPatternRef, mergedSrcFilterableRef, handleSrcFilterUpdateValue, handleTgtFilterUpdateValue } = (0, use_transfer_data_1.useTransferData)(props);
         function doUpdateValue(value) {
             const { onUpdateValue, 'onUpdate:value': _onUpdateValue, onChange } = props;
             const { nTriggerFormInput, nTriggerFormChange } = formItem;
@@ -71,22 +77,21 @@ exports.default = (0, vue_1.defineComponent)({
             nTriggerFormInput();
             nTriggerFormChange();
         }
-        function handleClearAll() {
-            doUpdateValue([...valueSetForUnselectAllRef.value]);
+        function handleSourceCheckAll() {
+            doUpdateValue([...valueSetForCheckAllRef.value]);
         }
-        function handleCheckedAll() {
-            doUpdateValue([...valueSetForSelectAllRef.value]);
+        function handleSourceUncheckAll() {
+            doUpdateValue([...valueSetForUncheckAllRef.value]);
+        }
+        function handleTargetClearAll() {
+            doUpdateValue([...valueSetForClearRef.value]);
         }
         function handleItemCheck(checked, optionValue) {
             if (checked) {
-                doUpdateValue([...(mergedValueRef.value || []), optionValue]);
+                doUpdateValue((mergedValueRef.value || []).concat(optionValue));
             }
             else {
-                const index = (mergedValueRef.value || []).findIndex((v) => v === optionValue);
-                if (~index) {
-                    ;
-                    (mergedValueRef.value || []).splice(index, 1);
-                }
+                doUpdateValue((mergedValueRef.value || []).filter((v) => v !== optionValue));
             }
         }
         function handleChecked(optionValueList) {
@@ -113,12 +118,16 @@ exports.default = (0, vue_1.defineComponent)({
             isMounted: (0, vooks_1.useIsMounted)(),
             mergedTheme: themeRef,
             filteredSrcOpts: filteredSrcOptionsRef,
-            tgtOpts: targetOptionsRef,
+            filteredTgtOpts: filteredTgtOptionsRef,
             srcPattern: srcPatternRef,
+            tgtPattern: tgtPatternRef,
             mergedSize: mergedSizeRef,
+            mergedSrcFilterable: mergedSrcFilterableRef,
             handleSrcFilterUpdateValue,
-            handleCheckedAll,
-            handleClearAll,
+            handleTgtFilterUpdateValue,
+            handleSourceCheckAll,
+            handleSourceUncheckAll,
+            handleTargetClearAll,
             handleItemCheck,
             handleChecked,
             cssVars: (0, vue_1.computed)(() => {
@@ -155,29 +164,29 @@ exports.default = (0, vue_1.defineComponent)({
         };
     },
     render() {
-        const { mergedClsPrefix, renderSourceList, mergedTheme } = this;
+        const { mergedClsPrefix, renderSourceList, mergedTheme, mergedSrcFilterable, targetFilterable } = this;
         return ((0, vue_1.h)("div", { class: [
                 `${mergedClsPrefix}-transfer`,
-                this.mergedDisabled && `${mergedClsPrefix}-transfer--disabled`,
-                this.filterable && `${mergedClsPrefix}-transfer--filterable`
+                this.mergedDisabled && `${mergedClsPrefix}-transfer--disabled`
             ], style: this.cssVars },
             (0, vue_1.h)("div", { class: `${mergedClsPrefix}-transfer-list ${mergedClsPrefix}-transfer-list--source` },
-                (0, vue_1.h)(TransferHeader_1.default, { source: true, title: this.sourceTitle, onCheckedAll: this.handleCheckedAll, onClearAll: this.handleClearAll, size: this.mergedSize }),
+                (0, vue_1.h)(TransferHeader_1.default, { source: true, title: this.sourceTitle, onCheckedAll: this.handleSourceCheckAll, onClearAll: this.handleSourceUncheckAll, size: this.mergedSize }),
                 (0, vue_1.h)("div", { class: `${mergedClsPrefix}-transfer-list-body` },
-                    this.filterable ? ((0, vue_1.h)(TransferFilter_1.default, { onUpdateValue: this.handleSrcFilterUpdateValue, value: this.srcPattern, disabled: this.mergedDisabled, placeholder: this.sourceFilterPlaceholder })) : null,
+                    mergedSrcFilterable ? ((0, vue_1.h)(TransferFilter_1.default, { onUpdateValue: this.handleSrcFilterUpdateValue, value: this.srcPattern, disabled: this.mergedDisabled, placeholder: this.sourceFilterPlaceholder })) : null,
                     (0, vue_1.h)("div", { class: `${mergedClsPrefix}-transfer-list-flex-container` }, renderSourceList ? ((0, vue_1.h)(_internal_1.NScrollbar, { theme: mergedTheme.peers.Scrollbar, themeOverrides: mergedTheme.peerOverrides.Scrollbar }, {
                         default: () => renderSourceList({
                             onCheck: this.handleChecked,
-                            checkedOptions: this.tgtOpts,
+                            checkedOptions: this.filteredTgtOpts,
                             pattern: this.srcPattern
                         })
                     })) : ((0, vue_1.h)(TransferList_1.default, { source: true, options: this.filteredSrcOpts, disabled: this.mergedDisabled, virtualScroll: this.virtualScroll, itemSize: this.itemSize })))),
                 (0, vue_1.h)("div", { class: `${mergedClsPrefix}-transfer-list__border` })),
             (0, vue_1.h)("div", { class: `${mergedClsPrefix}-transfer-list ${mergedClsPrefix}-transfer-list--target` },
-                (0, vue_1.h)(TransferHeader_1.default, { onClearAll: this.handleClearAll, size: this.mergedSize, title: this.targetTitle }),
+                (0, vue_1.h)(TransferHeader_1.default, { onClearAll: this.handleTargetClearAll, size: this.mergedSize, title: this.targetTitle }),
                 (0, vue_1.h)("div", { class: `${mergedClsPrefix}-transfer-list-body` },
+                    targetFilterable ? ((0, vue_1.h)(TransferFilter_1.default, { onUpdateValue: this.handleTgtFilterUpdateValue, value: this.tgtPattern, disabled: this.mergedDisabled, placeholder: this.sourceFilterPlaceholder })) : null,
                     (0, vue_1.h)("div", { class: `${mergedClsPrefix}-transfer-list-flex-container` },
-                        (0, vue_1.h)(TransferList_1.default, { options: this.tgtOpts, disabled: this.mergedDisabled, virtualScroll: this.virtualScroll, itemSize: this.itemSize }))),
+                        (0, vue_1.h)(TransferList_1.default, { options: this.filteredTgtOpts, disabled: this.mergedDisabled, virtualScroll: this.virtualScroll, itemSize: this.itemSize }))),
                 (0, vue_1.h)("div", { class: `${mergedClsPrefix}-transfer-list__border` }))));
     }
 });

package/lib/transfer/src/TransferFilter.d.ts

@@ -187,6 +187,7 @@ declare const _default: import("vue").DefineComponent<{
                 colorHover: string;
             }, any>;
             Input: import("../../_mixins").Theme<"Input", {
+                countTextColorDisabled: string;
                 countTextColor: string;
                 heightTiny: string;
                 heightSmall: string;

package/lib/transfer/src/TransferList.d.ts

@@ -197,6 +197,7 @@ declare const _default: import("vue").DefineComponent<{
                 colorHover: string;
             }, any>;
             Input: import("../../_mixins").Theme<"Input", {
+                countTextColorDisabled: string;
                 countTextColor: string;
                 heightTiny: string;
                 heightSmall: string;

package/lib/transfer/src/TransferList.js

@@ -75,7 +75,7 @@ exports.default = (0, vue_1.defineComponent)({
                     const { source, disabled } = this;
                     return ((0, vue_1.h)(TransferListItem_1.default, { source: source, key: item.value, value: item.value, disabled: item.disabled || disabled, label: item.label, option: item }));
                 }
-            })) : ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-transfer-list-content` }, this.options.map((option) => ((0, vue_1.h)(TransferListItem_1.default, { source: source, key: option.value, value: option.value, disabled: option.disabled || disabled, label: option.label, option: option })))))
+            })) : ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-transfer-list-content` }, options.map((option) => ((0, vue_1.h)(TransferListItem_1.default, { source: source, key: option.value, value: option.value, disabled: option.disabled || disabled, label: option.label, option: option })))))
         }));
     }
 });