element-plus 1.3.0-beta.8 → 1.3.0-beta.9

package/es/components/popover/src/popover.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"popover.mjs","sources":["../../../../../../packages/components/popover/src/popover.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils/props'\nimport { useTooltipContentProps } from '@element-plus/components/tooltip'\n\nexport const usePopoverProps = {\n  content: useTooltipContentProps.content,\n  popperStyle: useTooltipContentProps.popperStyle,\n  popperClass: useTooltipContentProps.popperClass,\n  enterable: {\n    ...useTooltipContentProps.enterable,\n    default: true,\n  },\n  effect: {\n    ...useTooltipContentProps.effect,\n    default: 'light',\n  },\n  ...buildProps({\n    title: String,\n\n    hideAfter: {\n      type: Number,\n      default: 200,\n    },\n    width: {\n      type: [String, Number],\n      default: 150,\n    },\n  }),\n}\n"],"names":[],"mappings":";;;;AAEY,MAAC,eAAe,GAAG;AAC/B,EAAE,OAAO,EAAE,sBAAsB,CAAC,OAAO;AACzC,EAAE,WAAW,EAAE,sBAAsB,CAAC,WAAW;AACjD,EAAE,WAAW,EAAE,sBAAsB,CAAC,WAAW;AACjD,EAAE,SAAS,EAAE;AACb,IAAI,GAAG,sBAAsB,CAAC,SAAS;AACvC,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,GAAG,sBAAsB,CAAC,MAAM;AACpC,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,GAAG,UAAU,CAAC;AAChB,IAAI,KAAK,EAAE,MAAM;AACjB,IAAI,SAAS,EAAE;AACf,MAAM,IAAI,EAAE,MAAM;AAClB,MAAM,OAAO,EAAE,GAAG;AAClB,KAAK;AACL,IAAI,KAAK,EAAE;AACX,MAAM,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC5B,MAAM,OAAO,EAAE,GAAG;AAClB,KAAK;AACL,GAAG,CAAC;AACJ;;;;"}
+{"version":3,"file":"popover.mjs","sources":["../../../../../../packages/components/popover/src/popover.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils/props'\nimport { useTooltipContentProps } from '@element-plus/components/tooltip'\n\nexport const usePopoverProps = {\n  content: useTooltipContentProps.content,\n  popperStyle: useTooltipContentProps.popperStyle,\n  popperClass: useTooltipContentProps.popperClass,\n  enterable: {\n    ...useTooltipContentProps.enterable,\n    default: true,\n  },\n  effect: {\n    ...useTooltipContentProps.effect,\n    default: 'light',\n  },\n  ...buildProps({\n    title: String,\n\n    width: {\n      type: [String, Number],\n      default: 150,\n    },\n  }),\n}\n"],"names":[],"mappings":";;;;AAEY,MAAC,eAAe,GAAG;AAC/B,EAAE,OAAO,EAAE,sBAAsB,CAAC,OAAO;AACzC,EAAE,WAAW,EAAE,sBAAsB,CAAC,WAAW;AACjD,EAAE,WAAW,EAAE,sBAAsB,CAAC,WAAW;AACjD,EAAE,SAAS,EAAE;AACb,IAAI,GAAG,sBAAsB,CAAC,SAAS;AACvC,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,GAAG,sBAAsB,CAAC,MAAM;AACpC,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,GAAG,UAAU,CAAC;AAChB,IAAI,KAAK,EAAE,MAAM;AACjB,IAAI,KAAK,EAAE;AACX,MAAM,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC5B,MAAM,OAAO,EAAE,GAAG;AAClB,KAAK;AACL,GAAG,CAAC;AACJ;;;;"}

package/es/components/transfer/index.d.ts

