demonstrate nestedScrolling implementation

Author: ammarahm-ed

example/App.js

@@ -1,25 +1,36 @@
-/**
- * Sample React Native App
- * https://github.com/facebook/react-native
- *
- * @format
- * @flow
- */
-
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import {
   SafeAreaView,
   StatusBar,
   TouchableOpacity,
   Text,
   View,
   TextInput,
+  ScrollView,
 } from 'react-native';
-import ActionSheet from 'react-native-actions-sheet';
+import ActionSheet, {addHasReachedTopListener, removeHasReachedTopListener} from 'react-native-actions-sheet';
+
 
 const App = () => {
+  const [nestedScrollEnabled, setNestedScrollEnabled] = useState(false);
+
   let actionSheet;
 
+  const _onHasReachedTop = () => {
+    setNestedScrollEnabled(true);
+  }
+
+  useEffect(() => {
+    addHasReachedTopListener(_onHasReachedTop)
+    return () => {
+        removeHasReachedTopListener(_onHasReachedTop)
+    }
+  },[])
+
+  const _onClose = () => {
+    setNestedScrollEnabled(false);
+  }
+
   return (
     <>
       <StatusBar barStyle="dark-content" />
@@ -61,11 +72,14 @@ const App = () => {
           bounceOnOpen={true}
           bounciness={8}
           gestureEnabled={true}
+          onClose={_onClose}
           defaultOverlayOpacity={0.3}>
-          <View
+          <ScrollView
+            nestedScrollEnabled={nestedScrollEnabled}
             style={{
               width: '100%',
               padding: 12,
+              maxHeight:500
             }}>
             <View
               style={{
@@ -105,7 +119,7 @@ const App = () => {
               placeholder="Write your text here"></TextInput>
 
             <View style={{}}>
-              {[100, 60, 150, 200, 170, 80, 40].map(item => (
+              {[100, 60, 150, 200, 170, 80, 41,101, 61, 151, 202, 172, 82, 43,103, 64, 155, 205, 176, 86, 46,106, 66, 152, 203, 173, 81, 42].map(item => (
                 <TouchableOpacity
                   key={item}
                   onPress={() => {
@@ -136,7 +150,8 @@ const App = () => {
                 </TouchableOpacity>
               ))}
             </View>
-          </View>
+          </ScrollView>
+
         </ActionSheet>
       </SafeAreaView>
     </>

example/ios/example.xcodeproj/project.pbxproj

@@ -194,7 +194,6 @@
 				48EE7C255324ED125727C018 /* Pods-exampleTests.debug.xcconfig */,
 				6102F24A6E168475D2E3F3DE /* Pods-exampleTests.release.xcconfig */,
 			);
-			name = Pods;
 			path = Pods;
 			sourceTree = "<group>";
 		};
@@ -308,6 +307,7 @@
 			developmentRegion = English;
 			hasScannedForEncodings = 0;
 			knownRegions = (
+				English,
 				en,
 				Base,
 			);

example/ios/example.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>IDEDidComputeMac32BitWarning</key>
+	<true/>
+</dict>
+</plist>

example/yarn.lock

@@ -5032,10 +5032,10 @@ react-is@^16.8.1, react-is@^16.8.4, react-is@^16.9.0:
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.12.0.tgz#2cc0fe0fba742d97fd527c42a13bec4eeb06241c"
   integrity sha512-rPCkf/mWBtKc97aLL9/txD8DZdemK0vkA3JMLShjlJB3Pj3s+lpf1KaBzMfQrAmhMQB0n1cU/SUGgKKBCe837Q==
 
-react-native-actions-sheet@^0.1.6:
-  version "0.1.6"
-  resolved "https://registry.yarnpkg.com/react-native-actions-sheet/-/react-native-actions-sheet-0.1.6.tgz#1b04cb22c565c252aad1840e2763e880e4796cab"
-  integrity sha512-3bGhRCBGKXpM5cA9S2/NMH2HQEDdMiMsP1Gl2HFcgK8dBlsgQcMiZv+JOrhewCJvUc1srbMWGitAYXBnEjYxfw==
+react-native-actions-sheet@^0.1.9:
+  version "0.1.9"
+  resolved "https://registry.yarnpkg.com/react-native-actions-sheet/-/react-native-actions-sheet-0.1.9.tgz#03409456a5d793a2ff36482b754270880a936d32"
+  integrity sha512-MYioZKkvNJr53Z0jGHK5MIuvXjptGmbzRgfqT16bgIyFjE2Wm0DK962K9c5s8bcfrRmeE+lJ+LV+nUQw6dRimQ==
 
 react-native@0.61.5:
   version "0.61.5"