40 lines
1010 B
TypeScript
40 lines
1010 B
TypeScript
import { Pressable } from "react-native";
|
|
import { Ionicons } from "@expo/vector-icons";
|
|
import { useTheme } from "../theme";
|
|
|
|
interface FabProps {
|
|
onPress: () => void;
|
|
icon?: string;
|
|
accessibilityLabel: string;
|
|
}
|
|
|
|
export function Fab({ onPress, icon = "add", accessibilityLabel }: FabProps) {
|
|
const theme = useTheme();
|
|
|
|
return (
|
|
<Pressable
|
|
accessible
|
|
accessibilityLabel={accessibilityLabel}
|
|
accessibilityRole="button"
|
|
onPress={onPress}
|
|
style={({ pressed }) => [
|
|
{
|
|
position: "absolute",
|
|
bottom: 24,
|
|
right: 24,
|
|
backgroundColor: theme.colors.primary,
|
|
width: 58,
|
|
height: 58,
|
|
borderRadius: 29,
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
...theme.shadows.lg,
|
|
},
|
|
pressed && { opacity: 0.82, transform: [{ scale: 0.96 }] },
|
|
]}
|
|
>
|
|
<Ionicons name={icon as any} size={28} color={theme.colors.textInverse} />
|
|
</Pressable>
|
|
);
|
|
}
|