diff --git a/FabricTestExample/App.js b/FabricTestExample/App.js
index a5f66cbc2b..7de41240a1 100644
--- a/FabricTestExample/App.js
+++ b/FabricTestExample/App.js
@@ -1,106 +1,3 @@
-/* eslint-disable no-unused-vars */
-import React from 'react';
+import App from '../apps/test-examples';
-import { enableFreeze } from 'react-native-screens';
-
-import Test42 from './src/Test42';
-import Test111 from './src/Test111';
-import Test263 from './src/Test263';
-import Test349 from './src/Test349';
-import Test364 from './src/Test364';
-import Test528 from './src/Test528';
-import Test550 from './src/Test550';
-import Test556 from './src/Test556';
-import Test564 from './src/Test564';
-import Test577 from './src/Test577';
-import Test593 from './src/Test593';
-import Test619 from './src/Test619';
-import Test624 from './src/Test624';
-import Test640 from './src/Test640';
-import Test642 from './src/Test642';
-import Test645 from './src/Test645';
-import Test648 from './src/Test648';
-import Test649 from './src/Test649';
-import Test654 from './src/Test654';
-import Test658 from './src/Test658';
-import Test662 from './src/Test662';
-import Test691 from './src/Test691';
-import Test702 from './src/Test702';
-import Test706 from './src/Test706';
-import Test713 from './src/Test713';
-import Test726 from './src/Test726';
-import Test748 from './src/Test748';
-import Test750 from './src/Test750';
-import Test758 from './src/Test758';
-import Test761 from './src/Test761';
-import Test779 from './src/Test779';
-import Test780 from './src/Test780';
-import Test791 from './src/Test791';
-import Test800 from './src/Test800';
-import Test817 from './src/Test817';
-import Test830 from './src/Test830';
-import Test831 from './src/Test831';
-import Test844 from './src/Test844';
-import Test852 from './src/Test852';
-import Test860 from './src/Test860';
-import Test861 from './src/Test861';
-import Test865 from './src/Test865';
-import Test881 from './src/Test881';
-import Test887 from './src/Test887';
-import Test898 from './src/Test898';
-import Test913 from './src/Test913';
-import Test999 from './src/Test999';
-import Test1017 from './src/Test1017';
-import Test1031 from './src/Test1031';
-import Test1032 from './src/Test1032';
-import Test1036 from './src/Test1036';
-import Test1072 from './src/Test1072';
-import Test1084 from './src/Test1084';
-import Test1091 from './src/Test1091';
-import Test1096 from './src/Test1096';
-import Test1097 from './src/Test1097';
-import Test1153 from './src/Test1153';
-import Test1157 from './src/Test1157';
-import Test1162 from './src/Test1162';
-import Test1166 from './src/Test1166';
-import Test1188 from './src/Test1188';
-import Test1190 from './src/Test1190';
-import TestFreeze from './src/TestFreeze';
-import Test1198 from './src/Test1198';
-import Test1204 from './src/Test1204';
-import Test1209 from './src/Test1209';
-import Test1213 from './src/Test1213';
-import Test1214 from './src/Test1214';
-import Test1227 from './src/Test1227';
-import Test1228 from './src/Test1228';
-import Test1259 from './src/Test1259';
-import Test1260 from './src/Test1260';
-import Test1296 from './src/Test1296';
-import Test1299 from './src/Test1299';
-import Test1391 from './src/Test1391';
-import Test1419 from './src/Test1419';
-import Test1473 from './src/Test1473';
-import Test1476 from './src/Test1476';
-import Test1646 from './src/Test1646';
-import Test1649 from './src/Test1649';
-import Test1671 from './src/Test1671';
-import Test1683 from './src/Test1683';
-import Test1726 from './src/Test1726';
-import Test1802 from './src/Test1802';
-import Test1829 from './src/Test1829';
-import Test1844 from './src/Test1844';
-import Test1864 from './src/Test1864';
-import Test1970 from './src/Test1970';
-import TestScreenAnimation from './src/TestScreenAnimation';
-import Test1981 from './src/Test1981';
-import Test2008 from './src/Test2008';
-import Test2028 from './src/Test2028';
-import Test2048 from './src/Test2048';
-import Test2069 from './src/Test2069';
-import Test2118 from './src/Test2118';
-
-enableFreeze(true);
-
-export default function App() {
- return ;
-}
+export default App;
diff --git a/FabricTestExample/src/Test1032.tsx b/FabricTestExample/src/Test1032.tsx
deleted file mode 100644
index 2b8e2328ab..0000000000
--- a/FabricTestExample/src/Test1032.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-/* eslint-disable react-native/no-inline-styles */
-import * as React from 'react';
-import { Alert, Button, Switch, Text, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- const [gestureEnabled, setGestureEnable] = React.useState(false);
- return (
-
-
-
-
-
-
-
-
- Gesture enabled
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
-
- );
-}
-
-function Second() {
- return (
-
-
- );
-}
diff --git a/FabricTestExample/src/Test1072.tsx b/FabricTestExample/src/Test1072.tsx
deleted file mode 100644
index b1f7c3692e..0000000000
--- a/FabricTestExample/src/Test1072.tsx
+++ /dev/null
@@ -1,118 +0,0 @@
-import React, { useState } from 'react';
-import { Dimensions, Image, StyleSheet, Text, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import {
- GestureHandlerRootView,
- ScrollView,
- State,
- TapGestureHandler,
-} from 'react-native-gesture-handler';
-
-const Stack = createNativeStackNavigator();
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.navigate('Second')} />
- navigation.navigate('Second')} />
- navigation.navigate('Second')} />
-
- );
-}
-
-function Second() {
- return (
-
-
- Use swipe back gesture to go back (iOS only)
-
-
-
- );
-}
-
-export default function App() {
- return (
-
-
-
-
-
-
-
-
- );
-}
-
-// components
-
-function Post({ onPress }: { onPress?: () => void }) {
- const [width] = useState(Math.round(Dimensions.get('screen').width));
-
- return (
-
- e.nativeEvent.oldState === State.ACTIVE && onPress?.()
- }>
-
- Post
- {generatePhotos(4, width, 400)}
- Scroll right for more photos
-
-
- );
-}
-
-// helpers
-function generatePhotos(
- amount: number,
- width: number,
- height: number,
-): JSX.Element[] {
- const startFrom = Math.floor(Math.random() * 20) + 10;
- return Array.from({ length: amount }, (_, index) => {
- const uri = `https://picsum.photos/id/${
- startFrom + index
- }/${width}/${height}`;
- return ;
- });
-}
-
-const styles = StyleSheet.create({
- title: {
- fontWeight: 'bold',
- fontSize: 32,
- marginBottom: 8,
- marginLeft: 8,
- },
- subTitle: {
- fontSize: 18,
- marginVertical: 16,
- textAlign: 'center',
- },
- caption: {
- textAlign: 'center',
- marginTop: 4,
- },
- post: {
- borderColor: '#ccc',
- borderTopWidth: 1,
- borderBottomWidth: 1,
- paddingVertical: 10,
- marginBottom: 16,
- backgroundColor: 'white',
- },
-});
diff --git a/FabricTestExample/src/Test1096.tsx b/FabricTestExample/src/Test1096.tsx
deleted file mode 100644
index c727009fd6..0000000000
--- a/FabricTestExample/src/Test1096.tsx
+++ /dev/null
@@ -1,95 +0,0 @@
-/* eslint-disable react-native/no-inline-styles */
-import * as React from 'react';
-
-import { Button, StyleSheet, View, Modal } from 'react-native';
-import { FullWindowOverlay } from 'react-native-screens';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-
-function Home({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- const [isShowModal, setIsShowModal] = React.useState(false);
-
- return (
-
-
- );
-}
-
-function ModalScreen({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.goBack()} />
-
- );
-}
-
-const NativeStack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- alignItems: 'flex-start',
- justifyContent: 'center',
- },
-
- box: {
- width: 40,
- height: 40,
- borderRadius: 10,
- borderWidth: 2,
- borderColor: 'black',
- backgroundColor: 'red',
- },
-});
diff --git a/FabricTestExample/src/Test1097.tsx b/FabricTestExample/src/Test1097.tsx
deleted file mode 100644
index 153aeef9b1..0000000000
--- a/FabricTestExample/src/Test1097.tsx
+++ /dev/null
@@ -1,207 +0,0 @@
-import * as React from 'react';
-import { Button, NativeSyntheticEvent, ScrollView } from 'react-native';
-import {
- NavigationContainer,
- NavigationProp,
- ParamListBase,
-} from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackScreenProps,
-} from '@react-navigation/native-stack';
-import { SearchBarCommands } from 'react-native-screens';
-
-const AppStack = createNativeStackNavigator();
-
-export default function App(): JSX.Element {
- return (
-
-
-
-
-
-
-
- );
-}
-
-function First({ navigation }: NativeStackScreenProps) {
- const searchBarRef = React.useRef();
-
- React.useEffect(() => {
- navigation.setOptions({
- headerSearchBarOptions: searchBarOptions,
- });
- }, [navigation]);
-
- const [search, setSearch] = React.useState('');
-
- const searchBarOptions = {
- // @ts-ignore
- ref: searchBarRef,
- barTintColor: 'powderblue',
- hideWhenScrolling: true,
- obscureBackground: false,
- hideNavigationBar: false,
- autoCapitalize: 'sentences',
- placeholder: 'Some text',
- placement: 'stacked',
- onChangeText: (e: NativeSyntheticEvent<{ text: string }>) =>
- setSearch(e.nativeEvent.text),
- onCancelButtonPress: () => console.warn('Cancel button pressed'),
- onSearchButtonPress: () => console.warn('Search button pressed'),
- onFocus: () => console.warn('onFocus event'),
- onBlur: () => console.warn('onBlur event'),
- };
-
- const items = [
- 'Apples',
- 'Pie',
- 'Juice',
- 'Cake',
- 'Nuggets',
- 'Some',
- 'Other',
- 'Stuff',
- 'To',
- 'Fill',
- 'The',
- 'Scrolling',
- 'Space',
- ];
-
- return (
-
- navigation.navigate('Second')}
- />
- navigation.navigate('Third')}
- />
- searchBarRef.current?.focus()}
- />
- {items
- .filter(item => item.toLowerCase().indexOf(search.toLowerCase()) !== -1)
- .map(item => (
- {
- console.warn(`${item} clicked`);
- }}
- />
- ))}
- navigation.navigate('Second')}
- />
- navigation.navigate('Third')}
- />
- searchBarRef.current?.focus()}
- />
-
- );
-}
-
-function Second({ navigation }: { navigation: NavigationProp }) {
- return (
-
- navigation.navigate('First')}
- />
- navigation.navigate('Third')}
- />
-
- );
-}
-
-function Third({ navigation }: { navigation: NavigationProp }) {
- const searchBarRef = React.useRef();
-
- const searchBarProps = {
- // @ts-ignore
- ref: searchBarRef,
- barTintColor: 'powderblue',
- hideWhenScrolling: true,
- obscureBackground: false,
- hideNavigationBar: false,
- autoCapitalize: 'sentences',
- placeholder: 'Some text',
- onChangeText: (e: NativeSyntheticEvent<{ text: string }>) =>
- console.warn(`Text changed to ${e.nativeEvent.text}`),
- onCancelButtonPress: () => console.warn('Cancel button pressed'),
- onSearchButtonPress: () => console.warn('Search button pressed'),
- onFocus: () => console.warn('onFocus event'),
- onBlur: () => console.warn('onBlur event'),
- };
-
- React.useEffect(() => {
- navigation.setOptions({
- headerSearchBarOptions: searchBarProps,
- });
- }, [navigation]);
-
- return (
-
- navigation.navigate('First')}
- />
- searchBarRef.current?.focus()}
- />
- searchBarRef.current?.blur()}
- />
- searchBarRef.current?.clearText()}
- />
- searchBarRef.current?.toggleCancelButton(true)}
- />
- searchBarRef.current?.toggleCancelButton(false)}
- />
- searchBarRef.current?.setText('sometext')}
- />
- searchBarRef.current?.cancelSearch()}
- />
- navigation.navigate('First')}
- />
- searchBarRef.current?.focus()}
- />
-
- );
-}
diff --git a/FabricTestExample/src/Test1162.tsx b/FabricTestExample/src/Test1162.tsx
deleted file mode 100644
index 8dfdac21bb..0000000000
--- a/FabricTestExample/src/Test1162.tsx
+++ /dev/null
@@ -1,110 +0,0 @@
-/* eslint-disable react-hooks/exhaustive-deps */
-import * as React from 'react';
-import { Button, View } from 'react-native';
-import {
- NavigationContainer,
- ParamListBase,
- getFocusedRouteNameFromRoute,
- Route,
-} from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-
-function isTranslucent(route: Route) {
- const routeName = getFocusedRouteNameFromRoute(route) ?? 'Screen1';
-
- switch (routeName) {
- case 'Screen1':
- console.log('screen1');
- return false;
- case 'Screen2':
- console.log('screen2');
- return true;
- }
-}
-
-const Stack = createNativeStackNavigator();
-const Tab = createBottomTabNavigator();
-
-const TabNavigator = () => (
-
-
-
-
-);
-
-export default function App() {
- return (
-
-
-
- ({
- headerStyle: { backgroundColor: 'transparent' },
- headerTranslucent: isTranslucent(route),
- })}
- />
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.navigate('Tab')}
- />
- navigation.navigate('Second')}
- />
-
- );
-}
-
-function TabScreen() {
- return (
-
-
-
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- const [isTranslucent, setIsTranslucent] = React.useState(false);
-
- React.useEffect(() => {
- navigation.setOptions({ headerTransparent: isTranslucent });
- }, [isTranslucent]);
-
- return (
-
-
- setIsTranslucent(prev => !prev)}
- />
-
-
- );
-}
diff --git a/FabricTestExample/src/Test1209.tsx b/FabricTestExample/src/Test1209.tsx
deleted file mode 100644
index 32f6b0e9bc..0000000000
--- a/FabricTestExample/src/Test1209.tsx
+++ /dev/null
@@ -1,137 +0,0 @@
-/* eslint-disable react-native/no-inline-styles */
-import React from 'react';
-import { View, Text, Button } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-import {
- createStackNavigator,
- StackNavigationProp,
-} from '@react-navigation/stack';
-
-const Tab = createBottomTabNavigator();
-
-function Screen1({
- navigation,
-}: {
- navigation: StackNavigationProp;
-}) {
- return (
-
- Screen 1
- navigation.navigate('Screen2')}
- title="Go to Screen 2"
- />
-
- );
-}
-
-function Screen2({
- navigation,
-}: {
- navigation: StackNavigationProp;
-}) {
- return (
-
- Screen 2
- navigation.navigate('Screen3')}
- title="Go to Screen 3"
- />
-
- );
-}
-
-function Screen3() {
- return (
-
- Screen 3
-
- );
-}
-
-function ScreenB() {
- return (
-
- Screen B
-
- );
-}
-
-const Stack = createStackNavigator();
-
-function TabAStack() {
- return (
-
-
-
-
-
- );
-}
-
-export const maybePopToTop = (
- navigation: StackNavigationProp,
-) => {
- const state = navigation.getState().routes;
-
- // @ts-ignore
- const stackWithState = state.filter(stack => stack.state);
-
- if (
- stackWithState.length &&
- // @ts-ignore
- stackWithState.some(route => route.state?.index !== 0)
- ) {
- navigation.popToTop();
- }
-};
-
-const listeners = ({
- navigation,
-}: {
- navigation: StackNavigationProp;
-}) => ({
- tabPress: () => {
- maybePopToTop(navigation);
- },
-});
-
-const MainStack = createStackNavigator();
-
-const Tabs = () => (
-
-
-
-
-);
-
-function App() {
- return (
-
-
-
-
-
- );
-}
-
-export default App;
diff --git a/FabricTestExample/src/Test1214.tsx b/FabricTestExample/src/Test1214.tsx
deleted file mode 100644
index 59f25bbaef..0000000000
--- a/FabricTestExample/src/Test1214.tsx
+++ /dev/null
@@ -1,65 +0,0 @@
-import React from 'react';
-import { Button, SafeAreaView, Text, TextInput, View } from 'react-native';
-
-import { createStackNavigator } from '@react-navigation/stack';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-type Props = {
- navigation: NativeStackNavigationProp;
-};
-
-const NStack = createNativeStackNavigator();
-const Stack = createStackNavigator();
-
-const Home = ({ navigation }: Props) => {
- return (
-
- {
- navigation.navigate('DETAILS');
- }}>
-
- );
-};
-
-const Details = () => {
- return (
-
-
-
- );
-};
-
-const App = () => {
- return (
-
-
- JS Navigation
-
-
-
-
-
-
-
-
- Native Navigation
-
-
-
-
-
-
-
-
- );
-};
-
-export default App;
diff --git a/FabricTestExample/src/Test1260.tsx b/FabricTestExample/src/Test1260.tsx
deleted file mode 100644
index c75e88b632..0000000000
--- a/FabricTestExample/src/Test1260.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-import * as React from 'react';
-import { Button, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.navigate('Second')}
- />
-
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.navigate('First')}
- />
-
- );
-}
diff --git a/FabricTestExample/src/Test1391.tsx b/FabricTestExample/src/Test1391.tsx
deleted file mode 100644
index bd22ebc030..0000000000
--- a/FabricTestExample/src/Test1391.tsx
+++ /dev/null
@@ -1,65 +0,0 @@
-import React from 'react';
-import { Button, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import { SafeAreaView } from 'react-native-safe-area-context';
-
-interface Props {
- navigation: NativeStackNavigationProp;
-}
-
-const Stack = createNativeStackNavigator();
-
-function Second(props: Props) {
- return (
-
- props.navigation.navigate('First')}
- />
-
- );
-}
-
-function First(props: Props) {
- return (
-
- props.navigation.navigate('Second')}
- />
-
- );
-}
-
-const App = (): JSX.Element => {
- return (
-
-
-
- ,
- }}
- />
-
-
-
-
- );
-};
-
-export default App;
diff --git a/FabricTestExample/src/Test1476.tsx b/FabricTestExample/src/Test1476.tsx
deleted file mode 100644
index b06f19d98a..0000000000
--- a/FabricTestExample/src/Test1476.tsx
+++ /dev/null
@@ -1,146 +0,0 @@
-import React from 'react';
-import { Button, Text, View, StyleSheet } from 'react-native';
-import { NavigationContainer as NavigationContainerNative } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationOptions,
-} from '@react-navigation/native-stack';
-
-const NativeStack = createNativeStackNavigator();
-
-function ScreenA({ navigation }) {
- return (
-
-
- ScreenA, with backgroundColor: 'blue'
-
- navigation.navigate('screenB')}
- />
-
- );
-}
-
-function ScreenB({ navigation }) {
- return (
-
- ScreenB, with backgroundColor: 'cyan'
- navigation.navigate('modalA')}
- />
-
- );
-}
-
-type Props = {};
-
-function ModalA(props: Props) {
- return (
-
-
- ModalA, with opacity and backgroundColor
-
- At ModalA, we still can gesture swipe the screenB back to screenA,{' '}
-
- props.navigation.pop()} />
-
-
- );
-}
-
-const StackBuilder = (
- configs: any,
- groupOptions?: NativeStackNavigationOptions,
-) => {
- return () => (
-
- {configs.map(config => {
- const { options, ...anyConfig } = config;
- const {
- statusBarStyle,
- statusBarAnimation,
- statusBarHidden,
- ...anyOption
- } = options || {};
- return (
-
- );
- })}
-
- );
-};
-
-const ScreenGroup = StackBuilder(
- [
- {
- name: 'screenA',
- component: ScreenA,
- },
- {
- name: 'screenB',
- component: ScreenB,
- },
- ],
- {
- // headerShadowVisible: false,
- headerTintColor: 'black',
- headerBackTitleVisible: false,
- gestureEnabled: true,
- contentStyle: { backgroundColor: 'white' },
- fullScreenGestureEnabled: true,
- },
-);
-
-const ModalGroup = StackBuilder(
- [
- {
- name: 'modalA',
- component: ModalA,
- options: { animation: 'fade' },
- },
- ],
- {
- headerShown: false,
- animation: 'fade_from_bottom',
- presentation: 'containedTransparentModal',
- },
-);
-
-export default function TestModalPresentation() {
- return (
-
-
- {ScreenGroup()}
- {ModalGroup()}
-
-
- );
-}
-
-const styles = StyleSheet.create({
- container: {},
-});
diff --git a/FabricTestExample/src/Test1646.tsx b/FabricTestExample/src/Test1646.tsx
deleted file mode 100644
index 63bfa830f4..0000000000
--- a/FabricTestExample/src/Test1646.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import { NavigationContainer, useRoute } from '@react-navigation/native';
-import {createNativeStackNavigator} from '@react-navigation/native-stack';
-import * as React from 'react';
-import { Button, View } from 'react-native';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
- ({
- title: route.params?.title ?? 'Hello',
- })}
- />
-
-
- );
-}
-
-function Screen({ navigation }: any) {
- const route = useRoute();
- const count = route.params?.count ?? 0;
-
- React.useEffect(() => {
- navigation.setOptions({headerBackTitleVisible: count % 2 === 0});
- }, [count, navigation]);
-
- return (
-
-
- navigation.push(route.name, {
- title: `Hello ${count + 1}`,
- count: count + 1,
- })
- }
- title="Push a route"
- />
-
- );
-}
diff --git a/FabricTestExample/src/Test1683.tsx b/FabricTestExample/src/Test1683.tsx
deleted file mode 100644
index 291eb7fd4d..0000000000
--- a/FabricTestExample/src/Test1683.tsx
+++ /dev/null
@@ -1,75 +0,0 @@
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-import { View, StyleSheet, Button, useColorScheme } from 'react-native';
-import {
- NavigationContainer,
- DarkTheme,
- DefaultTheme,
- Theme,
-} from '@react-navigation/native';
-// import {createNativeStackNavigator} from '@react-navigation/native-stack';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import React, { createContext, useContext, useState } from 'react';
-
-const RootStack = createNativeStackNavigator();
-
-const ThemeContext = createContext({
- theme: DefaultTheme,
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
- setTheme: (theme: Theme) => {},
-});
-
-const HomeScreen = () => {
- const { theme, setTheme } = useContext(ThemeContext);
- return (
-
- {
- console.log('Button pressed');
- setTheme(theme === DefaultTheme ? DarkTheme : DefaultTheme);
- }}
- />
-
- );
-};
-
-const Navigator = () => {
- const { theme } = useContext(ThemeContext);
- // const scheme = useColorScheme();
- return (
-
-
-
-
-
- );
-};
-
-export default function App() {
- const [theme, setTheme] = useState(DefaultTheme);
- return (
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: 'center',
- padding: 8,
- },
-});
diff --git a/FabricTestExample/src/Test1802.tsx b/FabricTestExample/src/Test1802.tsx
deleted file mode 100644
index d69b0b6637..0000000000
--- a/FabricTestExample/src/Test1802.tsx
+++ /dev/null
@@ -1,174 +0,0 @@
-import React from 'react';
-import { Dimensions, Image, StyleSheet, Text, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-// Uncomment these lines if you want to test useAnimatedHeaderHeight.
-import { Animated } from 'react-native';
-import { useAnimatedHeaderHeight } from '@react-navigation/native-stack';
-
-// Uncomment these lines if you want to test useReanimatedHeaderHeight.
-// import Animated from 'react-native-reanimated';
-// import { useReanimatedHeaderHeight } from 'react-native-screens/reanimated';
-
-import {
- GestureHandlerRootView,
- ScrollView,
- State,
- TapGestureHandler,
-} from 'react-native-gesture-handler';
-import { ReanimatedScreenProvider } from 'react-native-screens/reanimated';
-import { FullWindowOverlay } from 'react-native-screens';
-
-const Stack = createNativeStackNavigator();
-
-function ExampleScreen() {
- const headerHeight = useAnimatedHeaderHeight();
- // const headerHeight = useReanimatedHeaderHeight();
-
- return (
-
-
- I'm a header!
-
-
- );
-}
-
-const enablePerformanceTests = false;
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
-
- navigation.navigate('Second')} />
- navigation.navigate('Second')} />
- navigation.navigate('Second')} />
- {
- // Generate 1000 posts for performance testing.
- enablePerformanceTests &&
- Array(1000)
- .fill(0)
- .map(_ => navigation.navigate('Second')} />)
- }
-
- );
-}
-
-function Second() {
- return (
-
-
-
- Use swipe back gesture to go back (iOS only)
-
-
-
- );
-}
-
-export default function App() {
- return (
-
-
-
-
-
-
-
-
-
-
- );
-}
-
-// components
-
-function Post({ onPress }: { onPress?: () => void }) {
- const [width] = React.useState(Math.round(Dimensions.get('screen').width));
-
- return (
-
- e.nativeEvent.oldState === State.ACTIVE && onPress?.()
- }>
-
- Post
- {generatePhotos(4, width, 400)}
- Scroll right for more photos
-
-
- );
-}
-
-// helpers
-function generatePhotos(
- amount: number,
- width: number,
- height: number,
-): JSX.Element[] {
- const startFrom = Math.floor(Math.random() * 20) + 10;
- return Array.from({ length: amount }, (_, index) => {
- const uri = `https://picsum.photos/id/${
- startFrom + index
- }/${width}/${height}`;
- return ;
- });
-}
-
-const styles = StyleSheet.create({
- title: {
- fontWeight: 'bold',
- fontSize: 32,
- marginBottom: 8,
- marginLeft: 8,
- },
- subTitle: {
- fontSize: 18,
- marginVertical: 16,
- textAlign: 'center',
- },
- caption: {
- textAlign: 'center',
- marginTop: 4,
- },
- post: {
- borderColor: '#ccc',
- borderTopWidth: 1,
- borderBottomWidth: 1,
- paddingVertical: 10,
- marginBottom: 16,
- backgroundColor: 'white',
- },
-});
diff --git a/FabricTestExample/src/Test1844.tsx b/FabricTestExample/src/Test1844.tsx
deleted file mode 100644
index ce66caadc9..0000000000
--- a/FabricTestExample/src/Test1844.tsx
+++ /dev/null
@@ -1,142 +0,0 @@
-import React, { useState } from 'react';
-import { Dimensions, Image, StyleSheet, Text, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import { useHeaderHeight } from '@react-navigation/elements';
-import {
- GestureHandlerRootView,
- ScrollView,
- State,
- TapGestureHandler,
-} from 'react-native-gesture-handler';
-import { FullWindowOverlay } from 'react-native-screens';
-
-const Stack = createNativeStackNavigator();
-
-function HeaderOverlay() {
- const headerHeight = useHeaderHeight();
-
- return (
-
-
- Header height: {headerHeight}
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
-
- navigation.navigate('Second')} />
-
- );
-}
-
-function Second() {
- return (
-
-
- Use swipe back gesture to go back (iOS only)
-
-
-
- );
-}
-
-export default function App() {
- return (
-
-
-
-
-
-
-
-
- );
-}
-
-// components
-
-function Post({ onPress }: { onPress?: () => void }) {
- const [width] = useState(Math.round(Dimensions.get('screen').width));
-
- return (
-
- e.nativeEvent.oldState === State.ACTIVE && onPress?.()
- }>
-
- Post
- {generatePhotos(4, width, 400)}
- Scroll right for more photos
-
-
- );
-}
-
-// helpers
-function generatePhotos(
- amount: number,
- width: number,
- height: number,
-): JSX.Element[] {
- const startFrom = Math.floor(Math.random() * 20) + 10;
- return Array.from({ length: amount }, (_, index) => {
- const uri = `https://picsum.photos/id/${
- startFrom + index
- }/${width}/${height}`;
- return ;
- });
-}
-
-const styles = StyleSheet.create({
- title: {
- fontWeight: 'bold',
- fontSize: 32,
- marginBottom: 8,
- marginLeft: 8,
- },
- subTitle: {
- fontSize: 18,
- marginVertical: 16,
- textAlign: 'center',
- },
- caption: {
- textAlign: 'center',
- marginTop: 4,
- },
- post: {
- borderColor: '#ccc',
- borderTopWidth: 1,
- borderBottomWidth: 1,
- paddingVertical: 10,
- marginBottom: 16,
- backgroundColor: 'white',
- },
-});
diff --git a/FabricTestExample/src/Test364.js b/FabricTestExample/src/Test364.js
deleted file mode 100644
index a5741e8e3a..0000000000
--- a/FabricTestExample/src/Test364.js
+++ /dev/null
@@ -1,83 +0,0 @@
-// fixed by #712
-import React from 'react';
-import { View, Text, TouchableOpacity } from 'react-native';
-import {
- NavigationContainer,
- getFocusedRouteNameFromRoute,
-} from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-
-const Home = props => {
- return (
-
- Home Screen
- props.navigation.navigate('Settings')}>
- GoToSettings
-
-
- );
-};
-
-const Profile = props => {
- return (
-
- Profile Screen
-
- );
-};
-
-const Settings = props => {
- return (
-
- Settings Screen
-
- );
-};
-
-const Stack = createNativeStackNavigator();
-const Tab = createBottomTabNavigator();
-
-function HomeStackScreen() {
- return (
-
-
-
-
- );
-}
-
-export default function App() {
- return (
-
- {
- const routeName = getFocusedRouteNameFromRoute(route);
-
- return { tabBarVisible: routeName === 'Home' };
- }}
- tabBarOptions={{ inactiveBackgroundColor: 'green' }}>
-
-
-
-
- );
-}
diff --git a/FabricTestExample/src/Test42.tsx b/FabricTestExample/src/Test42.tsx
deleted file mode 100644
index 3b33828da0..0000000000
--- a/FabricTestExample/src/Test42.tsx
+++ /dev/null
@@ -1,115 +0,0 @@
-// connected PRs: #679, #675
-import React from 'react';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import { ScrollView, Button, Text } from 'react-native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-// import {createStackNavigator} from '@react-navigation/stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function NativeNavigation() {
- return (
-
-
-
-
-
-
- );
-}
-
-// change to createStackNavigator to test with stack in the middle
-const Tab = createBottomTabNavigator();
-
-const NestedNavigator = () => (
-
-
-
-
-
-);
-
-const InnerStack = createNativeStackNavigator();
-
-const Inner = () => (
-
-
-
-);
-
-function Home({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- const [yes, setYes] = React.useState(true);
- return (
-
- {
- navigation.push('NestedNavigator');
- }}
- />
- {
- navigation.navigate('Screen2');
- }}
- />
- {
- navigation.pop();
- }}
- />
- {
- navigation.setOptions({
- orientation: Math.random() > 0.5 ? 'portrait' : 'landscape',
- });
- setYes(!yes);
- }}
- />
-
- Go to `TabNavigator` and then go to second tab there. Spot the
- difference between dismissing modal with a swipe and with a `Pop to top`
- button.{' '}
-
-
- );
-}
diff --git a/FabricTestExample/src/Test556.js b/FabricTestExample/src/Test556.js
deleted file mode 100644
index c20f08cec1..0000000000
--- a/FabricTestExample/src/Test556.js
+++ /dev/null
@@ -1,41 +0,0 @@
-import * as React from 'react';
-import { Button, View } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-function First({ navigation }) {
- return (
-
- navigation.push('Second')}
- />
-
- );
-}
-
-function Second({ navigation }) {
- return (
-
- navigation.goBack()} />
-
- );
-}
diff --git a/FabricTestExample/src/Test624.js b/FabricTestExample/src/Test624.js
deleted file mode 100644
index 84e8a08daf..0000000000
--- a/FabricTestExample/src/Test624.js
+++ /dev/null
@@ -1,202 +0,0 @@
-import * as React from 'react';
-import {
- View,
- StyleSheet,
- Text,
- TouchableOpacity,
- TextInput,
-} from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-import {
- createStackNavigator,
- CardStyleInterpolators,
-} from '@react-navigation/stack';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-
-function First() {
- const NestedStack = createBottomTabNavigator();
-
- return (
-
-
-
-
- );
-}
-
-function SecondScreen({ navigation }) {
- return (
-
-
- navigation.navigate('Third')}>
- Tap me for second screen
-
-
-
- Hi I'm the SECOND screen
-
-
-
- navigation.popToTop()}>
- Pop to top
-
-
-
-
- navigation.navigate('Third')}>
- Tap me for second screen
-
-
-
- );
-}
-
-function ThirdScreen({ navigation }) {
- return (
-
-
- Hi I'm the SECOND screen
-
-
-
- navigation.navigate('Second')}>
- Tap me for second screen
-
-
-
- );
-}
-
-function NestedFirst({ navigation }) {
- return (
-
-
- navigation.navigate('NestedSecond')}>
- Tap me for second screen
-
-
-
- Hi I'm the SECOND screen
-
-
-
- navigation.popToTop()}>
- Pop to top
-
-
-
-
- navigation.navigate('Second')}>
- Tap me for second screen
-
-
-
- );
-}
-
-function NestedSecond({ navigation }) {
- return (
-
-
- navigation.navigate('NestedFirst')}>
- Tap me for second screen
-
-
-
- Hi I'm the SECOND screen
-
-
-
- navigation.popToTop()}>
- Pop to top
-
-
-
-
- navigation.navigate('Second')}>
- Tap me for second screen
-
-
-
- );
-}
-
-const Stack = createStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- verticalContainer: {
- flex: 1,
- flexDirection: 'column',
- },
- centeredContainer: {
- flex: 1,
- justifyContent: 'flex-start',
- alignItems: 'center',
- },
- flexOne: {
- flex: 1,
- },
- buttonExtras: {
- backgroundColor: '#3A8EED',
- borderRadius: 20,
- margin: 20,
- },
- buttonText: {
- color: 'white',
- fontWeight: 'bold',
- },
-});
diff --git a/FabricTestExample/src/Test642.tsx b/FabricTestExample/src/Test642.tsx
deleted file mode 100644
index 513f28df26..0000000000
--- a/FabricTestExample/src/Test642.tsx
+++ /dev/null
@@ -1,140 +0,0 @@
-// connected PRs: #679, #675
-import React from 'react';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import { ScrollView, View, Button } from 'react-native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-
-type Props = {
- navigation: NativeStackNavigationProp,
-};
-
-const Stack = createNativeStackNavigator();
-
-export default function App(): JSX.Element {
- return (
-
-
-
-
-
-
-
- );
-}
-
-const Tab = createBottomTabNavigator();
-
-const TabNavigator = () => (
-
-
-
-
-
-);
-
-const InnerStack = createNativeStackNavigator();
-
-const Inner = () => (
-
-
-
-);
-
-function Home({ navigation }: Props) {
- const [yes, setYes] = React.useState(true);
- const [hidden, setHidden] = React.useState(true);
- const [animation, setAnimation] = React.useState(true);
- return (
-
-
- {
- navigation.push('TabNavigator');
- }}
- />
- {
- navigation.push('Home2');
- }}
- />
- {
- navigation.setOptions({
- statusBarStyle: yes ? 'light' : 'dark',
- });
- setYes(!yes);
- }}
- />
- {
- navigation.setOptions({
- statusBarAnimation: animation ? 'fade' : 'none',
- });
- setAnimation(!animation);
- }}
- />
- {
- navigation.setOptions({
- statusBarHidden: hidden,
- });
- setHidden(!hidden);
- }}
- />
- {
- navigation.setOptions({
- title: yes ? 'Home' : 'NotHome',
- });
- setYes(!yes);
- }}
- />
- {
- navigation.pop();
- }}
- />
-
- );
-}
diff --git a/FabricTestExample/src/Test645.js b/FabricTestExample/src/Test645.js
deleted file mode 100644
index 8d11855182..0000000000
--- a/FabricTestExample/src/Test645.js
+++ /dev/null
@@ -1,81 +0,0 @@
-import React from 'react';
-import { Button, Text, View } from 'react-native';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-function HomeScreen({ navigation }) {
- return (
-
- This is the home screen!
- navigation.navigate('Details')}
- title="Go to Details"
- />
- navigation.navigate('Second')}
- title="Go to Second"
- />
-
- );
-}
-
-function DetailsScreen({ navigation }) {
- return (
-
- navigation.navigate('Settings')}
- title="Go to Settings"
- />
- Details
-
- );
-}
-
-function SettingsScreen({ navigation }) {
- return (
-
- navigation.navigate('Home')} title="Go to Home" />
- Details
-
- );
-}
-
-function SecondScreen({ navigation }) {
- return (
-
- This is a second screen!
- navigation.goBack()} title="go back" />
-
- );
-}
-
-const MainStack = createNativeStackNavigator();
-const Tabs = createBottomTabNavigator();
-
-function MainStackScreen() {
- return (
-
-
-
-
-
- );
-}
-
-function TabsScreen() {
- return (
-
-
-
-
- );
-}
-
-export default function App() {
- return (
-
-
-
- );
-}
diff --git a/FabricTestExample/src/Test662.tsx b/FabricTestExample/src/Test662.tsx
deleted file mode 100644
index 19607563b6..0000000000
--- a/FabricTestExample/src/Test662.tsx
+++ /dev/null
@@ -1,85 +0,0 @@
-import * as React from 'react';
-import { Button, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-type Props = {
- navigation: NativeStackNavigationProp;
-};
-
-const Stack = createNativeStackNavigator();
-
-export default function App(): JSX.Element {
- return (
-
-
-
-
-
-
-
-
- );
-}
-
-const First = ({ navigation }: Props): JSX.Element => (
-
- navigation.navigate('Second')}
- />
- navigation.replace('Second')}
- />
-
-);
-
-const Second = ({ navigation }: Props): JSX.Element => (
-
- navigation.navigate('Third')}
- />
- navigation.goBack()} />
- navigation.replace('First')}
- />
-
-);
-
-const Third = ({ navigation }: Props): JSX.Element => (
-
- navigation.navigate('Fourth')}
- />
- navigation.goBack()} />
-
-);
-
-const Fourth = ({ navigation }: Props): JSX.Element => (
-
- navigation.navigate('First')}
- />
- navigation.goBack()} />
-
-);
diff --git a/FabricTestExample/src/Test726.js b/FabricTestExample/src/Test726.js
deleted file mode 100644
index 2e6ee06798..0000000000
--- a/FabricTestExample/src/Test726.js
+++ /dev/null
@@ -1,43 +0,0 @@
-import * as React from 'react';
-import { Text, TextInput, View, StyleSheet, Button } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-import { createStackNavigator } from '@react-navigation/stack';
-
-function TestScreen({ navigation }) {
- return (
-
- navigation.push('Test')}
- style={styles.button}
- />
-
- );
-}
-
-function TestScreen2() {
- return (
-
- Try to swipe back, it will freeze
-
-
- );
-}
-
-const Stack = createStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- button: { margin: 8 },
- content: { flex: 1, alignItems: 'center', justifyContent: 'center' },
-});
diff --git a/FabricTestExample/src/Test748.tsx b/FabricTestExample/src/Test748.tsx
deleted file mode 100644
index 260f7e316f..0000000000
--- a/FabricTestExample/src/Test748.tsx
+++ /dev/null
@@ -1,72 +0,0 @@
-import React from 'react';
-import { Button, ScrollView, View } from 'react-native';
-import {
- NavigationContainer,
- NavigationProp,
- ParamListBase,
-} from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-function HomeScreen({
- navigation,
-}: {
- navigation: NavigationProp,
-}) {
- return (
- {
- navigation.navigate('Details');
- }}
- title="Go to details"
- />
- );
-}
-
-function DetailsScreen({
- navigation,
-}: {
- navigation: NavigationProp,
-}) {
- const [visible, setVisible] = React.useState(true);
-
- return (
-
-
- {
- navigation.setOptions({
- headerRight: visible
- ? () => (
-
- )
- : () => null,
- });
- setVisible(!visible);
- }}
- title="Swap headerRight"
- />
-
-
- );
-}
-
-const RootStack = createNativeStackNavigator();
-
-function RootStackScreen() {
- return (
-
-
-
-
- );
-}
-
-export default function App(): JSX.Element {
- return (
-
-
-
- );
-}
diff --git a/FabricTestExample/src/Test750.js b/FabricTestExample/src/Test750.js
deleted file mode 100644
index c025cc9375..0000000000
--- a/FabricTestExample/src/Test750.js
+++ /dev/null
@@ -1,42 +0,0 @@
-import React from 'react';
-import { View, Button } from 'react-native';
-import { enableScreens } from 'react-native-screens';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-enableScreens();
-
-const Tab = createBottomTabNavigator();
-export default function TabNav() {
- return (
-
-
-
-
-
-
- );
-}
-
-const Stack = createNativeStackNavigator();
-function StackNav() {
- return (
-
-
-
-
- );
-}
-
-const Tab1 = () => ;
-const Screen1 = ({ navigation }) => (
-
- navigation.navigate('Screen2')} />
-
-);
-const Screen2 = () => ;
diff --git a/FabricTestExample/src/Test758.tsx b/FabricTestExample/src/Test758.tsx
deleted file mode 100644
index f49b827dc0..0000000000
--- a/FabricTestExample/src/Test758.tsx
+++ /dev/null
@@ -1,107 +0,0 @@
-/* eslint-disable react-hooks/exhaustive-deps */
-import * as React from 'react';
-import { Button, NativeSyntheticEvent, ScrollView } from 'react-native';
-import {
- NavigationContainer,
- NavigationProp,
- ParamListBase,
-} from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackScreenProps,
-} from '@react-navigation/native-stack';
-import { SearchBarProps } from 'react-native-screens';
-
-const AppStack = createNativeStackNavigator();
-
-export default function App(): JSX.Element {
- return (
-
-
-
-
-
-
- );
-}
-
-function First({ navigation }: NativeStackScreenProps) {
- React.useLayoutEffect(() => {
- navigation.setOptions({
- headerSearchBarOptions: searchBarOptions,
- });
- }, [navigation]);
-
- const [search, setSearch] = React.useState('');
-
- const searchBarOptions: SearchBarProps = {
- barTintColor: 'powderblue',
- tintColor: 'red',
- textColor: 'red',
- hideWhenScrolling: true,
- obscureBackground: false,
- hideNavigationBar: false,
- autoCapitalize: 'sentences',
- placeholder: 'Some text',
- cancelButtonText: 'Some text',
- onChangeText: (e: NativeSyntheticEvent<{ text: string }>) =>
- setSearch(e.nativeEvent.text),
- onCancelButtonPress: () => console.warn('Cancel button pressed'),
- onSearchButtonPress: () => console.warn('Search button pressed'),
- onFocus: () => console.warn('onFocus event'),
- onBlur: () => console.warn('onBlur event'),
- };
-
- const items = [
- 'Apples',
- 'Pie',
- 'Juice',
- 'Cake',
- 'Nuggets',
- 'Some',
- 'Other',
- 'Stuff',
- 'To',
- 'Fill',
- 'The',
- 'Scrolling',
- 'Space',
- ];
-
- return (
-
- navigation.navigate('Second')}
- />
- {items
- .filter(item => item.toLowerCase().indexOf(search.toLowerCase()) !== -1)
- .map(item => (
- {
- console.warn(`${item} clicked`);
- }}
- />
- ))}
-
- );
-}
-
-function Second({ navigation }: { navigation: NavigationProp }) {
- return (
-
- navigation.navigate('First')}
- />
-
- );
-}
diff --git a/FabricTestExample/src/Test800.tsx b/FabricTestExample/src/Test800.tsx
deleted file mode 100644
index a55e2860ab..0000000000
--- a/FabricTestExample/src/Test800.tsx
+++ /dev/null
@@ -1,78 +0,0 @@
-import * as React from 'react';
-import { Button, StyleSheet, View, Text } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App(): JSX.Element {
- return (
-
- ,
- headerTitleStyle: {
- color: 'cyan',
- },
- headerShown: true,
- }}>
-
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
- navigation.navigate('Second')}
- />
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- const [hidden, setHidden] = React.useState(false);
- const [text, setText] = React.useState('');
- return (
- <>
- navigation.navigate('First')}
- />
- {text}
- setText(Math.random().toString())}
- />
- {
- navigation.setOptions({ headerShown: hidden });
- setHidden(!hidden);
- }}
- />
- >
- );
-}
-
-const styles = StyleSheet.create({
- headerView: {
- height: 20,
- width: 20,
- backgroundColor: 'red',
- },
-});
diff --git a/FabricTestExample/src/Test817.tsx b/FabricTestExample/src/Test817.tsx
deleted file mode 100644
index 1b70c0c414..0000000000
--- a/FabricTestExample/src/Test817.tsx
+++ /dev/null
@@ -1,52 +0,0 @@
-import React from 'react';
-import { View, Text, Button } from 'react-native';
-
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-const App = (): JSX.Element => {
- return (
-
-
-
- Hello!,
- headerRight: () => Some other text,
- }}
- />
-
-
- );
-};
-
-function Home({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.navigate('Notifications')}
- />
-
- );
-}
-
-function Notifications() {
- return ;
-}
-
-export default App;
diff --git a/FabricTestExample/src/Test830.tsx b/FabricTestExample/src/Test830.tsx
deleted file mode 100644
index 18b649f63c..0000000000
--- a/FabricTestExample/src/Test830.tsx
+++ /dev/null
@@ -1,47 +0,0 @@
-/* eslint-disable react-hooks/exhaustive-deps */
-import React, { useLayoutEffect } from 'react';
-import { Button, View } from 'react-native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import { NavigationContainer, RouteProp } from '@react-navigation/native';
-
-type StackParamList = {
- Details: { index: number };
-};
-interface DetailsScreenProps {
- navigation: NativeStackNavigationProp;
- route: RouteProp;
-}
-
-const DetailsScreen = ({ navigation, route }: DetailsScreenProps) => {
- const index = route.params?.index ? route.params?.index : 0;
-
- useLayoutEffect(() => {
- navigation.setOptions({
- title: `Details screen #${index}`,
- });
- }, [navigation]);
-
- return (
-
- navigation.push('Details', { index: index + 1 })}
- />
-
- );
-};
-
-const Stack = createNativeStackNavigator();
-
-const App = (): JSX.Element => (
-
-
-
-
-
-);
-
-export default App;
diff --git a/FabricTestExample/src/Test860.tsx b/FabricTestExample/src/Test860.tsx
deleted file mode 100644
index 168f2754f8..0000000000
--- a/FabricTestExample/src/Test860.tsx
+++ /dev/null
@@ -1,220 +0,0 @@
-import React from 'react';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import { ScrollView, Button, Text } from 'react-native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
- NativeStackNavigationOptions,
-} from '@react-navigation/native-stack';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-// import {createStackNavigator} from '@react-navigation/stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function NativeNavigation() {
- return (
-
-
-
-
-
-
- );
-}
-
-// change to createStackNavigator to test with stack in the middle
-const Tab = createBottomTabNavigator();
-
-const NestedNavigator = () => (
-
-
-
-
-
-);
-
-const InnerStack = createNativeStackNavigator();
-
-const Inner = () => (
-
-
-
-);
-
-function Home({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- const [statusBarColor, setStatusBarColor] = React.useState('mediumseagreen');
- const [statusBarStyle, setStatusBarStyle] =
- React.useState('dark');
- const [statusBarHidden, setStatusBarHidden] = React.useState(false);
- const [statusBarTranslucent, setStatusBarTranslucent] = React.useState(true);
- const [statusBarAnimation, setStatusBarAnimation] =
- React.useState('slide');
- const [navigationBarColor, setNavigationBarColor] = React.useState('green');
- const [navigationBarHidden, setNavigationBarHidden] = React.useState(false);
-
- return (
-
- {
- navigation.push('NestedNavigator');
- }}
- />
- {
- navigation.navigate('Screen2');
- }}
- />
- {
- navigation.pop();
- }}
- />
- {
- navigation.setOptions({
- statusBarBackgroundColor: statusBarColor,
- });
- setStatusBarColor(
- statusBarColor === 'mediumseagreen'
- ? 'rgba(255,128,128,0.5)'
- : 'mediumseagreen',
- );
- }}
- />
- {
- navigation.getParent()?.getParent()?.setOptions({
- statusBarColor,
- });
- setStatusBarColor(
- statusBarColor === 'mediumseagreen' ? 'orange' : 'mediumseagreen',
- );
- }}
- />
- {
- navigation.setOptions({
- statusBarStyle,
- });
- setStatusBarStyle(statusBarStyle === 'light' ? 'dark' : 'light');
- }}
- />
- {
- navigation.setOptions({
- statusBarHidden,
- });
- setStatusBarHidden(!statusBarHidden);
- }}
- />
- {
- navigation.setOptions({
- statusBarTranslucent,
- });
- setStatusBarTranslucent(!statusBarTranslucent);
- }}
- />
- {
- navigation.setOptions({
- statusBarAnimation,
- });
- setStatusBarAnimation(
- statusBarAnimation === 'none' ? 'slide' : 'none',
- );
- }}
- />
- {
- navigation.setOptions({
- navigationBarColor,
- });
- setNavigationBarColor(
- navigationBarColor === 'green' ? 'powderblue' : 'green',
- );
- }}
- />
- {
- navigation.setOptions({
- navigationBarHidden,
- });
- setNavigationBarHidden(!navigationBarHidden);
- }}
- />
-
- Go to `TabNavigator` and then go to second tab there. Spot the
- difference between dismissing modal with a swipe and with a `Pop to top`
- button.{' '}
-
-
- );
-}
diff --git a/FabricTestExample/src/Test887.tsx b/FabricTestExample/src/Test887.tsx
deleted file mode 100644
index b7f38fd77d..0000000000
--- a/FabricTestExample/src/Test887.tsx
+++ /dev/null
@@ -1,301 +0,0 @@
-import * as React from 'react';
-import {
- Animated as RNAnimated,
- Button,
- View,
- StyleSheet,
- Text,
- TouchableOpacity,
- Dimensions,
- SafeAreaView,
-} from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import { useTransitionProgress } from 'react-native-screens';
-import {
- useReanimatedTransitionProgress,
- ReanimatedScreenProvider,
-} from 'react-native-screens/reanimated';
-import Animated, {
- useAnimatedStyle,
- useDerivedValue,
-} from 'react-native-reanimated';
-import { createStackNavigator } from '@react-navigation/stack';
-
-const Stack = createNativeStackNavigator();
-
-const NestedStack = createStackNavigator();
-
-// Nested stack to check if transition progress values are passed properly through non native-stack navigators
-function NestedFirst() {
- return (
-
-
-
- );
-}
-
-type SimpleStackParams = {
- First: undefined;
- Second: undefined;
- Third: undefined;
-};
-export default function App(): JSX.Element {
- return (
-
-
-
-
-
-
-
-
-
- );
-}
-
-// checking if many components can call useProgress at the same time
-function SiblingView() {
- const reaProgress = useReanimatedTransitionProgress();
- const sv = useDerivedValue(
- () =>
- (reaProgress.progress.value < 0.5
- ? reaProgress.progress.value * 50
- : (1 - reaProgress.progress.value) * 50) + 50,
- );
- const reaStyle = useAnimatedStyle(() => {
- return {
- width: sv.value,
- height: sv.value,
- backgroundColor: 'blue',
- };
- });
-
- const { progress } = useTransitionProgress();
-
- const opacity = progress.interpolate({
- inputRange: [0, 0.5, 1],
- outputRange: [1.0, 0.0, 1.0],
- extrapolate: 'clamp',
- });
-
- return (
- <>
-
-
- >
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- // using progress from both Animated and Reanimated context in the same Screen
- const reaProgress = useReanimatedTransitionProgress();
- const sv = useDerivedValue(
- () =>
- (reaProgress.progress.value < 0.5
- ? reaProgress.progress.value * 50
- : (1 - reaProgress.progress.value) * 50) + 50,
- );
- const reaStyle = useAnimatedStyle(() => {
- return {
- width: sv.value,
- height: sv.value,
- backgroundColor: 'blue',
- };
- });
-
- const { progress } = useTransitionProgress();
-
- const opacity = progress.interpolate({
- inputRange: [0, 0.5, 1],
- outputRange: [1.0, 0.0, 1.0],
- extrapolate: 'clamp',
- });
-
- return (
-
- navigation.navigate('Second')}
- />
- navigation.push('Third')}
- />
-
-
-
-
-
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- // using Animated.Value with the progress from context
- const { progress } = useTransitionProgress();
-
- const opacity = progress.interpolate({
- inputRange: [0, 0.5, 1],
- outputRange: [1.0, 0.0, 1.0],
- extrapolate: 'clamp',
- });
-
- // use to check that nativeDriver works correctly
- // React.useEffect(() => {
- // const inter = setInterval(() => {
- // let sum = 0;
- // for(let i = 0; i<1e8; i++) {
- // sum = sum + i;
- // }
- // }, 20);
- // return () => clearInterval(inter);
- // })
-
- return (
-
- navigation.navigate('First')}
- />
- navigation.push('Second')}
- />
- navigation.push('Third')}
- />
-
-
- );
-}
-
-const Dialog = ({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}): JSX.Element => {
- // using Animated with the progress
- const { progress } = useTransitionProgress();
- const reaProgress = useReanimatedTransitionProgress();
- const sv = useDerivedValue(
- () =>
- (reaProgress.progress.value < 0.5
- ? reaProgress.progress.value * 50
- : (1 - reaProgress.progress.value) * 50) + 50,
- );
- const reaStyle = useAnimatedStyle(() => {
- return {
- width: sv.value,
- height: sv.value,
- backgroundColor: 'blue',
- };
- });
-
- const val = progress.interpolate({
- inputRange: [0, 0.5, 1],
- outputRange: [0.1, 0.5, 0.1],
- extrapolate: 'clamp',
- });
-
- return (
-
-
- Hey! Sign up for our newsletter!
-
-
- navigation.goBack()}>
- Please no.
-
- navigation.push('Third')}
- />
- navigation.navigate('First')}
- />
-
-
- );
-};
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: 'center',
- alignItems: 'center',
- backgroundColor: '#00000044',
- },
- wrapper: {
- width: Dimensions.get('screen').width - 40,
- backgroundColor: 'white',
- shadowColor: 'black',
- shadowOffset: {
- width: 0,
- height: 10,
- },
- shadowOpacity: 0.2,
- shadowRadius: 5.0,
- elevation: 4,
- alignItems: 'center',
- justifyContent: 'center',
- padding: 16,
- borderRadius: 8,
- },
- heading: {
- fontSize: 22,
- fontWeight: 'bold',
- color: 'black',
- marginBottom: 16,
- textAlign: 'center',
- },
- button: {
- backgroundColor: 'dodgerblue',
- height: 40,
- borderRadius: 8,
- justifyContent: 'center',
- alignItems: 'center',
- paddingHorizontal: 20,
- },
- buttonText: {
- color: 'white',
- fontWeight: 'bold',
- },
-});
diff --git a/FabricTestExample/src/Test898.tsx b/FabricTestExample/src/Test898.tsx
deleted file mode 100644
index c3eb72ac39..0000000000
--- a/FabricTestExample/src/Test898.tsx
+++ /dev/null
@@ -1,349 +0,0 @@
-import React, { useState, useEffect, RefObject } from 'react';
-import Animated, {
- useSharedValue,
- useAnimatedStyle,
- useAnimatedGestureHandler,
- interpolate,
- Extrapolate,
- withTiming,
- Easing,
- useAnimatedRef,
- measure,
- runOnJS,
-} from 'react-native-reanimated';
-import { Dimensions, StyleSheet, View, Image, Platform } from 'react-native';
-import {
- ScrollView,
- PanGestureHandler,
- TapGestureHandler,
- TapGestureHandlerGestureEvent,
-} from 'react-native-gesture-handler';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import { NavigationContainer } from '@react-navigation/native';
-import {
- SafeAreaProvider,
- useSafeAreaInsets,
-} from 'react-native-safe-area-context';
-
-const AnimatedImage = Animated.createAnimatedComponent(Image);
-
-const dimensions = Dimensions.get('window');
-const GUTTER_WIDTH = 3;
-const NUMBER_OF_IMAGES = 4;
-const IMAGE_SIZE =
- (dimensions.width - GUTTER_WIDTH * (NUMBER_OF_IMAGES - 1)) / NUMBER_OF_IMAGES;
-
-type ExampleImage = {
- uri: string;
- width: number;
- height: number;
-};
-type ActiveExampleImageProperties = {
- x: Animated.SharedValue;
- y: Animated.SharedValue;
- width: Animated.SharedValue;
- height: Animated.SharedValue;
- imageOpacity: Animated.SharedValue;
-};
-type ActiveExampleImage = ActiveExampleImageProperties & {
- // @ts-ignore: FIXME AnimatedImage type
- animatedRef: RefObject;
- item: ExampleImage;
-};
-
-type onItemPressFn = (
- animatedRef: RefObject,
- item: ExampleImage,
- svs: ActiveExampleImageProperties,
-) => void;
-function ImageList({
- images,
- onItemPress,
-}: {
- images: ExampleImage[];
- onItemPress: onItemPressFn;
-}) {
- return (
-
- {images.map((item, i) => (
-
- ))}
-
- );
-}
-
-type ListItemProps = {
- item: ExampleImage;
- index: number;
- onPress: onItemPressFn;
-};
-function ListItem({ item, index, onPress }: ListItemProps) {
- // @ts-ignore: FIXME(TS) correct type for createAnimatedComponent
- const ref = useAnimatedRef();
- const opacity = useSharedValue(1);
- const statusBarInset = useSafeAreaInsets().top; // inset of the status bar
- const headerHeight = statusBarInset + 44;
-
- const containerStyle = {
- marginRight: (index + 1) % 4 === 0 ? 0 : GUTTER_WIDTH,
- marginBottom: GUTTER_WIDTH,
- };
-
- const styles = useAnimatedStyle(() => {
- return {
- width: IMAGE_SIZE,
- height: IMAGE_SIZE,
- opacity: opacity.value,
- };
- });
-
- const width = useSharedValue(0);
- const height = useSharedValue(0);
- const x = useSharedValue(0);
- const y = useSharedValue(0);
-
- function handlePress() {
- onPress(ref, item, { imageOpacity: opacity, width, height, x, y });
- }
-
- const handler = useAnimatedGestureHandler({
- onFinish: (_evt, _ctx, isCanceledOrFailed) => {
- if (isCanceledOrFailed) {
- return;
- }
-
- // measure the image
- // width/height and position to animate from it to the full screen one
- const measurements = measure(ref);
-
- width.value = measurements.width;
- height.value = measurements.height;
- x.value = measurements.pageX;
- y.value = measurements.pageY - headerHeight;
-
- runOnJS(handlePress)();
- },
- });
-
- return (
-
-
-
-
-
- );
-}
-
-const timingConfig = {
- duration: 240,
- easing: Easing.bezier(0.33, 0.01, 0, 1),
-};
-
-function ImageTransition({
- activeImage,
- onClose,
-}: {
- activeImage: ActiveExampleImage;
- onClose: () => void;
-}) {
- const { item, x, y, width, height, imageOpacity } = activeImage;
- const { uri } = item;
-
- const targetWidth = dimensions.width;
- const scaleFactor = item.width / targetWidth;
- const targetHeight = item.height / scaleFactor;
-
- const statusBarInset = useSafeAreaInsets().top; // inset of the status bar
- const headerHeight = statusBarInset + 44;
-
- const animationProgress = useSharedValue(0);
-
- const backdropOpacity = useSharedValue(0);
- const scale = useSharedValue(1);
-
- const targetX = useSharedValue(0);
- const targetY = useSharedValue(
- (dimensions.height - targetHeight) / 2 - headerHeight,
- );
-
- const translateX = useSharedValue(0);
- const translateY = useSharedValue(0);
-
- const onPan = useAnimatedGestureHandler({
- onActive: event => {
- translateX.value = event.translationX;
- translateY.value = event.translationY;
-
- scale.value = interpolate(
- translateY.value,
- [-200, 0, 200],
- [0.65, 1, 0.65],
- Extrapolate.CLAMP,
- );
-
- backdropOpacity.value = interpolate(
- translateY.value,
- [-100, 0, 100],
- [0, 1, 0],
- Extrapolate.CLAMP,
- );
- },
-
- onEnd: (_event, _ctx) => {
- if (Math.abs(translateY.value) > 40) {
- targetX.value = translateX.value - targetX.value * -1;
- targetY.value = translateY.value - targetY.value * -1;
-
- translateX.value = 0;
- translateY.value = 0;
-
- animationProgress.value = withTiming(0, timingConfig, () => {
- imageOpacity.value = withTiming(
- 1,
- {
- duration: 16,
- },
- () => {
- runOnJS(onClose)();
- },
- );
- });
-
- backdropOpacity.value = withTiming(0, timingConfig);
- } else {
- backdropOpacity.value = withTiming(1, timingConfig);
- translateX.value = withTiming(0, timingConfig);
- translateY.value = withTiming(0, timingConfig);
- }
-
- scale.value = withTiming(1, timingConfig);
- },
- });
-
- const imageStyles = useAnimatedStyle(() => {
- const interpolateProgress = (range: [number, number]) =>
- interpolate(animationProgress.value, [0, 1], range, Extrapolate.CLAMP);
-
- const top =
- translateY.value + interpolateProgress([y.value, targetY.value]);
- const left =
- translateX.value + interpolateProgress([x.value, targetX.value]);
-
- return {
- position: 'absolute',
- top,
- left,
- width: interpolateProgress([width.value, targetWidth]),
- height: interpolateProgress([height.value, targetHeight]),
- transform: [
- {
- scale: scale.value,
- },
- ],
- };
- });
-
- const backdropStyles = useAnimatedStyle(() => {
- return {
- opacity: backdropOpacity.value,
- };
- });
-
- useEffect(() => {
- // fixes flickering
- requestAnimationFrame(() => {
- imageOpacity.value = 0;
- });
-
- animationProgress.value = withTiming(1, timingConfig);
- backdropOpacity.value = withTiming(1, timingConfig);
- }, []);
-
- return (
-
-
-
-
-
-
-
-
-
- );
-}
-
-const images: ExampleImage[] = Array.from({ length: 30 }, (_, index) => {
- return {
- uri: `https://picsum.photos/id/${index + 10}/400/400`,
- width: dimensions.width,
- height: 400,
- };
-});
-
-function LightboxExample(): React.ReactElement {
- const [activeImage, setActiveImage] = useState(
- null,
- );
-
- function onItemPress(
- // @ts-ignore: FIXME AnimatedImage type
- animatedRef: RefObject,
- item: ExampleImage,
- svs: ActiveExampleImageProperties,
- ) {
- setActiveImage({
- animatedRef,
- item,
- ...svs,
- });
- }
-
- function onClose() {
- setActiveImage(null);
- }
-
- const statusBarInset = useSafeAreaInsets().top; // inset of the status bar
- const headerHeight = statusBarInset + 44;
- const height =
- Platform.OS === 'web' ? dimensions.height - headerHeight : undefined;
-
- return (
-
-
-
- {activeImage && (
-
- )}
-
- );
-}
-
-const styles = StyleSheet.create({
- container: {
- paddingTop: 0,
- },
-
- scrollContainer: {
- flexDirection: 'row',
- flexWrap: 'wrap',
- },
-
- backdrop: {
- ...StyleSheet.absoluteFillObject,
- backgroundColor: 'black',
- },
-});
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
-
- );
-}
diff --git a/FabricTestExample/src/TestFreeze.tsx b/FabricTestExample/src/TestFreeze.tsx
deleted file mode 100644
index a1de313f17..0000000000
--- a/FabricTestExample/src/TestFreeze.tsx
+++ /dev/null
@@ -1,88 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { View, Text, Button, ScrollView } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-// import {createStackNavigator} from '@react-navigation/stack';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const store = new Set();
-
-type Dispatch = (value: number) => void;
-
-function useValue() {
- const [value, setValue] = useState(0); // integer state
-
- useEffect(() => {
- const dispatch = (value: number) => {
- setValue(value);
- };
- store.add(dispatch);
- return () => store.delete(dispatch);
- }, [setValue]);
-
- return value;
-}
-
-function HomeScreen({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- const value = useValue();
- return (
-
- Home Screen {value}
- navigation.navigate('Details')}
- />
-
- );
-}
-
-function DetailsScreen({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- const value = useValue();
- // only 1 'render' should appear at the time
- console.log('render', value);
- return (
-
-
- Details Screen {value}
- navigation.push('Details')}
- />
-
-
- );
-}
-
-const Stack = createNativeStackNavigator();
-
-function App() {
- useEffect(() => {
- let timer = 0;
- const interval = setInterval(() => {
- timer = timer + 1;
- store.forEach(dispatch => dispatch(timer));
- }, 3000);
- return () => clearInterval(interval);
- }, []);
-
- return (
-
-
-
-
-
-
- );
-}
-
-export default App;
diff --git a/FabricTestExample/tsconfig.json b/FabricTestExample/tsconfig.json
deleted file mode 100644
index 304ab4e2d8..0000000000
--- a/FabricTestExample/tsconfig.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
- "extends": "@react-native/typescript-config/tsconfig.json"
-}
diff --git a/TestsExample/.eslintrc.js b/TestsExample/.eslintrc.js
deleted file mode 100644
index cfc90f7103..0000000000
--- a/TestsExample/.eslintrc.js
+++ /dev/null
@@ -1,12 +0,0 @@
-module.exports = {
- root: true,
- extends: '@react-native',
- overrides: [
- {
- files: ['*.tsx', '*.js'],
- rules: {
- 'react-native/no-inline-styles': 'off',
- },
- },
- ],
-};
diff --git a/TestsExample/.prettierrc.js b/TestsExample/.prettierrc.js
deleted file mode 100644
index 2ae7b381ed..0000000000
--- a/TestsExample/.prettierrc.js
+++ /dev/null
@@ -1,7 +0,0 @@
-module.exports = {
- arrowParens: 'avoid',
- bracketSameLine: true,
- bracketSpacing: true,
- singleQuote: true,
- trailingComma: 'all',
-};
diff --git a/TestsExample/App.js b/TestsExample/App.js
index 7137c79a65..7de41240a1 100644
--- a/TestsExample/App.js
+++ b/TestsExample/App.js
@@ -1,107 +1,3 @@
-/* eslint-disable no-unused-vars */
-import React from 'react';
+import App from '../apps/test-examples';
-import { enableFreeze } from 'react-native-screens';
-
-import Test42 from './src/Test42';
-import Test111 from './src/Test111';
-import Test263 from './src/Test263';
-import Test349 from './src/Test349';
-import Test364 from './src/Test364';
-import Test528 from './src/Test528';
-import Test550 from './src/Test550';
-import Test556 from './src/Test556';
-import Test564 from './src/Test564';
-import Test577 from './src/Test577';
-import Test593 from './src/Test593';
-import Test619 from './src/Test619';
-import Test624 from './src/Test624';
-import Test640 from './src/Test640';
-import Test642 from './src/Test642';
-import Test645 from './src/Test645';
-import Test648 from './src/Test648';
-import Test649 from './src/Test649';
-import Test654 from './src/Test654';
-import Test658 from './src/Test658';
-import Test662 from './src/Test662';
-import Test691 from './src/Test691';
-import Test702 from './src/Test702';
-import Test706 from './src/Test706';
-import Test713 from './src/Test713';
-import Test726 from './src/Test726';
-import Test748 from './src/Test748';
-import Test750 from './src/Test750';
-import Test758 from './src/Test758';
-import Test761 from './src/Test761';
-import Test779 from './src/Test779';
-import Test780 from './src/Test780';
-import Test791 from './src/Test791';
-import Test800 from './src/Test800';
-import Test817 from './src/Test817';
-import Test830 from './src/Test830';
-import Test831 from './src/Test831';
-import Test844 from './src/Test844';
-import Test852 from './src/Test852';
-import Test860 from './src/Test860';
-import Test861 from './src/Test861';
-import Test865 from './src/Test865';
-import Test881 from './src/Test881';
-import Test887 from './src/Test887';
-import Test898 from './src/Test898';
-import Test913 from './src/Test913';
-import Test999 from './src/Test999';
-import Test1017 from './src/Test1017';
-import Test1031 from './src/Test1031';
-import Test1032 from './src/Test1032';
-import Test1036 from './src/Test1036';
-import Test1072 from './src/Test1072';
-import Test1084 from './src/Test1084';
-import Test1091 from './src/Test1091';
-import Test1096 from './src/Test1096';
-import Test1097 from './src/Test1097';
-import Test1153 from './src/Test1153';
-import Test1157 from './src/Test1157';
-import Test1162 from './src/Test1162';
-import Test1166 from './src/Test1166';
-import Test1188 from './src/Test1188';
-import Test1190 from './src/Test1190';
-import TestFreeze from './src/TestFreeze';
-import Test1198 from './src/Test1198';
-import Test1204 from './src/Test1204';
-import Test1209 from './src/Test1209';
-import Test1213 from './src/Test1213';
-import Test1214 from './src/Test1214';
-import Test1227 from './src/Test1227';
-import Test1228 from './src/Test1228';
-import Test1259 from './src/Test1259';
-import Test1260 from './src/Test1260';
-import Test1296 from './src/Test1296';
-import Test1299 from './src/Test1299';
-import Test1391 from './src/Test1391';
-import Test1419 from './src/Test1419';
-import Test1473 from './src/Test1473';
-import Test1476 from './src/Test1476';
-import Test1509 from './src/Test1509';
-import Test1539 from './src/Test1539';
-import Test1646 from './src/Test1646';
-import Test1649 from './src/Test1649';
-import Test1671 from './src/Test1671';
-import Test1683 from './src/Test1683';
-import Test1726 from './src/Test1726';
-import Test1791 from './src/Test1791';
-import Test1802 from './src/Test1802';
-import Test1829 from './src/Test1829';
-import Test1844 from './src/Test1844';
-import Test1864 from './src/Test1864';
-import Test1970 from './src/Test1970';
-import Test1981 from './src/Test1981';
-import Test2008 from './src/Test2008';
-import Test2048 from './src/Test2048';
-import Test2069 from './src/Test2069';
-import Test2118 from './src/Test2118';
-
-enableFreeze(true);
-
-export default function App() {
- return ;
-}
+export default App;
diff --git a/TestsExample/assets/backButton.png b/TestsExample/assets/backButton.png
deleted file mode 100644
index d05671e989..0000000000
Binary files a/TestsExample/assets/backButton.png and /dev/null differ
diff --git a/TestsExample/assets/search_black.png b/TestsExample/assets/search_black.png
deleted file mode 100644
index aa8a2c4a98..0000000000
Binary files a/TestsExample/assets/search_black.png and /dev/null differ
diff --git a/TestsExample/assets/search_white.png b/TestsExample/assets/search_white.png
deleted file mode 100644
index 7b9fb7eaab..0000000000
Binary files a/TestsExample/assets/search_white.png and /dev/null differ
diff --git a/TestsExample/src/Test1017.tsx b/TestsExample/src/Test1017.tsx
deleted file mode 100644
index 486aac64dc..0000000000
--- a/TestsExample/src/Test1017.tsx
+++ /dev/null
@@ -1,147 +0,0 @@
-import { NavigationContainer, RouteProp } from '@react-navigation/native';
-import {
- createStackNavigator,
- StackNavigationProp,
- TransitionPresets,
-} from '@react-navigation/stack';
-import React from 'react';
-import { Alert, LogBox } from 'react-native';
-import { StyleSheet, Text, View, FlatList, Pressable } from 'react-native';
-import { ScrollView } from 'react-native-gesture-handler';
-
-import {
- Header,
- Colors,
- DebugInstructions,
-} from 'react-native/Libraries/NewAppScreen';
-
-type DataItem = {
- title: string;
- value: number;
-};
-
-enum Route {
- FirstScreen = 'FirstScreen',
- SecondScreen = 'SecondScreen',
-}
-
-type RootStackParamList = {
- [Route.FirstScreen]: undefined;
- [Route.SecondScreen]: undefined;
-};
-
-LogBox.ignoreLogs([
- 'VirtualizedLists should never be nested inside plain ScrollViews',
-]);
-
-const Stack = createStackNavigator();
-
-const dataset = Array.from({ length: 100 }, (_, i) => ({
- title: `Title ${i}`,
- value: i,
-}));
-
-const Screen: React.FC<{
- route: RouteProp;
- navigation: StackNavigationProp;
-}> = ({ route, navigation }) => {
- for (let i = 0; i < 10 ** 3; i++) {}
- const isSecondScreen = route.name === Route.SecondScreen;
-
- const handleItemPress = (item: DataItem) => () => {
- if (isSecondScreen) {
- Alert.alert(item.title, item.value.toString());
- return;
- }
- navigation.navigate(Route.SecondScreen);
- };
-
- const renderItem = (item: DataItem) => (
-
-
- {item.title}
- {`This is item number ${item.value}`}
-
-
- );
-
- return (
- // So in a much more complex scenario, we might have a ScrollView that contains multiple horizontal list
- // I know it's bad to have a FlatList nested in ScrollView, ideally I should use something better
- // However, it seems like having a nested VirtualizeList in ScrollView will cause the transition lag issue
-
- item.value.toString()}
- renderItem={({ item }) => renderItem(item)}
- ItemSeparatorComponent={() => }
- ListHeaderComponent={!isSecondScreen && Header}
- ListHeaderComponentStyle={styles.headerWrapper}
- ListFooterComponent={!isSecondScreen && DebugInstructions}
- ListFooterComponentStyle={styles.footerWrapper}
- scrollEnabled={false}
- />
-
- );
-};
-
-const App: React.FC = () => {
- return (
-
-
-
-
-
-
- );
-};
-
-const styles = StyleSheet.create({
- headerWrapper: {
- overflow: 'hidden',
- },
- footerWrapper: {
- paddingVertical: 50 / 3,
- paddingHorizontal: 40 / 3,
- },
- listItemContainer: {
- flexDirection: 'row',
- alignItems: 'center',
- paddingHorizontal: 50 / 3,
- paddingVertical: 40 / 3,
- },
- image: {
- width: 200 / 3,
- aspectRatio: 1,
- borderRadius: 25 / 3,
- backgroundColor: Colors.primary,
- },
- listItemContentWrapper: {
- flexDirection: 'column',
- paddingHorizontal: 30 / 3,
- },
- listItemTitle: {
- fontWeight: 'bold',
- fontSize: 50 / 3,
- },
- separator: {
- height: 1 / 3,
- flex: 1,
- marginHorizontal: 50 / 3,
- backgroundColor: '#000',
- },
-});
-
-export default App;
diff --git a/TestsExample/src/Test1031.tsx b/TestsExample/src/Test1031.tsx
deleted file mode 100644
index f66a2a0df5..0000000000
--- a/TestsExample/src/Test1031.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import * as React from 'react';
-import { Button } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import { useHeaderHeight } from '@react-navigation/elements';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- console.log(useHeaderHeight());
- return (
- navigation.navigate('Second')}
- />
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- console.log(useHeaderHeight());
- return (
- navigation.navigate('First')}
- />
- );
-}
diff --git a/TestsExample/src/Test1036.tsx b/TestsExample/src/Test1036.tsx
deleted file mode 100644
index 738bbeaa72..0000000000
--- a/TestsExample/src/Test1036.tsx
+++ /dev/null
@@ -1,30 +0,0 @@
-import React from 'react';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-const Screen = () => {
- return null;
-};
-
-const App = () => {
- return (
-
- {
- console.log('cancel button press');
- },
- },
- }}>
-
-
-
- );
-};
-
-export default App;
diff --git a/TestsExample/src/Test1084.tsx b/TestsExample/src/Test1084.tsx
deleted file mode 100644
index 0bb4acefb0..0000000000
--- a/TestsExample/src/Test1084.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-import * as React from 'react';
-import { Button, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.navigate('Second')}
- />
-
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.goBack()}
- />
-
- );
-}
diff --git a/TestsExample/src/Test1091.tsx b/TestsExample/src/Test1091.tsx
deleted file mode 100644
index 021a0026b4..0000000000
--- a/TestsExample/src/Test1091.tsx
+++ /dev/null
@@ -1,52 +0,0 @@
-import React from 'react';
-import { Button, View, Text } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-
-import {
- createNativeStackNavigator,
- NativeStackScreenProps,
-} from '@react-navigation/native-stack';
-
-type StackParams = {
- Screen: undefined;
- Screen2: undefined;
-};
-
-const Stack = createNativeStackNavigator();
-
-const Screen2 = () => (
-
-
- Swipe gesture doesn't work on iOS 12 in @react-navigation/native-stack
-
-
-);
-
-const Screen = ({ navigation }: NativeStackScreenProps) => (
-
- navigation.navigate('Screen2')}
- />
-
-);
-
-const App = () => (
-
-
-
-
-
-
-);
-
-export default App;
diff --git a/TestsExample/src/Test111.js b/TestsExample/src/Test111.js
deleted file mode 100644
index 0ed234036b..0000000000
--- a/TestsExample/src/Test111.js
+++ /dev/null
@@ -1,66 +0,0 @@
-import React from 'react';
-import { View, Text, Button } from 'react-native';
-
-import { NavigationContainer, useNavigation } from '@react-navigation/native';
-import {
- createStackNavigator,
- TransitionPresets,
-} from '@react-navigation/stack';
-
-const Screen2 = () => {
- const navigation = useNavigation();
-
- return (
-
- navigation.goBack()}>
- to screen 2
-
-
- );
-};
-
-const Screen1 = () => {
- const navigation = useNavigation();
-
- return (
-
- navigation.navigate('Screen2')}
- />
-
- );
-};
-
-const Stack = createStackNavigator();
-
-const App = () => {
- return (
-
-
-
-
-
-
- );
-};
-
-export default App;
diff --git a/TestsExample/src/Test1153.tsx b/TestsExample/src/Test1153.tsx
deleted file mode 100644
index bcf7022574..0000000000
--- a/TestsExample/src/Test1153.tsx
+++ /dev/null
@@ -1,88 +0,0 @@
-import * as React from 'react';
-import { Button, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import { SafeAreaView } from 'react-native-safe-area-context';
-import { ScrollView } from 'react-native-gesture-handler';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
-
- {
- navigation.push('Second');
- }}
- />
-
-
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- {
- navigation.pop();
- }}
- />
- navigation.push('Second')}
- />
-
- );
-}
diff --git a/TestsExample/src/Test1157.tsx b/TestsExample/src/Test1157.tsx
deleted file mode 100644
index c195487d10..0000000000
--- a/TestsExample/src/Test1157.tsx
+++ /dev/null
@@ -1,116 +0,0 @@
-/* eslint-disable react/no-unstable-nested-components */
-/* eslint-disable react-native/no-inline-styles */
-import * as React from 'react';
-import { Button, View, TouchableOpacity } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.navigate('Second')}
- />
-
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.goBack()}
- />
-
- );
-}
-
-const Stack = createNativeStackNavigator();
-
-function ButtonWithBiggerChild(props: {
- tintColor?: string | undefined;
- onClickText?: string | undefined;
- backgroundColor?: string | undefined;
-}): JSX.Element {
- const {
- onClickText = 'Hello there General Kenobi',
- backgroundColor = 'red',
- } = props;
- return (
- console.log(onClickText)}>
-
-
- );
-}
-
-export default function App() {
- return (
-
-
- (
-
- ),
- headerRight: () => (
- console.log('there')}
- style={{
- width: 30,
- height: 30,
- backgroundColor: 'red',
- marginRight: -15,
- }}
- />
- ),
- }}
- />
- (
- console.log('General Kenobi')}
- style={{
- width: 50,
- height: 50,
- backgroundColor: 'red',
- marginLeft: -15,
- }}
- />
- ),
- }}
- />
-
-
- );
-}
diff --git a/TestsExample/src/Test1166/AndroidDifferentScreenSearch.tsx b/TestsExample/src/Test1166/AndroidDifferentScreenSearch.tsx
deleted file mode 100644
index 8d5de75e6e..0000000000
--- a/TestsExample/src/Test1166/AndroidDifferentScreenSearch.tsx
+++ /dev/null
@@ -1,79 +0,0 @@
-import * as React from 'react';
-import { Button, Image, Text, TouchableOpacity, View } from 'react-native';
-import { ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
- );
-}
-
-function SearchIconButton(props: { onPress: () => void }) {
- return (
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- React.useLayoutEffect(() => {
- function HeaderSearchButton() {
- return navigation.navigate('Search')} />;
- }
- navigation.setOptions({
- title: 'Home',
- headerRight: HeaderSearchButton,
- animation: 'none',
- });
- }, [navigation]);
- return (
-
- navigation.goBack()} />
-
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- const [text, setText] = React.useState('');
-
- React.useLayoutEffect(() => {
- navigation.setOptions({
- title: '',
- headerSearchBarOptions: {
- autoCapitalize: 'none',
- autoFocus: true,
- onClose: () => navigation.navigate('First'),
- onChangeText: e => setText(e.nativeEvent.text),
- barTintColor: text,
- },
- animation: 'none',
- });
- }, [navigation, text]);
-
- return (
-
-
- Search Results
-
- {text}
-
- );
-}
diff --git a/TestsExample/src/Test1166/AndroidSearchBarCustomization.tsx b/TestsExample/src/Test1166/AndroidSearchBarCustomization.tsx
deleted file mode 100644
index 457699be76..0000000000
--- a/TestsExample/src/Test1166/AndroidSearchBarCustomization.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import * as React from 'react';
-import { Button, View } from 'react-native';
-import { ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.goBack()} />
-
- );
-}
diff --git a/TestsExample/src/Test1166/AndroidSearchBarEvents.tsx b/TestsExample/src/Test1166/AndroidSearchBarEvents.tsx
deleted file mode 100644
index bcaad46a2f..0000000000
--- a/TestsExample/src/Test1166/AndroidSearchBarEvents.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import * as React from 'react';
-import { Button, Text, View } from 'react-native';
-import { ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- const [events, setEvents] = React.useState([]);
- React.useLayoutEffect(() => {
- const searchBar = {
- onSearchButtonPress: () => setEvents(prev => [...prev, 'Search']),
- onBlur: () => setEvents(prev => [...prev, 'Blur']),
- onClose: () => setEvents(prev => [...prev, 'Close']),
- onOpen: () => setEvents(prev => [...prev, 'Open']),
- onFocus: () => setEvents(prev => [...prev, 'Focus']),
- };
- navigation.setOptions({
- headerSearchBarOptions: searchBar,
- });
- }, [navigation]);
-
- return (
-
- navigation.goBack()} />
- {events.map((event, i) => (
- {event}
- ))}
-
- );
-}
diff --git a/TestsExample/src/Test1166/AndroidSearchTypes.tsx b/TestsExample/src/Test1166/AndroidSearchTypes.tsx
deleted file mode 100644
index 5eb21aa6b8..0000000000
--- a/TestsExample/src/Test1166/AndroidSearchTypes.tsx
+++ /dev/null
@@ -1,81 +0,0 @@
-import * as React from 'react';
-import { Button, View } from 'react-native';
-import { ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- React.useLayoutEffect(() => {
- function HeaderSearchButtons() {
- return (
-
- navigation.navigate('number')} />
- navigation.navigate('email')} />
- navigation.navigate('phone')} />
-
- );
- }
- navigation.setOptions({
- title: 'Home',
- headerRight: HeaderSearchButtons,
- animation: 'none',
- });
- }, [navigation]);
- return (
-
- navigation.navigate('number')} />
- navigation.navigate('email')} />
- navigation.navigate('phone')} />
- navigation.goBack()} />
-
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.goBack()} />
-
- );
-}
diff --git a/TestsExample/src/Test1166/index.tsx b/TestsExample/src/Test1166/index.tsx
deleted file mode 100644
index ae5538eb06..0000000000
--- a/TestsExample/src/Test1166/index.tsx
+++ /dev/null
@@ -1,74 +0,0 @@
-import React from 'react';
-import { Button, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import AndroidDifferentScreenSearch from './AndroidDifferentScreenSearch';
-import AndroidSearchBarCustomization from './AndroidSearchBarCustomization';
-import AndroidSearchTypes from './AndroidSearchTypes';
-import AndroidSearchBarEvents from './AndroidSearchBarEvents';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
-
-
-
- );
-}
-
-function Home({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
-
- navigation.navigate('Customization')}
- />
-
-
- navigation.navigate('InputTypes')}
- />
-
-
- navigation.navigate('Events')}
- />
-
-
- navigation.navigate('DifferentSearchScreen')}
- />
-
-
- );
-}
diff --git a/TestsExample/src/Test1188.tsx b/TestsExample/src/Test1188.tsx
deleted file mode 100644
index 0fa99680ec..0000000000
--- a/TestsExample/src/Test1188.tsx
+++ /dev/null
@@ -1,58 +0,0 @@
-import React from 'react';
-import { Button, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-const NestedStack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-function Home({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.navigate('Nested')}
- />
-
- );
-}
-
-const Nested = () => (
-
-
-
-);
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- // using useLayoutEffect fixes the crash
- // React.useLayoutEffect(() => {
- React.useEffect(() => {
- navigation.setOptions({
- headerSearchBarOptions: {},
- });
- }, [navigation]);
-
- return ;
-}
diff --git a/TestsExample/src/Test1190.tsx b/TestsExample/src/Test1190.tsx
deleted file mode 100644
index 7b46752a08..0000000000
--- a/TestsExample/src/Test1190.tsx
+++ /dev/null
@@ -1,67 +0,0 @@
-import * as React from 'react';
-import { Button } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-type Props = {
- navigation: NativeStackNavigationProp;
-};
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-function First({ navigation }: Props) {
- return (
- <>
- navigation.push('Second')}
- />
- navigation.replace('Second')}
- />
- navigation.goBack()} />
- >
- );
-}
-
-function Second({ navigation }: Props) {
- return (
- <>
- navigation.push('First')}
- />
- navigation.replace('First')}
- />
- navigation.goBack()} />
- >
- );
-}
diff --git a/TestsExample/src/Test1198.tsx b/TestsExample/src/Test1198.tsx
deleted file mode 100644
index 33ed867c6c..0000000000
--- a/TestsExample/src/Test1198.tsx
+++ /dev/null
@@ -1,56 +0,0 @@
-import React, { useEffect } from 'react';
-import { NavigationContainer, useIsFocused } from '@react-navigation/native';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-import { Text, View } from 'react-native';
-
-const BottomTabs = createBottomTabNavigator();
-
-function Home() {
- return (
-
- Home
-
- );
-}
-
-function Settings() {
- const isFocused = useIsFocused();
- const fetch = () => console.log('refetching data!');
-
- useEffect(() => {
- if (isFocused) {
- fetch();
- }
- }, [isFocused]);
-
- console.log({ isFocused });
-
- return (
-
- Settings
-
- );
-}
-
-const App = () => (
-
-
-
-
-
-
-);
-
-export default App;
diff --git a/TestsExample/src/Test1204.tsx b/TestsExample/src/Test1204.tsx
deleted file mode 100644
index bc4dd554c0..0000000000
--- a/TestsExample/src/Test1204.tsx
+++ /dev/null
@@ -1,110 +0,0 @@
-import * as React from 'react';
-import { Button, Text, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
-
-
- );
-}
-
-function Main({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- Example text that could be read out by TalkBack
- navigation.navigate('TransparentModal')}
- />
- navigation.navigate('ContainedTransparentModal')}
- />
-
- );
-}
-
-function Details({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
-
-
- Buttons beneath the modal shouldn't be picked up by Android
- TalkBack
-
- navigation.navigate('Second')}
- />
- navigation.goBack()} />
-
-
- );
-}
-
-function NoA11yOnAndroid({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
-
- This text shouldn't be accessible
- navigation.goBack()} />
-
-
- );
-}
diff --git a/TestsExample/src/Test1213.tsx b/TestsExample/src/Test1213.tsx
deleted file mode 100644
index a0df651a74..0000000000
--- a/TestsExample/src/Test1213.tsx
+++ /dev/null
@@ -1,59 +0,0 @@
-import React, { useEffect } from 'react';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import { Text } from 'react-native';
-
-const Stack = createNativeStackNavigator();
-const NStack = createNativeStackNavigator();
-
-const NStackNavigator = (): JSX.Element => {
- return (
-
-
-
- );
-};
-
-type Props = {
- navigation: NativeStackNavigationProp;
-};
-
-const MainScreen = ({ navigation }: Props): JSX.Element => {
- useEffect(() => {
- const unsubscribe = navigation.addListener('transitionStart', () => {
- console.log('1');
- });
-
- return unsubscribe;
- }, [navigation]);
-
- useEffect(() => {
- const unsubscribe = navigation.addListener('transitionEnd', () => {
- console.log('2');
- });
-
- return unsubscribe;
- }, [navigation]);
-
- return (
- <>
- Android
-
- Reload app a few times in terminal to see events fire more than once
-
- >
- );
-};
-
-const App = (): JSX.Element => (
-
-
-
-
-
-);
-
-export default App;
diff --git a/TestsExample/src/Test1227.tsx b/TestsExample/src/Test1227.tsx
deleted file mode 100644
index 2723edcd8a..0000000000
--- a/TestsExample/src/Test1227.tsx
+++ /dev/null
@@ -1,74 +0,0 @@
-import * as React from 'react';
-import { Button, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.navigate('Second')}
- />
-
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.navigate('Third')}
- />
-
- );
-}
-
-function Third({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.navigate('First')}
- />
-
- );
-}
diff --git a/TestsExample/src/Test1228.tsx b/TestsExample/src/Test1228.tsx
deleted file mode 100644
index f2dcf6343f..0000000000
--- a/TestsExample/src/Test1228.tsx
+++ /dev/null
@@ -1,79 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { Text, View, StyleSheet, Button } from 'react-native';
-import {
- useNavigation,
- NavigationContainer,
- DefaultTheme,
- DarkTheme,
-} from '@react-navigation/native';
-import { SafeAreaProvider } from 'react-native-safe-area-context';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-export const FirstScreen = () => {
- const [theme, setTheme] = useState(false);
- const navigation = useNavigation();
-
- useEffect(() => {
- navigation.setOptions({
- headerTitle: theme ? 'red' : 'green',
- });
- });
-
- return (
-
- Screen 1
- setTheme(!theme)} />
- navigation.navigate('screen2')} />
-
- );
-};
-
-export const SecondScreen = () => {
- const [theme, setTheme] = useState(false);
- const navigation = useNavigation();
-
- useEffect(() => {
- navigation.setOptions({
- headerTitle: theme ? 'red' : 'green',
- });
- });
-
- return (
-
- Screen 2
- setTheme(!theme)} />
- navigation.goBack()} />
-
- );
-};
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- const [theme, setTheme] = useState(false);
-
- setTimeout(() => setTheme(!theme), 5000);
-
- return (
-
-
-
-
-
-
-
-
- );
-}
-
-const style = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: 'center',
- alignItems: 'center',
- },
-});
diff --git a/TestsExample/src/Test1259.tsx b/TestsExample/src/Test1259.tsx
deleted file mode 100644
index 1bf013624a..0000000000
--- a/TestsExample/src/Test1259.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import * as React from 'react';
-import { Button } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
- navigation.navigate('Second')}
- />
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
- navigation.navigate('First')}
- />
- );
-}
diff --git a/TestsExample/src/Test1296.tsx b/TestsExample/src/Test1296.tsx
deleted file mode 100644
index 75846053be..0000000000
--- a/TestsExample/src/Test1296.tsx
+++ /dev/null
@@ -1,143 +0,0 @@
-import React, { useLayoutEffect, useState } from 'react';
-import { Dimensions, Image, StyleSheet, Text, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import { useHeaderHeight } from '@react-navigation/elements';
-import {
- GestureHandlerRootView,
- ScrollView,
- State,
- TapGestureHandler,
-} from 'react-native-gesture-handler';
-
-const Stack = createNativeStackNavigator();
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.navigate('Second')} />
- navigation.navigate('Second')} />
- navigation.navigate('Second')} />
-
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- const headerHeight = useHeaderHeight();
- useLayoutEffect(() => {
- navigation.setOptions({
- gestureResponseDistance: {
- start: 200,
- end: 250,
- top: headerHeight,
- bottom: headerHeight + 50,
- },
- });
- });
- return (
-
-
- Use swipe back gesture to go back (iOS only)
-
-
-
-
- );
-}
-
-export default function App() {
- return (
-
-
-
-
-
-
-
-
- );
-}
-
-// components
-
-function Post({ onPress }: { onPress?: () => void }) {
- const [width] = useState(Math.round(Dimensions.get('screen').width));
-
- return (
-
- e.nativeEvent.oldState === State.ACTIVE && onPress?.()
- }>
-
- Post
- {generatePhotos(4, width, 400)}
- Scroll right for more photos
-
-
- );
-}
-
-// helpers
-function generatePhotos(
- amount: number,
- width: number,
- height: number,
-): JSX.Element[] {
- const startFrom = Math.floor(Math.random() * 20) + 10;
- return Array.from({ length: amount }, (_, index) => {
- const uri = `https://picsum.photos/id/${
- startFrom + index
- }/${width}/${height}`;
- return ;
- });
-}
-
-const styles = StyleSheet.create({
- title: {
- fontWeight: 'bold',
- fontSize: 32,
- marginBottom: 8,
- marginLeft: 8,
- },
- subTitle: {
- fontSize: 18,
- marginVertical: 16,
- textAlign: 'center',
- },
- caption: {
- textAlign: 'center',
- marginTop: 4,
- },
- post: {
- borderColor: '#ccc',
- borderTopWidth: 1,
- borderBottomWidth: 1,
- paddingVertical: 10,
- marginBottom: 16,
- backgroundColor: 'white',
- },
-});
diff --git a/TestsExample/src/Test1299.tsx b/TestsExample/src/Test1299.tsx
deleted file mode 100644
index 905627bc89..0000000000
--- a/TestsExample/src/Test1299.tsx
+++ /dev/null
@@ -1,68 +0,0 @@
-import * as React from 'react';
-import { View, StyleSheet, Button } from 'react-native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import { NavigationContainer, useNavigation } from '@react-navigation/native';
-
-export const Modal1 = React.memo(() => {
- return ;
-});
-
-export const Modal2 = React.memo(() => {
- return (
-
- );
-});
-export const MainScreen = React.memo(() => {
- const navigation = useNavigation();
- return (
-
- {
- navigation.navigate('modalScreen-1');
- }}
- />
- {
- navigation.navigate('modalScreen-2');
- }}
- />
-
- );
-});
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: 'center',
- backgroundColor: '#ecf0f1',
- },
-});
diff --git a/TestsExample/src/Test1419.tsx b/TestsExample/src/Test1419.tsx
deleted file mode 100644
index 000ac998a3..0000000000
--- a/TestsExample/src/Test1419.tsx
+++ /dev/null
@@ -1,89 +0,0 @@
-import React from 'react';
-import {
- View,
- Text,
- Button,
- KeyboardAvoidingView,
- Platform,
- TouchableWithoutFeedback,
- Keyboard,
- Image,
- TextInput,
-} from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- First screen
- navigation.navigate('Second')}
- />
-
- );
-}
-
-function Second() {
- return (
-
-
-
-
-
-
-
-
- );
-}
-
-const { Navigator, Screen } = createNativeStackNavigator();
-
-export default () => {
- return (
-
-
-
-
-
-
- );
-};
diff --git a/TestsExample/src/Test1473.tsx b/TestsExample/src/Test1473.tsx
deleted file mode 100644
index 1f22cc7418..0000000000
--- a/TestsExample/src/Test1473.tsx
+++ /dev/null
@@ -1,83 +0,0 @@
-import React from 'react';
-import { StyleSheet, View, Text, Button } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-function First(props) {
- return (
-
- This is the first screen
- props.navigation.navigate('Second')}
- title="Navigate to second screen"
- />
-
- );
-}
-
-function Second(props) {
- return (
-
- This is the second screen
- props.navigation.navigate('Modal')}
- title="Open modal"
- />
-
- );
-}
-
-function Modal(props) {
- return (
-
- This is the modal
- props.navigation.goBack()}
- title="Close the modal"
- />
-
- );
-}
-
-function App() {
- return (
-
-
-
-
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: 'center',
- alignItems: 'center',
- },
-});
-
-export default App;
diff --git a/TestsExample/src/Test1649.tsx b/TestsExample/src/Test1649.tsx
deleted file mode 100644
index 2a74361694..0000000000
--- a/TestsExample/src/Test1649.tsx
+++ /dev/null
@@ -1,216 +0,0 @@
-import * as React from 'react';
-import { Button, StyleSheet, View, Text, ScrollView } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
- NativeStackNavigationOptions,
-} from '@react-navigation/native-stack';
-import { SheetDetentTypes } from 'react-native-screens';
-
-const Stack = createNativeStackNavigator();
-
-export default function App(): JSX.Element {
- const initialScreenOptions: NativeStackNavigationOptions = {
- presentation: 'formSheet',
- sheetAllowedDetents: 'all',
- sheetLargestUndimmedDetent: 'medium',
- sheetGrabberVisible: false,
- sheetCornerRadius: -1,
- sheetExpandsWhenScrolledToEdge: true,
- };
-
- return (
-
- ,
- headerTitleStyle: {
- color: 'cyan',
- },
- headerShown: true,
- headerBackVisible: false,
- }}>
-
-
-
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
- navigation.navigate('Second')}
- />
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
- <>
- navigation.navigate('SheetScreen')}
- />
- navigation.navigate('SheetScreenWithScrollView')}
- />
- >
- );
-}
-
-function SheetScreen({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- const [radius, setRadius] = React.useState(-1);
- const [detent, setDetent] = React.useState('all');
- const [largestUndimmedDetent, sheetLargestUndimmedDetent] =
- React.useState('all');
- const [isGrabberVisible, setIsGrabberVisible] = React.useState(false);
- // navigation
- const [shouldExpand, setShouldExpand] = React.useState(true);
-
- function nextDetentLevel(currDetent: SheetDetentTypes): SheetDetentTypes {
- if (currDetent === 'all') {
- return 'medium';
- } else if (currDetent === 'medium') {
- return 'large';
- } else if (currDetent === 'large') {
- return 'all';
- } else {
- console.warn('Unhandled sheetDetent type');
- return 'all';
- }
- }
-
- return (
-
- navigation.navigate('First')}
- />
- navigation.navigate('Second')}
- />
- {
- const newRadius = radius >= 150 ? -1.0 : radius + 50;
- setRadius(newRadius);
- navigation.setOptions({
- sheetCornerRadius: newRadius,
- });
- }}
- />
- radius: {radius}
- {
- const newDetentLevel = nextDetentLevel(detent);
- setDetent(newDetentLevel);
- navigation.setOptions({
- sheetAllowedDetents: newDetentLevel,
- });
- }}
- />
- detent: {detent}
- {
- const newDetentLevel = nextDetentLevel(largestUndimmedDetent);
- sheetLargestUndimmedDetent(newDetentLevel);
- navigation.setOptions({
- sheetLargestUndimmedDetent: newDetentLevel,
- });
- }}
- />
- largestUndimmedDetent: {largestUndimmedDetent}
- {
- setShouldExpand(!shouldExpand);
- navigation.setOptions({
- sheetExpandsWhenScrolledToEdge: !shouldExpand,
- });
- }}
- />
-
- sheetExpandsWhenScrolledToEdge: {shouldExpand ? 'true' : 'false'}
-
- {
- setIsGrabberVisible(!isGrabberVisible);
- navigation.setOptions({
- sheetGrabberVisible: !isGrabberVisible,
- });
- }}
- />
-
- );
-}
-
-function SheetScreenWithScrollView({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
- <>
-
-
-
- {[...Array(40).keys()].map(val => (
- Some component {val}
- ))}
-
-
- >
- );
-}
-
-const styles = StyleSheet.create({
- headerView: {
- height: 20,
- width: 20,
- backgroundColor: 'red',
- },
- centeredView: {
- justifyContent: 'center',
- alignItems: 'center',
- },
-});
diff --git a/TestsExample/src/Test1671.tsx b/TestsExample/src/Test1671.tsx
deleted file mode 100644
index a0e0790bba..0000000000
--- a/TestsExample/src/Test1671.tsx
+++ /dev/null
@@ -1,72 +0,0 @@
-import React from 'react';
-import { View } from 'react-native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import { useHeaderHeight } from '@react-navigation/elements';
-import { NavigationContainer } from '@react-navigation/native';
-
-const App = () => {
- const backgroundStyle = {
- backgroundColor: '#fafffe', // isDarkMode ? Colors.darker : Colors.lighter,
- };
-
- return (
-
-
-
-
-
- );
-};
-
-const List = () => {
- const headerHeight = useHeaderHeight();
-
- return (
-
-
-
- );
-};
-
-const Stack = createNativeStackNavigator();
-
-const Navigation = () => {
- return (
-
-
-
-
-
- );
-};
-
-export default App;
diff --git a/TestsExample/src/Test1726.tsx b/TestsExample/src/Test1726.tsx
deleted file mode 100644
index fec7a888b8..0000000000
--- a/TestsExample/src/Test1726.tsx
+++ /dev/null
@@ -1,47 +0,0 @@
-import { NavigationContainer } from '@react-navigation/native';
-import React from 'react';
-import { Button, View } from 'react-native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-const RootStack = createNativeStackNavigator();
-
-const Screen1 = ({ navigation: { navigate } }) => (
-
- navigate('Screen2')} title="Screen 2" />
-
-);
-
-const Screen2 = ({ navigation: { navigate } }) => (
-
- navigate('Screen3')} title="Screen 3" />
-
-);
-
-const Screen3 = () => ;
-
-const App = () => {
- return (
-
-
-
-
-
-
-
- );
-};
-
-export default App;
diff --git a/TestsExample/src/Test1829/index.tsx b/TestsExample/src/Test1829/index.tsx
deleted file mode 100644
index 8db68dd0db..0000000000
--- a/TestsExample/src/Test1829/index.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import React from 'react';
-import { SafeAreaProvider } from 'react-native-safe-area-context';
-import { NavigationContainer } from '@react-navigation/native';
-
-import Stacks from './navigation/Stacks';
-
-const App = () => (
-
-
-
-
-
-);
-
-export default App;
diff --git a/TestsExample/src/Test1829/navigation/Stacks.tsx b/TestsExample/src/Test1829/navigation/Stacks.tsx
deleted file mode 100644
index 8dd2d8a7a4..0000000000
--- a/TestsExample/src/Test1829/navigation/Stacks.tsx
+++ /dev/null
@@ -1,47 +0,0 @@
-import React from 'react';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-import HomeView from '../screens/HomeView';
-import ModalView from '../screens/ModalView';
-import BaseView from '../screens/InnerView';
-import InnerModal from '../screens/InnerModal';
-
-const RootStack = createNativeStackNavigator();
-const InnerStack = createNativeStackNavigator();
-
-const Inner = () => (
-
-
-
-
-);
-
-const Stacks = () => (
-
-
-
-
-
-
-);
-
-export default Stacks;
diff --git a/TestsExample/src/Test1829/screens/CardView.tsx b/TestsExample/src/Test1829/screens/CardView.tsx
deleted file mode 100644
index 66f8310663..0000000000
--- a/TestsExample/src/Test1829/screens/CardView.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import React from 'react';
-import { TouchableOpacity, View, Text, StyleSheet } from 'react-native';
-
-const CardView = () => {
- return ;
-};
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: 'center',
- alignItems: 'center',
- backgroundColor: 'blue',
- },
-});
-
-export default CardView;
diff --git a/TestsExample/src/Test1829/screens/HomeView.tsx b/TestsExample/src/Test1829/screens/HomeView.tsx
deleted file mode 100644
index 13225d6f34..0000000000
--- a/TestsExample/src/Test1829/screens/HomeView.tsx
+++ /dev/null
@@ -1,43 +0,0 @@
-import React from 'react';
-import { TouchableOpacity, View, Text, StyleSheet } from 'react-native';
-import { useNavigation } from '@react-navigation/native';
-
-const HomeView = () => {
- const navigation = useNavigation();
- return (
-
- navigation.navigate('inner')}>
-
- Open Inner Navigator
-
-
- navigation.navigate('modal')}>
-
- Open Outer Modal
-
-
-
- );
-};
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: 'center',
- alignItems: 'center',
- backgroundColor: 'yellow',
- },
- button: {
- width: 200,
- height: 50,
- justifyContent: 'center',
- alignItems: 'center',
- borderRadius: 5,
- backgroundColor: 'blue',
- },
- buttonText: {
- color: 'white',
- },
-});
-
-export default HomeView;
diff --git a/TestsExample/src/Test1829/screens/InnerModal.tsx b/TestsExample/src/Test1829/screens/InnerModal.tsx
deleted file mode 100644
index 7eaadd884f..0000000000
--- a/TestsExample/src/Test1829/screens/InnerModal.tsx
+++ /dev/null
@@ -1,47 +0,0 @@
-import React from 'react';
-import { TouchableOpacity, View, Text, StyleSheet } from 'react-native';
-import { useNavigation } from '@react-navigation/native';
-
-const HomeView = () => {
- const navigation = useNavigation();
- return (
-
-
- This is the inner modal. Opening the outer modal here does not work.
- WTF?
-
- navigation.navigate('modal')}>
-
- Open Outer Modal
-
-
- navigation.goBack()}>
-
- Back
-
-
-
- );
-};
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: 'center',
- alignItems: 'center',
- backgroundColor: 'yellow',
- },
- button: {
- width: 200,
- height: 50,
- justifyContent: 'center',
- alignItems: 'center',
- borderRadius: 5,
- backgroundColor: 'blue',
- },
- buttonText: {
- color: 'white',
- },
-});
-
-export default HomeView;
diff --git a/TestsExample/src/Test1829/screens/InnerView.tsx b/TestsExample/src/Test1829/screens/InnerView.tsx
deleted file mode 100644
index a410092684..0000000000
--- a/TestsExample/src/Test1829/screens/InnerView.tsx
+++ /dev/null
@@ -1,51 +0,0 @@
-import React from 'react';
-import { TouchableOpacity, View, Text, StyleSheet } from 'react-native';
-import { useNavigation } from '@react-navigation/native';
-
-const HomeView = () => {
- const navigation = useNavigation();
- return (
-
-
- This is the inner navigator. Opening the outer modal here works!
-
- navigation.navigate('inner-modal')}>
-
- Open Inner Modal
-
-
- navigation.navigate('modal')}>
-
- Open Outer Modal
-
-
- navigation.goBack()}>
-
- Go back
-
-
-
- );
-};
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: 'center',
- alignItems: 'center',
- backgroundColor: 'yellow',
- },
- button: {
- width: 200,
- height: 50,
- justifyContent: 'center',
- alignItems: 'center',
- borderRadius: 5,
- backgroundColor: 'blue',
- },
- buttonText: {
- color: 'white',
- },
-});
-
-export default HomeView;
diff --git a/TestsExample/src/Test1829/screens/ModalView.tsx b/TestsExample/src/Test1829/screens/ModalView.tsx
deleted file mode 100644
index 7bc62ebb92..0000000000
--- a/TestsExample/src/Test1829/screens/ModalView.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-import React, { useEffect } from 'react';
-import { TouchableOpacity, View, Text, StyleSheet } from 'react-native';
-import { useNavigation } from '@react-navigation/native';
-
-const ModalView = () => {
- useEffect(() => {
- console.log('ModalView mounted');
- }, []);
-
- const navigation = useNavigation();
- return (
-
-
- This is the outer modal. If you try to open it from the inner modal, it
- doesn't work. But if you comment out the `presentation: modal` on the
- inner modal, it does work! In addition, if opening a modal in the same
- navigator stack also works.
-
- navigation.navigate('modal-2')}>
-
- Open sibling outer modal.
-
-
- navigation.goBack()}>
-
- Back
-
-
-
- );
-};
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: 'center',
- alignItems: 'center',
- backgroundColor: 'green',
- },
- button: {
- width: 200,
- height: 50,
- justifyContent: 'center',
- alignItems: 'center',
- borderRadius: 5,
- backgroundColor: 'blue',
- },
- buttonText: {
- color: 'white',
- },
-});
-
-export default ModalView;
diff --git a/TestsExample/src/Test1864.tsx b/TestsExample/src/Test1864.tsx
deleted file mode 100644
index 36bd17698b..0000000000
--- a/TestsExample/src/Test1864.tsx
+++ /dev/null
@@ -1,76 +0,0 @@
-import * as React from 'react';
-import { Button, View, Text } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import { NativeStackNavigationProp } from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-type NavProp = {
- navigation: NativeStackNavigationProp;
-};
-
-export default function App() {
- return (
-
-
-
-
-
-
-
-
- );
-}
-
-const ScreenA = ({ navigation }: NavProp) => (
-
- Screen A
- navigation.navigate('screenB')}
- title="Go to screen B"
- />
-
-);
-
-const ScreenB = ({ navigation }: NavProp) => (
-
- Screen B
- navigation.navigate('screenC')}
- title="Go to screen C"
- />
-
-);
-
-const ScreenC = ({ navigation }: NavProp) => (
-
- Screen C
- navigation.navigate('screenD')}
- title="Go to screen D"
- />
-
-);
-
-const ScreenD = (_props: NavProp) => (
-
- Screen D
-
-);
diff --git a/TestsExample/src/Test1970.jsx b/TestsExample/src/Test1970.jsx
deleted file mode 100644
index c6c8377b84..0000000000
--- a/TestsExample/src/Test1970.jsx
+++ /dev/null
@@ -1,73 +0,0 @@
-import { NavigationContainer, useNavigation } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import { Button, StyleSheet, Text } from 'react-native';
-
-const Stack = createNativeStackNavigator();
-
-const Home = () => {
- const navigation = useNavigation();
-
- return (
- <>
- Home Screen - Portrait
- navigation.navigate('Landscape')} />
- >
- );
-};
-
-const Landscape = () => {
- const navigation = useNavigation();
-
- return (
- <>
- Landscape Screen
- navigation.goBack()} />
- >
- );
-};
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- backgroundColor: '#fff',
- alignItems: 'center',
- justifyContent: 'center',
- },
-});
diff --git a/TestsExample/src/Test1981.tsx b/TestsExample/src/Test1981.tsx
deleted file mode 100644
index 511c2b6a8c..0000000000
--- a/TestsExample/src/Test1981.tsx
+++ /dev/null
@@ -1,103 +0,0 @@
-import React from 'react';
-import { NavigationContainer, NavigationContext, ParamListBase } from '@react-navigation/native';
-import { createNativeStackNavigator, NativeStackNavigationProp } from '@react-navigation/native-stack';
-import { View, StyleSheet, Button, Pressable, Text } from 'react-native';
-
-type NavProp = {
- navigation: NativeStackNavigationProp;
-};
-
-const Stack = createNativeStackNavigator();
-
-function FirstScreen({ navigation }: NavProp) {
- const navigateToSecond = () => {
- navigation.navigate('Second');
- };
- return (
-
-
-
-
- );
-}
-
-function SecondScreen({ navigation }: NavProp) {
- const navigateToFirst = () => {
- navigation.navigate('First');
- };
-
- return (
-
-
-
- );
-}
-
-function HeaderLeft() {
- const onPressCallback = () => {
- console.log('HeaderLeft onPressCallback invoked');
- };
-
- return (
-
- Press me
-
- );
-}
-
-function PressableWithHitSlop() {
- const onPressCallback = () => {
- console.log('PressableWithHitSlop onPressCallback invoked');
- };
-
- return (
-
-
- Press me
-
-
- );
-}
-
-export default function App() {
- return (
-
-
- HeaderLeft(),
- headerRight: () => PressableWithHitSlop(),
- }}
- />
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- redbox: {
- backgroundColor: 'red',
- },
- greenbox: {
- backgroundColor: 'green',
- },
- bluebox: {
- backgroundColor: 'blue',
- },
- centeredView: {
- flex: 1,
- justifyContent: 'center',
- alignItems: 'center',
- },
-});
diff --git a/TestsExample/src/Test2008.tsx b/TestsExample/src/Test2008.tsx
deleted file mode 100644
index ceb556a351..0000000000
--- a/TestsExample/src/Test2008.tsx
+++ /dev/null
@@ -1,184 +0,0 @@
-import React from 'react';
-import { Text, View, SafeAreaView, StyleSheet, Pressable } from 'react-native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import {
- NavigationContainer,
- useNavigation,
- ParamListBase,
- type NavigationProp,
-} from '@react-navigation/native';
-import { SafeAreaProvider } from 'react-native-safe-area-context';
-
-const styles = StyleSheet.create({
- inner: {
- flex: 1,
- backgroundColor: 'white',
- },
- safeArea: {
- flex: 1,
- backgroundColor: 'red',
- },
- innerModal: {
- flex: 1,
- backgroundColor: 'rgba(0,0,0,0.4)',
- justifyContent: 'center',
- alignItems: 'center',
- },
- pressable: {
- padding: 20,
- backgroundColor: '#ccc',
- marginVertical: 5,
- },
-
- textIntro: {
- padding: 10,
- },
-
- buttons: {
- flexDirection: 'row',
- padding: 10,
- },
-
- text: {
- textAlign: 'center',
- },
-});
-
-type RootStackScreens = {
- Home: undefined;
- Modal: undefined;
- TransparentModal: undefined;
- ContainedTransparentModal: undefined;
-};
-
-const RootStack = createNativeStackNavigator();
-
-function Home() {
- const navigation = useNavigation>();
- return (
-
-
-
- Red represents the safe area padding as provided by React Native Safe
- Area Context (although I've noticed that the issue also affects the
- build in react native SafeArea component).
-
-
- This only applies to iOS. Ensure you have rotation lock off, and
- rotate the view into landscape orientation. Note how the red safe
- areas appear. Then tap `Spawn Transparent Modal`, dismiss the modal,
- and then rotate the screen again to see how the safe areas are now
- stuck as the portrait values. You must force quite the app to undo the
- bug.
-
- navigation.navigate('Modal')}>
- "modal"
-
- navigation.navigate('ContainedTransparentModal')}>
- "containedTransparentModal"
-
- navigation.navigate('TransparentModal')}>
- "transparentModal"
-
-
-
- );
-}
-
-function Modal({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- Modal
- navigation.goBack()}>
- Go Back!
-
- navigation.push('Modal')}>
- Open another modal!
-
-
- );
-}
-
-function TransparentModal({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- Transparent Modal
- navigation.goBack()}>
- Go Back!
-
- navigation.push('TransparentModal')}>
- Open another modal!
-
-
- );
-}
-
-function ContainedTransparentModal({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- Contained Transparent Modal
- navigation.goBack()}>
- Go Back!
-
- navigation.push('ContainedTransparentModal')}>
- Open another modal!
-
-
- );
-}
-
-export default function App() {
- return (
-
-
-
-
-
-
-
-
-
-
- );
-}
diff --git a/TestsExample/src/Test2048.tsx b/TestsExample/src/Test2048.tsx
deleted file mode 100644
index e4efdcaf3b..0000000000
--- a/TestsExample/src/Test2048.tsx
+++ /dev/null
@@ -1,85 +0,0 @@
-import React from 'react';
-import { View, Modal, Button, TouchableWithoutFeedback } from 'react-native';
-import { useState } from 'react';
-
-import { NavigationContainer, useNavigation } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-type AppStackPages = {
- Home: undefined;
- Modal: undefined;
-};
-
-function HomeScreen() {
- const navigation = useNavigation();
- const [visible, setVisible] = useState(false);
-
- return (
-
- setVisible(prev => !prev)}
- />
-
- setVisible(false)}>
-
-
-
- {
- // Issue: autohiding the Modal that serves as a bottom sheet unmounts
- // the anchor component for the screen that is in { presentation: "modal" } mode
- // Previously the anchoring component for a { presentation: "modal" }-based screen was different and it worked
- // The culprit is: https://github.com/software-mansion/react-native-screens/pull/1912 released in https://github.com/software-mansion/react-native-screens/releases/tag/3.29.0
- // adding setTimeout does not bring any good, because
- // - we either don't see navigation action
- // - we unmount both the bottom sheet modal and the screen itself
-
- setVisible(false);
-
- navigation.navigate('Modal');
- }}
- />
-
-
-
- );
-}
-
-function ModalScreen() {
- return ;
-}
-
-const AppStack = createNativeStackNavigator();
-
-function Navigation() {
- return (
-
-
-
-
- );
-}
-
-export default function App() {
- return (
-
-
-
- );
-}
diff --git a/TestsExample/src/Test2069.tsx b/TestsExample/src/Test2069.tsx
deleted file mode 100644
index 1021b11eb0..0000000000
--- a/TestsExample/src/Test2069.tsx
+++ /dev/null
@@ -1,99 +0,0 @@
-import { NavigationContainer } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-import React, { useState } from 'react';
-import { StyleSheet, Text, TouchableOpacity, View } from 'react-native';
-
-type StackParamList = {
- Home: undefined;
- Home1: undefined;
- Home2: undefined;
- Home3: undefined;
-};
-
-interface MainScreenProps {
- navigation: NativeStackNavigationProp;
-}
-
-const Home = ({ navigation }: MainScreenProps) => (
-
- {
- navigation.navigate('Home1');
- navigation.navigate('Home2');
- }}>
- This is the initial View
-
-
-);
-
-const Home1 = ({ navigation }: MainScreenProps) => (
-
- navigation.goBack()}>This is View 1
-
-);
-
-const Home2 = ({ navigation }: MainScreenProps) => (
-
- navigation.goBack()}>This is View 2
-
-);
-
-const Home3 = ({ navigation }: MainScreenProps) => (
-
- {/* goBack shouldn't work here. */}
- navigation.goBack()}>This is View 3
-
-);
-
-const Stack = createNativeStackNavigator();
-
-const Test2069 = () => {
- const [hasChangedState, setHasChangedState] = useState(0);
-
- return (
-
-
- {hasChangedState % 3 === 0 ? (
- <>
-
-
-
- >
- ) : hasChangedState % 3 === 1 ? (
- <>
-
- >
- ) : (
- <>
-
- >
- )}
-
- setHasChangedState(old => old + 1)}>
- Change state
-
-
- );
-};
-
-const styles = StyleSheet.create({
- button: {
- justifyContent: 'center',
- alignItems: 'center',
- height: 100,
- },
- view: {
- alignItems: 'center',
- backgroundColor: '#b7c4bb',
- flex: 1,
- justifyContent: 'center',
- padding: 12,
- },
-});
-
-export default Test2069;
diff --git a/TestsExample/src/Test2118.tsx b/TestsExample/src/Test2118.tsx
deleted file mode 100644
index 0e1c90cf2d..0000000000
--- a/TestsExample/src/Test2118.tsx
+++ /dev/null
@@ -1,88 +0,0 @@
-import React from 'react';
-import { View, Text, Button, Pressable, StyleSheet, Alert } from 'react-native';
-import { NavigationContainer, useNavigation } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator(); // <-- change to createStackNavigator to see a difference
-
-const ModalStack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
-
- );
-}
-
-function HomeScreen() {
- const navigation = useNavigation();
- return (
-
- Home Screen
- navigation.navigate('DetailsStack')}
- />
- navigation.navigate('StackInModal')}
- />
-
- );
-}
-
-function DetailsScreen() {
- return (
-
- {new Array(10).fill(0).map((_, i) => (
- {
- Alert.alert('Pressed!');
- }}
- style={({ pressed }) => [
- {
- backgroundColor: pressed ? 'rgb(210, 230, 255)' : 'white',
- },
- styles.wrapperCustom,
- ]}>
- {({ pressed }) => (
- {pressed ? 'Pressed!' : 'Press Me'}
- )}
-
- ))}
-
- );
-}
-
-function StackInModal() {
- return (
-
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- wrapperCustom: {
- width: '100%',
- height: 100,
- marginHorizontal: 30,
- borderRadius: 10,
- margin: 10,
- },
- text: {
- fontSize: 20,
- color: 'black',
- },
-});
diff --git a/TestsExample/src/Test263.js b/TestsExample/src/Test263.js
deleted file mode 100644
index 5be4222247..0000000000
--- a/TestsExample/src/Test263.js
+++ /dev/null
@@ -1,125 +0,0 @@
-import React, { Component } from 'react';
-import { StyleSheet, Animated, Button } from 'react-native';
-
-import {
- PanGestureHandler,
- ScrollView,
- State,
-} from 'react-native-gesture-handler';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-function Example() {
- return (
-
-
-
- );
-}
-
-class DraggableBox extends Component {
- constructor(props) {
- super(props);
- this._translateX = new Animated.Value(0);
- this._translateY = new Animated.Value(0);
- this._lastOffset = { x: 0, y: 0 };
- this._onGestureEvent = Animated.event(
- [
- {
- nativeEvent: {
- translationX: this._translateX,
- translationY: this._translateY,
- },
- },
- ],
- { useNativeDriver: true },
- );
- }
-
- _onHandlerStateChange = event => {
- if (event.nativeEvent.oldState === State.ACTIVE) {
- this._lastOffset.x += event.nativeEvent.translationX;
- this._lastOffset.y += event.nativeEvent.translationY;
- this._translateX.setOffset(this._lastOffset.x);
- this._translateX.setValue(0);
- this._translateY.setOffset(this._lastOffset.y);
- this._translateY.setValue(0);
- }
- };
-
- render() {
- return (
-
-
-
- );
- }
-}
-
-const NativeStack = createNativeStackNavigator();
-
-const HomeScreen = ({ navigation }) => {
- return (
-
- navigation.push('Second')} />
-
- );
-};
-
-export default function ReactNativeScreensBugs() {
- return (
-
-
-
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- scrollView: {
- flex: 1,
- backgroundColor: '#F5FCFF',
- },
-
- box: {
- width: '100%',
- height: 500,
- alignSelf: 'center',
- backgroundColor: 'plum',
- margin: 10,
- zIndex: 200,
- },
-});
diff --git a/TestsExample/src/Test349.js b/TestsExample/src/Test349.js
deleted file mode 100644
index 6e12baec33..0000000000
--- a/TestsExample/src/Test349.js
+++ /dev/null
@@ -1,108 +0,0 @@
-import React from 'react';
-import { StyleSheet, ScrollView, TextInput, View, Text } from 'react-native';
-
-import { Colors } from 'react-native/Libraries/NewAppScreen';
-import { NavigationContainer } from '@react-navigation/native';
-import { createStackNavigator } from '@react-navigation/stack';
-import { TouchableOpacity } from 'react-native-gesture-handler';
-
-const LoginScreen = props => {
- return (
- <>
-
-
- props.navigation.replace('Home')}
- style={{
- height: 60,
- backgroundColor: 'red',
- width: '100%',
- justifyContent: 'center',
- alignItems: 'center',
- }}>
- LOGIN
-
-
-
-
-
- >
- );
-};
-
-const HomeScreen = props => {
- return (
-
-
- Hello. Welcome. You should now be prompted to save your credentials.
-
- props.navigation.replace('Login')}
- style={{
- height: 60,
- backgroundColor: 'red',
- width: '100%',
- justifyContent: 'center',
- alignItems: 'center',
- }}>
- LOGIN
-
-
- );
-};
-
-const Stack = createStackNavigator();
-
-function MyStack() {
- return (
-
-
-
-
- );
-}
-
-export default function App() {
- return (
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- scrollView: {
- backgroundColor: Colors.lighter,
- },
- body: {
- backgroundColor: Colors.white,
- },
-});
diff --git a/TestsExample/src/Test528.js b/TestsExample/src/Test528.js
deleted file mode 100644
index 46e80c2a35..0000000000
--- a/TestsExample/src/Test528.js
+++ /dev/null
@@ -1,67 +0,0 @@
-import React, { useLayoutEffect } from 'react';
-import { View, Text, Pressable, Alert } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-const CustomHeaderRight = () => {
- return (
- Alert.alert('hi')}
- style={{ backgroundColor: 'orange' }}>
- Custom Button
-
- );
-};
-const Screen1 = props => {
- useLayoutEffect(() => {
- props.navigation.setOptions({
- headerRight: () => ,
- });
- }, [props.navigation]);
- return (
-
- Screen 1
- props.navigation.navigate('Screen2')}>
- Go to Screen 2
-
-
- );
-};
-const Screen2 = () => {
- return (
-
- Screen 2
-
- );
-};
-
-const Stack = createNativeStackNavigator();
-const Router = () => {
- return (
-
-
-
-
- );
-};
-const App = () => {
- return (
-
-
-
- );
-};
-
-export default App;
diff --git a/TestsExample/src/Test550.js b/TestsExample/src/Test550.js
deleted file mode 100644
index f0deb1ab1d..0000000000
--- a/TestsExample/src/Test550.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import React from 'react';
-import { Button, ScrollView, StyleSheet } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-function HomeScreen({ navigation }) {
- return (
-
- navigation.navigate('Details')}
- title="Go to Details"
- />
-
- );
-}
-
-function DetailsScreen() {
- return ;
-}
-
-const RootStack = createNativeStackNavigator();
-
-function RootStackScreen() {
- return (
-
-
-
-
- );
-}
-
-export default function App() {
- return (
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- contentContainer: {
- flex: 1,
- alignItems: 'center',
- justifyContent: 'center',
- },
-});
diff --git a/TestsExample/src/Test564.js b/TestsExample/src/Test564.js
deleted file mode 100644
index 89d30dbc1d..0000000000
--- a/TestsExample/src/Test564.js
+++ /dev/null
@@ -1,38 +0,0 @@
-import React from 'react';
-import { ScrollView, Button } from 'react-native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-import { NavigationContainer } from '@react-navigation/native';
-
-const Tab = createBottomTabNavigator();
-const Stack = createNativeStackNavigator();
-
-function HomeScreen({ navigation }) {
- return (
-
- navigation.navigate('TabNavigator')}
- />
-
- );
-}
-
-const TabNavigator = () => (
-
-
-
-
-
-);
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
diff --git a/TestsExample/src/Test577.js b/TestsExample/src/Test577.js
deleted file mode 100644
index 48b924c835..0000000000
--- a/TestsExample/src/Test577.js
+++ /dev/null
@@ -1,54 +0,0 @@
-import React from 'react';
-import { StyleSheet, View, Text, Button } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-function Home(props) {
- return (
-
- This is the homescreen!
- props.navigation.navigate('Modal')}
- title="Open modal"
- />
-
- );
-}
-function Modal(props) {
- return (
-
- This is the Modal!
- props.navigation.goBack()} title="Go back" />
-
- );
-}
-
-const Stack = createNativeStackNavigator();
-
-export function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: 'center',
- alignItems: 'center',
- },
-});
-
-export default App;
diff --git a/TestsExample/src/Test593.tsx b/TestsExample/src/Test593.tsx
deleted file mode 100644
index c06916b1a2..0000000000
--- a/TestsExample/src/Test593.tsx
+++ /dev/null
@@ -1,423 +0,0 @@
-/* eslint-disable react-hooks/exhaustive-deps */
-import React, { createContext, useState, useContext, useEffect } from 'react';
-import {
- ScrollView,
- Button,
- Platform,
- Text,
- TouchableOpacity,
- StyleSheet,
- Dimensions,
- View,
- ViewStyle,
-} from 'react-native';
-import { nanoid } from 'nanoid/non-secure';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-type Props = {
- navigation: NativeStackNavigationProp;
-};
-
-const Stack = createNativeStackNavigator();
-const NestedStack = createNativeStackNavigator();
-
-function Deeper({ navigation }: Props) {
- const toast = useToast();
-
- useEffect(() => {
- const unsubscribe = navigation.addListener(
- 'transitionStart',
- ({ data }) => {
- toast.push({
- message: `Deeper | transitionStart | ${
- data.closing ? 'closing' : 'opening'
- }`,
- backgroundColor: 'orange',
- });
- },
- );
-
- return unsubscribe;
- }, [navigation]);
-
- useEffect(() => {
- const unsubscribe = navigation.addListener('transitionEnd', ({ data }) => {
- toast.push({
- message: `Deeper | transitionEnd | ${
- data.closing ? 'closing' : 'opening'
- }`,
- backgroundColor: 'dodgerblue',
- });
- });
-
- return unsubscribe;
- }, [navigation]);
-
- React.useEffect(() => {
- const unsubscribe = navigation.addListener(
- 'transitionStart',
- ({ data }) => {
- console.warn(
- Platform.OS +
- ' Deeper transitionStart ' +
- (data.closing ? 'closing' : 'opening'),
- );
- },
- );
-
- return unsubscribe;
- }, [navigation]);
-
- React.useEffect(() => {
- const unsubscribe = navigation.addListener('transitionEnd', ({ data }) => {
- console.warn(
- Platform.OS +
- ' Deeper transitionEnd ' +
- (data.closing ? 'closing' : 'opening'),
- );
- });
-
- return unsubscribe;
- }, [navigation]);
-
- return (
-
-
-
-
- );
-}
-
-export default function NativeNavigation() {
- return (
-
-
-
-
-
-
-
-
- );
-}
-
-function Status({ navigation }: Props) {
- const toast = useToast();
-
- useEffect(() => {
- const unsubscribe = navigation.addListener(
- 'transitionStart',
- ({ data }) => {
- toast.push({
- message: `Status | transitionStart | ${
- data.closing ? 'closing' : 'opening'
- }`,
- backgroundColor: 'orange',
- });
- },
- );
-
- return unsubscribe;
- }, [navigation]);
-
- useEffect(() => {
- const unsubscribe = navigation.addListener('transitionEnd', ({ data }) => {
- toast.push({
- message: `Status | transitionEnd | ${
- data.closing ? 'closing' : 'opening'
- }`,
- backgroundColor: 'dodgerblue',
- });
- });
-
- return unsubscribe;
- }, [navigation]);
-
- React.useEffect(() => {
- const unsubscribe = navigation.addListener(
- 'transitionStart',
- ({ data }) => {
- console.warn(
- Platform.OS +
- ' Status transitionStart ' +
- (data.closing ? 'closing' : 'opening'),
- );
- },
- );
-
- return unsubscribe;
- }, [navigation]);
-
- React.useEffect(() => {
- const unsubscribe = navigation.addListener('transitionEnd', ({ data }) => {
- console.warn(
- Platform.OS +
- ' Status transitionEnd ' +
- (data.closing ? 'closing' : 'opening'),
- );
- });
-
- return unsubscribe;
- }, [navigation]);
-
- return (
-
- navigation.navigate('Deeper')} />
-
- );
-}
-
-function Privacy({ navigation }: Props) {
- const toast = useToast();
-
- useEffect(() => {
- const unsubscribe = navigation.addListener(
- 'transitionStart',
- ({ data }) => {
- toast.push({
- message: `Privacy | transitionStart | ${
- data.closing ? 'closing' : 'opening'
- }`,
- backgroundColor: 'orange',
- });
- },
- );
-
- return unsubscribe;
- }, [navigation]);
-
- useEffect(() => {
- const unsubscribe = navigation.addListener('transitionEnd', ({ data }) => {
- toast.push({
- message: `Privacy | transitionEnd | ${
- data.closing ? 'closing' : 'opening'
- }`,
- backgroundColor: 'dodgerblue',
- });
- });
-
- return unsubscribe;
- }, [navigation]);
-
- React.useEffect(() => {
- const unsubscribe = navigation.addListener(
- 'transitionStart',
- ({ data }) => {
- console.warn(
- Platform.OS +
- ' Privacy transitionStart ' +
- (data.closing ? 'closing' : 'opening'),
- );
- },
- );
-
- return unsubscribe;
- }, [navigation]);
-
- React.useEffect(() => {
- const unsubscribe = navigation.addListener('transitionEnd', ({ data }) => {
- console.warn(
- Platform.OS +
- ' Privacy transitionEnd ' +
- (data.closing ? 'closing' : 'opening'),
- );
- });
-
- return unsubscribe;
- }, [navigation]);
-
- return (
-
- navigation.navigate('Another')} />
-
- );
-}
-
-function Another({ navigation }: Props) {
- const toast = useToast();
-
- useEffect(() => {
- const unsubscribe = navigation.addListener(
- 'transitionStart',
- ({ data }) => {
- toast.push({
- message: `Another | transitionStart | ${
- data.closing ? 'closing' : 'opening'
- }`,
- backgroundColor: 'orange',
- });
- },
- );
-
- return unsubscribe;
- }, [navigation]);
-
- useEffect(() => {
- const unsubscribe = navigation.addListener('transitionEnd', ({ data }) => {
- toast.push({
- message: `Another | transitionEnd | ${
- data.closing ? 'closing' : 'opening'
- }`,
- backgroundColor: 'dodgerblue',
- });
- });
-
- return unsubscribe;
- }, [navigation]);
-
- React.useEffect(() => {
- const unsubscribe = navigation.addListener(
- 'transitionStart',
- ({ data }) => {
- console.warn(
- Platform.OS +
- ' Another transitionStart ' +
- (data.closing ? 'closing' : 'opening'),
- );
- },
- );
-
- return unsubscribe;
- }, [navigation]);
-
- React.useEffect(() => {
- const unsubscribe = navigation.addListener('transitionEnd', ({ data }) => {
- console.warn(
- Platform.OS +
- ' Another transitionEnd ' +
- (data.closing ? 'closing' : 'opening'),
- );
- });
-
- return unsubscribe;
- }, [navigation]);
-
- return (
-
- navigation.navigate('Another')} />
-
- );
-}
-
-interface ToastProps {
- index: number;
- id: string;
- backgroundColor: string;
- message: string;
- style?: ViewStyle;
- remove: (_: string) => void;
-}
-
-const DISAPPEAR_AFTER = 10 * 1000; // 10 x 1000 ms -> 10 s
-
-const Toast = ({
- index,
- id,
- backgroundColor,
- message,
- style = {},
- remove,
-}: ToastProps): JSX.Element => {
- useEffect(() => {
- const timer = setTimeout(() => {
- remove(id);
- }, DISAPPEAR_AFTER);
- return () => clearTimeout(timer);
- }, []);
-
- return (
- remove(id)}>
-
-
- {`${index + 1}. `}
- {message}
-
-
-
- );
-};
-
-interface IToast {
- id: string;
- backgroundColor: string;
- message: string;
-}
-
-const initialState: IToast[] = [];
-
-const ToastContext = createContext({
- push: (_: Omit) => {
- // noop
- },
-});
-
-interface ToastProviderProps {
- children: React.ReactNode;
-}
-
-export const ToastProvider = ({ children }: ToastProviderProps) => {
- const [toasts, setToasts] = useState(initialState);
-
- const remove = (id: string) => {
- setToasts(prevToasts => prevToasts.filter(toast => toast.id !== id));
- };
-
- const push = ({ backgroundColor, message }: Omit): void => {
- const id = nanoid();
- setToasts(prevToasts => [...prevToasts, { id, backgroundColor, message }]);
- };
-
- return (
-
- <>
- {children}
- {toasts.map((toast, i) => (
-
- ))}
- >
-
- );
-};
-
-const useToast = () => useContext(ToastContext);
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- position: 'absolute',
- alignSelf: 'center',
- bottom: 20,
- },
- alert: {
- alignItems: 'center',
- justifyContent: 'center',
- height: 40,
- position: 'relative',
- width: Dimensions.get('screen').width - 40,
- borderRadius: 10,
- },
- text: {
- fontWeight: 'bold',
- fontSize: 16,
- color: 'white',
- },
-});
diff --git a/TestsExample/src/Test619.js b/TestsExample/src/Test619.js
deleted file mode 100644
index 4b7e2b3477..0000000000
--- a/TestsExample/src/Test619.js
+++ /dev/null
@@ -1,96 +0,0 @@
-import React from 'react';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-import { createStackNavigator } from '@react-navigation/stack';
-import { View, Text, Button } from 'react-native';
-import { useNavigation } from '@react-navigation/native';
-
-const ParentStack = createNativeStackNavigator();
-const BottomTab = createBottomTabNavigator();
-const ChildStack = createNativeStackNavigator();
-const Tab1Stack = createNativeStackNavigator();
-
-const DummyContent = () => {
- const navigation = useNavigation();
-
- return (
-
- Child Stack
- navigation.goBack()} />
-
- );
-};
-
-const ChildStackScreen = () => (
-
-
-
-);
-
-const Another = () => (
-
-
-
-);
-
-const AnotherBottomTabs = () => (
-
-
-
-);
-
-const BottomStackScreen = () => (
-
-
-
-);
-
-const InitialScreen = () => {
- const navigation = useNavigation();
-
- return (
-
- navigation.navigate('Bottom')} />
-
- );
-};
-
-const App = () => (
-
-
-
-
-
-
-);
-
-export default App;
diff --git a/TestsExample/src/Test640.js b/TestsExample/src/Test640.js
deleted file mode 100644
index 87dcd2cbf1..0000000000
--- a/TestsExample/src/Test640.js
+++ /dev/null
@@ -1,81 +0,0 @@
-import React from 'react';
-import {
- ScrollView,
- RefreshControl,
- StyleSheet,
- Text,
- Button,
- TouchableOpacity,
-} from 'react-native';
-
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import { NavigationContainer } from '@react-navigation/native';
-
-function wait(timeout) {
- return new Promise(resolve => {
- setTimeout(resolve, timeout);
- });
-}
-
-function HomeScreen({ navigation }) {
- return (
- navigation.navigate('Modal')} />
- );
-}
-
-function Modal({ navigation }) {
- const someContent = Array.from({ length: 50 }, (v, i) => i);
- const [refreshing, setRefreshing] = React.useState(false);
-
- const onRefresh = React.useCallback(() => {
- setRefreshing(true);
-
- wait(2000).then(() => setRefreshing(false));
- }, []);
- return (
-
- }
- contentInsetAdjustmentBehavior="automatic"
- scrollToOverflowEnabled
- stickyHeaderIndices={[0, 5]}>
- {someContent.map(x => (
-
- Scroll to {x}
-
- ))}
-
- );
-}
-
-export default function App() {
- const Stack = createNativeStackNavigator();
-
- return (
-
-
-
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- marginTop: 30,
- },
- scrollView: {
- flex: 1,
- backgroundColor: 'pink',
- },
- button: {
- padding: 5,
- borderBottomColor: 'gray',
- borderBottomWidth: 0.5,
- backgroundColor: 'lightblue',
- flex: 1,
- },
-});
diff --git a/TestsExample/src/Test648.js b/TestsExample/src/Test648.js
deleted file mode 100644
index ad251fa8c0..0000000000
--- a/TestsExample/src/Test648.js
+++ /dev/null
@@ -1,43 +0,0 @@
-import * as React from 'react';
-import { Button, ScrollView } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-const AppStack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-function First({ navigation }) {
- return (
-
- navigation.navigate('Second')}
- />
-
- );
-}
-
-function Second({ navigation }) {
- return (
-
- navigation.navigate('First')}
- />
-
- );
-}
diff --git a/TestsExample/src/Test649.js b/TestsExample/src/Test649.js
deleted file mode 100644
index 190c89b6a6..0000000000
--- a/TestsExample/src/Test649.js
+++ /dev/null
@@ -1,42 +0,0 @@
-import * as React from 'react';
-import { Button, ScrollView } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-function First({ navigation }) {
- return (
-
- navigation.navigate('Second')}
- />
-
- );
-}
-
-function Second({ navigation }) {
- return (
-
- navigation.navigate('First')}
- />
-
- );
-}
diff --git a/TestsExample/src/Test654.js b/TestsExample/src/Test654.js
deleted file mode 100644
index 0cc5c3b060..0000000000
--- a/TestsExample/src/Test654.js
+++ /dev/null
@@ -1,43 +0,0 @@
-import * as React from 'react';
-import { Button, I18nManager } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- React.useEffect(() => {
- I18nManager.forceRTL(true);
-
- return () => {
- I18nManager.forceRTL(false);
- };
- }, []);
-
- return (
-
-
-
-
-
-
- );
-}
-
-function First({ navigation }) {
- return (
- navigation.navigate('Second')}
- />
- );
-}
-
-function Second({ navigation }) {
- return (
- navigation.navigate('First')}
- />
- );
-}
diff --git a/TestsExample/src/Test658.js b/TestsExample/src/Test658.js
deleted file mode 100644
index 0b48087dea..0000000000
--- a/TestsExample/src/Test658.js
+++ /dev/null
@@ -1,71 +0,0 @@
-import { NavigationContainer } from '@react-navigation/native';
-import * as React from 'react';
-import { Button, Dimensions, Text, View } from 'react-native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-function Screen({ navigation }) {
- const addedRoutes = navigation.dangerouslyGetState().routes.length - 1;
- const margin = addedRoutes * 20;
- const width = Dimensions.get('screen').width - addedRoutes * 40;
- const backgroundColor = colors[addedRoutes % colors.length];
- return (
-
- navigation.push('TransparentModal')}
- />
- navigation.push('Modal')} />
- {addedRoutes > 0 && (
- navigation.goBack()} />
- )}
-
- For each transparent modal you open, all previously visible screens
- should be visible underneath.
-
-
- For each new (non-transparent) modal you open, all previously visible
- screens should be hidden.
-
-
- );
-}
-
-const colors = [
- 'darkviolet',
- 'slateblue',
- 'mediumseagreen',
- 'khaki',
- 'orange',
- 'indianred',
-];
diff --git a/TestsExample/src/Test691.js b/TestsExample/src/Test691.js
deleted file mode 100644
index 3e31df0154..0000000000
--- a/TestsExample/src/Test691.js
+++ /dev/null
@@ -1,58 +0,0 @@
-import * as React from 'react';
-import { View, Text, Button } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-
-const Stack = createNativeStackNavigator();
-const Tab = createBottomTabNavigator();
-
-function First({ navigation }) {
- return (
-
- This is a first screen!
- navigation.navigate('Modal')} title="Modal" />
-
- );
-}
-
-function Modal({ navigation }) {
- return (
-
- This is a modal screen!
- navigation.navigate('Tab2')} title="Tab2" />
-
- );
-}
-
-function Second() {
- return (
-
- This is a second screen!
-
- );
-}
-
-function ModalStack() {
- return (
-
-
-
-
- );
-}
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
diff --git a/TestsExample/src/Test702.js b/TestsExample/src/Test702.js
deleted file mode 100644
index d979f7c159..0000000000
--- a/TestsExample/src/Test702.js
+++ /dev/null
@@ -1,71 +0,0 @@
-import React from 'react';
-import { Button, Text, View } from 'react-native';
-import { createStackNavigator } from '@react-navigation/stack';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-function HomeScreen({ navigation }) {
- return (
-
- This is the home screen!
- navigation.navigate('Details')}
- title="Go to Details"
- />
- navigation.navigate('MyModal')}
- title="Open Modal"
- />
-
- );
-}
-
-function DetailsScreen() {
- return (
-
- Details
-
- );
-}
-
-function ModalScreen({ navigation }) {
- return (
-
- This is a modal!
- navigation.goBack()} title="Dismiss" />
-
- );
-}
-
-const MainStack = createNativeStackNavigator();
-const RootStack = createStackNavigator();
-
-function MainStackScreen() {
- return (
-
-
-
-
- );
-}
-
-function RootStackScreen() {
- return (
-
-
-
-
- );
-}
-
-export default function App() {
- return (
-
-
-
- );
-}
diff --git a/TestsExample/src/Test706.js b/TestsExample/src/Test706.js
deleted file mode 100644
index a0b761c4de..0000000000
--- a/TestsExample/src/Test706.js
+++ /dev/null
@@ -1,63 +0,0 @@
-import React from 'react';
-import { Button, Text, ScrollView, View } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-function HomeScreen({ navigation }) {
- return (
-
-
- Home screen with a 'bold' title
- navigation.navigate('Details')}
- title="Go to Details"
- />
-
-
- );
-}
-
-function DetailsScreen() {
- return (
-
-
- Details screen with a 'light' title
-
-
- );
-}
-
-const RootStack = createNativeStackNavigator();
-
-function RootStackScreen() {
- return (
-
-
-
-
- );
-}
-
-export default function App() {
- return (
-
-
-
- );
-}
diff --git a/TestsExample/src/Test713.js b/TestsExample/src/Test713.js
deleted file mode 100644
index 2c98bfb6d9..0000000000
--- a/TestsExample/src/Test713.js
+++ /dev/null
@@ -1,107 +0,0 @@
-import { NavigationContainer, useNavigation } from '@react-navigation/native';
-import React, { useState } from 'react';
-import { Modal, Text, TouchableWithoutFeedback, View } from 'react-native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-const App = () => {
- return (
-
-
-
- );
-};
-export default App;
-
-const Home = () => {
- const navigation = useNavigation();
- const [open, setOpen] = useState(false);
-
- return (
-
-
-
-
- navigation.navigate('PinnedModal')}>
- Go to pinned modal
-
- setOpen(true)}>
- open react native modal
-
-
- );
-};
-
-const { Navigator: PinnedModalNavigator, Screen: PinnedModalScreen } =
- createNativeStackNavigator();
-
-const PinnedModalStack = ({ navigation }) => {
- return (
-
- console.log('START'),
- transitionEnd: () => console.log('END'),
- dismiss: () => console.log('DISMISS'),
- }}
- name="PinnedModalScreen"
- component={ScreenWithPinnedBottom}
- options={{
- headerLeft: () => {
- return (
- navigation.goBack()}>
- close
-
- );
- },
- }}
- />
-
- );
-};
-
-const ScreenWithPinnedBottom = () => {
- const navigation = useNavigation();
-
- return (
-
- Pull header upwards on iOS 13 device or higher
-
- observe wobble and frame getting bigger (text is not longer centered){' '}
-
- navigation.push('PinnedModal')}>
- push another modal
-
-
-
- Wobble
-
-
- );
-};
-
-const { Navigator: MainNavigator, Screen: MainScreen } =
- createNativeStackNavigator();
-
-function MyStack() {
- return (
-
-
-
-
- );
-}
diff --git a/TestsExample/src/Test761.tsx b/TestsExample/src/Test761.tsx
deleted file mode 100644
index 8484dd1a65..0000000000
--- a/TestsExample/src/Test761.tsx
+++ /dev/null
@@ -1,59 +0,0 @@
-import * as React from 'react';
-import { Button, View } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-// import {createStackNavigator} from '@react-navigation/stack';
-
-const Stack = createNativeStackNavigator();
-
-type SimpleStackParams = {
- First: undefined;
- Second: undefined;
-};
-
-export default function App(): JSX.Element {
- return (
-
-
-
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.navigate('Second')}
- />
-
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
-
- navigation.navigate('First')}
- />
-
- );
-}
diff --git a/TestsExample/src/Test779.tsx b/TestsExample/src/Test779.tsx
deleted file mode 100644
index 10f0b035f1..0000000000
--- a/TestsExample/src/Test779.tsx
+++ /dev/null
@@ -1,98 +0,0 @@
-import React from 'react';
-import { Button, ScrollView, View, SafeAreaView } from 'react-native';
-import {
- NavigationContainer,
- NavigationProp,
- ParamListBase,
-} from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-
-function HomeScreen({
- navigation,
-}: {
- navigation: NavigationProp;
-}) {
- return (
-
- {
- navigation.navigate('Details');
- }}
- title="Go to details"
- />
-
- );
-}
-
-function DetailsScreen({
- navigation,
-}: {
- navigation: NavigationProp;
-}) {
- return (
-
-
- {
- navigation.goBack();
- }}
- title="Go back"
- />
- {
- navigation.navigate('Profile');
- }}
- title="Go to profile"
- />
-
-
- );
-}
-
-function ProfileScreen({
- navigation,
-}: {
- navigation: NavigationProp;
-}) {
- return (
-
-
- {
- navigation.goBack();
- }}
- title="Go back"
- />
-
-
- );
-}
-
-const RootStack = createNativeStackNavigator();
-
-function RootStackScreen() {
- return (
-
-
-
-
-
- );
-}
-
-export default function App(): JSX.Element {
- return (
-
-
-
- );
-}
diff --git a/TestsExample/src/Test780.tsx b/TestsExample/src/Test780.tsx
deleted file mode 100644
index 090f63b349..0000000000
--- a/TestsExample/src/Test780.tsx
+++ /dev/null
@@ -1,110 +0,0 @@
-import React, { useState } from 'react';
-import {
- View,
- Button,
- Text,
- ScrollView,
- StyleSheet,
- TouchableHighlight,
-} from 'react-native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-// import {createStackNavigator} from '@react-navigation/stack';
-import {
- NavigationContainer,
- NavigationProp,
- ParamListBase,
-} from '@react-navigation/native';
-
-const HomeScreen = ({
- navigation,
-}: {
- navigation: NavigationProp;
-}) => (
-
-
- navigation.navigate('modalScreen')}
- title="Open modal"
- />
- navigation.navigate('nestedScreen')}
- title="Open nested screen"
- />
-
-
-);
-
-const ModalScreen = ({
- navigation,
-}: {
- navigation: NavigationProp;
-}) => (
-
- navigation.navigate('modalNestedScreen')}
- title="Open nested screen"
- />
-
-);
-
-const NestedScreen = () => {
- const [count, setCount] = useState(0);
- return (
-
- setCount(count + 1)}>
- {`Press count: ${count}`}
-
-
- Change nested stacks to "normal" stack navigators to spot buggy behavior
- in native-stack's modal if fix in RNGH (#1323) not applied
-
-
- );
-};
-
-const NestedStack = createNativeStackNavigator();
-
-const HomeStack = () => (
-
-
-
-
-);
-
-const ModalStack = () => (
-
-
-
-
-);
-
-const MainStack = createNativeStackNavigator();
-
-const App = () => {
- return (
-
-
-
-
-
-
- );
-};
-
-const styles = StyleSheet.create({
- screen: {
- flex: 1,
- padding: 24,
- },
- touchable: {
- padding: 24,
- },
-});
-
-export default App;
diff --git a/TestsExample/src/Test791.tsx b/TestsExample/src/Test791.tsx
deleted file mode 100644
index 1367a0c74c..0000000000
--- a/TestsExample/src/Test791.tsx
+++ /dev/null
@@ -1,81 +0,0 @@
-import React from 'react';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import { StyleSheet, Button, View, Text } from 'react-native';
-import {
- createNativeStackNavigator,
- NativeStackScreenProps,
-} from '@react-navigation/native-stack';
-
-const MainScreen = ({ navigation }: NativeStackScreenProps) => {
- return (
-
- {
- navigation.push('Push');
- setTimeout(() => navigation.push('Push'), 10);
- setTimeout(() => navigation.push('Push'), 20);
- setTimeout(() => navigation.push('Push'), 30);
- setTimeout(() => navigation.push('Push'), 40);
- }}
- title="Click this button to see the crash if native changes not applied"
- />
- {
- navigation.push('Modal');
- }}
- title="Push modal"
- />
- Issue 791
-
- );
-};
-
-const PushScreen = ({ navigation }: NativeStackScreenProps) => (
-
- {
- navigation.push('Push');
- setTimeout(() => navigation.push('Push'), 10);
- setTimeout(() => navigation.push('Push'), 20);
- setTimeout(() => navigation.push('Push'), 30);
- setTimeout(() => navigation.push('Push'), 40);
- }}
- title="Click this button to see the crash if native changes not applied"
- />
- {
- navigation.pop();
- setTimeout(() => navigation.pop(), 10);
- setTimeout(() => navigation.pop(), 20);
- }}
- title="Click this button to pop"
- />
-
-);
-
-const Stack = createNativeStackNavigator();
-
-const App = () => (
-
-
-
-
-
-
-
-);
-
-const styles = StyleSheet.create({
- screen: {
- ...StyleSheet.absoluteFillObject,
- flex: 1,
- paddingTop: 200,
- alignItems: 'center',
- },
-});
-
-export default App;
diff --git a/TestsExample/src/Test831.tsx b/TestsExample/src/Test831.tsx
deleted file mode 100644
index dfea229bd9..0000000000
--- a/TestsExample/src/Test831.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-import * as React from 'react';
-import { Button, View, I18nManager } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-type Props = {
- navigation: NativeStackNavigationProp;
-};
-
-const Stack = createNativeStackNavigator();
-
-export default function App(): JSX.Element {
- React.useEffect(() => {
- I18nManager.forceRTL(true);
-
- return () => {
- I18nManager.forceRTL(false);
- };
- }, []);
-
- return (
-
-
-
-
-
-
- );
-}
-
-function First({ navigation }: Props) {
- return (
-
- navigation.navigate('Second')}
- />
-
- );
-}
-
-function Second({ navigation }: Props) {
- return (
-
- navigation.navigate('First')}
- />
-
- );
-}
diff --git a/TestsExample/src/Test844.tsx b/TestsExample/src/Test844.tsx
deleted file mode 100644
index b4692fcf3a..0000000000
--- a/TestsExample/src/Test844.tsx
+++ /dev/null
@@ -1,105 +0,0 @@
-import React, { useEffect, useRef } from 'react';
-import { Text, View, Button, StyleSheet } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const defaultOptions = {
- headerHideShadow: true,
- headerTintColor: 'red',
- headerStyle: {
- backgroundColor: '#f0f0f0',
- },
- contentStyle: {
- backgroundColor: '#f0f0f0',
- },
-};
-
-type Props = {
- navigation: NativeStackNavigationProp;
-};
-
-function Main({ navigation }: Props) {
- const times = useRef(8);
- const id = useRef(0);
-
- useEffect(() => {
- id.current = setInterval(() => {
- if (times.current) {
- navigation.navigate('modal-stack');
- setTimeout(() => navigation.goBack(), 500);
- times.current--;
- } else {
- clearInterval(id.current);
- }
- }, 1500);
- return () => clearInterval(id.current);
- }, [navigation]);
-
- return (
-
- navigation.navigate('modal-stack')}
- />
-
- );
-}
-
-const Modal = ({ navigation }: Props) => (
-
- navigation.goBack()} />
-
-);
-
-const ModalStack = createNativeStackNavigator();
-
-const ModalNavigator = () => (
-
- cancel,
- }}
- />
-
-);
-
-const Stack = createNativeStackNavigator();
-
-export default function App(): JSX.Element {
- return (
-
-
-
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: 'center',
- alignItems: 'center',
- },
-});
diff --git a/TestsExample/src/Test852.tsx b/TestsExample/src/Test852.tsx
deleted file mode 100644
index 31a040b223..0000000000
--- a/TestsExample/src/Test852.tsx
+++ /dev/null
@@ -1,76 +0,0 @@
-import * as React from 'react';
-import { Button, View } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-type Props = {
- navigation: NativeStackNavigationProp;
-};
-
-const Stack = createNativeStackNavigator();
-
-export default function App(): JSX.Element {
- return (
-
-
-
-
-
-
-
- );
-}
-
-const First = ({ navigation }: Props) => (
-
- navigation.navigate('Second')}
- />
-
-);
-
-const Second = ({ navigation }: Props) => (
-
- navigation.navigate('Third')}
- />
-
-);
-
-const Third = ({ navigation }: Props) => (
-
- navigation.navigate('First')}
- />
-
-);
diff --git a/TestsExample/src/Test861.tsx b/TestsExample/src/Test861.tsx
deleted file mode 100644
index 4a8cc45ba1..0000000000
--- a/TestsExample/src/Test861.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import React from 'react';
-import { Button, SafeAreaView } from 'react-native';
-
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-interface Props {
- navigation: NativeStackNavigationProp;
-}
-
-const App = (): JSX.Element => {
- return (
-
-
-
-
-
-
- );
-};
-
-const First = ({ navigation }: Props) => (
-
- navigation.navigate('Second')}
- />
-
-);
-
-const Second = ({ navigation }: Props) => (
-
- navigation.goBack()} />
-
-);
-
-export default App;
diff --git a/TestsExample/src/Test865.tsx b/TestsExample/src/Test865.tsx
deleted file mode 100644
index ab17cf3fa1..0000000000
--- a/TestsExample/src/Test865.tsx
+++ /dev/null
@@ -1,74 +0,0 @@
-import React from 'react';
-import { View, Text, Button } from 'react-native';
-
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-const First = ({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) => (
-
- Screen 1
- navigation.push('Screen2')}
- />
-
-);
-
-const Second = ({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) => (
-
- Screen 2
- navigation.push('Screen3')}
- />
-
-);
-
-const Third = ({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) => (
-
- Screen 3
-
- navigation.reset({
- routes: [{ name: 'Screen1' }],
- index: 0,
- })
- }
- />
-
-);
-
-const App = () => {
- return (
-
-
-
-
-
-
-
- );
-};
-
-export default App;
diff --git a/TestsExample/src/Test881.tsx b/TestsExample/src/Test881.tsx
deleted file mode 100644
index ee065c5e74..0000000000
--- a/TestsExample/src/Test881.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import React from 'react';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-import { View } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-
-const View1 = () => ;
-const View2 = () => ;
-const View3 = () => ;
-
-const Stack1 = createNativeStackNavigator();
-const Stack2 = createNativeStackNavigator();
-const Stack3 = createNativeStackNavigator();
-
-const Tab = createBottomTabNavigator();
-export default function App(): JSX.Element {
- return (
-
-
-
-
-
-
-
- );
-}
-
-function StackNav1() {
- return (
-
-
-
- );
-}
-
-function StackNav2() {
- return (
-
-
-
- );
-}
-
-function StackNav3() {
- return (
-
-
-
- );
-}
diff --git a/TestsExample/src/Test913.tsx b/TestsExample/src/Test913.tsx
deleted file mode 100644
index 8945c8b751..0000000000
--- a/TestsExample/src/Test913.tsx
+++ /dev/null
@@ -1,39 +0,0 @@
-import React from 'react';
-import { NavigationContainer } from '@react-navigation/native';
-import { createStackNavigator } from '@react-navigation/stack';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-import { View, Text } from 'react-native';
-
-const BottomTab = createBottomTabNavigator();
-const Tab1Stack = createStackNavigator();
-
-const CastScreen = () => (
-
-
- Add logging in `onDetachedFromWindow` in child Screen to see that method
- triggered twice without the changes
-
-
- ↓touch Tab2↓
-
-
-);
-
-const Tab2Screen = () => ;
-
-const Tab1StackNavigator = () => (
-
-
-
-);
-
-const App = () => (
-
-
-
-
-
-
-);
-
-export default App;
diff --git a/TestsExample/src/Test999.tsx b/TestsExample/src/Test999.tsx
deleted file mode 100644
index f7a72ee9ab..0000000000
--- a/TestsExample/src/Test999.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-import * as React from 'react';
-import { Button } from 'react-native';
-import { NavigationContainer, ParamListBase } from '@react-navigation/native';
-import {
- createNativeStackNavigator,
- NativeStackNavigationProp,
-} from '@react-navigation/native-stack';
-
-const Stack = createNativeStackNavigator();
-
-export default function App() {
- return (
-
-
-
-
-
-
- );
-}
-
-function First({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
- navigation.replace('Second')}
- />
- );
-}
-
-function Second({
- navigation,
-}: {
- navigation: NativeStackNavigationProp;
-}) {
- return (
- navigation.replace('First')}
- />
- );
-}
diff --git a/FabricTestExample/.eslintrc.js b/apps/test-examples/.eslintrc.js
similarity index 100%
rename from FabricTestExample/.eslintrc.js
rename to apps/test-examples/.eslintrc.js
diff --git a/FabricTestExample/.prettierrc.js b/apps/test-examples/.prettierrc.js
similarity index 100%
rename from FabricTestExample/.prettierrc.js
rename to apps/test-examples/.prettierrc.js
diff --git a/FabricTestExample/assets/backButton.png b/apps/test-examples/assets/backButton.png
similarity index 100%
rename from FabricTestExample/assets/backButton.png
rename to apps/test-examples/assets/backButton.png
diff --git a/FabricTestExample/assets/search_black.png b/apps/test-examples/assets/search_black.png
similarity index 100%
rename from FabricTestExample/assets/search_black.png
rename to apps/test-examples/assets/search_black.png
diff --git a/FabricTestExample/assets/search_white.png b/apps/test-examples/assets/search_white.png
similarity index 100%
rename from FabricTestExample/assets/search_white.png
rename to apps/test-examples/assets/search_white.png
diff --git a/apps/test-examples/index.js b/apps/test-examples/index.js
new file mode 100644
index 0000000000..8642fae629
--- /dev/null
+++ b/apps/test-examples/index.js
@@ -0,0 +1,3 @@
+import App from './src/App';
+
+export default App;
diff --git a/apps/test-examples/src/App.js b/apps/test-examples/src/App.js
new file mode 100644
index 0000000000..2d715f58a2
--- /dev/null
+++ b/apps/test-examples/src/App.js
@@ -0,0 +1,110 @@
+/* eslint-disable no-unused-vars */
+import React from 'react';
+
+import { enableFreeze } from 'react-native-screens';
+
+import Test42 from './Test42';
+import Test111 from './Test111';
+import Test263 from './Test263';
+import Test349 from './Test349';
+import Test364 from './Test364';
+import Test528 from './Test528';
+import Test550 from './Test550';
+import Test556 from './Test556';
+import Test564 from './Test564';
+import Test577 from './Test577';
+import Test593 from './Test593';
+import Test619 from './Test619';
+import Test624 from './Test624';
+import Test640 from './Test640';
+import Test642 from './Test642';
+import Test645 from './Test645';
+import Test648 from './Test648';
+import Test649 from './Test649';
+import Test654 from './Test654';
+import Test658 from './Test658';
+import Test662 from './Test662';
+import Test691 from './Test691';
+import Test702 from './Test702';
+import Test706 from './Test706';
+import Test713 from './Test713';
+import Test726 from './Test726';
+import Test748 from './Test748';
+import Test750 from './Test750';
+import Test758 from './Test758';
+import Test761 from './Test761';
+import Test779 from './Test779';
+import Test780 from './Test780';
+import Test791 from './Test791';
+import Test800 from './Test800';
+import Test817 from './Test817';
+import Test830 from './Test830';
+import Test831 from './Test831';
+import Test844 from './Test844';
+import Test852 from './Test852';
+import Test860 from './Test860';
+import Test861 from './Test861';
+import Test865 from './Test865';
+import Test881 from './Test881';
+import Test887 from './Test887';
+import Test898 from './Test898';
+import Test913 from './Test913';
+import Test999 from './Test999';
+import Test1017 from './Test1017';
+import Test1031 from './Test1031';
+import Test1032 from './Test1032';
+import Test1036 from './Test1036';
+import Test1072 from './Test1072';
+import Test1084 from './Test1084';
+import Test1091 from './Test1091';
+import Test1096 from './Test1096';
+import Test1097 from './Test1097';
+import Test1153 from './Test1153';
+import Test1157 from './Test1157';
+import Test1162 from './Test1162';
+import Test1166 from './Test1166';
+import Test1188 from './Test1188';
+import Test1190 from './Test1190';
+import TestFreeze from './TestFreeze';
+import Test1198 from './Test1198';
+import Test1204 from './Test1204';
+import Test1209 from './Test1209';
+import Test1213 from './Test1213';
+import Test1214 from './Test1214';
+import Test1227 from './Test1227';
+import Test1228 from './Test1228';
+import Test1259 from './Test1259';
+import Test1260 from './Test1260';
+import Test1296 from './Test1296';
+import Test1299 from './Test1299';
+import Test1391 from './Test1391';
+import Test1419 from './Test1419';
+import Test1463 from './Test1463';
+import Test1473 from './Test1473';
+import Test1476 from './Test1476';
+import Test1509 from './Test1509';
+import Test1539 from './Test1539';
+import Test1646 from './Test1646';
+import Test1649 from './Test1649';
+import Test1671 from './Test1671';
+import Test1683 from './Test1683';
+import Test1726 from './Test1726';
+import Test1791 from './Test1791';
+import Test1802 from './Test1802';
+import Test1829 from './Test1829';
+import Test1844 from './Test1844';
+import Test1864 from './Test1864';
+import Test1970 from './Test1970';
+import Test1981 from './Test1981';
+import Test2008 from './Test2008';
+import Test2028 from './Test2028';
+import Test2048 from './Test2048';
+import Test2069 from './Test2069';
+import Test2118 from './Test2118';
+import TestScreenAnimation from './TestScreenAnimation';
+
+enableFreeze(true);
+
+export default function App() {
+ return ;
+}
diff --git a/FabricTestExample/src/Test1017.tsx b/apps/test-examples/src/Test1017.tsx
similarity index 100%
rename from FabricTestExample/src/Test1017.tsx
rename to apps/test-examples/src/Test1017.tsx
diff --git a/FabricTestExample/src/Test1031.tsx b/apps/test-examples/src/Test1031.tsx
similarity index 100%
rename from FabricTestExample/src/Test1031.tsx
rename to apps/test-examples/src/Test1031.tsx
diff --git a/TestsExample/src/Test1032.tsx b/apps/test-examples/src/Test1032.tsx
similarity index 100%
rename from TestsExample/src/Test1032.tsx
rename to apps/test-examples/src/Test1032.tsx
diff --git a/FabricTestExample/src/Test1036.tsx b/apps/test-examples/src/Test1036.tsx
similarity index 100%
rename from FabricTestExample/src/Test1036.tsx
rename to apps/test-examples/src/Test1036.tsx
diff --git a/TestsExample/src/Test1072.tsx b/apps/test-examples/src/Test1072.tsx
similarity index 100%
rename from TestsExample/src/Test1072.tsx
rename to apps/test-examples/src/Test1072.tsx
diff --git a/FabricTestExample/src/Test1084.tsx b/apps/test-examples/src/Test1084.tsx
similarity index 100%
rename from FabricTestExample/src/Test1084.tsx
rename to apps/test-examples/src/Test1084.tsx
diff --git a/FabricTestExample/src/Test1091.tsx b/apps/test-examples/src/Test1091.tsx
similarity index 100%
rename from FabricTestExample/src/Test1091.tsx
rename to apps/test-examples/src/Test1091.tsx
diff --git a/TestsExample/src/Test1096.tsx b/apps/test-examples/src/Test1096.tsx
similarity index 100%
rename from TestsExample/src/Test1096.tsx
rename to apps/test-examples/src/Test1096.tsx
diff --git a/TestsExample/src/Test1097.tsx b/apps/test-examples/src/Test1097.tsx
similarity index 100%
rename from TestsExample/src/Test1097.tsx
rename to apps/test-examples/src/Test1097.tsx
diff --git a/FabricTestExample/src/Test111.js b/apps/test-examples/src/Test111.js
similarity index 100%
rename from FabricTestExample/src/Test111.js
rename to apps/test-examples/src/Test111.js
diff --git a/FabricTestExample/src/Test1153.tsx b/apps/test-examples/src/Test1153.tsx
similarity index 100%
rename from FabricTestExample/src/Test1153.tsx
rename to apps/test-examples/src/Test1153.tsx
diff --git a/FabricTestExample/src/Test1157.tsx b/apps/test-examples/src/Test1157.tsx
similarity index 100%
rename from FabricTestExample/src/Test1157.tsx
rename to apps/test-examples/src/Test1157.tsx
diff --git a/TestsExample/src/Test1162.tsx b/apps/test-examples/src/Test1162.tsx
similarity index 100%
rename from TestsExample/src/Test1162.tsx
rename to apps/test-examples/src/Test1162.tsx
diff --git a/FabricTestExample/src/Test1166/AndroidDifferentScreenSearch.tsx b/apps/test-examples/src/Test1166/AndroidDifferentScreenSearch.tsx
similarity index 100%
rename from FabricTestExample/src/Test1166/AndroidDifferentScreenSearch.tsx
rename to apps/test-examples/src/Test1166/AndroidDifferentScreenSearch.tsx
diff --git a/FabricTestExample/src/Test1166/AndroidSearchBarCustomization.tsx b/apps/test-examples/src/Test1166/AndroidSearchBarCustomization.tsx
similarity index 100%
rename from FabricTestExample/src/Test1166/AndroidSearchBarCustomization.tsx
rename to apps/test-examples/src/Test1166/AndroidSearchBarCustomization.tsx
diff --git a/FabricTestExample/src/Test1166/AndroidSearchBarEvents.tsx b/apps/test-examples/src/Test1166/AndroidSearchBarEvents.tsx
similarity index 100%
rename from FabricTestExample/src/Test1166/AndroidSearchBarEvents.tsx
rename to apps/test-examples/src/Test1166/AndroidSearchBarEvents.tsx
diff --git a/FabricTestExample/src/Test1166/AndroidSearchTypes.tsx b/apps/test-examples/src/Test1166/AndroidSearchTypes.tsx
similarity index 100%
rename from FabricTestExample/src/Test1166/AndroidSearchTypes.tsx
rename to apps/test-examples/src/Test1166/AndroidSearchTypes.tsx
diff --git a/FabricTestExample/src/Test1166/index.tsx b/apps/test-examples/src/Test1166/index.tsx
similarity index 100%
rename from FabricTestExample/src/Test1166/index.tsx
rename to apps/test-examples/src/Test1166/index.tsx
diff --git a/FabricTestExample/src/Test1188.tsx b/apps/test-examples/src/Test1188.tsx
similarity index 100%
rename from FabricTestExample/src/Test1188.tsx
rename to apps/test-examples/src/Test1188.tsx
diff --git a/FabricTestExample/src/Test1190.tsx b/apps/test-examples/src/Test1190.tsx
similarity index 100%
rename from FabricTestExample/src/Test1190.tsx
rename to apps/test-examples/src/Test1190.tsx
diff --git a/FabricTestExample/src/Test1198.tsx b/apps/test-examples/src/Test1198.tsx
similarity index 100%
rename from FabricTestExample/src/Test1198.tsx
rename to apps/test-examples/src/Test1198.tsx
diff --git a/FabricTestExample/src/Test1204.tsx b/apps/test-examples/src/Test1204.tsx
similarity index 100%
rename from FabricTestExample/src/Test1204.tsx
rename to apps/test-examples/src/Test1204.tsx
diff --git a/TestsExample/src/Test1209.tsx b/apps/test-examples/src/Test1209.tsx
similarity index 100%
rename from TestsExample/src/Test1209.tsx
rename to apps/test-examples/src/Test1209.tsx
diff --git a/FabricTestExample/src/Test1213.tsx b/apps/test-examples/src/Test1213.tsx
similarity index 100%
rename from FabricTestExample/src/Test1213.tsx
rename to apps/test-examples/src/Test1213.tsx
diff --git a/TestsExample/src/Test1214.tsx b/apps/test-examples/src/Test1214.tsx
similarity index 100%
rename from TestsExample/src/Test1214.tsx
rename to apps/test-examples/src/Test1214.tsx
diff --git a/FabricTestExample/src/Test1227.tsx b/apps/test-examples/src/Test1227.tsx
similarity index 100%
rename from FabricTestExample/src/Test1227.tsx
rename to apps/test-examples/src/Test1227.tsx
diff --git a/FabricTestExample/src/Test1228.tsx b/apps/test-examples/src/Test1228.tsx
similarity index 100%
rename from FabricTestExample/src/Test1228.tsx
rename to apps/test-examples/src/Test1228.tsx
diff --git a/FabricTestExample/src/Test1259.tsx b/apps/test-examples/src/Test1259.tsx
similarity index 100%
rename from FabricTestExample/src/Test1259.tsx
rename to apps/test-examples/src/Test1259.tsx
diff --git a/TestsExample/src/Test1260.tsx b/apps/test-examples/src/Test1260.tsx
similarity index 100%
rename from TestsExample/src/Test1260.tsx
rename to apps/test-examples/src/Test1260.tsx
diff --git a/FabricTestExample/src/Test1296.tsx b/apps/test-examples/src/Test1296.tsx
similarity index 100%
rename from FabricTestExample/src/Test1296.tsx
rename to apps/test-examples/src/Test1296.tsx
diff --git a/FabricTestExample/src/Test1299.tsx b/apps/test-examples/src/Test1299.tsx
similarity index 100%
rename from FabricTestExample/src/Test1299.tsx
rename to apps/test-examples/src/Test1299.tsx
diff --git a/TestsExample/src/Test1391.tsx b/apps/test-examples/src/Test1391.tsx
similarity index 100%
rename from TestsExample/src/Test1391.tsx
rename to apps/test-examples/src/Test1391.tsx
diff --git a/FabricTestExample/src/Test1419.tsx b/apps/test-examples/src/Test1419.tsx
similarity index 100%
rename from FabricTestExample/src/Test1419.tsx
rename to apps/test-examples/src/Test1419.tsx
diff --git a/FabricTestExample/src/Test1463.tsx b/apps/test-examples/src/Test1463.tsx
similarity index 100%
rename from FabricTestExample/src/Test1463.tsx
rename to apps/test-examples/src/Test1463.tsx
diff --git a/FabricTestExample/src/Test1473.tsx b/apps/test-examples/src/Test1473.tsx
similarity index 100%
rename from FabricTestExample/src/Test1473.tsx
rename to apps/test-examples/src/Test1473.tsx
diff --git a/TestsExample/src/Test1476.tsx b/apps/test-examples/src/Test1476.tsx
similarity index 100%
rename from TestsExample/src/Test1476.tsx
rename to apps/test-examples/src/Test1476.tsx
diff --git a/TestsExample/src/Test1509.tsx b/apps/test-examples/src/Test1509.tsx
similarity index 100%
rename from TestsExample/src/Test1509.tsx
rename to apps/test-examples/src/Test1509.tsx
diff --git a/TestsExample/src/Test1539.tsx b/apps/test-examples/src/Test1539.tsx
similarity index 100%
rename from TestsExample/src/Test1539.tsx
rename to apps/test-examples/src/Test1539.tsx
diff --git a/TestsExample/src/Test1646.tsx b/apps/test-examples/src/Test1646.tsx
similarity index 100%
rename from TestsExample/src/Test1646.tsx
rename to apps/test-examples/src/Test1646.tsx
diff --git a/FabricTestExample/src/Test1649.tsx b/apps/test-examples/src/Test1649.tsx
similarity index 100%
rename from FabricTestExample/src/Test1649.tsx
rename to apps/test-examples/src/Test1649.tsx
diff --git a/FabricTestExample/src/Test1671.tsx b/apps/test-examples/src/Test1671.tsx
similarity index 100%
rename from FabricTestExample/src/Test1671.tsx
rename to apps/test-examples/src/Test1671.tsx
diff --git a/TestsExample/src/Test1683.tsx b/apps/test-examples/src/Test1683.tsx
similarity index 100%
rename from TestsExample/src/Test1683.tsx
rename to apps/test-examples/src/Test1683.tsx
diff --git a/FabricTestExample/src/Test1726.tsx b/apps/test-examples/src/Test1726.tsx
similarity index 100%
rename from FabricTestExample/src/Test1726.tsx
rename to apps/test-examples/src/Test1726.tsx
diff --git a/TestsExample/src/Test1791.tsx b/apps/test-examples/src/Test1791.tsx
similarity index 100%
rename from TestsExample/src/Test1791.tsx
rename to apps/test-examples/src/Test1791.tsx
diff --git a/TestsExample/src/Test1802.tsx b/apps/test-examples/src/Test1802.tsx
similarity index 100%
rename from TestsExample/src/Test1802.tsx
rename to apps/test-examples/src/Test1802.tsx
diff --git a/FabricTestExample/src/Test1829/index.tsx b/apps/test-examples/src/Test1829/index.tsx
similarity index 100%
rename from FabricTestExample/src/Test1829/index.tsx
rename to apps/test-examples/src/Test1829/index.tsx
diff --git a/FabricTestExample/src/Test1829/navigation/Stacks.tsx b/apps/test-examples/src/Test1829/navigation/Stacks.tsx
similarity index 100%
rename from FabricTestExample/src/Test1829/navigation/Stacks.tsx
rename to apps/test-examples/src/Test1829/navigation/Stacks.tsx
diff --git a/FabricTestExample/src/Test1829/screens/CardView.tsx b/apps/test-examples/src/Test1829/screens/CardView.tsx
similarity index 100%
rename from FabricTestExample/src/Test1829/screens/CardView.tsx
rename to apps/test-examples/src/Test1829/screens/CardView.tsx
diff --git a/FabricTestExample/src/Test1829/screens/HomeView.tsx b/apps/test-examples/src/Test1829/screens/HomeView.tsx
similarity index 100%
rename from FabricTestExample/src/Test1829/screens/HomeView.tsx
rename to apps/test-examples/src/Test1829/screens/HomeView.tsx
diff --git a/FabricTestExample/src/Test1829/screens/InnerModal.tsx b/apps/test-examples/src/Test1829/screens/InnerModal.tsx
similarity index 100%
rename from FabricTestExample/src/Test1829/screens/InnerModal.tsx
rename to apps/test-examples/src/Test1829/screens/InnerModal.tsx
diff --git a/FabricTestExample/src/Test1829/screens/InnerView.tsx b/apps/test-examples/src/Test1829/screens/InnerView.tsx
similarity index 100%
rename from FabricTestExample/src/Test1829/screens/InnerView.tsx
rename to apps/test-examples/src/Test1829/screens/InnerView.tsx
diff --git a/FabricTestExample/src/Test1829/screens/ModalView.tsx b/apps/test-examples/src/Test1829/screens/ModalView.tsx
similarity index 100%
rename from FabricTestExample/src/Test1829/screens/ModalView.tsx
rename to apps/test-examples/src/Test1829/screens/ModalView.tsx
diff --git a/TestsExample/src/Test1844.tsx b/apps/test-examples/src/Test1844.tsx
similarity index 100%
rename from TestsExample/src/Test1844.tsx
rename to apps/test-examples/src/Test1844.tsx
diff --git a/FabricTestExample/src/Test1864.tsx b/apps/test-examples/src/Test1864.tsx
similarity index 100%
rename from FabricTestExample/src/Test1864.tsx
rename to apps/test-examples/src/Test1864.tsx
diff --git a/FabricTestExample/src/Test1970.jsx b/apps/test-examples/src/Test1970.jsx
similarity index 100%
rename from FabricTestExample/src/Test1970.jsx
rename to apps/test-examples/src/Test1970.jsx
diff --git a/FabricTestExample/src/Test1981.tsx b/apps/test-examples/src/Test1981.tsx
similarity index 100%
rename from FabricTestExample/src/Test1981.tsx
rename to apps/test-examples/src/Test1981.tsx
diff --git a/FabricTestExample/src/Test2008.tsx b/apps/test-examples/src/Test2008.tsx
similarity index 100%
rename from FabricTestExample/src/Test2008.tsx
rename to apps/test-examples/src/Test2008.tsx
diff --git a/FabricTestExample/src/Test2028.tsx b/apps/test-examples/src/Test2028.tsx
similarity index 100%
rename from FabricTestExample/src/Test2028.tsx
rename to apps/test-examples/src/Test2028.tsx
diff --git a/FabricTestExample/src/Test2048.tsx b/apps/test-examples/src/Test2048.tsx
similarity index 100%
rename from FabricTestExample/src/Test2048.tsx
rename to apps/test-examples/src/Test2048.tsx
diff --git a/FabricTestExample/src/Test2069.tsx b/apps/test-examples/src/Test2069.tsx
similarity index 100%
rename from FabricTestExample/src/Test2069.tsx
rename to apps/test-examples/src/Test2069.tsx
diff --git a/FabricTestExample/src/Test2118.tsx b/apps/test-examples/src/Test2118.tsx
similarity index 100%
rename from FabricTestExample/src/Test2118.tsx
rename to apps/test-examples/src/Test2118.tsx
diff --git a/FabricTestExample/src/Test263.js b/apps/test-examples/src/Test263.js
similarity index 100%
rename from FabricTestExample/src/Test263.js
rename to apps/test-examples/src/Test263.js
diff --git a/FabricTestExample/src/Test349.js b/apps/test-examples/src/Test349.js
similarity index 100%
rename from FabricTestExample/src/Test349.js
rename to apps/test-examples/src/Test349.js
diff --git a/TestsExample/src/Test364.js b/apps/test-examples/src/Test364.js
similarity index 100%
rename from TestsExample/src/Test364.js
rename to apps/test-examples/src/Test364.js
diff --git a/TestsExample/src/Test42.tsx b/apps/test-examples/src/Test42.tsx
similarity index 100%
rename from TestsExample/src/Test42.tsx
rename to apps/test-examples/src/Test42.tsx
diff --git a/FabricTestExample/src/Test528.js b/apps/test-examples/src/Test528.js
similarity index 100%
rename from FabricTestExample/src/Test528.js
rename to apps/test-examples/src/Test528.js
diff --git a/FabricTestExample/src/Test550.js b/apps/test-examples/src/Test550.js
similarity index 100%
rename from FabricTestExample/src/Test550.js
rename to apps/test-examples/src/Test550.js
diff --git a/TestsExample/src/Test556.js b/apps/test-examples/src/Test556.js
similarity index 100%
rename from TestsExample/src/Test556.js
rename to apps/test-examples/src/Test556.js
diff --git a/FabricTestExample/src/Test564.js b/apps/test-examples/src/Test564.js
similarity index 100%
rename from FabricTestExample/src/Test564.js
rename to apps/test-examples/src/Test564.js
diff --git a/FabricTestExample/src/Test577.js b/apps/test-examples/src/Test577.js
similarity index 100%
rename from FabricTestExample/src/Test577.js
rename to apps/test-examples/src/Test577.js
diff --git a/FabricTestExample/src/Test593.tsx b/apps/test-examples/src/Test593.tsx
similarity index 100%
rename from FabricTestExample/src/Test593.tsx
rename to apps/test-examples/src/Test593.tsx
diff --git a/FabricTestExample/src/Test619.js b/apps/test-examples/src/Test619.js
similarity index 100%
rename from FabricTestExample/src/Test619.js
rename to apps/test-examples/src/Test619.js
diff --git a/TestsExample/src/Test624.js b/apps/test-examples/src/Test624.js
similarity index 100%
rename from TestsExample/src/Test624.js
rename to apps/test-examples/src/Test624.js
diff --git a/FabricTestExample/src/Test640.js b/apps/test-examples/src/Test640.js
similarity index 100%
rename from FabricTestExample/src/Test640.js
rename to apps/test-examples/src/Test640.js
diff --git a/TestsExample/src/Test642.tsx b/apps/test-examples/src/Test642.tsx
similarity index 100%
rename from TestsExample/src/Test642.tsx
rename to apps/test-examples/src/Test642.tsx
diff --git a/TestsExample/src/Test645.js b/apps/test-examples/src/Test645.js
similarity index 100%
rename from TestsExample/src/Test645.js
rename to apps/test-examples/src/Test645.js
diff --git a/FabricTestExample/src/Test648.js b/apps/test-examples/src/Test648.js
similarity index 100%
rename from FabricTestExample/src/Test648.js
rename to apps/test-examples/src/Test648.js
diff --git a/FabricTestExample/src/Test649.js b/apps/test-examples/src/Test649.js
similarity index 100%
rename from FabricTestExample/src/Test649.js
rename to apps/test-examples/src/Test649.js
diff --git a/FabricTestExample/src/Test654.js b/apps/test-examples/src/Test654.js
similarity index 100%
rename from FabricTestExample/src/Test654.js
rename to apps/test-examples/src/Test654.js
diff --git a/FabricTestExample/src/Test658.js b/apps/test-examples/src/Test658.js
similarity index 100%
rename from FabricTestExample/src/Test658.js
rename to apps/test-examples/src/Test658.js
diff --git a/TestsExample/src/Test662.tsx b/apps/test-examples/src/Test662.tsx
similarity index 100%
rename from TestsExample/src/Test662.tsx
rename to apps/test-examples/src/Test662.tsx
diff --git a/FabricTestExample/src/Test691.js b/apps/test-examples/src/Test691.js
similarity index 100%
rename from FabricTestExample/src/Test691.js
rename to apps/test-examples/src/Test691.js
diff --git a/FabricTestExample/src/Test702.js b/apps/test-examples/src/Test702.js
similarity index 100%
rename from FabricTestExample/src/Test702.js
rename to apps/test-examples/src/Test702.js
diff --git a/FabricTestExample/src/Test706.js b/apps/test-examples/src/Test706.js
similarity index 100%
rename from FabricTestExample/src/Test706.js
rename to apps/test-examples/src/Test706.js
diff --git a/FabricTestExample/src/Test713.js b/apps/test-examples/src/Test713.js
similarity index 100%
rename from FabricTestExample/src/Test713.js
rename to apps/test-examples/src/Test713.js
diff --git a/TestsExample/src/Test726.js b/apps/test-examples/src/Test726.js
similarity index 100%
rename from TestsExample/src/Test726.js
rename to apps/test-examples/src/Test726.js
diff --git a/TestsExample/src/Test748.tsx b/apps/test-examples/src/Test748.tsx
similarity index 100%
rename from TestsExample/src/Test748.tsx
rename to apps/test-examples/src/Test748.tsx
diff --git a/TestsExample/src/Test750.js b/apps/test-examples/src/Test750.js
similarity index 100%
rename from TestsExample/src/Test750.js
rename to apps/test-examples/src/Test750.js
diff --git a/TestsExample/src/Test758.tsx b/apps/test-examples/src/Test758.tsx
similarity index 100%
rename from TestsExample/src/Test758.tsx
rename to apps/test-examples/src/Test758.tsx
diff --git a/FabricTestExample/src/Test761.tsx b/apps/test-examples/src/Test761.tsx
similarity index 100%
rename from FabricTestExample/src/Test761.tsx
rename to apps/test-examples/src/Test761.tsx
diff --git a/FabricTestExample/src/Test779.tsx b/apps/test-examples/src/Test779.tsx
similarity index 100%
rename from FabricTestExample/src/Test779.tsx
rename to apps/test-examples/src/Test779.tsx
diff --git a/FabricTestExample/src/Test780.tsx b/apps/test-examples/src/Test780.tsx
similarity index 100%
rename from FabricTestExample/src/Test780.tsx
rename to apps/test-examples/src/Test780.tsx
diff --git a/FabricTestExample/src/Test791.tsx b/apps/test-examples/src/Test791.tsx
similarity index 100%
rename from FabricTestExample/src/Test791.tsx
rename to apps/test-examples/src/Test791.tsx
diff --git a/TestsExample/src/Test800.tsx b/apps/test-examples/src/Test800.tsx
similarity index 100%
rename from TestsExample/src/Test800.tsx
rename to apps/test-examples/src/Test800.tsx
diff --git a/TestsExample/src/Test817.tsx b/apps/test-examples/src/Test817.tsx
similarity index 100%
rename from TestsExample/src/Test817.tsx
rename to apps/test-examples/src/Test817.tsx
diff --git a/TestsExample/src/Test830.tsx b/apps/test-examples/src/Test830.tsx
similarity index 100%
rename from TestsExample/src/Test830.tsx
rename to apps/test-examples/src/Test830.tsx
diff --git a/FabricTestExample/src/Test831.tsx b/apps/test-examples/src/Test831.tsx
similarity index 100%
rename from FabricTestExample/src/Test831.tsx
rename to apps/test-examples/src/Test831.tsx
diff --git a/FabricTestExample/src/Test844.tsx b/apps/test-examples/src/Test844.tsx
similarity index 100%
rename from FabricTestExample/src/Test844.tsx
rename to apps/test-examples/src/Test844.tsx
diff --git a/FabricTestExample/src/Test852.tsx b/apps/test-examples/src/Test852.tsx
similarity index 100%
rename from FabricTestExample/src/Test852.tsx
rename to apps/test-examples/src/Test852.tsx
diff --git a/TestsExample/src/Test860.tsx b/apps/test-examples/src/Test860.tsx
similarity index 100%
rename from TestsExample/src/Test860.tsx
rename to apps/test-examples/src/Test860.tsx
diff --git a/FabricTestExample/src/Test861.tsx b/apps/test-examples/src/Test861.tsx
similarity index 100%
rename from FabricTestExample/src/Test861.tsx
rename to apps/test-examples/src/Test861.tsx
diff --git a/FabricTestExample/src/Test865.tsx b/apps/test-examples/src/Test865.tsx
similarity index 100%
rename from FabricTestExample/src/Test865.tsx
rename to apps/test-examples/src/Test865.tsx
diff --git a/FabricTestExample/src/Test881.tsx b/apps/test-examples/src/Test881.tsx
similarity index 100%
rename from FabricTestExample/src/Test881.tsx
rename to apps/test-examples/src/Test881.tsx
diff --git a/TestsExample/src/Test887.tsx b/apps/test-examples/src/Test887.tsx
similarity index 100%
rename from TestsExample/src/Test887.tsx
rename to apps/test-examples/src/Test887.tsx
diff --git a/TestsExample/src/Test898.tsx b/apps/test-examples/src/Test898.tsx
similarity index 100%
rename from TestsExample/src/Test898.tsx
rename to apps/test-examples/src/Test898.tsx
diff --git a/FabricTestExample/src/Test913.tsx b/apps/test-examples/src/Test913.tsx
similarity index 100%
rename from FabricTestExample/src/Test913.tsx
rename to apps/test-examples/src/Test913.tsx
diff --git a/FabricTestExample/src/Test999.tsx b/apps/test-examples/src/Test999.tsx
similarity index 100%
rename from FabricTestExample/src/Test999.tsx
rename to apps/test-examples/src/Test999.tsx
diff --git a/TestsExample/src/TestFreeze.tsx b/apps/test-examples/src/TestFreeze.tsx
similarity index 100%
rename from TestsExample/src/TestFreeze.tsx
rename to apps/test-examples/src/TestFreeze.tsx
diff --git a/FabricTestExample/src/TestScreenAnimation.tsx b/apps/test-examples/src/TestScreenAnimation.tsx
similarity index 100%
rename from FabricTestExample/src/TestScreenAnimation.tsx
rename to apps/test-examples/src/TestScreenAnimation.tsx
diff --git a/TestsExample/tsconfig.json b/apps/test-examples/tsconfig.json
similarity index 100%
rename from TestsExample/tsconfig.json
rename to apps/test-examples/tsconfig.json