58 lines
1.2 KiB
TypeScript
58 lines
1.2 KiB
TypeScript
import { React, ReactNative as RN } from "@vendetta/metro/common";
|
|
import { Forms } from "@vendetta/ui/components";
|
|
import type { ImageSourcePropType } from "react-native";
|
|
|
|
import { ActionSheet } from "../ActionSheet";
|
|
|
|
const { FormRow } = Forms;
|
|
|
|
export default function ChooseSheet({
|
|
title,
|
|
value: _value,
|
|
options,
|
|
callback,
|
|
}: {
|
|
title: string;
|
|
value: string | number | boolean | null;
|
|
options: {
|
|
name: string;
|
|
description?: string;
|
|
value: typeof _value;
|
|
icon?: ImageSourcePropType;
|
|
iconColor?: any;
|
|
iconComponent?: React.ReactNode;
|
|
}[];
|
|
callback: (v: typeof _value) => void;
|
|
}) {
|
|
const [value, setValue] = React.useState(_value);
|
|
|
|
return (
|
|
<ActionSheet title={title}>
|
|
{options.map((x) => (
|
|
<FormRow
|
|
key={x.value}
|
|
label={x.name}
|
|
subLabel={x.description}
|
|
trailing={x.iconComponent
|
|
? x.iconComponent
|
|
: x.icon && (
|
|
<RN.Image
|
|
source={x.icon}
|
|
resizeMode="cover"
|
|
style={{
|
|
width: 24,
|
|
height: 24,
|
|
tintColor: x.iconColor,
|
|
}}
|
|
/>
|
|
)}
|
|
leading={<FormRow.Radio selected={x.value === value} />}
|
|
onPress={() => {
|
|
setValue(x.value);
|
|
callback(x.value);
|
|
}}
|
|
/>
|
|
))}
|
|
</ActionSheet>
|
|
);
|
|
}
|