react-zoom-pan-pinch - npm Package Compare versions

Comparing version 1.4.1 to 1.4.5

dist/store/InitialState.d.ts

@@ -19,2 +19,4 @@ export declare const initialState: {
         centerContent: boolean;
+        wrapperClass: string;
+        contentClass: string;
     };
@@ -40,7 +42,8 @@ wheel: {
         velocityBaseTime: number;
+        velocityAnimationType: string;
         limitToWrapperBounds: boolean;
         padding: boolean;
         paddingSize: number;
-        animationTime: number;
-        animationType: string;
+        panReturnAnimationTime: number;
+        panReturnAnimationType: string;
         disableOnTarget: any[];
@@ -47,0 +50,0 @@ };

dist/store/StateContext.d.ts

@@ -27,2 +27,4 @@ import React, { Component } from "react";
             centerContent: boolean;
+            wrapperClass: string;
+            contentClass: string;
         };
@@ -48,7 +50,8 @@ wheel: {
             velocityBaseTime: number;
+            velocityAnimationType: string;
             limitToWrapperBounds: boolean;
             padding: boolean;
             paddingSize: number;
-            animationTime: number;
-            animationType: string;
+            panReturnAnimationTime: number;
+            panReturnAnimationType: string;
             disableOnTarget: any[];
@@ -131,6 +134,6 @@ };
     handleDbClick: (event: any) => void;
-    setScale: (scale: any) => void;
-    setPositionX: (positionX: any) => void;
-    setPositionY: (positionY: any) => void;
-    setTransform: (positionX: any, positionY: any, scale: any) => void;
+    setScale: (newScale: any, speed?: number, type?: string) => void;
+    setPositionX: (newPosX: any, speed?: number, type?: string) => void;
+    setPositionY: (newPosY: any, speed?: number, type?: string) => void;
+    setTransform: (newPosX: any, newPosY: any, newScale: any, speed?: number, type?: string) => void;
     resetTransform: () => void;
@@ -137,0 +140,0 @@ setDefaultState: () => void;

dist/store/utils.d.ts

@@ -39,3 +39,3 @@ /**
  */
