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

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>
</>
);
}