ammarahm-ed / react-native-actions-sheet

A Cross Platform(Android, iOS & Web) ActionSheet with a flexible api, native performance and zero dependency code for react native. Create anything you want inside ActionSheet.
https://rnas.vercel.app
MIT License
1.46k stars 121 forks source link

TouchableOpacity is not working inside the ActionSheet #382

Closed JaifDev closed 1 month ago

JaifDev commented 1 month ago

`import React, { useRef } from "react"; import { StyleSheet, Text, View, TouchableOpacity } from "react-native"; import ActionSheet, { ActionSheetRef, SheetManager, SheetProps, } from "react-native-actions-sheet"; import { widthPercentageToDP as wp, heightPercentageToDP as hp, } from "react-native-responsive-screen"; import { COLORS, FONT, SIZES } from "@/constants"; const TeacherClassSelection = (props: SheetProps<"teacherClassSelection">) => { const actionSheetRef = useRef(null); const { payload } = props; const { selectedClass, setClass, subject, setSubject } = payload!; const classes = ["Class 5", "Class 8", "Class 10"]; const subjects = ["Science", "Maths"]; const handleClassSelection = (selectedClass: string) => { console.log(selectedClass); setClass(selectedClass); SheetManager.hideAll(); }; const handleSubjectSelection = (selectedSubject: string) => { console.log(selectedSubject); setSubject(selectedSubject); SheetManager.hideAll(); }; return ( <ActionSheet id={props.sheetId} ref={actionSheetRef} drawUnderStatusBar={false} indicatorStyle={{ width: wp(20), marginVertical: hp(1), backgroundColor: COLORS.white, }} gestureEnabled={true} containerStyle={{ backgroundColor: COLORS.sheetColor, }} useBottomSafeAreaPadding={false}

Select a Class & Subject Select Class: {classes.map((classItem, index) => ( { setSubject(classItem); SheetManager.hideAll(); }} {classItem} ))} Select Subject: {subjects.map((subjectItem, index) => ( { setSubject(subjectItem); SheetManager.hideAll(); }} {subjectItem} ))}

); }; export default TeacherClassSelection; const styles = StyleSheet.create({ container: { paddingHorizontal: wp(3), }, title: { fontFamily: FONT.bold, color: COLORS.white, fontSize: SIZES.l, maxWidth: wp(60), marginBottom: hp(2), }, sectionContainer: { marginBottom: hp(3), }, sectionTitle: { fontFamily: FONT.medium, color: COLORS.white, fontSize: SIZES.m, marginBottom: hp(1), }, btn: { width: wp(93), justifyContent: "center", alignItems: "center", backgroundColor: COLORS.primary, borderRadius: wp(2), height: hp(6), marginBottom: hp(1), }, selectedBtn: { backgroundColor: COLORS.secondary, }, btnTxt: { fontFamily: FONT.medium, color: COLORS.white, fontSize: SIZES.m, }, });`

The TouchableOpacity is working sometimes and sometimes not with newarch enabled. Is there any fix to it?