50 lines
1.3 KiB
TypeScript
50 lines
1.3 KiB
TypeScript
import styles, { COLORS } from "@/styles/styles";
|
|
import { PickerItemProps, PickerProps } from "@react-native-picker/picker";
|
|
import { useMemo } from "react";
|
|
import { useColorScheme, View } from "react-native";
|
|
import { Picker as RNPicker } from "@react-native-picker/picker";
|
|
|
|
export const PickerItem: React.FC<PickerItemProps> = (props) => {
|
|
const colorScheme = useColorScheme();
|
|
const darkMode = useMemo(() => colorScheme === "dark", [colorScheme]);
|
|
const colors = useMemo(
|
|
() => (darkMode ? COLORS.DARK : COLORS.LIGHT),
|
|
[darkMode]
|
|
);
|
|
|
|
return (
|
|
<RNPicker.Item
|
|
style={[
|
|
styles.pickerItem,
|
|
{ color: colors.TEXT, backgroundColor: colors.PRIMARY },
|
|
]}
|
|
{...props}
|
|
/>
|
|
);
|
|
};
|
|
|
|
export const Picker: React.FC<PickerProps> = (props) => {
|
|
const colorScheme = useColorScheme();
|
|
const darkMode = useMemo(() => colorScheme === "dark", [colorScheme]);
|
|
const colors = useMemo(
|
|
() => (darkMode ? COLORS.DARK : COLORS.LIGHT),
|
|
[darkMode]
|
|
);
|
|
|
|
return (
|
|
<View style={styles.pickerWrapper}>
|
|
<RNPicker
|
|
style={[
|
|
styles.picker,
|
|
{
|
|
color: colors.TEXT,
|
|
backgroundColor: colors.PRIMARY,
|
|
},
|
|
]}
|
|
dropdownIconColor={colors.TEXT}
|
|
{...props}
|
|
/>
|
|
</View>
|
|
);
|
|
};
|