amis-ui 3.4.2 → 3.5.0

package/lib/components/GroupedSelection.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.4.2
+ * amis-ui v3.5.0
  * Copyright 2018-2023 fex
  */
 
@@ -45,7 +45,8 @@ var GroupedSelection = /** @class */ (function (_super) {
                     checked: false,
                     onChange: function () { return undefined; },
                     disabled: disabled || option.disabled,
-                    labelField: labelField
+                    labelField: labelField,
+                    classnames: cx
                 })),
                 _J$X_("div", { className: cx('GroupedSelection-items', option.className) }, option.children.map(function (child, index) {
                     return _this.renderOption(child, index);
@@ -65,7 +66,8 @@ var GroupedSelection = /** @class */ (function (_super) {
                     checked: false,
                     onChange: function () { return undefined; },
                     disabled: disabled || option.disabled,
-                    labelField: labelField
+                    labelField: labelField,
+                    classnames: cx
                 }))));
         }
         return hasParent ? (_J$X_("div", { key: 'group' + index, style: styles, className: cx('GroupedSelection-group', option.className) },
@@ -84,7 +86,8 @@ var GroupedSelection = /** @class */ (function (_super) {
                 checked: !!~valueArray.indexOf(option),
                 onChange: function () { return _this.toggleOption(option); },
                 disabled: disabled || option.disabled,
-                labelField: labelField
+                labelField: labelField,
+                classnames: cx
             }))));
     };
     GroupedSelection.prototype.renderCheckAll = function () {

package/lib/components/Html.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.4.2
+ * amis-ui v3.5.0
  * Copyright 2018-2023 fex
  */
 

package/lib/components/ImageGallery.d.ts

@@ -43,6 +43,14 @@ export interface ImageGalleryState {
     scale: number;
     /** 图片旋转角度 */
     rotate: number;
+    /**
+     * 水平位移
+     */
+    tx: number;
+    /**
+     * 垂直位移
+     */
+    ty: number;
     /** 是否开启操作栏 */
     showToolbar?: boolean;
     /** 是否显示底部图片集 */
@@ -58,6 +66,13 @@ export declare class ImageGallery extends React.Component<ImageGalleryProps, Ima
     galleryMain?: HTMLDivElement;
     galleryMainRef(ref: HTMLDivElement): void;
     onWheelScroll(event: WheelEvent): void;
+    startX: number;
+    startY: number;
+    startTx: number;
+    startTy: number;
+    onMouseDown(event: MouseEvent): void;
+    onMouseMove(event: MouseEvent): void;
+    onMouseUp(): void;
     handleImageEnlarge(info: {
         src: string;
         originalSrc: string;
@@ -85,7 +100,7 @@ export declare class ImageGallery extends React.Component<ImageGalleryProps, Ima
     render(): React.JSX.Element;
 }
 declare const _default: {
-    new (props: Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+    new (props: Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
         actions?: ImageAction[] | undefined;
     } & {} & {
         locale?: string | undefined;
@@ -96,14 +111,14 @@ declare const _default: {
         getWrappedInstance(): any;
         render(): React.JSX.Element;
         context: unknown;
-        setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
             translate?: ((str: string, ...args: any[]) => string) | undefined;
         }, keyof ThemeProps> & import("packages/amis-core/lib/theme").ThemeOuterProps>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        readonly props: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
@@ -114,7 +129,7 @@ declare const _default: {
             [key: string]: React.ReactInstance;
         };
         componentDidMount?(): void;
-        shouldComponentUpdate?(nextProps: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        shouldComponentUpdate?(nextProps: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
@@ -122,13 +137,13 @@ declare const _default: {
         }, keyof ThemeProps> & import("packages/amis-core/lib/theme").ThemeOuterProps>, nextState: Readonly<{}>, nextContext: any): boolean;
         componentWillUnmount?(): void;
         componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
-        getSnapshotBeforeUpdate?(prevProps: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        getSnapshotBeforeUpdate?(prevProps: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
             translate?: ((str: string, ...args: any[]) => string) | undefined;
         }, keyof ThemeProps> & import("packages/amis-core/lib/theme").ThemeOuterProps>, prevState: Readonly<{}>): any;
-        componentDidUpdate?(prevProps: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        componentDidUpdate?(prevProps: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
@@ -136,25 +151,25 @@ declare const _default: {
         }, keyof ThemeProps> & import("packages/amis-core/lib/theme").ThemeOuterProps>, prevState: Readonly<{}>, snapshot?: any): void;
         componentWillMount?(): void;
         UNSAFE_componentWillMount?(): void;
-        componentWillReceiveProps?(nextProps: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        componentWillReceiveProps?(nextProps: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
             translate?: ((str: string, ...args: any[]) => string) | undefined;
         }, keyof ThemeProps> & import("packages/amis-core/lib/theme").ThemeOuterProps>, nextContext: any): void;
-        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
             translate?: ((str: string, ...args: any[]) => string) | undefined;
         }, keyof ThemeProps> & import("packages/amis-core/lib/theme").ThemeOuterProps>, nextContext: any): void;
-        componentWillUpdate?(nextProps: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        componentWillUpdate?(nextProps: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
             translate?: ((str: string, ...args: any[]) => string) | undefined;
         }, keyof ThemeProps> & import("packages/amis-core/lib/theme").ThemeOuterProps>, nextState: Readonly<{}>, nextContext: any): void;
-        UNSAFE_componentWillUpdate?(nextProps: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<Omit<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
@@ -164,7 +179,7 @@ declare const _default: {
     displayName: string;
     contextType: React.Context<string>;
     ComposedComponent: React.ComponentType<{
-        new (props: Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        new (props: Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
@@ -173,17 +188,16 @@ declare const _default: {
             ref: any;
             childRef(ref: any): void;
             getWrappedInstance(): any;
-            /** 是否显示底部图片集 */
             render(): React.JSX.Element;
             context: unknown;
-            setState<K_1 extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            setState<K_1 extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
                 translate?: ((str: string, ...args: any[]) => string) | undefined;
             }>) => {} | Pick<{}, K_1> | null) | Pick<{}, K_1> | null, callback?: (() => void) | undefined): void;
             forceUpdate(callback?: (() => void) | undefined): void;
-            readonly props: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            readonly props: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
@@ -194,7 +208,7 @@ declare const _default: {
                 [key: string]: React.ReactInstance;
             };
             componentDidMount?(): void;
-            shouldComponentUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            shouldComponentUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
@@ -202,13 +216,13 @@ declare const _default: {
             }>, nextState: Readonly<{}>, nextContext: any): boolean;
             componentWillUnmount?(): void;
             componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
-            getSnapshotBeforeUpdate?(prevProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            getSnapshotBeforeUpdate?(prevProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
                 translate?: ((str: string, ...args: any[]) => string) | undefined;
             }>, prevState: Readonly<{}>): any;
-            componentDidUpdate?(prevProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            componentDidUpdate?(prevProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
@@ -216,25 +230,25 @@ declare const _default: {
             }>, prevState: Readonly<{}>, snapshot?: any): void;
             componentWillMount?(): void;
             UNSAFE_componentWillMount?(): void;
-            componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
                 translate?: ((str: string, ...args: any[]) => string) | undefined;
             }>, nextContext: any): void;
-            UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
                 translate?: ((str: string, ...args: any[]) => string) | undefined;
             }>, nextContext: any): void;
-            componentWillUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            componentWillUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
                 translate?: ((str: string, ...args: any[]) => string) | undefined;
             }>, nextState: Readonly<{}>, nextContext: any): void;
-            UNSAFE_componentWillUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            UNSAFE_componentWillUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
@@ -248,7 +262,7 @@ declare const _default: {
         ComposedComponent: typeof ImageGallery;
     }>;
 } & import("hoist-non-react-statics").NonReactStatics<{
-    new (props: Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+    new (props: Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
         actions?: ImageAction[] | undefined;
     } & {} & {
         locale?: string | undefined;
@@ -257,17 +271,16 @@ declare const _default: {
         ref: any;
         childRef(ref: any): void;
         getWrappedInstance(): any;
-        /** 是否显示底部图片集 */
         render(): React.JSX.Element;
         context: unknown;
-        setState<K_1 extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        setState<K_1 extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
             translate?: ((str: string, ...args: any[]) => string) | undefined;
         }>) => {} | Pick<{}, K_1> | null) | Pick<{}, K_1> | null, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        readonly props: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
@@ -278,7 +291,7 @@ declare const _default: {
             [key: string]: React.ReactInstance;
         };
         componentDidMount?(): void;
-        shouldComponentUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        shouldComponentUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
@@ -286,13 +299,13 @@ declare const _default: {
         }>, nextState: Readonly<{}>, nextContext: any): boolean;
         componentWillUnmount?(): void;
         componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
-        getSnapshotBeforeUpdate?(prevProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        getSnapshotBeforeUpdate?(prevProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
             translate?: ((str: string, ...args: any[]) => string) | undefined;
         }>, prevState: Readonly<{}>): any;
-        componentDidUpdate?(prevProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        componentDidUpdate?(prevProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
@@ -300,25 +313,25 @@ declare const _default: {
         }>, prevState: Readonly<{}>, snapshot?: any): void;
         componentWillMount?(): void;
         UNSAFE_componentWillMount?(): void;
-        componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
             translate?: ((str: string, ...args: any[]) => string) | undefined;
         }>, nextContext: any): void;
