Open History to see the last commit
1import type { ComponentProps, ReactNode } from "react";
2import { Pressable, View } from "react-native";
3import { GestureDetector } from "react-native-gesture-handler";
4
5import { cn } from "../../lib/cn";
6import { useHoverGesture } from "../../lib/useHoverGesture";
7
8export function RowPressable({
9 children,
10 className,
11 interactionClassName = "bg-row-hover",
12 interactionOpacity = 1,
13 ...props
14}: Omit<ComponentProps<typeof Pressable>, "children"> & {
15 readonly children: ReactNode;
16 readonly interactionClassName?: string;
17 readonly interactionOpacity?: number;
18}) {
19 const { hovered, hoverGesture } = useHoverGesture(props.disabled ?? false);
20 return (
21 <GestureDetector gesture={hoverGesture}>
22 <Pressable {...props} className={cn("relative overflow-hidden", className)}>
23 {() => (
24 <>
25 <View
26 pointerEvents="none"
27 className={cn("absolute inset-0", interactionClassName)}
28 style={{ opacity: props.disabled || !hovered ? 0 : interactionOpacity }}
29 />
30 {children}
31 </>
32 )}
33 </Pressable>
34 </GestureDetector>
35 );
36}