restructured folders and files; readme updated

README.md

@@ -1,7 +1,7 @@
 # react-native-amazing-cropper
 Image cropper for react native made with Animated API (with rotation possibility) - **for iOS & android**
 
-<p><b>NEW: </b> This library was rewritten in <b>Typescript</b>. I am new to typescript, so if you have suggestions, PR's are welcome.</p>
+<p><b>It is written in typescript!</b></p>
 
 <img src="https://i.imgur.com/c5lqfLr.png" height="400" />&nbsp;&nbsp;&nbsp;&nbsp;<img src="https://i.imgur.com/HNHkWQ7.png" height="400" />
 <br/>

index.js

@@ -1,5 +1,5 @@
-import App from './src/App';
-import DefaultFooter from './src/components/Footer/DefaultFooter.component';
+import Main from './src/Main';
+import { DefaultFooter } from './src/common';
 
-export default App;
+export default Main;
 export { DefaultFooter };

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-amazing-cropper",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "Custom react native cropper with rotation",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

src/pages/Cropper.page.tsx → src/Cropper/Cropper.page.tsx

@@ -3,8 +3,8 @@ import { Animated, PanResponder, PanResponderInstance, PanResponderGestureState,
 // @ts-ignore; 'react-native-image-rotate' does not have typescript support
 import RNImageRotate from 'react-native-image-rotate';
 import ImageEditor from '@react-native-community/image-editor';
-import { Q } from '../components/Cropper/Cropper.constants';
-import Cropper from '../components/Cropper/Cropper.component';
+import { Q } from '../constants';
+import Cropper from './Cropper';
 import { getCropperLimits } from '../utils';
 
 type CropperPageProps = {

src/components/Cropper/Cropper.component.style.ts → src/Cropper/Cropper.style.ts

@@ -1,5 +1,5 @@
 import { StyleSheet } from 'react-native';
-import { Q } from './Cropper.constants';
+import { Q } from '../constants';
 
 export default function getStyles(COMPONENT_WIDTH: number, COMPONENT_HEIGHT: number, W: number) {
   return StyleSheet.create({

src/components/Cropper/Cropper.component.tsx → src/Cropper/Cropper.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { View, Animated, Image, PanResponderInstance } from 'react-native';
-import getStyles from './Cropper.component.style';
+import getStyles from './Cropper.style';
 
 interface CropperProps {
   imageUri: string;

src/App.tsx → src/Main.tsx

@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
-import Cropper from './pages/Cropper.page';
-import DefaultFooter from './components/Footer/DefaultFooter.component';
-import { SCREEN_WIDTH, SCREEN_HEIGHT } from './components/Cropper/Cropper.constants';
+import CropperPage from './Cropper/Cropper.page';
+import { DefaultFooter } from './common';
+import { SCREEN_WIDTH, SCREEN_HEIGHT } from './constants';
 
 export type AmazingCropperProps = {
   footerComponent?: JSX.Element;
@@ -41,12 +41,12 @@ const defaultProps = {
   COMPONENT_HEIGHT: SCREEN_HEIGHT,
 };
 
-class App extends Component<AmazingCropperProps> {
+class Main extends Component<AmazingCropperProps> {
   static defaultProps = defaultProps;
 
   render() {
     return (
-      <Cropper
+      <CropperPage
         footerComponent={this.props.footerComponent}
         onDone={this.props.onDone}
         onError={this.props.onError}
@@ -68,4 +68,4 @@ class App extends Component<AmazingCropperProps> {
   }
 }
 
-export default App;
+export default Main;

src/components/Footer/DefaultFooter.component.tsx → src/common/DefaultFooter.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
-import { View, Text, TouchableOpacity } from 'react-native';
-import styles from './DefaultFooter.component.style';
+import { View, Text, TouchableOpacity, StyleSheet } from 'react-native';
 
 export type DefaultFooterProps = {
   onDone?: () => any;
@@ -25,4 +24,20 @@ const DefaultFooter: React.FC<DefaultFooterProps> = props => (
   </View>
 );
 
-export default DefaultFooter;
+export { DefaultFooter };
+
+const styles = StyleSheet.create({
+  buttonsContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    height: '100%',
+  },
+  text: {
+    color: 'white',
+    fontSize: 16,
+  },
+  touchable: {
+    padding: 10,
+  },
+});

src/common/index.ts

@@ -0,0 +1 @@
+export * from './DefaultFooter';