-        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
             translate?: ((str: string, ...args: any[]) => string) | undefined;
         }>, nextContext: any): void;
-        componentWillUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        componentWillUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
             translate?: ((str: string, ...args: any[]) => string) | undefined;
         }>, nextState: Readonly<{}>, nextContext: any): void;
-        UNSAFE_componentWillUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
@@ -332,7 +345,7 @@ declare const _default: {
     ComposedComponent: typeof ImageGallery;
 }, {}> & {
     ComposedComponent: {
-        new (props: Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+        new (props: Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
             actions?: ImageAction[] | undefined;
         } & {} & {
             locale?: string | undefined;
@@ -341,17 +354,16 @@ declare const _default: {
             ref: any;
             childRef(ref: any): void;
             getWrappedInstance(): any;
-            /** 是否显示底部图片集 */
             render(): React.JSX.Element;
             context: unknown;
-            setState<K_1 extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            setState<K_1 extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
                 translate?: ((str: string, ...args: any[]) => string) | undefined;
             }>) => {} | Pick<{}, K_1> | null) | Pick<{}, K_1> | null, callback?: (() => void) | undefined): void;
             forceUpdate(callback?: (() => void) | undefined): void;
-            readonly props: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            readonly props: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
@@ -362,7 +374,7 @@ declare const _default: {
                 [key: string]: React.ReactInstance;
             };
             componentDidMount?(): void;
-            shouldComponentUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            shouldComponentUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
@@ -370,13 +382,13 @@ declare const _default: {
             }>, nextState: Readonly<{}>, nextContext: any): boolean;
             componentWillUnmount?(): void;
             componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
