Massive/Switch.tsx

42 lines
1006 B
TypeScript

import {Control, Controller} from 'react-hook-form'
import {Platform, Pressable} from 'react-native'
import {Switch as PaperSwitch, Text, useTheme} from 'react-native-paper'
import {MARGIN} from './constants'
export default function Switch({
control,
name,
children,
}: {
name: string
control: Control<any, any>
children: string
}) {
const {colors} = useTheme()
return (
<Controller
name={name}
control={control}
render={({field: {onChange, value}}) => (
<Pressable
onPress={() => onChange(!value)}
style={{
flexDirection: 'row',
flexWrap: 'wrap',
alignItems: 'center',
marginBottom: Platform.OS === 'ios' ? MARGIN : null,
}}>
<PaperSwitch
color={colors.primary}
style={{marginRight: MARGIN}}
value={value}
onValueChange={onChange}
/>
<Text>{children}</Text>
</Pressable>
)}
/>
)
}