@@ -59,6 +59,252 @@ declare const _Transfer: SFCWithInstall<import("vue").DefineComponent<{
     rightPanelTitle: import("vue").ComputedRef<string>;
     panelFilterPlaceholder: import("vue").ComputedRef<string>;
     clearQuery: (which: "right" | "left") => void;
+    leftPanel: import("vue").Ref<({
+        $: import("vue").ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            data: unknown[];
+            filterable: boolean;
+        }> & Omit<Readonly<import("vue").ExtractPropTypes<{
+            data: {
+                type: ArrayConstructor;
+                default(): never[];
+            };
+            optionRender: FunctionConstructor;
+            placeholder: StringConstructor;
+            title: StringConstructor;
+            filterable: BooleanConstructor;
+            format: ObjectConstructor;
+            filterMethod: FunctionConstructor;
+            defaultChecked: ArrayConstructor;
+            props: ObjectConstructor;
+        }>> & {
+            "onChecked-change"?: ((...args: any[]) => any) | undefined;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "data" | "filterable">;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        };
+        $slots: Readonly<{
+            [name: string]: import("vue").Slot | undefined;
+        }>;
+        $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
+        $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
+        $emit: (event: "checked-change", ...args: any[]) => void;
+        $el: any;
+        $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+            data: {
+                type: ArrayConstructor;
+                default(): never[];
+            };
+            optionRender: FunctionConstructor;
+            placeholder: StringConstructor;
+            title: StringConstructor;
+            filterable: BooleanConstructor;
+            format: ObjectConstructor;
+            filterMethod: FunctionConstructor;
+            defaultChecked: ArrayConstructor;
+            props: ObjectConstructor;
+        }>> & {
+            "onChecked-change"?: ((...args: any[]) => any) | undefined;
+        }, {
+            labelProp: import("vue").ComputedRef<any>;
+            keyProp: import("vue").ComputedRef<any>;
+            disabledProp: import("vue").ComputedRef<any>;
+            filteredData: import("vue").ComputedRef<unknown[]>;
+            checkedSummary: import("vue").ComputedRef<any>;
+            isIndeterminate: import("vue").ComputedRef<boolean>;
+            handleAllCheckedChange: (value: import("./src/transfer").Key[]) => void;
+            checked: import("vue").Ref<never[]>;
+            allChecked: import("vue").Ref<boolean>;
+            query: import("vue").Ref<string>;
+            inputHover: import("vue").Ref<boolean>;
+            checkChangeByUser: import("vue").Ref<boolean>;
+            hasNoMatch: import("vue").ComputedRef<boolean>;
+            SearchIcon: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+            hasFooter: import("vue").ComputedRef<boolean>;
+            t: import("../..").Translator;
+        }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "checked-change"[], string, {
+            data: unknown[];
+            filterable: boolean;
+        }> & {
+            beforeCreate?: ((() => void) | (() => void)[]) | undefined;
+            created?: ((() => void) | (() => void)[]) | undefined;
+            beforeMount?: ((() => void) | (() => void)[]) | undefined;
+            mounted?: ((() => void) | (() => void)[]) | undefined;
+            beforeUpdate?: ((() => void) | (() => void)[]) | undefined;
+            updated?: ((() => void) | (() => void)[]) | undefined;
+            activated?: ((() => void) | (() => void)[]) | undefined;
+            deactivated?: ((() => void) | (() => void)[]) | undefined;
+            beforeDestroy?: ((() => void) | (() => void)[]) | undefined;
+            beforeUnmount?: ((() => void) | (() => void)[]) | undefined;
+            destroyed?: ((() => void) | (() => void)[]) | undefined;
+            unmounted?: ((() => void) | (() => void)[]) | undefined;
+            renderTracked?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
+            renderTriggered?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
+            errorCaptured?: (((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void)[]) | undefined;
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import("vue").nextTick;
+        $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
+    } & Readonly<import("vue").ExtractPropTypes<{
+        data: {
+            type: ArrayConstructor;
+            default(): never[];
+        };
+        optionRender: FunctionConstructor;
+        placeholder: StringConstructor;
+        title: StringConstructor;
+        filterable: BooleanConstructor;
+        format: ObjectConstructor;
+        filterMethod: FunctionConstructor;
+        defaultChecked: ArrayConstructor;
+        props: ObjectConstructor;
+    }>> & {
+        "onChecked-change"?: ((...args: any[]) => any) | undefined;
+    } & import("vue").ShallowUnwrapRef<{
+        labelProp: import("vue").ComputedRef<any>;
+        keyProp: import("vue").ComputedRef<any>;
+        disabledProp: import("vue").ComputedRef<any>;
+        filteredData: import("vue").ComputedRef<unknown[]>;
+        checkedSummary: import("vue").ComputedRef<any>;
+        isIndeterminate: import("vue").ComputedRef<boolean>;
+        handleAllCheckedChange: (value: import("./src/transfer").Key[]) => void;
+        checked: import("vue").Ref<never[]>;
+        allChecked: import("vue").Ref<boolean>;
+        query: import("vue").Ref<string>;
+        inputHover: import("vue").Ref<boolean>;
+        checkChangeByUser: import("vue").Ref<boolean>;
+        hasNoMatch: import("vue").ComputedRef<boolean>;
+        SearchIcon: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+        hasFooter: import("vue").ComputedRef<boolean>;
+        t: import("../..").Translator;
+    }> & {} & {} & import("vue").ComponentCustomProperties) | undefined>;
+    rightPanel: import("vue").Ref<({
+        $: import("vue").ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            data: unknown[];
+            filterable: boolean;
+        }> & Omit<Readonly<import("vue").ExtractPropTypes<{
+            data: {
+                type: ArrayConstructor;
+                default(): never[];
+            };
+            optionRender: FunctionConstructor;
+            placeholder: StringConstructor;
+            title: StringConstructor;
+            filterable: BooleanConstructor;
+            format: ObjectConstructor;
+            filterMethod: FunctionConstructor;
+            defaultChecked: ArrayConstructor;
+            props: ObjectConstructor;
+        }>> & {
+            "onChecked-change"?: ((...args: any[]) => any) | undefined;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "data" | "filterable">;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        };
+        $slots: Readonly<{
+            [name: string]: import("vue").Slot | undefined;
+        }>;
+        $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
+        $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
+        $emit: (event: "checked-change", ...args: any[]) => void;
+        $el: any;
+        $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+            data: {
+                type: ArrayConstructor;
+                default(): never[];
+            };
+            optionRender: FunctionConstructor;
+            placeholder: StringConstructor;
+            title: StringConstructor;
+            filterable: BooleanConstructor;
+            format: ObjectConstructor;
+            filterMethod: FunctionConstructor;
+            defaultChecked: ArrayConstructor;
+            props: ObjectConstructor;
+        }>> & {
+            "onChecked-change"?: ((...args: any[]) => any) | undefined;
+        }, {
+            labelProp: import("vue").ComputedRef<any>;
+            keyProp: import("vue").ComputedRef<any>;
+            disabledProp: import("vue").ComputedRef<any>;
+            filteredData: import("vue").ComputedRef<unknown[]>;
+            checkedSummary: import("vue").ComputedRef<any>;
+            isIndeterminate: import("vue").ComputedRef<boolean>;
+            handleAllCheckedChange: (value: import("./src/transfer").Key[]) => void;
+            checked: import("vue").Ref<never[]>;
+            allChecked: import("vue").Ref<boolean>;
+            query: import("vue").Ref<string>;
+            inputHover: import("vue").Ref<boolean>;
+            checkChangeByUser: import("vue").Ref<boolean>;
+            hasNoMatch: import("vue").ComputedRef<boolean>;
+            SearchIcon: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+            hasFooter: import("vue").ComputedRef<boolean>;
+            t: import("../..").Translator;
+        }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "checked-change"[], string, {
+            data: unknown[];
+            filterable: boolean;
+        }> & {
+            beforeCreate?: ((() => void) | (() => void)[]) | undefined;
+            created?: ((() => void) | (() => void)[]) | undefined;
+            beforeMount?: ((() => void) | (() => void)[]) | undefined;
+            mounted?: ((() => void) | (() => void)[]) | undefined;
+            beforeUpdate?: ((() => void) | (() => void)[]) | undefined;
+            updated?: ((() => void) | (() => void)[]) | undefined;
+            activated?: ((() => void) | (() => void)[]) | undefined;
+            deactivated?: ((() => void) | (() => void)[]) | undefined;
+            beforeDestroy?: ((() => void) | (() => void)[]) | undefined;
+            beforeUnmount?: ((() => void) | (() => void)[]) | undefined;
+            destroyed?: ((() => void) | (() => void)[]) | undefined;
+            unmounted?: ((() => void) | (() => void)[]) | undefined;
+            renderTracked?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
+            renderTriggered?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
+            errorCaptured?: (((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void)[]) | undefined;
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import("vue").nextTick;
+        $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
+    } & Readonly<import("vue").ExtractPropTypes<{
+        data: {
+            type: ArrayConstructor;
+            default(): never[];
+        };
+        optionRender: FunctionConstructor;
+        placeholder: StringConstructor;
+        title: StringConstructor;
+        filterable: BooleanConstructor;
+        format: ObjectConstructor;
+        filterMethod: FunctionConstructor;
+        defaultChecked: ArrayConstructor;
+        props: ObjectConstructor;
+    }>> & {
+        "onChecked-change"?: ((...args: any[]) => any) | undefined;
+    } & import("vue").ShallowUnwrapRef<{
+        labelProp: import("vue").ComputedRef<any>;
+        keyProp: import("vue").ComputedRef<any>;
+        disabledProp: import("vue").ComputedRef<any>;
+        filteredData: import("vue").ComputedRef<unknown[]>;
+        checkedSummary: import("vue").ComputedRef<any>;
+        isIndeterminate: import("vue").ComputedRef<boolean>;
+        handleAllCheckedChange: (value: import("./src/transfer").Key[]) => void;
+        checked: import("vue").Ref<never[]>;
+        allChecked: import("vue").Ref<boolean>;
+        query: import("vue").Ref<string>;
+        inputHover: import("vue").Ref<boolean>;
+        checkChangeByUser: import("vue").Ref<boolean>;
+        hasNoMatch: import("vue").ComputedRef<boolean>;
+        SearchIcon: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+        hasFooter: import("vue").ComputedRef<boolean>;
+        t: import("../..").Translator;
+    }> & {} & {} & import("vue").ComponentCustomProperties) | undefined>;
     optionRender: import("vue").ComputedRef<(option: any) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
@@ -205,6 +451,252 @@ export declare const ElTransfer: SFCWithInstall<import("vue").DefineComponent<{
     rightPanelTitle: import("vue").ComputedRef<string>;
     panelFilterPlaceholder: import("vue").ComputedRef<string>;
     clearQuery: (which: "right" | "left") => void;
+    leftPanel: import("vue").Ref<({
+        $: import("vue").ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            data: unknown[];
+            filterable: boolean;
+        }> & Omit<Readonly<import("vue").ExtractPropTypes<{
+            data: {
+                type: ArrayConstructor;
+                default(): never[];
+            };
+            optionRender: FunctionConstructor;
+            placeholder: StringConstructor;
+            title: StringConstructor;
+            filterable: BooleanConstructor;
+            format: ObjectConstructor;
+            filterMethod: FunctionConstructor;
+            defaultChecked: ArrayConstructor;
+            props: ObjectConstructor;
+        }>> & {
+            "onChecked-change"?: ((...args: any[]) => any) | undefined;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "data" | "filterable">;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        };
+        $slots: Readonly<{
+            [name: string]: import("vue").Slot | undefined;
+        }>;
+        $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
+        $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
+        $emit: (event: "checked-change", ...args: any[]) => void;
+        $el: any;
+        $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+            data: {
+                type: ArrayConstructor;
+                default(): never[];
+            };
+            optionRender: FunctionConstructor;
+            placeholder: StringConstructor;
+            title: StringConstructor;
+            filterable: BooleanConstructor;
+            format: ObjectConstructor;
+            filterMethod: FunctionConstructor;
+            defaultChecked: ArrayConstructor;
+            props: ObjectConstructor;
+        }>> & {
+            "onChecked-change"?: ((...args: any[]) => any) | undefined;
+        }, {
+            labelProp: import("vue").ComputedRef<any>;
+            keyProp: import("vue").ComputedRef<any>;
+            disabledProp: import("vue").ComputedRef<any>;
+            filteredData: import("vue").ComputedRef<unknown[]>;
+            checkedSummary: import("vue").ComputedRef<any>;
+            isIndeterminate: import("vue").ComputedRef<boolean>;
+            handleAllCheckedChange: (value: import("./src/transfer").Key[]) => void;
+            checked: import("vue").Ref<never[]>;
+            allChecked: import("vue").Ref<boolean>;
+            query: import("vue").Ref<string>;
+            inputHover: import("vue").Ref<boolean>;
+            checkChangeByUser: import("vue").Ref<boolean>;
+            hasNoMatch: import("vue").ComputedRef<boolean>;
+            SearchIcon: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+            hasFooter: import("vue").ComputedRef<boolean>;
+            t: import("../..").Translator;
+        }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "checked-change"[], string, {
+            data: unknown[];
+            filterable: boolean;
+        }> & {
+            beforeCreate?: ((() => void) | (() => void)[]) | undefined;
+            created?: ((() => void) | (() => void)[]) | undefined;
+            beforeMount?: ((() => void) | (() => void)[]) | undefined;
+            mounted?: ((() => void) | (() => void)[]) | undefined;
+            beforeUpdate?: ((() => void) | (() => void)[]) | undefined;
+            updated?: ((() => void) | (() => void)[]) | undefined;
+            activated?: ((() => void) | (() => void)[]) | undefined;
+            deactivated?: ((() => void) | (() => void)[]) | undefined;
+            beforeDestroy?: ((() => void) | (() => void)[]) | undefined;
+            beforeUnmount?: ((() => void) | (() => void)[]) | undefined;
+            destroyed?: ((() => void) | (() => void)[]) | undefined;
+            unmounted?: ((() => void) | (() => void)[]) | undefined;
+            renderTracked?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
+            renderTriggered?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
+            errorCaptured?: (((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void)[]) | undefined;
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import("vue").nextTick;
+        $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
+    } & Readonly<import("vue").ExtractPropTypes<{
+        data: {
+            type: ArrayConstructor;
+            default(): never[];
+        };
+        optionRender: FunctionConstructor;
+        placeholder: StringConstructor;
+        title: StringConstructor;
+        filterable: BooleanConstructor;
+        format: ObjectConstructor;
+        filterMethod: FunctionConstructor;
+        defaultChecked: ArrayConstructor;
+        props: ObjectConstructor;
+    }>> & {
+        "onChecked-change"?: ((...args: any[]) => any) | undefined;
+    } & import("vue").ShallowUnwrapRef<{
+        labelProp: import("vue").ComputedRef<any>;
+        keyProp: import("vue").ComputedRef<any>;
+        disabledProp: import("vue").ComputedRef<any>;
+        filteredData: import("vue").ComputedRef<unknown[]>;
+        checkedSummary: import("vue").ComputedRef<any>;
+        isIndeterminate: import("vue").ComputedRef<boolean>;
+        handleAllCheckedChange: (value: import("./src/transfer").Key[]) => void;
+        checked: import("vue").Ref<never[]>;
+        allChecked: import("vue").Ref<boolean>;
+        query: import("vue").Ref<string>;
+        inputHover: import("vue").Ref<boolean>;
+        checkChangeByUser: import("vue").Ref<boolean>;
+        hasNoMatch: import("vue").ComputedRef<boolean>;
+        SearchIcon: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+        hasFooter: import("vue").ComputedRef<boolean>;
+        t: import("../..").Translator;
+    }> & {} & {} & import("vue").ComponentCustomProperties) | undefined>;
+    rightPanel: import("vue").Ref<({
+        $: import("vue").ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            data: unknown[];
+            filterable: boolean;
+        }> & Omit<Readonly<import("vue").ExtractPropTypes<{
+            data: {
+                type: ArrayConstructor;
+                default(): never[];
+            };
+            optionRender: FunctionConstructor;
+            placeholder: StringConstructor;
+            title: StringConstructor;
+            filterable: BooleanConstructor;
+            format: ObjectConstructor;
+            filterMethod: FunctionConstructor;
+            defaultChecked: ArrayConstructor;
+            props: ObjectConstructor;
+        }>> & {
+            "onChecked-change"?: ((...args: any[]) => any) | undefined;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "data" | "filterable">;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        };
+        $slots: Readonly<{
+            [name: string]: import("vue").Slot | undefined;
+        }>;
+        $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
+        $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
+        $emit: (event: "checked-change", ...args: any[]) => void;
+        $el: any;
+        $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+            data: {
+                type: ArrayConstructor;
+                default(): never[];
+            };
+            optionRender: FunctionConstructor;
+            placeholder: StringConstructor;
+            title: StringConstructor;
+            filterable: BooleanConstructor;
+            format: ObjectConstructor;
+            filterMethod: FunctionConstructor;
+            defaultChecked: ArrayConstructor;
+            props: ObjectConstructor;
+        }>> & {
+            "onChecked-change"?: ((...args: any[]) => any) | undefined;
+        }, {
+            labelProp: import("vue").ComputedRef<any>;
+            keyProp: import("vue").ComputedRef<any>;
+            disabledProp: import("vue").ComputedRef<any>;
+            filteredData: import("vue").ComputedRef<unknown[]>;
+            checkedSummary: import("vue").ComputedRef<any>;
+            isIndeterminate: import("vue").ComputedRef<boolean>;
+            handleAllCheckedChange: (value: import("./src/transfer").Key[]) => void;
+            checked: import("vue").Ref<never[]>;
+            allChecked: import("vue").Ref<boolean>;
+            query: import("vue").Ref<string>;
+            inputHover: import("vue").Ref<boolean>;
+            checkChangeByUser: import("vue").Ref<boolean>;
+            hasNoMatch: import("vue").ComputedRef<boolean>;
+            SearchIcon: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+            hasFooter: import("vue").ComputedRef<boolean>;
+            t: import("../..").Translator;
+        }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "checked-change"[], string, {
+            data: unknown[];
+            filterable: boolean;
+        }> & {
+            beforeCreate?: ((() => void) | (() => void)[]) | undefined;
+            created?: ((() => void) | (() => void)[]) | undefined;
+            beforeMount?: ((() => void) | (() => void)[]) | undefined;
+            mounted?: ((() => void) | (() => void)[]) | undefined;
+            beforeUpdate?: ((() => void) | (() => void)[]) | undefined;
+            updated?: ((() => void) | (() => void)[]) | undefined;
+            activated?: ((() => void) | (() => void)[]) | undefined;
+            deactivated?: ((() => void) | (() => void)[]) | undefined;
+            beforeDestroy?: ((() => void) | (() => void)[]) | undefined;
+            beforeUnmount?: ((() => void) | (() => void)[]) | undefined;
+            destroyed?: ((() => void) | (() => void)[]) | undefined;
+            unmounted?: ((() => void) | (() => void)[]) | undefined;
+            renderTracked?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
+            renderTriggered?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
+            errorCaptured?: (((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void)[]) | undefined;
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import("vue").nextTick;
+        $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
+    } & Readonly<import("vue").ExtractPropTypes<{
+        data: {
+            type: ArrayConstructor;
+            default(): never[];
+        };
+        optionRender: FunctionConstructor;
+        placeholder: StringConstructor;
+        title: StringConstructor;
+        filterable: BooleanConstructor;
+        format: ObjectConstructor;
+        filterMethod: FunctionConstructor;
+        defaultChecked: ArrayConstructor;
+        props: ObjectConstructor;
+    }>> & {
+        "onChecked-change"?: ((...args: any[]) => any) | undefined;
+    } & import("vue").ShallowUnwrapRef<{
+        labelProp: import("vue").ComputedRef<any>;
+        keyProp: import("vue").ComputedRef<any>;
+        disabledProp: import("vue").ComputedRef<any>;
+        filteredData: import("vue").ComputedRef<unknown[]>;
+        checkedSummary: import("vue").ComputedRef<any>;
+        isIndeterminate: import("vue").ComputedRef<boolean>;
+        handleAllCheckedChange: (value: import("./src/transfer").Key[]) => void;
+        checked: import("vue").Ref<never[]>;
+        allChecked: import("vue").Ref<boolean>;
+        query: import("vue").Ref<string>;
+        inputHover: import("vue").Ref<boolean>;
+        checkChangeByUser: import("vue").Ref<boolean>;
+        hasNoMatch: import("vue").ComputedRef<boolean>;
+        SearchIcon: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+        hasFooter: import("vue").ComputedRef<boolean>;
+        t: import("../..").Translator;
+    }> & {} & {} & import("vue").ComponentCustomProperties) | undefined>;
     optionRender: import("vue").ComputedRef<(option: any) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {

package/es/components/transfer/src/index.mjs

@@ -94,13 +94,16 @@ const _sfc_main = defineComponent({
     const { propsKey, sourceData, targetData } = useComputedData(props);
     const { onSourceCheckedChange, onTargetCheckedChange } = useCheckedChange(checkedState, emit);
     const { addToLeft, addToRight } = useMove(props, checkedState, propsKey, emit);
-    const leftPanel = ref(null);
-    const rightPanel = ref(null);
+    const leftPanel = ref();
+    const rightPanel = ref();
     const clearQuery = (which) => {
-      if (which === "left") {
-        leftPanel.value.query = "";
-      } else if (which === "right") {
-        rightPanel.value.query = "";
+      switch (which) {
+        case "left":
+          leftPanel.value.query = "";
+          break;
+        case "right":
+          rightPanel.value.query = "";
+          break;
       }
     };
     const hasButtonTexts = computed(() => props.buttonTexts.length === 2);
@@ -131,6 +134,8 @@ const _sfc_main = defineComponent({
       rightPanelTitle,
       panelFilterPlaceholder,
       clearQuery,
+      leftPanel,
+      rightPanel,
       optionRender
     };
   }

package/es/components/transfer/src/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../../packages/components/transfer/src/index.vue"],"sourcesContent":["<template>\n  <div class=\"el-transfer\">\n    <transfer-panel\n      ref=\"leftPanel\"\n      :data=\"sourceData\"\n      :option-render=\"optionRender\"\n      :placeholder=\"panelFilterPlaceholder\"\n      :title=\"leftPanelTitle\"\n      :filterable=\"filterable\"\n      :format=\"format\"\n      :filter-method=\"filterMethod\"\n      :default-checked=\"leftDefaultChecked\"\n      :props=\"props\"\n      @checked-change=\"onSourceCheckedChange\"\n    >\n      <slot name=\"left-footer\"></slot>\n    </transfer-panel>\n    <div class=\"el-transfer__buttons\">\n      <el-button\n        type=\"primary\"\n        :class=\"['el-transfer__button', hasButtonTexts ? 'is-with-texts' : '']\"\n        :disabled=\"rightChecked.length === 0\"\n        @click=\"addToLeft\"\n      >\n        <el-icon><arrow-left /></el-icon>\n        <span v-if=\"buttonTexts[0] !== undefined\">{{ buttonTexts[0] }}</span>\n      </el-button>\n      <el-button\n        type=\"primary\"\n        :class=\"['el-transfer__button', hasButtonTexts ? 'is-with-texts' : '']\"\n        :disabled=\"leftChecked.length === 0\"\n        @click=\"addToRight\"\n      >\n        <span v-if=\"buttonTexts[1] !== undefined\">{{ buttonTexts[1] }}</span>\n        <el-icon><arrow-right /></el-icon>\n      </el-button>\n    </div>\n    <transfer-panel\n      ref=\"rightPanel\"\n      :data=\"targetData\"\n      :option-render=\"optionRender\"\n      :placeholder=\"panelFilterPlaceholder\"\n      :filterable=\"filterable\"\n      :format=\"format\"\n      :filter-method=\"filterMethod\"\n      :title=\"rightPanelTitle\"\n      :default-checked=\"rightDefaultChecked\"\n      :props=\"props\"\n      @checked-change=\"onTargetCheckedChange\"\n    >\n      <slot name=\"right-footer\"></slot>\n    </transfer-panel>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  inject,\n  h,\n  reactive,\n  ref,\n  toRefs,\n  watch,\n} from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport ElIcon from '@element-plus/components/icon'\nimport { elFormItemKey } from '@element-plus/tokens'\nimport { useLocale } from '@element-plus/hooks'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { ArrowLeft, ArrowRight } from '@element-plus/icons-vue'\nimport TransferPanel from './transfer-panel.vue'\nimport { useComputedData } from './useComputedData'\nimport {\n  useCheckedChange,\n  LEFT_CHECK_CHANGE_EVENT,\n  RIGHT_CHECK_CHANGE_EVENT,\n} from './useCheckedChange'\nimport { useMove } from './useMove'\nimport { CHANGE_EVENT } from './transfer'\n\nimport type { PropType, VNode } from 'vue'\nimport type { ElFormItemContext } from '@element-plus/tokens'\nimport type { DataItem, Format, Key, Props, TargetOrder } from './transfer'\n\nexport default defineComponent({\n  name: 'ElTransfer',\n\n  components: {\n    TransferPanel,\n    ElButton,\n    ElIcon,\n    ArrowLeft,\n    ArrowRight,\n  },\n\n  props: {\n    data: {\n      type: Array as PropType<DataItem[]>,\n      default: () => [],\n    },\n    titles: {\n      type: Array as PropType<any> as PropType<[string, string]>,\n      default: () => [],\n    },\n    buttonTexts: {\n      type: Array as PropType<any> as PropType<[string, string]>,\n      default: () => [],\n    },\n    filterPlaceholder: {\n      type: String,\n      default: '',\n    },\n    filterMethod: Function as PropType<\n      (query: string, item: DataItem) => boolean\n    >,\n    leftDefaultChecked: {\n      type: Array as PropType<Key[]>,\n      default: () => [],\n    },\n    rightDefaultChecked: {\n      type: Array as PropType<Key[]>,\n      default: () => [],\n    },\n    renderContent: Function as PropType<(h, option) => VNode>,\n    modelValue: {\n      type: Array as PropType<Key[]>,\n      default: () => [],\n    },\n    format: {\n      type: Object as PropType<Format>,\n      default: () => ({}),\n    },\n    filterable: {\n      type: Boolean,\n      default: false,\n    },\n    props: {\n      type: Object as PropType<Props>,\n      default: () => ({\n        label: 'label',\n        key: 'key',\n        disabled: 'disabled',\n      }),\n    },\n    targetOrder: {\n      type: String as PropType<TargetOrder>,\n      default: 'original',\n      validator: (val: string) => {\n        return ['original', 'push', 'unshift'].includes(val)\n      },\n    },\n  },\n\n  emits: [\n    UPDATE_MODEL_EVENT,\n    CHANGE_EVENT,\n    LEFT_CHECK_CHANGE_EVENT,\n    RIGHT_CHECK_CHANGE_EVENT,\n  ],\n\n  setup(props, { emit, slots }) {\n    const { t } = useLocale()\n    const elFormItem = inject(elFormItemKey, {} as ElFormItemContext)\n\n    const checkedState = reactive({\n      leftChecked: [],\n      rightChecked: [],\n    })\n\n    const { propsKey, sourceData, targetData } = useComputedData(props)\n\n    const { onSourceCheckedChange, onTargetCheckedChange } = useCheckedChange(\n      checkedState,\n      emit\n    )\n\n    const { addToLeft, addToRight } = useMove(\n      props,\n      checkedState,\n      propsKey,\n      emit\n    )\n\n    const leftPanel = ref(null)\n    const rightPanel = ref(null)\n\n    const clearQuery = (which: 'left' | 'right') => {\n      if (which === 'left') {\n        leftPanel.value.query = ''\n      } else if (which === 'right') {\n        rightPanel.value.query = ''\n      }\n    }\n\n    const hasButtonTexts = computed(() => props.buttonTexts.length === 2)\n\n    const leftPanelTitle = computed(\n      () => props.titles[0] || t('el.transfer.titles.0')\n    )\n\n    const rightPanelTitle = computed(\n      () => props.titles[1] || t('el.transfer.titles.1')\n    )\n\n    const panelFilterPlaceholder = computed(\n      () => props.filterPlaceholder || t('el.transfer.filterPlaceholder')\n    )\n\n    watch(\n      () => props.modelValue,\n      () => {\n        elFormItem.validate?.('change')\n      }\n    )\n\n    const optionRender = computed(() => (option) => {\n      if (props.renderContent) return props.renderContent(h, option)\n\n      if (slots.default) return slots.default({ option })\n\n      return h('span', option[props.props.label] || option[props.props.key])\n    })\n\n    return {\n      sourceData,\n      targetData,\n      onSourceCheckedChange,\n      onTargetCheckedChange,\n      addToLeft,\n      addToRight,\n\n      ...toRefs(checkedState),\n\n      hasButtonTexts,\n      leftPanelTitle,\n      rightPanelTitle,\n      panelFilterPlaceholder,\n      clearQuery,\n\n      optionRender,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../../../../../packages/components/transfer/src/index.vue"],"sourcesContent":["<template>\n  <div class=\"el-transfer\">\n    <transfer-panel\n      ref=\"leftPanel\"\n      :data=\"sourceData\"\n      :option-render=\"optionRender\"\n      :placeholder=\"panelFilterPlaceholder\"\n      :title=\"leftPanelTitle\"\n      :filterable=\"filterable\"\n      :format=\"format\"\n      :filter-method=\"filterMethod\"\n      :default-checked=\"leftDefaultChecked\"\n      :props=\"props\"\n      @checked-change=\"onSourceCheckedChange\"\n    >\n      <slot name=\"left-footer\"></slot>\n    </transfer-panel>\n    <div class=\"el-transfer__buttons\">\n      <el-button\n        type=\"primary\"\n        :class=\"['el-transfer__button', hasButtonTexts ? 'is-with-texts' : '']\"\n        :disabled=\"rightChecked.length === 0\"\n        @click=\"addToLeft\"\n      >\n        <el-icon><arrow-left /></el-icon>\n        <span v-if=\"buttonTexts[0] !== undefined\">{{ buttonTexts[0] }}</span>\n      </el-button>\n      <el-button\n        type=\"primary\"\n        :class=\"['el-transfer__button', hasButtonTexts ? 'is-with-texts' : '']\"\n        :disabled=\"leftChecked.length === 0\"\n        @click=\"addToRight\"\n      >\n        <span v-if=\"buttonTexts[1] !== undefined\">{{ buttonTexts[1] }}</span>\n        <el-icon><arrow-right /></el-icon>\n      </el-button>\n    </div>\n    <transfer-panel\n      ref=\"rightPanel\"\n      :data=\"targetData\"\n      :option-render=\"optionRender\"\n      :placeholder=\"panelFilterPlaceholder\"\n      :filterable=\"filterable\"\n      :format=\"format\"\n      :filter-method=\"filterMethod\"\n      :title=\"rightPanelTitle\"\n      :default-checked=\"rightDefaultChecked\"\n      :props=\"props\"\n      @checked-change=\"onTargetCheckedChange\"\n    >\n      <slot name=\"right-footer\"></slot>\n    </transfer-panel>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  inject,\n  h,\n  reactive,\n  ref,\n  toRefs,\n  watch,\n} from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport ElIcon from '@element-plus/components/icon'\nimport { elFormItemKey } from '@element-plus/tokens'\nimport { useLocale } from '@element-plus/hooks'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { ArrowLeft, ArrowRight } from '@element-plus/icons-vue'\nimport TransferPanel from './transfer-panel.vue'\nimport { useComputedData } from './useComputedData'\nimport {\n  useCheckedChange,\n  LEFT_CHECK_CHANGE_EVENT,\n  RIGHT_CHECK_CHANGE_EVENT,\n} from './useCheckedChange'\nimport { useMove } from './useMove'\nimport { CHANGE_EVENT } from './transfer'\n\nimport type { PropType, VNode } from 'vue'\nimport type { ElFormItemContext } from '@element-plus/tokens'\nimport type { DataItem, Format, Key, Props, TargetOrder } from './transfer'\n\ntype TransferType = InstanceType<typeof TransferPanel>\n\nexport default defineComponent({\n  name: 'ElTransfer',\n\n  components: {\n    TransferPanel,\n    ElButton,\n    ElIcon,\n    ArrowLeft,\n    ArrowRight,\n  },\n\n  props: {\n    data: {\n      type: Array as PropType<DataItem[]>,\n      default: () => [],\n    },\n    titles: {\n      type: Array as PropType<any> as PropType<[string, string]>,\n      default: () => [],\n    },\n    buttonTexts: {\n      type: Array as PropType<any> as PropType<[string, string]>,\n      default: () => [],\n    },\n    filterPlaceholder: {\n      type: String,\n      default: '',\n    },\n    filterMethod: Function as PropType<\n      (query: string, item: DataItem) => boolean\n    >,\n    leftDefaultChecked: {\n      type: Array as PropType<Key[]>,\n      default: () => [],\n    },\n    rightDefaultChecked: {\n      type: Array as PropType<Key[]>,\n      default: () => [],\n    },\n    renderContent: Function as PropType<(h, option) => VNode>,\n    modelValue: {\n      type: Array as PropType<Key[]>,\n      default: () => [],\n    },\n    format: {\n      type: Object as PropType<Format>,\n      default: () => ({}),\n    },\n    filterable: {\n      type: Boolean,\n      default: false,\n    },\n    props: {\n      type: Object as PropType<Props>,\n      default: () => ({\n        label: 'label',\n        key: 'key',\n        disabled: 'disabled',\n      }),\n    },\n    targetOrder: {\n      type: String as PropType<TargetOrder>,\n      default: 'original',\n      validator: (val: string) => {\n        return ['original', 'push', 'unshift'].includes(val)\n      },\n    },\n  },\n\n  emits: [\n    UPDATE_MODEL_EVENT,\n    CHANGE_EVENT,\n    LEFT_CHECK_CHANGE_EVENT,\n    RIGHT_CHECK_CHANGE_EVENT,\n  ],\n\n  setup(props, { emit, slots }) {\n    const { t } = useLocale()\n    const elFormItem = inject(elFormItemKey, {} as ElFormItemContext)\n\n    const checkedState = reactive({\n      leftChecked: [],\n      rightChecked: [],\n    })\n\n    const { propsKey, sourceData, targetData } = useComputedData(props)\n\n    const { onSourceCheckedChange, onTargetCheckedChange } = useCheckedChange(\n      checkedState,\n      emit\n    )\n\n    const { addToLeft, addToRight } = useMove(\n      props,\n      checkedState,\n      propsKey,\n      emit\n    )\n\n    const leftPanel = ref<TransferType>()\n    const rightPanel = ref<TransferType>()\n\n    const clearQuery = (which: 'left' | 'right') => {\n      switch (which) {\n        case 'left':\n          leftPanel.value!.query = ''\n          break\n        case 'right':\n          rightPanel.value!.query = ''\n          break\n      }\n    }\n\n    const hasButtonTexts = computed(() => props.buttonTexts.length === 2)\n\n    const leftPanelTitle = computed(\n      () => props.titles[0] || t('el.transfer.titles.0')\n    )\n\n    const rightPanelTitle = computed(\n      () => props.titles[1] || t('el.transfer.titles.1')\n    )\n\n    const panelFilterPlaceholder = computed(\n      () => props.filterPlaceholder || t('el.transfer.filterPlaceholder')\n    )\n\n    watch(\n      () => props.modelValue,\n      () => {\n        elFormItem.validate?.('change')\n      }\n    )\n\n    const optionRender = computed(() => (option) => {\n      if (props.renderContent) return props.renderContent(h, option)\n\n      if (slots.default) return slots.default({ option })\n\n      return h('span', option[props.props.label] || option[props.props.key])\n    })\n\n    return {\n      sourceData,\n      targetData,\n      onSourceCheckedChange,\n      onTargetCheckedChange,\n      addToLeft,\n      addToRight,\n\n      ...toRefs(checkedState),\n\n      hasButtonTexts,\n      leftPanelTitle,\n      rightPanelTitle,\n      panelFilterPlaceholder,\n      clearQuery,\n      leftPanel,\n      rightPanel,\n\n      optionRender,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":"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"}