-export declare const calculateBoundingArea: (wrapperWidth: any, contentWidth: any, diffWidth: any, wrapperHeight: any, contentHeight: any, diffHeight: any, limitToWrapperBounds: any) => {
+export declare const calculateBoundingArea: (wrapperWidth: any, newContentWidth: any, diffWidth: any, wrapperHeight: any, newContentHeight: any, diffHeight: any, limitToWrapperBounds: any) => {
     minPositionX: number;
@@ -89,1 +89,2 @@ maxPositionX: number;
 export declare const mergeProps: (initialState: any, dynamicProps: any) => {};
+export declare const additionalAnimationDelay = 45;

dist/store/zoom/utils.d.ts

@@ -11,3 +11,3 @@ export declare function checkZoomBounds(zoom: any, minScale: any, maxScale: any, zoomPadding: any, enablePadding: any): any;
 };
-export declare function getComponentsSizes(wrapperComponent: any, newScale: any): {
+export declare function getComponentsSizes(wrapperComponent: any, contentComponent: any, newScale: any): {
     wrapperWidth: any;
@@ -14,0 +14,0 @@ wrapperHeight: any;

package.json

 {
   "name": "react-zoom-pan-pinch",
-  "version": "1.4.1",
+  "version": "1.4.5",
   "description": "Zoom and pan html elements in easy way",
@@ -5,0 +5,0 @@ "author": "prc5",

README.md

@@ -6,3 +6,2 @@ # react-zoom-pan-pinch
 [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
-[![Package Quality](https://npm.packagequality.com/shield/react-zoom-pan-pinch.svg)](https://packagequality.com/#?package=react-zoom-pan-pinch)
 ![NPM](https://img.shields.io/npm/l/react-zoom-pan-pinch)
@@ -12,3 +11,4 @@ ![npm](https://img.shields.io/npm/dm/react-zoom-pan-pinch)
 
-> Super fast and light react npm package for zooming, panning and pinching html elements in easy way
+> Super fast and light react npm package for zooming, panning and pinching html
+> elements in easy way
 
@@ -70,3 +70,7 @@ ## Features
     return (
-      <TransformWrapper defaultScale={1} defaultPositionX={200} defaultPositionY={100}>
+      <TransformWrapper
+        defaultScale={1}
+        defaultPositionX={200}
+        defaultPositionY={100}
+      >
         {({ zoomIn, zoomOut, resetTransform, ...rest }) => (
@@ -81,3 +85,3 @@ <React.Fragment>
               <img src="image.jpg" alt="test" />
-              <div>Some text</div>
+              <div>Example text</div>
             </TransformComponent>
@@ -159,19 +163,20 @@ </React.Fragment>
 
-| Props                | Default |                                            Type |
-| :------------------- | :-----: | ----------------------------------------------: |
-| disabled             |  false  |                                         boolean |
-| disableOnTarget      |   []    | array of class names or node tags (div,span...) |
-| lockAxisX            |  false  |                                         boolean |
-| lockAxisY            |  false  |                                         boolean |
-| panPaddingShiftTime  |   50    |                                          number |
-| velocity             |  false  |                                         boolean |
-| velocityEqualToMove  |  false  |                                         boolean |
-| velocitySensitivity  |    1    |                                          number |
-| velocityMinSpeed     |   1.2   |                                          number |
-| velocityBaseTime     |  1800   |                                          number |
-| limitToWrapperBounds |  false  |                                         boolean |
-| padding              |  true   |                                         boolean |
-| paddingSize          |    6    |                                          number |
-| animationTime        |   200   |                                          number |
-| animationType        | easeOut |                                          string |
+| Props                 | Default |                                            Type |
+| :-------------------- | :-----: | ----------------------------------------------: |
+| disabled              |  false  |                                         boolean |
+| disableOnTarget       |   []    | array of class names or node tags (div,span...) |
+| lockAxisX             |  false  |                                         boolean |
+| lockAxisY             |  false  |                                         boolean |
+| panPaddingShiftTime   |   50    |                                          number |
+| velocity              |  false  |                                         boolean |
+| velocityEqualToMove   |  false  |                                         boolean |
+| velocitySensitivity   |    1    |                                          number |
+| velocityMinSpeed      |   1.2   |                                          number |
+| velocityBaseTime      |  1800   |                                          number |
+| velocityAnimationType | easeOut |                                          string |
+| limitToWrapperBounds  |  false  |                                         boolean |
+| padding               |  true   |                                         boolean |
+| paddingSize           |   40    |                                          number |
+| animationTime         |   200   |                                          number |
+| animationType         | easeOut |                                          string |
 
@@ -189,3 +194,3 @@ #### Pinch prop elements
 | disabled      |  false  | boolean |
-| step          |   60    |  number |
+| step          |   70    |  number |
 | animation     |  true   | boolean |
@@ -200,3 +205,3 @@ | animationTime |   200   |  number |
 | disabled      |  false  | boolean |
-| step          |   60    |  number |
+| step          |   70    |  number |
 | animation     |  true   | boolean |
@@ -211,3 +216,3 @@ | animationTime |   200   |  number |
 | disabled      |  false  |                  boolean |
-| step          |   60    |                   number |
+| step          |   70    |                   number |
 | animation     |  true   |                  boolean |
@@ -248,12 +253,12 @@ | animationTime |   200   |                   number |
 
-| Value                                     | Description                                    |      Type      |
-| :---------------------------------------- | :--------------------------------------------- | :------------: |
-| setScale(scale)                           | Sets scale                                     |     Number     |
-| setPositionX(positionX)                   | Sets position x                                |     Number     |
-| setPositionY(positionY)                   | Sets position y                                |     Number     |
-| zoomIn()                                  | Zooming in function, used for controls button  |      ---       |
-| zoomOut()                                 | Zooming out function, used for controls button |      ---       |
-| setTransform(positionX, positionY, scale) | Sets transformations of content                | Number or null |
-| resetTransform()                          | Reset transformations to the initial values    |     Number     |
-| dbClickMode                               | Available modes: "zoomIn", "zoomOut", "reset"  |     String     |
+| Value                                                                   | Description                                    |      Type      |
+| :---------------------------------------------------------------------- | :--------------------------------------------- | :------------: |
+| setScale(scale, animationTime, animationType)                           | Sets scale                                     |     Number     |
+| setPositionX(positionX, animationTime, animationType)                   | Sets position x                                |     Number     |
+| setPositionY(positionY, animationTime, animationType)                   | Sets position y                                |     Number     |
+| zoomIn()                                                                | Zooming in function, used for controls button  |      ---       |
+| zoomOut()                                                               | Zooming out function, used for controls button |      ---       |
+| setTransform(positionX, positionY, scale, animationTime, animationType) | Sets transformations of content                | Number or null |
+| resetTransform()                                                        | Reset transformations to the initial values    |     Number     |
+| dbClickMode                                                             | Available modes: "zoomIn", "zoomOut", "reset"  |     String     |
 
@@ -266,3 +271,4 @@ ## License
 
-Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
+Thanks goes to these wonderful people
+([emoji key](https://allcontributors.org/docs/en/emoji-key)):
 
@@ -283,3 +289,4 @@ <!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
 
-This project follows the [all-contributors](https://github.com/all-contributors/all-contributors)
+This project follows the
+[all-contributors](https://github.com/all-contributors/all-contributors)
 specification. Contributions of any kind welcome!

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

395462

increased by3.86%

Lines of code

3329

increased by5.02%

Number of lines in readme file

282

increased by2.55%

No dependency changes