x-next 1.5.0 → 1.7.0

package/dist/components/image/index.d.ts

@@ -56,10 +56,13 @@ export declare const Image: {
             type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
         };
     }>> & Readonly<{
-        "onPreview-visible-change"?: ((...args: any[]) => any) | undefined;
-        "onUpdate:previewVisible"?: ((...args: any[]) => any) | undefined;
+        onError?: ((_event: Event) => any) | undefined;
+        onLoad?: ((_event: Event) => any) | undefined;
+        "onPreview-visible-change"?: ((_visible: boolean) => any) | undefined;
+        "onUpdate:previewVisible"?: ((_visible: boolean) => any) | undefined;
     }>, {
-        refImg: import('vue').Ref<any, any>;
+        t: (key: import('../../index.ts').LocaleKey | (string & {}), params?: Record<string, string | number>) => string;
+        refImg: import('vue').Ref<HTMLImageElement | undefined, HTMLImageElement | undefined>;
         className: {
             block: string;
             element: (className: string) => string;
@@ -68,10 +71,13 @@ export declare const Image: {
         };
         wrapperClassNames: import('vue').ComputedRef<unknown[]>;
         wrapperStyles: import('vue').ComputedRef<import('vue').StyleValue[]>;
+        overlayStyles: import('vue').ComputedRef<{
+            height: string | undefined;
+        }>;
         showFooter: import('vue').ComputedRef<boolean>;
         imgProps: import('vue').ComputedRef<Omit<{
             [x: string]: unknown;
-        }, "class" | "style">>;
+        }, "class" | "style" | "src">>;
         imgStyle: import('vue').ComputedRef<{
             width: string | undefined;
             height: string | undefined;
@@ -81,17 +87,24 @@ export declare const Image: {
         isLoading: import('vue').ComputedRef<boolean>;
         mergedPreviewVisible: import('vue').ComputedRef<boolean>;
         mergePreview: import('vue').ComputedRef<boolean>;
-        onImgLoaded: () => void;
-        onImgLoadError: () => void;
+        canOpenPreview: import('vue').ComputedRef<boolean>;
+        onImgLoaded: (event: Event) => void;
+        onImgLoadError: (event: Event) => void;
         onImgClick: () => void;
+        onImgKeydown: (event: KeyboardEvent) => void;
         onPreviewClose: () => void;
         fitStyle: import('vue').ComputedRef<import('vue').CSSProperties>;
-    }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("preview-visible-change" | "update:previewVisible")[], import('vue').PublicProps, {
+    }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+        'preview-visible-change': (_visible: boolean) => true;
+        'update:previewVisible': (_visible: boolean) => true;
+        load: (_event: Event) => true;
+        error: (_event: Event) => true;
+    }, import('vue').PublicProps, {
+        preview: boolean;
         hideFooter: boolean | "never";
         renderToBody: boolean;
         footerPosition: "outer" | "inner";
         showLoader: boolean;
-        preview: boolean;
         previewVisible: boolean;
         defaultPreviewVisible: boolean;
     }, true, {}, {}, {
@@ -347,6 +360,9 @@ export declare const Image: {
                 default: number;
             };
         }>, {
+            rootAttrs: import('vue').ComputedRef<{
+                [k: string]: unknown;
+            }>;
             t: (key: import('../../index.ts').LocaleKey | (string & {}), params?: Record<string, string | number>) => string;
             className: {
                 block: string;
@@ -367,9 +383,10 @@ export declare const Image: {
             mergedVisible: import('vue').ComputedRef<boolean>;
             isLoading: import('vue').ComputedRef<boolean>;
             isLoaded: import('vue').ComputedRef<boolean>;
+            isError: import('vue').ComputedRef<boolean>;
             scaleValueVisible: import('vue').Ref<boolean, boolean>;
-            refWrapper: import('vue').Ref<any, any>;
-            refImage: import('vue').Ref<any, any>;
+            refWrapper: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
+            refImage: import('vue').Ref<HTMLImageElement | undefined, HTMLImageElement | undefined>;
             mounted: import('vue').Ref<boolean, boolean>;
             onWheel: {
                 (...args: any[]): void;
@@ -377,8 +394,9 @@ export declare const Image: {
             };
             onMaskClick: (e: MouseEvent) => void;
             onCloseClick: () => void;
-            onImgLoad(): void;
-            onImgError(): void;
+            onDialogKeydown: (event: KeyboardEvent) => void;
+            onImgLoad(event: Event): void;
+            onImgError(event: Event): void;
             actions: import('vue').ComputedRef<({
                 key: string;
                 name: string;
@@ -886,12 +904,12 @@ export declare const Image: {
                         }, import('vue').PublicProps, {
                             mini: boolean;
                             disabled: boolean;
+                            trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                             position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                             animationName: string;
                             autoFitPosition: boolean;
                             popupVisible: boolean;
                             defaultPopupVisible: boolean;
-                            trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                             popupOffset: number;
                             showArrow: boolean;
                             alignPoint: boolean;
@@ -1072,12 +1090,12 @@ export declare const Image: {
                         }>, () => VNode, {}, {}, {}, {
                             mini: boolean;
                             disabled: boolean;
+                            trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                             position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                             animationName: string;
                             autoFitPosition: boolean;
                             popupVisible: boolean;
                             defaultPopupVisible: boolean;
-                            trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                             popupOffset: number;
                             showArrow: boolean;
                             alignPoint: boolean;
@@ -1261,12 +1279,12 @@ export declare const Image: {
                     }, string, {
                         mini: boolean;
                         disabled: boolean;
+                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                         animationName: string;
                         autoFitPosition: boolean;
                         popupVisible: boolean;
                         defaultPopupVisible: boolean;
-                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         popupOffset: number;
                         showArrow: boolean;
                         alignPoint: boolean;
@@ -1461,6 +1479,91 @@ export declare const Image: {
                 strokeWidth: string | number;
                 fillColor: unknown[];
             }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+            IconImageClose: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+                fillColor: {
+                    type: ArrayConstructor;
+                    default: undefined;
+                };
+                name: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                size: {
+                    type: (StringConstructor | NumberConstructor)[];
+                    default: undefined;
+                };
+                rotate: {
+                    type: NumberConstructor;
+                    default: undefined;
+                };
+                spin: {
+                    type: BooleanConstructor;
+                    default: boolean;
+                };
+                color: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                title: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                ariaLabel: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                strokeWidth: {
+                    type: (StringConstructor | NumberConstructor)[];
+                    default: undefined;
+                };
+            }>, () => VNode, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+                fillColor: {
+                    type: ArrayConstructor;
+                    default: undefined;
+                };
+                name: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                size: {
+                    type: (StringConstructor | NumberConstructor)[];
+                    default: undefined;
+                };
+                rotate: {
+                    type: NumberConstructor;
+                    default: undefined;
+                };
+                spin: {
+                    type: BooleanConstructor;
+                    default: boolean;
+                };
+                color: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                title: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                ariaLabel: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                strokeWidth: {
+                    type: (StringConstructor | NumberConstructor)[];
+                    default: undefined;
+                };
+            }>> & Readonly<{}>, {
+                name: string;
+                title: string;
+                size: string | number;
+                rotate: number;
+                spin: boolean;
+                color: string;
+                ariaLabel: string;
+                strokeWidth: string | number;
+                fillColor: unknown[];
+            }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
         }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
     } & import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
         P: {};
@@ -1526,10 +1629,13 @@ export declare const Image: {
             type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
         };
     }>> & Readonly<{
-        "onPreview-visible-change"?: ((...args: any[]) => any) | undefined;
-        "onUpdate:previewVisible"?: ((...args: any[]) => any) | undefined;
+        onError?: ((_event: Event) => any) | undefined;
+        onLoad?: ((_event: Event) => any) | undefined;
+        "onPreview-visible-change"?: ((_visible: boolean) => any) | undefined;
+        "onUpdate:previewVisible"?: ((_visible: boolean) => any) | undefined;
     }>, {
-        refImg: import('vue').Ref<any, any>;
+        t: (key: import('../../index.ts').LocaleKey | (string & {}), params?: Record<string, string | number>) => string;
+        refImg: import('vue').Ref<HTMLImageElement | undefined, HTMLImageElement | undefined>;
         className: {
             block: string;
             element: (className: string) => string;
@@ -1538,10 +1644,13 @@ export declare const Image: {
         };
         wrapperClassNames: import('vue').ComputedRef<unknown[]>;
         wrapperStyles: import('vue').ComputedRef<import('vue').StyleValue[]>;
+        overlayStyles: import('vue').ComputedRef<{
+            height: string | undefined;
+        }>;
         showFooter: import('vue').ComputedRef<boolean>;
         imgProps: import('vue').ComputedRef<Omit<{
             [x: string]: unknown;
-        }, "class" | "style">>;
+        }, "class" | "style" | "src">>;
         imgStyle: import('vue').ComputedRef<{
             width: string | undefined;
             height: string | undefined;
@@ -1551,17 +1660,19 @@ export declare const Image: {
         isLoading: import('vue').ComputedRef<boolean>;
         mergedPreviewVisible: import('vue').ComputedRef<boolean>;
         mergePreview: import('vue').ComputedRef<boolean>;
-        onImgLoaded: () => void;
-        onImgLoadError: () => void;
+        canOpenPreview: import('vue').ComputedRef<boolean>;
+        onImgLoaded: (event: Event) => void;
+        onImgLoadError: (event: Event) => void;
         onImgClick: () => void;
+        onImgKeydown: (event: KeyboardEvent) => void;
         onPreviewClose: () => void;
         fitStyle: import('vue').ComputedRef<import('vue').CSSProperties>;
     }, {}, {}, {}, {
+        preview: boolean;
         hideFooter: boolean | "never";
         renderToBody: boolean;
         footerPosition: "outer" | "inner";
         showLoader: boolean;
-        preview: boolean;
         previewVisible: boolean;
         defaultPreviewVisible: boolean;
     }>;
@@ -1625,10 +1736,13 @@ export declare const Image: {
         type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
     };
 }>> & Readonly<{
-    "onPreview-visible-change"?: ((...args: any[]) => any) | undefined;
-    "onUpdate:previewVisible"?: ((...args: any[]) => any) | undefined;
+    onError?: ((_event: Event) => any) | undefined;
+    onLoad?: ((_event: Event) => any) | undefined;
+    "onPreview-visible-change"?: ((_visible: boolean) => any) | undefined;
+    "onUpdate:previewVisible"?: ((_visible: boolean) => any) | undefined;
 }>, {
-    refImg: import('vue').Ref<any, any>;
+    t: (key: import('../../index.ts').LocaleKey | (string & {}), params?: Record<string, string | number>) => string;
+    refImg: import('vue').Ref<HTMLImageElement | undefined, HTMLImageElement | undefined>;
     className: {
         block: string;
         element: (className: string) => string;
@@ -1637,10 +1751,13 @@ export declare const Image: {
     };
     wrapperClassNames: import('vue').ComputedRef<unknown[]>;
     wrapperStyles: import('vue').ComputedRef<import('vue').StyleValue[]>;
+    overlayStyles: import('vue').ComputedRef<{
+        height: string | undefined;
+    }>;
     showFooter: import('vue').ComputedRef<boolean>;
     imgProps: import('vue').ComputedRef<Omit<{
         [x: string]: unknown;
-    }, "class" | "style">>;
+    }, "class" | "style" | "src">>;
     imgStyle: import('vue').ComputedRef<{
         width: string | undefined;
         height: string | undefined;
@@ -1650,17 +1767,24 @@ export declare const Image: {
     isLoading: import('vue').ComputedRef<boolean>;
     mergedPreviewVisible: import('vue').ComputedRef<boolean>;
     mergePreview: import('vue').ComputedRef<boolean>;
-    onImgLoaded: () => void;
-    onImgLoadError: () => void;
+    canOpenPreview: import('vue').ComputedRef<boolean>;
+    onImgLoaded: (event: Event) => void;
+    onImgLoadError: (event: Event) => void;
     onImgClick: () => void;
+    onImgKeydown: (event: KeyboardEvent) => void;
     onPreviewClose: () => void;
     fitStyle: import('vue').ComputedRef<import('vue').CSSProperties>;
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("preview-visible-change" | "update:previewVisible")[], "preview-visible-change" | "update:previewVisible", {
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    'preview-visible-change': (_visible: boolean) => true;
+    'update:previewVisible': (_visible: boolean) => true;
+    load: (_event: Event) => true;
+    error: (_event: Event) => true;
+}, string, {
+    preview: boolean;
     hideFooter: boolean | "never";
     renderToBody: boolean;
     footerPosition: "outer" | "inner";
     showLoader: boolean;
-    preview: boolean;
     previewVisible: boolean;
     defaultPreviewVisible: boolean;
 }, {}, string, {}, {
@@ -1916,6 +2040,9 @@ export declare const Image: {
             default: number;
         };
     }>, {
+        rootAttrs: import('vue').ComputedRef<{
+            [k: string]: unknown;
+        }>;
         t: (key: import('../../index.ts').LocaleKey | (string & {}), params?: Record<string, string | number>) => string;
         className: {
             block: string;
@@ -1936,9 +2063,10 @@ export declare const Image: {
         mergedVisible: import('vue').ComputedRef<boolean>;
         isLoading: import('vue').ComputedRef<boolean>;
         isLoaded: import('vue').ComputedRef<boolean>;
+        isError: import('vue').ComputedRef<boolean>;
         scaleValueVisible: import('vue').Ref<boolean, boolean>;
-        refWrapper: import('vue').Ref<any, any>;
-        refImage: import('vue').Ref<any, any>;
+        refWrapper: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
+        refImage: import('vue').Ref<HTMLImageElement | undefined, HTMLImageElement | undefined>;
         mounted: import('vue').Ref<boolean, boolean>;
         onWheel: {
             (...args: any[]): void;
@@ -1946,8 +2074,9 @@ export declare const Image: {
         };
         onMaskClick: (e: MouseEvent) => void;
         onCloseClick: () => void;
-        onImgLoad(): void;
-        onImgError(): void;
+        onDialogKeydown: (event: KeyboardEvent) => void;
+        onImgLoad(event: Event): void;
+        onImgError(event: Event): void;
         actions: import('vue').ComputedRef<({
             key: string;
             name: string;
@@ -2455,12 +2584,12 @@ export declare const Image: {
                     }, import('vue').PublicProps, {
                         mini: boolean;
                         disabled: boolean;
+                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                         animationName: string;
                         autoFitPosition: boolean;
                         popupVisible: boolean;
                         defaultPopupVisible: boolean;
-                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         popupOffset: number;
                         showArrow: boolean;
                         alignPoint: boolean;
@@ -2641,12 +2770,12 @@ export declare const Image: {
                     }>, () => VNode, {}, {}, {}, {
                         mini: boolean;
                         disabled: boolean;
+                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                         animationName: string;
                         autoFitPosition: boolean;
                         popupVisible: boolean;
                         defaultPopupVisible: boolean;
-                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         popupOffset: number;
                         showArrow: boolean;
                         alignPoint: boolean;
@@ -2830,12 +2959,12 @@ export declare const Image: {
                 }, string, {
                     mini: boolean;
                     disabled: boolean;
+                    trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                     position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                     animationName: string;
                     autoFitPosition: boolean;
                     popupVisible: boolean;
                     defaultPopupVisible: boolean;
-                    trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                     popupOffset: number;
                     showArrow: boolean;
                     alignPoint: boolean;
@@ -3030,6 +3159,91 @@ export declare const Image: {
             strokeWidth: string | number;
             fillColor: unknown[];
         }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+        IconImageClose: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+            fillColor: {
+                type: ArrayConstructor;
+                default: undefined;
+            };
+            name: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            size: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: undefined;
+            };
+            rotate: {
+                type: NumberConstructor;
+                default: undefined;
+            };
+            spin: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            color: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            title: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            ariaLabel: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            strokeWidth: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: undefined;
+            };
+        }>, () => VNode, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+            fillColor: {
+                type: ArrayConstructor;
+                default: undefined;
+            };
+            name: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            size: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: undefined;
+            };
+            rotate: {
+                type: NumberConstructor;
+                default: undefined;
+            };
+            spin: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            color: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            title: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            ariaLabel: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            strokeWidth: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: undefined;
+            };
+        }>> & Readonly<{}>, {
+            name: string;
+            title: string;
+            size: string | number;
+            rotate: number;
+            spin: boolean;
+            color: string;
+            ariaLabel: string;
+            strokeWidth: string | number;
+            fillColor: unknown[];
+        }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
     }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 } & import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & {
     install(app: import('vue').App): void;
@@ -3098,6 +3312,9 @@ export declare const ImagePreview: {
         onClose?: ((...args: any[]) => any) | undefined;
         "onUpdate:visible"?: ((...args: any[]) => any) | undefined;
     }>, {
+        rootAttrs: import('vue').ComputedRef<{
+            [k: string]: unknown;
+        }>;
         t: (key: import('../../index.ts').LocaleKey | (string & {}), params?: Record<string, string | number>) => string;
         className: {
             block: string;
@@ -3118,9 +3335,10 @@ export declare const ImagePreview: {
         mergedVisible: import('vue').ComputedRef<boolean>;
         isLoading: import('vue').ComputedRef<boolean>;
         isLoaded: import('vue').ComputedRef<boolean>;
+        isError: import('vue').ComputedRef<boolean>;
         scaleValueVisible: import('vue').Ref<boolean, boolean>;
-        refWrapper: import('vue').Ref<any, any>;
-        refImage: import('vue').Ref<any, any>;
+        refWrapper: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
+        refImage: import('vue').Ref<HTMLImageElement | undefined, HTMLImageElement | undefined>;
         mounted: import('vue').Ref<boolean, boolean>;
         onWheel: {
             (...args: any[]): void;
@@ -3128,8 +3346,9 @@ export declare const ImagePreview: {
         };
         onMaskClick: (e: MouseEvent) => void;
         onCloseClick: () => void;
-        onImgLoad(): void;
-        onImgError(): void;
+        onDialogKeydown: (event: KeyboardEvent) => void;
+        onImgLoad(event: Event): void;
+        onImgError(event: Event): void;
         actions: import('vue').ComputedRef<({
             key: string;
             name: string;
@@ -3575,12 +3794,12 @@ export declare const ImagePreview: {
                     }, import('vue').PublicProps, {
                         mini: boolean;
                         disabled: boolean;
+                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                         animationName: string;
                         autoFitPosition: boolean;
                         popupVisible: boolean;
                         defaultPopupVisible: boolean;
-                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         popupOffset: number;
                         showArrow: boolean;
                         alignPoint: boolean;
@@ -3761,12 +3980,12 @@ export declare const ImagePreview: {
                     }>, () => VNode, {}, {}, {}, {
                         mini: boolean;
                         disabled: boolean;
+                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                         animationName: string;
                         autoFitPosition: boolean;
                         popupVisible: boolean;
                         defaultPopupVisible: boolean;
-                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         popupOffset: number;
                         showArrow: boolean;
                         alignPoint: boolean;
@@ -3950,12 +4169,12 @@ export declare const ImagePreview: {
                 }, string, {
                     mini: boolean;
                     disabled: boolean;
+                    trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                     position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                     animationName: string;
                     autoFitPosition: boolean;
                     popupVisible: boolean;
                     defaultPopupVisible: boolean;
-                    trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                     popupOffset: number;
                     showArrow: boolean;
                     alignPoint: boolean;
@@ -4150,55 +4369,140 @@ export declare const ImagePreview: {
             strokeWidth: string | number;
             fillColor: unknown[];
         }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
-    } & import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
-        P: {};
-        B: {};
-        D: {};
-        C: {};
-        M: {};
-        Defaults: {};
-    }, Readonly<import('vue').ExtractPropTypes<{
-        renderToBody: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        src: {
-            type: StringConstructor;
-        };
-        visible: {
-            type: BooleanConstructor;
-            default: undefined;
-        };
-        defaultVisible: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        maskClosable: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        closable: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        actionsLayout: {
-            type: import('vue').PropType<string[]>;
-            default: () => string[];
-        };
-        popupContainer: {
-            type: import('vue').PropType<HTMLElement | string>;
-        };
-        inGroup: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        groupArrowProps: {
-            type: ObjectConstructor;
-            default: () => {};
-        };
-        escToClose: {
-            type: BooleanConstructor;
-            default: boolean;
+        IconImageClose: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+            fillColor: {
+                type: ArrayConstructor;
+                default: undefined;
+            };
+            name: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            size: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: undefined;
+            };
+            rotate: {
+                type: NumberConstructor;
+                default: undefined;
+            };
+            spin: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            color: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            title: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            ariaLabel: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            strokeWidth: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: undefined;
+            };
+        }>, () => VNode, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+            fillColor: {
+                type: ArrayConstructor;
+                default: undefined;
+            };
+            name: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            size: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: undefined;
+            };
+            rotate: {
+                type: NumberConstructor;
+                default: undefined;
+            };
+            spin: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            color: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            title: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            ariaLabel: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            strokeWidth: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: undefined;
+            };
+        }>> & Readonly<{}>, {
+            name: string;
+            title: string;
+            size: string | number;
+            rotate: number;
+            spin: boolean;
+            color: string;
+            ariaLabel: string;
+            strokeWidth: string | number;
+            fillColor: unknown[];
+        }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    } & import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('vue').ExtractPropTypes<{
+        renderToBody: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        src: {
+            type: StringConstructor;
+        };
+        visible: {
+            type: BooleanConstructor;
+            default: undefined;
+        };
+        defaultVisible: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        maskClosable: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        closable: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        actionsLayout: {
+            type: import('vue').PropType<string[]>;
+            default: () => string[];
+        };
+        popupContainer: {
+            type: import('vue').PropType<HTMLElement | string>;
+        };
+        inGroup: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        groupArrowProps: {
+            type: ObjectConstructor;
+            default: () => {};
+        };
+        escToClose: {
+            type: BooleanConstructor;
+            default: boolean;
         };
         wheelZoom: {
             type: BooleanConstructor;
@@ -4220,6 +4524,9 @@ export declare const ImagePreview: {
         onClose?: ((...args: any[]) => any) | undefined;
         "onUpdate:visible"?: ((...args: any[]) => any) | undefined;
     }>, {
+        rootAttrs: import('vue').ComputedRef<{
+            [k: string]: unknown;
+        }>;
         t: (key: import('../../index.ts').LocaleKey | (string & {}), params?: Record<string, string | number>) => string;
         className: {
             block: string;
@@ -4240,9 +4547,10 @@ export declare const ImagePreview: {
         mergedVisible: import('vue').ComputedRef<boolean>;
         isLoading: import('vue').ComputedRef<boolean>;
         isLoaded: import('vue').ComputedRef<boolean>;
+        isError: import('vue').ComputedRef<boolean>;
         scaleValueVisible: import('vue').Ref<boolean, boolean>;
-        refWrapper: import('vue').Ref<any, any>;
-        refImage: import('vue').Ref<any, any>;
+        refWrapper: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
+        refImage: import('vue').Ref<HTMLImageElement | undefined, HTMLImageElement | undefined>;
         mounted: import('vue').Ref<boolean, boolean>;
         onWheel: {
             (...args: any[]): void;
@@ -4250,8 +4558,9 @@ export declare const ImagePreview: {
         };
         onMaskClick: (e: MouseEvent) => void;
         onCloseClick: () => void;
-        onImgLoad(): void;
-        onImgError(): void;
+        onDialogKeydown: (event: KeyboardEvent) => void;
+        onImgLoad(event: Event): void;
+        onImgError(event: Event): void;
         actions: import('vue').ComputedRef<({
             key: string;
             name: string;
@@ -4350,6 +4659,9 @@ export declare const ImagePreview: {
     onClose?: ((...args: any[]) => any) | undefined;
     "onUpdate:visible"?: ((...args: any[]) => any) | undefined;
 }>, {
+    rootAttrs: import('vue').ComputedRef<{
+        [k: string]: unknown;
+    }>;
     t: (key: import('../../index.ts').LocaleKey | (string & {}), params?: Record<string, string | number>) => string;
     className: {
         block: string;
@@ -4370,9 +4682,10 @@ export declare const ImagePreview: {
     mergedVisible: import('vue').ComputedRef<boolean>;
     isLoading: import('vue').ComputedRef<boolean>;
     isLoaded: import('vue').ComputedRef<boolean>;
+    isError: import('vue').ComputedRef<boolean>;
     scaleValueVisible: import('vue').Ref<boolean, boolean>;
-    refWrapper: import('vue').Ref<any, any>;
-    refImage: import('vue').Ref<any, any>;
+    refWrapper: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
+    refImage: import('vue').Ref<HTMLImageElement | undefined, HTMLImageElement | undefined>;
     mounted: import('vue').Ref<boolean, boolean>;
     onWheel: {
         (...args: any[]): void;
@@ -4380,8 +4693,9 @@ export declare const ImagePreview: {
     };
     onMaskClick: (e: MouseEvent) => void;
     onCloseClick: () => void;
-    onImgLoad(): void;
-    onImgError(): void;
+    onDialogKeydown: (event: KeyboardEvent) => void;
+    onImgLoad(event: Event): void;
+    onImgError(event: Event): void;
     actions: import('vue').ComputedRef<({
         key: string;
         name: string;
@@ -4827,12 +5141,12 @@ export declare const ImagePreview: {
                 }, import('vue').PublicProps, {
                     mini: boolean;
                     disabled: boolean;
+                    trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                     position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                     animationName: string;
                     autoFitPosition: boolean;
                     popupVisible: boolean;
                     defaultPopupVisible: boolean;
-                    trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                     popupOffset: number;
                     showArrow: boolean;
                     alignPoint: boolean;
@@ -5013,12 +5327,12 @@ export declare const ImagePreview: {
                 }>, () => VNode, {}, {}, {}, {
                     mini: boolean;
                     disabled: boolean;
+                    trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                     position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                     animationName: string;
                     autoFitPosition: boolean;
                     popupVisible: boolean;
                     defaultPopupVisible: boolean;
-                    trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                     popupOffset: number;
                     showArrow: boolean;
                     alignPoint: boolean;
@@ -5202,12 +5516,12 @@ export declare const ImagePreview: {
             }, string, {
                 mini: boolean;
                 disabled: boolean;
+                trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                 position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                 animationName: string;
                 autoFitPosition: boolean;
                 popupVisible: boolean;
                 defaultPopupVisible: boolean;
-                trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                 popupOffset: number;
                 showArrow: boolean;
                 alignPoint: boolean;
@@ -5402,6 +5716,91 @@ export declare const ImagePreview: {
         strokeWidth: string | number;
         fillColor: unknown[];
     }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    IconImageClose: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+        fillColor: {
+            type: ArrayConstructor;
+            default: undefined;
+        };
+        name: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        size: {
+            type: (StringConstructor | NumberConstructor)[];
+            default: undefined;
+        };
+        rotate: {
+            type: NumberConstructor;
+            default: undefined;
+        };
+        spin: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        color: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        title: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        ariaLabel: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        strokeWidth: {
+            type: (StringConstructor | NumberConstructor)[];
+            default: undefined;
+        };
+    }>, () => VNode, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+        fillColor: {
+            type: ArrayConstructor;
+            default: undefined;
+        };
+        name: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        size: {
+            type: (StringConstructor | NumberConstructor)[];
+            default: undefined;
+        };
+        rotate: {
+            type: NumberConstructor;
+            default: undefined;
+        };
+        spin: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        color: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        title: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        ariaLabel: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        strokeWidth: {
+            type: (StringConstructor | NumberConstructor)[];
+            default: undefined;
+        };
+    }>> & Readonly<{}>, {
+        name: string;
+        title: string;
+        size: string | number;
+        rotate: number;
+        spin: boolean;
+        color: string;
+        ariaLabel: string;
+        strokeWidth: string | number;
+        fillColor: unknown[];
+    }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 } & import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & {
     install(app: import('vue').App): void;
 };
@@ -5454,6 +5853,9 @@ export declare const ImagePreviewGroup: {
         "onUpdate:current"?: ((...args: any[]) => any) | undefined;
         "onVisible-change"?: ((...args: any[]) => any) | undefined;
     }>, {
+        t: (key: import('../../index.ts').LocaleKey | (string & {}), params?: Record<string, string | number>) => string;
+        currentIndex: import('vue').ComputedRef<number>;
+        imageCount: import('vue').ComputedRef<number>;
         mergedVisible: import('vue').ComputedRef<boolean>;
         currentUrl: import('vue').ComputedRef<string | undefined>;
         prevIndex: import('vue').ComputedRef<number | undefined>;
@@ -5533,6 +5935,9 @@ export declare const ImagePreviewGroup: {
                 default: number;
             };
         }>, {
+            rootAttrs: import('vue').ComputedRef<{
+                [k: string]: unknown;
+            }>;
             t: (key: import('../../index.ts').LocaleKey | (string & {}), params?: Record<string, string | number>) => string;
             className: {
                 block: string;
@@ -5553,9 +5958,10 @@ export declare const ImagePreviewGroup: {
             mergedVisible: import('vue').ComputedRef<boolean>;
             isLoading: import('vue').ComputedRef<boolean>;
             isLoaded: import('vue').ComputedRef<boolean>;
+            isError: import('vue').ComputedRef<boolean>;
             scaleValueVisible: import('vue').Ref<boolean, boolean>;
-            refWrapper: import('vue').Ref<any, any>;
-            refImage: import('vue').Ref<any, any>;
+            refWrapper: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
+            refImage: import('vue').Ref<HTMLImageElement | undefined, HTMLImageElement | undefined>;
             mounted: import('vue').Ref<boolean, boolean>;
             onWheel: {
                 (...args: any[]): void;
@@ -5563,8 +5969,9 @@ export declare const ImagePreviewGroup: {
             };
             onMaskClick: (e: MouseEvent) => void;
             onCloseClick: () => void;
-            onImgLoad(): void;
-            onImgError(): void;
+            onDialogKeydown: (event: KeyboardEvent) => void;
+            onImgLoad(event: Event): void;
+            onImgError(event: Event): void;
             actions: import('vue').ComputedRef<({
                 key: string;
                 name: string;
@@ -6072,12 +6479,12 @@ export declare const ImagePreviewGroup: {
                         }, import('vue').PublicProps, {
                             mini: boolean;
                             disabled: boolean;
+                            trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                             position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                             animationName: string;
                             autoFitPosition: boolean;
                             popupVisible: boolean;
                             defaultPopupVisible: boolean;
-                            trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                             popupOffset: number;
                             showArrow: boolean;
                             alignPoint: boolean;
@@ -6258,12 +6665,12 @@ export declare const ImagePreviewGroup: {
                         }>, () => VNode, {}, {}, {}, {
                             mini: boolean;
                             disabled: boolean;
+                            trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                             position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                             animationName: string;
                             autoFitPosition: boolean;
                             popupVisible: boolean;
                             defaultPopupVisible: boolean;
-                            trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                             popupOffset: number;
                             showArrow: boolean;
                             alignPoint: boolean;
@@ -6447,12 +6854,12 @@ export declare const ImagePreviewGroup: {
                     }, string, {
                         mini: boolean;
                         disabled: boolean;
+                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                         animationName: string;
                         autoFitPosition: boolean;
                         popupVisible: boolean;
                         defaultPopupVisible: boolean;
-                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         popupOffset: number;
                         showArrow: boolean;
                         alignPoint: boolean;
@@ -6647,6 +7054,91 @@ export declare const ImagePreviewGroup: {
                 strokeWidth: string | number;
                 fillColor: unknown[];
             }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+            IconImageClose: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+                fillColor: {
+                    type: ArrayConstructor;
+                    default: undefined;
+                };
+                name: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                size: {
+                    type: (StringConstructor | NumberConstructor)[];
+                    default: undefined;
+                };
+                rotate: {
+                    type: NumberConstructor;
+                    default: undefined;
+                };
+                spin: {
+                    type: BooleanConstructor;
+                    default: boolean;
+                };
+                color: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                title: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                ariaLabel: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                strokeWidth: {
+                    type: (StringConstructor | NumberConstructor)[];
+                    default: undefined;
+                };
+            }>, () => VNode, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+                fillColor: {
+                    type: ArrayConstructor;
+                    default: undefined;
+                };
+                name: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                size: {
+                    type: (StringConstructor | NumberConstructor)[];
+                    default: undefined;
+                };
+                rotate: {
+                    type: NumberConstructor;
+                    default: undefined;
+                };
+                spin: {
+                    type: BooleanConstructor;
+                    default: boolean;
+                };
+                color: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                title: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                ariaLabel: {
+                    type: StringConstructor;
+                    default: undefined;
+                };
+                strokeWidth: {
+                    type: (StringConstructor | NumberConstructor)[];
+                    default: undefined;
+                };
+            }>> & Readonly<{}>, {
+                name: string;
+                title: string;
+                size: string | number;
+                rotate: number;
+                spin: boolean;
+                color: string;
+                ariaLabel: string;
+                strokeWidth: string | number;
+                fillColor: unknown[];
+            }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
         }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
     } & import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
         P: {};
@@ -6703,6 +7195,9 @@ export declare const ImagePreviewGroup: {
         "onUpdate:current"?: ((...args: any[]) => any) | undefined;
         "onVisible-change"?: ((...args: any[]) => any) | undefined;
     }>, {
+        t: (key: import('../../index.ts').LocaleKey | (string & {}), params?: Record<string, string | number>) => string;
+        currentIndex: import('vue').ComputedRef<number>;
+        imageCount: import('vue').ComputedRef<number>;
         mergedVisible: import('vue').ComputedRef<boolean>;
         currentUrl: import('vue').ComputedRef<string | undefined>;
         prevIndex: import('vue').ComputedRef<number | undefined>;
@@ -6773,6 +7268,9 @@ export declare const ImagePreviewGroup: {
     "onUpdate:current"?: ((...args: any[]) => any) | undefined;
     "onVisible-change"?: ((...args: any[]) => any) | undefined;
 }>, {
+    t: (key: import('../../index.ts').LocaleKey | (string & {}), params?: Record<string, string | number>) => string;
+    currentIndex: import('vue').ComputedRef<number>;
+    imageCount: import('vue').ComputedRef<number>;
     mergedVisible: import('vue').ComputedRef<boolean>;
     currentUrl: import('vue').ComputedRef<string | undefined>;
     prevIndex: import('vue').ComputedRef<number | undefined>;
@@ -6852,6 +7350,9 @@ export declare const ImagePreviewGroup: {
             default: number;
         };
     }>, {
+        rootAttrs: import('vue').ComputedRef<{
+            [k: string]: unknown;
+        }>;
         t: (key: import('../../index.ts').LocaleKey | (string & {}), params?: Record<string, string | number>) => string;
         className: {
             block: string;
@@ -6872,9 +7373,10 @@ export declare const ImagePreviewGroup: {
         mergedVisible: import('vue').ComputedRef<boolean>;
         isLoading: import('vue').ComputedRef<boolean>;
         isLoaded: import('vue').ComputedRef<boolean>;
+        isError: import('vue').ComputedRef<boolean>;
         scaleValueVisible: import('vue').Ref<boolean, boolean>;
-        refWrapper: import('vue').Ref<any, any>;
-        refImage: import('vue').Ref<any, any>;
+        refWrapper: import('vue').Ref<HTMLElement | undefined, HTMLElement | undefined>;
+        refImage: import('vue').Ref<HTMLImageElement | undefined, HTMLImageElement | undefined>;
         mounted: import('vue').Ref<boolean, boolean>;
         onWheel: {
             (...args: any[]): void;
@@ -6882,8 +7384,9 @@ export declare const ImagePreviewGroup: {
         };
         onMaskClick: (e: MouseEvent) => void;
         onCloseClick: () => void;
-        onImgLoad(): void;
-        onImgError(): void;
+        onDialogKeydown: (event: KeyboardEvent) => void;
+        onImgLoad(event: Event): void;
+        onImgError(event: Event): void;
         actions: import('vue').ComputedRef<({
             key: string;
             name: string;
@@ -7391,12 +7894,12 @@ export declare const ImagePreviewGroup: {
                     }, import('vue').PublicProps, {
                         mini: boolean;
                         disabled: boolean;
+                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                         animationName: string;
                         autoFitPosition: boolean;
                         popupVisible: boolean;
                         defaultPopupVisible: boolean;
-                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         popupOffset: number;
                         showArrow: boolean;
                         alignPoint: boolean;
@@ -7577,12 +8080,12 @@ export declare const ImagePreviewGroup: {
                     }>, () => VNode, {}, {}, {}, {
                         mini: boolean;
                         disabled: boolean;
+                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                         animationName: string;
                         autoFitPosition: boolean;
                         popupVisible: boolean;
                         defaultPopupVisible: boolean;
-                        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                         popupOffset: number;
                         showArrow: boolean;
                         alignPoint: boolean;
@@ -7766,12 +8269,12 @@ export declare const ImagePreviewGroup: {
                 }, string, {
                     mini: boolean;
                     disabled: boolean;
+                    trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                     position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                     animationName: string;
                     autoFitPosition: boolean;
                     popupVisible: boolean;
                     defaultPopupVisible: boolean;
-                    trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                     popupOffset: number;
                     showArrow: boolean;
                     alignPoint: boolean;
@@ -7966,6 +8469,91 @@ export declare const ImagePreviewGroup: {
             strokeWidth: string | number;
             fillColor: unknown[];
         }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+        IconImageClose: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+            fillColor: {
+                type: ArrayConstructor;
+                default: undefined;
+            };
+            name: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            size: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: undefined;
+            };
+            rotate: {
+                type: NumberConstructor;
+                default: undefined;
+            };
+            spin: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            color: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            title: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            ariaLabel: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            strokeWidth: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: undefined;
+            };
+        }>, () => VNode, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+            fillColor: {
+                type: ArrayConstructor;
+                default: undefined;
+            };
+            name: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            size: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: undefined;
+            };
+            rotate: {
+                type: NumberConstructor;
+                default: undefined;
+            };
+            spin: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            color: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            title: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            ariaLabel: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            strokeWidth: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: undefined;
+            };
+        }>> & Readonly<{}>, {
+            name: string;
+            title: string;
+            size: string | number;
+            rotate: number;
+            spin: boolean;
+            color: string;
+            ariaLabel: string;
+            strokeWidth: string | number;
+            fillColor: unknown[];
+        }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
     }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 } & import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & {
     install(app: import('vue').App): void;
@@ -8142,12 +8730,12 @@ export declare const ImagePreviewAction: {
             }, import('vue').PublicProps, {
                 mini: boolean;
                 disabled: boolean;
+                trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                 position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                 animationName: string;
                 autoFitPosition: boolean;
                 popupVisible: boolean;
                 defaultPopupVisible: boolean;
-                trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                 popupOffset: number;
                 showArrow: boolean;
                 alignPoint: boolean;
@@ -8328,12 +8916,12 @@ export declare const ImagePreviewAction: {
             }>, () => VNode, {}, {}, {}, {
                 mini: boolean;
                 disabled: boolean;
+                trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                 position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
                 animationName: string;
                 autoFitPosition: boolean;
                 popupVisible: boolean;
                 defaultPopupVisible: boolean;
-                trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
                 popupOffset: number;
                 showArrow: boolean;
                 alignPoint: boolean;
@@ -8517,12 +9105,12 @@ export declare const ImagePreviewAction: {
         }, string, {
             mini: boolean;
             disabled: boolean;
+            trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
             position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
             animationName: string;
             autoFitPosition: boolean;
             popupVisible: boolean;
             defaultPopupVisible: boolean;
-            trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
             popupOffset: number;
             showArrow: boolean;
             alignPoint: boolean;
@@ -8736,12 +9324,12 @@ export declare const ImagePreviewAction: {
         }, import('vue').PublicProps, {
             mini: boolean;
             disabled: boolean;
+            trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
             position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
             animationName: string;
             autoFitPosition: boolean;
             popupVisible: boolean;
             defaultPopupVisible: boolean;
-            trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
             popupOffset: number;
             showArrow: boolean;
             alignPoint: boolean;
@@ -8922,12 +9510,12 @@ export declare const ImagePreviewAction: {
         }>, () => VNode, {}, {}, {}, {
             mini: boolean;
             disabled: boolean;
+            trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
             position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
             animationName: string;
             autoFitPosition: boolean;
             popupVisible: boolean;
             defaultPopupVisible: boolean;
-            trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
             popupOffset: number;
             showArrow: boolean;
             alignPoint: boolean;
@@ -9111,12 +9699,12 @@ export declare const ImagePreviewAction: {
     }, string, {
         mini: boolean;
         disabled: boolean;
+        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
         position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
         animationName: string;
         autoFitPosition: boolean;
         popupVisible: boolean;
         defaultPopupVisible: boolean;
-        trigger: "hover" | "click" | "focus" | "contextMenu" | ("hover" | "click" | "focus" | "contextMenu")[];
         popupOffset: number;
         showArrow: boolean;
         alignPoint: boolean;