=
- useWorkletCallback(
- ({ contentOffset: { y } }, context) => {
- const {
- didStartAtMiddle,
- didDragBelowSecondSnapPoint,
- isDraggingDownFromTop,
- } = getScrollMetadata({
- context,
- animatedSnapPoints,
- gestureTranslationY,
- });
-
- if (
- didStartAtMiddle ||
- (isDraggingDownFromTop && didDragBelowSecondSnapPoint)
- ) {
- return;
- }
- if (animatedScrollableState.value === SCROLLABLE_STATE.LOCKED) {
- const lockPosition = context.initialContentOffsetY ?? 0;
- // @ts-ignore
- scrollTo(scrollableRef, 0, lockPosition, false);
- scrollableContentOffsetY.value = 0;
- return;
- }
- if (animatedAnimationState.value !== ANIMATION_STATE.RUNNING) {
- scrollableContentOffsetY.value = y;
- rootScrollableContentOffsetY.value = y;
- }
- },
- [
- scrollableRef,
- scrollableContentOffsetY,
- animatedAnimationState,
- animatedScrollableState,
- animatedSnapPoints,
- gestureTranslationY,
- rootScrollableContentOffsetY,
- ]
- );
-
- return {
- handleOnBeginDrag,
- handleOnScroll,
- handleOnEndDrag,
- handleOnMomentumEnd,
- };
-};
diff --git a/example/app/src/screens/index.ts b/example/app/src/screens/index.ts
deleted file mode 100644
index 69abdf95c..000000000
--- a/example/app/src/screens/index.ts
+++ /dev/null
@@ -1,124 +0,0 @@
-import { ShowcaseExampleScreenType } from '@gorhom/showcase-template';
-
-export const screens = [
- {
- title: 'Basic',
- data: [
- {
- name: 'View',
- slug: 'Basic/ViewExample',
- getScreen: () => require('./basic/BasicExamples').ViewExampleScreen,
- },
- {
- name: 'ScrollView',
- slug: 'Basic/ScrollViewExample',
- getScreen: () =>
- require('./basic/BasicExamples').ScrollViewExampleScreen,
- },
- {
- name: 'FlatList',
- slug: 'Basic/FlatListExample',
- getScreen: () => require('./basic/BasicExamples').FlatListExampleScreen,
- },
- {
- name: 'SectionList',
- slug: 'Basic/SectionListExample',
- getScreen: () =>
- require('./basic/BasicExamples').SectionListExampleScreen,
- },
- {
- name: 'VirtualizedList',
- slug: 'Basic/VirtualizedListExample',
- getScreen: () =>
- require('./basic/BasicExamples').VirtualizedListExampleScreen,
- },
- ],
- },
- {
- title: 'Modal',
- data: [
- {
- name: 'Simple',
- slug: 'Modal/SimpleExample',
- getScreen: () => require('./modal/SimpleExample').default,
- },
- {
- name: 'Backdrop',
- slug: 'Modal/BackdropExample',
- getScreen: () => require('./modal/BackdropExample').default,
- },
- {
- name: 'Stack Modals',
- slug: 'Modal/StackExample',
- getScreen: () => require('./modal/StackExample').default,
- },
- {
- name: 'Dynamic Snap Point',
- slug: 'Modal/DynamicSnapPointExample',
- getScreen: () => require('./modal/DynamicSnapPointExample').default,
- },
- {
- name: 'Detached',
- slug: 'Modal/DetachedExample',
- getScreen: () => require('./modal/DetachedExample').default,
- },
- ],
- },
- {
- title: 'Advanced',
- data: [
- {
- name: 'Custom Handle',
- slug: 'Advanced/CustomHandleExample',
- getScreen: () => require('./advanced/CustomHandleExample').default,
- },
- {
- name: 'Custom Background',
- slug: 'Advanced/CustomBackgroundExample',
- getScreen: () => require('./advanced/CustomBackgroundExample').default,
- },
- {
- name: 'Custom Theme',
- slug: 'Advanced/CustomThemeExample',
- getScreen: () => require('./advanced/CustomThemeExample').default,
- },
- {
- name: 'Backdrop',
- slug: 'Advanced/BackdropExample',
- getScreen: () => require('./advanced/BackdropExample').default,
- },
- {
- name: 'Dynamic Snap Point',
- slug: 'Advanced/DynamicSnapPointExample',
- getScreen: () => require('./advanced/DynamicSnapPointExample').default,
- },
- {
- name: 'Keyboard Handling',
- slug: 'Advanced/KeyboardHandlingExample',
- getScreen: () => require('./advanced/KeyboardHandlingExample').default,
- },
- {
- name: 'Shadow',
- slug: 'Advanced/ShadowExample',
- getScreen: () => require('./advanced/ShadowExample').default,
- },
- {
- name: 'Footer',
- slug: 'Advanced/FooterExample',
- getScreen: () => require('./advanced/FooterExample').default,
- },
- {
- name: 'Pull To Refresh',
- slug: 'Advanced/PullToRefreshExample',
- getScreen: () => require('./advanced/PullToRefreshExample').default,
- },
- {
- name: 'Custom Gesture Handling',
- slug: 'Advanced/CustomGestureHandling',
- getScreen: () =>
- require('./advanced/customGestureHandling/CustomGestureHandling')
- .default,
- },
- ] as ShowcaseExampleScreenType[],
- },
-];
diff --git a/example/app/tsconfig.json b/example/app/tsconfig.json
deleted file mode 100644
index fe28c76bf..000000000
--- a/example/app/tsconfig.json
+++ /dev/null
@@ -1,36 +0,0 @@
-{
- "compilerOptions": {
- "baseUrl": ".",
- "paths": {
- "@gorhom/bottom-sheet": ["../../src/index"],
- "@gorhom/showcase-template": [
- "../bare/node_modules/@gorhom/showcase-template"
- ],
- "react-native-safe-area-context": [
- "../bare/node_modules/react-native-safe-area-context"
- ],
- "@react-navigation/native": [
- "../bare/node_modules/@react-navigation/native"
- ]
- },
- "allowUnreachableCode": false,
- "allowUnusedLabels": false,
- "esModuleInterop": true,
- "forceConsistentCasingInFileNames": true,
- "jsx": "react",
- "lib": ["esnext"],
- "module": "esnext",
- "moduleResolution": "node",
- "noFallthroughCasesInSwitch": true,
- "noImplicitReturns": true,
- "noImplicitUseStrict": false,
- "noStrictGenericChecks": false,
- "noUnusedLocals": true,
- "noUnusedParameters": true,
- "resolveJsonModule": true,
- "skipLibCheck": true,
- "strict": true,
- "target": "esnext"
- },
- "include": ["src"]
-}
diff --git a/example/assets/adaptive-icon.png b/example/assets/adaptive-icon.png
new file mode 100644
index 000000000..a3a02eb1d
Binary files /dev/null and b/example/assets/adaptive-icon.png differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/50.png b/example/assets/favicon.png
similarity index 100%
rename from example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/50.png
rename to example/assets/favicon.png
diff --git a/example/assets/icon.png b/example/assets/icon.png
new file mode 100644
index 000000000..ec785685b
Binary files /dev/null and b/example/assets/icon.png differ
diff --git a/example/assets/splash.png b/example/assets/splash.png
new file mode 100644
index 000000000..e05dc271e
Binary files /dev/null and b/example/assets/splash.png differ
diff --git a/example/babel.config.js b/example/babel.config.js
new file mode 100644
index 000000000..ce75f8de3
--- /dev/null
+++ b/example/babel.config.js
@@ -0,0 +1,22 @@
+const path = require('path');
+const pak = require('../package.json');
+
+module.exports = function (api) {
+ api.cache(true);
+ return {
+ presets: ['babel-preset-expo'],
+ plugins: [
+ [
+ 'module-resolver',
+ {
+ extensions: ['.tsx', '.ts', '.js', '.json'],
+ alias: {
+ [pak.name]: path.join(__dirname, '..', pak.source),
+ },
+ },
+ ],
+ '@babel/plugin-proposal-export-namespace-from',
+ 'react-native-reanimated/plugin',
+ ],
+ };
+};
diff --git a/example/bare/android/.project b/example/bare/android/.project
deleted file mode 100644
index 3964dd3f5..000000000
--- a/example/bare/android/.project
+++ /dev/null
@@ -1,17 +0,0 @@
-
-
- android
- Project android created by Buildship.
-
-
-
-
- org.eclipse.buildship.core.gradleprojectbuilder
-
-
-
-
-
- org.eclipse.buildship.core.gradleprojectnature
-
-
diff --git a/example/bare/android/.settings/org.eclipse.buildship.core.prefs b/example/bare/android/.settings/org.eclipse.buildship.core.prefs
deleted file mode 100644
index e8895216f..000000000
--- a/example/bare/android/.settings/org.eclipse.buildship.core.prefs
+++ /dev/null
@@ -1,2 +0,0 @@
-connection.project.dir=
-eclipse.preferences.version=1
diff --git a/example/bare/android/app/build.gradle b/example/bare/android/app/build.gradle
deleted file mode 100644
index 604e0db44..000000000
--- a/example/bare/android/app/build.gradle
+++ /dev/null
@@ -1,307 +0,0 @@
-apply plugin: "com.android.application"
-
-import com.android.build.OutputFile
-import org.apache.tools.ant.taskdefs.condition.Os
-
-/**
- * The react.gradle file registers a task for each build variant (e.g. bundleDebugJsAndAssets
- * and bundleReleaseJsAndAssets).
- * These basically call `react-native bundle` with the correct arguments during the Android build
- * cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the
- * bundle directly from the development server. Below you can see all the possible configurations
- * and their defaults. If you decide to add a configuration block, make sure to add it before the
- * `apply from: "../../node_modules/react-native/react.gradle"` line.
- *
- * project.ext.react = [
- * // the name of the generated asset file containing your JS bundle
- * bundleAssetName: "index.android.bundle",
- *
- * // the entry file for bundle generation
- * entryFile: "index.android.js",
- *
- * // https://facebook.github.io/react-native/docs/performance#enable-the-ram-format
- * bundleCommand: "ram-bundle",
- *
- * // whether to bundle JS and assets in debug mode
- * bundleInDebug: false,
- *
- * // whether to bundle JS and assets in release mode
- * bundleInRelease: true,
- *
- * // whether to bundle JS and assets in another build variant (if configured).
- * // See http://tools.android.com/tech-docs/new-build-system/user-guide#TOC-Build-Variants
- * // The configuration property can be in the following formats
- * // 'bundleIn${productFlavor}${buildType}'
- * // 'bundleIn${buildType}'
- * // bundleInFreeDebug: true,
- * // bundleInPaidRelease: true,
- * // bundleInBeta: true,
- *
- * // whether to disable dev mode in custom build variants (by default only disabled in release)
- * // for BottomSheetExample: to disable dev mode in the staging build type (if configured)
- * devDisabledInStaging: true,
- * // The configuration property can be in the following formats
- * // 'devDisabledIn${productFlavor}${buildType}'
- * // 'devDisabledIn${buildType}'
- *
- * // the root of your project, i.e. where "package.json" lives
- * root: "../../",
- *
- * // where to put the JS bundle asset in debug mode
- * jsBundleDirDebug: "$buildDir/intermediates/assets/debug",
- *
- * // where to put the JS bundle asset in release mode
- * jsBundleDirRelease: "$buildDir/intermediates/assets/release",
- *
- * // where to put drawable resources / React Native assets, e.g. the ones you use via
- * // require('./image.png')), in debug mode
- * resourcesDirDebug: "$buildDir/intermediates/res/merged/debug",
- *
- * // where to put drawable resources / React Native assets, e.g. the ones you use via
- * // require('./image.png')), in release mode
- * resourcesDirRelease: "$buildDir/intermediates/res/merged/release",
- *
- * // by default the gradle tasks are skipped if none of the JS files or assets change; this means
- * // that we don't look at files in android/ or ios/ to determine whether the tasks are up to
- * // date; if you have any other folders that you want to ignore for performance reasons (gradle
- * // indexes the entire tree), add them here. Alternatively, if you have JS files in android/
- * // for BottomSheetExample, you might want to remove it from here.
- * inputExcludes: ["android/**", "ios/**"],
- *
- * // override which node gets called and with what additional arguments
- * nodeExecutableAndArgs: ["node"],
- *
- * // supply additional arguments to the packager
- * extraPackagerArgs: []
- * ]
- */
-
-project.ext.react = [
- enableHermes: true,
- entryFile: "index.ts",
-]
-
-apply from: "../../node_modules/react-native/react.gradle"
-
-/**
- * Set this to true to create two separate APKs instead of one:
- * - An APK that only works on ARM devices
- * - An APK that only works on x86 devices
- * The advantage is the size of the APK is reduced by about 4MB.
- * Upload all the APKs to the Play Store and people will download
- * the correct one based on the CPU architecture of their device.
- */
-def enableSeparateBuildPerCPUArchitecture = false
-
-/**
- * Run Proguard to shrink the Java bytecode in release builds.
- */
-def enableProguardInReleaseBuilds = false
-
-/**
- * The preferred build flavor of JavaScriptCore.
- *
- * For BottomSheetExample, to use the international variant, you can use:
- * `def jscFlavor = 'org.webkit:android-jsc-intl:+'`
- *
- * The international variant includes ICU i18n library and necessary data
- * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that
- * give correct results when using with locales other than en-US. Note that
- * this variant is about 6MiB larger per architecture than default.
- */
-def jscFlavor = 'org.webkit:android-jsc:+'
-
-/**
- * Whether to enable the Hermes VM.
- *
- * This should be set on project.ext.react and that value will be read here. If it is not set
- * on project.ext.react, JavaScript will not be compiled to Hermes Bytecode
- * and the benefits of using Hermes will therefore be sharply reduced.
- */
-def enableHermes = project.ext.react.get("enableHermes", false);
-
-/**
- * Architectures to build native code for in debug.
- */
-def reactNativeArchitectures() {
- def value = project.getProperties().get("reactNativeArchitectures")
- return value ? value.split(",") : ["armeabi-v7a", "x86", "x86_64", "arm64-v8a"]
-}
-
-android {
- compileSdkVersion rootProject.ext.compileSdkVersion
-
- defaultConfig {
- applicationId "dev.gorhom.bottomsheet"
- minSdkVersion rootProject.ext.minSdkVersion
- targetSdkVersion rootProject.ext.targetSdkVersion
- versionCode 1
- versionName "1.0"
- buildConfigField "boolean", "IS_NEW_ARCHITECTURE_ENABLED", isNewArchitectureEnabled().toString()
- if (isNewArchitectureEnabled()) {
- // We configure the NDK build only if you decide to opt-in for the New Architecture.
- externalNativeBuild {
- ndkBuild {
- arguments "APP_PLATFORM=android-21",
- "APP_STL=c++_shared",
- "NDK_TOOLCHAIN_VERSION=clang",
- "GENERATED_SRC_DIR=$buildDir/generated/source",
- "PROJECT_BUILD_DIR=$buildDir",
- "REACT_ANDROID_DIR=$rootDir/../node_modules/react-native/ReactAndroid",
- "REACT_ANDROID_BUILD_DIR=$rootDir/../node_modules/react-native/ReactAndroid/build",
- "NODE_MODULES_DIR=$rootDir/../node_modules"
- cFlags "-Wall", "-Werror", "-fexceptions", "-frtti", "-DWITH_INSPECTOR=1"
- cppFlags "-std=c++17"
- }
- }
- if (!enableSeparateBuildPerCPUArchitecture) {
- ndk {
- abiFilters (*reactNativeArchitectures())
- }
- }
- }
- }
- if (isNewArchitectureEnabled()) {
- // We configure the NDK build only if you decide to opt-in for the New Architecture.
- externalNativeBuild {
- ndkBuild {
- path "$projectDir/src/main/jni/Android.mk"
- }
- }
- def reactAndroidProjectDir = project(':ReactAndroid').projectDir
- def packageReactNdkDebugLibs = tasks.register("packageReactNdkDebugLibs", Copy) {
- dependsOn(":ReactAndroid:packageReactNdkDebugLibsForBuck")
- from("$reactAndroidProjectDir/src/main/jni/prebuilt/lib")
- into("$buildDir/react-ndk/exported")
- }
- def packageReactNdkReleaseLibs = tasks.register("packageReactNdkReleaseLibs", Copy) {
- dependsOn(":ReactAndroid:packageReactNdkReleaseLibsForBuck")
- from("$reactAndroidProjectDir/src/main/jni/prebuilt/lib")
- into("$buildDir/react-ndk/exported")
- }
- afterEvaluate {
- // If you wish to add a custom TurboModule or component locally,
- // you should uncomment this line.
- // preBuild.dependsOn("generateCodegenArtifactsFromSchema")
- preDebugBuild.dependsOn(packageReactNdkDebugLibs)
- preReleaseBuild.dependsOn(packageReactNdkReleaseLibs)
- // Due to a bug inside AGP, we have to explicitly set a dependency
- // between configureNdkBuild* tasks and the preBuild tasks.
- // This can be removed once this is solved: https://issuetracker.google.com/issues/207403732
- configureNdkBuildRelease.dependsOn(preReleaseBuild)
- configureNdkBuildDebug.dependsOn(preDebugBuild)
- reactNativeArchitectures().each { architecture ->
- tasks.findByName("configureNdkBuildDebug[${architecture}]")?.configure {
- dependsOn("preDebugBuild")
- }
- tasks.findByName("configureNdkBuildRelease[${architecture}]")?.configure {
- dependsOn("preReleaseBuild")
- }
- }
- }
- }
- splits {
- abi {
- reset()
- enable enableSeparateBuildPerCPUArchitecture
- universalApk false // If true, also generate a universal APK
- include (*reactNativeArchitectures())
- }
- }
- signingConfigs {
- debug {
- storeFile file('debug.keystore')
- storePassword 'android'
- keyAlias 'androiddebugkey'
- keyPassword 'android'
- }
- }
- buildTypes {
- debug {
- signingConfig signingConfigs.debug
- }
- release {
- // Caution! In production, you need to generate your own keystore file.
- // see https://facebook.github.io/react-native/docs/signed-apk-android.
- signingConfig signingConfigs.debug
- minifyEnabled enableProguardInReleaseBuilds
- proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
- }
- }
- // applicationVariants are e.g. debug, release
- applicationVariants.all { variant ->
- variant.outputs.each { output ->
- // For each separate APK per architecture, set a unique version code as described here:
- // https://developer.android.com/studio/build/configure-apk-splits.html
- def versionCodes = ["armeabi-v7a": 1, "x86": 2, "arm64-v8a": 3, "x86_64": 4]
- def abi = output.getFilter(OutputFile.ABI)
- if (abi != null) { // null for the universal-debug, universal-release variants
- output.versionCodeOverride =
- defaultConfig.versionCode * 1000 + versionCodes.get(abi)
- }
-
- }
- }
-}
-
-dependencies {
- implementation fileTree(dir: "libs", include: ["*.jar"])
- //noinspection GradleDynamicVersion
- implementation "com.facebook.react:react-native:+" // From node_modules
- implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.1.0"
- implementation 'androidx.work:work-runtime-ktx:2.7.1'
-
- debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
- exclude group:'com.facebook.fbjni'
- }
- debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {
- exclude group:'com.facebook.flipper'
- exclude group:'com.squareup.okhttp3', module:'okhttp'
- }
- debugImplementation("com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}") {
- exclude group:'com.facebook.flipper'
- }
-
- if (enableHermes) {
- //noinspection GradleDynamicVersion
- implementation("com.facebook.react:hermes-engine:+") { // From node_modules
- exclude group:'com.facebook.fbjni'
- }
- } else {
- implementation jscFlavor
- }
-
-}
-
-if (isNewArchitectureEnabled()) {
- // If new architecture is enabled, we let you build RN from source
- // Otherwise we fallback to a prebuilt .aar bundled in the NPM package.
- // This will be applied to all the imported transtitive dependency.
- configurations.all {
- resolutionStrategy.dependencySubstitution {
- substitute(module("com.facebook.react:react-native"))
- .using(project(":ReactAndroid"))
- .because("On New Architecture we're building React Native from source")
- substitute(module("com.facebook.react:hermes-engine"))
- .using(project(":ReactAndroid:hermes-engine"))
- .because("On New Architecture we're building Hermes from source")
- }
- }
-}
-
-// Run this once to be able to run the application with BUCK
-// puts all compile dependencies into folder libs for BUCK to use
-task copyDownloadableDepsToLibs(type: Copy) {
- from configurations.implementation
- into 'libs'
-}
-
-apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)
-
-def isNewArchitectureEnabled() {
- // To opt-in for the New Architecture, you can either:
- // - Set `newArchEnabled` to true inside the `gradle.properties` file
- // - Invoke gradle with `-newArchEnabled=true`
- // - Set an environment variable `ORG_GRADLE_PROJECT_newArchEnabled=true`
- return project.hasProperty("newArchEnabled") && project.newArchEnabled == "true"
-}
diff --git a/example/bare/android/app/debug.keystore b/example/bare/android/app/debug.keystore
deleted file mode 100644
index 364e105ed..000000000
Binary files a/example/bare/android/app/debug.keystore and /dev/null differ
diff --git a/example/bare/android/app/proguard-rules.pro b/example/bare/android/app/proguard-rules.pro
deleted file mode 100644
index 2059464ad..000000000
--- a/example/bare/android/app/proguard-rules.pro
+++ /dev/null
@@ -1,12 +0,0 @@
-# Add project specific ProGuard rules here.
-# By default, the flags in this file are appended to flags specified
-# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt
-# You can edit the include path and order by changing the proguardFiles
-# directive in build.gradle.
-#
-# For more details, see
-# http://developer.android.com/guide/developing/tools/proguard.html
-
-# Add any project specific keep options here:
-
--keep class com.facebook.react.turbomodule.** { *; }
diff --git a/example/bare/android/app/src/debug/AndroidManifest.xml b/example/bare/android/app/src/debug/AndroidManifest.xml
deleted file mode 100644
index 85182f0d7..000000000
--- a/example/bare/android/app/src/debug/AndroidManifest.xml
+++ /dev/null
@@ -1,15 +0,0 @@
-
-
-
-
-
-
-
-
-
diff --git a/example/bare/android/app/src/debug/java/dev/gorhom/bottomsheet/ReactNativeFlipper.java b/example/bare/android/app/src/debug/java/dev/gorhom/bottomsheet/ReactNativeFlipper.java
deleted file mode 100644
index f1bb0a128..000000000
--- a/example/bare/android/app/src/debug/java/dev/gorhom/bottomsheet/ReactNativeFlipper.java
+++ /dev/null
@@ -1,70 +0,0 @@
-/**
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the LICENSE file in the root
- * directory of this source tree.
- */
-package dev.gorhom.bottomsheet;
-
-import android.content.Context;
-import com.facebook.flipper.android.AndroidFlipperClient;
-import com.facebook.flipper.android.utils.FlipperUtils;
-import com.facebook.flipper.core.FlipperClient;
-import com.facebook.flipper.plugins.crashreporter.CrashReporterPlugin;
-import com.facebook.flipper.plugins.databases.DatabasesFlipperPlugin;
-import com.facebook.flipper.plugins.fresco.FrescoFlipperPlugin;
-import com.facebook.flipper.plugins.inspector.DescriptorMapping;
-import com.facebook.flipper.plugins.inspector.InspectorFlipperPlugin;
-import com.facebook.flipper.plugins.network.FlipperOkhttpInterceptor;
-import com.facebook.flipper.plugins.network.NetworkFlipperPlugin;
-import com.facebook.flipper.plugins.react.ReactFlipperPlugin;
-import com.facebook.flipper.plugins.sharedpreferences.SharedPreferencesFlipperPlugin;
-import com.facebook.react.ReactInstanceEventListener;
-import com.facebook.react.ReactInstanceManager;
-import com.facebook.react.bridge.ReactContext;
-import com.facebook.react.modules.network.NetworkingModule;
-import okhttp3.OkHttpClient;
-
-public class ReactNativeFlipper {
- public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {
- if (FlipperUtils.shouldEnableFlipper(context)) {
- final FlipperClient client = AndroidFlipperClient.getInstance(context);
- client.addPlugin(new InspectorFlipperPlugin(context, DescriptorMapping.withDefaults()));
- client.addPlugin(new ReactFlipperPlugin());
- client.addPlugin(new DatabasesFlipperPlugin(context));
- client.addPlugin(new SharedPreferencesFlipperPlugin(context));
- client.addPlugin(CrashReporterPlugin.getInstance());
- NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
- NetworkingModule.setCustomClientBuilder(
- new NetworkingModule.CustomClientBuilder() {
- @Override
- public void apply(OkHttpClient.Builder builder) {
- builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
- }
- });
- client.addPlugin(networkFlipperPlugin);
- client.start();
- // Fresco Plugin needs to ensure that ImagePipelineFactory is initialized
- // Hence we run if after all native modules have been initialized
- ReactContext reactContext = reactInstanceManager.getCurrentReactContext();
- if (reactContext == null) {
- reactInstanceManager.addReactInstanceEventListener(
- new ReactInstanceEventListener() {
- @Override
- public void onReactContextInitialized(ReactContext reactContext) {
- reactInstanceManager.removeReactInstanceEventListener(this);
- reactContext.runOnNativeModulesQueueThread(
- new Runnable() {
- @Override
- public void run() {
- client.addPlugin(new FrescoFlipperPlugin());
- }
- });
- }
- });
- } else {
- client.addPlugin(new FrescoFlipperPlugin());
- }
- }
- }
-}
diff --git a/example/bare/android/app/src/main/AndroidManifest.xml b/example/bare/android/app/src/main/AndroidManifest.xml
deleted file mode 100644
index 53fd748bd..000000000
--- a/example/bare/android/app/src/main/AndroidManifest.xml
+++ /dev/null
@@ -1,30 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/example/bare/android/app/src/main/ic_launcher-playstore.png b/example/bare/android/app/src/main/ic_launcher-playstore.png
deleted file mode 100644
index 4367b20da..000000000
Binary files a/example/bare/android/app/src/main/ic_launcher-playstore.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/MainActivity.java b/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/MainActivity.java
deleted file mode 100644
index ee34d1363..000000000
--- a/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/MainActivity.java
+++ /dev/null
@@ -1,50 +0,0 @@
-package dev.gorhom.bottomsheet;
-
-import android.os.Bundle;
-
-import com.facebook.react.ReactActivity;
-import com.facebook.react.ReactActivityDelegate;
-import com.facebook.react.ReactRootView;
-
-public class MainActivity extends ReactActivity {
-
- @Override
- protected void onCreate(Bundle savedInstanceState) {
- super.onCreate(null);
- }
-
- /**
- * Returns the name of the main component registered from JavaScript. This is used to schedule
- * rendering of the component.
- */
- @Override
- protected String getMainComponentName() {
- return "BottomSheetExample";
- }
-
- @Override
- protected ReactActivityDelegate createReactActivityDelegate() {
- return new MainActivityDelegate(this, getMainComponentName());
- }
-
- public static class MainActivityDelegate extends ReactActivityDelegate {
- public MainActivityDelegate(ReactActivity activity, String mainComponentName) {
- super(activity, mainComponentName);
- }
-
- @Override
- protected ReactRootView createRootView() {
- ReactRootView reactRootView = new ReactRootView(getContext());
- // If you opted-in for the New Architecture, we enable the Fabric Renderer.
- reactRootView.setIsFabric(BuildConfig.IS_NEW_ARCHITECTURE_ENABLED);
- return reactRootView;
- }
-
- @Override
- protected boolean isConcurrentRootEnabled() {
- // If you opted-in for the New Architecture, we enable Concurrent Root (i.e. React 18).
- // More on this on https://reactjs.org/blog/2022/03/29/react-v18.html
- return BuildConfig.IS_NEW_ARCHITECTURE_ENABLED;
- }
- }
-}
diff --git a/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/MainApplication.java b/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/MainApplication.java
deleted file mode 100644
index 4dfe31d6e..000000000
--- a/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/MainApplication.java
+++ /dev/null
@@ -1,97 +0,0 @@
-package dev.gorhom.bottomsheet;
-
-import android.app.Application;
-import android.content.Context;
-
-import com.facebook.react.PackageList;
-import com.facebook.react.ReactApplication;
-import com.facebook.react.ReactNativeHost;
-import com.facebook.react.ReactPackage;
-import com.facebook.react.config.ReactFeatureFlags;
-import com.facebook.react.ReactInstanceManager;
-import com.facebook.react.bridge.JSIModulePackage;
-import com.facebook.soloader.SoLoader;
-
-import java.lang.reflect.InvocationTargetException;
-import java.util.List;
-
-import com.swmansion.reanimated.ReanimatedJSIModulePackage;
-
-public class MainApplication extends Application implements ReactApplication {
-
- private final ReactNativeHost mNewArchitectureNativeHost =
- new MainApplicationReactNativeHost(this);
-
- private final ReactNativeHost mReactNativeHost =
- new ReactNativeHost(this) {
- @Override
- public boolean getUseDeveloperSupport() {
- return BuildConfig.DEBUG;
- }
-
- @Override
- protected List getPackages() {
- @SuppressWarnings("UnnecessaryLocalVariable")
- List packages = new PackageList(this).getPackages();
- // Packages that cannot be autolinked yet can be added manually here, for BottomSheetExample:
- // packages.add(new MyReactNativePackage());
- return packages;
- }
-
- @Override
- protected String getJSMainModuleName() {
- return "index";
- }
-
- @Override
- protected JSIModulePackage getJSIModulePackage() {
- return new ReanimatedJSIModulePackage();
- }
- };
-
- @Override
- public ReactNativeHost getReactNativeHost() {
- if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
- return mNewArchitectureNativeHost;
- } else {
- return mReactNativeHost;
- }
- }
-
- @Override
- public void onCreate() {
- super.onCreate();
- // If you opted-in for the New Architecture, we enable the TurboModule system
- ReactFeatureFlags.useTurboModules = BuildConfig.IS_NEW_ARCHITECTURE_ENABLED;
- SoLoader.init(this, /* native exopackage */ false);
- initializeFlipper(this, getReactNativeHost().getReactInstanceManager()); // Remove this line if you don't want Flipper enabled
- }
-
- /**
- * Loads Flipper in React Native templates.
- *
- * @param context
- */
- private static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {
- if (BuildConfig.DEBUG) {
- try {
- /*
- We use reflection here to pick up the class that initializes Flipper,
- since Flipper library is not available in release mode
- */
- Class> aClass = Class.forName("dev.gorhom.bottomsheet.ReactNativeFlipper");
- aClass
- .getMethod("initializeFlipper", Context.class, ReactInstanceManager.class)
- .invoke(null, context, reactInstanceManager);
- } catch (ClassNotFoundException e) {
- e.printStackTrace();
- } catch (NoSuchMethodException e) {
- e.printStackTrace();
- } catch (IllegalAccessException e) {
- e.printStackTrace();
- } catch (InvocationTargetException e) {
- e.printStackTrace();
- }
- }
- }
-}
diff --git a/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/MainApplicationReactNativeHost.java b/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/MainApplicationReactNativeHost.java
deleted file mode 100644
index 4866392b1..000000000
--- a/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/MainApplicationReactNativeHost.java
+++ /dev/null
@@ -1,119 +0,0 @@
-package dev.gorhom.bottomsheet;
-
-import android.app.Application;
-
-import androidx.annotation.NonNull;
-
-import com.facebook.react.PackageList;
-import com.facebook.react.ReactInstanceManager;
-import com.facebook.react.ReactNativeHost;
-import com.facebook.react.ReactPackage;
-import com.facebook.react.ReactPackageTurboModuleManagerDelegate;
-import com.facebook.react.bridge.JSIModulePackage;
-import com.facebook.react.bridge.JSIModuleProvider;
-import com.facebook.react.bridge.JSIModuleSpec;
-import com.facebook.react.bridge.JSIModuleType;
-import com.facebook.react.bridge.JavaScriptContextHolder;
-import com.facebook.react.bridge.ReactApplicationContext;
-import com.facebook.react.bridge.UIManager;
-import com.facebook.react.fabric.ComponentFactory;
-import com.facebook.react.fabric.CoreComponentsRegistry;
-import com.facebook.react.fabric.ReactNativeConfig;
-import com.facebook.react.fabric.FabricJSIModuleProvider;
-import com.facebook.react.uimanager.ViewManagerRegistry;
-
-import dev.gorhom.bottomsheet.components.MainComponentsRegistry;
-import dev.gorhom.bottomsheet.modules.MainApplicationTurboModuleManagerDelegate;
-
-import java.util.ArrayList;
-import java.util.List;
-
-/**
- * A {@link ReactNativeHost} that helps you load everything needed for the New Architecture, both
- * TurboModule delegates and the Fabric Renderer.
- *
- * Please note that this class is used ONLY if you opt-in for the New Architecture (see the
- * `newArchEnabled` property). Is ignored otherwise.
- */
-public class MainApplicationReactNativeHost extends ReactNativeHost {
- public MainApplicationReactNativeHost(Application application) {
- super(application);
- }
-
- @Override
- public boolean getUseDeveloperSupport() {
- return BuildConfig.DEBUG;
- }
-
- @Override
- protected List getPackages() {
- List packages = new PackageList(this).getPackages();
- // Packages that cannot be autolinked yet can be added manually here, for example:
- // packages.add(new MyReactNativePackage());
- // TurboModules must also be loaded here providing a valid TurboReactPackage implementation:
- // packages.add(new TurboReactPackage() { ... });
- // If you have custom Fabric Components, their ViewManagers should also be loaded here
- // inside a ReactPackage.
- return packages;
- }
-
- @Override
- protected String getJSMainModuleName() {
- return "index";
- }
-
- @NonNull
- @Override
- protected ReactPackageTurboModuleManagerDelegate.Builder
- getReactPackageTurboModuleManagerDelegateBuilder() {
- // Here we provide the ReactPackageTurboModuleManagerDelegate Builder. This is necessary
- // for the new architecture and to use TurboModules correctly.
- return new MainApplicationTurboModuleManagerDelegate.Builder();
- }
-
- @Override
- protected JSIModulePackage getJSIModulePackage() {
- return new JSIModulePackage() {
- @Override
- public List getJSIModules(
- final ReactApplicationContext reactApplicationContext,
- final JavaScriptContextHolder jsContext) {
- final List specs = new ArrayList<>();
-
- // Here we provide a new JSIModuleSpec that will be responsible of providing the
- // custom Fabric Components.
- specs.add(
- new JSIModuleSpec() {
- @Override
- public JSIModuleType getJSIModuleType() {
- return JSIModuleType.UIManager;
- }
-
- @Override
- public JSIModuleProvider getJSIModuleProvider() {
- final ComponentFactory componentFactory = new ComponentFactory();
- CoreComponentsRegistry.register(componentFactory);
-
- // Here we register a Components Registry.
- // The one that is generated with the template contains no components
- // and just provides you the one from React Native core.
- MainComponentsRegistry.register(componentFactory);
-
- final ReactInstanceManager reactInstanceManager = getReactInstanceManager();
-
- ViewManagerRegistry viewManagerRegistry =
- new ViewManagerRegistry(
- reactInstanceManager.getOrCreateViewManagers(reactApplicationContext));
-
- return new FabricJSIModuleProvider(
- reactApplicationContext,
- componentFactory,
- ReactNativeConfig.DEFAULT_CONFIG,
- viewManagerRegistry);
- }
- });
- return specs;
- }
- };
- }
-}
diff --git a/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/components/MainComponentsRegistry.java b/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/components/MainComponentsRegistry.java
deleted file mode 100644
index 297a3168b..000000000
--- a/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/components/MainComponentsRegistry.java
+++ /dev/null
@@ -1,37 +0,0 @@
-package dev.gorhom.bottomsheet.components;
-
-import com.facebook.jni.HybridData;
-import com.facebook.proguard.annotations.DoNotStrip;
-import com.facebook.react.fabric.ComponentFactory;
-import com.facebook.soloader.SoLoader;
-
-/**
- * Class responsible to load the custom Fabric Components. This class has native methods and needs a
- * corresponding C++ implementation/header file to work correctly (already placed inside the jni/
- * folder for you).
- *
- * Please note that this class is used ONLY if you opt-in for the New Architecture (see the
- * `newArchEnabled` property). Is ignored otherwise.
- */
-@DoNotStrip
-public class MainComponentsRegistry {
- static {
- SoLoader.loadLibrary("fabricjni");
- }
-
- @DoNotStrip
- private final HybridData mHybridData;
-
- @DoNotStrip
- private native HybridData initHybrid(ComponentFactory componentFactory);
-
- @DoNotStrip
- private MainComponentsRegistry(ComponentFactory componentFactory) {
- mHybridData = initHybrid(componentFactory);
- }
-
- @DoNotStrip
- public static MainComponentsRegistry register(ComponentFactory componentFactory) {
- return new MainComponentsRegistry(componentFactory);
- }
-}
diff --git a/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/modules/MainApplicationTurboModuleManagerDelegate.java b/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/modules/MainApplicationTurboModuleManagerDelegate.java
deleted file mode 100644
index 101bf2785..000000000
--- a/example/bare/android/app/src/main/java/dev/gorhom/bottomsheet/modules/MainApplicationTurboModuleManagerDelegate.java
+++ /dev/null
@@ -1,49 +0,0 @@
-package dev.gorhom.bottomsheet.modules;
-
-import com.facebook.jni.HybridData;
-import com.facebook.react.ReactPackage;
-import com.facebook.react.ReactPackageTurboModuleManagerDelegate;
-import com.facebook.react.bridge.ReactApplicationContext;
-import com.facebook.soloader.SoLoader;
-
-import java.util.List;
-
-/**
- * Class responsible to load the TurboModules. This class has native methods and needs a
- * corresponding C++ implementation/header file to work correctly (already placed inside the jni/
- * folder for you).
- *
- *
Please note that this class is used ONLY if you opt-in for the New Architecture (see the
- * `newArchEnabled` property). Is ignored otherwise.
- */
-public class MainApplicationTurboModuleManagerDelegate
- extends ReactPackageTurboModuleManagerDelegate {
-
- private static volatile boolean sIsSoLibraryLoaded;
-
- protected MainApplicationTurboModuleManagerDelegate(
- ReactApplicationContext reactApplicationContext, List packages) {
- super(reactApplicationContext, packages);
- }
-
- protected native HybridData initHybrid();
-
- native boolean canCreateTurboModule(String moduleName);
-
- public static class Builder extends ReactPackageTurboModuleManagerDelegate.Builder {
- protected MainApplicationTurboModuleManagerDelegate build(
- ReactApplicationContext context, List packages) {
- return new MainApplicationTurboModuleManagerDelegate(context, packages);
- }
- }
-
- @Override
- protected synchronized void maybeLoadOtherSoLibraries() {
- if (!sIsSoLibraryLoaded) {
- // If you change the name of your application .so file in the Android.mk file,
- // make sure you update the name here as well.
- SoLoader.loadLibrary("bottomsheet_appmodules");
- sIsSoLibraryLoaded = true;
- }
- }
-}
diff --git a/example/bare/android/app/src/main/jni/Android.mk b/example/bare/android/app/src/main/jni/Android.mk
deleted file mode 100644
index 161c5ece4..000000000
--- a/example/bare/android/app/src/main/jni/Android.mk
+++ /dev/null
@@ -1,48 +0,0 @@
-THIS_DIR := $(call my-dir)
-
-include $(REACT_ANDROID_DIR)/Android-prebuilt.mk
-
-# If you wish to add a custom TurboModule or Fabric component in your app you
-# will have to include the following autogenerated makefile.
-# include $(GENERATED_SRC_DIR)/codegen/jni/Android.mk
-include $(CLEAR_VARS)
-
-LOCAL_PATH := $(THIS_DIR)
-
-# You can customize the name of your application .so file here.
-LOCAL_MODULE := bottomsheet_appmodules
-
-LOCAL_C_INCLUDES := $(LOCAL_PATH)
-LOCAL_SRC_FILES := $(wildcard $(LOCAL_PATH)/*.cpp)
-LOCAL_EXPORT_C_INCLUDES := $(LOCAL_PATH)
-
-# If you wish to add a custom TurboModule or Fabric component in your app you
-# will have to uncomment those lines to include the generated source
-# files from the codegen (placed in $(GENERATED_SRC_DIR)/codegen/jni)
-#
-# LOCAL_C_INCLUDES += $(GENERATED_SRC_DIR)/codegen/jni
-# LOCAL_SRC_FILES += $(wildcard $(GENERATED_SRC_DIR)/codegen/jni/*.cpp)
-# LOCAL_EXPORT_C_INCLUDES += $(GENERATED_SRC_DIR)/codegen/jni
-
-# Here you should add any native library you wish to depend on.
-LOCAL_SHARED_LIBRARIES := \
- libfabricjni \
- libfbjni \
- libfolly_runtime \
- libglog \
- libjsi \
- libreact_codegen_rncore \
- libreact_debug \
- libreact_nativemodule_core \
- libreact_render_componentregistry \
- libreact_render_core \
- libreact_render_debug \
- libreact_render_graphics \
- librrc_view \
- libruntimeexecutor \
- libturbomodulejsijni \
- libyoga
-
-LOCAL_CFLAGS := -DLOG_TAG=\"ReactNative\" -fexceptions -frtti -std=c++17 -Wall
-
-include $(BUILD_SHARED_LIBRARY)
\ No newline at end of file
diff --git a/example/bare/android/app/src/main/jni/MainApplicationModuleProvider.cpp b/example/bare/android/app/src/main/jni/MainApplicationModuleProvider.cpp
deleted file mode 100644
index 39de093d1..000000000
--- a/example/bare/android/app/src/main/jni/MainApplicationModuleProvider.cpp
+++ /dev/null
@@ -1,24 +0,0 @@
-#include "MainApplicationModuleProvider.h"
-
-#include
-
-namespace facebook {
-namespace react {
-
-std::shared_ptr MainApplicationModuleProvider(
- const std::string moduleName,
- const JavaTurboModule::InitParams ¶ms) {
- // Here you can provide your own module provider for TurboModules coming from
- // either your application or from external libraries. The approach to follow
- // is similar to the following (for a library called `samplelibrary`:
- //
- // auto module = samplelibrary_ModuleProvider(moduleName, params);
- // if (module != nullptr) {
- // return module;
- // }
- // return rncore_ModuleProvider(moduleName, params);
- return rncore_ModuleProvider(moduleName, params);
-}
-
-} // namespace react
-} // namespace facebook
\ No newline at end of file
diff --git a/example/bare/android/app/src/main/jni/MainApplicationModuleProvider.h b/example/bare/android/app/src/main/jni/MainApplicationModuleProvider.h
deleted file mode 100644
index 2f2fb24a3..000000000
--- a/example/bare/android/app/src/main/jni/MainApplicationModuleProvider.h
+++ /dev/null
@@ -1,16 +0,0 @@
-#pragma once
-
-#include
-#include
-
-#include
-
-namespace facebook {
-namespace react {
-
-std::shared_ptr MainApplicationModuleProvider(
- const std::string moduleName,
- const JavaTurboModule::InitParams ¶ms);
-
-} // namespace react
-} // namespace facebook
\ No newline at end of file
diff --git a/example/bare/android/app/src/main/jni/MainApplicationTurboModuleManagerDelegate.cpp b/example/bare/android/app/src/main/jni/MainApplicationTurboModuleManagerDelegate.cpp
deleted file mode 100644
index f2e4714dc..000000000
--- a/example/bare/android/app/src/main/jni/MainApplicationTurboModuleManagerDelegate.cpp
+++ /dev/null
@@ -1,45 +0,0 @@
-#include "MainApplicationTurboModuleManagerDelegate.h"
-#include "MainApplicationModuleProvider.h"
-
-namespace facebook {
-namespace react {
-
-jni::local_ref
-MainApplicationTurboModuleManagerDelegate::initHybrid(
- jni::alias_ref) {
- return makeCxxInstance();
-}
-
-void MainApplicationTurboModuleManagerDelegate::registerNatives() {
- registerHybrid({
- makeNativeMethod(
- "initHybrid", MainApplicationTurboModuleManagerDelegate::initHybrid),
- makeNativeMethod(
- "canCreateTurboModule",
- MainApplicationTurboModuleManagerDelegate::canCreateTurboModule),
- });
-}
-
-std::shared_ptr
-MainApplicationTurboModuleManagerDelegate::getTurboModule(
- const std::string name,
- const std::shared_ptr jsInvoker) {
- // Not implemented yet: provide pure-C++ NativeModules here.
- return nullptr;
-}
-
-std::shared_ptr
-MainApplicationTurboModuleManagerDelegate::getTurboModule(
- const std::string name,
- const JavaTurboModule::InitParams ¶ms) {
- return MainApplicationModuleProvider(name, params);
-}
-
-bool MainApplicationTurboModuleManagerDelegate::canCreateTurboModule(
- std::string name) {
- return getTurboModule(name, nullptr) != nullptr ||
- getTurboModule(name, {.moduleName = name}) != nullptr;
-}
-
-} // namespace react
-} // namespace facebook
\ No newline at end of file
diff --git a/example/bare/android/app/src/main/jni/MainApplicationTurboModuleManagerDelegate.h b/example/bare/android/app/src/main/jni/MainApplicationTurboModuleManagerDelegate.h
deleted file mode 100644
index 79c7634d9..000000000
--- a/example/bare/android/app/src/main/jni/MainApplicationTurboModuleManagerDelegate.h
+++ /dev/null
@@ -1,38 +0,0 @@
-#include
-#include
-
-#include
-#include
-
-namespace facebook {
-namespace react {
-
-class MainApplicationTurboModuleManagerDelegate
- : public jni::HybridClass<
- MainApplicationTurboModuleManagerDelegate,
- TurboModuleManagerDelegate> {
- public:
- // Adapt it to the package you used for your Java class.
- static constexpr auto kJavaDescriptor =
- "Ldev/gorhom/bottomsheet/modules/MainApplicationTurboModuleManagerDelegate;";
-
- static jni::local_ref initHybrid(jni::alias_ref);
-
- static void registerNatives();
-
- std::shared_ptr getTurboModule(
- const std::string name,
- const std::shared_ptr jsInvoker) override;
- std::shared_ptr getTurboModule(
- const std::string name,
- const JavaTurboModule::InitParams ¶ms) override;
-
- /**
- * Test-only method. Allows user to verify whether a TurboModule can be
- * created by instances of this class.
- */
- bool canCreateTurboModule(std::string name);
-};
-
-} // namespace react
-} // namespace facebook
\ No newline at end of file
diff --git a/example/bare/android/app/src/main/jni/MainComponentsRegistry.cpp b/example/bare/android/app/src/main/jni/MainComponentsRegistry.cpp
deleted file mode 100644
index c5188f4dc..000000000
--- a/example/bare/android/app/src/main/jni/MainComponentsRegistry.cpp
+++ /dev/null
@@ -1,61 +0,0 @@
-#include "MainComponentsRegistry.h"
-
-#include
-#include
-#include
-#include
-
-namespace facebook {
-namespace react {
-
-MainComponentsRegistry::MainComponentsRegistry(ComponentFactory *delegate) {}
-
-std::shared_ptr
-MainComponentsRegistry::sharedProviderRegistry() {
- auto providerRegistry = CoreComponentsRegistry::sharedProviderRegistry();
-
- // Custom Fabric Components go here. You can register custom
- // components coming from your App or from 3rd party libraries here.
- //
- // providerRegistry->add(concreteComponentDescriptorProvider<
- // AocViewerComponentDescriptor>());
- return providerRegistry;
-}
-
-jni::local_ref
-MainComponentsRegistry::initHybrid(
- jni::alias_ref,
- ComponentFactory *delegate) {
- auto instance = makeCxxInstance(delegate);
-
- auto buildRegistryFunction =
- [](EventDispatcher::Weak const &eventDispatcher,
- ContextContainer::Shared const &contextContainer)
- -> ComponentDescriptorRegistry::Shared {
- auto registry = MainComponentsRegistry::sharedProviderRegistry()
- ->createComponentDescriptorRegistry(
- {eventDispatcher, contextContainer});
-
- auto mutableRegistry =
- std::const_pointer_cast(registry);
-
- mutableRegistry->setFallbackComponentDescriptor(
- std::make_shared(
- ComponentDescriptorParameters{
- eventDispatcher, contextContainer, nullptr}));
-
- return registry;
- };
-
- delegate->buildRegistryFunction = buildRegistryFunction;
- return instance;
-}
-
-void MainComponentsRegistry::registerNatives() {
- registerHybrid({
- makeNativeMethod("initHybrid", MainComponentsRegistry::initHybrid),
- });
-}
-
-} // namespace react
-} // namespace facebook
\ No newline at end of file
diff --git a/example/bare/android/app/src/main/jni/MainComponentsRegistry.h b/example/bare/android/app/src/main/jni/MainComponentsRegistry.h
deleted file mode 100644
index b4a366335..000000000
--- a/example/bare/android/app/src/main/jni/MainComponentsRegistry.h
+++ /dev/null
@@ -1,32 +0,0 @@
-#pragma once
-
-#include
-#include
-#include
-#include
-
-namespace facebook {
-namespace react {
-
-class MainComponentsRegistry
- : public facebook::jni::HybridClass {
- public:
- // Adapt it to the package you used for your Java class.
- constexpr static auto kJavaDescriptor =
- "Ldev/gorhom/bottomsheet/components/MainComponentsRegistry;";
-
- static void registerNatives();
-
- MainComponentsRegistry(ComponentFactory *delegate);
-
- private:
- static std::shared_ptr
- sharedProviderRegistry();
-
- static jni::local_ref initHybrid(
- jni::alias_ref,
- ComponentFactory *delegate);
-};
-
-} // namespace react
-} // namespace facebook
\ No newline at end of file
diff --git a/example/bare/android/app/src/main/jni/OnLoad.cpp b/example/bare/android/app/src/main/jni/OnLoad.cpp
deleted file mode 100644
index ae1ef007d..000000000
--- a/example/bare/android/app/src/main/jni/OnLoad.cpp
+++ /dev/null
@@ -1,11 +0,0 @@
-#include
-#include "MainApplicationTurboModuleManagerDelegate.h"
-#include "MainComponentsRegistry.h"
-
-JNIEXPORT jint JNICALL JNI_OnLoad(JavaVM *vm, void *) {
- return facebook::jni::initialize(vm, [] {
- facebook::react::MainApplicationTurboModuleManagerDelegate::
- registerNatives();
- facebook::react::MainComponentsRegistry::registerNatives();
- });
-}
\ No newline at end of file
diff --git a/example/bare/android/app/src/main/res/drawable/rn_edit_text_material.xml b/example/bare/android/app/src/main/res/drawable/rn_edit_text_material.xml
deleted file mode 100644
index 986188ce0..000000000
--- a/example/bare/android/app/src/main/res/drawable/rn_edit_text_material.xml
+++ /dev/null
@@ -1,36 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/example/bare/android/app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml b/example/bare/android/app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml
deleted file mode 100644
index 036d09bc5..000000000
--- a/example/bare/android/app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml
+++ /dev/null
@@ -1,5 +0,0 @@
-
-
-
-
-
\ No newline at end of file
diff --git a/example/bare/android/app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml b/example/bare/android/app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml
deleted file mode 100644
index 036d09bc5..000000000
--- a/example/bare/android/app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml
+++ /dev/null
@@ -1,5 +0,0 @@
-
-
-
-
-
\ No newline at end of file
diff --git a/example/bare/android/app/src/main/res/mipmap-hdpi/ic_launcher.png b/example/bare/android/app/src/main/res/mipmap-hdpi/ic_launcher.png
deleted file mode 100644
index 4fbbc6092..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-hdpi/ic_launcher.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/mipmap-hdpi/ic_launcher_foreground.png b/example/bare/android/app/src/main/res/mipmap-hdpi/ic_launcher_foreground.png
deleted file mode 100644
index f8f98270d..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-hdpi/ic_launcher_foreground.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png b/example/bare/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png
deleted file mode 100644
index 4fbbc6092..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/mipmap-mdpi/ic_launcher.png b/example/bare/android/app/src/main/res/mipmap-mdpi/ic_launcher.png
deleted file mode 100644
index be0816689..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-mdpi/ic_launcher.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/mipmap-mdpi/ic_launcher_foreground.png b/example/bare/android/app/src/main/res/mipmap-mdpi/ic_launcher_foreground.png
deleted file mode 100644
index 8d934b5b2..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-mdpi/ic_launcher_foreground.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png b/example/bare/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png
deleted file mode 100644
index be0816689..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png b/example/bare/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png
deleted file mode 100644
index 959aa628b..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/mipmap-xhdpi/ic_launcher_foreground.png b/example/bare/android/app/src/main/res/mipmap-xhdpi/ic_launcher_foreground.png
deleted file mode 100644
index 541e5f0a1..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-xhdpi/ic_launcher_foreground.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png b/example/bare/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png
deleted file mode 100644
index 959aa628b..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png b/example/bare/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png
deleted file mode 100644
index 8edb8579e..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_foreground.png b/example/bare/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_foreground.png
deleted file mode 100644
index acdd88baa..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_foreground.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png b/example/bare/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png
deleted file mode 100644
index 8edb8579e..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png b/example/bare/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png
deleted file mode 100644
index ef702a83b..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_foreground.png b/example/bare/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_foreground.png
deleted file mode 100644
index 4ddf1922d..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_foreground.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png b/example/bare/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png
deleted file mode 100644
index ef702a83b..000000000
Binary files a/example/bare/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png and /dev/null differ
diff --git a/example/bare/android/app/src/main/res/values/ic_launcher_background.xml b/example/bare/android/app/src/main/res/values/ic_launcher_background.xml
deleted file mode 100644
index beab31f75..000000000
--- a/example/bare/android/app/src/main/res/values/ic_launcher_background.xml
+++ /dev/null
@@ -1,4 +0,0 @@
-
-
- #000000
-
\ No newline at end of file
diff --git a/example/bare/android/app/src/main/res/values/strings.xml b/example/bare/android/app/src/main/res/values/strings.xml
deleted file mode 100644
index 16508bfa2..000000000
--- a/example/bare/android/app/src/main/res/values/strings.xml
+++ /dev/null
@@ -1,3 +0,0 @@
-
- BottomSheet Example
-
diff --git a/example/bare/android/app/src/main/res/values/styles.xml b/example/bare/android/app/src/main/res/values/styles.xml
deleted file mode 100644
index 7ba83a2ad..000000000
--- a/example/bare/android/app/src/main/res/values/styles.xml
+++ /dev/null
@@ -1,9 +0,0 @@
-
-
-
-
-
-
diff --git a/example/bare/android/build.gradle b/example/bare/android/build.gradle
deleted file mode 100644
index 9ab5b1350..000000000
--- a/example/bare/android/build.gradle
+++ /dev/null
@@ -1,53 +0,0 @@
-import org.apache.tools.ant.taskdefs.condition.Os
-// Top-level build file where you can add configuration options common to all sub-projects/modules.
-
-buildscript {
- ext {
- buildToolsVersion = "31.0.0"
- minSdkVersion = 21
- compileSdkVersion = 31
- targetSdkVersion = 31
-
- if (System.properties['os.arch'] == "aarch64") {
- // For M1 Users we need to use the NDK 24 which added support for aarch64
- ndkVersion = "24.0.8215888"
- } else {
- // Otherwise we default to the side-by-side NDK version from AGP.
- ndkVersion = "21.4.7075529"
- }
- }
- repositories {
- google()
- mavenCentral()
- }
- dependencies {
- classpath("com.android.tools.build:gradle:7.1.1")
- classpath("com.facebook.react:react-native-gradle-plugin")
- classpath("de.undercouch:gradle-download-task:5.0.1")
-
- // NOTE: Do not place your application dependencies here; they belong
- // in the individual module build.gradle files
- }
-}
-
-allprojects {
- repositories {
- maven {
- // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
- url("$rootDir/../node_modules/react-native/android")
- }
- maven {
- // Android JSC is installed from npm
- url("$rootDir/../node_modules/jsc-android/dist")
- }
- mavenCentral {
- // We don't want to fetch react-native from Maven Central as there are
- // older versions over there.
- content {
- excludeGroup "com.facebook.react"
- }
- }
- google()
- maven { url 'https://www.jitpack.io' }
- }
-}
diff --git a/example/bare/android/gradle.properties b/example/bare/android/gradle.properties
deleted file mode 100644
index d7712a486..000000000
--- a/example/bare/android/gradle.properties
+++ /dev/null
@@ -1,35 +0,0 @@
-# Project-wide Gradle settings.
-
-# IDE (e.g. Android Studio) users:
-# Gradle settings configured through the IDE *will override*
-# any settings specified in this file.
-
-# For more details on how to configure your build environment visit
-# http://www.gradle.org/docs/current/userguide/build_environment.html
-
-# Specifies the JVM arguments used for the daemon process.
-# The setting is particularly useful for tweaking memory settings.
-# Default value: -Xmx512m -XX:MaxMetaspaceSize=256m
-# org.gradle.jvmargs=-Xmx2048m -XX:MaxPermSize=512m -XX:+HeapDumpOnOutOfMemoryError -Dfile.encoding=UTF-8
-org.gradle.jvmargs=-Xmx2048m -XX:MaxMetaspaceSize=512m
-
-# When configured, Gradle will run in incubating parallel mode.
-# This option should only be used with decoupled projects. More details, visit
-# http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects
-# org.gradle.parallel=true
-
-android.useAndroidX=true
-android.enableJetifier=true
-
-FLIPPER_VERSION=0.125.0
-
-# Use this property to specify which architecture you want to build.
-# You can also override it from the CLI using
-# ./gradlew -PreactNativeArchitectures=x86_64
-reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
-# Use this property to enable support to the new architecture.
-# This will allow you to use TurboModules and the Fabric render in
-# your application. You should enable this flag either if you want
-# to write custom TurboModules/Fabric components OR use libraries that
-# are providing them.
-newArchEnabled=false
\ No newline at end of file
diff --git a/example/bare/android/gradle/wrapper/gradle-wrapper.jar b/example/bare/android/gradle/wrapper/gradle-wrapper.jar
deleted file mode 100644
index 5c2d1cf01..000000000
Binary files a/example/bare/android/gradle/wrapper/gradle-wrapper.jar and /dev/null differ
diff --git a/example/bare/android/gradle/wrapper/gradle-wrapper.properties b/example/bare/android/gradle/wrapper/gradle-wrapper.properties
deleted file mode 100644
index 669386b87..000000000
--- a/example/bare/android/gradle/wrapper/gradle-wrapper.properties
+++ /dev/null
@@ -1,5 +0,0 @@
-distributionBase=GRADLE_USER_HOME
-distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-7.3.3-all.zip
-zipStoreBase=GRADLE_USER_HOME
-zipStorePath=wrapper/dists
diff --git a/example/bare/android/gradlew b/example/bare/android/gradlew
deleted file mode 100755
index a58591e97..000000000
--- a/example/bare/android/gradlew
+++ /dev/null
@@ -1,234 +0,0 @@
-#!/bin/sh
-
-#
-# Copyright © 2015-2021 the original authors.
-#
-# Licensed under the Apache License, Version 2.0 (the "License");
-# you may not use this file except in compliance with the License.
-# You may obtain a copy of the License at
-#
-# https://www.apache.org/licenses/LICENSE-2.0
-#
-# Unless required by applicable law or agreed to in writing, software
-# distributed under the License is distributed on an "AS IS" BASIS,
-# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-# See the License for the specific language governing permissions and
-# limitations under the License.
-#
-
-##############################################################################
-#
-# Gradle start up script for POSIX generated by Gradle.
-#
-# Important for running:
-#
-# (1) You need a POSIX-compliant shell to run this script. If your /bin/sh is
-# noncompliant, but you have some other compliant shell such as ksh or
-# bash, then to run this script, type that shell name before the whole
-# command line, like:
-#
-# ksh Gradle
-#
-# Busybox and similar reduced shells will NOT work, because this script
-# requires all of these POSIX shell features:
-# * functions;
-# * expansions «$var», «${var}», «${var:-default}», «${var+SET}»,
-# «${var#prefix}», «${var%suffix}», and «$( cmd )»;
-# * compound commands having a testable exit status, especially «case»;
-# * various built-in commands including «command», «set», and «ulimit».
-#
-# Important for patching:
-#
-# (2) This script targets any POSIX shell, so it avoids extensions provided
-# by Bash, Ksh, etc; in particular arrays are avoided.
-#
-# The "traditional" practice of packing multiple parameters into a
-# space-separated string is a well documented source of bugs and security
-# problems, so this is (mostly) avoided, by progressively accumulating
-# options in "$@", and eventually passing that to Java.
-#
-# Where the inherited environment variables (DEFAULT_JVM_OPTS, JAVA_OPTS,
-# and GRADLE_OPTS) rely on word-splitting, this is performed explicitly;
-# see the in-line comments for details.
-#
-# There are tweaks for specific operating systems such as AIX, CygWin,
-# Darwin, MinGW, and NonStop.
-#
-# (3) This script is generated from the Groovy template
-# https://github.com/gradle/gradle/blob/master/subprojects/plugins/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
-# within the Gradle project.
-#
-# You can find Gradle at https://github.com/gradle/gradle/.
-#
-##############################################################################
-
-# Attempt to set APP_HOME
-
-# Resolve links: $0 may be a link
-app_path=$0
-
-# Need this for daisy-chained symlinks.
-while
- APP_HOME=${app_path%"${app_path##*/}"} # leaves a trailing /; empty if no leading path
- [ -h "$app_path" ]
-do
- ls=$( ls -ld "$app_path" )
- link=${ls#*' -> '}
- case $link in #(
- /*) app_path=$link ;; #(
- *) app_path=$APP_HOME$link ;;
- esac
-done
-
-APP_HOME=$( cd "${APP_HOME:-./}" && pwd -P ) || exit
-
-APP_NAME="Gradle"
-APP_BASE_NAME=${0##*/}
-
-# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
-DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
-
-# Use the maximum available, or set MAX_FD != -1 to use that value.
-MAX_FD=maximum
-
-warn () {
- echo "$*"
-} >&2
-
-die () {
- echo
- echo "$*"
- echo
- exit 1
-} >&2
-
-# OS specific support (must be 'true' or 'false').
-cygwin=false
-msys=false
-darwin=false
-nonstop=false
-case "$( uname )" in #(
- CYGWIN* ) cygwin=true ;; #(
- Darwin* ) darwin=true ;; #(
- MSYS* | MINGW* ) msys=true ;; #(
- NONSTOP* ) nonstop=true ;;
-esac
-
-CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
-
-
-# Determine the Java command to use to start the JVM.
-if [ -n "$JAVA_HOME" ] ; then
- if [ -x "$JAVA_HOME/jre/sh/java" ] ; then
- # IBM's JDK on AIX uses strange locations for the executables
- JAVACMD=$JAVA_HOME/jre/sh/java
- else
- JAVACMD=$JAVA_HOME/bin/java
- fi
- if [ ! -x "$JAVACMD" ] ; then
- die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME
-
-Please set the JAVA_HOME variable in your environment to match the
-location of your Java installation."
- fi
-else
- JAVACMD=java
- which java >/dev/null 2>&1 || die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
-
-Please set the JAVA_HOME variable in your environment to match the
-location of your Java installation."
-fi
-
-# Increase the maximum file descriptors if we can.
-if ! "$cygwin" && ! "$darwin" && ! "$nonstop" ; then
- case $MAX_FD in #(
- max*)
- MAX_FD=$( ulimit -H -n ) ||
- warn "Could not query maximum file descriptor limit"
- esac
- case $MAX_FD in #(
- '' | soft) :;; #(
- *)
- ulimit -n "$MAX_FD" ||
- warn "Could not set maximum file descriptor limit to $MAX_FD"
- esac
-fi
-
-# Collect all arguments for the java command, stacking in reverse order:
-# * args from the command line
-# * the main class name
-# * -classpath
-# * -D...appname settings
-# * --module-path (only if needed)
-# * DEFAULT_JVM_OPTS, JAVA_OPTS, and GRADLE_OPTS environment variables.
-
-# For Cygwin or MSYS, switch paths to Windows format before running java
-if "$cygwin" || "$msys" ; then
- APP_HOME=$( cygpath --path --mixed "$APP_HOME" )
- CLASSPATH=$( cygpath --path --mixed "$CLASSPATH" )
-
- JAVACMD=$( cygpath --unix "$JAVACMD" )
-
- # Now convert the arguments - kludge to limit ourselves to /bin/sh
- for arg do
- if
- case $arg in #(
- -*) false ;; # don't mess with options #(
- /?*) t=${arg#/} t=/${t%%/*} # looks like a POSIX filepath
- [ -e "$t" ] ;; #(
- *) false ;;
- esac
- then
- arg=$( cygpath --path --ignore --mixed "$arg" )
- fi
- # Roll the args list around exactly as many times as the number of
- # args, so each arg winds up back in the position where it started, but
- # possibly modified.
- #
- # NB: a `for` loop captures its iteration list before it begins, so
- # changing the positional parameters here affects neither the number of
- # iterations, nor the values presented in `arg`.
- shift # remove old arg
- set -- "$@" "$arg" # push replacement arg
- done
-fi
-
-# Collect all arguments for the java command;
-# * $DEFAULT_JVM_OPTS, $JAVA_OPTS, and $GRADLE_OPTS can contain fragments of
-# shell script including quotes and variable substitutions, so put them in
-# double quotes to make sure that they get re-expanded; and
-# * put everything else in single quotes, so that it's not re-expanded.
-
-set -- \
- "-Dorg.gradle.appname=$APP_BASE_NAME" \
- -classpath "$CLASSPATH" \
- org.gradle.wrapper.GradleWrapperMain \
- "$@"
-
-# Use "xargs" to parse quoted args.
-#
-# With -n1 it outputs one arg per line, with the quotes and backslashes removed.
-#
-# In Bash we could simply go:
-#
-# readarray ARGS < <( xargs -n1 <<<"$var" ) &&
-# set -- "${ARGS[@]}" "$@"
-#
-# but POSIX shell has neither arrays nor command substitution, so instead we
-# post-process each arg (as a line of input to sed) to backslash-escape any
-# character that might be a shell metacharacter, then use eval to reverse
-# that process (while maintaining the separation between arguments), and wrap
-# the whole thing up as a single "set" statement.
-#
-# This will of course break if any of these variables contains a newline or
-# an unmatched quote.
-#
-
-eval "set -- $(
- printf '%s\n' "$DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS" |
- xargs -n1 |
- sed ' s~[^-[:alnum:]+,./:=@_]~\\&~g; ' |
- tr '\n' ' '
- )" '"$@"'
-
-exec "$JAVACMD" "$@"
\ No newline at end of file
diff --git a/example/bare/android/gradlew.bat b/example/bare/android/gradlew.bat
deleted file mode 100644
index 15e1ee37a..000000000
--- a/example/bare/android/gradlew.bat
+++ /dev/null
@@ -1,100 +0,0 @@
-@rem
-@rem Copyright 2015 the original author or authors.
-@rem
-@rem Licensed under the Apache License, Version 2.0 (the "License");
-@rem you may not use this file except in compliance with the License.
-@rem You may obtain a copy of the License at
-@rem
-@rem http://www.apache.org/licenses/LICENSE-2.0
-@rem
-@rem Unless required by applicable law or agreed to in writing, software
-@rem distributed under the License is distributed on an "AS IS" BASIS,
-@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-@rem See the License for the specific language governing permissions and
-@rem limitations under the License.
-@rem
-
-@if "%DEBUG%" == "" @echo off
-@rem ##########################################################################
-@rem
-@rem Gradle startup script for Windows
-@rem
-@rem ##########################################################################
-
-@rem Set local scope for the variables with windows NT shell
-if "%OS%"=="Windows_NT" setlocal
-
-set DIRNAME=%~dp0
-if "%DIRNAME%" == "" set DIRNAME=.
-set APP_BASE_NAME=%~n0
-set APP_HOME=%DIRNAME%
-
-@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
-set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
-
-@rem Find java.exe
-if defined JAVA_HOME goto findJavaFromJavaHome
-
-set JAVA_EXE=java.exe
-%JAVA_EXE% -version >NUL 2>&1
-if "%ERRORLEVEL%" == "0" goto init
-
-echo.
-echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
-echo.
-echo Please set the JAVA_HOME variable in your environment to match the
-echo location of your Java installation.
-
-goto fail
-
-:findJavaFromJavaHome
-set JAVA_HOME=%JAVA_HOME:"=%
-set JAVA_EXE=%JAVA_HOME%/bin/java.exe
-
-if exist "%JAVA_EXE%" goto init
-
-echo.
-echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME%
-echo.
-echo Please set the JAVA_HOME variable in your environment to match the
-echo location of your Java installation.
-
-goto fail
-
-:init
-@rem Get command-line arguments, handling Windows variants
-
-if not "%OS%" == "Windows_NT" goto win9xME_args
-
-:win9xME_args
-@rem Slurp the command line arguments.
-set CMD_LINE_ARGS=
-set _SKIP=2
-
-:win9xME_args_slurp
-if "x%~1" == "x" goto execute
-
-set CMD_LINE_ARGS=%*
-
-:execute
-@rem Setup the command line
-
-set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
-
-@rem Execute Gradle
-"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %CMD_LINE_ARGS%
-
-:end
-@rem End local scope for the variables with windows NT shell
-if "%ERRORLEVEL%"=="0" goto mainEnd
-
-:fail
-rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
-rem the _cmd.exe /c_ return code!
-if not "" == "%GRADLE_EXIT_CONSOLE%" exit 1
-exit /b 1
-
-:mainEnd
-if "%OS%"=="Windows_NT" endlocal
-
-:omega
diff --git a/example/bare/android/settings.gradle b/example/bare/android/settings.gradle
deleted file mode 100644
index d673f13c6..000000000
--- a/example/bare/android/settings.gradle
+++ /dev/null
@@ -1,12 +0,0 @@
-rootProject.name = 'BottomSheetExample'
-apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
-include ':app'
-
-includeBuild('../node_modules/react-native-gradle-plugin')
-if (settings.hasProperty("newArchEnabled") && settings.newArchEnabled == "true") {
- include(":ReactAndroid")
- project(":ReactAndroid").projectDir = file('../node_modules/react-native/ReactAndroid')
-
- include(":ReactAndroid:hermes-engine")
- project(":ReactAndroid:hermes-engine").projectDir = file('../node_modules/react-native/ReactAndroid/hermes-engine')
-}
diff --git a/example/bare/app.json b/example/bare/app.json
deleted file mode 100644
index d5dce6acb..000000000
--- a/example/bare/app.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
- "name": "BottomSheetExample",
- "displayName": "BottomSheet Example"
-}
diff --git a/example/bare/babel.config.js b/example/bare/babel.config.js
deleted file mode 100644
index 983e075de..000000000
--- a/example/bare/babel.config.js
+++ /dev/null
@@ -1,4 +0,0 @@
-module.exports = {
- presets: ['module:metro-react-native-babel-preset'],
- plugins: ['react-native-reanimated/plugin'],
-};
diff --git a/example/bare/index.ts b/example/bare/index.ts
deleted file mode 100644
index fc6f4f5e8..000000000
--- a/example/bare/index.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import 'react-native-gesture-handler';
-
-import { enableScreens } from 'react-native-screens';
-enableScreens(true);
-
-// @ts-ignore
-import { enableLogging } from '@gorhom/bottom-sheet';
-enableLogging();
-
-import { AppRegistry, LogBox } from 'react-native';
-import App from './src/App';
-import { name as appName } from './app.json';
-
-LogBox.ignoreLogs(['react-native-maps']);
-
-AppRegistry.registerComponent(appName, () => App);
diff --git a/example/bare/ios/.xcode.env b/example/bare/ios/.xcode.env
deleted file mode 100644
index bef731e8e..000000000
--- a/example/bare/ios/.xcode.env
+++ /dev/null
@@ -1,11 +0,0 @@
-
-# This `.xcode.env` file is versioned and is used to source the environment
-# used when running script phases inside Xcode.
-# To customize your local environment, you can create an `.xcode.env.local`
-# file that is not versioned.
-# NODE_BINARY variable contains the PATH to the node executable.
-#
-# Customize the NODE_BINARY variable here.
-# For example, to use nvm with brew, add the following line
-# . "$(brew --prefix nvm)/nvm.sh" --no-use
-export NODE_BINARY=$(command -v node)
\ No newline at end of file
diff --git a/example/bare/ios/BottomSheetExample.xcodeproj/project.pbxproj b/example/bare/ios/BottomSheetExample.xcodeproj/project.pbxproj
deleted file mode 100644
index e6482e6b1..000000000
--- a/example/bare/ios/BottomSheetExample.xcodeproj/project.pbxproj
+++ /dev/null
@@ -1,499 +0,0 @@
-// !$*UTF8*$!
-{
- archiveVersion = 1;
- classes = {
- };
- objectVersion = 54;
- objects = {
-
-/* Begin PBXBuildFile section */
- 13B07FBC1A68108700A75B9A /* AppDelegate.mm in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.mm */; };
- 13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
- 13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
- 81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */; };
- B99DDCC792BE04A3C1A46B64 /* libPods-BottomSheetExample.a in Frameworks */ = {isa = PBXBuildFile; fileRef = C86C72B8E0C97C4125E76CF7 /* libPods-BottomSheetExample.a */; };
-/* End PBXBuildFile section */
-
-/* Begin PBXFileReference section */
- 13B07F961A680F5B00A75B9A /* BottomSheetExample.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = BottomSheetExample.app; sourceTree = BUILT_PRODUCTS_DIR; };
- 13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = BottomSheetExample/AppDelegate.h; sourceTree = ""; };
- 13B07FB01A68108700A75B9A /* AppDelegate.mm */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.cpp.objcpp; name = AppDelegate.mm; path = BottomSheetExample/AppDelegate.mm; sourceTree = ""; };
- 13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = BottomSheetExample/Images.xcassets; sourceTree = ""; };
- 13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = BottomSheetExample/Info.plist; sourceTree = ""; };
- 13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = BottomSheetExample/main.m; sourceTree = ""; };
- 4993DB3E6C68D3AE31536CF5 /* Pods-BottomSheetExample.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-BottomSheetExample.release.xcconfig"; path = "Target Support Files/Pods-BottomSheetExample/Pods-BottomSheetExample.release.xcconfig"; sourceTree = ""; };
- 804B0CFA9353A107A9363C53 /* Pods-BottomSheetExample-BottomSheetExampleTests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-BottomSheetExample-BottomSheetExampleTests.release.xcconfig"; path = "Target Support Files/Pods-BottomSheetExample-BottomSheetExampleTests/Pods-BottomSheetExample-BottomSheetExampleTests.release.xcconfig"; sourceTree = ""; };
- 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = file.storyboard; name = LaunchScreen.storyboard; path = BottomSheetExample/LaunchScreen.storyboard; sourceTree = ""; };
- 93BEE2BE80FA89E95F560E80 /* libPods-BottomSheetExample-BottomSheetExampleTests.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-BottomSheetExample-BottomSheetExampleTests.a"; sourceTree = BUILT_PRODUCTS_DIR; };
- AAADD12EFF6DFF5056590488 /* Pods-BottomSheetExample.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-BottomSheetExample.debug.xcconfig"; path = "Target Support Files/Pods-BottomSheetExample/Pods-BottomSheetExample.debug.xcconfig"; sourceTree = ""; };
- C86C72B8E0C97C4125E76CF7 /* libPods-BottomSheetExample.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-BottomSheetExample.a"; sourceTree = BUILT_PRODUCTS_DIR; };
- ED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };
- F85071B73518743431AC2015 /* Pods-BottomSheetExample-BottomSheetExampleTests.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-BottomSheetExample-BottomSheetExampleTests.debug.xcconfig"; path = "Target Support Files/Pods-BottomSheetExample-BottomSheetExampleTests/Pods-BottomSheetExample-BottomSheetExampleTests.debug.xcconfig"; sourceTree = ""; };
-/* End PBXFileReference section */
-
-/* Begin PBXFrameworksBuildPhase section */
- 13B07F8C1A680F5B00A75B9A /* Frameworks */ = {
- isa = PBXFrameworksBuildPhase;
- buildActionMask = 2147483647;
- files = (
- B99DDCC792BE04A3C1A46B64 /* libPods-BottomSheetExample.a in Frameworks */,
- );
- runOnlyForDeploymentPostprocessing = 0;
- };
-/* End PBXFrameworksBuildPhase section */
-
-/* Begin PBXGroup section */
- 13B07FAE1A68108700A75B9A /* BottomSheetExample */ = {
- isa = PBXGroup;
- children = (
- 13B07FAF1A68108700A75B9A /* AppDelegate.h */,
- 13B07FB01A68108700A75B9A /* AppDelegate.mm */,
- 13B07FB51A68108700A75B9A /* Images.xcassets */,
- 13B07FB61A68108700A75B9A /* Info.plist */,
- 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */,
- 13B07FB71A68108700A75B9A /* main.m */,
- );
- name = BottomSheetExample;
- sourceTree = "";
- };
- 2D16E6871FA4F8E400B85C8A /* Frameworks */ = {
- isa = PBXGroup;
- children = (
- ED297162215061F000B7C4FE /* JavaScriptCore.framework */,
- C86C72B8E0C97C4125E76CF7 /* libPods-BottomSheetExample.a */,
- 93BEE2BE80FA89E95F560E80 /* libPods-BottomSheetExample-BottomSheetExampleTests.a */,
- );
- name = Frameworks;
- sourceTree = "";
- };
- 7D312223C2AA7A795BB45C72 /* Pods */ = {
- isa = PBXGroup;
- children = (
- AAADD12EFF6DFF5056590488 /* Pods-BottomSheetExample.debug.xcconfig */,
- 4993DB3E6C68D3AE31536CF5 /* Pods-BottomSheetExample.release.xcconfig */,
- F85071B73518743431AC2015 /* Pods-BottomSheetExample-BottomSheetExampleTests.debug.xcconfig */,
- 804B0CFA9353A107A9363C53 /* Pods-BottomSheetExample-BottomSheetExampleTests.release.xcconfig */,
- );
- path = Pods;
- sourceTree = "";
- };
- 832341AE1AAA6A7D00B99B32 /* Libraries */ = {
- isa = PBXGroup;
- children = (
- );
- name = Libraries;
- sourceTree = "";
- };
- 83CBB9F61A601CBA00E9B192 = {
- isa = PBXGroup;
- children = (
- 13B07FAE1A68108700A75B9A /* BottomSheetExample */,
- 832341AE1AAA6A7D00B99B32 /* Libraries */,
- 83CBBA001A601CBA00E9B192 /* Products */,
- 2D16E6871FA4F8E400B85C8A /* Frameworks */,
- 7D312223C2AA7A795BB45C72 /* Pods */,
- );
- indentWidth = 2;
- sourceTree = "";
- tabWidth = 2;
- usesTabs = 0;
- };
- 83CBBA001A601CBA00E9B192 /* Products */ = {
- isa = PBXGroup;
- children = (
- 13B07F961A680F5B00A75B9A /* BottomSheetExample.app */,
- );
- name = Products;
- sourceTree = "";
- };
-/* End PBXGroup section */
-
-/* Begin PBXNativeTarget section */
- 13B07F861A680F5B00A75B9A /* BottomSheetExample */ = {
- isa = PBXNativeTarget;
- buildConfigurationList = 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "BottomSheetExample" */;
- buildPhases = (
- 88FC0B89EA592A0022EEDFF4 /* [CP] Check Pods Manifest.lock */,
- FD10A7F022414F080027D42C /* Start Packager */,
- 13B07F871A680F5B00A75B9A /* Sources */,
- 13B07F8C1A680F5B00A75B9A /* Frameworks */,
- 13B07F8E1A680F5B00A75B9A /* Resources */,
- 00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */,
- 1E6867724AAAA56E75E4851B /* [CP] Embed Pods Frameworks */,
- AC376B9D467CEDF0C9608A3C /* [CP] Copy Pods Resources */,
- );
- buildRules = (
- );
- dependencies = (
- );
- name = BottomSheetExample;
- productName = BottomSheetExample;
- productReference = 13B07F961A680F5B00A75B9A /* BottomSheetExample.app */;
- productType = "com.apple.product-type.application";
- };
-/* End PBXNativeTarget section */
-
-/* Begin PBXProject section */
- 83CBB9F71A601CBA00E9B192 /* Project object */ = {
- isa = PBXProject;
- attributes = {
- LastUpgradeCheck = 1210;
- TargetAttributes = {
- 13B07F861A680F5B00A75B9A = {
- LastSwiftMigration = 1120;
- };
- };
- };
- buildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "BottomSheetExample" */;
- compatibilityVersion = "Xcode 12.0";
- developmentRegion = en;
- hasScannedForEncodings = 0;
- knownRegions = (
- en,
- Base,
- );
- mainGroup = 83CBB9F61A601CBA00E9B192;
- productRefGroup = 83CBBA001A601CBA00E9B192 /* Products */;
- projectDirPath = "";
- projectRoot = "";
- targets = (
- 13B07F861A680F5B00A75B9A /* BottomSheetExample */,
- );
- };
-/* End PBXProject section */
-
-/* Begin PBXResourcesBuildPhase section */
- 13B07F8E1A680F5B00A75B9A /* Resources */ = {
- isa = PBXResourcesBuildPhase;
- buildActionMask = 2147483647;
- files = (
- 81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */,
- 13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,
- );
- runOnlyForDeploymentPostprocessing = 0;
- };
-/* End PBXResourcesBuildPhase section */
-
-/* Begin PBXShellScriptBuildPhase section */
- 00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */ = {
- isa = PBXShellScriptBuildPhase;
- buildActionMask = 2147483647;
- files = (
- );
- inputPaths = (
- "$(SRCROOT)/.xcode.env.local",
- "$(SRCROOT)/.xcode.env",
- );
- name = "Bundle React Native code and images";
- outputPaths = (
- );
- runOnlyForDeploymentPostprocessing = 0;
- shellPath = /bin/sh;
- shellScript = "set -e\n\nWITH_ENVIRONMENT=\"../node_modules/react-native/scripts/xcode/with-environment.sh\"\nREACT_NATIVE_XCODE=\"../node_modules/react-native/scripts/react-native-xcode.sh\"\n\n/bin/sh -c \"$WITH_ENVIRONMENT $REACT_NATIVE_XCODE\"\n";
- };
- 1E6867724AAAA56E75E4851B /* [CP] Embed Pods Frameworks */ = {
- isa = PBXShellScriptBuildPhase;
- buildActionMask = 2147483647;
- files = (
- );
- inputFileListPaths = (
- "${PODS_ROOT}/Target Support Files/Pods-BottomSheetExample/Pods-BottomSheetExample-frameworks-${CONFIGURATION}-input-files.xcfilelist",
- );
- name = "[CP] Embed Pods Frameworks";
- outputFileListPaths = (
- "${PODS_ROOT}/Target Support Files/Pods-BottomSheetExample/Pods-BottomSheetExample-frameworks-${CONFIGURATION}-output-files.xcfilelist",
- );
- runOnlyForDeploymentPostprocessing = 0;
- shellPath = /bin/sh;
- shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-BottomSheetExample/Pods-BottomSheetExample-frameworks.sh\"\n";
- showEnvVarsInLog = 0;
- };
- 88FC0B89EA592A0022EEDFF4 /* [CP] Check Pods Manifest.lock */ = {
- isa = PBXShellScriptBuildPhase;
- buildActionMask = 2147483647;
- files = (
- );
- inputFileListPaths = (
- );
- inputPaths = (
- "${PODS_PODFILE_DIR_PATH}/Podfile.lock",
- "${PODS_ROOT}/Manifest.lock",
- );
- name = "[CP] Check Pods Manifest.lock";
- outputFileListPaths = (
- );
- outputPaths = (
- "$(DERIVED_FILE_DIR)/Pods-BottomSheetExample-checkManifestLockResult.txt",
- );
- runOnlyForDeploymentPostprocessing = 0;
- shellPath = /bin/sh;
- shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n # print error to STDERR\n echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
- showEnvVarsInLog = 0;
- };
- AC376B9D467CEDF0C9608A3C /* [CP] Copy Pods Resources */ = {
- isa = PBXShellScriptBuildPhase;
- buildActionMask = 2147483647;
- files = (
- );
- inputFileListPaths = (
- "${PODS_ROOT}/Target Support Files/Pods-BottomSheetExample/Pods-BottomSheetExample-resources-${CONFIGURATION}-input-files.xcfilelist",
- );
- name = "[CP] Copy Pods Resources";
- outputFileListPaths = (
- "${PODS_ROOT}/Target Support Files/Pods-BottomSheetExample/Pods-BottomSheetExample-resources-${CONFIGURATION}-output-files.xcfilelist",
- );
- runOnlyForDeploymentPostprocessing = 0;
- shellPath = /bin/sh;
- shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-BottomSheetExample/Pods-BottomSheetExample-resources.sh\"\n";
- showEnvVarsInLog = 0;
- };
- FD10A7F022414F080027D42C /* Start Packager */ = {
- isa = PBXShellScriptBuildPhase;
- buildActionMask = 2147483647;
- files = (
- );
- inputFileListPaths = (
- );
- inputPaths = (
- );
- name = "Start Packager";
- outputFileListPaths = (
- );
- outputPaths = (
- );
- runOnlyForDeploymentPostprocessing = 0;
- shellPath = /bin/sh;
- shellScript = "export RCT_METRO_PORT=\"${RCT_METRO_PORT:=8081}\"\necho \"export RCT_METRO_PORT=${RCT_METRO_PORT}\" > \"${SRCROOT}/../node_modules/react-native/scripts/.packager.env\"\nif [ -z \"${RCT_NO_LAUNCH_PACKAGER+xxx}\" ] ; then\n if nc -w 5 -z localhost ${RCT_METRO_PORT} ; then\n if ! curl -s \"http://localhost:${RCT_METRO_PORT}/status\" | grep -q \"packager-status:running\" ; then\n echo \"Port ${RCT_METRO_PORT} already in use, packager is either not running or not running correctly\"\n exit 2\n fi\n else\n open \"$SRCROOT/../node_modules/react-native/scripts/launchPackager.command\" || echo \"Can't start packager automatically\"\n fi\nfi\n";
- showEnvVarsInLog = 0;
- };
-/* End PBXShellScriptBuildPhase section */
-
-/* Begin PBXSourcesBuildPhase section */
- 13B07F871A680F5B00A75B9A /* Sources */ = {
- isa = PBXSourcesBuildPhase;
- buildActionMask = 2147483647;
- files = (
- 13B07FBC1A68108700A75B9A /* AppDelegate.mm in Sources */,
- 13B07FC11A68108700A75B9A /* main.m in Sources */,
- );
- runOnlyForDeploymentPostprocessing = 0;
- };
-/* End PBXSourcesBuildPhase section */
-
-/* Begin XCBuildConfiguration section */
- 13B07F941A680F5B00A75B9A /* Debug */ = {
- isa = XCBuildConfiguration;
- baseConfigurationReference = AAADD12EFF6DFF5056590488 /* Pods-BottomSheetExample.debug.xcconfig */;
- buildSettings = {
- ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
- CLANG_ENABLE_MODULES = YES;
- CURRENT_PROJECT_VERSION = 1;
- DEVELOPMENT_TEAM = "";
- ENABLE_BITCODE = NO;
- INFOPLIST_FILE = BottomSheetExample/Info.plist;
- LD_RUNPATH_SEARCH_PATHS = (
- "$(inherited)",
- "@executable_path/Frameworks",
- );
- OTHER_LDFLAGS = (
- "$(inherited)",
- "-ObjC",
- "-lc++",
- );
- PRODUCT_BUNDLE_IDENTIFIER = "dev.gorhom.bottom-sheet";
- PRODUCT_NAME = BottomSheetExample;
- SWIFT_OPTIMIZATION_LEVEL = "-Onone";
- SWIFT_VERSION = 5.0;
- TARGETED_DEVICE_FAMILY = "1,2";
- VERSIONING_SYSTEM = "apple-generic";
- };
- name = Debug;
- };
- 13B07F951A680F5B00A75B9A /* Release */ = {
- isa = XCBuildConfiguration;
- baseConfigurationReference = 4993DB3E6C68D3AE31536CF5 /* Pods-BottomSheetExample.release.xcconfig */;
- buildSettings = {
- ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
- CLANG_ENABLE_MODULES = YES;
- CURRENT_PROJECT_VERSION = 1;
- DEVELOPMENT_TEAM = "";
- INFOPLIST_FILE = BottomSheetExample/Info.plist;
- LD_RUNPATH_SEARCH_PATHS = (
- "$(inherited)",
- "@executable_path/Frameworks",
- );
- OTHER_LDFLAGS = (
- "$(inherited)",
- "-ObjC",
- "-lc++",
- );
- PRODUCT_BUNDLE_IDENTIFIER = "dev.gorhom.bottom-sheet";
- PRODUCT_NAME = BottomSheetExample;
- SWIFT_VERSION = 5.0;
- TARGETED_DEVICE_FAMILY = "1,2";
- VERSIONING_SYSTEM = "apple-generic";
- };
- name = Release;
- };
- 83CBBA201A601CBA00E9B192 /* Debug */ = {
- isa = XCBuildConfiguration;
- buildSettings = {
- ALWAYS_SEARCH_USER_PATHS = NO;
- CLANG_ANALYZER_LOCALIZABILITY_NONLOCALIZED = YES;
- CLANG_CXX_LANGUAGE_STANDARD = "c++17";
- CLANG_CXX_LIBRARY = "libc++";
- CLANG_ENABLE_MODULES = YES;
- CLANG_ENABLE_OBJC_ARC = YES;
- CLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;
- CLANG_WARN_BOOL_CONVERSION = YES;
- CLANG_WARN_COMMA = YES;
- CLANG_WARN_CONSTANT_CONVERSION = YES;
- CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;
- CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;
- CLANG_WARN_EMPTY_BODY = YES;
- CLANG_WARN_ENUM_CONVERSION = YES;
- CLANG_WARN_INFINITE_RECURSION = YES;
- CLANG_WARN_INT_CONVERSION = YES;
- CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;
- CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;
- CLANG_WARN_OBJC_LITERAL_CONVERSION = YES;
- CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;
- CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES;
- CLANG_WARN_RANGE_LOOP_ANALYSIS = YES;
- CLANG_WARN_STRICT_PROTOTYPES = YES;
- CLANG_WARN_SUSPICIOUS_MOVE = YES;
- CLANG_WARN_UNREACHABLE_CODE = YES;
- CLANG_WARN__DUPLICATE_METHOD_MATCH = YES;
- "CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
- COPY_PHASE_STRIP = NO;
- ENABLE_STRICT_OBJC_MSGSEND = YES;
- ENABLE_TESTABILITY = YES;
- "EXCLUDED_ARCHS[sdk=iphonesimulator*]" = i386;
- GCC_C_LANGUAGE_STANDARD = gnu99;
- GCC_DYNAMIC_NO_PIC = NO;
- GCC_NO_COMMON_BLOCKS = YES;
- GCC_OPTIMIZATION_LEVEL = 0;
- GCC_PREPROCESSOR_DEFINITIONS = (
- "DEBUG=1",
- "$(inherited)",
- );
- GCC_SYMBOLS_PRIVATE_EXTERN = NO;
- GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
- GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
- GCC_WARN_UNDECLARED_SELECTOR = YES;
- GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
- GCC_WARN_UNUSED_FUNCTION = YES;
- GCC_WARN_UNUSED_VARIABLE = YES;
- IPHONEOS_DEPLOYMENT_TARGET = 12.4;
- LD_RUNPATH_SEARCH_PATHS = (
- /usr/lib/swift,
- "$(inherited)",
- );
- LIBRARY_SEARCH_PATHS = (
- "\"$(SDKROOT)/usr/lib/swift\"",
- "\"$(TOOLCHAIN_DIR)/usr/lib/swift/$(PLATFORM_NAME)\"",
- "\"$(inherited)\"",
- );
- MTL_ENABLE_DEBUG_INFO = YES;
- ONLY_ACTIVE_ARCH = YES;
- OTHER_CPLUSPLUSFLAGS = (
- "$(OTHER_CFLAGS)",
- "-DFOLLY_NO_CONFIG",
- "-DFOLLY_MOBILE=1",
- "-DFOLLY_USE_LIBCPP=1",
- );
- REACT_NATIVE_PATH = "${PODS_ROOT}/../../node_modules/react-native";
- SDKROOT = iphoneos;
- };
- name = Debug;
- };
- 83CBBA211A601CBA00E9B192 /* Release */ = {
- isa = XCBuildConfiguration;
- buildSettings = {
- ALWAYS_SEARCH_USER_PATHS = NO;
- CLANG_ANALYZER_LOCALIZABILITY_NONLOCALIZED = YES;
- CLANG_CXX_LANGUAGE_STANDARD = "c++17";
- CLANG_CXX_LIBRARY = "libc++";
- CLANG_ENABLE_MODULES = YES;
- CLANG_ENABLE_OBJC_ARC = YES;
- CLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;
- CLANG_WARN_BOOL_CONVERSION = YES;
- CLANG_WARN_COMMA = YES;
- CLANG_WARN_CONSTANT_CONVERSION = YES;
- CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;
- CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;
- CLANG_WARN_EMPTY_BODY = YES;
- CLANG_WARN_ENUM_CONVERSION = YES;
- CLANG_WARN_INFINITE_RECURSION = YES;
- CLANG_WARN_INT_CONVERSION = YES;
- CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;
- CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;
- CLANG_WARN_OBJC_LITERAL_CONVERSION = YES;
- CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;
- CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES;
- CLANG_WARN_RANGE_LOOP_ANALYSIS = YES;
- CLANG_WARN_STRICT_PROTOTYPES = YES;
- CLANG_WARN_SUSPICIOUS_MOVE = YES;
- CLANG_WARN_UNREACHABLE_CODE = YES;
- CLANG_WARN__DUPLICATE_METHOD_MATCH = YES;
- "CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
- COPY_PHASE_STRIP = YES;
- ENABLE_NS_ASSERTIONS = NO;
- ENABLE_STRICT_OBJC_MSGSEND = YES;
- "EXCLUDED_ARCHS[sdk=iphonesimulator*]" = i386;
- GCC_C_LANGUAGE_STANDARD = gnu99;
- GCC_NO_COMMON_BLOCKS = YES;
- GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
- GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
- GCC_WARN_UNDECLARED_SELECTOR = YES;
- GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
- GCC_WARN_UNUSED_FUNCTION = YES;
- GCC_WARN_UNUSED_VARIABLE = YES;
- IPHONEOS_DEPLOYMENT_TARGET = 12.4;
- LD_RUNPATH_SEARCH_PATHS = (
- /usr/lib/swift,
- "$(inherited)",
- );
- LIBRARY_SEARCH_PATHS = (
- "\"$(SDKROOT)/usr/lib/swift\"",
- "\"$(TOOLCHAIN_DIR)/usr/lib/swift/$(PLATFORM_NAME)\"",
- "\"$(inherited)\"",
- );
- MTL_ENABLE_DEBUG_INFO = NO;
- OTHER_CPLUSPLUSFLAGS = (
- "$(OTHER_CFLAGS)",
- "-DFOLLY_NO_CONFIG",
- "-DFOLLY_MOBILE=1",
- "-DFOLLY_USE_LIBCPP=1",
- );
- REACT_NATIVE_PATH = "${PODS_ROOT}/../../node_modules/react-native";
- SDKROOT = iphoneos;
- VALIDATE_PRODUCT = YES;
- };
- name = Release;
- };
-/* End XCBuildConfiguration section */
-
-/* Begin XCConfigurationList section */
- 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "BottomSheetExample" */ = {
- isa = XCConfigurationList;
- buildConfigurations = (
- 13B07F941A680F5B00A75B9A /* Debug */,
- 13B07F951A680F5B00A75B9A /* Release */,
- );
- defaultConfigurationIsVisible = 0;
- defaultConfigurationName = Release;
- };
- 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "BottomSheetExample" */ = {
- isa = XCConfigurationList;
- buildConfigurations = (
- 83CBBA201A601CBA00E9B192 /* Debug */,
- 83CBBA211A601CBA00E9B192 /* Release */,
- );
- defaultConfigurationIsVisible = 0;
- defaultConfigurationName = Release;
- };
-/* End XCConfigurationList section */
- };
- rootObject = 83CBB9F71A601CBA00E9B192 /* Project object */;
-}
diff --git a/example/bare/ios/BottomSheetExample.xcodeproj/xcshareddata/xcschemes/BottomSheetExample.xcscheme b/example/bare/ios/BottomSheetExample.xcodeproj/xcshareddata/xcschemes/BottomSheetExample.xcscheme
deleted file mode 100644
index ae963b87c..000000000
--- a/example/bare/ios/BottomSheetExample.xcodeproj/xcshareddata/xcschemes/BottomSheetExample.xcscheme
+++ /dev/null
@@ -1,78 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/example/bare/ios/BottomSheetExample.xcworkspace/contents.xcworkspacedata b/example/bare/ios/BottomSheetExample.xcworkspace/contents.xcworkspacedata
deleted file mode 100644
index 615c4aac0..000000000
--- a/example/bare/ios/BottomSheetExample.xcworkspace/contents.xcworkspacedata
+++ /dev/null
@@ -1,10 +0,0 @@
-
-
-
-
-
-
-
diff --git a/example/bare/ios/BottomSheetExample.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist b/example/bare/ios/BottomSheetExample.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist
deleted file mode 100644
index 18d981003..000000000
--- a/example/bare/ios/BottomSheetExample.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist
+++ /dev/null
@@ -1,8 +0,0 @@
-
-
-
-
- IDEDidComputeMac32BitWarning
-
-
-
diff --git a/example/bare/ios/BottomSheetExample/AppDelegate.h b/example/bare/ios/BottomSheetExample/AppDelegate.h
deleted file mode 100644
index ef1de86a2..000000000
--- a/example/bare/ios/BottomSheetExample/AppDelegate.h
+++ /dev/null
@@ -1,8 +0,0 @@
-#import
-#import
-
-@interface AppDelegate : UIResponder
-
-@property (nonatomic, strong) UIWindow *window;
-
-@end
diff --git a/example/bare/ios/BottomSheetExample/AppDelegate.mm b/example/bare/ios/BottomSheetExample/AppDelegate.mm
deleted file mode 100644
index 480bc79fe..000000000
--- a/example/bare/ios/BottomSheetExample/AppDelegate.mm
+++ /dev/null
@@ -1,130 +0,0 @@
-#import "AppDelegate.h"
-
-#import
-#import
-#import
-
-#import
-
-#if RCT_NEW_ARCH_ENABLED
-#import
-#import
-#import
-#import
-#import
-#import
-
-#import
-
-static NSString *const kRNConcurrentRoot = @"concurrentRoot";
-
-@interface AppDelegate () {
- RCTTurboModuleManager *_turboModuleManager;
- RCTSurfacePresenterBridgeAdapter *_bridgeAdapter;
- std::shared_ptr _reactNativeConfig;
- facebook::react::ContextContainer::Shared _contextContainer;
-}
-@end
-#endif
-
-@implementation AppDelegate
-
-- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
-{
- RCTAppSetupPrepareApp(application);
-
- RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];
-
-#if RCT_NEW_ARCH_ENABLED
- _contextContainer = std::make_shared();
- _reactNativeConfig = std::make_shared();
- _contextContainer->insert("ReactNativeConfig", _reactNativeConfig);
- _bridgeAdapter = [[RCTSurfacePresenterBridgeAdapter alloc] initWithBridge:bridge contextContainer:_contextContainer];
- bridge.surfacePresenter = _bridgeAdapter.surfacePresenter;
-#endif
-
- NSDictionary *initProps = [self prepareInitialProps];
- UIView *rootView = RCTAppSetupDefaultRootView(bridge, @"BottomSheetExample", initProps);
-
- if (@available(iOS 13.0, *)) {
- rootView.backgroundColor = [UIColor systemBackgroundColor];
- } else {
- rootView.backgroundColor = [UIColor whiteColor];
- }
-
- self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
- UIViewController *rootViewController = [UIViewController new];
- rootViewController.view = rootView;
- self.window.rootViewController = rootViewController;
- [self.window makeKeyAndVisible];
- return YES;
-}
-
-/// This method controls whether the `concurrentRoot`feature of React18 is turned on or off.
-///
-/// @see: https://reactjs.org/blog/2022/03/29/react-v18.html
-/// @note: This requires to be rendering on Fabric (i.e. on the New Architecture).
-/// @return: `true` if the `concurrentRoot` feture is enabled. Otherwise, it returns `false`.
-- (BOOL)concurrentRootEnabled
-{
- // Switch this bool to turn on and off the concurrent root
- return true;
-}
-- (NSDictionary *)prepareInitialProps
-{
- NSMutableDictionary *initProps = [NSMutableDictionary new];
-#ifdef RCT_NEW_ARCH_ENABLED
- initProps[kRNConcurrentRoot] = @([self concurrentRootEnabled]);
-#endif
- return initProps;
-}
-
-- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
-{
-#if DEBUG
- return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"];
-#else
- return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
-#endif
-}
-
-#if RCT_NEW_ARCH_ENABLED
-
-#pragma mark - RCTCxxBridgeDelegate
-
-- (std::unique_ptr)jsExecutorFactoryForBridge:(RCTBridge *)bridge
-{
- _turboModuleManager = [[RCTTurboModuleManager alloc] initWithBridge:bridge
- delegate:self
- jsInvoker:bridge.jsCallInvoker];
- return RCTAppSetupDefaultJsExecutorFactory(bridge, _turboModuleManager);
-}
-
-#pragma mark RCTTurboModuleManagerDelegate
-
-- (Class)getModuleClassFromName:(const char *)name
-{
- return RCTCoreModulesClassProvider(name);
-}
-
-- (std::shared_ptr)getTurboModule:(const std::string &)name
- jsInvoker:(std::shared_ptr)jsInvoker
-{
- return nullptr;
-}
-
-- (std::shared_ptr)getTurboModule:(const std::string &)name
- initParams:
- (const facebook::react::ObjCTurboModule::InitParams &)params
-{
- return nullptr;
-}
-
-- (id)getModuleInstanceFromClass:(Class)moduleClass
-{
- return RCTAppSetupDefaultModuleFromClass(moduleClass);
-}
-
-#endif
-
-@end
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/100.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/100.png
deleted file mode 100644
index 9d09b2964..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/100.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/1024.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/1024.png
deleted file mode 100644
index 21b184fe3..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/1024.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/114.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/114.png
deleted file mode 100644
index 5a8bc8fac..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/114.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/120.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/120.png
deleted file mode 100644
index 651271304..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/120.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/144.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/144.png
deleted file mode 100644
index 65a9bb960..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/144.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/152.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/152.png
deleted file mode 100644
index 8952528eb..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/152.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/167.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/167.png
deleted file mode 100644
index 0a775a4d8..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/167.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/180.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/180.png
deleted file mode 100644
index 50874630a..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/180.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/20.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/20.png
deleted file mode 100644
index 6b20674cc..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/20.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/29.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/29.png
deleted file mode 100644
index dcc6d0fe5..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/29.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/40.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/40.png
deleted file mode 100644
index 661fc108e..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/40.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/57.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/57.png
deleted file mode 100644
index 87252e3b4..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/57.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/58.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/58.png
deleted file mode 100644
index 3ae0843a9..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/58.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/60.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/60.png
deleted file mode 100644
index 6a6900c8c..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/60.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/72.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/72.png
deleted file mode 100644
index 665280675..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/72.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/76.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/76.png
deleted file mode 100644
index a7ce0f047..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/76.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/80.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/80.png
deleted file mode 100644
index afa17f979..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/80.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/87.png b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/87.png
deleted file mode 100644
index 3c86cd51f..000000000
Binary files a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/87.png and /dev/null differ
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/Contents.json b/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/Contents.json
deleted file mode 100644
index 4fdf88263..000000000
--- a/example/bare/ios/BottomSheetExample/Images.xcassets/AppIcon.appiconset/Contents.json
+++ /dev/null
@@ -1,158 +0,0 @@
-{
- "images" : [
- {
- "filename" : "40.png",
- "idiom" : "iphone",
- "scale" : "2x",
- "size" : "20x20"
- },
- {
- "filename" : "60.png",
- "idiom" : "iphone",
- "scale" : "3x",
- "size" : "20x20"
- },
- {
- "filename" : "29.png",
- "idiom" : "iphone",
- "scale" : "1x",
- "size" : "29x29"
- },
- {
- "filename" : "58.png",
- "idiom" : "iphone",
- "scale" : "2x",
- "size" : "29x29"
- },
- {
- "filename" : "87.png",
- "idiom" : "iphone",
- "scale" : "3x",
- "size" : "29x29"
- },
- {
- "filename" : "80.png",
- "idiom" : "iphone",
- "scale" : "2x",
- "size" : "40x40"
- },
- {
- "filename" : "120.png",
- "idiom" : "iphone",
- "scale" : "3x",
- "size" : "40x40"
- },
- {
- "filename" : "57.png",
- "idiom" : "iphone",
- "scale" : "1x",
- "size" : "57x57"
- },
- {
- "filename" : "114.png",
- "idiom" : "iphone",
- "scale" : "2x",
- "size" : "57x57"
- },
- {
- "filename" : "120.png",
- "idiom" : "iphone",
- "scale" : "2x",
- "size" : "60x60"
- },
- {
- "filename" : "180.png",
- "idiom" : "iphone",
- "scale" : "3x",
- "size" : "60x60"
- },
- {
- "filename" : "20.png",
- "idiom" : "ipad",
- "scale" : "1x",
- "size" : "20x20"
- },
- {
- "filename" : "40.png",
- "idiom" : "ipad",
- "scale" : "2x",
- "size" : "20x20"
- },
- {
- "filename" : "29.png",
- "idiom" : "ipad",
- "scale" : "1x",
- "size" : "29x29"
- },
- {
- "filename" : "58.png",
- "idiom" : "ipad",
- "scale" : "2x",
- "size" : "29x29"
- },
- {
- "filename" : "40.png",
- "idiom" : "ipad",
- "scale" : "1x",
- "size" : "40x40"
- },
- {
- "filename" : "80.png",
- "idiom" : "ipad",
- "scale" : "2x",
- "size" : "40x40"
- },
- {
- "filename" : "50.png",
- "idiom" : "ipad",
- "scale" : "1x",
- "size" : "50x50"
- },
- {
- "filename" : "100.png",
- "idiom" : "ipad",
- "scale" : "2x",
- "size" : "50x50"
- },
- {
- "filename" : "72.png",
- "idiom" : "ipad",
- "scale" : "1x",
- "size" : "72x72"
- },
- {
- "filename" : "144.png",
- "idiom" : "ipad",
- "scale" : "2x",
- "size" : "72x72"
- },
- {
- "filename" : "76.png",
- "idiom" : "ipad",
- "scale" : "1x",
- "size" : "76x76"
- },
- {
- "filename" : "152.png",
- "idiom" : "ipad",
- "scale" : "2x",
- "size" : "76x76"
- },
- {
- "filename" : "167.png",
- "idiom" : "ipad",
- "scale" : "2x",
- "size" : "83.5x83.5"
- },
- {
- "filename" : "1024.png",
- "idiom" : "ios-marketing",
- "scale" : "1x",
- "size" : "1024x1024"
- }
- ],
- "info" : {
- "author" : "xcode",
- "version" : 1
- }
-}
diff --git a/example/bare/ios/BottomSheetExample/Images.xcassets/Contents.json b/example/bare/ios/BottomSheetExample/Images.xcassets/Contents.json
deleted file mode 100644
index 73c00596a..000000000
--- a/example/bare/ios/BottomSheetExample/Images.xcassets/Contents.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
- "info" : {
- "author" : "xcode",
- "version" : 1
- }
-}
diff --git a/example/bare/ios/BottomSheetExample/Info.plist b/example/bare/ios/BottomSheetExample/Info.plist
deleted file mode 100644
index 0ed3a502d..000000000
--- a/example/bare/ios/BottomSheetExample/Info.plist
+++ /dev/null
@@ -1,56 +0,0 @@
-
-
-
-
- CFBundleDevelopmentRegion
- en
- CFBundleDisplayName
- BottomSheet Example
- CFBundleExecutable
- $(EXECUTABLE_NAME)
- CFBundleIdentifier
- $(PRODUCT_BUNDLE_IDENTIFIER)
- CFBundleInfoDictionaryVersion
- 6.0
- CFBundleName
- $(PRODUCT_NAME)
- CFBundlePackageType
- APPL
- CFBundleShortVersionString
- 1.0
- CFBundleSignature
- ????
- CFBundleVersion
- 1
- LSRequiresIPhoneOS
-
- NSAppTransportSecurity
-
- NSExceptionDomains
-
- localhost
-
- NSExceptionAllowsInsecureHTTPLoads
-
-
-
-
- NSLocationWhenInUseUsageDescription
-
- UILaunchStoryboardName
- LaunchScreen
- UIRequiredDeviceCapabilities
-
- armv7
-
- UISupportedInterfaceOrientations
-
- UIInterfaceOrientationPortrait
- UIInterfaceOrientationLandscapeRight
- UIInterfaceOrientationPortraitUpsideDown
- UIInterfaceOrientationLandscapeLeft
-
- UIViewControllerBasedStatusBarAppearance
-
-
-
diff --git a/example/bare/ios/BottomSheetExample/LaunchScreen.storyboard b/example/bare/ios/BottomSheetExample/LaunchScreen.storyboard
deleted file mode 100644
index 8f5954a5a..000000000
--- a/example/bare/ios/BottomSheetExample/LaunchScreen.storyboard
+++ /dev/null
@@ -1,54 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/example/bare/ios/BottomSheetExample/main.m b/example/bare/ios/BottomSheetExample/main.m
deleted file mode 100644
index b1df44b95..000000000
--- a/example/bare/ios/BottomSheetExample/main.m
+++ /dev/null
@@ -1,9 +0,0 @@
-#import
-
-#import "AppDelegate.h"
-
-int main(int argc, char * argv[]) {
- @autoreleasepool {
- return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
- }
-}
diff --git a/example/bare/ios/Podfile b/example/bare/ios/Podfile
deleted file mode 100644
index a8c20b709..000000000
--- a/example/bare/ios/Podfile
+++ /dev/null
@@ -1,30 +0,0 @@
-require_relative '../node_modules/react-native/scripts/react_native_pods'
-require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
-
-platform :ios, '12.4'
-install! 'cocoapods', :deterministic_uuids => false
-
-production = ENV["PRODUCTION"] == "1"
-
-target 'BottomSheetExample' do
- config = use_native_modules!
-
- # Flags change depending on the env values.
- flags = get_default_flags()
-
- use_react_native!(
- :path => config[:reactNativePath],
- # to enable hermes on iOS, change `false` to `true` and then install pods
- :production => production,
- :hermes_enabled => true,
- :fabric_enabled => flags[:fabric_enabled],
- :flipper_configuration => FlipperConfiguration.enabled,
- # An absolute path to your application root.
- :app_path => "#{Pod::Config.instance.installation_root}/.."
- )
-
- post_install do |installer|
- react_native_post_install(installer)
- __apply_Xcode_12_5_M1_post_install_workaround(installer)
- end
-end
diff --git a/example/bare/ios/Podfile.lock b/example/bare/ios/Podfile.lock
deleted file mode 100644
index 05c4758de..000000000
--- a/example/bare/ios/Podfile.lock
+++ /dev/null
@@ -1,656 +0,0 @@
-PODS:
- - boost (1.76.0)
- - CocoaAsyncSocket (7.6.5)
- - DoubleConversion (1.1.6)
- - FBLazyVector (0.69.4)
- - FBReactNativeSpec (0.69.4):
- - RCT-Folly (= 2021.06.28.00-v2)
- - RCTRequired (= 0.69.4)
- - RCTTypeSafety (= 0.69.4)
- - React-Core (= 0.69.4)
- - React-jsi (= 0.69.4)
- - ReactCommon/turbomodule/core (= 0.69.4)
- - Flipper (0.125.0):
- - Flipper-Folly (~> 2.6)
- - Flipper-RSocket (~> 1.4)
- - Flipper-Boost-iOSX (1.76.0.1.11)
- - Flipper-DoubleConversion (3.2.0.1)
- - Flipper-Fmt (7.1.7)
- - Flipper-Folly (2.6.10):
- - Flipper-Boost-iOSX
- - Flipper-DoubleConversion
- - Flipper-Fmt (= 7.1.7)
- - Flipper-Glog
- - libevent (~> 2.1.12)
- - OpenSSL-Universal (= 1.1.1100)
- - Flipper-Glog (0.5.0.5)
- - Flipper-PeerTalk (0.0.4)
- - Flipper-RSocket (1.4.3):
- - Flipper-Folly (~> 2.6)
- - FlipperKit (0.125.0):
- - FlipperKit/Core (= 0.125.0)
- - FlipperKit/Core (0.125.0):
- - Flipper (~> 0.125.0)
- - FlipperKit/CppBridge
- - FlipperKit/FBCxxFollyDynamicConvert
- - FlipperKit/FBDefines
- - FlipperKit/FKPortForwarding
- - SocketRocket (~> 0.6.0)
- - FlipperKit/CppBridge (0.125.0):
- - Flipper (~> 0.125.0)
- - FlipperKit/FBCxxFollyDynamicConvert (0.125.0):
- - Flipper-Folly (~> 2.6)
- - FlipperKit/FBDefines (0.125.0)
- - FlipperKit/FKPortForwarding (0.125.0):
- - CocoaAsyncSocket (~> 7.6)
- - Flipper-PeerTalk (~> 0.0.4)
- - FlipperKit/FlipperKitHighlightOverlay (0.125.0)
- - FlipperKit/FlipperKitLayoutHelpers (0.125.0):
- - FlipperKit/Core
- - FlipperKit/FlipperKitHighlightOverlay
- - FlipperKit/FlipperKitLayoutTextSearchable
- - FlipperKit/FlipperKitLayoutIOSDescriptors (0.125.0):
- - FlipperKit/Core
- - FlipperKit/FlipperKitHighlightOverlay
- - FlipperKit/FlipperKitLayoutHelpers
- - YogaKit (~> 1.18)
- - FlipperKit/FlipperKitLayoutPlugin (0.125.0):
- - FlipperKit/Core
- - FlipperKit/FlipperKitHighlightOverlay
- - FlipperKit/FlipperKitLayoutHelpers
- - FlipperKit/FlipperKitLayoutIOSDescriptors
- - FlipperKit/FlipperKitLayoutTextSearchable
- - YogaKit (~> 1.18)
- - FlipperKit/FlipperKitLayoutTextSearchable (0.125.0)
- - FlipperKit/FlipperKitNetworkPlugin (0.125.0):
- - FlipperKit/Core
- - FlipperKit/FlipperKitReactPlugin (0.125.0):
- - FlipperKit/Core
- - FlipperKit/FlipperKitUserDefaultsPlugin (0.125.0):
- - FlipperKit/Core
- - FlipperKit/SKIOSNetworkPlugin (0.125.0):
- - FlipperKit/Core
- - FlipperKit/FlipperKitNetworkPlugin
- - fmt (6.2.1)
- - glog (0.3.5)
- - hermes-engine (0.69.4)
- - libevent (2.1.12)
- - OpenSSL-Universal (1.1.1100)
- - RCT-Folly (2021.06.28.00-v2):
- - boost
- - DoubleConversion
- - fmt (~> 6.2.1)
- - glog
- - RCT-Folly/Default (= 2021.06.28.00-v2)
- - RCT-Folly/Default (2021.06.28.00-v2):
- - boost
- - DoubleConversion
- - fmt (~> 6.2.1)
- - glog
- - RCT-Folly/Futures (2021.06.28.00-v2):
- - boost
- - DoubleConversion
- - fmt (~> 6.2.1)
- - glog
- - libevent
- - RCTRequired (0.69.4)
- - RCTTypeSafety (0.69.4):
- - FBLazyVector (= 0.69.4)
- - RCTRequired (= 0.69.4)
- - React-Core (= 0.69.4)
- - React (0.69.4):
- - React-Core (= 0.69.4)
- - React-Core/DevSupport (= 0.69.4)
- - React-Core/RCTWebSocket (= 0.69.4)
- - React-RCTActionSheet (= 0.69.4)
- - React-RCTAnimation (= 0.69.4)
- - React-RCTBlob (= 0.69.4)
- - React-RCTImage (= 0.69.4)
- - React-RCTLinking (= 0.69.4)
- - React-RCTNetwork (= 0.69.4)
- - React-RCTSettings (= 0.69.4)
- - React-RCTText (= 0.69.4)
- - React-RCTVibration (= 0.69.4)
- - React-bridging (0.69.4):
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-jsi (= 0.69.4)
- - React-callinvoker (0.69.4)
- - React-Codegen (0.69.4):
- - FBReactNativeSpec (= 0.69.4)
- - RCT-Folly (= 2021.06.28.00-v2)
- - RCTRequired (= 0.69.4)
- - RCTTypeSafety (= 0.69.4)
- - React-Core (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - ReactCommon/turbomodule/core (= 0.69.4)
- - React-Core (0.69.4):
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Core/Default (= 0.69.4)
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - Yoga
- - React-Core/CoreModulesHeaders (0.69.4):
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Core/Default
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - Yoga
- - React-Core/Default (0.69.4):
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - Yoga
- - React-Core/DevSupport (0.69.4):
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Core/Default (= 0.69.4)
- - React-Core/RCTWebSocket (= 0.69.4)
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-jsinspector (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - Yoga
- - React-Core/RCTActionSheetHeaders (0.69.4):
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Core/Default
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - Yoga
- - React-Core/RCTAnimationHeaders (0.69.4):
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Core/Default
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - Yoga
- - React-Core/RCTBlobHeaders (0.69.4):
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Core/Default
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - Yoga
- - React-Core/RCTImageHeaders (0.69.4):
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Core/Default
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - Yoga
- - React-Core/RCTLinkingHeaders (0.69.4):
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Core/Default
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - Yoga
- - React-Core/RCTNetworkHeaders (0.69.4):
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Core/Default
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - Yoga
- - React-Core/RCTSettingsHeaders (0.69.4):
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Core/Default
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - Yoga
- - React-Core/RCTTextHeaders (0.69.4):
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Core/Default
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - Yoga
- - React-Core/RCTVibrationHeaders (0.69.4):
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Core/Default
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - Yoga
- - React-Core/RCTWebSocket (0.69.4):
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Core/Default (= 0.69.4)
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - Yoga
- - React-CoreModules (0.69.4):
- - RCT-Folly (= 2021.06.28.00-v2)
- - RCTTypeSafety (= 0.69.4)
- - React-Codegen (= 0.69.4)
- - React-Core/CoreModulesHeaders (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-RCTImage (= 0.69.4)
- - ReactCommon/turbomodule/core (= 0.69.4)
- - React-cxxreact (0.69.4):
- - boost (= 1.76.0)
- - DoubleConversion
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-callinvoker (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsinspector (= 0.69.4)
- - React-logger (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - React-runtimeexecutor (= 0.69.4)
- - React-hermes (0.69.4):
- - DoubleConversion
- - glog
- - hermes-engine
- - RCT-Folly (= 2021.06.28.00-v2)
- - RCT-Folly/Futures (= 2021.06.28.00-v2)
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-jsiexecutor (= 0.69.4)
- - React-jsinspector (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - React-jsi (0.69.4):
- - boost (= 1.76.0)
- - DoubleConversion
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-jsi/Default (= 0.69.4)
- - React-jsi/Default (0.69.4):
- - boost (= 1.76.0)
- - DoubleConversion
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-jsiexecutor (0.69.4):
- - DoubleConversion
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - React-jsinspector (0.69.4)
- - React-logger (0.69.4):
- - glog
- - react-native-blur (0.8.0):
- - React
- - react-native-maps (0.30.2):
- - React-Core
- - react-native-pager-view (5.4.24):
- - React-Core
- - react-native-safe-area-context (4.2.4):
- - RCT-Folly
- - RCTRequired
- - RCTTypeSafety
- - React
- - ReactCommon/turbomodule/core
- - React-perflogger (0.69.4)
- - React-RCTActionSheet (0.69.4):
- - React-Core/RCTActionSheetHeaders (= 0.69.4)
- - React-RCTAnimation (0.69.4):
- - RCT-Folly (= 2021.06.28.00-v2)
- - RCTTypeSafety (= 0.69.4)
- - React-Codegen (= 0.69.4)
- - React-Core/RCTAnimationHeaders (= 0.69.4)
- - React-jsi (= 0.69.4)
- - ReactCommon/turbomodule/core (= 0.69.4)
- - React-RCTBlob (0.69.4):
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Codegen (= 0.69.4)
- - React-Core/RCTBlobHeaders (= 0.69.4)
- - React-Core/RCTWebSocket (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-RCTNetwork (= 0.69.4)
- - ReactCommon/turbomodule/core (= 0.69.4)
- - React-RCTImage (0.69.4):
- - RCT-Folly (= 2021.06.28.00-v2)
- - RCTTypeSafety (= 0.69.4)
- - React-Codegen (= 0.69.4)
- - React-Core/RCTImageHeaders (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-RCTNetwork (= 0.69.4)
- - ReactCommon/turbomodule/core (= 0.69.4)
- - React-RCTLinking (0.69.4):
- - React-Codegen (= 0.69.4)
- - React-Core/RCTLinkingHeaders (= 0.69.4)
- - React-jsi (= 0.69.4)
- - ReactCommon/turbomodule/core (= 0.69.4)
- - React-RCTNetwork (0.69.4):
- - RCT-Folly (= 2021.06.28.00-v2)
- - RCTTypeSafety (= 0.69.4)
- - React-Codegen (= 0.69.4)
- - React-Core/RCTNetworkHeaders (= 0.69.4)
- - React-jsi (= 0.69.4)
- - ReactCommon/turbomodule/core (= 0.69.4)
- - React-RCTSettings (0.69.4):
- - RCT-Folly (= 2021.06.28.00-v2)
- - RCTTypeSafety (= 0.69.4)
- - React-Codegen (= 0.69.4)
- - React-Core/RCTSettingsHeaders (= 0.69.4)
- - React-jsi (= 0.69.4)
- - ReactCommon/turbomodule/core (= 0.69.4)
- - React-RCTText (0.69.4):
- - React-Core/RCTTextHeaders (= 0.69.4)
- - React-RCTVibration (0.69.4):
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-Codegen (= 0.69.4)
- - React-Core/RCTVibrationHeaders (= 0.69.4)
- - React-jsi (= 0.69.4)
- - ReactCommon/turbomodule/core (= 0.69.4)
- - React-runtimeexecutor (0.69.4):
- - React-jsi (= 0.69.4)
- - ReactCommon/turbomodule/core (0.69.4):
- - DoubleConversion
- - glog
- - RCT-Folly (= 2021.06.28.00-v2)
- - React-bridging (= 0.69.4)
- - React-callinvoker (= 0.69.4)
- - React-Core (= 0.69.4)
- - React-cxxreact (= 0.69.4)
- - React-jsi (= 0.69.4)
- - React-logger (= 0.69.4)
- - React-perflogger (= 0.69.4)
- - RNCMaskedView (0.1.11):
- - React
- - RNGestureHandler (2.5.0):
- - React-Core
- - RNReanimated (2.9.1):
- - DoubleConversion
- - FBLazyVector
- - FBReactNativeSpec
- - glog
- - RCT-Folly
- - RCTRequired
- - RCTTypeSafety
- - React-callinvoker
- - React-Core
- - React-Core/DevSupport
- - React-Core/RCTWebSocket
- - React-CoreModules
- - React-cxxreact
- - React-jsi
- - React-jsiexecutor
- - React-jsinspector
- - React-RCTActionSheet
- - React-RCTAnimation
- - React-RCTBlob
- - React-RCTImage
- - React-RCTLinking
- - React-RCTNetwork
- - React-RCTSettings
- - React-RCTText
- - ReactCommon/turbomodule/core
- - Yoga
- - RNScreens (3.15.0):
- - React-Core
- - React-RCTImage
- - SocketRocket (0.6.0)
- - Yoga (1.14.0)
- - YogaKit (1.18.1):
- - Yoga (~> 1.14)
-
-DEPENDENCIES:
- - boost (from `../node_modules/react-native/third-party-podspecs/boost.podspec`)
- - DoubleConversion (from `../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec`)
- - FBLazyVector (from `../node_modules/react-native/Libraries/FBLazyVector`)
- - FBReactNativeSpec (from `../node_modules/react-native/React/FBReactNativeSpec`)
- - Flipper (= 0.125.0)
- - Flipper-Boost-iOSX (= 1.76.0.1.11)
- - Flipper-DoubleConversion (= 3.2.0.1)
- - Flipper-Fmt (= 7.1.7)
- - Flipper-Folly (= 2.6.10)
- - Flipper-Glog (= 0.5.0.5)
- - Flipper-PeerTalk (= 0.0.4)
- - Flipper-RSocket (= 1.4.3)
- - FlipperKit (= 0.125.0)
- - FlipperKit/Core (= 0.125.0)
- - FlipperKit/CppBridge (= 0.125.0)
- - FlipperKit/FBCxxFollyDynamicConvert (= 0.125.0)
- - FlipperKit/FBDefines (= 0.125.0)
- - FlipperKit/FKPortForwarding (= 0.125.0)
- - FlipperKit/FlipperKitHighlightOverlay (= 0.125.0)
- - FlipperKit/FlipperKitLayoutPlugin (= 0.125.0)
- - FlipperKit/FlipperKitLayoutTextSearchable (= 0.125.0)
- - FlipperKit/FlipperKitNetworkPlugin (= 0.125.0)
- - FlipperKit/FlipperKitReactPlugin (= 0.125.0)
- - FlipperKit/FlipperKitUserDefaultsPlugin (= 0.125.0)
- - FlipperKit/SKIOSNetworkPlugin (= 0.125.0)
- - glog (from `../node_modules/react-native/third-party-podspecs/glog.podspec`)
- - hermes-engine (from `../node_modules/react-native/sdks/hermes/hermes-engine.podspec`)
- - libevent (~> 2.1.12)
- - OpenSSL-Universal (= 1.1.1100)
- - RCT-Folly (from `../node_modules/react-native/third-party-podspecs/RCT-Folly.podspec`)
- - RCTRequired (from `../node_modules/react-native/Libraries/RCTRequired`)
- - RCTTypeSafety (from `../node_modules/react-native/Libraries/TypeSafety`)
- - React (from `../node_modules/react-native/`)
- - React-bridging (from `../node_modules/react-native/ReactCommon`)
- - React-callinvoker (from `../node_modules/react-native/ReactCommon/callinvoker`)
- - React-Codegen (from `build/generated/ios`)
- - React-Core (from `../node_modules/react-native/`)
- - React-Core/DevSupport (from `../node_modules/react-native/`)
- - React-Core/RCTWebSocket (from `../node_modules/react-native/`)
- - React-CoreModules (from `../node_modules/react-native/React/CoreModules`)
- - React-cxxreact (from `../node_modules/react-native/ReactCommon/cxxreact`)
- - React-hermes (from `../node_modules/react-native/ReactCommon/hermes`)
- - React-jsi (from `../node_modules/react-native/ReactCommon/jsi`)
- - React-jsiexecutor (from `../node_modules/react-native/ReactCommon/jsiexecutor`)
- - React-jsinspector (from `../node_modules/react-native/ReactCommon/jsinspector`)
- - React-logger (from `../node_modules/react-native/ReactCommon/logger`)
- - "react-native-blur (from `../node_modules/@react-native-community/blur`)"
- - react-native-maps (from `../node_modules/react-native-maps`)
- - react-native-pager-view (from `../node_modules/react-native-pager-view`)
- - react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`)
- - React-perflogger (from `../node_modules/react-native/ReactCommon/reactperflogger`)
- - React-RCTActionSheet (from `../node_modules/react-native/Libraries/ActionSheetIOS`)
- - React-RCTAnimation (from `../node_modules/react-native/Libraries/NativeAnimation`)
- - React-RCTBlob (from `../node_modules/react-native/Libraries/Blob`)
- - React-RCTImage (from `../node_modules/react-native/Libraries/Image`)
- - React-RCTLinking (from `../node_modules/react-native/Libraries/LinkingIOS`)
- - React-RCTNetwork (from `../node_modules/react-native/Libraries/Network`)
- - React-RCTSettings (from `../node_modules/react-native/Libraries/Settings`)
- - React-RCTText (from `../node_modules/react-native/Libraries/Text`)
- - React-RCTVibration (from `../node_modules/react-native/Libraries/Vibration`)
- - React-runtimeexecutor (from `../node_modules/react-native/ReactCommon/runtimeexecutor`)
- - ReactCommon/turbomodule/core (from `../node_modules/react-native/ReactCommon`)
- - "RNCMaskedView (from `../node_modules/@react-native-community/masked-view`)"
- - RNGestureHandler (from `../node_modules/react-native-gesture-handler`)
- - RNReanimated (from `../node_modules/react-native-reanimated`)
- - RNScreens (from `../node_modules/react-native-screens`)
- - Yoga (from `../node_modules/react-native/ReactCommon/yoga`)
-
-SPEC REPOS:
- trunk:
- - CocoaAsyncSocket
- - Flipper
- - Flipper-Boost-iOSX
- - Flipper-DoubleConversion
- - Flipper-Fmt
- - Flipper-Folly
- - Flipper-Glog
- - Flipper-PeerTalk
- - Flipper-RSocket
- - FlipperKit
- - fmt
- - libevent
- - OpenSSL-Universal
- - SocketRocket
- - YogaKit
-
-EXTERNAL SOURCES:
- boost:
- :podspec: "../node_modules/react-native/third-party-podspecs/boost.podspec"
- DoubleConversion:
- :podspec: "../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec"
- FBLazyVector:
- :path: "../node_modules/react-native/Libraries/FBLazyVector"
- FBReactNativeSpec:
- :path: "../node_modules/react-native/React/FBReactNativeSpec"
- glog:
- :podspec: "../node_modules/react-native/third-party-podspecs/glog.podspec"
- hermes-engine:
- :podspec: "../node_modules/react-native/sdks/hermes/hermes-engine.podspec"
- RCT-Folly:
- :podspec: "../node_modules/react-native/third-party-podspecs/RCT-Folly.podspec"
- RCTRequired:
- :path: "../node_modules/react-native/Libraries/RCTRequired"
- RCTTypeSafety:
- :path: "../node_modules/react-native/Libraries/TypeSafety"
- React:
- :path: "../node_modules/react-native/"
- React-bridging:
- :path: "../node_modules/react-native/ReactCommon"
- React-callinvoker:
- :path: "../node_modules/react-native/ReactCommon/callinvoker"
- React-Codegen:
- :path: build/generated/ios
- React-Core:
- :path: "../node_modules/react-native/"
- React-CoreModules:
- :path: "../node_modules/react-native/React/CoreModules"
- React-cxxreact:
- :path: "../node_modules/react-native/ReactCommon/cxxreact"
- React-hermes:
- :path: "../node_modules/react-native/ReactCommon/hermes"
- React-jsi:
- :path: "../node_modules/react-native/ReactCommon/jsi"
- React-jsiexecutor:
- :path: "../node_modules/react-native/ReactCommon/jsiexecutor"
- React-jsinspector:
- :path: "../node_modules/react-native/ReactCommon/jsinspector"
- React-logger:
- :path: "../node_modules/react-native/ReactCommon/logger"
- react-native-blur:
- :path: "../node_modules/@react-native-community/blur"
- react-native-maps:
- :path: "../node_modules/react-native-maps"
- react-native-pager-view:
- :path: "../node_modules/react-native-pager-view"
- react-native-safe-area-context:
- :path: "../node_modules/react-native-safe-area-context"
- React-perflogger:
- :path: "../node_modules/react-native/ReactCommon/reactperflogger"
- React-RCTActionSheet:
- :path: "../node_modules/react-native/Libraries/ActionSheetIOS"
- React-RCTAnimation:
- :path: "../node_modules/react-native/Libraries/NativeAnimation"
- React-RCTBlob:
- :path: "../node_modules/react-native/Libraries/Blob"
- React-RCTImage:
- :path: "../node_modules/react-native/Libraries/Image"
- React-RCTLinking:
- :path: "../node_modules/react-native/Libraries/LinkingIOS"
- React-RCTNetwork:
- :path: "../node_modules/react-native/Libraries/Network"
- React-RCTSettings:
- :path: "../node_modules/react-native/Libraries/Settings"
- React-RCTText:
- :path: "../node_modules/react-native/Libraries/Text"
- React-RCTVibration:
- :path: "../node_modules/react-native/Libraries/Vibration"
- React-runtimeexecutor:
- :path: "../node_modules/react-native/ReactCommon/runtimeexecutor"
- ReactCommon:
- :path: "../node_modules/react-native/ReactCommon"
- RNCMaskedView:
- :path: "../node_modules/@react-native-community/masked-view"
- RNGestureHandler:
- :path: "../node_modules/react-native-gesture-handler"
- RNReanimated:
- :path: "../node_modules/react-native-reanimated"
- RNScreens:
- :path: "../node_modules/react-native-screens"
- Yoga:
- :path: "../node_modules/react-native/ReactCommon/yoga"
-
-SPEC CHECKSUMS:
- boost: a7c83b31436843459a1961bfd74b96033dc77234
- CocoaAsyncSocket: 065fd1e645c7abab64f7a6a2007a48038fdc6a99
- DoubleConversion: 5189b271737e1565bdce30deb4a08d647e3f5f54
- FBLazyVector: c71b8c429a8af2aff1013934a7152e9d9d0c937d
- FBReactNativeSpec: cb0df4f0084281b394f76bb9b4d1d9540f35963f
- Flipper: 26fc4b7382499f1281eb8cb921e5c3ad6de91fe0
- Flipper-Boost-iOSX: fd1e2b8cbef7e662a122412d7ac5f5bea715403c
- Flipper-DoubleConversion: 2dc99b02f658daf147069aad9dbd29d8feb06d30
- Flipper-Fmt: 60cbdd92fc254826e61d669a5d87ef7015396a9b
- Flipper-Folly: 584845625005ff068a6ebf41f857f468decd26b3
- Flipper-Glog: 70c50ce58ddaf67dc35180db05f191692570f446
- Flipper-PeerTalk: 116d8f857dc6ef55c7a5a75ea3ceaafe878aadc9
- Flipper-RSocket: d9d9ade67cbecf6ac10730304bf5607266dd2541
- FlipperKit: cbdee19bdd4e7f05472a66ce290f1b729ba3cb86
- fmt: ff9d55029c625d3757ed641535fd4a75fedc7ce9
- glog: 3d02b25ca00c2d456734d0bcff864cbc62f6ae1a
- hermes-engine: 761a544537e62df2a37189389b9d2654dc1f75af
- libevent: 4049cae6c81cdb3654a443be001fb9bdceff7913
- OpenSSL-Universal: ebc357f1e6bc71fa463ccb2fe676756aff50e88c
- RCT-Folly: b9d9fe1fc70114b751c076104e52f3b1b5e5a95a
- RCTRequired: bd9d2ab0fda10171fcbcf9ba61a7df4dc15a28f4
- RCTTypeSafety: e44e139bf6ec8042db396201834fc2372f6a21cd
- React: 482cd1ba23c471be1aed3800180be2427418d7be
- React-bridging: c2ea4fed6fe4ed27c12fd71e88b5d5d3da107fde
- React-callinvoker: d4d1f98163fb5e35545e910415ef6c04796bb188
- React-Codegen: ff35fb9c7f6ec2ed34fb6de2e1099d88dfb25f2f
- React-Core: 4d3443a45b67c71d74d7243ddde9569d1e4f4fad
- React-CoreModules: 70be25399366b5632ab18ecf6fe444a8165a7bea
- React-cxxreact: 822d3794fc0bf206f4691592f90e086dd4f92228
- React-hermes: 7f67b8363288258c3b0cd4aef5975cb7f0b9549a
- React-jsi: ffa51cbc9a78cc156cf61f79ed52ecb76dc6013b
- React-jsiexecutor: a27badbbdbc0ff781813370736a2d1c7261181d4
- React-jsinspector: 8a3d3f5dcd23a91e8c80b1bf0e96902cd1dca999
- React-logger: 1088859f145b8f6dd0d3ed051a647ef0e3e80fad
- react-native-blur: cad4d93b364f91e7b7931b3fa935455487e5c33c
- react-native-maps: df7b9fca1b1c8d356fadbf5b8a63a5f8cf32fc73
- react-native-pager-view: 95d0418c3c74279840abec6926653d32447bafb6
- react-native-safe-area-context: f98b0b16d1546d208fc293b4661e3f81a895afd9
- React-perflogger: cb386fd44c97ec7f8199c04c12b22066b0f2e1e0
- React-RCTActionSheet: f803a85e46cf5b4066c2ac5e122447f918e9c6e5
- React-RCTAnimation: 19c80fa950ccce7f4db76a2a7f2cf79baae07fc7
- React-RCTBlob: f36ab97e2d515c36df14a1571e50056be80413d5
- React-RCTImage: 2c8f0a329a116248e82f8972ffe806e47c6d1cfa
- React-RCTLinking: 670f0223075aff33be3b89714f1da4f5343fc4af
- React-RCTNetwork: 09385b73f4ff1f46bd5d749540fb33f69a7e5908
- React-RCTSettings: 33b12d3ac7a1f2eba069ec7bd1b84345263b3bbe
- React-RCTText: a1a3ea902403bd9ae4cf6f7960551dc1d25711b5
- React-RCTVibration: 9adb4a3cbb598d1bbd46a05256f445e4b8c70603
- React-runtimeexecutor: 61ee22a8cdf8b6bb2a7fb7b4ba2cc763e5285196
- ReactCommon: 8f67bd7e0a6afade0f20718f859dc8c2275f2e83
- RNCMaskedView: 0e1bc4bfa8365eba5fbbb71e07fbdc0555249489
- RNGestureHandler: bad495418bcbd3ab47017a38d93d290ebd406f50
- RNReanimated: 2cf7451318bb9cc430abeec8d67693f9cf4e039c
- RNScreens: 4a1af06327774490d97342c00aee0c2bafb497b7
- SocketRocket: fccef3f9c5cedea1353a9ef6ada904fde10d6608
- Yoga: ff994563b2fd98c982ca58e8cd9db2cdaf4dda74
- YogaKit: f782866e155069a2cca2517aafea43200b01fd5a
-
-PODFILE CHECKSUM: dbde815ade4cf26d43484f189e9bc934f65a6c92
-
-COCOAPODS: 1.11.3
diff --git a/example/bare/metro.config.js b/example/bare/metro.config.js
deleted file mode 100644
index 2c18e2602..000000000
--- a/example/bare/metro.config.js
+++ /dev/null
@@ -1,50 +0,0 @@
-const path = require('path');
-const fs = require('fs');
-const exclusionList = require('metro-config/src/defaults/exclusionList');
-const escape = require('escape-string-regexp');
-
-const root = path.resolve(__dirname, '../..');
-const rootPak = JSON.parse(
- fs.readFileSync(path.join(root, 'package.json'), 'utf8')
-);
-
-const app = path.join(__dirname, '../app');
-const appPak = JSON.parse(
- fs.readFileSync(path.join(app, 'package.json'), 'utf8')
-);
-
-const modules = [
- '@babel/runtime',
- ...Object.keys({
- ...rootPak.dependencies,
- ...rootPak.peerDependencies,
- ...appPak.devDependencies,
- ...appPak.peerDependencies,
- }),
-];
-
-module.exports = {
- projectRoot: __dirname,
- watchFolders: [root],
-
- resolver: {
- blacklistRE: exclusionList([
- new RegExp(`^${escape(path.join(root, 'node_modules'))}\\/.*$`),
- new RegExp(`^${escape(path.join(app, 'node_modules'))}\\/.*$`),
- ]),
-
- extraNodeModules: modules.reduce((acc, name) => {
- acc[name] = path.join(__dirname, 'node_modules', name);
- return acc;
- }, {}),
- },
-
- transformer: {
- getTransformOptions: async () => ({
- transform: {
- experimentalImportSupport: false,
- inlineRequires: true,
- },
- }),
- },
-};
diff --git a/example/bare/package.json b/example/bare/package.json
deleted file mode 100644
index 183945ee2..000000000
--- a/example/bare/package.json
+++ /dev/null
@@ -1,51 +0,0 @@
-{
- "name": "@gorhom/bottom-sheet-example",
- "description": "Example app for @gorhom/bottom-sheet",
- "version": "0.0.1",
- "private": true,
- "scripts": {
- "android": "react-native run-android",
- "ios": "react-native run-ios",
- "start": "react-native start",
- "postinstall": "npx patch-package"
- },
- "dependencies": {
- "@gorhom/portal": "^1.0.13",
- "@gorhom/showcase-template": "^2.1.0",
- "@react-native-community/blur": "^3.6.0",
- "@react-native-community/masked-view": "0.1.11",
- "@react-navigation/bottom-tabs": "^6.0.9",
- "@react-navigation/elements": "^1.2.1",
- "@react-navigation/material-top-tabs": "^6.0.6",
- "@react-navigation/native": "^6.0.6",
- "@react-navigation/native-stack": "^6.2.5",
- "@react-navigation/stack": "^6.0.11",
- "faker": "^4.1.0",
- "nanoid": "^3.3.3",
- "react": "18.0.0",
- "react-native": "0.69.4",
- "react-native-gesture-handler": "^2.5.0",
- "react-native-maps": "^0.30.1",
- "react-native-pager-view": "^5.4.9",
- "react-native-reanimated": "^2.9.1",
- "react-native-redash": "^16.0.11",
- "react-native-safe-area-context": "4.2.4",
- "react-native-screens": "^3.15.0",
- "react-native-tab-view": "^3.1.1"
- },
- "devDependencies": {
- "@babel/core": "^7.18.0",
- "@babel/runtime": "^7.18.0",
- "@types/faker": "^4.1.12",
- "@types/react": "17.0.2",
- "@types/react-native": "^0.67.7",
- "metro-react-native-babel-preset": "^0.70.3",
- "typescript": "^4.2.4"
- },
- "resolutions": {
- "@babel/core": "^7.18.0",
- "@babel/runtime": "^7.18.0",
- "@types/react": "17.0.2",
- "@types/react-native": "0.67.7"
- }
-}
diff --git a/example/bare/patches/@react-native-community+blur+3.6.0.patch b/example/bare/patches/@react-native-community+blur+3.6.0.patch
deleted file mode 100644
index 7f3e2ef17..000000000
--- a/example/bare/patches/@react-native-community+blur+3.6.0.patch
+++ /dev/null
@@ -1,11 +0,0 @@
-diff --git a/node_modules/@react-native-community/blur/android/build.gradle b/node_modules/@react-native-community/blur/android/build.gradle
-index 8177235..b401cb8 100644
---- a/node_modules/@react-native-community/blur/android/build.gradle
-+++ b/node_modules/@react-native-community/blur/android/build.gradle
-@@ -43,5 +43,5 @@ repositories {
- dependencies {
- //noinspection GradleDynamicVersion
- implementation 'com.facebook.react:react-native:+'
-- implementation 'com.eightbitlab:blurview:1.6.3'
-+ implementation 'com.github.Dimezis:BlurView:version-1.6.6'
- }
diff --git a/example/bare/patches/react-native-gesture-handler+1.10.3._patch b/example/bare/patches/react-native-gesture-handler+1.10.3._patch
deleted file mode 100644
index 8919a2b73..000000000
--- a/example/bare/patches/react-native-gesture-handler+1.10.3._patch
+++ /dev/null
@@ -1,46 +0,0 @@
-diff --git a/node_modules/react-native-gesture-handler/android/lib/src/main/java/com/swmansion/gesturehandler/GestureHandlerOrchestrator.java b/node_modules/react-native-gesture-handler/android/lib/src/main/java/com/swmansion/gesturehandler/GestureHandlerOrchestrator.java
-index f08713b..14f7729 100644
---- a/node_modules/react-native-gesture-handler/android/lib/src/main/java/com/swmansion/gesturehandler/GestureHandlerOrchestrator.java
-+++ b/node_modules/react-native-gesture-handler/android/lib/src/main/java/com/swmansion/gesturehandler/GestureHandlerOrchestrator.java
-@@ -13,6 +13,8 @@ import java.util.Comparator;
-
- import androidx.annotation.Nullable;
-
-+import com.swmansion.gesturehandler.react.RNGestureHandlerRootHelper;
-+
- public class GestureHandlerOrchestrator {
-
- // The limit doesn't necessarily need to exists, it was just simpler to implement it that way
-@@ -513,6 +515,7 @@ public class GestureHandlerOrchestrator {
- }
-
- private static boolean canRunSimultaneously(GestureHandler a, GestureHandler b) {
-+
- return a == b || a.shouldRecognizeSimultaneously(b) || b.shouldRecognizeSimultaneously(a);
- }
-
-@@ -533,6 +536,11 @@ public class GestureHandlerOrchestrator {
- // state, we delegate the decision to the implementation of GestureHandler#shouldBeCancelledBy
- return handler.shouldBeCancelledBy(other);
- }
-+
-+ if (other instanceof RNGestureHandlerRootHelper.RootViewGestureHandler && handler instanceof PanGestureHandler) {
-+ return false;
-+ }
-+
- return true;
- }
-
-diff --git a/node_modules/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerRootHelper.java b/node_modules/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerRootHelper.java
-index 9bf0c8f..8d4e58c 100644
---- a/node_modules/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerRootHelper.java
-+++ b/node_modules/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerRootHelper.java
-@@ -81,7 +81,7 @@ public class RNGestureHandlerRootHelper {
- return mRootView;
- }
-
-- private class RootViewGestureHandler extends GestureHandler {
-+ public class RootViewGestureHandler extends GestureHandler {
- @Override
- protected void onHandle(MotionEvent event) {
- int currentState = getState();
diff --git a/example/bare/patches/react-native-gesture-handler+2.1.0.patch b/example/bare/patches/react-native-gesture-handler+2.1.0.patch
deleted file mode 100644
index ae689c642..000000000
--- a/example/bare/patches/react-native-gesture-handler+2.1.0.patch
+++ /dev/null
@@ -1,48 +0,0 @@
-diff --git a/node_modules/react-native-gesture-handler/android/lib/src/main/java/com/swmansion/gesturehandler/GestureHandlerOrchestrator.kt b/node_modules/react-native-gesture-handler/android/lib/src/main/java/com/swmansion/gesturehandler/GestureHandlerOrchestrator.kt
-index 51be37c..cb507d4 100644
---- a/node_modules/react-native-gesture-handler/android/lib/src/main/java/com/swmansion/gesturehandler/GestureHandlerOrchestrator.kt
-+++ b/node_modules/react-native-gesture-handler/android/lib/src/main/java/com/swmansion/gesturehandler/GestureHandlerOrchestrator.kt
-@@ -5,6 +5,7 @@ import android.graphics.PointF
- import android.view.MotionEvent
- import android.view.View
- import android.view.ViewGroup
-+import com.swmansion.gesturehandler.react.RNGestureHandlerRootHelper
- import java.util.*
-
- class GestureHandlerOrchestrator(
-@@ -546,12 +547,19 @@ class GestureHandlerOrchestrator(
- // in began state
- return false
- }
-- return if (handler !== other &&
-+
-+ if (handler !== other &&
- (handler.isAwaiting || handler.state == GestureHandler.STATE_ACTIVE)) {
- // in every other case as long as the handler is about to be activated or already in active
- // state, we delegate the decision to the implementation of GestureHandler#shouldBeCancelledBy
-- handler.shouldBeCancelledBy(other)
-- } else true
-+ return handler.shouldBeCancelledBy(other)
-+ }
-+
-+ if (other is RNGestureHandlerRootHelper.RootViewGestureHandler && handler is PanGestureHandler) {
-+ return false;
-+ }
-+
-+ return true
- }
-
- private fun isFinished(state: Int) =
-diff --git a/node_modules/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerRootHelper.kt b/node_modules/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerRootHelper.kt
-index 8c20453..dcf54dd 100644
---- a/node_modules/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerRootHelper.kt
-+++ b/node_modules/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerRootHelper.kt
-@@ -53,7 +53,7 @@ class RNGestureHandlerRootHelper(private val context: ReactContext, wrappedView:
- }
- }
-
-- private inner class RootViewGestureHandler : GestureHandler() {
-+ inner class RootViewGestureHandler : GestureHandler() {
- override fun onHandle(event: MotionEvent) {
- val currentState = state
- if (currentState == STATE_UNDETERMINED) {
diff --git a/example/bare/src/App.tsx b/example/bare/src/App.tsx
deleted file mode 100644
index a4ec4c1a2..000000000
--- a/example/bare/src/App.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import React from 'react';
-import { screens } from './screens';
-import { App } from '@gorhom/bottom-sheet-example-app';
-
-export default () => ;
diff --git a/example/bare/src/Dev.tsx b/example/bare/src/Dev.tsx
deleted file mode 100644
index 6146b56e3..000000000
--- a/example/bare/src/Dev.tsx
+++ /dev/null
@@ -1,187 +0,0 @@
-import React, { useCallback, useMemo, useRef, useState } from 'react';
-import { StyleSheet, View, Button } from 'react-native';
-import { DarkTheme, NavigationContainer } from '@react-navigation/native';
-import {
- createBottomTabNavigator,
- useBottomTabBarHeight,
-} from '@react-navigation/bottom-tabs';
-import {
- // BottomSheetBackdrop,
- BottomSheetFlatList,
- BottomSheetModal,
- BottomSheetModalProvider,
-} from '@gorhom/bottom-sheet';
-import Animated, {
- useAnimatedStyle,
- useSharedValue,
-} from 'react-native-reanimated';
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
-import { createContactListMockData } from './utilities';
-import { SearchHandle, ContactItem } from '@gorhom/bottom-sheet-example-app';
-
-const SNAP_POINTS = [300];
-const DATA = createContactListMockData(30);
-
-const keyExtractor = (item: any, index: number) => `${item.name}.${index}`;
-
-const App = () => {
- //#region state
- const bottomSheetRef = useRef(null);
- const [filter, setFilter] = useState('');
- //#endregion
-
- //#region hooks
- const { top: topSafeArea } = useSafeAreaInsets();
- const bottomSafeArea = useBottomTabBarHeight();
- //#endregion
-
- //#region animated values
- const data = useMemo(
- () =>
- filter === '' ? DATA : DATA.filter(item => item.name.includes(filter)),
- [filter]
- );
- const animatedPosition = useSharedValue(0);
- //#endregion
-
- //#region styles
- const positionLineAnimatedStyle = useAnimatedStyle(() => ({
- top: animatedPosition.value,
- }));
- //#endregion
-
- //#region render
- const renderItem = useCallback(
- ({ item, index }) => (
-
- ),
- []
- );
- const renderHandle = useCallback(
- props => (
-
- ),
- // eslint-disable-next-line react-hooks/exhaustive-deps
- []
- );
- return (
-
- bottomSheetRef.current?.present()}
- />
- bottomSheetRef.current?.forceClose()}
- />
- (
- //
- // )}
- handleComponent={renderHandle}
- >
-
-
-
- {SNAP_POINTS.map(snapPoint => (
-
- ))}
-
-
-
-
-
- );
- //#endregion
-};
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: 'center',
- },
- line: {
- position: 'absolute',
- left: 0,
- right: 0,
- height: 1,
- backgroundColor: 'red',
- },
- flatlist: {
- flex: 1,
- },
- flatlistContainer: {
- paddingHorizontal: 24,
- },
- footer: {
- justifyContent: 'center',
- alignItems: 'center',
- marginHorizontal: 12,
- padding: 12,
- marginBottom: 12,
- borderRadius: 24,
- backgroundColor: '#80f',
- },
- footerText: {
- fontSize: 16,
- fontWeight: '600',
- color: '#fff',
- },
-});
-
-const Tab = createBottomTabNavigator();
-
-export default () => (
-
-
-
-
-
-
-
-);
diff --git a/example/bare/src/Perf.tsx b/example/bare/src/Perf.tsx
deleted file mode 100644
index 208a40b28..000000000
--- a/example/bare/src/Perf.tsx
+++ /dev/null
@@ -1,141 +0,0 @@
-import React, {
- useCallback,
- useEffect,
- useMemo,
- useRef,
- useState,
-} from 'react';
-import { SafeAreaView, StyleSheet, Text, View } from 'react-native';
-import BottomSheet from '@gorhom/bottom-sheet';
-import { SafeAreaProvider } from 'react-native-safe-area-context';
-
-const App = () => {
- // state
- const [end, setEnd] = useState(false);
- const [mount, setMount] = useState(false);
- const [showResult, setShowResult] = useState(false);
-
- // ref
- const bottomSheetRef = useRef(null);
-
- // variables
- const snapPoints = useMemo(() => [150, 300, 450], []);
- const initialSnapPoint = useRef(0);
- const startPerfTime = useRef(0);
- const endPerfTime = useRef(0);
-
- // callbacks
- const finishPerformanceTest = useCallback(() => {
- endPerfTime.current = Date.now();
- setShowResult(true);
- }, []);
-
- const handleMountPress = useCallback(() => {
- startPerfTime.current = Date.now();
- setMount(state => !state);
- }, []);
-
- const handleAutoAnimatePress = useCallback(() => {
- // initialSnapPoint.current = -1;
- // handleMountPress();
- let index = 0;
- let loop = 1;
-
- const timer = setInterval(() => {
- if (loop === 4) {
- clearInterval(timer);
- setEnd(state => !state);
- return;
- }
-
- if (index > snapPoints.length - 1) {
- index = 0;
- loop++;
- }
-
- bottomSheetRef.current?.snapToIndex(index++);
- }, 1000);
-
- return () => {
- clearInterval(timer);
- };
- }, [snapPoints]);
-
- // effects
- useEffect(() => {
- const timeout = setTimeout(() => {
- handleMountPress();
- clearTimeout(timeout);
- }, 5000);
-
- const timeout2 = setTimeout(() => {
- handleAutoAnimatePress();
- clearTimeout(timeout2);
- }, 10000);
-
- return () => {
- clearTimeout(timeout);
- clearTimeout(timeout2);
- };
- }, [handleMountPress, handleAutoAnimatePress]);
- // render
- return end ? (
-
- ) : (
-
-
- Bottom Sheet v2 alpha-0
- Reanimated v2 alpha-6
-
- {showResult && (
-
- {endPerfTime.current - startPerfTime.current}ms
-
- )}
-
- {mount && (
-
-
-
- )}
-
-
- );
-};
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- backgroundColor: '#555',
- },
- endContainer: {
- flex: 1,
- backgroundColor: 'red',
- },
- content: {
- flex: 1,
- backgroundColor: 'white',
- },
- buttonContainer: {
- marginHorizontal: 24,
- marginBottom: 6,
- },
- measure: {
- marginHorizontal: 24,
- fontSize: 64,
- fontWeight: 'bold',
- color: 'white',
- },
- version: {
- marginHorizontal: 24,
- marginTop: 12,
- color: 'white',
- fontSize: 20,
- },
-});
-
-export default App;
diff --git a/example/bare/src/components/blurredBackground/BlurredBackground.tsx b/example/bare/src/components/blurredBackground/BlurredBackground.tsx
deleted file mode 100644
index ef0ea0b57..000000000
--- a/example/bare/src/components/blurredBackground/BlurredBackground.tsx
+++ /dev/null
@@ -1,39 +0,0 @@
-import React, { useMemo } from 'react';
-import { Platform, StyleSheet, View } from 'react-native';
-import { BlurView } from '@react-native-community/blur';
-import { useShowcaseTheme } from '@gorhom/showcase-template';
-
-const BlurredBackground = () => {
- const { colors } = useShowcaseTheme();
- const containerStyle = useMemo(
- () => [
- styles.container,
- {
- backgroundColor: colors.background,
- opacity: 0.95,
- },
- ],
- [colors.background]
- );
- return Platform.OS === 'ios' ? (
-
-
-
- ) : (
-
- );
-};
-
-const styles = StyleSheet.create({
- blurView: {
- ...StyleSheet.absoluteFillObject,
- },
- container: {
- ...StyleSheet.absoluteFillObject,
- borderTopLeftRadius: 10,
- borderTopRightRadius: 10,
- overflow: 'hidden',
- },
-});
-
-export default BlurredBackground;
diff --git a/example/bare/src/components/blurredBackground/index.ts b/example/bare/src/components/blurredBackground/index.ts
deleted file mode 100644
index 133f5887f..000000000
--- a/example/bare/src/components/blurredBackground/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './BlurredBackground';
diff --git a/example/bare/src/components/locationDetails/index.ts b/example/bare/src/components/locationDetails/index.ts
deleted file mode 100644
index 5f9d043b1..000000000
--- a/example/bare/src/components/locationDetails/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { LocationDetails, LOCATION_DETAILS_HEIGHT } from './LocationDetails';
diff --git a/example/bare/src/components/locationDetailsHandle/index.ts b/example/bare/src/components/locationDetailsHandle/index.ts
deleted file mode 100644
index 55e79fd2f..000000000
--- a/example/bare/src/components/locationDetailsHandle/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './LocationDetailsHandle';
diff --git a/example/bare/src/components/locationItem/index.ts b/example/bare/src/components/locationItem/index.ts
deleted file mode 100644
index a7bed37ec..000000000
--- a/example/bare/src/components/locationItem/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { LocationItem } from './LocationItem';
diff --git a/example/bare/src/components/weather/Weather.tsx b/example/bare/src/components/weather/Weather.tsx
deleted file mode 100644
index c0fe5d313..000000000
--- a/example/bare/src/components/weather/Weather.tsx
+++ /dev/null
@@ -1,85 +0,0 @@
-import React, { useMemo } from 'react';
-import { Dimensions, StyleSheet } from 'react-native';
-import Animated, {
- Extrapolate,
- interpolate,
- useAnimatedStyle,
-} from 'react-native-reanimated';
-import { ShowcaseLabel, useShowcaseTheme } from '@gorhom/showcase-template';
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
-import { SEARCH_HANDLE_HEIGHT } from '@gorhom/bottom-sheet-example-app';
-import { LOCATION_DETAILS_HEIGHT } from '../locationDetails';
-
-interface WeatherProps {
- animatedPosition: Animated.SharedValue;
- animatedIndex: Animated.SharedValue;
-}
-
-const { height: SCREEN_HEIGHT } = Dimensions.get('window');
-
-const Weather = ({ animatedIndex, animatedPosition }: WeatherProps) => {
- // hooks
- const { colors } = useShowcaseTheme();
- const { bottom: bottomSafeArea } = useSafeAreaInsets();
-
- // styles
- const lockedYPosition = useMemo(
- () =>
- SCREEN_HEIGHT -
- SEARCH_HANDLE_HEIGHT -
- LOCATION_DETAILS_HEIGHT -
- bottomSafeArea,
- [bottomSafeArea]
- );
- const containerAnimatedStyle = useAnimatedStyle(
- () => ({
- transform: [
- {
- translateY:
- animatedPosition.value > lockedYPosition
- ? animatedPosition.value - 24
- : lockedYPosition - 24,
- },
- {
- scale: interpolate(
- animatedIndex.value,
- [1, 1.25],
- [1, 0],
- Extrapolate.CLAMP
- ),
- },
- ],
- }),
- [lockedYPosition]
- );
- const containerStyle = useMemo(
- () => [
- styles.container,
- { backgroundColor: colors.secondaryCard },
- containerAnimatedStyle,
- ],
- [colors.secondaryCard, containerAnimatedStyle]
- );
- return (
-
- ☁️12°
-
- );
-};
-
-const styles = StyleSheet.create({
- container: {
- position: 'absolute',
- right: 12,
- top: 0,
- padding: 2,
- marginTop: 0,
- borderRadius: 4,
- },
- label: {
- fontSize: 16,
- lineHeight: 16,
- },
-});
-
-export default Weather;
diff --git a/example/bare/src/components/weather/index.ts b/example/bare/src/components/weather/index.ts
deleted file mode 100644
index 2a4b8ecc3..000000000
--- a/example/bare/src/components/weather/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './Weather';
diff --git a/example/bare/src/screens/index.ts b/example/bare/src/screens/index.ts
deleted file mode 100644
index 0cd87109f..000000000
--- a/example/bare/src/screens/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { screens } from './screens';
diff --git a/example/bare/src/screens/integrations/MapExample.tsx b/example/bare/src/screens/integrations/MapExample.tsx
deleted file mode 100644
index c57ac688b..000000000
--- a/example/bare/src/screens/integrations/MapExample.tsx
+++ /dev/null
@@ -1,242 +0,0 @@
-import React, {
- useCallback,
- useLayoutEffect,
- useMemo,
- useRef,
- useState,
-} from 'react';
-import { View, StyleSheet, Dimensions } from 'react-native';
-import MapView from 'react-native-maps';
-import {
- useSharedValue,
- useAnimatedStyle,
- useDerivedValue,
-} from 'react-native-reanimated';
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
-import {
- BottomSheetModal,
- BottomSheetScrollView,
- BottomSheetBackdrop,
- TouchableOpacity,
- BottomSheetBackdropProps,
-} from '@gorhom/bottom-sheet';
-import { useHeaderHeight } from '@react-navigation/elements';
-import { createLocationListMockData } from '../../utilities';
-import {
- withModalProvider,
- SearchHandle,
- SEARCH_HANDLE_HEIGHT,
-} from '@gorhom/bottom-sheet-example-app';
-import { LocationItem } from '../../components/locationItem';
-import {
- LocationDetails,
- LOCATION_DETAILS_HEIGHT,
-} from '../../components/locationDetails';
-import LocationDetailsHandle from '../../components/locationDetailsHandle';
-import Weather from '../../components/weather';
-import BlurredBackground from '../../components/blurredBackground';
-import type { Location } from '../../types';
-
-const { height: SCREEN_HEIGHT } = Dimensions.get('window');
-
-const MapExample = () => {
- const [selectedItem, setSelectedItem] = useState();
-
- // refs
- const mapRef = useRef(null);
- const poiListModalRef = useRef(null);
- const poiDetailsModalRef = useRef(null);
-
- // hooks
- const headerHeight = useHeaderHeight();
- const { bottom: bottomSafeArea } = useSafeAreaInsets();
-
- //#region variables
- const data = useMemo(() => createLocationListMockData(15), []);
- const poiListSnapPoints = useMemo(
- () => [
- bottomSafeArea + SEARCH_HANDLE_HEIGHT,
- LOCATION_DETAILS_HEIGHT + bottomSafeArea,
- '100%',
- ],
- [bottomSafeArea]
- );
- const poiDetailsSnapPoints = useMemo(
- () => [
- LOCATION_DETAILS_HEIGHT + bottomSafeArea + SEARCH_HANDLE_HEIGHT,
- '100%',
- ],
- [bottomSafeArea]
- );
- const mapInitialCamera = useMemo(
- () => ({
- center: {
- latitude: 52.3791,
- longitude: 4.9003,
- },
- heading: 0,
- pitch: 0,
- zoom: 0,
- altitude: 40000,
- }),
- []
- );
- //#endregion
-
- //#region animated variables
- const animatedPOIListIndex = useSharedValue(0);
- const animatedPOIListPosition = useSharedValue(SCREEN_HEIGHT);
- const animatedPOIDetailsIndex = useSharedValue(0);
- const animatedPOIDetailsPosition = useSharedValue(SCREEN_HEIGHT);
-
- const weatherAnimatedIndex = useDerivedValue(() =>
- animatedPOIListIndex.value > animatedPOIDetailsIndex.value
- ? animatedPOIListIndex.value
- : animatedPOIDetailsIndex.value
- );
- const weatherAnimatedPosition = useDerivedValue(() =>
- animatedPOIListPosition.value < animatedPOIDetailsPosition.value
- ? animatedPOIListPosition.value
- : animatedPOIDetailsPosition.value
- );
- //#endregion
-
- //#region callbacks
- const handleTouchStart = useCallback(() => {
- poiListModalRef.current?.collapse();
- }, []);
- const handleCloseLocationDetails = useCallback(() => {
- setSelectedItem(undefined);
- poiDetailsModalRef.current?.dismiss();
- }, []);
- const handlePresentLocationDetails = useCallback((item: Location) => {
- setSelectedItem(item);
- poiDetailsModalRef.current?.present();
- }, []);
- //#endregion
-
- //#region styles
- const scrollViewAnimatedStyle = useAnimatedStyle(() => ({
- opacity: animatedPOIListIndex.value,
- }));
- const scrollViewStyle = useMemo(
- () => [styles.scrollView, scrollViewAnimatedStyle],
- [scrollViewAnimatedStyle]
- );
- const scrollViewContentContainer = useMemo(
- () => [
- styles.scrollViewContentContainer,
- { paddingBottom: bottomSafeArea },
- ],
- [bottomSafeArea]
- );
- //#endregion
-
- //#region effects
- useLayoutEffect(() => {
- requestAnimationFrame(() => poiListModalRef.current?.present());
- }, []);
- //#endregion
-
- // renders
- const renderItem = useCallback(
- (item, index) => (
- handlePresentLocationDetails(item)}
- >
-
-
- ),
- [handlePresentLocationDetails]
- );
- const renderBackdrop = useCallback(
- (props: BottomSheetBackdropProps) => (
-
- ),
- []
- );
-
- return (
-
-
-
-
-
- {data.map(renderItem)}
-
-
-
-
-
-
-
- );
-};
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- padding: 24,
- },
- mapContainer: {
- ...StyleSheet.absoluteFillObject,
- },
- scrollView: {
- flex: 1,
- },
- scrollViewContentContainer: {
- paddingHorizontal: 16,
- },
-});
-
-export default withModalProvider(MapExample);
diff --git a/example/bare/src/screens/screens.ts b/example/bare/src/screens/screens.ts
deleted file mode 100644
index b07bc3ffb..000000000
--- a/example/bare/src/screens/screens.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-import type { ShowcaseExampleScreenType } from '@gorhom/showcase-template';
-
-export const screens = [
- {
- title: 'Third Party Integration',
- data: [
- {
- name: 'React Navigation',
- slug: 'Integrations/NavigatorExample',
- getScreen: () => require('./integrations/NavigatorExample').default,
- },
- {
- name: 'React Native Screens',
- slug: 'Integrations/NativeScreensExample',
- getScreen: () => require('./integrations/NativeScreensExample').default,
- },
- {
- name: 'View Pager',
- slug: 'Integrations/ViewPagerExample',
- getScreen: () => require('./integrations/ViewPagerExample').default,
- },
- {
- name: 'Map',
- slug: 'Integrations/MapExample',
- getScreen: () => require('./integrations/MapExample').default,
- screenOptions: {
- headerTintColor: 'black',
- headerTransparent: true,
- },
- },
- ] as ShowcaseExampleScreenType[],
- },
-];
diff --git a/example/bare/src/types.d.ts b/example/bare/src/types.d.ts
deleted file mode 100644
index 482ad62be..000000000
--- a/example/bare/src/types.d.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-export type Contact = {
- name: string;
- jobTitle: string;
- address: string;
-};
-
-export type Location = {
- id: string;
- name: string;
- address: string;
- photos: string[];
-};
diff --git a/example/bare/src/utilities/createMockData.ts b/example/bare/src/utilities/createMockData.ts
deleted file mode 100644
index 96fd1d979..000000000
--- a/example/bare/src/utilities/createMockData.ts
+++ /dev/null
@@ -1,48 +0,0 @@
-import Faker from 'faker';
-import { Dimensions } from 'react-native';
-import type { Contact, Location } from '../types';
-
-const { width: SCREEN_WIDTH } = Dimensions.get('screen');
-
-export const createContactListMockData = (count: number = 20): Contact[] => {
- return new Array(count).fill(0).map(() => ({
- name: `${Faker.name.firstName()} ${Faker.name.lastName()}`,
- address: `${Faker.address.city()}, ${Faker.address.country()}`,
- jobTitle: Faker.name.jobTitle(),
- }));
-};
-
-export const createContactSectionsMockData = (count: number = 20) => {
- return new Array(Math.round(count / 4)).fill(0).map(() => ({
- title: Faker.address.country(),
- data: new Array(Math.round(count / 4)).fill(0).map(() => ({
- name: `${Faker.name.firstName()} ${Faker.name.lastName()}`,
- address: `${Faker.address.city()}, ${Faker.address.country()}`,
- jobTitle: Faker.name.jobTitle(),
- })),
- }));
-};
-
-export const createLocationListMockData = (count: number = 50): Location[] => {
- return [
- {
- id: 'ams',
- name: 'Amsterdam',
- address: 'North Holland, Netherlands',
- photos: [
- 'https://www.infocusclinical.com/wp-content/uploads/2020/02/summer-amsterdam-FP.jpg',
- 'https://images.theconversation.com/files/162459/original/image-20170325-12162-1tfrmbb.jpg?ixlib=rb-1.1.0&q=45&auto=format&w=200&fit=clip',
- 'https://www.kevinandamanda.com/wp-content/uploads/2014/09/amsterdam-2014-03.jpg',
- 'https://specials-images.forbesimg.com/imageserve/5de4a1db755ebf0006fbea42/960x0.jpg?cropX1=0&cropX2=2121&cropY1=0&cropY2=1414',
- ],
- },
- ...new Array(count).fill(0).map((_, index) => ({
- id: Faker.random.alphaNumeric(6),
- name: `${Faker.address.city()}`,
- address: `${Faker.address.state()}, ${Faker.address.country()}`,
- photos: Array(5)
- .fill(0)
- .map((__, _index) => Faker.image.city(SCREEN_WIDTH + index + _index)),
- })),
- ];
-};
diff --git a/example/bare/src/utilities/index.ts b/example/bare/src/utilities/index.ts
deleted file mode 100644
index 8b9c15b89..000000000
--- a/example/bare/src/utilities/index.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-export {
- createContactListMockData,
- createContactSectionsMockData,
- createLocationListMockData,
-} from './createMockData';
-export { transformOrigin } from './transformOrigin';
diff --git a/example/bare/src/utilities/transformOrigin.ts b/example/bare/src/utilities/transformOrigin.ts
deleted file mode 100644
index a0d2c3811..000000000
--- a/example/bare/src/utilities/transformOrigin.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-// @ts-ignore
-export const transformOrigin = ({ x, y }, ...transformations) => {
- 'worklet';
- return [
- { translateX: x },
- { translateY: y },
- ...transformations,
- { translateX: x * -1 },
- { translateY: y * -1 },
- ];
-};
diff --git a/example/bare/tsconfig.json b/example/bare/tsconfig.json
deleted file mode 100644
index 689583a0e..000000000
--- a/example/bare/tsconfig.json
+++ /dev/null
@@ -1,28 +0,0 @@
-{
- "compilerOptions": {
- "baseUrl": ".",
- "paths": {
- "@gorhom/bottom-sheet": ["../../src/index"],
- "@gorhom/bottom-sheet-example-app": ["../app/src/index"]
- },
- "allowUnreachableCode": false,
- "allowUnusedLabels": false,
- "esModuleInterop": true,
- "forceConsistentCasingInFileNames": true,
- "jsx": "react",
- "lib": ["esnext"],
- "module": "esnext",
- "moduleResolution": "node",
- "noFallthroughCasesInSwitch": true,
- "noImplicitReturns": true,
- "noImplicitUseStrict": false,
- "noStrictGenericChecks": false,
- "noUnusedLocals": true,
- "noUnusedParameters": true,
- "resolveJsonModule": true,
- "skipLibCheck": true,
- "strict": true,
- "target": "esnext"
- },
- "include": ["src"]
-}
diff --git a/example/expo/.gitignore b/example/expo/.gitignore
deleted file mode 100644
index ec8a36a25..000000000
--- a/example/expo/.gitignore
+++ /dev/null
@@ -1,14 +0,0 @@
-node_modules/
-.expo/
-dist/
-npm-debug.*
-*.jks
-*.p8
-*.p12
-*.key
-*.mobileprovision
-*.orig.*
-web-build/
-
-# macOS
-.DS_Store
diff --git a/example/expo/app.json b/example/expo/app.json
deleted file mode 100644
index fca2a6076..000000000
--- a/example/expo/app.json
+++ /dev/null
@@ -1,32 +0,0 @@
-{
- "expo": {
- "name": "BottomSheetExample",
- "slug": "BottomSheetExample",
- "version": "1.0.0",
- "orientation": "portrait",
- "icon": "./assets/icon.png",
- "entryPoint": "./index.ts",
- "userInterfaceStyle": "light",
- "splash": {
- "image": "./assets/splash.png",
- "resizeMode": "contain",
- "backgroundColor": "#ffffff"
- },
- "updates": {
- "fallbackToCacheTimeout": 0
- },
- "assetBundlePatterns": ["**/*"],
- "ios": {
- "supportsTablet": true
- },
- "android": {
- "adaptiveIcon": {
- "foregroundImage": "./assets/adaptive-icon.png",
- "backgroundColor": "#FFFFFF"
- }
- },
- "web": {
- "favicon": "./assets/favicon.png"
- }
- }
-}
diff --git a/example/expo/assets/adaptive-icon.png b/example/expo/assets/adaptive-icon.png
deleted file mode 100644
index 03d6f6b6c..000000000
Binary files a/example/expo/assets/adaptive-icon.png and /dev/null differ
diff --git a/example/expo/assets/favicon.png b/example/expo/assets/favicon.png
deleted file mode 100644
index e75f697b1..000000000
Binary files a/example/expo/assets/favicon.png and /dev/null differ
diff --git a/example/expo/assets/icon.png b/example/expo/assets/icon.png
deleted file mode 100644
index a0b1526fc..000000000
Binary files a/example/expo/assets/icon.png and /dev/null differ
diff --git a/example/expo/assets/splash.png b/example/expo/assets/splash.png
deleted file mode 100644
index 0e89705a9..000000000
Binary files a/example/expo/assets/splash.png and /dev/null differ
diff --git a/example/expo/babel.config.js b/example/expo/babel.config.js
deleted file mode 100644
index 8c702fa88..000000000
--- a/example/expo/babel.config.js
+++ /dev/null
@@ -1,33 +0,0 @@
-const path = require('path');
-const fs = require('fs');
-
-const root = path.resolve(__dirname, '../..');
-const rootPak = JSON.parse(
- fs.readFileSync(path.join(root, 'package.json'), 'utf8')
-);
-
-const app = path.join(__dirname, '../app');
-const appPak = JSON.parse(
- fs.readFileSync(path.join(app, 'package.json'), 'utf8')
-);
-
-module.exports = function (api) {
- api.cache(true);
- return {
- presets: ['babel-preset-expo'],
- plugins: [
- 'react-native-reanimated/plugin',
- [
- 'module-resolver',
- {
- extensions: ['.tsx', '.ts', '.js', '.json'],
- alias: {
- // For development, we want to alias the library to the source
- [rootPak.name]: path.join(root, rootPak['react-native']),
- [appPak.name]: path.join(app, appPak['react-native']),
- },
- },
- ],
- ],
- };
-};
diff --git a/example/expo/index.ts b/example/expo/index.ts
deleted file mode 100644
index d70a55804..000000000
--- a/example/expo/index.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { registerRootComponent } from 'expo';
-
-import { enableScreens } from 'react-native-screens';
-enableScreens(true);
-
-// @ts-ignore
-import { enableLogging } from '@gorhom/bottom-sheet';
-enableLogging();
-
-import App from './src/App';
-
-registerRootComponent(App);
diff --git a/example/expo/metro.config.js b/example/expo/metro.config.js
deleted file mode 100644
index 24ccdc29b..000000000
--- a/example/expo/metro.config.js
+++ /dev/null
@@ -1,52 +0,0 @@
-const path = require('path');
-const fs = require('fs');
-const exclusionList = require('metro-config/src/defaults/exclusionList');
-const escape = require('escape-string-regexp');
-
-const root = path.resolve(__dirname, '../..');
-const rootPak = JSON.parse(
- fs.readFileSync(path.join(root, 'package.json'), 'utf8')
-);
-
-const app = path.join(__dirname, '../app');
-const appPak = JSON.parse(
- fs.readFileSync(path.join(app, 'package.json'), 'utf8')
-);
-
-const modules = [
- '@babel/runtime',
- ...Object.keys({
- ...rootPak.dependencies,
- ...rootPak.peerDependencies,
- ...appPak.devDependencies,
- ...appPak.peerDependencies,
- }),
-];
-
-module.exports = {
- projectRoot: __dirname,
- watchFolders: [root],
-
- // We need to make sure that only one version is loaded for peerDependencies
- // So we blacklist them at the root, and alias them to the versions in example's node_modules
- resolver: {
- blacklistRE: exclusionList([
- new RegExp(`^${escape(path.join(root, 'node_modules'))}\\/.*$`),
- new RegExp(`^${escape(path.join(app, 'node_modules'))}\\/.*$`),
- ]),
-
- extraNodeModules: modules.reduce((acc, name) => {
- acc[name] = path.join(__dirname, 'node_modules', name);
- return acc;
- }, {}),
- },
-
- transformer: {
- getTransformOptions: async () => ({
- transform: {
- experimentalImportSupport: false,
- inlineRequires: true,
- },
- }),
- },
-};
diff --git a/example/expo/package.json b/example/expo/package.json
deleted file mode 100644
index 521b9a090..000000000
--- a/example/expo/package.json
+++ /dev/null
@@ -1,54 +0,0 @@
-{
- "name": "@gorhom/bottom-sheet-example-expo",
- "description": "Example app for @gorhom/bottom-sheet",
- "version": "0.0.1",
- "private": true,
- "main": "./index.ts",
- "scripts": {
- "start": "expo start",
- "android": "expo start --android",
- "ios": "expo start --ios",
- "web": "expo start --web",
- "eject": "expo eject"
- },
- "dependencies": {
- "@gorhom/portal": "^1.0.13",
- "@gorhom/showcase-template": "^2.1.0",
- "@react-navigation/bottom-tabs": "^6.3.1",
- "@react-navigation/elements": "^1.3.3",
- "@react-navigation/material-top-tabs": "^6.2.1",
- "@react-navigation/native": "^6.0.10",
- "@react-navigation/native-stack": "^6.6.2",
- "@react-navigation/stack": "^6.2.1",
- "expo": "^46.0.0",
- "expo-status-bar": "~1.4.0",
- "faker": "^4.1.0",
- "nanoid": "^3.3.3",
- "react": "18.0.0",
- "react-dom": "18.0.0",
- "react-native": "0.69.4",
- "react-native-gesture-handler": "~2.5.0",
- "react-native-pager-view": "5.4.24",
- "react-native-reanimated": "~2.9.1",
- "react-native-redash": "^16.2.4",
- "react-native-safe-area-context": "4.3.1",
- "react-native-screens": "~3.15.0",
- "react-native-tab-view": "^3.1.1",
- "react-native-web": "~0.18.7"
- },
- "devDependencies": {
- "@babel/core": "^7.18.6",
- "@types/react": "~18.0.0",
- "@types/react-native": "~0.69.1",
- "babel-plugin-module-resolver": "^4.1.0",
- "expo-cli": "^6.0.2",
- "typescript": "^4.6.3"
- },
- "resolutions": {
- "@babel/core": "^7.18.0",
- "@babel/runtime": "^7.18.0",
- "@babel/preset-typescript": "7.17.12",
- "@types/react": "17.0.2",
- "@types/react-native": "0.67.7"
- }
-}
diff --git a/example/expo/src/App.tsx b/example/expo/src/App.tsx
deleted file mode 100644
index 3098080c5..000000000
--- a/example/expo/src/App.tsx
+++ /dev/null
@@ -1,4 +0,0 @@
-import React from 'react';
-import { App } from '@gorhom/bottom-sheet-example-app';
-
-export default () => ;
diff --git a/example/expo/tsconfig.json b/example/expo/tsconfig.json
deleted file mode 100644
index b5074aade..000000000
--- a/example/expo/tsconfig.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
- "extends": "expo/tsconfig.base",
- "compilerOptions": {
- "paths": {
- "@gorhom/bottom-sheet": ["../../src/index"],
- "@gorhom/bottom-sheet-example-app": ["../app/src/index"]
- },
- "strict": true
- }
-}
diff --git a/example/expo/webpack.config.js b/example/expo/webpack.config.js
deleted file mode 100644
index 3bbbfe4d9..000000000
--- a/example/expo/webpack.config.js
+++ /dev/null
@@ -1,32 +0,0 @@
-const path = require('path');
-const createExpoWebpackConfigAsync = require('@expo/webpack-config');
-const { resolver } = require('./metro.config');
-
-const root = path.resolve(__dirname, '../..');
-const app = path.resolve(__dirname, '../app');
-const node_modules = path.join(__dirname, 'node_modules');
-
-module.exports = async function (env, argv) {
- const config = await createExpoWebpackConfigAsync(env, argv);
-
- config.module.rules.push({
- test: /\.(js|jsx|ts|tsx)$/,
- include: path.resolve(root, 'src'),
- use: 'babel-loader',
- });
-
- config.module.rules.push({
- test: /\.(js|jsx|ts|tsx)$/,
- include: path.resolve(app, 'src'),
- use: 'babel-loader',
- });
-
- // We need to make sure that only one version is loaded for peerDependencies
- // So we alias them to the versions in example's node_modules
- Object.assign(config.resolve.alias, {
- ...resolver.extraNodeModules,
- 'react-native-web': path.join(node_modules, 'react-native-web'),
- });
-
- return config;
-};
diff --git a/example/metro.config.js b/example/metro.config.js
new file mode 100644
index 000000000..75ba24c3e
--- /dev/null
+++ b/example/metro.config.js
@@ -0,0 +1,18 @@
+// Learn more https://docs.expo.io/guides/customizing-metro
+const { getDefaultConfig } = require('expo/metro-config');
+const path = require('path');
+
+// Find the project and workspace directories
+const projectRoot = __dirname;
+// This can be replaced with `find-yarn-workspace-root`
+const workspaceRoot = path.resolve(projectRoot, '..');
+
+/** @type {import('expo/metro-config').MetroConfig} */
+const config = getDefaultConfig(__dirname);
+
+config.watchFolders = [workspaceRoot];
+config.resolver.nodeModulesPaths = [path.resolve(projectRoot, 'node_modules')];
+
+config.resolver.disableHierarchicalLookup = true;
+
+module.exports = config;
diff --git a/example/package.json b/example/package.json
new file mode 100644
index 000000000..46017f5d1
--- /dev/null
+++ b/example/package.json
@@ -0,0 +1,46 @@
+{
+ "name": "@gorhom/bottomsheet-example",
+ "version": "5.0.0",
+ "main": "node_modules/expo/AppEntry.js",
+ "scripts": {
+ "start": "expo start",
+ "android": "expo start --android",
+ "ios": "expo start --ios",
+ "web": "expo start --web"
+ },
+ "dependencies": {
+ "@expo/webpack-config": "~19.0.1",
+ "@gorhom/portal": "^1.0.14",
+ "@gorhom/showcase-template": "^3.0.2",
+ "@react-navigation/material-top-tabs": "^6.6.5",
+ "@react-navigation/native": "^6.1.9",
+ "@react-navigation/native-stack": "^6.9.17",
+ "@react-navigation/stack": "^6.3.20",
+ "expo": "50.0.7",
+ "expo-blur": "~12.9.2",
+ "expo-status-bar": "~1.11.1",
+ "react": "18.2.0",
+ "react-dom": "18.2.0",
+ "react-native": "0.73.4",
+ "react-native-gesture-handler": "~2.14.0",
+ "react-native-maps": "1.10.0",
+ "react-native-pager-view": "6.2.3",
+ "react-native-reanimated": "~3.6.2",
+ "react-native-redash": "^18.1.0",
+ "react-native-safe-area-context": "4.8.2",
+ "react-native-screens": "~3.29.0",
+ "react-native-tab-view": "^3.5.2",
+ "react-native-web": "~0.19.6"
+ },
+ "devDependencies": {
+ "@babel/core": "^7.20.0",
+ "@babel/plugin-proposal-export-namespace-from": "^7.18.9",
+ "@types/faker": "^4.1.12",
+ "@types/react": "~18.2.45",
+ "@types/react-native": "^0.73.0",
+ "babel-plugin-module-resolver": "^5.0.0",
+ "faker": "^4.1.0",
+ "typescript": "^5.3.0"
+ },
+ "private": true
+}
diff --git a/example/src/Dev.tsx b/example/src/Dev.tsx
new file mode 100644
index 000000000..804684364
--- /dev/null
+++ b/example/src/Dev.tsx
@@ -0,0 +1,65 @@
+import React, { useCallback, useMemo, useRef } from 'react';
+import { View, Text, StyleSheet } from 'react-native';
+import BottomSheet, { BottomSheetView } from '@gorhom/bottom-sheet';
+import {
+ SafeAreaProvider,
+ useSafeAreaInsets,
+} from 'react-native-safe-area-context';
+
+const App = () => {
+ //#region ref
+ const bottomSheetRef = useRef(null);
+ //#endregion
+
+ //#region hooks
+ const { bottom: bottomSafeArea } = useSafeAreaInsets();
+ //#endregion
+
+ //#region callbacks
+ const handleSheetChanges = useCallback((index: number) => {
+ // eslint-disable-next-line no-console
+ console.log('handleSheetChanges', index);
+ }, []);
+ //#endregion
+
+ //#region styles
+ const contentContainerStyle = useMemo(
+ () => ({
+ ...styles.contentContainer,
+ paddingBottom: bottomSafeArea,
+ }),
+ [bottomSafeArea]
+ );
+ //#endregion
+
+ // renders
+ return (
+
+
+
+ Awesome 🎉
+
+
+
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ padding: 24,
+ backgroundColor: 'grey',
+ },
+ contentContainer: {
+ flex: 1,
+ alignItems: 'center',
+ justifyContent: 'center',
+ minHeight: 200,
+ },
+});
+
+export default () => (
+
+
+
+);
diff --git a/example/src/Main.tsx b/example/src/Main.tsx
new file mode 100644
index 000000000..760aa3d8d
--- /dev/null
+++ b/example/src/Main.tsx
@@ -0,0 +1,19 @@
+import React from 'react';
+import { ShowcaseApp } from '@gorhom/showcase-template';
+import { screens } from './screens';
+import { version, description } from '../../package.json';
+
+const author = {
+ username: 'Mo Gorhom',
+ url: 'https://gorhom.dev',
+};
+
+export default () => (
+
+);
diff --git a/example/app/src/components/button/Button.tsx b/example/src/components/button/Button.tsx
similarity index 100%
rename from example/app/src/components/button/Button.tsx
rename to example/src/components/button/Button.tsx
diff --git a/example/app/src/components/button/index.ts b/example/src/components/button/index.ts
similarity index 100%
rename from example/app/src/components/button/index.ts
rename to example/src/components/button/index.ts
diff --git a/example/app/src/components/contactItem/ContactItem.tsx b/example/src/components/contactItem/ContactItem.tsx
similarity index 100%
rename from example/app/src/components/contactItem/ContactItem.tsx
rename to example/src/components/contactItem/ContactItem.tsx
diff --git a/example/app/src/components/contactItem/index.ts b/example/src/components/contactItem/index.ts
similarity index 100%
rename from example/app/src/components/contactItem/index.ts
rename to example/src/components/contactItem/index.ts
diff --git a/example/app/src/components/contactList/ContactList.tsx b/example/src/components/contactList/ContactList.tsx
similarity index 99%
rename from example/app/src/components/contactList/ContactList.tsx
rename to example/src/components/contactList/ContactList.tsx
index cd945cd61..18707d3df 100644
--- a/example/app/src/components/contactList/ContactList.tsx
+++ b/example/src/components/contactList/ContactList.tsx
@@ -93,7 +93,7 @@ const ContactListComponent = ({
[type, onItemPress]
);
const renderSectionHeader = useCallback(
- ({ section }) => (
+ ({ section }: any) => (
{section.title}
diff --git a/example/app/src/components/contactList/index.ts b/example/src/components/contactList/index.ts
similarity index 100%
rename from example/app/src/components/contactList/index.ts
rename to example/src/components/contactList/index.ts
diff --git a/example/app/src/components/contactList/styles.ts b/example/src/components/contactList/styles.ts
similarity index 100%
rename from example/app/src/components/contactList/styles.ts
rename to example/src/components/contactList/styles.ts
diff --git a/example/app/src/components/contactList/styles.web.ts b/example/src/components/contactList/styles.web.ts
similarity index 93%
rename from example/app/src/components/contactList/styles.web.ts
rename to example/src/components/contactList/styles.web.ts
index b4f6f8ff0..44e5b1e37 100644
--- a/example/app/src/components/contactList/styles.web.ts
+++ b/example/src/components/contactList/styles.web.ts
@@ -9,10 +9,10 @@ export const styles = StyleSheet.create({
sectionHeaderTitle: {
fontSize: 16,
textTransform: 'uppercase',
+ color: 'black',
},
container: {
flex: 1,
- paddingHorizontal: 16,
},
contentContainer: {
paddingHorizontal: 16,
diff --git a/example/app/src/components/customBackground/CustomBackground.tsx b/example/src/components/customBackground/CustomBackground.tsx
similarity index 100%
rename from example/app/src/components/customBackground/CustomBackground.tsx
rename to example/src/components/customBackground/CustomBackground.tsx
diff --git a/example/app/src/components/customBackground/index.ts b/example/src/components/customBackground/index.ts
similarity index 100%
rename from example/app/src/components/customBackground/index.ts
rename to example/src/components/customBackground/index.ts
diff --git a/example/app/src/components/customFooter/CustomFooter.tsx b/example/src/components/customFooter/CustomFooter.tsx
similarity index 84%
rename from example/app/src/components/customFooter/CustomFooter.tsx
rename to example/src/components/customFooter/CustomFooter.tsx
index ac9fbfa66..5772381be 100644
--- a/example/app/src/components/customFooter/CustomFooter.tsx
+++ b/example/src/components/customFooter/CustomFooter.tsx
@@ -1,11 +1,10 @@
import React, { memo, useCallback, useMemo } from 'react';
-import { StyleSheet } from 'react-native';
+import { Pressable, StyleSheet } from 'react-native';
import {
BottomSheetFooter,
BottomSheetFooterProps,
useBottomSheet,
} from '@gorhom/bottom-sheet';
-import { RectButton } from 'react-native-gesture-handler';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import Animated, {
Extrapolate,
@@ -14,7 +13,7 @@ import Animated, {
} from 'react-native-reanimated';
import { toRad } from 'react-native-redash';
-const AnimatedRectButton = Animated.createAnimatedComponent(RectButton);
+const AnimatedRectButton = Animated.createAnimatedComponent(Pressable);
interface CustomFooterProps extends BottomSheetFooterProps {}
@@ -37,22 +36,19 @@ const CustomFooterComponent = ({
return {
transform: [{ rotate: `${arrowRotate}rad` }],
};
- }, []);
+ });
const arrowStyle = useMemo(
() => [arrowAnimatedStyle, styles.arrow],
[arrowAnimatedStyle]
);
- const containerAnimatedStyle = useAnimatedStyle(
- () => ({
- opacity: interpolate(
- animatedIndex.value,
- [-0.85, 0],
- [0, 1],
- Extrapolate.CLAMP
- ),
- }),
- [animatedIndex]
- );
+ const containerAnimatedStyle = useAnimatedStyle(() => ({
+ opacity: interpolate(
+ animatedIndex.value,
+ [-0.85, 0],
+ [0, 1],
+ Extrapolate.CLAMP
+ ),
+ }));
const containerStyle = useMemo(
() => [containerAnimatedStyle, styles.container],
[containerAnimatedStyle]
diff --git a/example/app/src/components/customFooter/index.ts b/example/src/components/customFooter/index.ts
similarity index 100%
rename from example/app/src/components/customFooter/index.ts
rename to example/src/components/customFooter/index.ts
diff --git a/example/app/src/components/customHandle/CustomHandle.tsx b/example/src/components/customHandle/CustomHandle.tsx
similarity index 100%
rename from example/app/src/components/customHandle/CustomHandle.tsx
rename to example/src/components/customHandle/CustomHandle.tsx
diff --git a/example/app/src/components/customHandle/index.ts b/example/src/components/customHandle/index.ts
similarity index 100%
rename from example/app/src/components/customHandle/index.ts
rename to example/src/components/customHandle/index.ts
diff --git a/example/app/src/components/headerHandle/HeaderHandle.tsx b/example/src/components/headerHandle/HeaderHandle.tsx
similarity index 100%
rename from example/app/src/components/headerHandle/HeaderHandle.tsx
rename to example/src/components/headerHandle/HeaderHandle.tsx
diff --git a/example/app/src/components/headerHandle/index.ts b/example/src/components/headerHandle/index.ts
similarity index 100%
rename from example/app/src/components/headerHandle/index.ts
rename to example/src/components/headerHandle/index.ts
diff --git a/example/app/src/components/searchHandle/SearchHandle.tsx b/example/src/components/searchHandle/SearchHandle.tsx
similarity index 100%
rename from example/app/src/components/searchHandle/SearchHandle.tsx
rename to example/src/components/searchHandle/SearchHandle.tsx
diff --git a/example/app/src/components/searchHandle/index.ts b/example/src/components/searchHandle/index.ts
similarity index 100%
rename from example/app/src/components/searchHandle/index.ts
rename to example/src/components/searchHandle/index.ts
diff --git a/example/app/src/screens/advanced/BackdropExample.tsx b/example/src/screens/advanced/BackdropExample.tsx
similarity index 100%
rename from example/app/src/screens/advanced/BackdropExample.tsx
rename to example/src/screens/advanced/BackdropExample.tsx
diff --git a/example/app/src/screens/advanced/CustomBackgroundExample.tsx b/example/src/screens/advanced/CustomBackgroundExample.tsx
similarity index 100%
rename from example/app/src/screens/advanced/CustomBackgroundExample.tsx
rename to example/src/screens/advanced/CustomBackgroundExample.tsx
diff --git a/example/app/src/screens/advanced/CustomHandleExample.tsx b/example/src/screens/advanced/CustomHandleExample.tsx
similarity index 100%
rename from example/app/src/screens/advanced/CustomHandleExample.tsx
rename to example/src/screens/advanced/CustomHandleExample.tsx
diff --git a/example/app/src/screens/advanced/CustomThemeExample.tsx b/example/src/screens/advanced/CustomThemeExample.tsx
similarity index 100%
rename from example/app/src/screens/advanced/CustomThemeExample.tsx
rename to example/src/screens/advanced/CustomThemeExample.tsx
diff --git a/example/app/src/screens/advanced/DynamicSnapPointExample.tsx b/example/src/screens/advanced/DynamicSnapPointExample.tsx
similarity index 82%
rename from example/app/src/screens/advanced/DynamicSnapPointExample.tsx
rename to example/src/screens/advanced/DynamicSnapPointExample.tsx
index fb9340225..724818918 100644
--- a/example/app/src/screens/advanced/DynamicSnapPointExample.tsx
+++ b/example/src/screens/advanced/DynamicSnapPointExample.tsx
@@ -2,7 +2,7 @@ import React, { useCallback, useMemo, useRef, useState } from 'react';
import { View, StyleSheet, Text } from 'react-native';
import BottomSheet, {
BottomSheetView,
- useBottomSheetDynamicSnapPoints,
+ SNAP_POINT_TYPE,
} from '@gorhom/bottom-sheet';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { Button } from '../../components/button';
@@ -10,19 +10,12 @@ import { Button } from '../../components/button';
const DynamicSnapPointExample = () => {
// state
const [count, setCount] = useState(0);
- const initialSnapPoints = useMemo(() => ['CONTENT_HEIGHT'], []);
// hooks
const { bottom: safeBottomArea } = useSafeAreaInsets();
const bottomSheetRef = useRef(null);
- const {
- animatedHandleHeight,
- animatedSnapPoints,
- animatedContentHeight,
- handleContentLayout,
- } = useBottomSheetDynamicSnapPoints(initialSnapPoints);
- // callbacks
+ //#region callbacks
const handleIncreaseContentPress = useCallback(() => {
setCount(state => state + 1);
}, []);
@@ -35,8 +28,16 @@ const DynamicSnapPointExample = () => {
const handleClosePress = useCallback(() => {
bottomSheetRef.current?.close();
}, []);
+ const handleSheetChange = useCallback(
+ (index: number, position: number, type: SNAP_POINT_TYPE) => {
+ // eslint-disable-next-line no-console
+ console.log('handleSheetChange', { index, position, type });
+ },
+ []
+ );
+ //#endregion
- // styles
+ //#region styles
const contentContainerStyle = useMemo(
() => [
styles.contentContainerStyle,
@@ -51,6 +52,7 @@ const DynamicSnapPointExample = () => {
}),
[count]
);
+ //#endregion
// renders
return (
@@ -59,16 +61,12 @@ const DynamicSnapPointExample = () => {
-
+
Could this sheet resize to its content height ?
diff --git a/example/app/src/screens/advanced/FooterExample.tsx b/example/src/screens/advanced/FooterExample.tsx
similarity index 100%
rename from example/app/src/screens/advanced/FooterExample.tsx
rename to example/src/screens/advanced/FooterExample.tsx
diff --git a/example/app/src/screens/advanced/KeyboardHandlingExample.tsx b/example/src/screens/advanced/KeyboardHandlingExample.tsx
similarity index 100%
rename from example/app/src/screens/advanced/KeyboardHandlingExample.tsx
rename to example/src/screens/advanced/KeyboardHandlingExample.tsx
diff --git a/example/app/src/screens/advanced/PullToRefreshExample.tsx b/example/src/screens/advanced/PullToRefreshExample.tsx
similarity index 100%
rename from example/app/src/screens/advanced/PullToRefreshExample.tsx
rename to example/src/screens/advanced/PullToRefreshExample.tsx
diff --git a/example/app/src/screens/advanced/ShadowExample.tsx b/example/src/screens/advanced/ShadowExample.tsx
similarity index 82%
rename from example/app/src/screens/advanced/ShadowExample.tsx
rename to example/src/screens/advanced/ShadowExample.tsx
index 4bf497250..f791728a3 100644
--- a/example/app/src/screens/advanced/ShadowExample.tsx
+++ b/example/src/screens/advanced/ShadowExample.tsx
@@ -1,5 +1,5 @@
import React, { useCallback, useMemo, useRef } from 'react';
-import { View, StyleSheet } from 'react-native';
+import { View, StyleSheet, Platform } from 'react-native';
import BottomSheet from '@gorhom/bottom-sheet';
import { useShowcaseTheme } from '@gorhom/showcase-template';
import { Button } from '../../components/button';
@@ -18,6 +18,7 @@ const ShadowExample = () => {
const sheetStyle = useMemo(
() => ({
...styles.sheetContainer,
+ ...styles.sheetContainerShadow,
shadowColor: colors.secondaryText,
}),
[colors.secondaryText]
@@ -68,15 +69,24 @@ const styles = StyleSheet.create({
backgroundColor: 'white',
borderTopStartRadius: 24,
borderTopEndRadius: 24,
- shadowOffset: {
- width: 0,
- height: 12,
- },
- shadowOpacity: 0.75,
- shadowRadius: 16.0,
-
- elevation: 24,
},
+ sheetContainerShadow: Platform.select({
+ ios: {
+ shadowOffset: {
+ width: 0,
+ height: 12,
+ },
+ shadowOpacity: 0.75,
+ shadowRadius: 16.0,
+ shadowColor: '#000',
+ },
+ android: {
+ elevation: 24,
+ },
+ web: {
+ boxShadow: '0px -4px 16px rgba(0,0,0, 0.25)',
+ },
+ }) as any,
});
export default ShadowExample;
diff --git a/example/app/src/screens/basic/BasicExamples.tsx b/example/src/screens/basic/BasicExamples.tsx
similarity index 96%
rename from example/app/src/screens/basic/BasicExamples.tsx
rename to example/src/screens/basic/BasicExamples.tsx
index 8988e3c17..509971f0e 100644
--- a/example/app/src/screens/basic/BasicExamples.tsx
+++ b/example/src/screens/basic/BasicExamples.tsx
@@ -49,7 +49,7 @@ const createExampleScreen = ({ type, count = 25 }: ExampleScreenProps) =>
//#endregion
//#region callbacks
- const handleSheetChange = useCallback(index => {
+ const handleSheetChange = useCallback((index: number) => {
// eslint-disable-next-line no-console
console.log('handleSheetChange', index);
}, []);
@@ -60,7 +60,7 @@ const createExampleScreen = ({ type, count = 25 }: ExampleScreenProps) =>
},
[]
);
- const handleSnapPress = useCallback(index => {
+ const handleSnapPress = useCallback((index: number) => {
bottomSheetRef.current?.snapToIndex(index);
}, []);
const handleExpandPress = useCallback(() => {
@@ -104,6 +104,7 @@ const createExampleScreen = ({ type, count = 25 }: ExampleScreenProps) =>
animateOnMount={true}
enableContentPanningGesture={enableContentPanningGesture}
enableHandlePanningGesture={enableHandlePanningGesture}
+ enableDynamicSizing={false}
onChange={handleSheetChange}
onAnimate={handleSheetAnimate}
>
diff --git a/example/src/screens/index.ts b/example/src/screens/index.ts
new file mode 100644
index 000000000..d9b521eaa
--- /dev/null
+++ b/example/src/screens/index.ts
@@ -0,0 +1,174 @@
+import { ShowcaseExampleScreenSectionType } from '@gorhom/showcase-template';
+import { Platform } from 'react-native';
+
+const screens: ShowcaseExampleScreenSectionType[] = [];
+
+//#region Basic Section
+const basicSection = {
+ title: 'Basic',
+ collapsible: false,
+ data: [
+ {
+ name: 'View',
+ slug: 'Basic/ViewExample',
+ getScreen: () => require('./basic/BasicExamples').ViewExampleScreen,
+ },
+ {
+ name: 'ScrollView',
+ slug: 'Basic/ScrollViewExample',
+ getScreen: () => require('./basic/BasicExamples').ScrollViewExampleScreen,
+ },
+ {
+ name: 'FlatList',
+ slug: 'Basic/FlatListExample',
+ getScreen: () => require('./basic/BasicExamples').FlatListExampleScreen,
+ },
+ {
+ name: 'SectionList',
+ slug: 'Basic/SectionListExample',
+ getScreen: () =>
+ require('./basic/BasicExamples').SectionListExampleScreen,
+ },
+ {
+ name: 'VirtualizedList',
+ slug: 'Basic/VirtualizedListExample',
+ getScreen: () =>
+ require('./basic/BasicExamples').VirtualizedListExampleScreen,
+ },
+ ],
+};
+screens.push(basicSection);
+//#endregion
+
+//#region Modal Section
+const modalSection = {
+ title: 'Modal',
+ data: [
+ {
+ name: 'Simple',
+ slug: 'Modal/SimpleExample',
+ getScreen: () => require('./modal/SimpleExample').default,
+ },
+ {
+ name: 'Backdrop',
+ slug: 'Modal/BackdropExample',
+ getScreen: () => require('./modal/BackdropExample').default,
+ },
+ {
+ name: 'Stack Modals',
+ slug: 'Modal/StackExample',
+ getScreen: () => require('./modal/StackExample').default,
+ },
+ {
+ name: 'Dynamic Snap Point',
+ slug: 'Modal/DynamicSnapPointExample',
+ getScreen: () => require('./modal/DynamicSnapPointExample').default,
+ },
+ {
+ name: 'Detached',
+ slug: 'Modal/DetachedExample',
+ getScreen: () => require('./modal/DetachedExample').default,
+ },
+ ],
+};
+screens.push(modalSection);
+//#endregion
+
+//#region Advanced Section
+const advancedSection = {
+ title: 'Advanced',
+ collapsed: true,
+ data: [
+ {
+ name: 'Custom Handle',
+ slug: 'Advanced/CustomHandleExample',
+ getScreen: () => require('./advanced/CustomHandleExample').default,
+ },
+ {
+ name: 'Custom Background',
+ slug: 'Advanced/CustomBackgroundExample',
+ getScreen: () => require('./advanced/CustomBackgroundExample').default,
+ },
+ {
+ name: 'Custom Theme',
+ slug: 'Advanced/CustomThemeExample',
+ getScreen: () => require('./advanced/CustomThemeExample').default,
+ },
+ {
+ name: 'Backdrop',
+ slug: 'Advanced/BackdropExample',
+ getScreen: () => require('./advanced/BackdropExample').default,
+ },
+ {
+ name: 'Dynamic Snap Point',
+ slug: 'Advanced/DynamicSnapPointExample',
+ getScreen: () => require('./advanced/DynamicSnapPointExample').default,
+ },
+ {
+ name: 'Shadow',
+ slug: 'Advanced/ShadowExample',
+ getScreen: () => require('./advanced/ShadowExample').default,
+ },
+ {
+ name: 'Footer',
+ slug: 'Advanced/FooterExample',
+ getScreen: () => require('./advanced/FooterExample').default,
+ },
+ ],
+};
+if (Platform.OS !== 'web') {
+ advancedSection.data.push(
+ {
+ name: 'Keyboard Handling',
+ slug: 'Advanced/KeyboardHandlingExample',
+ getScreen: () => require('./advanced/KeyboardHandlingExample').default,
+ },
+ {
+ name: 'Pull To Refresh',
+ slug: 'Advanced/PullToRefreshExample',
+ getScreen: () => require('./advanced/PullToRefreshExample').default,
+ }
+ );
+}
+screens.push(advancedSection);
+//#endregion
+
+//#region Third Party Integration Section
+if (Platform.OS !== 'web') {
+ const integrationSection = {
+ title: 'Third Party Integration',
+ data: [
+ {
+ name: 'React Navigation',
+ slug: 'Integrations/NavigatorExample',
+ getScreen: () =>
+ require('./integrations/navigation/NavigatorExample').default,
+ },
+ {
+ name: 'React Native Screens',
+ slug: 'Integrations/NativeScreensExample',
+ getScreen: () => require('./integrations/NativeScreensExample').default,
+ },
+ {
+ name: 'View Pager',
+ slug: 'Integrations/ViewPagerExample',
+ getScreen: () => require('./integrations/ViewPagerExample').default,
+ },
+ {
+ name: 'Map',
+ slug: 'Integrations/MapExample',
+ getScreen: () => require('./integrations/map/MapExample').default,
+ screenOptions: {
+ headerTintColor: 'black',
+ headerTransparent: true,
+ },
+ },
+ ],
+ collapsed: true,
+ };
+ screens.push(integrationSection);
+}
+
+//#endregion
+
+export { screens };
diff --git a/example/bare/src/screens/integrations/NativeScreensExample.tsx b/example/src/screens/integrations/NativeScreensExample.tsx
similarity index 85%
rename from example/bare/src/screens/integrations/NativeScreensExample.tsx
rename to example/src/screens/integrations/NativeScreensExample.tsx
index 55fda20bb..ffd9d41c2 100644
--- a/example/bare/src/screens/integrations/NativeScreensExample.tsx
+++ b/example/src/screens/integrations/NativeScreensExample.tsx
@@ -2,11 +2,9 @@ import React from 'react';
import { View, StyleSheet, Platform } from 'react-native';
import { useNavigation } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import {
- ModalBackdropExample,
- Button,
- withModalProvider,
-} from '@gorhom/bottom-sheet-example-app';
+import { Button } from '../../components/button';
+import ModalBackdropExample from '../modal/BackdropExample';
+import { withModalProvider } from '../modal/withModalProvider';
const RootScreen = () => {
const { navigate } = useNavigation();
diff --git a/example/bare/src/screens/integrations/ViewPagerExample.tsx b/example/src/screens/integrations/ViewPagerExample.tsx
similarity index 93%
rename from example/bare/src/screens/integrations/ViewPagerExample.tsx
rename to example/src/screens/integrations/ViewPagerExample.tsx
index 66a823e60..fd618f2d9 100644
--- a/example/bare/src/screens/integrations/ViewPagerExample.tsx
+++ b/example/src/screens/integrations/ViewPagerExample.tsx
@@ -2,7 +2,7 @@ import React, { useMemo } from 'react';
import { View, Text, StyleSheet } from 'react-native';
import { createMaterialTopTabNavigator } from '@react-navigation/material-top-tabs';
import BottomSheet from '@gorhom/bottom-sheet';
-import { ContactList } from '@gorhom/bottom-sheet-example-app';
+import { ContactList } from '../../components/contactList';
const FirstRoute = () => {
const snapPoints = useMemo(() => ['25%', '50%', '90%'], []);
@@ -11,6 +11,7 @@ const FirstRoute = () => {
{
+ return (
+
+
+
+ );
+};
+
+const styles = StyleSheet.create({
+ blurView: {
+ ...StyleSheet.absoluteFillObject,
+ },
+ container: {
+ ...StyleSheet.absoluteFillObject,
+ borderTopLeftRadius: 10,
+ borderTopRightRadius: 10,
+ overflow: 'hidden',
+ },
+});
+
+export default BlurredBackground;
diff --git a/example/bare/src/components/locationDetailsHandle/LocationDetailsHandle.tsx b/example/src/screens/integrations/map/BlurredHandle.tsx
similarity index 80%
rename from example/bare/src/components/locationDetailsHandle/LocationDetailsHandle.tsx
rename to example/src/screens/integrations/map/BlurredHandle.tsx
index 39a8f47ca..32faa3799 100644
--- a/example/bare/src/components/locationDetailsHandle/LocationDetailsHandle.tsx
+++ b/example/src/screens/integrations/map/BlurredHandle.tsx
@@ -4,7 +4,7 @@ import { useShowcaseTheme } from '@gorhom/showcase-template';
const { width: SCREEN_WIDTH } = Dimensions.get('screen');
-const LocationDetailsHandle = () => {
+const BlurredHandle = () => {
// hooks
const { colors } = useShowcaseTheme();
@@ -13,10 +13,10 @@ const LocationDetailsHandle = () => {
() => [
styles.indicator,
{
- backgroundColor: colors.border,
+ backgroundColor: colors.secondaryText,
},
],
- [colors.border]
+ [colors.secondaryText]
);
// render
@@ -37,8 +37,8 @@ export const styles = StyleSheet.create({
width: (8 * SCREEN_WIDTH) / 100,
height: 5,
borderRadius: 4,
- backgroundColor: 'rgba(0, 0, 0, 0.5)',
+ backgroundColor: 'rgba(0, 0, 0, 0.2)',
},
});
-export default LocationDetailsHandle;
+export default BlurredHandle;
diff --git a/example/bare/src/components/locationDetails/LocationDetails.tsx b/example/src/screens/integrations/map/LocationDetails.tsx
similarity index 85%
rename from example/bare/src/components/locationDetails/LocationDetails.tsx
rename to example/src/screens/integrations/map/LocationDetails.tsx
index 9ea47372a..ac3bd923e 100644
--- a/example/bare/src/components/locationDetails/LocationDetails.tsx
+++ b/example/src/screens/integrations/map/LocationDetails.tsx
@@ -1,16 +1,18 @@
import React, { memo, useCallback, useMemo } from 'react';
-import { View, StyleSheet, Image } from 'react-native';
+import { View, StyleSheet, Image, ViewProps } from 'react-native';
import { FlatList, TouchableOpacity } from 'react-native-gesture-handler';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { ShowcaseLabel, useShowcaseTheme } from '@gorhom/showcase-template';
-import { Button } from '@gorhom/bottom-sheet-example-app';
-import type { Location } from '../../types';
+import { BottomSheetView } from '@gorhom/bottom-sheet';
+import { Button } from '../../../components/button';
+import { Location } from '../../../types';
const keyExtractor = (item: string, index: number) => `${index}${item}`;
const photoSize = 180;
export const LOCATION_DETAILS_HEIGHT = 298;
-interface LocationDetailsProps extends Location {
+interface LocationDetailsProps extends Location, Pick {
onClose: () => void;
}
@@ -18,13 +20,22 @@ const LocationDetailsComponent = ({
name,
address,
photos,
+ onLayout,
onClose,
}: LocationDetailsProps) => {
//#region hooks
const { colors } = useShowcaseTheme();
+ const { bottom } = useSafeAreaInsets();
//#endregion
//#region styles
+ const containerStyle = useMemo(
+ () => ({
+ ...styles.container,
+ paddingBottom: bottom,
+ }),
+ [bottom]
+ );
const closeButtonStyle = useMemo(
() => [
styles.closeButton,
@@ -37,7 +48,7 @@ const LocationDetailsComponent = ({
//#endregion
//#region renders
- const renderPhoto = useCallback(({ item }) => {
+ const renderPhoto = useCallback(({ item }: any) => {
return (
+
{name}
@@ -65,12 +76,6 @@ const LocationDetailsComponent = ({
- {}}
- />
-
{}}
/>
-
+
);
//#endregion
};
diff --git a/example/src/screens/integrations/map/LocationDetailsBottomSheet.tsx b/example/src/screens/integrations/map/LocationDetailsBottomSheet.tsx
new file mode 100644
index 000000000..cd2c05c7e
--- /dev/null
+++ b/example/src/screens/integrations/map/LocationDetailsBottomSheet.tsx
@@ -0,0 +1,86 @@
+import React, { useEffect } from 'react';
+import { BottomSheetModal } from '@gorhom/bottom-sheet';
+import {
+ forwardRef,
+ useCallback,
+ useImperativeHandle,
+ useRef,
+ useState,
+} from 'react';
+import { useHeaderHeight } from '@react-navigation/elements';
+import { SharedValue } from 'react-native-reanimated';
+import { LocationDetails } from './LocationDetails';
+import BlurredBackground from './BlurredBackground';
+import BlurredHandle from './BlurredHandle';
+import { Location } from '../../../types';
+
+interface LocationDetailsBottomSheetProps {
+ index: SharedValue;
+ position: SharedValue;
+}
+
+export interface LocationDetailsBottomSheetMethods {
+ present: (location: Location) => void;
+}
+
+const SNAP_POINTS = ['100%'];
+
+export const LocationDetailsBottomSheet = forwardRef<
+ LocationDetailsBottomSheetMethods,
+ LocationDetailsBottomSheetProps
+>(({ index, position }, ref) => {
+ //#region refs
+ const bottomSheetRef = useRef(null);
+ //#endregion
+
+ //#region state
+ const [selectedLocation, setSelectedLocation] = useState();
+ //#endregion
+
+ //#region hooks
+ const headerHeight = useHeaderHeight();
+ //#endregion
+
+ //#region callbacks
+ const handleCloseLocationDetails = useCallback(() => {
+ bottomSheetRef.current?.dismiss();
+ }, []);
+ const handleOnDismiss = useCallback(() => {
+ setSelectedLocation(undefined);
+ }, []);
+ //#endregion
+
+ //#region effects
+ useImperativeHandle(ref, () => ({
+ present: location => {
+ setSelectedLocation(location);
+ },
+ }));
+
+ useEffect(() => {
+ if (selectedLocation) {
+ bottomSheetRef.current?.present();
+ }
+ }, [selectedLocation]);
+ //#endregion
+
+ return (
+
+
+
+ );
+});
diff --git a/example/bare/src/components/locationItem/LocationItem.tsx b/example/src/screens/integrations/map/LocationItem.tsx
similarity index 75%
rename from example/bare/src/components/locationItem/LocationItem.tsx
rename to example/src/screens/integrations/map/LocationItem.tsx
index 37446e7ea..a1fd2316c 100644
--- a/example/bare/src/components/locationItem/LocationItem.tsx
+++ b/example/src/screens/integrations/map/LocationItem.tsx
@@ -1,6 +1,6 @@
-import React, { useMemo, memo } from 'react';
+import React, { memo } from 'react';
import { StyleSheet, View } from 'react-native';
-import { ShowcaseLabel, useShowcaseTheme } from '@gorhom/showcase-template';
+import { ShowcaseLabel } from '@gorhom/showcase-template';
interface LocationItemProps {
title: string;
@@ -8,16 +8,6 @@ interface LocationItemProps {
}
const LocationItemComponent = ({ title, subTitle }: LocationItemProps) => {
- const { colors } = useShowcaseTheme();
- const separatorStyle = useMemo(
- () => [
- styles.separator,
- {
- backgroundColor: colors.border,
- },
- ],
- [colors.border]
- );
// render
return (
<>
@@ -30,7 +20,7 @@ const LocationItemComponent = ({ title, subTitle }: LocationItemProps) => {
)}
-
+
>
);
};
@@ -55,17 +45,19 @@ const styles = StyleSheet.create({
},
title: {
fontSize: 16,
+ fontWeight: '700',
marginBottom: 4,
textTransform: 'capitalize',
},
subtitle: {
- color: '#666',
+ color: '#999',
fontSize: 14,
textTransform: 'capitalize',
},
separator: {
flex: 1,
- height: 1,
+ height: 0.5,
+ backgroundColor: '#666',
},
});
diff --git a/example/src/screens/integrations/map/LocationListBottomSheet.tsx b/example/src/screens/integrations/map/LocationListBottomSheet.tsx
new file mode 100644
index 000000000..35d0e940e
--- /dev/null
+++ b/example/src/screens/integrations/map/LocationListBottomSheet.tsx
@@ -0,0 +1,118 @@
+import React, { forwardRef, useCallback, useMemo } from 'react';
+import {
+ BottomSheetBackdrop,
+ BottomSheetBackdropProps,
+ BottomSheetModal,
+ BottomSheetScrollView,
+ TouchableOpacity,
+} from '@gorhom/bottom-sheet';
+import { useHeaderHeight } from '@react-navigation/elements';
+import { StyleSheet } from 'react-native';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { SharedValue, useAnimatedStyle } from 'react-native-reanimated';
+import BlurredBackground from './BlurredBackground';
+import BlurredHandle from './BlurredHandle';
+import { LocationItem } from './LocationItem';
+import { createLocationListMockData } from '../../../utilities/createMockData';
+import { Location } from '../../../types';
+
+interface LocationListBottomSheetProps {
+ index: SharedValue;
+ position: SharedValue;
+ onItemPress: (location: Location) => void;
+}
+
+export const MIDDLE_SNAP_POINT = 300;
+
+const SNAP_POINTS = [64, MIDDLE_SNAP_POINT, '100%'];
+const DATA = createLocationListMockData(15);
+
+export const LocationListBottomSheet = forwardRef<
+ BottomSheetModal,
+ LocationListBottomSheetProps
+>(({ index, position, onItemPress }, ref) => {
+ //#region hooks
+ const headerHeight = useHeaderHeight();
+ const { bottom: bottomSafeArea } = useSafeAreaInsets();
+ //#endregion
+
+ //#region styles
+ const scrollViewAnimatedStyle = useAnimatedStyle(() => ({
+ opacity: index.value,
+ }));
+ const scrollViewStyle = useMemo(
+ () => [styles.scrollView, scrollViewAnimatedStyle],
+ [scrollViewAnimatedStyle]
+ );
+ const scrollViewContentContainer = useMemo(
+ () => [
+ styles.scrollViewContentContainer,
+ { paddingBottom: bottomSafeArea },
+ ],
+ [bottomSafeArea]
+ );
+ //#endregion
+
+ //#region render
+ const renderBackdrop = useCallback(
+ (props: BottomSheetBackdropProps) => (
+
+ ),
+ []
+ );
+
+ const renderItem = useCallback(
+ (item: Location, index: number) => (
+ onItemPress(item)}
+ >
+
+
+ ),
+ [onItemPress]
+ );
+
+ return (
+
+
+ {DATA.map(renderItem)}
+
+
+ );
+});
+
+const styles = StyleSheet.create({
+ scrollView: {
+ flex: 1,
+ },
+ scrollViewContentContainer: {
+ paddingHorizontal: 16,
+ },
+});
diff --git a/example/src/screens/integrations/map/MapExample.tsx b/example/src/screens/integrations/map/MapExample.tsx
new file mode 100644
index 000000000..39ac68726
--- /dev/null
+++ b/example/src/screens/integrations/map/MapExample.tsx
@@ -0,0 +1,120 @@
+import React, { useCallback, useLayoutEffect, useMemo, useRef } from 'react';
+import { View, StyleSheet, Dimensions } from 'react-native';
+import MapView from 'react-native-maps';
+import { useSharedValue, useDerivedValue } from 'react-native-reanimated';
+import { BottomSheetModal } from '@gorhom/bottom-sheet';
+import type { Location } from '../../../types';
+import Weather from './Weather';
+import { withModalProvider } from '../../modal/withModalProvider';
+import {
+ LocationDetailsBottomSheet,
+ LocationDetailsBottomSheetMethods,
+} from './LocationDetailsBottomSheet';
+import { LocationListBottomSheet } from './LocationListBottomSheet';
+
+const { height: SCREEN_HEIGHT } = Dimensions.get('window');
+
+const MapExample = () => {
+ //#region refs
+ const mapRef = useRef(null);
+ const poiListModalRef = useRef(null);
+ const poiDetailsModalRef = useRef(null);
+ //#endregion
+
+ //#region variables
+ const mapInitialCamera = useMemo(
+ () => ({
+ center: {
+ latitude: 52.3791,
+ longitude: 4.9003,
+ },
+ heading: 0,
+ pitch: 0,
+ zoom: 10,
+ altitude: 40000,
+ }),
+ []
+ );
+ //#endregion
+
+ //#region animated variables
+ const animatedPOIListIndex = useSharedValue(0);
+ const animatedPOIListPosition = useSharedValue(SCREEN_HEIGHT);
+ const animatedPOIDetailsIndex = useSharedValue(0);
+ const animatedPOIDetailsPosition = useSharedValue(SCREEN_HEIGHT);
+
+ const weatherAnimatedIndex = useDerivedValue(() =>
+ animatedPOIListIndex.value > animatedPOIDetailsIndex.value
+ ? animatedPOIListIndex.value
+ : animatedPOIDetailsIndex.value
+ );
+ const weatherAnimatedPosition = useDerivedValue(() =>
+ animatedPOIListPosition.value < animatedPOIDetailsPosition.value
+ ? animatedPOIListPosition.value
+ : animatedPOIDetailsPosition.value
+ );
+ //#endregion
+
+ //#region callbacks
+ const handleTouchStart = useCallback(() => {
+ poiListModalRef.current?.collapse();
+ }, []);
+ const handleOnLocationPress = useCallback((item: Location) => {
+ poiDetailsModalRef.current?.present(item);
+ }, []);
+ //#endregion
+
+ //#region effects
+ useLayoutEffect(() => {
+ requestAnimationFrame(() => poiListModalRef.current?.present());
+ }, []);
+ //#endregion
+
+ // renders
+ return (
+
+
+
+
+
+
+
+
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ padding: 24,
+ },
+ mapContainer: {
+ ...StyleSheet.absoluteFillObject,
+ },
+ scrollView: {
+ flex: 1,
+ },
+ scrollViewContentContainer: {
+ paddingHorizontal: 16,
+ },
+});
+
+export default withModalProvider(MapExample);
diff --git a/example/src/screens/integrations/map/Weather.tsx b/example/src/screens/integrations/map/Weather.tsx
new file mode 100644
index 000000000..cd364cad2
--- /dev/null
+++ b/example/src/screens/integrations/map/Weather.tsx
@@ -0,0 +1,91 @@
+import React, { useCallback, useMemo, useState } from 'react';
+import { LayoutChangeEvent, StyleSheet } from 'react-native';
+import Animated, {
+ Extrapolate,
+ interpolate,
+ useAnimatedStyle,
+} from 'react-native-reanimated';
+import { useSafeAreaFrame } from 'react-native-safe-area-context';
+import { ShowcaseLabel, useShowcaseTheme } from '@gorhom/showcase-template';
+import { MIDDLE_SNAP_POINT } from './LocationListBottomSheet';
+
+interface WeatherProps {
+ animatedPosition: SharedValue;
+ animatedIndex: SharedValue;
+}
+
+const SPACE = 8;
+
+const Weather = ({ animatedIndex, animatedPosition }: WeatherProps) => {
+ //#region state
+ const [height, setHeight] = useState(0);
+ //#endregion
+
+ //#region hooks
+ const { height: screenHeight } = useSafeAreaFrame();
+ const { colors } = useShowcaseTheme();
+ //#endregion
+
+ //#region callbacks
+ const handleOnLayout = useCallback(
+ ({ nativeEvent: { layout } }: LayoutChangeEvent) => {
+ setHeight(layout.height);
+ },
+ []
+ );
+ //#endregion
+
+ //#region styles
+ const containerAnimatedStyle = useAnimatedStyle(() => {
+ const belowMiddlePosition =
+ screenHeight - animatedPosition.value < MIDDLE_SNAP_POINT;
+ return {
+ opacity: interpolate(
+ animatedIndex.value,
+ [1, 1.125],
+ [1, 0],
+ Extrapolate.CLAMP
+ ),
+ transform: [
+ {
+ translateY: belowMiddlePosition
+ ? animatedPosition.value - height - SPACE
+ : screenHeight - MIDDLE_SNAP_POINT - height - SPACE,
+ },
+ ],
+ };
+ });
+ const containerStyle = useMemo(
+ () => [
+ styles.container,
+ { backgroundColor: colors.secondaryCard },
+ containerAnimatedStyle,
+ ],
+ [colors.secondaryCard, containerAnimatedStyle]
+ );
+ //#endregion
+
+ return (
+
+ ☁️ 12°
+
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ position: 'absolute',
+ right: 12,
+ top: 0,
+ padding: 6,
+ marginTop: 0,
+ borderRadius: 4,
+ },
+ label: {
+ fontSize: 12,
+ lineHeight: 12,
+ fontWeight: '800',
+ },
+});
+
+export default Weather;
diff --git a/example/bare/src/screens/DummyScreen.tsx b/example/src/screens/integrations/navigation/DummyScreen.tsx
similarity index 92%
rename from example/bare/src/screens/DummyScreen.tsx
rename to example/src/screens/integrations/navigation/DummyScreen.tsx
index 696e65949..eb3215e2e 100644
--- a/example/bare/src/screens/DummyScreen.tsx
+++ b/example/src/screens/integrations/navigation/DummyScreen.tsx
@@ -1,6 +1,6 @@
import React, { useCallback, memo } from 'react';
import { useNavigation } from '@react-navigation/native';
-import { ContactList } from '@gorhom/bottom-sheet-example-app';
+import { ContactList } from '../../../components/contactList';
interface DummyScreenProps {
title: string;
diff --git a/example/bare/src/screens/integrations/NavigatorExample.tsx b/example/src/screens/integrations/navigation/NavigatorExample.tsx
similarity index 88%
rename from example/bare/src/screens/integrations/NavigatorExample.tsx
rename to example/src/screens/integrations/navigation/NavigatorExample.tsx
index 423e6738e..5e3b2aff7 100644
--- a/example/bare/src/screens/integrations/NavigatorExample.tsx
+++ b/example/src/screens/integrations/navigation/NavigatorExample.tsx
@@ -6,9 +6,9 @@ import {
TransitionPresets,
} from '@react-navigation/stack';
import BottomSheet from '@gorhom/bottom-sheet';
-import { Button } from '@gorhom/bottom-sheet-example-app';
import { NavigationContainer } from '@react-navigation/native';
-import createDummyScreen from '../DummyScreen';
+import createDummyScreen from './DummyScreen';
+import { Button } from '../../../components/button';
const Stack = createStackNavigator();
const ScreenA = createDummyScreen({
@@ -42,7 +42,7 @@ const Navigator = () => {
const screenOptions = useMemo(
() => ({
...TransitionPresets.SlideFromRightIOS,
-
+ headerMode: 'screen',
headerShown: true,
safeAreaInsets: { top: 0 },
cardStyle: {
@@ -56,7 +56,7 @@ const Navigator = () => {
const screenAOptions = useMemo(() => ({ headerLeft: () => null }), []);
return (
-
+
{
const snapPoints = useMemo(() => ['25%', '50%', '90%'], []);
// callbacks
- const handleSheetChange = useCallback(index => {
- // eslint-disable-next-line no-console
- console.log('handleSheetChange', index);
- }, []);
- const handleSnapPress = useCallback(index => {
+ const handleSnapPress = useCallback((index: number) => {
bottomSheetRef.current?.snapToIndex(index);
}, []);
const handleExpandPress = useCallback(() => {
@@ -107,9 +103,9 @@ const NavigatorExample = () => {
diff --git a/example/app/src/screens/modal/BackdropExample.tsx b/example/src/screens/modal/BackdropExample.tsx
similarity index 93%
rename from example/app/src/screens/modal/BackdropExample.tsx
rename to example/src/screens/modal/BackdropExample.tsx
index c4d37e360..217d97df8 100644
--- a/example/app/src/screens/modal/BackdropExample.tsx
+++ b/example/src/screens/modal/BackdropExample.tsx
@@ -4,6 +4,7 @@ import {
BottomSheetModal,
BottomSheetBackdrop,
BottomSheetBackdropProps,
+ BottomSheetHandleProps,
} from '@gorhom/bottom-sheet';
import { Button } from '../../components/button';
import { ContactList } from '../../components/contactList';
@@ -60,7 +61,9 @@ export const BackdropExample = () => {
);
const renderHeaderHandle = useCallback(
- props => ,
+ (props: BottomSheetHandleProps) => (
+
+ ),
[]
);
return (
@@ -76,9 +79,10 @@ export const BackdropExample = () => {
diff --git a/example/app/src/screens/modal/DetachedExample.tsx b/example/src/screens/modal/DetachedExample.tsx
similarity index 83%
rename from example/app/src/screens/modal/DetachedExample.tsx
rename to example/src/screens/modal/DetachedExample.tsx
index 2e06327fc..a691bd391 100644
--- a/example/app/src/screens/modal/DetachedExample.tsx
+++ b/example/src/screens/modal/DetachedExample.tsx
@@ -5,29 +5,24 @@ import {
BottomSheetModal,
BottomSheetView,
BottomSheetFooter,
- useBottomSheetDynamicSnapPoints,
+ BottomSheetHandleProps,
+ BottomSheetFooterProps,
} from '@gorhom/bottom-sheet';
import { Button } from '../../components/button';
import { ContactItem } from '../../components/contactItem';
import { HeaderHandle } from '../../components/headerHandle';
import { withModalProvider } from './withModalProvider';
import { createContactListMockData } from '../../utilities/createMockData';
+import { Contact } from '../../types';
const DetachedExample = () => {
// refs
const bottomSheetRef = useRef(null);
// variables
- const initialSnapPoints = useMemo(() => ['CONTENT_HEIGHT'], []);
const data = useMemo(() => createContactListMockData(2), []);
// hooks
- const {
- animatedHandleHeight,
- animatedSnapPoints,
- animatedContentHeight,
- handleContentLayout,
- } = useBottomSheetDynamicSnapPoints(initialSnapPoints);
const { bottom: safeBottomArea } = useSafeAreaInsets();
// callbacks
@@ -43,11 +38,13 @@ const DetachedExample = () => {
// renders
const renderHeaderHandle = useCallback(
- props => ,
+ (props: BottomSheetHandleProps) => (
+
+ ),
[]
);
const renderItem = useCallback(
- (item, index) => (
+ (item: Contact, index: number) => (
{
[]
);
const renderFooter = useCallback(
- props => (
+ (props: BottomSheetFooterProps) => (
this is a footer!
@@ -73,10 +70,7 @@ const DetachedExample = () => {
{
{data.map(renderItem)}
@@ -118,7 +111,7 @@ const styles = StyleSheet.create({
contentContainerStyle: {
paddingTop: 12,
paddingBottom: 12,
- paddingHorizontal: 16,
+ paddingHorizontal: 12,
},
footer: {
justifyContent: 'center',
diff --git a/example/app/src/screens/modal/DynamicSnapPointExample.tsx b/example/src/screens/modal/DynamicSnapPointExample.tsx
similarity index 82%
rename from example/app/src/screens/modal/DynamicSnapPointExample.tsx
rename to example/src/screens/modal/DynamicSnapPointExample.tsx
index a2cdf5d3f..a946c4bcb 100644
--- a/example/app/src/screens/modal/DynamicSnapPointExample.tsx
+++ b/example/src/screens/modal/DynamicSnapPointExample.tsx
@@ -3,7 +3,7 @@ import { View, StyleSheet, Text } from 'react-native';
import {
BottomSheetModal,
BottomSheetView,
- useBottomSheetDynamicSnapPoints,
+ SNAP_POINT_TYPE,
} from '@gorhom/bottom-sheet';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { Button } from '../../components/button';
@@ -12,19 +12,12 @@ import { withModalProvider } from './withModalProvider';
const DynamicSnapPointExample = () => {
// state
const [count, setCount] = useState(0);
- const initialSnapPoints = useMemo(() => ['CONTENT_HEIGHT'], []);
// hooks
const { bottom: safeBottomArea } = useSafeAreaInsets();
const bottomSheetRef = useRef(null);
- const {
- animatedHandleHeight,
- animatedSnapPoints,
- animatedContentHeight,
- handleContentLayout,
- } = useBottomSheetDynamicSnapPoints(initialSnapPoints);
- // callbacks
+ //#region callbacks
const handleIncreaseContentPress = useCallback(() => {
setCount(state => state + 1);
}, []);
@@ -38,8 +31,16 @@ const DynamicSnapPointExample = () => {
const handleDismissPress = useCallback(() => {
bottomSheetRef.current?.dismiss();
}, []);
+ const handleSheetChange = useCallback(
+ (index: number, position: number, type: SNAP_POINT_TYPE) => {
+ // eslint-disable-next-line no-console
+ console.log('handleSheetChange', { index, position, type });
+ },
+ []
+ );
+ //#endregion
- // styles
+ //#region styles
const contentContainerStyle = useMemo(
() => ({
...styles.contentContainerStyle,
@@ -54,6 +55,7 @@ const DynamicSnapPointExample = () => {
}),
[count]
);
+ //#endregion
// renders
return (
@@ -62,15 +64,11 @@ const DynamicSnapPointExample = () => {
-
+
Could this sheet modal resize to its content height ?
diff --git a/example/app/src/screens/modal/SimpleExample.tsx b/example/src/screens/modal/SimpleExample.tsx
similarity index 93%
rename from example/app/src/screens/modal/SimpleExample.tsx
rename to example/src/screens/modal/SimpleExample.tsx
index 15b55dd2f..09febfa25 100644
--- a/example/app/src/screens/modal/SimpleExample.tsx
+++ b/example/src/screens/modal/SimpleExample.tsx
@@ -1,6 +1,6 @@
import React, { useCallback, useMemo, useRef, useState } from 'react';
import { View, StyleSheet } from 'react-native';
-import { BottomSheetModal } from '@gorhom/bottom-sheet';
+import { BottomSheetHandleProps, BottomSheetModal } from '@gorhom/bottom-sheet';
import { Button } from '../../components/button';
import { ContactList } from '../../components/contactList';
import { HeaderHandle } from '../../components/headerHandle';
@@ -52,7 +52,9 @@ export const SimpleExample = () => {
// renders
const renderHeaderHandle = useCallback(
- props => ,
+ (props: BottomSheetHandleProps) => (
+
+ ),
[]
);
return (
@@ -79,6 +81,7 @@ export const SimpleExample = () => {
snapPoints={snapPoints}
enablePanDownToClose={enablePanDownToClose}
enableDismissOnClose={enableDismissOnClose}
+ enableDynamicSizing={false}
onDismiss={handleDismiss}
onChange={handleChange}
handleComponent={renderHeaderHandle}
diff --git a/example/app/src/screens/modal/StackExample.tsx b/example/src/screens/modal/StackExample.tsx
similarity index 90%
rename from example/app/src/screens/modal/StackExample.tsx
rename to example/src/screens/modal/StackExample.tsx
index 9bb044987..a1e53e63e 100644
--- a/example/app/src/screens/modal/StackExample.tsx
+++ b/example/src/screens/modal/StackExample.tsx
@@ -1,6 +1,10 @@
import React, { useCallback, useMemo, useRef } from 'react';
import { View, StyleSheet } from 'react-native';
-import { BottomSheetModal, useBottomSheetModal } from '@gorhom/bottom-sheet';
+import {
+ BottomSheetHandleProps,
+ BottomSheetModal,
+ useBottomSheetModal,
+} from '@gorhom/bottom-sheet';
import { Button } from '../../components/button';
import { ContactList } from '../../components/contactList';
import { HeaderHandle } from '../../components/headerHandle';
@@ -58,12 +62,14 @@ const StackExample = () => {
// renders
const renderHeaderHandle = useCallback(
- (title: string) => (props: any) =>
+ (title: string) => (props: BottomSheetHandleProps) =>
,
[]
);
const renderBottomSheetContent = useCallback(
- onPress => ,
+ (onPress: () => void) => (
+
+ ),
[]
);
return (
@@ -81,6 +87,7 @@ const StackExample = () => {
name="A"
ref={bottomSheetModalARef}
snapPoints={snapPoints}
+ enableDynamicSizing={false}
handleComponent={renderHeaderHandle('Modal A')}
children={renderBottomSheetContent(handlePresentBPress)}
/>
@@ -89,6 +96,7 @@ const StackExample = () => {
name="B"
ref={bottomSheetModalBRef}
snapPoints={snapPoints}
+ enableDynamicSizing={false}
handleComponent={renderHeaderHandle('Modal B')}
children={renderBottomSheetContent(handlePresentCPress)}
/>
@@ -98,6 +106,7 @@ const StackExample = () => {
ref={bottomSheetModalCRef}
index={1}
snapPoints={snapPoints}
+ enableDynamicSizing={false}
enablePanDownToClose={false}
handleComponent={renderHeaderHandle('Modal C')}
children={renderBottomSheetContent(handleDismissCPress)}
diff --git a/example/app/src/screens/modal/withModalProvider.tsx b/example/src/screens/modal/withModalProvider.tsx
similarity index 100%
rename from example/app/src/screens/modal/withModalProvider.tsx
rename to example/src/screens/modal/withModalProvider.tsx
diff --git a/example/src/screens/withGestureHandlerRoot.tsx b/example/src/screens/withGestureHandlerRoot.tsx
new file mode 100644
index 000000000..c044d8354
--- /dev/null
+++ b/example/src/screens/withGestureHandlerRoot.tsx
@@ -0,0 +1,16 @@
+import React, { FC } from 'react';
+import { StyleSheet } from 'react-native';
+import { GestureHandlerRootView } from 'react-native-gesture-handler';
+
+export const withGestureHandlerRoot = (Component: FC) => () =>
+ (
+
+
+
+ );
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ },
+});
diff --git a/example/app/src/types.d.ts b/example/src/types.d.ts
similarity index 100%
rename from example/app/src/types.d.ts
rename to example/src/types.d.ts
diff --git a/example/app/src/utilities/createMockData.ts b/example/src/utilities/createMockData.ts
similarity index 100%
rename from example/app/src/utilities/createMockData.ts
rename to example/src/utilities/createMockData.ts
diff --git a/example/app/src/utilities/transformOrigin.ts b/example/src/utilities/transformOrigin.ts
similarity index 100%
rename from example/app/src/utilities/transformOrigin.ts
rename to example/src/utilities/transformOrigin.ts
diff --git a/example/tsconfig.json b/example/tsconfig.json
new file mode 100644
index 000000000..fb7c518ea
--- /dev/null
+++ b/example/tsconfig.json
@@ -0,0 +1,9 @@
+{
+ "extends": "expo/tsconfig.base",
+ "compilerOptions": {
+ "strict": true,
+ "paths": {
+ "@gorhom/bottom-sheet": ["../src/index"]
+ },
+ }
+}
diff --git a/example/web/index.html b/example/web/index.html
new file mode 100644
index 000000000..b98004386
--- /dev/null
+++ b/example/web/index.html
@@ -0,0 +1,121 @@
+
+
+
+
+
+
+
+
+
+ %WEB_TITLE%
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/example/webpack.config.js b/example/webpack.config.js
new file mode 100644
index 000000000..b5e6418a0
--- /dev/null
+++ b/example/webpack.config.js
@@ -0,0 +1,40 @@
+const createExpoWebpackConfigAsync = require('@expo/webpack-config');
+const path = require('path');
+
+const root = path.resolve(__dirname, '..');
+const node_modules = path.join(__dirname, 'node_modules');
+
+module.exports = async function (env, argv) {
+ const config = await createExpoWebpackConfigAsync(
+ {
+ ...env,
+ babel: {
+ dangerouslyAddModulePathsToTranspile: ['react-native-reanimated'],
+ },
+ },
+ argv
+ );
+
+ config.module.rules.push({
+ test: /\.(js|jsx|ts|tsx)$/,
+ include: path.resolve(root, 'src'),
+ use: 'babel-loader',
+ });
+
+ Object.assign(config.resolve.alias, {
+ react: path.join(node_modules, 'react'),
+ 'react-native': path.join(node_modules, 'react-native'),
+ 'react-native-web': path.join(node_modules, 'react-native-web'),
+ 'react-native-reanimated': path.join(
+ node_modules,
+ 'react-native-reanimated'
+ ),
+ 'react-native-gesture-handler': path.join(
+ node_modules,
+ 'react-native-gesture-handler'
+ ),
+ });
+
+ // Customize the config before returning it.
+ return config;
+};
diff --git a/lint-staged.config.js b/lint-staged.config.js
index 8efb35dc5..9a93ff059 100644
--- a/lint-staged.config.js
+++ b/lint-staged.config.js
@@ -1,4 +1,4 @@
module.exports = {
'**/*.js': ['eslint'],
- '**/*.{ts,tsx}': [() => 'tsc --skipLibCheck --noEmit', 'eslint'],
+ '**/*.{ts,tsx}': [() => 'tsc --skipLibCheck --noEmit', 'eslint --fix'],
};
diff --git a/mock.js b/mock.js
index d4c85a791..0e21c4a83 100644
--- a/mock.js
+++ b/mock.js
@@ -9,6 +9,7 @@
*/
const React = require('react');
+const ReactNative = require('react-native');
const NOOP = () => {};
const NOOP_VALUE = { value: 0 };
@@ -104,10 +105,15 @@ const useBottomSheetDynamicSnapPoints = () => ({
module.exports = {
BottomSheetView: BottomSheetComponent,
- BottomSheetScrollView: BottomSheetComponent,
- BottomSheetSectionList: BottomSheetComponent,
- BottomSheetFlatList: BottomSheetComponent,
- BottomSheetVirtualizedList: BottomSheetComponent,
+ BottomSheetTextInput: ReactNative.TextInput,
+ BottomSheetScrollView: ReactNative.ScrollView,
+ BottomSheetSectionList: ReactNative.SectionList,
+ BottomSheetFlatList: ReactNative.FlatList,
+ BottomSheetVirtualizedList: ReactNative.VirtualizedList,
+
+ TouchableOpacity: ReactNative.TouchableOpacity,
+ TouchableHighlight: ReactNative.TouchableHighlight,
+ TouchableWithoutFeedback: ReactNative.TouchableWithoutFeedback,
BottomSheetModalProvider,
BottomSheetModal,
diff --git a/package.json b/package.json
index 362ad2e9f..e1016d851 100644
--- a/package.json
+++ b/package.json
@@ -1,11 +1,10 @@
{
- "name": "@gorhom/bottom-sheet",
- "version": "4.4.5",
+ "name": "@discord/bottom-sheet",
+ "version": "5.0.0-alpha.9",
"description": "A performant interactive bottom sheet with fully configurable options 🚀",
- "main": "lib/commonjs/index",
- "module": "lib/module/index",
- "types": "lib/typescript/index.d.ts",
+ "main": "src/index.ts",
"react-native": "src/index.ts",
+ "source": "src/index.ts",
"files": [
"src",
"lib",
@@ -20,13 +19,13 @@
"reanimated",
"sheet"
],
- "repository": "https://github.com/gorhom/react-native-bottom-sheet",
+ "repository": "https://github.com/discord/react-native-bottom-sheet",
"author": "Mo Gorhom (https://gorhom.dev)",
"license": "MIT",
"bugs": {
"url": "https://github.com/gorhom/react-native-bottom-sheet/issues"
},
- "homepage": "https://gorhom.github.io/react-native-bottom-sheet",
+ "homepage": "https://ui.gorhom.dev/components/bottom-sheet",
"scripts": {
"typescript": "tsc --skipLibCheck --noEmit",
"lint": "eslint \"**/*.{js,ts,tsx}\"",
@@ -43,34 +42,48 @@
"invariant": "^2.2.4"
},
"devDependencies": {
- "@commitlint/cli": "^17.1.2",
- "@commitlint/config-conventional": "^17.1.0",
- "@react-native-community/eslint-config": "^3.0.0",
- "@release-it/conventional-changelog": "^5.1.0",
+ "@commitlint/cli": "^17.6.5",
+ "@commitlint/config-conventional": "^17.6.5",
+ "@react-native/eslint-config": "^0.72.2",
+ "@release-it/conventional-changelog": "^8.0.1",
"@types/invariant": "^2.2.34",
- "@types/react": "17.0.2",
- "@types/react-native": "^0.67.7",
+ "@types/react": "18.2.45",
+ "@types/react-native": "0.73.0",
+ "@shopify/flash-list": "https://github.com/discord/flash-list/archive/b0057e2f71a777d6e8e2adc2abf72ba9de9cd5ed.tar.gz",
"auto-changelog": "^2.4.0",
"copyfiles": "^2.4.1",
- "eslint": "^7.32.0",
- "eslint-config-prettier": "^8.3.0",
- "eslint-plugin-prettier": "^3.4.0",
+ "eslint": "^8.21.0",
+ "eslint-plugin-bottom-sheet": "link:eslint-plugin-bottom-sheet",
+ "eslint-config-prettier": "^8.8.0",
+ "eslint-plugin-prettier": "^4.2.1",
"husky": "^4.3.8",
- "lint-staged": "^11.1.2",
- "prettier": "^2.3.2",
- "react": "~16.9.0",
- "react-native": "^0.62.2",
- "react-native-builder-bob": "^0.18.1",
- "react-native-gesture-handler": "^1.10.3",
- "react-native-reanimated": "^2.8.0",
- "release-it": "^15.4.2",
- "typescript": "^4.2.4"
+ "lint-staged": "^13.2.2",
+ "metro-react-native-babel-preset": "^0.77.0",
+ "prettier": "^2.8.8",
+ "react": "18.2.0",
+ "react-native": "0.73.4",
+ "react-native-builder-bob": "^0.23.2",
+ "react-native-gesture-handler": "^2.14.0",
+ "react-native-reanimated": "^3.6.2",
+ "release-it": "^17.0.1",
+ "typescript": "^5.3.0"
},
"peerDependencies": {
+ "@types/react": "*",
+ "@types/react-native": "*",
+ "@shopify/flash-list": "*",
"react": "*",
"react-native": "*",
- "react-native-gesture-handler": ">=1.10.1",
- "react-native-reanimated": ">=2.2.0"
+ "react-native-gesture-handler": ">=2.14.0",
+ "react-native-reanimated": ">=3.6.0"
+ },
+ "peerDependenciesMeta": {
+ "@types/react-native": {
+ "optional": true
+ },
+ "@types/react": {
+ "optional": true
+ }
},
"react-native-builder-bob": {
"source": "src",
diff --git a/src/components/bottomSheet/BottomSheet.tsx b/src/components/bottomSheet/BottomSheet.tsx
index b16644070..6bedc0367 100644
--- a/src/components/bottomSheet/BottomSheet.tsx
+++ b/src/components/bottomSheet/BottomSheet.tsx
@@ -18,9 +18,9 @@ import Animated, {
Extrapolate,
runOnUI,
cancelAnimation,
- useWorkletCallback,
WithSpringConfig,
WithTimingConfig,
+ type SharedValue,
} from 'react-native-reanimated';
import { State } from 'react-native-gesture-handler';
import {
@@ -51,6 +51,7 @@ import {
KEYBOARD_BLUR_BEHAVIOR,
KEYBOARD_INPUT_MODE,
ANIMATION_SOURCE,
+ SNAP_POINT_TYPE,
} from '../../constants';
import {
animate,
@@ -74,6 +75,10 @@ import {
DEFAULT_ENABLE_PAN_DOWN_TO_CLOSE,
INITIAL_CONTAINER_OFFSET,
INITIAL_VALUE,
+ DEFAULT_DYNAMIC_SIZING,
+ DEFAULT_ACCESSIBLE,
+ DEFAULT_ACCESSIBILITY_LABEL,
+ DEFAULT_ACCESSIBILITY_ROLE,
} from './constants';
import type { BottomSheetMethods, Insets } from '../../types';
import type { BottomSheetProps, AnimateToPositionType } from './types';
@@ -87,10 +92,6 @@ type BottomSheet = BottomSheetMethods;
const BottomSheetComponent = forwardRef(
function BottomSheet(props, ref) {
- //#region validate props
- usePropsValidator(props);
- //#endregion
-
//#region extract props
const {
// animations configurations
@@ -99,11 +100,13 @@ const BottomSheetComponent = forwardRef(
// configurations
index: _providedIndex = 0,
snapPoints: _providedSnapPoints,
+ initialPosition = INITIAL_POSITION,
animateOnMount = DEFAULT_ANIMATE_ON_MOUNT,
enableContentPanningGesture = DEFAULT_ENABLE_CONTENT_PANNING_GESTURE,
enableHandlePanningGesture = DEFAULT_ENABLE_HANDLE_PANNING_GESTURE,
enableOverDrag = DEFAULT_ENABLE_OVER_DRAG,
enablePanDownToClose = DEFAULT_ENABLE_PAN_DOWN_TO_CLOSE,
+ enableDynamicSizing = DEFAULT_DYNAMIC_SIZING,
overDragResistanceFactor = DEFAULT_OVER_DRAG_RESISTANCE_FACTOR,
// styles
@@ -128,6 +131,7 @@ const BottomSheetComponent = forwardRef(
containerOffset: _providedContainerOffset,
topInset = 0,
bottomInset = 0,
+ maxDynamicContentSize,
// animated callback shared values
animatedPosition: _providedAnimatedPosition,
@@ -154,11 +158,32 @@ const BottomSheetComponent = forwardRef(
handleComponent,
backdropComponent,
backgroundComponent,
- footerComponent,
- children: Content,
+ renderFooter,
+ children,
+
+ // accessibility
+ accessible: _providedAccessible = DEFAULT_ACCESSIBLE,
+ accessibilityLabel:
+ _providedAccessibilityLabel = DEFAULT_ACCESSIBILITY_LABEL,
+ accessibilityRole:
+ _providedAccessibilityRole = DEFAULT_ACCESSIBILITY_ROLE,
} = props;
//#endregion
+ //#region validate props
+ if (__DEV__) {
+ // eslint-disable-next-line react-hooks/rules-of-hooks
+ usePropsValidator({
+ index: _providedIndex,
+ snapPoints: _providedSnapPoints,
+ enableDynamicSizing,
+ topInset,
+ bottomInset,
+ children,
+ });
+ }
+ //#endregion
+
//#region layout variables
/**
* This variable is consider an internal variable,
@@ -177,21 +202,26 @@ const BottomSheetComponent = forwardRef(
return $modal
? _animatedContainerHeight.value - verticalInset
: _animatedContainerHeight.value;
- }, [$modal, topInset, bottomInset]);
+ });
const animatedContainerOffset = useReactiveSharedValue(
_providedContainerOffset ?? INITIAL_CONTAINER_OFFSET
- ) as Animated.SharedValue;
+ ) as SharedValue;
const animatedHandleHeight = useReactiveSharedValue(
_providedHandleHeight ?? INITIAL_HANDLE_HEIGHT
);
const animatedFooterHeight = useSharedValue(0);
- const animatedSnapPoints = useNormalizedSnapPoints(
- _providedSnapPoints,
- animatedContainerHeight,
- topInset,
- bottomInset,
- $modal
+ const animatedContentHeight = useReactiveSharedValue(
+ _providedContentHeight ?? INITIAL_CONTAINER_HEIGHT
);
+ const [animatedSnapPoints, animatedDynamicSnapPointIndex] =
+ useNormalizedSnapPoints(
+ _providedSnapPoints,
+ animatedContainerHeight,
+ animatedContentHeight,
+ animatedHandleHeight,
+ enableDynamicSizing,
+ maxDynamicContentSize
+ );
const animatedHighestSnapPoint = useDerivedValue(
() => animatedSnapPoints.value[animatedSnapPoints.value.length - 1]
);
@@ -203,14 +233,14 @@ const BottomSheetComponent = forwardRef(
}
return closedPosition;
- }, [$modal, detached, bottomInset]);
+ });
const animatedSheetHeight = useDerivedValue(
() => animatedContainerHeight.value - animatedHighestSnapPoint.value
);
const animatedCurrentIndex = useReactiveSharedValue(
animateOnMount ? -1 : _providedIndex
);
- const animatedPosition = useSharedValue(INITIAL_POSITION);
+ const animatedPosition = useSharedValue(initialPosition);
const animatedNextPosition = useSharedValue(INITIAL_VALUE);
const animatedNextPositionIndex = useSharedValue(0);
@@ -281,6 +311,8 @@ const BottomSheetComponent = forwardRef(
animatedScrollableContentOffsetY,
animatedScrollableOverrideState,
isScrollableRefreshable,
+ isScrollableLocked,
+ isScrollEnded,
setScrollableRef,
removeScrollableRef,
} = useScrollable();
@@ -341,15 +373,7 @@ const BottomSheetComponent = forwardRef(
}
return SHEET_STATE.OPENED;
- }, [
- animatedClosedPosition,
- animatedContainerHeight,
- animatedKeyboardHeightInContainer,
- animatedPosition,
- animatedSheetHeight,
- isInTemporaryPosition,
- keyboardBehavior,
- ]);
+ });
const animatedScrollableState = useDerivedValue(() => {
/**
* if scrollable override state is set, then we just return its value.
@@ -373,6 +397,13 @@ const BottomSheetComponent = forwardRef(
return SCROLLABLE_STATE.UNLOCKED;
}
+ /**
+ * if the current scrollable is blocked from translation, unlock scrolling
+ */
+ if (!isScrollableLocked.value) {
+ return SCROLLABLE_STATE.UNLOCKED;
+ }
+
/**
* if keyboard is shown and sheet is animating
* then we do not lock the scrolling to not lose
@@ -388,7 +419,7 @@ const BottomSheetComponent = forwardRef(
return SCROLLABLE_STATE.LOCKED;
});
// dynamic
- const animatedContentHeight = useDerivedValue(() => {
+ const animatedContentHeightMax = useDerivedValue(() => {
const keyboardHeightInContainer = animatedKeyboardHeightInContainer.value;
const handleHeight = Math.max(0, animatedHandleHeight.value);
let contentHeight = animatedSheetHeight.value - handleHeight;
@@ -444,15 +475,7 @@ const BottomSheetComponent = forwardRef(
* @link (https://github.com/gorhom/react-native-bottom-sheet/issues/470)
*/
return Math.max(contentHeight, 0);
- }, [
- animatedContainerHeight,
- animatedHandleHeight,
- animatedKeyboardHeightInContainer,
- animatedKeyboardState,
- animatedSheetHeight,
- isInTemporaryPosition,
- keyboardBehavior,
- ]);
+ });
const animatedIndex = useDerivedValue(() => {
const adjustedSnapPoints = animatedSnapPoints.value.slice().reverse();
const adjustedSnapPointsIndexes = animatedSnapPoints.value
@@ -500,14 +523,14 @@ const BottomSheetComponent = forwardRef(
}
return currentIndex;
- }, [android_keyboardInputMode]);
+ });
//#endregion
//#region private methods
/**
* Calculate the next position based on keyboard state.
*/
- const getNextPosition = useWorkletCallback(
+ const getNextPosition = useCallback(
function getNextPosition() {
'worklet';
const currentIndex = animatedCurrentIndex.value;
@@ -567,6 +590,10 @@ const BottomSheetComponent = forwardRef(
return animatedPosition.value;
}
+ if (!isAnimatedOnMount.value) {
+ return snapPoints[_providedIndex];
+ }
+
return snapPoints[currentIndex];
},
[
@@ -579,12 +606,14 @@ const BottomSheetComponent = forwardRef(
animatedPosition,
animatedSnapPoints,
isInTemporaryPosition,
+ isAnimatedOnMount,
keyboardBehavior,
keyboardBlurBehavior,
+ _providedIndex,
]
);
const handleOnChange = useCallback(
- function handleOnChange(index: number) {
+ function handleOnChange(index: number, position: number) {
print({
component: BottomSheet.name,
method: handleOnChange.name,
@@ -595,15 +624,26 @@ const BottomSheetComponent = forwardRef(
});
if (_providedOnChange) {
- _providedOnChange(index);
+ _providedOnChange(
+ index,
+ position,
+ index === animatedDynamicSnapPointIndex.value
+ ? SNAP_POINT_TYPE.DYNAMIC
+ : SNAP_POINT_TYPE.PROVIDED
+ );
}
},
- [_providedOnChange, animatedCurrentIndex]
+ [_providedOnChange, animatedCurrentIndex, animatedDynamicSnapPointIndex]
);
const handleOnAnimate = useCallback(
- function handleOnAnimate(toPoint: number) {
- const snapPoints = animatedSnapPoints.value;
- const toIndex = snapPoints.indexOf(toPoint);
+ function handleOnAnimate(
+ toPoint: number,
+ source: ANIMATION_SOURCE,
+ snapPoints: number[]
+ ) {
+ const closedPosition = animatedClosedPosition.value;
+ const toIndex =
+ toPoint === closedPosition ? -1 : snapPoints.indexOf(toPoint);
print({
component: BottomSheet.name,
@@ -618,23 +658,28 @@ const BottomSheetComponent = forwardRef(
return;
}
- if (toIndex !== animatedCurrentIndex.value) {
- _providedOnAnimate(animatedCurrentIndex.value, toIndex);
- }
+ _providedOnAnimate(animatedCurrentIndex.value, toIndex, source);
},
- [_providedOnAnimate, animatedSnapPoints, animatedCurrentIndex]
+ [_providedOnAnimate, animatedClosedPosition, animatedCurrentIndex]
);
//#endregion
//#region animation
- const stopAnimation = useWorkletCallback(() => {
+ const stopAnimation = useCallback(() => {
+ 'worklet';
cancelAnimation(animatedPosition);
isForcedClosing.value = false;
animatedAnimationSource.value = ANIMATION_SOURCE.NONE;
animatedAnimationState.value = ANIMATION_STATE.STOPPED;
- }, [animatedPosition, animatedAnimationState, animatedAnimationSource]);
- const animateToPositionCompleted = useWorkletCallback(
+ }, [
+ animatedPosition,
+ isForcedClosing,
+ animatedAnimationSource,
+ animatedAnimationState,
+ ]);
+ const animateToPositionCompleted = useCallback(
function animateToPositionCompleted(isFinished?: boolean) {
+ 'worklet';
isForcedClosing.value = false;
if (!isFinished) {
@@ -654,15 +699,24 @@ const BottomSheetComponent = forwardRef(
animatedAnimationState.value = ANIMATION_STATE.STOPPED;
animatedNextPosition.value = INITIAL_VALUE;
animatedNextPositionIndex.value = INITIAL_VALUE;
- }
+ },
+ [
+ animatedAnimationSource,
+ animatedAnimationState,
+ animatedCurrentIndex,
+ animatedNextPosition,
+ animatedNextPositionIndex,
+ isForcedClosing,
+ ]
);
- const animateToPosition: AnimateToPositionType = useWorkletCallback(
+ const animateToPosition: AnimateToPositionType = useCallback(
function animateToPosition(
position: number,
source: ANIMATION_SOURCE,
velocity: number = 0,
configs?: WithTimingConfig | WithSpringConfig
) {
+ 'worklet';
if (
position === animatedPosition.value ||
position === undefined ||
@@ -677,8 +731,9 @@ const BottomSheetComponent = forwardRef(
method: animateToPosition.name,
params: {
currentPosition: animatedPosition.value,
- position,
+ nextPosition: position,
velocity,
+ source,
},
});
@@ -700,31 +755,79 @@ const BottomSheetComponent = forwardRef(
/**
* fire `onAnimate` callback
*/
- runOnJS(handleOnAnimate)(position);
+ runOnJS(handleOnAnimate)(position, source, animatedSnapPoints.value);
/**
- * force animation configs from parameters, if provided
+ * start animation
*/
- if (configs !== undefined) {
- animatedPosition.value = animate({
- point: position,
- configs,
- velocity,
- onComplete: animateToPositionCompleted,
- });
- } else {
- /**
- * use animationConfigs callback, if provided
- */
- animatedPosition.value = animate({
- point: position,
- velocity,
- configs: _providedAnimationConfigs,
- onComplete: animateToPositionCompleted,
- });
+ animatedPosition.value = animate({
+ point: position,
+ configs: configs || _providedAnimationConfigs,
+ velocity,
+ onComplete: animateToPositionCompleted,
+ });
+ },
+ [
+ animatedPosition,
+ animatedAnimationState,
+ animatedNextPosition,
+ stopAnimation,
+ animatedAnimationSource,
+ animatedNextPositionIndex,
+ animatedSnapPoints,
+ handleOnAnimate,
+ _providedAnimationConfigs,
+ animateToPositionCompleted,
+ ]
+ );
+ /**
+ * Set to position without animation.
+ *
+ * @param targetPosition position to be set.
+ */
+ const setToPosition = useCallback(
+ function setToPosition(targetPosition: number) {
+ 'worklet';
+ if (
+ targetPosition === animatedPosition.value ||
+ targetPosition === undefined ||
+ (animatedAnimationState.value === ANIMATION_STATE.RUNNING &&
+ targetPosition === animatedNextPosition.value)
+ ) {
+ return;
}
+
+ runOnJS(print)({
+ component: BottomSheet.name,
+ method: setToPosition.name,
+ params: {
+ currentPosition: animatedPosition.value,
+ targetPosition,
+ },
+ });
+
+ /**
+ * store next position
+ */
+ animatedNextPosition.value = targetPosition;
+ animatedNextPositionIndex.value =
+ animatedSnapPoints.value.indexOf(targetPosition);
+
+ stopAnimation();
+
+ /**
+ * set position.
+ */
+ animatedPosition.value = targetPosition;
},
- [handleOnAnimate, _providedAnimationConfigs]
+ [
+ animatedAnimationState,
+ animatedNextPosition,
+ animatedNextPositionIndex,
+ animatedPosition,
+ animatedSnapPoints,
+ stopAnimation,
+ ]
);
//#endregion
@@ -788,11 +891,12 @@ const BottomSheetComponent = forwardRef(
animatedNextPositionIndex,
]
);
- const handleSnapToPosition = useWorkletCallback(
+ const handleSnapToPosition = useCallback(
function handleSnapToPosition(
position: number | string,
animationConfigs?: WithSpringConfig | WithTimingConfig
) {
+ 'worklet';
print({
component: BottomSheet.name,
method: handleSnapToPosition.name,
@@ -806,9 +910,7 @@ const BottomSheetComponent = forwardRef(
*/
const nextPosition = normalizeSnapPoint(
position,
- animatedContainerHeight.value,
- topInset,
- bottomInset
+ animatedContainerHeight.value
);
/**
@@ -838,13 +940,12 @@ const BottomSheetComponent = forwardRef(
);
},
[
- animateToPosition,
- bottomInset,
- topInset,
+ animatedContainerHeight,
isLayoutCalculated,
+ animatedNextPosition,
isForcedClosing,
- animatedContainerHeight,
- animatedPosition,
+ isInTemporaryPosition,
+ animateToPosition,
]
);
const handleClose = useCallback(
@@ -1053,6 +1154,7 @@ const BottomSheetComponent = forwardRef(
const internalContextVariables = useMemo(
() => ({
enableContentPanningGesture,
+ enableDynamicSizing,
overDragResistanceFactor,
enableOverDrag,
enablePanDownToClose,
@@ -1079,6 +1181,8 @@ const BottomSheetComponent = forwardRef(
isInTemporaryPosition,
isContentHeightFixed,
isScrollableRefreshable,
+ isScrollableLocked,
+ isScrollEnded,
shouldHandleKeyboardEvents,
simultaneousHandlers: _providedSimultaneousHandlers,
waitFor: _providedWaitFor,
@@ -1114,12 +1218,15 @@ const BottomSheetComponent = forwardRef(
shouldHandleKeyboardEvents,
animatedScrollableContentOffsetY,
isScrollableRefreshable,
+ isScrollableLocked,
+ isScrollEnded,
isContentHeightFixed,
isInTemporaryPosition,
enableContentPanningGesture,
overDragResistanceFactor,
enableOverDrag,
enablePanDownToClose,
+ enableDynamicSizing,
_providedSimultaneousHandlers,
_providedWaitFor,
_providedActiveOffsetX,
@@ -1157,18 +1264,13 @@ const BottomSheetComponent = forwardRef(
//#endregion
//#region styles
- const containerAnimatedStyle = useAnimatedStyle(
- () => ({
- opacity:
- Platform.OS === 'android' && animatedIndex.value === -1 ? 0 : 1,
- transform: [
- {
- translateY: animatedPosition.value,
- },
- ],
- }),
- [animatedPosition, animatedIndex]
- );
+ const containerAnimatedStyle = useAnimatedStyle(() => ({
+ transform: [
+ {
+ translateY: animatedPosition.value,
+ },
+ ],
+ }));
const containerStyle = useMemo(
() => [_providedStyle, styles.container, containerAnimatedStyle],
[_providedStyle, containerAnimatedStyle]
@@ -1182,13 +1284,24 @@ const BottomSheetComponent = forwardRef(
return {};
}
+ /**
+ * if dynamic sizing is enabled, and content height
+ * is still not set, then we exit method.
+ */
+ if (
+ enableDynamicSizing &&
+ animatedContentHeight.value === INITIAL_CONTAINER_HEIGHT
+ ) {
+ return {};
+ }
+
return {
height: animate({
- point: animatedContentHeight.value,
+ point: animatedContentHeightMax.value,
configs: _providedAnimationConfigs,
}),
};
- }, [animatedContentHeight, _providedContentHeight]);
+ });
const contentContainerStyle = useMemo(
() => [styles.contentContainer, contentContainerAnimatedStyle],
[contentContainerAnimatedStyle]
@@ -1207,7 +1320,7 @@ const BottomSheetComponent = forwardRef(
return {
paddingBottom: animatedContainerHeight.value,
};
- }, [detached]);
+ });
const contentMaskContainerStyle = useMemo(
() => [styles.contentMaskContainer, contentMaskContainerAnimatedStyle],
[contentMaskContainerAnimatedStyle]
@@ -1233,12 +1346,12 @@ const BottomSheetComponent = forwardRef(
return;
}
- let nextPosition;
+ let nextPosition: number;
if (_providedIndex === -1) {
nextPosition = animatedClosedPosition.value;
animatedNextPositionIndex.value = -1;
} else {
- nextPosition = animatedSnapPoints.value[_providedIndex];
+ nextPosition = getNextPosition();
}
runOnJS(print)({
@@ -1266,13 +1379,14 @@ const BottomSheetComponent = forwardRef(
}
if (animateOnMount) {
- animateToPosition(nextPosition, ANIMATION_SOURCE.MOUNT);
+ requestAnimationFrame(() => {
+ animateToPosition(nextPosition, ANIMATION_SOURCE.MOUNT);
+ });
} else {
animatedPosition.value = nextPosition;
}
isAnimatedOnMount.value = true;
- },
- [_providedIndex, animateOnMount]
+ }
);
/**
@@ -1291,6 +1405,23 @@ const BottomSheetComponent = forwardRef(
const _previousSnapPoints = _previousResult?.snapPoints;
const _previousContainerHeight = _previousResult?.containerHeight;
+ let nextPosition;
+ let animationConfig;
+ let animationSource = ANIMATION_SOURCE.SNAP_POINT_CHANGE;
+
+ /**
+ * if the bottom sheet is closing and the container gets resized,
+ * then we restart the closing animation to the new position.
+ */
+ if (
+ animatedAnimationState.value === ANIMATION_STATE.RUNNING &&
+ animatedNextPositionIndex.value === -1 &&
+ _previousContainerHeight !== containerHeight
+ ) {
+ setToPosition(containerHeight);
+ return;
+ }
+
if (
JSON.stringify(snapPoints) === JSON.stringify(_previousSnapPoints) ||
!isLayoutCalculated.value ||
@@ -1305,13 +1436,10 @@ const BottomSheetComponent = forwardRef(
method: 'useAnimatedReaction::OnSnapPointChange',
params: {
snapPoints,
+ containerHeight,
},
});
- let nextPosition;
- let animationConfig;
- let animationSource = ANIMATION_SOURCE.SNAP_POINT_CHANGE;
-
/**
* if snap points changed while sheet is animating, then
* we stop the animation and animate to the updated point.
@@ -1333,13 +1461,11 @@ const BottomSheetComponent = forwardRef(
/**
* if snap points changes because of the container height change,
- * then we skip the snap animation by setting the duration to 0.
+ * then we set the new position without animation.
*/
if (containerHeight !== _previousContainerHeight) {
- animationSource = ANIMATION_SOURCE.CONTAINER_RESIZE;
- animationConfig = {
- duration: 0,
- };
+ setToPosition(nextPosition);
+ return;
}
}
animateToPosition(nextPosition, animationSource, 0, animationConfig);
@@ -1354,7 +1480,11 @@ const BottomSheetComponent = forwardRef(
useAnimatedReaction(
() => ({
_keyboardState: animatedKeyboardState.value,
- _keyboardHeight: animatedKeyboardHeight.value,
+ _keyboardHeight:
+ Platform.OS === 'android' &&
+ android_keyboardInputMode === KEYBOARD_INPUT_MODE.adjustResize
+ ? 0
+ : animatedKeyboardHeight.value,
}),
(result, _previousResult) => {
const { _keyboardState, _keyboardHeight } = result;
@@ -1364,44 +1494,66 @@ const BottomSheetComponent = forwardRef(
/**
* Calculate the keyboard height in the container.
*/
- animatedKeyboardHeightInContainer.value = $modal
- ? Math.abs(
- _keyboardHeight -
- Math.abs(bottomInset - animatedContainerOffset.value.bottom)
- )
- : Math.abs(_keyboardHeight - animatedContainerOffset.value.bottom);
+ animatedKeyboardHeightInContainer.value =
+ _keyboardHeight === 0
+ ? 0
+ : $modal
+ ? Math.abs(
+ _keyboardHeight -
+ Math.abs(bottomInset - animatedContainerOffset.value.bottom)
+ )
+ : Math.abs(_keyboardHeight - animatedContainerOffset.value.bottom);
+
+ /**
+ * if keyboard state is equal to the previous state, then exit the method
+ */
+ if (
+ _keyboardState === _previousKeyboardState &&
+ _keyboardHeight === _previousKeyboardHeight
+ ) {
+ return;
+ }
+ /**
+ * if user is interacting with sheet, then exit the method
+ */
const hasActiveGesture =
animatedContentGestureState.value === State.ACTIVE ||
animatedContentGestureState.value === State.BEGAN ||
animatedHandleGestureState.value === State.ACTIVE ||
animatedHandleGestureState.value === State.BEGAN;
+ if (hasActiveGesture) {
+ return;
+ }
+ /**
+ * if sheet not animated on mount yet, then exit the method
+ */
+ if (!isAnimatedOnMount.value) {
+ return;
+ }
+
+ /**
+ * if new keyboard state is hidden and blur behavior is none, then exit the method
+ */
+ if (
+ _keyboardState === KEYBOARD_STATE.HIDDEN &&
+ keyboardBlurBehavior === KEYBOARD_BLUR_BEHAVIOR.none
+ ) {
+ return;
+ }
+
+ /**
+ * if platform is android and the input mode is resize, then exit the method
+ */
if (
- /**
- * if keyboard state is equal to the previous state, then exit the method
- */
- (_keyboardState === _previousKeyboardState &&
- _keyboardHeight === _previousKeyboardHeight) ||
- /**
- * if user is interacting with sheet, then exit the method
- */
- hasActiveGesture ||
- /**
- * if sheet not animated on mount yet, then exit the method
- */
- !isAnimatedOnMount.value ||
- /**
- * if new keyboard state is hidden and blur behavior is none, then exit the method
- */
- (_keyboardState === KEYBOARD_STATE.HIDDEN &&
- keyboardBlurBehavior === KEYBOARD_BLUR_BEHAVIOR.none) ||
- /**
- * if platform is android and the input mode is resize, then exit the method
- */
(Platform.OS === 'android' &&
keyboardBehavior === KEYBOARD_BEHAVIOR.interactive &&
- android_keyboardInputMode === KEYBOARD_INPUT_MODE.adjustResize)
+ android_keyboardInputMode === KEYBOARD_INPUT_MODE.adjustResize) ||
+ /**
+ * if the sheet is closing, then exit then method
+ */
+ animatedNextPositionIndex.value === -1
) {
animatedKeyboardHeightInContainer.value = 0;
return;
@@ -1427,16 +1579,7 @@ const BottomSheetComponent = forwardRef(
0,
animationConfigs
);
- },
- [
- $modal,
- bottomInset,
- keyboardBehavior,
- keyboardBlurBehavior,
- android_keyboardInputMode,
- animatedContainerOffset,
- getNextPosition,
- ]
+ }
);
/**
@@ -1478,6 +1621,7 @@ const BottomSheetComponent = forwardRef(
}),
({
_animatedIndex,
+ _animatedPosition,
_animationState,
_contentGestureState,
_handleGestureState,
@@ -1489,6 +1633,21 @@ const BottomSheetComponent = forwardRef(
return;
}
+ /**
+ * exit the method if index value is not synced with
+ * position value.
+ *
+ * [read more](https://github.com/gorhom/react-native-bottom-sheet/issues/1356)
+ */
+ if (
+ animatedNextPosition.value !== INITIAL_VALUE &&
+ animatedNextPositionIndex.value !== INITIAL_VALUE &&
+ (_animatedPosition !== animatedNextPosition.value ||
+ _animatedIndex !== animatedNextPositionIndex.value)
+ ) {
+ return;
+ }
+
/**
* exit the method if animated index value
* has fraction, e.g. 1.99, 0.52
@@ -1527,7 +1686,7 @@ const BottomSheetComponent = forwardRef(
});
animatedCurrentIndex.value = _animatedIndex;
- runOnJS(handleOnChange)(_animatedIndex);
+ runOnJS(handleOnChange)(_animatedIndex, _animatedPosition);
}
/**
@@ -1544,8 +1703,7 @@ const BottomSheetComponent = forwardRef(
});
runOnJS(_providedOnClose)();
}
- },
- [handleOnChange, _providedOnClose]
+ }
);
/**
@@ -1608,17 +1766,18 @@ const BottomSheetComponent = forwardRef(
- {typeof Content === 'function' ? : Content}
+ {children}
- {footerComponent && (
-
+ {renderFooter && (
+
)}
@@ -1642,14 +1801,16 @@ const BottomSheetComponent = forwardRef(
// topInset,
// bottomInset,
animatedSheetState,
- animatedScrollableState,
- animatedScrollableOverrideState,
+ // animatedScrollableState,
+ // animatedScrollableOverrideState,
// isScrollableRefreshable,
// animatedScrollableContentOffsetY,
// keyboardState,
- // animatedIndex,
- // animatedCurrentIndex,
- // animatedPosition,
+ animatedIndex,
+ animatedCurrentIndex,
+ animatedPosition,
+ animatedHandleGestureState,
+ animatedContentGestureState,
// animatedContainerHeight,
// animatedSheetHeight,
// animatedHandleHeight,
diff --git a/src/components/bottomSheet/constants.ts b/src/components/bottomSheet/constants.ts
index a08599191..f00ce6d3f 100644
--- a/src/components/bottomSheet/constants.ts
+++ b/src/components/bottomSheet/constants.ts
@@ -13,6 +13,7 @@ const DEFAULT_ENABLE_HANDLE_PANNING_GESTURE = true;
const DEFAULT_ENABLE_OVER_DRAG = true;
const DEFAULT_ENABLE_PAN_DOWN_TO_CLOSE = false;
const DEFAULT_ANIMATE_ON_MOUNT = true;
+const DEFAULT_DYNAMIC_SIZING = false;
// keyboard
const DEFAULT_KEYBOARD_BEHAVIOR = KEYBOARD_BEHAVIOR.interactive;
@@ -32,6 +33,11 @@ const INITIAL_CONTAINER_OFFSET = {
const INITIAL_HANDLE_HEIGHT = -999;
const INITIAL_POSITION = SCREEN_HEIGHT;
+// accessibility
+const DEFAULT_ACCESSIBLE = true;
+const DEFAULT_ACCESSIBILITY_LABEL = 'Bottom Sheet';
+const DEFAULT_ACCESSIBILITY_ROLE = 'adjustable';
+
export {
DEFAULT_HANDLE_HEIGHT,
DEFAULT_OVER_DRAG_RESISTANCE_FACTOR,
@@ -39,6 +45,7 @@ export {
DEFAULT_ENABLE_HANDLE_PANNING_GESTURE,
DEFAULT_ENABLE_OVER_DRAG,
DEFAULT_ENABLE_PAN_DOWN_TO_CLOSE,
+ DEFAULT_DYNAMIC_SIZING,
DEFAULT_ANIMATE_ON_MOUNT,
// keyboard
DEFAULT_KEYBOARD_BEHAVIOR,
@@ -51,4 +58,8 @@ export {
INITIAL_HANDLE_HEIGHT,
INITIAL_SNAP_POINT,
INITIAL_VALUE,
+ // accessibility
+ DEFAULT_ACCESSIBLE,
+ DEFAULT_ACCESSIBILITY_LABEL,
+ DEFAULT_ACCESSIBILITY_ROLE,
};
diff --git a/src/components/bottomSheet/types.d.ts b/src/components/bottomSheet/types.d.ts
index c489981e1..0a6deb616 100644
--- a/src/components/bottomSheet/types.d.ts
+++ b/src/components/bottomSheet/types.d.ts
@@ -6,32 +6,27 @@ import type {
WithSpringConfig,
WithTimingConfig,
} from 'react-native-reanimated';
-import type { PanGestureHandlerProps } from 'react-native-gesture-handler';
+import type { PanGesture } from 'react-native-gesture-handler';
import type { BottomSheetHandleProps } from '../bottomSheetHandle';
import type { BottomSheetBackdropProps } from '../bottomSheetBackdrop';
import type { BottomSheetBackgroundProps } from '../bottomSheetBackground';
import type { BottomSheetFooterProps } from '../bottomSheetFooter';
import type {
+ SNAP_POINT_TYPE,
ANIMATION_SOURCE,
KEYBOARD_BEHAVIOR,
KEYBOARD_BLUR_BEHAVIOR,
KEYBOARD_INPUT_MODE,
} from '../../constants';
-import type { GestureEventsHandlersHookType } from '../../types';
+import type {
+ GestureEventsHandlersHookType,
+ NullableAccessibilityProps,
+} from '../../types';
export interface BottomSheetProps
extends BottomSheetAnimationConfigs,
- Partial<
- Pick<
- PanGestureHandlerProps,
- | 'activeOffsetY'
- | 'activeOffsetX'
- | 'failOffsetY'
- | 'failOffsetX'
- | 'waitFor'
- | 'simultaneousHandlers'
- >
- > {
+ Partial,
+ Omit {
//#region configuration
/**
* Initial snap point index, provide `-1` to initiate bottom sheet in closed state.
@@ -42,13 +37,21 @@ export interface BottomSheetProps
/**
* Points for the bottom sheet to snap to. It accepts array of number, string or mix.
* String values should be a percentage.
+ *
+ * ⚠️ This prop is required unless you set `enableDynamicSizing` to `true`.
* @example
* snapPoints={[200, 500]}
* snapPoints={[200, '%50']}
* snapPoints={['%100']}
* @type Array
*/
- snapPoints: Array | SharedValue>;
+ snapPoints?: Array | SharedValue>;
+ /**
+ * Initial position of the sheet.
+ * @type number
+ * @default SCREEN_HEIGHT
+ */
+ initialPosition?: number;
/**
* Defines how violently sheet has to be stopped while over dragging.
* @type number
@@ -85,6 +88,13 @@ export interface BottomSheetProps
* @default false
*/
enablePanDownToClose?: boolean;
+ /**
+ * Enable dynamic sizing for content view and scrollable
+ * content size.
+ * @type boolean
+ * @default false
+ */
+ enableDynamicSizing?: boolean;
/**
* To start the sheet closed and snap to initial index when it's mounted.
* @type boolean
@@ -98,7 +108,7 @@ export interface BottomSheetProps
* Handle height helps to calculate the internal container and sheet layouts,
* if `handleComponent` is provided, the library internally will calculate its layout,
* unless `handleHeight` is provided.
- * @type number
+ * @type number | SharedValue;
*/
handleHeight?: number | SharedValue;
/**
@@ -133,6 +143,13 @@ export interface BottomSheetProps
* @default 0
*/
bottomInset?: number;
+ /**
+ * Max dynamic content size height to limit the bottom sheet height
+ * from exceeding a provided size.
+ * @type number
+ * @default container height
+ */
+ maxDynamicContentSize?: number;
//#endregion
//#region keyboard
@@ -240,7 +257,7 @@ export interface BottomSheetProps
*
* @type (index: number) => void;
*/
- onChange?: (index: number) => void;
+ onChange?: (index: number, position: number, type: SNAP_POINT_TYPE) => void;
/**
* Callback when the sheet close.
*
@@ -250,9 +267,13 @@ export interface BottomSheetProps
/**
* Callback when the sheet about to animate to a new position.
*
- * @type (fromIndex: number, toIndex: number) => void;
+ * @type (fromIndex: number, toIndex: number, source: ANIMATION_SOURCE) => void;
*/
- onAnimate?: (fromIndex: number, toIndex: number) => void;
+ onAnimate?: (
+ fromIndex: number,
+ toIndex: number,
+ source: ANIMATION_SOURCE
+ ) => void;
//#endregion
//#region components
@@ -276,16 +297,16 @@ export interface BottomSheetProps
*/
backgroundComponent?: React.FC | null;
/**
- * Component to be placed as a footer.
+ * Function to render as the footer.
* @see {BottomSheetFooterProps}
- * @type React.FC\
+ * @type (props: BottomSheetFooterProps) => React.ReactElement | null;
*/
- footerComponent?: React.FC;
+ renderFooter?: (props: BottomSheetFooterProps) => React.ReactElement | null;
/**
* A scrollable node or normal view.
- * @type React.ReactNode[] | React.ReactNode
+ * @type React.ReactNode
*/
- children: (() => React.ReactNode) | React.ReactNode[] | React.ReactNode;
+ children: React.ReactNode;
//#endregion
//#region private
@@ -313,3 +334,16 @@ export type AnimateToPositionType = (
velocity?: number,
configs?: WithTimingConfig | WithSpringConfig
) => void;
+
+export type BottomSheetGestureProps = {
+ activeOffsetX: Parameters[0];
+ activeOffsetY: Parameters[0];
+
+ failOffsetY: Parameters[0];
+ failOffsetX: Parameters[0];
+
+ simultaneousHandlers: Parameters<
+ PanGesture['simultaneousWithExternalGesture']
+ >[0];
+ waitFor: Parameters[0];
+};
diff --git a/src/components/bottomSheetBackdrop/BottomSheetBackdrop.tsx b/src/components/bottomSheetBackdrop/BottomSheetBackdrop.tsx
index 35597ce60..c5b5e85b9 100644
--- a/src/components/bottomSheetBackdrop/BottomSheetBackdrop.tsx
+++ b/src/components/bottomSheetBackdrop/BottomSheetBackdrop.tsx
@@ -1,17 +1,20 @@
-import React, { memo, useCallback, useMemo, useState } from 'react';
-import { ViewProps } from 'react-native';
+import React, {
+ memo,
+ useCallback,
+ useEffect,
+ useMemo,
+ useRef,
+ useState,
+} from 'react';
+import type { ViewProps } from 'react-native';
import Animated, {
interpolate,
- Extrapolate,
useAnimatedStyle,
useAnimatedReaction,
- useAnimatedGestureHandler,
runOnJS,
+ Extrapolation,
} from 'react-native-reanimated';
-import {
- TapGestureHandler,
- TapGestureHandlerGestureEvent,
-} from 'react-native-gesture-handler';
+import { Gesture, GestureDetector } from 'react-native-gesture-handler';
import { useBottomSheet } from '../../hooks';
import {
DEFAULT_OPACITY,
@@ -19,6 +22,10 @@ import {
DEFAULT_DISAPPEARS_ON_INDEX,
DEFAULT_ENABLE_TOUCH_THROUGH,
DEFAULT_PRESS_BEHAVIOR,
+ DEFAULT_ACCESSIBLE,
+ DEFAULT_ACCESSIBILITY_ROLE,
+ DEFAULT_ACCESSIBILITY_LABEL,
+ DEFAULT_ACCESSIBILITY_HINT,
} from './constants';
import { styles } from './styles';
import type { BottomSheetDefaultBackdropProps } from './types';
@@ -33,9 +40,14 @@ const BottomSheetBackdropComponent = ({
onPress,
style,
children,
+ accessible: _providedAccessible = DEFAULT_ACCESSIBLE,
+ accessibilityRole: _providedAccessibilityRole = DEFAULT_ACCESSIBILITY_ROLE,
+ accessibilityLabel: _providedAccessibilityLabel = DEFAULT_ACCESSIBILITY_LABEL,
+ accessibilityHint: _providedAccessibilityHint = DEFAULT_ACCESSIBILITY_HINT,
}: BottomSheetDefaultBackdropProps) => {
//#region hooks
const { snapToIndex, close } = useBottomSheet();
+ const isMounted = useRef(false);
//#endregion
//#region defaults
@@ -67,22 +79,20 @@ const BottomSheetBackdropComponent = ({
}, [snapToIndex, close, disappearsOnIndex, pressBehavior, onPress]);
const handleContainerTouchability = useCallback(
(shouldDisableTouchability: boolean) => {
- setPointerEvents(shouldDisableTouchability ? 'none' : 'auto');
+ isMounted.current &&
+ setPointerEvents(shouldDisableTouchability ? 'none' : 'auto');
},
[]
);
//#endregion
//#region tap gesture
- const gestureHandler =
- useAnimatedGestureHandler(
- {
- onFinish: () => {
- runOnJS(handleOnPress)();
- },
- },
- [handleOnPress]
- );
+ const tapHandler = useMemo(() => {
+ let gesture = Gesture.Tap().onEnd(() => {
+ runOnJS(handleOnPress)();
+ });
+ return gesture;
+ }, [handleOnPress]);
//#endregion
//#region styles
@@ -91,7 +101,7 @@ const BottomSheetBackdropComponent = ({
animatedIndex.value,
[-1, disappearsOnIndex, appearsOnIndex],
[0, 0, opacity],
- Extrapolate.CLAMP
+ Extrapolation.CLAMP
),
flex: 1,
}));
@@ -109,31 +119,43 @@ const BottomSheetBackdropComponent = ({
return;
}
runOnJS(handleContainerTouchability)(shouldDisableTouchability);
- },
- [disappearsOnIndex]
+ }
);
+
+ // addressing updating the state after unmounting.
+ // [link](https://github.com/gorhom/react-native-bottom-sheet/issues/1376)
+ useEffect(() => {
+ isMounted.current = true;
+ return () => {
+ isMounted.current = false;
+ };
+ }, []);
//#endregion
- return pressBehavior !== 'none' ? (
-
-
- {children}
-
-
- ) : (
-
+ const AnimatedView = (
+
{children}
);
+
+ return pressBehavior !== 'none' ? (
+ {AnimatedView}
+ ) : (
+ AnimatedView
+ );
};
const BottomSheetBackdrop = memo(BottomSheetBackdropComponent);
diff --git a/src/components/bottomSheetBackdrop/constants.ts b/src/components/bottomSheetBackdrop/constants.ts
index c2388dbb7..bf6f23dd8 100644
--- a/src/components/bottomSheetBackdrop/constants.ts
+++ b/src/components/bottomSheetBackdrop/constants.ts
@@ -4,10 +4,19 @@ const DEFAULT_DISAPPEARS_ON_INDEX = 0;
const DEFAULT_ENABLE_TOUCH_THROUGH = false;
const DEFAULT_PRESS_BEHAVIOR = 'close' as const;
+const DEFAULT_ACCESSIBLE = true;
+const DEFAULT_ACCESSIBILITY_ROLE = 'button';
+const DEFAULT_ACCESSIBILITY_LABEL = 'Bottom sheet backdrop';
+const DEFAULT_ACCESSIBILITY_HINT = 'Tap to close the bottom sheet';
+
export {
DEFAULT_OPACITY,
DEFAULT_APPEARS_ON_INDEX,
DEFAULT_DISAPPEARS_ON_INDEX,
DEFAULT_ENABLE_TOUCH_THROUGH,
DEFAULT_PRESS_BEHAVIOR,
+ DEFAULT_ACCESSIBLE,
+ DEFAULT_ACCESSIBILITY_ROLE,
+ DEFAULT_ACCESSIBILITY_LABEL,
+ DEFAULT_ACCESSIBILITY_HINT,
};
diff --git a/src/components/bottomSheetBackdrop/types.d.ts b/src/components/bottomSheetBackdrop/types.d.ts
index 6a33b9a73..59ea6c4c1 100644
--- a/src/components/bottomSheetBackdrop/types.d.ts
+++ b/src/components/bottomSheetBackdrop/types.d.ts
@@ -1,6 +1,9 @@
import { ReactNode } from 'react';
import type { ViewProps } from 'react-native';
-import type { BottomSheetVariables } from '../../types';
+import type {
+ BottomSheetVariables,
+ NullableAccessibilityProps,
+} from '../../types';
export interface BottomSheetBackdropProps
extends Pick,
@@ -9,7 +12,8 @@ export interface BottomSheetBackdropProps
export type BackdropPressBehavior = 'none' | 'close' | 'collapse' | number;
export interface BottomSheetDefaultBackdropProps
- extends BottomSheetBackdropProps {
+ extends BottomSheetBackdropProps,
+ NullableAccessibilityProps {
/**
* Backdrop opacity.
* @type number
diff --git a/src/components/bottomSheetContainer/BottomSheetContainer.tsx b/src/components/bottomSheetContainer/BottomSheetContainer.tsx
index 9d42ef185..ffcd5448a 100644
--- a/src/components/bottomSheetContainer/BottomSheetContainer.tsx
+++ b/src/components/bottomSheetContainer/BottomSheetContainer.tsx
@@ -49,12 +49,13 @@ function BottomSheetContainerComponent({
containerRef.current?.measure(
(_x, _y, _width, _height, _pageX, pageY) => {
containerOffset.value = {
- top: pageY,
+ top: pageY ?? 0,
left: 0,
right: 0,
bottom: Math.max(
0,
- WINDOW_HEIGHT - (pageY + height + (StatusBar.currentHeight ?? 0))
+ WINDOW_HEIGHT -
+ ((pageY ?? 0) + height + (StatusBar.currentHeight ?? 0))
),
};
}
diff --git a/src/components/bottomSheetContainer/styles.ts b/src/components/bottomSheetContainer/styles.ts
index 04f247de5..4968b3731 100644
--- a/src/components/bottomSheetContainer/styles.ts
+++ b/src/components/bottomSheetContainer/styles.ts
@@ -1,7 +1,8 @@
import { StyleSheet } from 'react-native';
export const styles = StyleSheet.create({
- container: {
- ...StyleSheet.absoluteFillObject,
+ root: {
+ flex: 1,
},
+ container: StyleSheet.absoluteFillObject,
});
diff --git a/src/components/bottomSheetContainer/styles.web.ts b/src/components/bottomSheetContainer/styles.web.ts
index 086ed0d0c..42836a23f 100644
--- a/src/components/bottomSheetContainer/styles.web.ts
+++ b/src/components/bottomSheetContainer/styles.web.ts
@@ -2,8 +2,7 @@ import { StyleSheet } from 'react-native';
export const styles = StyleSheet.create({
container: {
- // @ts-ignore
- position: 'fixed',
+ position: 'absolute',
left: 0,
right: 0,
bottom: 0,
diff --git a/src/components/bottomSheetContainer/types.d.ts b/src/components/bottomSheetContainer/types.d.ts
index a2193eddb..8da85aa70 100644
--- a/src/components/bottomSheetContainer/types.d.ts
+++ b/src/components/bottomSheetContainer/types.d.ts
@@ -1,14 +1,14 @@
import type { ReactNode } from 'react';
import type { Insets, StyleProp, ViewStyle } from 'react-native';
-import type Animated from 'react-native-reanimated';
+import type { SharedValue } from 'react-native-reanimated';
import type { BottomSheetProps } from '../bottomSheet/types';
export interface BottomSheetContainerProps
extends Partial<
Pick
> {
- containerHeight: Animated.SharedValue;
- containerOffset: Animated.SharedValue;
+ containerHeight: SharedValue;
+ containerOffset: SharedValue;
shouldCalculateHeight?: boolean;
style?: StyleProp;
children: ReactNode;
diff --git a/src/components/bottomSheetDebugView/BottomSheetDebugView.tsx b/src/components/bottomSheetDebugView/BottomSheetDebugView.tsx
index 8919606cb..1836465a5 100644
--- a/src/components/bottomSheetDebugView/BottomSheetDebugView.tsx
+++ b/src/components/bottomSheetDebugView/BottomSheetDebugView.tsx
@@ -1,11 +1,11 @@
import React from 'react';
import { View } from 'react-native';
-import Animated from 'react-native-reanimated';
+import type { SharedValue } from 'react-native-reanimated';
import ReText from './ReText';
import { styles } from './styles';
interface BottomSheetDebugViewProps {
- values: Record | number>;
+ values: Record | number>;
}
const BottomSheetDebugView = ({ values }: BottomSheetDebugViewProps) => {
diff --git a/src/components/bottomSheetDebugView/ReText.tsx b/src/components/bottomSheetDebugView/ReText.tsx
index 9d7b1cdb7..de201c9ce 100644
--- a/src/components/bottomSheetDebugView/ReText.tsx
+++ b/src/components/bottomSheetDebugView/ReText.tsx
@@ -3,16 +3,20 @@ import { TextProps as RNTextProps, TextInput } from 'react-native';
import Animated, {
useAnimatedProps,
useDerivedValue,
+ type SharedValue,
+ type AnimatedProps,
} from 'react-native-reanimated';
interface TextProps {
text: string;
- value: Animated.SharedValue | number;
- style?: Animated.AnimateProps['style'];
+ value: SharedValue | number;
+ style?: AnimatedProps['style'];
}
const AnimatedTextInput = Animated.createAnimatedComponent(TextInput);
+Animated.addWhitelistedNativeProps({ text: true });
+
const ReText = (props: TextProps) => {
const { text, value: _providedValue, style } = { style: {}, ...props };
const providedValue = useDerivedValue(() =>
@@ -26,7 +30,7 @@ const ReText = (props: TextProps) => {
return {
text: `${text}: ${providedValue.value}`,
};
- }, [providedValue]);
+ });
return (
| number;
+ style?: AnimatedProps['style'];
+}
+
+const AnimatedTextInput = Animated.createAnimatedComponent(TextInput);
+
+const ReText = (props: TextProps) => {
+ const { text, value: _providedValue, style } = { style: {}, ...props };
+ const textRef = useRef(null);
+
+ const providedValue = useDerivedValue(() => {
+ const value =
+ typeof _providedValue === 'number'
+ ? _providedValue
+ : typeof _providedValue.value === 'number'
+ ? _providedValue.value.toFixed(2)
+ : _providedValue.value;
+
+ return `${text}: ${value}`;
+ });
+
+ //region effects
+ useAnimatedReaction(
+ () => providedValue.value,
+ result => {
+ textRef.current?.setNativeProps({
+ text: result,
+ });
+ }
+ );
+ //endregion
+
+ return (
+
+ );
+};
+
+export default ReText;
diff --git a/src/components/bottomSheetDebugView/styles.web.ts b/src/components/bottomSheetDebugView/styles.web.ts
new file mode 100644
index 000000000..d77bfdc0b
--- /dev/null
+++ b/src/components/bottomSheetDebugView/styles.web.ts
@@ -0,0 +1,20 @@
+import { StyleSheet } from 'react-native';
+
+export const styles = StyleSheet.create({
+ container: {
+ position: 'absolute',
+ left: 4,
+ top: 80,
+ padding: 2,
+ width: 400,
+ backgroundColor: 'rgba(0, 0,0,0.5)',
+ },
+ text: {
+ fontSize: 14,
+ lineHeight: 16,
+ textAlignVertical: 'center',
+ height: 20,
+ padding: 0,
+ color: 'white',
+ },
+});
diff --git a/src/components/bottomSheetDraggableView/BottomSheetDraggableView.tsx b/src/components/bottomSheetDraggableView/BottomSheetDraggableView.tsx
index 377b2d5a8..ec137bb5f 100644
--- a/src/components/bottomSheetDraggableView/BottomSheetDraggableView.tsx
+++ b/src/components/bottomSheetDraggableView/BottomSheetDraggableView.tsx
@@ -1,15 +1,14 @@
-import React, { useMemo, useRef, memo } from 'react';
+import React, { useMemo, memo } from 'react';
import Animated from 'react-native-reanimated';
-import { PanGestureHandler } from 'react-native-gesture-handler';
+import { GestureDetector, Gesture } from 'react-native-gesture-handler';
import {
useBottomSheetGestureHandlers,
useBottomSheetInternal,
} from '../../hooks';
-import { GESTURE_SOURCE } from '../../constants';
import type { BottomSheetDraggableViewProps } from './types';
+import { BottomSheetDraggableContext } from '../../contexts/gesture';
const BottomSheetDraggableViewComponent = ({
- gestureType = GESTURE_SOURCE.CONTENT,
nativeGestureRef,
refreshControlGestureRef,
style,
@@ -26,19 +25,10 @@ const BottomSheetDraggableViewComponent = ({
failOffsetX,
failOffsetY,
} = useBottomSheetInternal();
- const { contentPanGestureHandler, scrollablePanGestureHandler } =
- useBottomSheetGestureHandlers();
+ const { contentPanGestureHandler } = useBottomSheetGestureHandlers();
//#endregion
//#region variables
- const panGestureRef = useRef(null);
- const gestureHandler = useMemo(
- () =>
- gestureType === GESTURE_SOURCE.CONTENT
- ? contentPanGestureHandler
- : scrollablePanGestureHandler,
- [gestureType, contentPanGestureHandler, scrollablePanGestureHandler]
- );
const simultaneousHandlers = useMemo(() => {
const refs = [];
@@ -64,25 +54,66 @@ const BottomSheetDraggableViewComponent = ({
nativeGestureRef,
refreshControlGestureRef,
]);
+ const draggableGesture = useMemo(() => {
+ let gesture = Gesture.Pan()
+ .enabled(enableContentPanningGesture)
+ .shouldCancelWhenOutside(false)
+ .runOnJS(false)
+ .onStart(contentPanGestureHandler.handleOnStart)
+ .onChange(contentPanGestureHandler.handleOnChange)
+ .onEnd(contentPanGestureHandler.handleOnEnd)
+ .onFinalize(contentPanGestureHandler.handleOnFinalize);
+
+ if (waitFor) {
+ gesture = gesture.requireExternalGestureToFail(waitFor);
+ }
+
+ if (simultaneousHandlers) {
+ gesture = gesture.simultaneousWithExternalGesture(
+ simultaneousHandlers as any
+ );
+ }
+
+ if (activeOffsetX) {
+ gesture = gesture.activeOffsetX(activeOffsetX);
+ }
+
+ if (activeOffsetY) {
+ gesture = gesture.activeOffsetY(activeOffsetY);
+ }
+
+ if (failOffsetX) {
+ gesture = gesture.failOffsetX(failOffsetX);
+ }
+
+ if (failOffsetY) {
+ gesture = gesture.failOffsetY(failOffsetY);
+ }
+
+ return gesture;
+ }, [
+ activeOffsetX,
+ activeOffsetY,
+ enableContentPanningGesture,
+ failOffsetX,
+ failOffsetY,
+ simultaneousHandlers,
+ waitFor,
+ contentPanGestureHandler.handleOnChange,
+ contentPanGestureHandler.handleOnEnd,
+ contentPanGestureHandler.handleOnFinalize,
+ contentPanGestureHandler.handleOnStart,
+ ]);
//#endregion
return (
-
-
- {children}
-
-
+
+
+
+ {children}
+
+
+
);
};
diff --git a/src/components/bottomSheetDraggableView/types.d.ts b/src/components/bottomSheetDraggableView/types.d.ts
index 8d38987e2..5ed61d78c 100644
--- a/src/components/bottomSheetDraggableView/types.d.ts
+++ b/src/components/bottomSheetDraggableView/types.d.ts
@@ -1,17 +1,9 @@
-import type { ReactNode, Ref } from 'react';
+import type { ReactNode } from 'react';
import type { ViewProps as RNViewProps } from 'react-native';
-import type { NativeViewGestureHandler } from 'react-native-gesture-handler';
-import type { GESTURE_SOURCE } from '../../constants';
+import type { GestureRef } from 'react-native-gesture-handler/lib/typescript/handlers/gestures/gesture';
export type BottomSheetDraggableViewProps = RNViewProps & {
- /**
- * Defines the gesture type of the draggable view.
- *
- * @default GESTURE_SOURCE.CONTENT
- * @type GESTURE_SOURCE
- */
- gestureType?: GESTURE_SOURCE;
- nativeGestureRef?: Ref | null;
- refreshControlGestureRef?: Ref | null;
+ nativeGestureRef?: Exclude;
+ refreshControlGestureRef?: Exclude;
children: ReactNode[] | ReactNode;
};
diff --git a/src/components/bottomSheetFooter/BottomSheetFooter.tsx b/src/components/bottomSheetFooter/BottomSheetFooter.tsx
index fff8d6448..4b5db26cf 100644
--- a/src/components/bottomSheetFooter/BottomSheetFooter.tsx
+++ b/src/components/bottomSheetFooter/BottomSheetFooter.tsx
@@ -1,5 +1,5 @@
import React, { memo, useCallback, useMemo } from 'react';
-import { LayoutChangeEvent } from 'react-native';
+import type { LayoutChangeEvent } from 'react-native';
import Animated, { useAnimatedStyle } from 'react-native-reanimated';
import { KEYBOARD_STATE } from '../../constants';
import { useBottomSheetInternal } from '../../hooks';
@@ -35,7 +35,7 @@ function BottomSheetFooterComponent({
},
],
};
- }, [bottomInset, animatedKeyboardState, animatedFooterPosition]);
+ });
const containerStyle = useMemo(
() => [styles.container, style, containerAnimatedStyle],
[style, containerAnimatedStyle]
@@ -56,12 +56,8 @@ function BottomSheetFooterComponent({
//#endregion
return children !== null ? (
-
- {typeof children === 'function' ? children() : children}
+
+ {children}
) : null;
}
diff --git a/src/components/bottomSheetFooter/styles.ts b/src/components/bottomSheetFooter/styles.ts
index 8d7db06a3..278f702e3 100644
--- a/src/components/bottomSheetFooter/styles.ts
+++ b/src/components/bottomSheetFooter/styles.ts
@@ -7,5 +7,6 @@ export const styles = StyleSheet.create({
left: 0,
right: 0,
zIndex: 9999,
+ pointerEvents: 'box-none',
},
});
diff --git a/src/components/bottomSheetFooter/types.d.ts b/src/components/bottomSheetFooter/types.d.ts
index f523065f7..2cc6d8297 100644
--- a/src/components/bottomSheetFooter/types.d.ts
+++ b/src/components/bottomSheetFooter/types.d.ts
@@ -1,14 +1,14 @@
import type { ReactNode } from 'react';
import { ViewStyle } from 'react-native';
-import type Animated from 'react-native-reanimated';
+import type { SharedValue } from 'react-native-reanimated';
export interface BottomSheetFooterProps {
/**
* Calculated footer animated position.
*
- * @type Animated.SharedValue
+ * @type SharedValue
*/
- animatedFooterPosition: Animated.SharedValue;
+ animatedFooterPosition: SharedValue;
}
export interface BottomSheetDefaultFooterProps extends BottomSheetFooterProps {
@@ -31,7 +31,7 @@ export interface BottomSheetDefaultFooterProps extends BottomSheetFooterProps {
/**
* Component to be placed in the footer.
*
- * @type {ReactNode | ReactNode[]}
+ * @type {ReactNode|ReactNode[]}
*/
children?: ReactNode | ReactNode[];
}
diff --git a/src/components/bottomSheetFooterContainer/BottomSheetFooterContainer.tsx b/src/components/bottomSheetFooterContainer/BottomSheetFooterContainer.tsx
index 0ddd8e01a..ef1ae2974 100644
--- a/src/components/bottomSheetFooterContainer/BottomSheetFooterContainer.tsx
+++ b/src/components/bottomSheetFooterContainer/BottomSheetFooterContainer.tsx
@@ -1,11 +1,11 @@
-import React, { memo } from 'react';
+import { memo } from 'react';
import { useDerivedValue } from 'react-native-reanimated';
import { useBottomSheetInternal } from '../../hooks';
import { KEYBOARD_STATE } from '../../constants';
import type { BottomSheetFooterContainerProps } from './types';
const BottomSheetFooterContainerComponent = ({
- footerComponent: FooterComponent,
+ renderFooter,
}: BottomSheetFooterContainerProps) => {
//#region hooks
const {
@@ -36,17 +36,10 @@ const BottomSheetFooterContainerComponent = ({
animatedHandleHeight.value;
return footerTranslateY;
- }, [
- animatedKeyboardHeightInContainer,
- animatedContainerHeight,
- animatedPosition,
- animatedKeyboardState,
- animatedFooterHeight,
- animatedHandleHeight,
- ]);
+ });
//#endregion
- return ;
+ return renderFooter({ animatedFooterPosition });
};
const BottomSheetFooterContainer = memo(BottomSheetFooterContainerComponent);
diff --git a/src/components/bottomSheetFooterContainer/types.d.ts b/src/components/bottomSheetFooterContainer/types.d.ts
index 2ba8cf705..742c560ae 100644
--- a/src/components/bottomSheetFooterContainer/types.d.ts
+++ b/src/components/bottomSheetFooterContainer/types.d.ts
@@ -1,4 +1,4 @@
import type { BottomSheetProps } from '../bottomSheet';
export interface BottomSheetFooterContainerProps
- extends Required> {}
+ extends Required> {}
diff --git a/src/components/bottomSheetGestureHandlersProvider/BottomSheetGestureHandlersProvider.tsx b/src/components/bottomSheetGestureHandlersProvider/BottomSheetGestureHandlersProvider.tsx
index e3314b812..9e2a8ca7b 100644
--- a/src/components/bottomSheetGestureHandlersProvider/BottomSheetGestureHandlersProvider.tsx
+++ b/src/components/bottomSheetGestureHandlersProvider/BottomSheetGestureHandlersProvider.tsx
@@ -23,7 +23,7 @@ const BottomSheetGestureHandlersProvider = ({
//#region hooks
const { animatedContentGestureState, animatedHandleGestureState } =
useBottomSheetInternal();
- const { handleOnStart, handleOnActive, handleOnEnd } =
+ const { handleOnStart, handleOnChange, handleOnEnd, handleOnFinalize } =
useGestureEventsHandlers();
//#endregion
@@ -33,17 +33,9 @@ const BottomSheetGestureHandlersProvider = ({
animatedContentGestureState,
animatedGestureSource,
handleOnStart,
- handleOnActive,
- handleOnEnd
- );
-
- const scrollablePanGestureHandler = useGestureHandler(
- GESTURE_SOURCE.SCROLLABLE,
- animatedContentGestureState,
- animatedGestureSource,
- handleOnStart,
- handleOnActive,
- handleOnEnd
+ handleOnChange,
+ handleOnEnd,
+ handleOnFinalize
);
const handlePanGestureHandler = useGestureHandler(
@@ -51,8 +43,9 @@ const BottomSheetGestureHandlersProvider = ({
animatedHandleGestureState,
animatedGestureSource,
handleOnStart,
- handleOnActive,
- handleOnEnd
+ handleOnChange,
+ handleOnEnd,
+ handleOnFinalize
);
//#endregion
@@ -61,15 +54,9 @@ const BottomSheetGestureHandlersProvider = ({
() => ({
contentPanGestureHandler,
handlePanGestureHandler,
- scrollablePanGestureHandler,
animatedGestureSource,
}),
- [
- contentPanGestureHandler,
- handlePanGestureHandler,
- scrollablePanGestureHandler,
- animatedGestureSource,
- ]
+ [contentPanGestureHandler, handlePanGestureHandler, animatedGestureSource]
);
//#endregion
return (
diff --git a/src/components/bottomSheetHandle/BottomSheetHandle.tsx b/src/components/bottomSheetHandle/BottomSheetHandle.tsx
index ea9800571..1bff735d7 100644
--- a/src/components/bottomSheetHandle/BottomSheetHandle.tsx
+++ b/src/components/bottomSheetHandle/BottomSheetHandle.tsx
@@ -2,11 +2,21 @@ import React, { memo, useMemo } from 'react';
import Animated from 'react-native-reanimated';
import { styles } from './styles';
import type { BottomSheetDefaultHandleProps } from './types';
+import {
+ DEFAULT_ACCESSIBLE,
+ DEFAULT_ACCESSIBILITY_ROLE,
+ DEFAULT_ACCESSIBILITY_LABEL,
+ DEFAULT_ACCESSIBILITY_HINT,
+} from './constants';
const BottomSheetHandleComponent = ({
style,
indicatorStyle: _indicatorStyle,
children,
+ accessible = DEFAULT_ACCESSIBLE,
+ accessibilityRole = DEFAULT_ACCESSIBILITY_ROLE,
+ accessibilityLabel = DEFAULT_ACCESSIBILITY_LABEL,
+ accessibilityHint = DEFAULT_ACCESSIBILITY_HINT,
}: BottomSheetDefaultHandleProps) => {
// styles
const containerStyle = useMemo(
@@ -23,7 +33,13 @@ const BottomSheetHandleComponent = ({
// render
return (
-
+
{children}
diff --git a/src/components/bottomSheetHandle/constants.ts b/src/components/bottomSheetHandle/constants.ts
new file mode 100644
index 000000000..98d76c1a8
--- /dev/null
+++ b/src/components/bottomSheetHandle/constants.ts
@@ -0,0 +1,12 @@
+const DEFAULT_ACCESSIBLE = true;
+const DEFAULT_ACCESSIBILITY_ROLE = 'adjustable';
+const DEFAULT_ACCESSIBILITY_LABEL = 'Bottom sheet handle';
+const DEFAULT_ACCESSIBILITY_HINT =
+ 'Drag up or down to extend or minimize the bottom sheet';
+
+export {
+ DEFAULT_ACCESSIBLE,
+ DEFAULT_ACCESSIBILITY_ROLE,
+ DEFAULT_ACCESSIBILITY_LABEL,
+ DEFAULT_ACCESSIBILITY_HINT,
+};
diff --git a/src/components/bottomSheetHandle/types.d.ts b/src/components/bottomSheetHandle/types.d.ts
index 20cc2bc20..b36cf5968 100644
--- a/src/components/bottomSheetHandle/types.d.ts
+++ b/src/components/bottomSheetHandle/types.d.ts
@@ -1,11 +1,16 @@
import type React from 'react';
import type { ViewProps } from 'react-native';
import type { AnimateProps } from 'react-native-reanimated';
-import type { BottomSheetVariables } from '../../types';
+import type {
+ BottomSheetVariables,
+ NullableAccessibilityProps,
+} from '../../types';
export interface BottomSheetHandleProps extends BottomSheetVariables {}
-export interface BottomSheetDefaultHandleProps extends BottomSheetHandleProps {
+export interface BottomSheetDefaultHandleProps
+ extends BottomSheetHandleProps,
+ NullableAccessibilityProps {
/**
* View style to be applied to the handle container.
* @type Animated.AnimateStyle | ViewStyle
diff --git a/src/components/bottomSheetHandleContainer/BottomSheetHandleContainer.tsx b/src/components/bottomSheetHandleContainer/BottomSheetHandleContainer.tsx
index 2219e0f1d..b9620afe2 100644
--- a/src/components/bottomSheetHandleContainer/BottomSheetHandleContainer.tsx
+++ b/src/components/bottomSheetHandleContainer/BottomSheetHandleContainer.tsx
@@ -1,6 +1,6 @@
import React, { memo, useCallback, useMemo } from 'react';
import type { LayoutChangeEvent } from 'react-native';
-import { PanGestureHandler } from 'react-native-gesture-handler';
+import { Gesture, GestureDetector } from 'react-native-gesture-handler';
import Animated from 'react-native-reanimated';
import BottomSheetHandle from '../bottomSheetHandle';
import {
@@ -8,6 +8,7 @@ import {
useBottomSheetInternal,
} from '../../hooks';
import { print } from '../../utilities';
+import { styles } from './styles';
import type { BottomSheetHandleContainerProps } from './types';
function BottomSheetHandleContainerComponent({
@@ -50,6 +51,57 @@ function BottomSheetHandleContainerComponent({
return refs;
}, [_providedSimultaneousHandlers, _internalSimultaneousHandlers]);
+
+ const panGesture = useMemo(() => {
+ let gesture = Gesture.Pan()
+ .enabled(enableHandlePanningGesture!)
+ .shouldCancelWhenOutside(false)
+ .runOnJS(false)
+ .onStart(handlePanGestureHandler.handleOnStart)
+ .onChange(handlePanGestureHandler.handleOnChange)
+ .onEnd(handlePanGestureHandler.handleOnEnd)
+ .onFinalize(handlePanGestureHandler.handleOnFinalize);
+
+ if (waitFor) {
+ gesture = gesture.requireExternalGestureToFail(waitFor);
+ }
+
+ if (simultaneousHandlers) {
+ gesture = gesture.simultaneousWithExternalGesture(
+ simultaneousHandlers as any
+ );
+ }
+
+ if (activeOffsetX) {
+ gesture = gesture.activeOffsetX(activeOffsetX);
+ }
+
+ if (activeOffsetY) {
+ gesture = gesture.activeOffsetY(activeOffsetY);
+ }
+
+ if (failOffsetX) {
+ gesture = gesture.failOffsetX(failOffsetX);
+ }
+
+ if (failOffsetY) {
+ gesture = gesture.failOffsetY(failOffsetY);
+ }
+
+ return gesture;
+ }, [
+ activeOffsetX,
+ activeOffsetY,
+ enableHandlePanningGesture,
+ failOffsetX,
+ failOffsetY,
+ simultaneousHandlers,
+ waitFor,
+ handlePanGestureHandler.handleOnChange,
+ handlePanGestureHandler.handleOnEnd,
+ handlePanGestureHandler.handleOnFinalize,
+ handlePanGestureHandler.handleOnStart,
+ ]);
//#endregion
//#region callbacks
@@ -79,24 +131,11 @@ function BottomSheetHandleContainerComponent({
? BottomSheetHandle
: _providedHandleComponent;
return HandleComponent !== null ? (
-
+
-
+
) : null;
//#endregion
}
diff --git a/src/components/bottomSheetHandleContainer/styles.ts b/src/components/bottomSheetHandleContainer/styles.ts
new file mode 100644
index 000000000..c20ba5fca
--- /dev/null
+++ b/src/components/bottomSheetHandleContainer/styles.ts
@@ -0,0 +1,5 @@
+import { StyleSheet } from 'react-native';
+
+export const styles = StyleSheet.create({
+ container: {},
+});
diff --git a/src/components/bottomSheetHandleContainer/styles.web.ts b/src/components/bottomSheetHandleContainer/styles.web.ts
new file mode 100644
index 000000000..30edc7fd7
--- /dev/null
+++ b/src/components/bottomSheetHandleContainer/styles.web.ts
@@ -0,0 +1,8 @@
+import { StyleSheet } from 'react-native';
+
+export const styles = StyleSheet.create({
+ container: {
+ // @ts-ignore
+ cursor: 'grab',
+ },
+});
diff --git a/src/components/bottomSheetHandleContainer/types.d.ts b/src/components/bottomSheetHandleContainer/types.d.ts
index c3c2ae928..612f6b739 100644
--- a/src/components/bottomSheetHandleContainer/types.d.ts
+++ b/src/components/bottomSheetHandleContainer/types.d.ts
@@ -1,5 +1,5 @@
import type { PanGestureHandlerProperties } from 'react-native-gesture-handler';
-import type Animated from 'react-native-reanimated';
+import type { SharedValue } from 'react-native-reanimated';
import type { BottomSheetProps } from '../bottomSheet';
import type { BottomSheetHandleProps } from '../bottomSheetHandle';
import type { useInteractivePanGestureHandlerConfigs } from '../../hooks/useGestureHandler';
@@ -21,5 +21,5 @@ export interface BottomSheetHandleContainerProps
| 'keyboardBehavior'
>,
BottomSheetHandleProps {
- handleHeight: Animated.SharedValue;
+ handleHeight: SharedValue;
}
diff --git a/src/components/bottomSheetModal/BottomSheetModal.tsx b/src/components/bottomSheetModal/BottomSheetModal.tsx
index e0070c5ce..1b76f24b1 100644
--- a/src/components/bottomSheetModal/BottomSheetModal.tsx
+++ b/src/components/bottomSheetModal/BottomSheetModal.tsx
@@ -15,6 +15,7 @@ import {
DEFAULT_STACK_BEHAVIOR,
DEFAULT_ENABLE_DISMISS_ON_CLOSE,
} from './constants';
+import type { SNAP_POINT_TYPE } from '../../constants';
import type { BottomSheetModalMethods, BottomSheetMethods } from '../../types';
import type { BottomSheetModalProps } from './types';
import { id } from '../../utilities/id';
@@ -45,6 +46,7 @@ const BottomSheetModalComponent = forwardRef<
snapPoints,
enablePanDownToClose = true,
animateOnMount = true,
+ containerComponent: ContainerComponent = React.Fragment,
// callbacks
onChange: _providedOnChange,
@@ -142,30 +144,36 @@ const BottomSheetModalComponent = forwardRef<
}
bottomSheetRef.current?.snapToPosition(...args);
}, []);
- const handleExpand = useCallback((...args) => {
+ const handleExpand: BottomSheetMethods['expand'] = useCallback((...args) => {
if (minimized.current) {
return;
}
bottomSheetRef.current?.expand(...args);
}, []);
- const handleCollapse = useCallback((...args) => {
- if (minimized.current) {
- return;
- }
- bottomSheetRef.current?.collapse(...args);
- }, []);
- const handleClose = useCallback((...args) => {
+ const handleCollapse: BottomSheetMethods['collapse'] = useCallback(
+ (...args) => {
+ if (minimized.current) {
+ return;
+ }
+ bottomSheetRef.current?.collapse(...args);
+ },
+ []
+ );
+ const handleClose: BottomSheetMethods['close'] = useCallback((...args) => {
if (minimized.current) {
return;
}
bottomSheetRef.current?.close(...args);
}, []);
- const handleForceClose = useCallback((...args) => {
- if (minimized.current) {
- return;
- }
- bottomSheetRef.current?.forceClose(...args);
- }, []);
+ const handleForceClose: BottomSheetMethods['forceClose'] = useCallback(
+ (...args) => {
+ if (minimized.current) {
+ return;
+ }
+ bottomSheetRef.current?.forceClose(...args);
+ },
+ []
+ );
//#endregion
//#region bottom sheet modal methods
@@ -301,7 +309,11 @@ const BottomSheetModalComponent = forwardRef<
},
[]);
const handleBottomSheetOnChange = useCallback(
- function handleBottomSheetOnChange(_index: number) {
+ function handleBottomSheetOnChange(
+ _index: number,
+ _position: number,
+ _type: SNAP_POINT_TYPE
+ ) {
print({
component: BottomSheetModal.name,
method: handleBottomSheetOnChange.name,
@@ -313,7 +325,7 @@ const BottomSheetModalComponent = forwardRef<
currentIndexRef.current = _index;
if (_providedOnChange) {
- _providedOnChange(_index);
+ _providedOnChange(_index, _position, _type);
}
},
[_providedOnChange]
@@ -369,23 +381,23 @@ const BottomSheetModalComponent = forwardRef<
handleOnUpdate={handlePortalRender}
handleOnUnmount={handlePortalOnUnmount}
>
- : Content
- }
- $modal={true}
- />
+
+
+
) : null;
});
diff --git a/src/components/bottomSheetModal/types.d.ts b/src/components/bottomSheetModal/types.d.ts
index 9d104e74b..fc9ddb98b 100644
--- a/src/components/bottomSheetModal/types.d.ts
+++ b/src/components/bottomSheetModal/types.d.ts
@@ -15,7 +15,7 @@ export interface BottomSheetModalProps
/**
* Modal name to help identify the modal for later on.
* @type string
- * @default nanoid generated unique key.
+ * @default generated unique key.
*/
name?: string;
@@ -35,6 +35,14 @@ export interface BottomSheetModalProps
*/
enableDismissOnClose?: boolean;
+ /**
+ * Add a custom container like FullWindowOverlay
+ * allow to fix issue like https://github.com/gorhom/react-native-bottom-sheet/issues/832
+ * @type React.ComponentType
+ * @default undefined
+ */
+ containerComponent?: React.ComponentType>;
+
// callbacks
/**
* Callback when the modal dismissed.
@@ -44,10 +52,10 @@ export interface BottomSheetModalProps
/**
* A scrollable node or normal view.
- * @type React.ReactNode[] | React.ReactNode
+ * @type React.ReactNode[] | React.ReactNode | (({ data: any }?) => React.ReactElement)
*/
children:
- | (({ data: any }?) => React.ReactNode)
+ | (({ data: any }?) => React.ReactElement)
| React.ReactNode[]
| React.ReactNode;
}
diff --git a/src/components/bottomSheetRefreshControl/BottomSheetRefreshControl.android.tsx b/src/components/bottomSheetRefreshControl/BottomSheetRefreshControl.android.tsx
index be502259c..2bce722bf 100644
--- a/src/components/bottomSheetRefreshControl/BottomSheetRefreshControl.android.tsx
+++ b/src/components/bottomSheetRefreshControl/BottomSheetRefreshControl.android.tsx
@@ -1,35 +1,57 @@
-import React, { forwardRef, memo } from 'react';
+import React, { memo, useContext, useMemo } from 'react';
import { RefreshControl, RefreshControlProps } from 'react-native';
-import { NativeViewGestureHandler } from 'react-native-gesture-handler';
+import {
+ Gesture,
+ GestureDetector,
+ SimultaneousGesture,
+} from 'react-native-gesture-handler';
import Animated, { useAnimatedProps } from 'react-native-reanimated';
+import { BottomSheetDraggableContext } from '../../contexts/gesture';
import { SCROLLABLE_STATE } from '../../constants';
import { useBottomSheetInternal } from '../../hooks';
const AnimatedRefreshControl = Animated.createAnimatedComponent(RefreshControl);
-const BottomSheetRefreshControlComponent = forwardRef<
- NativeViewGestureHandler,
- RefreshControlProps
->(({ onRefresh, ...rest }, ref) => {
- // hooks
+interface BottomSheetRefreshControlProps extends RefreshControlProps {
+ scrollableGesture: SimultaneousGesture;
+}
+
+function BottomSheetRefreshControlComponent({
+ onRefresh,
+ scrollableGesture,
+ ...rest
+}: BottomSheetRefreshControlProps) {
+ //#region hooks
+ const draggableGesture = useContext(BottomSheetDraggableContext);
const { animatedScrollableState } = useBottomSheetInternal();
+ //#endregion
- // variables
+ //#region variables
const animatedProps = useAnimatedProps(() => ({
enabled: animatedScrollableState.value === SCROLLABLE_STATE.UNLOCKED,
}));
+ const gesture = useMemo(
+ () =>
+ Gesture.Simultaneous(
+ Gesture.Native().shouldCancelWhenOutside(false),
+ scrollableGesture,
+ draggableGesture!
+ ),
+ [draggableGesture, scrollableGesture]
+ );
+ //#endregion
// render
return (
-
+
-
+
);
-});
+}
const BottomSheetRefreshControl = memo(BottomSheetRefreshControlComponent);
BottomSheetRefreshControl.displayName = 'BottomSheetRefreshControl';
diff --git a/src/components/bottomSheetRefreshControl/index.ts b/src/components/bottomSheetRefreshControl/index.ts
index ac07963d2..e295515b0 100644
--- a/src/components/bottomSheetRefreshControl/index.ts
+++ b/src/components/bottomSheetRefreshControl/index.ts
@@ -1,11 +1,15 @@
import type React from 'react';
import type { RefreshControlProps } from 'react-native';
-import type { NativeViewGestureHandlerProps } from 'react-native-gesture-handler';
+import type {
+ NativeViewGestureHandlerProps,
+ SimultaneousGesture,
+} from 'react-native-gesture-handler';
import BottomSheetRefreshControl from './BottomSheetRefreshControl';
export default BottomSheetRefreshControl as any as React.MemoExoticComponent<
React.ForwardRefExoticComponent<
RefreshControlProps & {
+ scrollableGesture: SimultaneousGesture;
children: React.ReactNode | React.ReactNode[];
} & React.RefAttributes<
React.ComponentType<
diff --git a/src/components/bottomSheetScrollable/BottomSheetFlashList.tsx b/src/components/bottomSheetScrollable/BottomSheetFlashList.tsx
new file mode 100644
index 000000000..988ba8ae1
--- /dev/null
+++ b/src/components/bottomSheetScrollable/BottomSheetFlashList.tsx
@@ -0,0 +1,40 @@
+import * as React from 'react';
+import {
+ FlashList as ShopifyFlashList,
+ FlashListProps,
+} from '@shopify/flash-list';
+import { SCROLLABLE_TYPE } from '../../constants';
+import { createBottomSheetScrollableComponent } from './createBottomSheetScrollableComponent';
+import type {
+ BottomSheetFlashListMethods,
+ BottomSheetFlashListProps,
+} from './types';
+import Animated from 'react-native-reanimated';
+import BottomSheetScrollView from './BottomSheetScrollView';
+
+const AnimatedShopifyFlashList =
+ Animated.createAnimatedComponent(ShopifyFlashList);
+const AnimatedFlashList = React.forwardRef>(
+ (props, ref) => (
+
+ )
+);
+
+const BottomSheetFlashListComponent = createBottomSheetScrollableComponent<
+ BottomSheetFlashListMethods,
+ BottomSheetFlashListProps
+>(SCROLLABLE_TYPE.FLASHLIST, AnimatedFlashList);
+
+const BottomSheetFlashList = React.memo(BottomSheetFlashListComponent);
+BottomSheetFlashList.displayName = 'BottomSheetFlashList';
+//@ts-ignore
+BottomSheetFlashList.$bottomSheetIntegrated = true;
+
+export default BottomSheetFlashList as (
+ props: BottomSheetFlashListProps
+) => ReturnType;
diff --git a/src/components/bottomSheetScrollable/BottomSheetFlatList.tsx b/src/components/bottomSheetScrollable/BottomSheetFlatList.tsx
index 6d3c1b797..696ce3b16 100644
--- a/src/components/bottomSheetScrollable/BottomSheetFlatList.tsx
+++ b/src/components/bottomSheetScrollable/BottomSheetFlatList.tsx
@@ -21,6 +21,8 @@ const BottomSheetFlatListComponent = createBottomSheetScrollableComponent<
const BottomSheetFlatList = memo(BottomSheetFlatListComponent);
BottomSheetFlatList.displayName = 'BottomSheetFlatList';
+//@ts-ignore
+BottomSheetFlatList.$bottomSheetIntegrated = true;
export default BottomSheetFlatList as (
props: BottomSheetFlatListProps
diff --git a/src/components/bottomSheetScrollable/BottomSheetScrollView.tsx b/src/components/bottomSheetScrollable/BottomSheetScrollView.tsx
index 6463c4ddf..a8e4c86e0 100644
--- a/src/components/bottomSheetScrollable/BottomSheetScrollView.tsx
+++ b/src/components/bottomSheetScrollable/BottomSheetScrollView.tsx
@@ -21,6 +21,8 @@ const BottomSheetScrollViewComponent = createBottomSheetScrollableComponent<
const BottomSheetScrollView = memo(BottomSheetScrollViewComponent);
BottomSheetScrollView.displayName = 'BottomSheetScrollView';
+//@ts-ignore
+BottomSheetScrollView.$bottomSheetIntegrated = true;
export default BottomSheetScrollView as (
props: BottomSheetScrollViewProps
diff --git a/src/components/bottomSheetScrollable/BottomSheetSectionList.tsx b/src/components/bottomSheetScrollable/BottomSheetSectionList.tsx
index 6e046f192..0576c07d1 100644
--- a/src/components/bottomSheetScrollable/BottomSheetSectionList.tsx
+++ b/src/components/bottomSheetScrollable/BottomSheetSectionList.tsx
@@ -22,6 +22,8 @@ const BottomSheetSectionListComponent = createBottomSheetScrollableComponent<
const BottomSheetSectionList = memo(BottomSheetSectionListComponent);
BottomSheetSectionList.displayName = 'BottomSheetSectionList';
+//@ts-ignore
+BottomSheetSectionList.$bottomSheetIntegrated = true;
export default BottomSheetSectionList as (
props: BottomSheetSectionListProps
diff --git a/src/components/bottomSheetScrollable/BottomSheetVirtualizedList.tsx b/src/components/bottomSheetScrollable/BottomSheetVirtualizedList.tsx
index df2ad015e..e09819fe1 100644
--- a/src/components/bottomSheetScrollable/BottomSheetVirtualizedList.tsx
+++ b/src/components/bottomSheetScrollable/BottomSheetVirtualizedList.tsx
@@ -24,6 +24,8 @@ const BottomSheetVirtualizedListComponent =
const BottomSheetVirtualizedList = memo(BottomSheetVirtualizedListComponent);
BottomSheetVirtualizedList.displayName = 'BottomSheetVirtualizedList';
+//@ts-ignore
+BottomSheetVirtualizedList.$bottomSheetIntegrated = true;
export default BottomSheetVirtualizedList as (
props: BottomSheetVirtualizedListProps
diff --git a/src/components/bottomSheetScrollable/ScrollableContainer.android.tsx b/src/components/bottomSheetScrollable/ScrollableContainer.android.tsx
new file mode 100644
index 000000000..9a152af3b
--- /dev/null
+++ b/src/components/bottomSheetScrollable/ScrollableContainer.android.tsx
@@ -0,0 +1,51 @@
+import React, { forwardRef } from 'react';
+import {
+ GestureDetector,
+ SimultaneousGesture,
+} from 'react-native-gesture-handler';
+import BottomSheetRefreshControl from '../bottomSheetRefreshControl';
+import { styles } from './styles';
+
+interface ScrollableContainerProps {
+ nativeGesture: SimultaneousGesture;
+ refreshControl: any;
+ progressViewOffset: any;
+ refreshing: any;
+ onRefresh: any;
+ ScrollableComponent: any;
+}
+
+export const ScrollableContainer = forwardRef(
+ function ScrollableContainer(
+ {
+ nativeGesture,
+ refreshControl: _refreshControl,
+ refreshing,
+ progressViewOffset,
+ onRefresh,
+ ScrollableComponent,
+ ...rest
+ },
+ ref
+ ) {
+ const Scrollable = (
+