├── .buckconfig ├── .eslintrc.js ├── .flowconfig ├── .gitattributes ├── .gitignore ├── .prettierrc.js ├── .watchmanconfig ├── App.js ├── Modal.js ├── README.md ├── __tests__ └── App-test.js ├── android ├── app │ ├── BUCK │ ├── build.gradle │ ├── build_defs.bzl │ ├── debug.keystore │ ├── proguard-rules.pro │ └── src │ │ ├── debug │ │ └── AndroidManifest.xml │ │ └── main │ │ ├── AndroidManifest.xml │ │ ├── java │ │ └── com │ │ │ └── samplemaps │ │ │ ├── MainActivity.java │ │ │ └── MainApplication.java │ │ └── res │ │ ├── mipmap-hdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ ├── mipmap-mdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ ├── mipmap-xhdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ ├── mipmap-xxhdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ ├── mipmap-xxxhdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ └── values │ │ ├── strings.xml │ │ └── styles.xml ├── build.gradle ├── gradle.properties ├── gradle │ └── wrapper │ │ ├── gradle-wrapper.jar │ │ └── gradle-wrapper.properties ├── gradlew ├── gradlew.bat └── settings.gradle ├── app.json ├── babel.config.js ├── index.js ├── ios ├── File.swift ├── PanModule.m ├── Podfile ├── Podfile.lock ├── SAmpl │ └── Fileee.swift ├── samplemaps-Bridging-Header.h ├── samplemaps-tvOS │ └── Info.plist ├── samplemaps-tvOSTests │ └── Info.plist ├── samplemaps.xcodeproj │ ├── project.pbxproj │ └── xcshareddata │ │ └── xcschemes │ │ ├── samplemaps-tvOS.xcscheme │ │ └── samplemaps.xcscheme ├── samplemaps.xcworkspace │ ├── contents.xcworkspacedata │ └── xcshareddata │ │ └── IDEWorkspaceChecks.plist ├── samplemaps │ ├── AppDelegate.h │ ├── AppDelegate.m │ ├── Base.lproj │ │ └── LaunchScreen.xib │ ├── Images.xcassets │ │ ├── AppIcon.appiconset │ │ │ └── Contents.json │ │ └── Contents.json │ ├── Info.plist │ ├── PanModal │ │ ├── Animator │ │ │ ├── PanModalAnimator.swift │ │ │ └── PanModalPresentationAnimator.swift │ │ ├── Controller │ │ │ └── PanModalPresentationController.swift │ │ ├── Delegate │ │ │ └── PanModalPresentationDelegate.swift │ │ ├── Info2.plist │ │ ├── PanModal.h │ │ ├── Presentable │ │ │ ├── PanModalHeight.swift │ │ │ ├── PanModalPresentable+Defaults.swift │ │ │ ├── PanModalPresentable+LayoutHelpers.swift │ │ │ ├── PanModalPresentable+UIViewController.swift │ │ │ └── PanModalPresentable.swift │ │ ├── Presenter │ │ │ ├── PanModalPresenter.swift │ │ │ └── UIViewController+PanModalPresenter.swift │ │ └── View │ │ │ ├── DimmedView.swift │ │ │ └── PanContainerView.swift │ ├── Sample │ │ ├── AppDelegate.swift │ │ ├── Resources │ │ │ ├── Assets.xcassets │ │ │ │ ├── AppIcon.appiconset │ │ │ │ │ ├── Contents.json │ │ │ │ │ ├── Icon-App-20x20@1x.png │ │ │ │ │ ├── Icon-App-20x20@2x.png │ │ │ │ │ ├── Icon-App-20x20@3x.png │ │ │ │ │ ├── Icon-App-29x29@1x.png │ │ │ │ │ ├── Icon-App-29x29@2x.png │ │ │ │ │ ├── Icon-App-29x29@3x.png │ │ │ │ │ ├── Icon-App-40x40@1x.png │ │ │ │ │ ├── Icon-App-40x40@2x.png │ │ │ │ │ ├── Icon-App-40x40@3x.png │ │ │ │ │ ├── Icon-App-57x57@1x.png │ │ │ │ │ ├── Icon-App-57x57@2x.png │ │ │ │ │ ├── Icon-App-60x60@2x.png │ │ │ │ │ ├── Icon-App-60x60@3x.png │ │ │ │ │ ├── Icon-App-72x72@1x.png │ │ │ │ │ ├── Icon-App-72x72@2x.png │ │ │ │ │ ├── Icon-App-76x76@1x.png │ │ │ │ │ ├── Icon-App-76x76@2x.png │ │ │ │ │ ├── Icon-App-83.5x83.5@2x.png │ │ │ │ │ ├── Icon-Small-50x50@1x.png │ │ │ │ │ ├── Icon-Small-50x50@2x.png │ │ │ │ │ └── ItunesArtwork@2x.png │ │ │ │ ├── Contents.json │ │ │ │ └── LaunchImage.launchimage │ │ │ │ │ ├── Contents.json │ │ │ │ │ ├── iPhone4_LaunchScreen_Placeholder.png │ │ │ │ │ ├── iPhone5_LaunchScreen_Placeholder.png │ │ │ │ │ ├── iPhone6Plus_LaunchScreen_Placeholder.png │ │ │ │ │ ├── iPhone6_LaunchScreen_Placeholder.png │ │ │ │ │ └── iPhoneX_LaunchScreen_Placeholder.png │ │ │ ├── Fonts │ │ │ │ ├── Lato-Bold.ttf │ │ │ │ └── Lato-Regular.ttf │ │ │ ├── Info.plist │ │ │ └── Preview.png │ │ ├── SampleViewController.swift │ │ └── View Controllers │ │ │ ├── Alert (Transient) │ │ │ └── TransientAlertViewController.swift │ │ │ ├── Alert │ │ │ ├── AlertView.swift │ │ │ └── AlertViewController.swift │ │ │ ├── Basic │ │ │ └── BasicViewController.swift │ │ │ ├── Full Screen │ │ │ └── FullScreenNavController.swift │ │ │ ├── User Groups (Navigation Controller) │ │ │ ├── NavigationController.swift │ │ │ └── ProfileViewController.swift │ │ │ ├── User Groups (Stacked) │ │ │ ├── StackedProfileViewController.swift │ │ │ └── UserGroupStackedViewController.swift │ │ │ └── User Groups │ │ │ ├── Presentables │ │ │ ├── UserGroupHeaderPresentable.swift │ │ │ └── UserGroupMemberPresentable.swift │ │ │ ├── UserGroupViewController.swift │ │ │ └── Views │ │ │ ├── UserGroupHeaderView.swift │ │ │ └── UserGroupMemberCell.swift │ └── main.m └── samplemapsTests │ ├── Info.plist │ └── samplemapsTests.m ├── metro.config.js ├── package.json └── yarn.lock /.buckconfig: -------------------------------------------------------------------------------- 1 | 2 | [android] 3 | target = Google Inc.:Google APIs:23 4 | 5 | [maven_repositories] 6 | central = https://repo1.maven.org/maven2 7 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | extends: '@react-native-community', 4 | }; 5 | -------------------------------------------------------------------------------- /.flowconfig: -------------------------------------------------------------------------------- 1 | [ignore] 2 | ; We fork some components by platform 3 | .*/*[.]android.js 4 | 5 | ; Ignore "BUCK" generated dirs 6 | /\.buckd/ 7 | 8 | ; Ignore polyfills 9 | node_modules/react-native/Libraries/polyfills/.* 10 | 11 | ; These should not be required directly 12 | ; require from fbjs/lib instead: require('fbjs/lib/warning') 13 | node_modules/warning/.* 14 | 15 | ; Flow doesn't support platforms 16 | .*/Libraries/Utilities/LoadingView.js 17 | 18 | [untyped] 19 | .*/node_modules/@react-native-community/cli/.*/.* 20 | 21 | [include] 22 | 23 | [libs] 24 | node_modules/react-native/Libraries/react-native/react-native-interface.js 25 | node_modules/react-native/flow/ 26 | 27 | [options] 28 | emoji=true 29 | 30 | esproposal.optional_chaining=enable 31 | esproposal.nullish_coalescing=enable 32 | 33 | module.file_ext=.js 34 | module.file_ext=.json 35 | module.file_ext=.ios.js 36 | 37 | munge_underscores=true 38 | 39 | module.name_mapper='^react-native$' -> '/node_modules/react-native/Libraries/react-native/react-native-implementation' 40 | module.name_mapper='^react-native/\(.*\)$' -> '/node_modules/react-native/\1' 41 | module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> '/node_modules/react-native/Libraries/Image/RelativeImageStub' 42 | 43 | suppress_type=$FlowIssue 44 | suppress_type=$FlowFixMe 45 | suppress_type=$FlowFixMeProps 46 | suppress_type=$FlowFixMeState 47 | 48 | suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(\\)? *\\(site=[a-z,_]*react_native\\(_ios\\)?_\\(oss\\|fb\\)[a-z,_]*\\)?)\\) 49 | suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(\\)? *\\(site=[a-z,_]*react_native\\(_ios\\)?_\\(oss\\|fb\\)[a-z,_]*\\)?)\\)?:? #[0-9]+ 50 | suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError 51 | 52 | [lints] 53 | sketchy-null-number=warn 54 | sketchy-null-mixed=warn 55 | sketchy-number=warn 56 | untyped-type-import=warn 57 | nonstrict-import=warn 58 | deprecated-type=warn 59 | unsafe-getters-setters=warn 60 | inexact-spread=warn 61 | unnecessary-invariant=warn 62 | signature-verification-failure=warn 63 | deprecated-utility=error 64 | 65 | [strict] 66 | deprecated-type 67 | nonstrict-import 68 | sketchy-null 69 | unclear-type 70 | unsafe-getters-setters 71 | untyped-import 72 | untyped-type-import 73 | 74 | [version] 75 | ^0.105.0 76 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | *.pbxproj -text 2 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # OSX 2 | # 3 | .DS_Store 4 | 5 | # Xcode 6 | # 7 | build/ 8 | *.pbxuser 9 | !default.pbxuser 10 | *.mode1v3 11 | !default.mode1v3 12 | *.mode2v3 13 | !default.mode2v3 14 | *.perspectivev3 15 | !default.perspectivev3 16 | xcuserdata 17 | *.xccheckout 18 | *.moved-aside 19 | DerivedData 20 | *.hmap 21 | *.ipa 22 | *.xcuserstate 23 | 24 | # Android/IntelliJ 25 | # 26 | build/ 27 | .idea 28 | .gradle 29 | local.properties 30 | *.iml 31 | 32 | # node.js 33 | # 34 | node_modules/ 35 | npm-debug.log 36 | yarn-error.log 37 | 38 | # BUCK 39 | buck-out/ 40 | \.buckd/ 41 | *.keystore 42 | !debug.keystore 43 | 44 | # fastlane 45 | # 46 | # It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the 47 | # screenshots whenever they are needed. 48 | # For more information about the recommended setup visit: 49 | # https://docs.fastlane.tools/best-practices/source-control/ 50 | 51 | */fastlane/report.xml 52 | */fastlane/Preview.html 53 | */fastlane/screenshots 54 | 55 | # Bundle artifact 56 | *.jsbundle 57 | 58 | # CocoaPods 59 | /ios/Pods/ 60 | -------------------------------------------------------------------------------- /.prettierrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | bracketSpacing: false, 3 | jsxBracketSameLine: true, 4 | singleQuote: true, 5 | trailingComma: 'all', 6 | }; 7 | -------------------------------------------------------------------------------- /.watchmanconfig: -------------------------------------------------------------------------------- 1 | {} -------------------------------------------------------------------------------- /App.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Sample React Native App 3 | * https://github.com/facebook/react-native 4 | * 5 | * @format 6 | * @flow 7 | */ 8 | 9 | import React from 'react'; 10 | import { 11 | Button, 12 | StyleSheet, 13 | ScrollView, 14 | View, 15 | Text, 16 | Switch, 17 | requireNativeComponent, 18 | TextInput, 19 | } from 'react-native'; 20 | 21 | import { 22 | Header, 23 | LearnMoreLinks, 24 | Colors, 25 | DebugInstructions, 26 | ReloadInstructions, 27 | } from 'react-native/Libraries/NewAppScreen'; 28 | import Modal from './Modal'; 29 | const createAppWithHeader = headerHeight => { 30 | return function App() { 31 | return ( 32 | 33 | {/* {/**/} 38 | 39 |
40 | {global.HermesInternal == null ? null : ( 41 | 42 | Engine: Hermes 43 | 44 | )} 45 | 46 | 47 | Step One 48 | 49 | Edit App.js to change this 50 | screen and then come back to see your edits. 51 | 52 | 53 | 54 | See Your Changes 55 | 56 | 57 | 58 | 59 | 60 | Debug 61 | 62 | 63 | 64 | 65 | 66 | Learn More 67 | 68 | Read the docs to discover what to do next: 69 | 70 | 71 | 72 | 73 | 74 | 75 | ); 76 | }; 77 | }; 78 | 79 | const SomeApp = createAppWithHeader(20); 80 | 81 | export default function ConfigScreen() { 82 | const [topOffset, setTopOffset] = React.useState(42); 83 | const [isShortFormEnabled, setIsShortFormEnabled] = React.useState(true); 84 | const [longFormHeight, setLongFormHeight] = React.useState(null); 85 | const [cornerRadius, setCornerRadius] = React.useState(8); 86 | const [springDamping, setSpringDamping] = React.useState(0.8); 87 | const [transitionDuration, setTransitionDuration] = React.useState(0.5); 88 | const [anchorModalToLongForm, setAnchorModalToLongForm] = React.useState( 89 | true, 90 | ); 91 | const [allowsDragToDismiss, setAllowsDragToDismiss] = React.useState(true); 92 | const [allowsTapToDismiss, setAllowsTapToDismiss] = React.useState(true); 93 | const [ 94 | isUserInteractionEnabled, 95 | setIsUserInteractionEnabled, 96 | ] = React.useState(true); 97 | const [isHapticFeedbackEnabled, setIsHapticFeedbackEnabled] = React.useState( 98 | true, 99 | ); 100 | const [shouldRoundTopCorners, setShouldRoundTopCorners] = React.useState( 101 | true, 102 | ); 103 | const [showDragIndicator, setShowDragIndicator] = React.useState(true); 104 | const [headerHeight, setHeaderHeight] = React.useState(50); 105 | const [shortFormHeight, setShortFormHeight] = React.useState(500); 106 | const [startFromShortForm, setStartFromShortForm] = React.useState(false); 107 | const [visible, setVisible] = React.useState(false); 108 | 109 | return ( 110 | 111 |