diff --git a/examples/bare-example/package.json b/examples/bare-example/package.json index b4814e7..e8dd724 100644 --- a/examples/bare-example/package.json +++ b/examples/bare-example/package.json @@ -34,4 +34,4 @@ "engines": { "node": ">=18" } -} \ No newline at end of file +} diff --git a/examples/expo-example/App.tsx b/examples/expo-example/App.tsx index 74d3dfd..b5a827b 100644 --- a/examples/expo-example/App.tsx +++ b/examples/expo-example/App.tsx @@ -1,15 +1,100 @@ import { StatusBar } from 'expo-status-bar'; -import { Platform, Pressable, StyleSheet, Text, View } from 'react-native'; +import { useCallback, useState } from 'react'; +import type { ListRenderItemInfo } from 'react-native'; +import { + Button, + FlatList, + Modal, + Platform, + Pressable, + SafeAreaView, + ScrollView, + StyleSheet, + Text, + View, +} from 'react-native'; import { ReactNativeLegal } from 'react-native-legal'; const BUTTON_BACKGROUND_COLOR = '#8232ff'; const BUTTON_FONT_COLOR = '#FFF'; const BUTTON_RIPPLE_COLOR = '#8232ffba'; +const MODAL_ITEM_HEADER_COLOR = '#fff'; + +function Item({ item }: { item: any }) { + const [customDetailModalVisible, setCustomDetailModalVisible] = useState(false); + + const handlePress = useCallback(function handlePress() { + setCustomDetailModalVisible(true); + }, []); + + const closeModal = useCallback(function closeModal() { + setCustomDetailModalVisible(false); + }, []); + + return ( + + [styles.button, pressed && styles.pressed]} + > + {item.name} + + + +