Massive/Switch.tsx

39 lines
893 B
TypeScript
Raw Normal View History

2022-12-30 06:42:30 +00:00
import React from 'react'
import {Platform, Pressable} from 'react-native'
import {Switch as PaperSwitch, Text, useTheme} from 'react-native-paper'
2022-10-31 04:22:08 +00:00
import {MARGIN} from './constants'
2022-09-26 03:10:13 +00:00
2022-12-30 06:42:30 +00:00
function Switch({
2022-09-26 03:10:13 +00:00
value,
2022-12-24 06:55:38 +00:00
onChange,
title,
2022-09-26 03:10:13 +00:00
}: {
2022-10-31 04:22:08 +00:00
value?: boolean
2022-12-24 06:55:38 +00:00
onChange: (value: boolean) => void
title: string
2022-09-26 03:10:13 +00:00
}) {
const {colors} = useTheme()
2022-09-26 03:10:13 +00:00
return (
<Pressable
2022-12-24 06:55:38 +00:00
onPress={() => onChange(!value)}
2022-09-26 03:10:13 +00:00
style={{
flexDirection: 'row',
flexWrap: 'wrap',
alignItems: 'center',
marginBottom: Platform.OS === 'ios' ? MARGIN : null,
2022-09-26 03:10:13 +00:00
}}>
<PaperSwitch
color={colors.primary}
2022-09-26 03:10:13 +00:00
style={{marginRight: MARGIN}}
value={value}
2022-12-24 06:55:38 +00:00
onValueChange={onChange}
trackColor={{true: colors.primary + '80', false: colors.disabled}}
2022-09-26 03:10:13 +00:00
/>
<Text>{title}</Text>
2022-09-26 03:10:13 +00:00
</Pressable>
2022-10-31 04:22:08 +00:00
)
2022-09-26 03:10:13 +00:00
}
2022-12-30 06:42:30 +00:00
export default React.memo(Switch)