react-native-modal - npm Package Compare versions

Comparing version 7.0.2 to 7.1.0-beta.1

ISSUE_TEMPLATE.md

@@ -8,6 +8,6 @@ ### When reporting a bug, please be sure to check if the issue still persists with react-native original modal:
 - [ ] A descriptive title
-- [ ] An *isolated* way to reproduce the behavior (example: GitHub repository with code isolated to the issue that anyone can clone to observe the problem)
 - [ ] What version of `react-native-modal` you're using, and the platform(s) you're running it on (iOS, Android, device)
 - [ ] What packages or other dependencies you're using
 - [ ] The behavior you expect to see, and the actual behavior
+- [ ] **Most important of all:** An *isolated* way to reproduce the behavior (example: GitHub repository with code isolated to the issue that anyone can clone to observe the problem)
 
@@ -14,0 +14,0 @@

package.json

 {
   "name": "react-native-modal",
-  "version": "7.0.2",
+  "version": "7.1.0-beta.1",
   "description": "An enhanced React-Native modal",
@@ -9,6 +9,5 @@ "main": "src/index.js",
     "lint": "eslint src",
-    "precommit": "lint-staged",
     "test": "npm run lint",
     "prettier": "prettier --write src/**/*.js",
-    "reset": "watchman watch-del-all && rm -rf node_modules/ && npm cache clean && npm prune && yarn cache clean"
+    "reset": "watchman watch-del-all && rm -rf node_modules/"
   },
@@ -34,22 +33,12 @@ "keywords": [
   "dependencies": {
-    "prop-types": "^15.6.1",
+    "prop-types": "^15.6.2",
     "react-native-animatable": "^1.2.4"
   },
   "devDependencies": {
-    "babel-eslint": "^8.2.2",
-    "eslint": "^4.19.1",
-    "eslint-plugin-react-app": "^3.0.0",
-    "husky": "0.14.3",
-    "lint-staged": "^7.0.0",
-    "prettier": "^1.11.1",
+    "eslint": "^5.13.0",
+    "eslint-plugin-react-app": "^4.0.1",
+    "prettier": "^1.16.4",
     "react": ">=15.0.0",
     "react-native": ">=0.24.0"
-  },
-  "lint-staged": {
-    "*.js": [
-      "eslint src",
-      "prettier --write",
-      "git add"
-    ]
   }
 }

README.md

@@ -151,2 +151,3 @@ # react-native-modal
 | hideModalContentWhileAnimating | bool             | false          | Enhances the performance by hiding the modal content until the animations complete           |
+| propagateSwipe                 | bool             | false          | Allows swipe events to propagate to children components (eg a ScrollView inside a modal)     |
 | style                          | any              | null           | Style applied to the modal                                                                   |
@@ -170,3 +171,3 @@
   const deviceWidth = Dimensions.get("window").width;
-  const deviceHeight = Platform.OS === "ios" 
+  const deviceHeight = Platform.OS === "ios"
     ? Dimensions.get("window").height
@@ -247,2 +248,26 @@ : require("react-native-extra-dimensions-android").get("REAL_WINDOW_HEIGHT");
 
+### The StatusBar style changes when the modal shows up
+
+This issue has ben discussed [here](https://github.com/react-native-community/react-native-modal/issues/50).  
+The TLDR is: it's a know React-Native issue with the Modal component 😞
+
+### The modal is not covering the entire screen
+
+The modal style applied by default has a small margin.  
+If you want the modal to cover the entire screen you can easily override it this way:  
+```js
+<Modal style = {{  margin: 0 }}>
+  ...
+</Modal>
+```
+
+### I can't scroll my ScrollView inside of the modal
+
+Enable propagateSwipe to allow your child components to receive swipe events:
+```js
+<Modal propagateSwipe>
+  ...
+</Modal>
+```
+
 ## Available animations
@@ -249,0 +274,0 @@

src/index.d.ts

@@ -28,2 +28,3 @@ declare module "react-native-modal" {
     hideModalContentWhileAnimating?: boolean;
+    propagateSwipe?: boolean;
     isVisible: boolean;
@@ -46,3 +47,7 @@ onModalShow?: () => void;
     onOrientationChange?: (orientation: "portrait" | "landscape") => void;
-    presentationStyle?: "fullScreen" | "pageSheet" | "formSheet" | "overFullScreen";
+    presentationStyle?:
+      | "fullScreen"
+      | "pageSheet"
+      | "formSheet"
+      | "overFullScreen";
   }
@@ -49,0 +54,0 @@

src/index.js

@@ -51,2 +51,3 @@ import React, { Component } from "react";
     hideModalContentWhileAnimating: PropTypes.bool,
+    propagateSwipe: PropTypes.bool,
     onModalShow: PropTypes.func,
@@ -91,2 +92,3 @@ onModalHide: PropTypes.func,
     hideModalContentWhileAnimating: false,
+    propagateSwipe: PropTypes.false,
     onBackdropPress: () => null,
@@ -197,7 +199,13 @@ onBackButtonPress: () => null,
       onMoveShouldSetPanResponder: (evt, gestureState) => {
-        // The number "4" is just a good tradeoff to make the panResponder
-        // work correctly even when the modal has touchable buttons.
-        // For reference:
-        // https://github.com/react-native-community/react-native-modal/pull/197
-        return Math.abs(gestureState.dx) >= 4 || Math.abs(gestureState.dy) >= 4;
+        // Use propagateSwipe to allow inner content to scroll. See PR:
+        // https://github.com/react-native-community/react-native-modal/pull/246
+        if (!this.props.propagateSwipe) {
+          // The number "4" is just a good tradeoff to make the panResponder
+          // work correctly even when the modal has touchable buttons.
+          // For reference:
+          // https://github.com/react-native-community/react-native-modal/pull/197
+          return (
+            Math.abs(gestureState.dx) >= 4 || Math.abs(gestureState.dy) >= 4
+          );
+        }
       },
@@ -430,2 +438,3 @@ onStartShouldSetPanResponder: () => {
       useNativeDriver,
+      propagateSwipe,
       style,
@@ -432,0 +441,0 @@ ...otherProps

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

35672

increased by2.87%

Dev dependency count

5

decreased by-37.5%

Lines of code

571

increased by2.51%

Number of lines in readme file

279

increased by9.84%

Worsened metrics

Number of low quality alerts

1

increased byInfinity%

Dependency changes

• Updatedprop-types@^15.6.2