You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
66 lines
1.7 KiB
66 lines
1.7 KiB
import React, { useRef } from "react"; |
|
import { Text, TouchableOpacity, Appearance } from "react-native"; |
|
import RBSheet from "react-native-raw-bottom-sheet"; |
|
import { Entypo } from "@expo/vector-icons"; |
|
|
|
//style |
|
import tw from "tailwind-react-native-classnames"; |
|
import fontSize from "../../../constants/fontSize"; |
|
import Colors from "../../../constants/Colors"; |
|
|
|
export default function Description({ title, component, height }) { |
|
const colorScheme = Appearance.getColorScheme(); |
|
const refRBSheet = useRef(); |
|
return ( |
|
<> |
|
<TouchableOpacity |
|
onPress={() => refRBSheet.current.open()} |
|
style={[ |
|
tw.style( |
|
"flex flex-row-reverse justify-between items-center mt-3 rounded-md px-5 py-3" |
|
), |
|
{ |
|
backgroundColor: Colors.theme1[colorScheme].greenCF, |
|
// borderWidth : 1, |
|
}, |
|
]} |
|
> |
|
<Text |
|
style={[ |
|
{ |
|
fontSize: fontSize.tiny, |
|
color: "white", |
|
fontFamily: "bold", |
|
}, |
|
tw.style(""), |
|
]} |
|
> |
|
{title} |
|
</Text> |
|
<Entypo name="chevron-small-left" size={20} color="white" /> |
|
</TouchableOpacity> |
|
<RBSheet |
|
ref={refRBSheet} |
|
closeOnDragDown={true} |
|
dragFromTopOnly={true} |
|
closeOnPressMask={true} |
|
height={height} |
|
customStyles={{ |
|
wrapper: { |
|
backgroundColor: "#00000077", |
|
}, |
|
container: { |
|
padding : 0, |
|
borderTopLeftRadius: 30, |
|
borderTopRightRadius: 30, |
|
}, |
|
draggableIcon: { |
|
backgroundColor: "#000", |
|
}, |
|
}} |
|
> |
|
{component} |
|
</RBSheet> |
|
</> |
|
); |
|
}
|
|
|