Fix ref and PropTypes

README.md

@@ -1,12 +1,17 @@
 # react-native-transformable-image
 
+> This package is a fork of react-native-transformable-image that just have some
+> react updates.
+
+- Original package: [react-native-transformable-image](https://github.com/ldn0x7dc/react-native-transformable-image)
+
 A pure JavaScript written transformable image component, like PhotoView or ImageViewer, supports gestures like pan, pinch, double tab and fling, works with both iOS and Android.
 
 ![](Demo/demo.gif)
 
 
 
-Written in pure JS, this component should be one of the most easy to use component among all the zoomable, scrollable PhotoView alike views on react-native. 
+Written in pure JS, this component should be one of the most easy to use component among all the zoomable, scrollable PhotoView alike views on react-native.
 
 ## Install
 
@@ -38,7 +43,7 @@ You can provide `enableTransform`, `enableScale` and `enableTranslate`  props to
 
 #### Other props
 
-* `onTransformGestureReleased` and `onViewTransformed`: 
+* `onTransformGestureReleased` and `onViewTransformed`:
 
 ​	inherited from [react-native-view-transformer](https://github.com/ldn0x7dc/react-native-view-transformer)
 

library/TransformableImage.js

@@ -1,9 +1,10 @@
 'use strict';
 
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { Image } from 'react-native';
 
-import ViewTransformer from 'react-native-view-transformer';
+import ViewTransformer from 'react-native-view-transformer-next';
 
 let DEV = false;
 
@@ -83,10 +84,9 @@ export default class TransformableImage extends Component {
       }
     }
 
-
     return (
       <ViewTransformer
-        ref='viewTransformer'
+        ref={ref => (this.viewTransformer = ref)}
         key={'viewTransformer#' + this.state.keyAccumulator} //when image source changes, we should use a different node to avoid reusing previous transform state
         enableTransform={this.props.enableTransform && this.state.imageLoaded} //disable transform until image is loaded
         enableScale={this.props.enableScale}
@@ -98,14 +98,15 @@ export default class TransformableImage extends Component {
         maxScale={maxScale}
         contentAspectRatio={contentAspectRatio}
         onLayout={this.onLayout.bind(this)}
-        style={this.props.style}>
+        style={this.props.style}
+      >
         <Image
           {...this.props}
-          style={[this.props.style, {backgroundColor: 'transparent'}]}
+          style={[this.props.style, { backgroundColor: 'transparent' }]}
           resizeMode={'contain'}
           onLoadStart={this.onLoadStart.bind(this)}
           onLoad={this.onLoad.bind(this)}
-          capInsets={{left: 0.1, top: 0.1, right: 0.1, bottom: 0.1}} //on iOS, use capInsets to avoid image downsampling
+          capInsets={{ left: 0.1, top: 0.1, right: 0.1, bottom: 0.1 }} //on iOS, use capInsets to avoid image downsampling
         />
       </ViewTransformer>
     );
@@ -154,9 +155,15 @@ export default class TransformableImage extends Component {
               }
             }
           },
-          (error) => {
-            console.error('getImageSize...error=' + JSON.stringify(error) + ', source=' + JSON.stringify(source));
-          })
+          error => {
+            console.error(
+              'getImageSize...error=' +
+                JSON.stringify(error) +
+                ', source=' +
+                JSON.stringify(source)
+            )
+          }
+        )
       } else {
         console.warn('getImageSize...please provide pixels prop for local images');
       }

package.json

@@ -1,22 +1,27 @@
 {
-  "name": "react-native-transformable-image",
-  "version": "0.0.18",
+  "name": "@realgeeks/react-native-transformable-image",
+  "version": "0.1.1",
   "description": "",
   "main": "library/TransformableImage.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/ldn0x7dc/react-native-transformable-image.git"
+    "url": "git+https://github.com/realgeeks/react-native-transformable-image.git"
   },
   "author": "",
   "license": "ISC",
   "bugs": {
-    "url": "https://github.com/ldn0x7dc/react-native-transformable-image/issues"
+    "url": "https://github.com/realgeeks/react-native-transformable-image/issues"
+  },
+  "homepage": "https://github.com/realgeeks/react-native-transformable-image#readme",
+  "peerDependencies": {
+    "react": "*",
+    "react-native": "*",
+    "prop-types": "*"
   },
-  "homepage": "https://github.com/ldn0x7dc/react-native-transformable-image#readme",
   "dependencies": {
-    "react-native-view-transformer": "0.0.28"
+    "react-native-view-transformer-next": "0.0.30"
   }
 }