-            getSnapshotBeforeUpdate?(prevProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            getSnapshotBeforeUpdate?(prevProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
                 translate?: ((str: string, ...args: any[]) => string) | undefined;
             }>, prevState: Readonly<{}>): any;
-            componentDidUpdate?(prevProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            componentDidUpdate?(prevProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
@@ -384,25 +396,25 @@ declare const _default: {
             }>, prevState: Readonly<{}>, snapshot?: any): void;
             componentWillMount?(): void;
             UNSAFE_componentWillMount?(): void;
-            componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
                 translate?: ((str: string, ...args: any[]) => string) | undefined;
             }>, nextContext: any): void;
-            UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
                 translate?: ((str: string, ...args: any[]) => string) | undefined;
             }>, nextContext: any): void;
-            componentWillUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            componentWillUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;
                 translate?: ((str: string, ...args: any[]) => string) | undefined;
             }>, nextState: Readonly<{}>, nextContext: any): void;
-            UNSAFE_componentWillUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "classnames" | "classPrefix" | "style" | "className" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
+            UNSAFE_componentWillUpdate?(nextProps: Readonly<Pick<Omit<ImageGalleryProps, keyof LocaleProps>, "style" | "className" | "classnames" | "classPrefix" | "theme" | "mobileUI" | "children" | "modalContainer" | "imageGallaryClassName"> & {
                 actions?: ImageAction[] | undefined;
             } & {} & {
                 locale?: string | undefined;

package/lib/components/ImageGallery.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.4.2
+ * amis-ui v3.5.0
  * Copyright 2018-2023 fex
  */
 
@@ -43,35 +43,53 @@ var ImageGallery = /** @class */ (function (_super) {
             isOpened: false,
             index: -1,
             items: [],
+            tx: 0,
+            ty: 0,
             scale: 1,
             rotate: 0,
             showToolbar: false,
             imageGallaryClassName: '',
             actions: ImageGallery.defaultProps.actions
         };
+        _this.startX = 0;
+        _this.startY = 0;
+        _this.startTx = 0;
+        _this.startTy = 0;
         _this.handleToolbarAction = debounce__default["default"](function (action) {
             if (action.disabled) {
                 return;
             }
             switch (action.key) {
                 case exports.ImageActionKey.ROTATE_LEFT:
-                    _this.setState(function (prevState) { return ({ rotate: prevState.rotate - 90 }); });
+                    _this.setState(function (prevState) { return ({
+                        rotate: prevState.rotate - 90,
+                        tx: 0,
+                        ty: 0
+                    }); });
                     break;
                 case exports.ImageActionKey.ROTATE_RIGHT:
-                    _this.setState(function (prevState) { return ({ rotate: prevState.rotate + 90 }); });
+                    _this.setState(function (prevState) { return ({
+                        rotate: prevState.rotate + 90,
+                        tx: 0,
+                        ty: 0
+                    }); });
                     break;
                 case exports.ImageActionKey.ZOOM_IN:
-                    _this.setState(function (prevState) { return ({ scale: prevState.scale + 0.5 }); });
+                    _this.setState(function (prevState) { return ({
+                        scale: prevState.scale + 0.5,
+                        tx: 0,
+                        ty: 0
+                    }); });
                     break;
                 case exports.ImageActionKey.ZOOM_OUT:
                     _this.setState(function (prevState) {
                         return prevState.scale - 0.5 > 0
-                            ? { scale: prevState.scale - 0.5 }
+                            ? { scale: prevState.scale - 0.5, tx: 0, ty: 0 }
                             : null;
                     });
                     break;
                 case exports.ImageActionKey.SCALE_ORIGIN:
-                    _this.setState(function () { return ({ scale: 1 }); });
+                    _this.setState(function () { return ({ scale: 1, tx: 0, ty: 0 }); });
                     break;
             }
             if (action.onClick && typeof action.onClick === 'function') {
@@ -81,14 +99,16 @@ var ImageGallery = /** @class */ (function (_super) {
         return _this;
     }
     ImageGallery.prototype.galleryMainRef = function (ref) {
-        var _a;
+        var _a, _b;
         if (ref) {
             ref.addEventListener('wheel', this.onWheelScroll, {
                 passive: false
             });
+            ref.addEventListener('mousedown', this.onMouseDown);
         }
         else {
             (_a = this.galleryMain) === null || _a === void 0 ? void 0 : _a.removeEventListener('wheel', this.onWheelScroll);
+            (_b = this.galleryMain) === null || _b === void 0 ? void 0 : _b.removeEventListener('mousedown', this.onMouseDown);
         }
         this.galleryMain = ref;
     };
@@ -107,11 +127,37 @@ var ImageGallery = /** @class */ (function (_super) {
             this.handleToolbarAction({ key: 'zoomIn' });
         }
     };
+    ImageGallery.prototype.onMouseDown = function (event) {
+        var _a;
+        (_a = this.galleryMain) === null || _a === void 0 ? void 0 : _a.classList.add('is-dragging');
+        document.body.addEventListener('mousemove', this.onMouseMove);
+        document.body.addEventListener('mouseup', this.onMouseUp);
+        this.startX = event.clientX;
+        this.startY = event.clientY;
+        this.startTx = this.state.tx;
+        this.startTy = this.state.ty;
+    };
+    ImageGallery.prototype.onMouseMove = function (event) {
+        this.setState({
+            tx: this.startTx + event.clientX - this.startX,
+            ty: this.startTy + event.clientY - this.startY
+        });
+    };
+    ImageGallery.prototype.onMouseUp = function () {
+        var _a;
+        (_a = this.galleryMain) === null || _a === void 0 ? void 0 : _a.classList.remove('is-dragging');
+        document.body.removeEventListener('mousemove', this.onMouseMove);
+        document.body.removeEventListener('mouseup', this.onMouseUp);
+    };
     ImageGallery.prototype.handleImageEnlarge = function (info) {
         var actions = this.props.actions;
         var validActionKeys = Object.values(exports.ImageActionKey);
         this.setState({
             isOpened: true,
+            tx: 0,
+            ty: 0,
+            rotate: 0,
+            scale: 1,
             items: info.list ? info.list : [info],
             index: info.index || 0,
             /* children组件可以控制工具栏的展示 */
@@ -165,19 +211,21 @@ var ImageGallery = /** @class */ (function (_super) {
     ImageGallery.prototype.render = function () {
         var _this = this;
         var _a = this.props, children = _a.children, cx = _a.classnames, modalContainer = _a.modalContainer;
-        var _b = this.state, index = _b.index, items = _b.items, rotate = _b.rotate, scale = _b.scale, showToolbar = _b.showToolbar, enlargeWithGallary = _b.enlargeWithGallary, actions = _b.actions, imageGallaryClassName = _b.imageGallaryClassName;
+        var _b = this.state, index = _b.index, items = _b.items, rotate = _b.rotate, scale = _b.scale, tx = _b.tx, ty = _b.ty, showToolbar = _b.showToolbar, enlargeWithGallary = _b.enlargeWithGallary, actions = _b.actions, imageGallaryClassName = _b.imageGallaryClassName;
         var __ = this.props.translate;
         return (_J$X_(React__default["default"].Fragment, null,
             React__default["default"].cloneElement(children, {
                 onImageEnlarge: this.handleImageEnlarge
             }),
-            _J$X_(Modal["default"], { closeOnEsc: true, size: "full", onHide: this.close, show: this.state.isOpened, contentClassName: cx('ImageGallery', imageGallaryClassName), container: modalContainer },
+            _J$X_(Modal["default"], { closeOnEsc: true, closeOnOutside: true, size: "full", onHide: this.close, show: this.state.isOpened, contentClassName: cx('ImageGallery', imageGallaryClassName), container: modalContainer },
                 _J$X_("a", { "data-tooltip": __('Dialog.close'), "data-position": "left", className: cx('ImageGallery-close'), onClick: this.close },
                     _J$X_(icons.Icon, { icon: "close", className: "icon" })),
                 ~index && items[index] ? (_J$X_(React__default["default"].Fragment, null,
                     _J$X_("div", { className: cx('ImageGallery-title') }, items[index].title),
                     _J$X_("div", { className: cx('ImageGallery-main'), ref: this.galleryMainRef },
-                        _J$X_("img", { src: items[index].originalSrc, style: { transform: "scale(".concat(scale, ") rotate(").concat(rotate, "deg)") } }),
+                        _J$X_("img", { draggable: false, src: items[index].originalSrc, style: {
+                                transform: "translate(".concat(tx, "px, ").concat(ty, "px) scale(").concat(scale, ") rotate(").concat(rotate, "deg)")
+                            } }),
                         showToolbar && Array.isArray(actions) && actions.length > 0
                             ? this.renderToolbar(actions)
                             : null,
@@ -228,6 +276,24 @@ var ImageGallery = /** @class */ (function (_super) {
         tslib.__metadata("design:paramtypes", [WheelEvent]),
         tslib.__metadata("design:returntype", void 0)
     ], ImageGallery.prototype, "onWheelScroll", null);
+    tslib.__decorate([
+        amisCore.autobind,
+        tslib.__metadata("design:type", Function),
+        tslib.__metadata("design:paramtypes", [MouseEvent]),
+        tslib.__metadata("design:returntype", void 0)
+    ], ImageGallery.prototype, "onMouseDown", null);
+    tslib.__decorate([
+        amisCore.autobind,
+        tslib.__metadata("design:type", Function),
+        tslib.__metadata("design:paramtypes", [MouseEvent]),
+        tslib.__metadata("design:returntype", void 0)
+    ], ImageGallery.prototype, "onMouseMove", null);
+    tslib.__decorate([
+        amisCore.autobind,
+        tslib.__metadata("design:type", Function),
+        tslib.__metadata("design:paramtypes", []),
+        tslib.__metadata("design:returntype", void 0)
+    ], ImageGallery.prototype, "onMouseUp", null);
     tslib.__decorate([
         amisCore.autobind,
         tslib.__metadata("design:type", Function),

package/lib/components/Input.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.4.2
+ * amis-ui v3.5.0
  * Copyright 2018-2023 fex
  */