diff options
Diffstat (limited to 'src/components/Dialog/index.tsx')
-rw-r--r-- | src/components/Dialog/index.tsx | 34 |
1 files changed, 32 insertions, 2 deletions
diff --git a/src/components/Dialog/index.tsx b/src/components/Dialog/index.tsx index 55798db7f..859e4965c 100644 --- a/src/components/Dialog/index.tsx +++ b/src/components/Dialog/index.tsx @@ -4,6 +4,8 @@ import Animated, {useAnimatedStyle} from 'react-native-reanimated' import {useSafeAreaInsets} from 'react-native-safe-area-context' import BottomSheet, { BottomSheetBackdropProps, + BottomSheetFlatList, + BottomSheetFlatListMethods, BottomSheetScrollView, BottomSheetScrollViewMethods, BottomSheetTextInput, @@ -11,10 +13,10 @@ import BottomSheet, { useBottomSheet, WINDOW_HEIGHT, } from '@discord/bottom-sheet/src' +import {BottomSheetFlatListProps} from '@discord/bottom-sheet/src/components/bottomSheetScrollable/types' import {logger} from '#/logger' import {useDialogStateControlContext} from '#/state/dialogs' -import {isNative} from 'platform/detection' import {atoms as a, flatten, useTheme} from '#/alf' import {Context} from '#/components/Dialog/context' import { @@ -238,7 +240,7 @@ export const ScrollableInner = React.forwardRef< }, flatten(style), ]} - contentContainerStyle={isNative ? a.pb_4xl : undefined} + contentContainerStyle={a.pb_4xl} ref={ref}> {children} <View style={{height: insets.bottom + a.pt_5xl.paddingTop}} /> @@ -246,6 +248,34 @@ export const ScrollableInner = React.forwardRef< ) }) +export const InnerFlatList = React.forwardRef< + BottomSheetFlatListMethods, + BottomSheetFlatListProps<any> +>(function InnerFlatList({style, contentContainerStyle, ...props}, ref) { + const insets = useSafeAreaInsets() + return ( + <BottomSheetFlatList + keyboardShouldPersistTaps="handled" + contentContainerStyle={[a.pb_4xl, flatten(contentContainerStyle)]} + ListFooterComponent={ + <View style={{height: insets.bottom + a.pt_5xl.paddingTop}} /> + } + ref={ref} + {...props} + style={[ + a.flex_1, + a.p_xl, + a.pt_0, + a.h_full, + { + marginTop: 40, + }, + flatten(style), + ]} + /> + ) +}) + export function Handle() { const t = useTheme() |