From 55b12b9039bdf6bbc989e3b3493374ec362a42dc Mon Sep 17 00:00:00 2001 From: Guntter Date: Mon, 1 Mar 2021 15:39:45 +0200 Subject: [PATCH] restructured folders and files; readme updated --- README.md | 2 +- index.js | 6 +++--- package.json | 2 +- src/{pages => Cropper}/Cropper.page.tsx | 4 ++-- .../Cropper.style.ts} | 2 +- .../Cropper.tsx} | 2 +- src/{App.tsx => Main.tsx} | 12 +++++------ .../DefaultFooter.tsx} | 21 ++++++++++++++++--- src/common/index.ts | 1 + .../Footer/DefaultFooter.component.style.ts | 17 --------------- .../index.ts} | 0 11 files changed, 34 insertions(+), 35 deletions(-) rename src/{pages => Cropper}/Cropper.page.tsx (99%) rename src/{components/Cropper/Cropper.component.style.ts => Cropper/Cropper.style.ts} (98%) rename src/{components/Cropper/Cropper.component.tsx => Cropper/Cropper.tsx} (99%) rename src/{App.tsx => Main.tsx} (86%) rename src/{components/Footer/DefaultFooter.component.tsx => common/DefaultFooter.tsx} (68%) mode change 100755 => 100644 create mode 100644 src/common/index.ts delete mode 100755 src/components/Footer/DefaultFooter.component.style.ts rename src/{components/Cropper/Cropper.constants.ts => constants/index.ts} (100%) diff --git a/README.md b/README.md index 3f6a4e4..4c269d3 100644 --- a/README.md +++ b/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** -

NEW: This library was rewritten in Typescript. I am new to typescript, so if you have suggestions, PR's are welcome.

+

It is written in typescript!

    
diff --git a/index.js b/index.js index 498452e..3055523 100644 --- a/index.js +++ b/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 }; diff --git a/package.json b/package.json index 6f4bcab..6cfd615 100644 --- a/package.json +++ b/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", diff --git a/src/pages/Cropper.page.tsx b/src/Cropper/Cropper.page.tsx similarity index 99% rename from src/pages/Cropper.page.tsx rename to src/Cropper/Cropper.page.tsx index 9d67dfe..b6b071a 100644 --- a/src/pages/Cropper.page.tsx +++ b/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 = { diff --git a/src/components/Cropper/Cropper.component.style.ts b/src/Cropper/Cropper.style.ts similarity index 98% rename from src/components/Cropper/Cropper.component.style.ts rename to src/Cropper/Cropper.style.ts index 6d7d26c..2cdc69d 100644 --- a/src/components/Cropper/Cropper.component.style.ts +++ b/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({ diff --git a/src/components/Cropper/Cropper.component.tsx b/src/Cropper/Cropper.tsx similarity index 99% rename from src/components/Cropper/Cropper.component.tsx rename to src/Cropper/Cropper.tsx index 377d9a4..307a124 100644 --- a/src/components/Cropper/Cropper.component.tsx +++ b/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; diff --git a/src/App.tsx b/src/Main.tsx similarity index 86% rename from src/App.tsx rename to src/Main.tsx index aecf54c..54984b8 100644 --- a/src/App.tsx +++ b/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 { +class Main extends Component { static defaultProps = defaultProps; render() { return ( - { } } -export default App; +export default Main; diff --git a/src/components/Footer/DefaultFooter.component.tsx b/src/common/DefaultFooter.tsx old mode 100755 new mode 100644 similarity index 68% rename from src/components/Footer/DefaultFooter.component.tsx rename to src/common/DefaultFooter.tsx index 865a50c..38e0826 --- a/src/components/Footer/DefaultFooter.component.tsx +++ b/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 = props => ( ); -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, + }, +}); diff --git a/src/common/index.ts b/src/common/index.ts new file mode 100644 index 0000000..59528bb --- /dev/null +++ b/src/common/index.ts @@ -0,0 +1 @@ +export * from './DefaultFooter'; diff --git a/src/components/Footer/DefaultFooter.component.style.ts b/src/components/Footer/DefaultFooter.component.style.ts deleted file mode 100755 index 205c5c2..0000000 --- a/src/components/Footer/DefaultFooter.component.style.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { StyleSheet } from 'react-native'; - -export default StyleSheet.create({ - buttonsContainer: { - flexDirection: 'row', - alignItems: 'center', - justifyContent: 'space-between', - height: '100%', - }, - text: { - color: 'white', - fontSize: 16, - }, - touchable: { - padding: 10, - }, -}); diff --git a/src/components/Cropper/Cropper.constants.ts b/src/constants/index.ts similarity index 100% rename from src/components/Cropper/Cropper.constants.ts rename to src/constants/index.ts