- Remove deprecated prop-types

- Update index.d.ts
- Convert TouchableEffect to a function

Author: douglasjunior

index.d.ts

@@ -1,38 +1,26 @@
-declare module 'react-native-simple-dialogs' {
-    import * as React from 'react';
-    import {
-        StyleProp,
-        ViewStyle,
-        TextStyle,
-    } from 'react-native';
-
-    type animationType = 'none' | 'slide' | 'fade';
-
-    type supportedOrientationsType =
-        | 'portrait'
-        | 'portrait-upside-down'
-        | 'landscape'
-        | 'landscape-left'
-        | 'landscape-right';
-
-    type keyboardDismissModeType = 'none' | 'on-drag' | 'interactive';
+import * as React from 'react';
+import {
+    StyleProp,
+    ViewStyle,
+    TextStyle,
+    ScrollViewProps,
+    ActivityIndicatorProps,
+    ModalProps,
+    TouchableNativeFeedbackProps,
+    TouchableOpacityProps,
+} from 'react-native';
 
-    type keyboardShouldPersistTapsType =
-        | 'always'
-        | 'never'
-        | 'handled'
-        | false
-        | true;
+declare module 'react-native-simple-dialogs' {
 
     type activityIndicatorSizeType = 'small' | 'large' | number;
 
     export interface BaseProps {
         visible?: boolean;
         onRequestClose?: () => void;
-        animationType?: animationType;
+        animationType?: ModalProps['animationType'];
         onShow?: () => void;
         onOrientationChange?: () => void;
-        supportedOrientations?: supportedOrientationsType[];
+        supportedOrientations?: ModalProps['supportedOrientations'];
         onTouchOutside?: () => void;
         title?: string;
         titleStyle?: StyleProp<TextStyle>;
@@ -41,9 +29,9 @@ declare module 'react-native-simple-dialogs' {
         buttonsStyle?: StyleProp<ViewStyle>;
         overlayStyle?: StyleProp<ViewStyle>;
         buttons?: React.ReactNode | React.ReactNode[] | JSX.Element
-        keyboardDismissMode?: keyboardDismissModeType;
-        keyboardShouldPersistTaps?: keyboardShouldPersistTapsType;
-        contentInsetAdjustmentBehavior?: 'automatic' | 'scrollableAxes' | 'never' | 'always';
+        keyboardDismissMode?: ScrollViewProps['keyboardDismissMode'];
+        keyboardShouldPersistTaps?: ScrollViewProps['keyboardShouldPersistTaps'];
+        contentInsetAdjustmentBehavior?: ScrollViewProps['contentInsetAdjustmentBehavior'];
     }
 
     export interface DialogProps extends BaseProps {
@@ -53,9 +41,9 @@ declare module 'react-native-simple-dialogs' {
     export interface ProgressDialogProps extends BaseProps {
         message: string;
         messageStyle?: StyleProp<TextStyle>;
-        activityIndicatorColor?: string;
-        activityIndicatorSize?: activityIndicatorSizeType;
-        activityIndicatorStyle?: StyleProp<ViewStyle>;
+        activityIndicatorColor?: ActivityIndicatorProps['color'];
+        activityIndicatorSize?: ActivityIndicatorProps['size'];
+        activityIndicatorStyle?: ActivityIndicatorProps['style'];
     }
 
     export interface ButtonProps {
@@ -75,7 +63,10 @@ declare module 'react-native-simple-dialogs' {
     }
 
     export class Dialog extends React.Component<DialogProps> { }
+
     export class ProgressDialog extends React.Component<ProgressDialogProps> { }
+
     export class ConfirmDialog extends React.Component<ConfirmDialogProps> { }
-    export class TouchableEffect extends React.Component<Props> { }
+
+    export declare const TouchableEffect: React.FC<TouchableNativeFeedbackProps & TouchableOpacityProps>;
 }

index.js

@@ -31,5 +31,5 @@ export {
     Dialog,
     ProgressDialog,
     ConfirmDialog,
-    TouchableEffect
-}
+    TouchableEffect,
+}

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "react-native-simple-dialogs",
-	"version": "1.4.0",
+	"version": "1.5.0",
 	"description": "Cross-platform simple dialogs for React Native based on the Modal component. ⚛",
 	"private": false,
 	"repository": {

src/ConfirmDialog.js

@@ -25,14 +25,11 @@
 import React, { Component } from 'react'
 import {
     View,
-    ViewPropTypes,
     Text,
     Platform
 } from 'react-native'
 const { OS } = Platform;
 
-import PropTypes from 'prop-types';
-
 import Dialog from './Dialog'
 import TouchableEffect from './TouchableEffect';
 
@@ -162,26 +159,4 @@ class ConfirmDialog extends Component {
     }
 }
 
-const buttonPropType = PropTypes.shape({
-    title: PropTypes.string.isRequired,
-    onPress: PropTypes.func.isRequired,
-    disabled: PropTypes.bool,
-    titleStyle: PropTypes.shape({
-        ...Text.propTypes.style,
-        colorDisabled: PropTypes.string,
-    }),
-    style: PropTypes.shape({
-        ...ViewPropTypes.style,
-        backgroundColorDisabled: PropTypes.string,
-    })
-});
-
-ConfirmDialog.propTypes = {
-    ...Dialog.propTypes,
-    message: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
-    messageStyle: Text.propTypes.style,
-    negativeButton: buttonPropType,
-    positiveButton: buttonPropType.isRequired
-}
-
 export default ConfirmDialog

src/Dialog.js

@@ -26,16 +26,14 @@ import React, { Component } from 'react'
 import {
     Modal,
     View,
-    ViewPropTypes,
     TouchableWithoutFeedback,
     Text,
     Platform,
     SafeAreaView,
     ScrollView
 } from 'react-native'
-const { OS } = Platform;
 
-import PropTypes from 'prop-types';
+const { OS } = Platform;
 
 class Dialog extends Component {
 
@@ -143,7 +141,7 @@ class Dialog extends Component {
                         backgroundColor: "#000000AA",
                         padding: 24
                     }, overlayStyle]}>
-                        <SafeAreaView style={{flex: 1}}>
+                        <SafeAreaView style={{ flex: 1 }}>
                             {this._renderOutsideTouchable(onTouchOutside)}
 
                             <View style={[{
@@ -176,23 +174,6 @@ class Dialog extends Component {
     }
 }
 
-Dialog.propTypes = {
-    dialogStyle: ViewPropTypes.style,
-    contentStyle: ViewPropTypes.style,
-    buttonsStyle: ViewPropTypes.style,
-    overlayStyle: ViewPropTypes.style,
-    buttons: PropTypes.element,
-    visible: PropTypes.bool,
-    onRequestClose: PropTypes.func,
-    onShow: PropTypes.func,
-    onTouchOutside: PropTypes.func,
-    title: PropTypes.string,
-    titleStyle: Text.propTypes.style,
-    keyboardDismissMode: PropTypes.string,
-    keyboardShouldPersistTaps: PropTypes.string,
-    contentInsetAdjustmentBehavior: PropTypes.string,
-}
-
 Dialog.defaultProps = {
     visible: false,
     onRequestClose: () => null,

src/ProgressDialog.js

@@ -23,12 +23,10 @@
 */
 
 import React, { Component } from 'react'
-import PropTypes from 'prop-types';
 import {
     View,
     ActivityIndicator,
     Text,
-    ViewPropTypes
 } from 'react-native';
 
 import Dialog from './Dialog'
@@ -50,18 +48,4 @@ class ProgressDialog extends Component {
     }
 }
 
-ProgressDialog.propTypes = {
-    ...Dialog.propTypes,
-    message: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,
-    messageStyle: Text.propTypes.style,
-    activityIndicatorColor: PropTypes.string,
-    activityIndicatorSize: PropTypes.oneOfType([
-      PropTypes.string,
-      PropTypes.number
-    ]),
-    activityIndicatorStyle: ViewPropTypes.style
-}
-
-delete ProgressDialog.propTypes.children;
-
 export default ProgressDialog

src/TouchableEffect.js

@@ -31,29 +31,12 @@ import {
 
 const { OS } = Platform;
 
-class TouchableEffect extends Component {
-
-    render() {
-        let touchable;
-
-        if (OS === 'android') {
-            touchable = <TouchableNativeFeedback {...this.props} />
-        } else {
-            touchable = <TouchableOpacity {...this.props} />
-        }
-
-        return touchable;
+const TouchableEffect = (props) => {
+    if (OS === 'android') {
+        return <TouchableNativeFeedback {...props} />;
     }
-}
 
-if (OS === 'android') {
-    TouchableEffect.propTypes = { ...TouchableNativeFeedback.propTypes };
-} else {
-    TouchableEffect.propTypes = { ...TouchableOpacity.propTypes };
+    return <TouchableOpacity {...props} />;
 }
 
-TouchableEffect.defaultProps = {
-    background: OS === 'android' ? TouchableNativeFeedback.SelectableBackground() : undefined
-};
-
-export default TouchableEffect
+export default TouchableEffect;