Alert Dialog

1import * as React from "react";
2import {
3  View,
4  Text,
5  Pressable,
6  Modal,
7  TouchableWithoutFeedback,
8  Platform,
9  Animated,
10  Dimensions,
11  KeyboardAvoidingView,
12} from "react-native";
13import { cn } from "@/lib/utils";
14 
15interface AlertDialogProps {
16  children: React.ReactNode;
17  className?: string;
18  open?: boolean;
19  onOpenChange?: (open: boolean) => void;
20}
21 
22interface AlertDialogTriggerProps {
23  children: React.ReactNode;
24  className?: string;
25  disabled?: boolean;
26  asChild?: boolean;
27}
28 
29interface AlertDialogContentProps {
30  children: React.ReactNode;
31  className?: string;
32  onInteractOutside?: () => void;
33}
34 
35interface AlertDialogHeaderProps {
36  className?: string;
37  children: React.ReactNode;
38}
39 
40interface AlertDialogFooterProps {
41  className?: string;
42  children: React.ReactNode;
43}
44 
45interface AlertDialogTitleProps {
46  className?: string;
47  children: React.ReactNode;
48}
49 
50interface AlertDialogDescriptionProps {
51  className?: string;
52  children: React.ReactNode;
53}
54 
55interface AlertDialogActionProps {
56  children: React.ReactElement<{ onPress?: (e: any) => void }>;
57  className?: string;
58}
59 
60interface AlertDialogCancelProps {
61  children: React.ReactElement<{ onPress?: (e: any) => void }>;
62  className?: string;
63}
64 
65const AlertDialogContext = React.createContext<{
66  open: boolean;
67  setOpen: (open: boolean) => void;
68  handleClose?: () => void;
69}>({
70  open: false,
71  setOpen: () => { },
72});
73 
74const AlertDialog = React.forwardRef<View, AlertDialogProps>(
75  ({ children, className, open = false, onOpenChange, ...props }, ref) => {
76    const [internalOpen, setInternalOpen] = React.useState(false);
77 
78    const isControlled = open !== undefined;
79    const isOpen = isControlled ? open : internalOpen;
80 
81    const setOpen = React.useCallback(
82      (value: boolean) => {
83        if (!isControlled) {
84          setInternalOpen(value);
85        }
86        onOpenChange?.(value);
87      },
88      [isControlled, onOpenChange]
89    );
90 
91    return (
92      <AlertDialogContext.Provider value={{ open: isOpen, setOpen }}>
93        <View ref={ref} className={cn("", className)} {...props}>
94          {children}
95        </View>
96      </AlertDialogContext.Provider>
97    );
98  }
99);
100 
101AlertDialog.displayName = "AlertDialog";
102 
103const AlertDialogTrigger = React.forwardRef<View, AlertDialogTriggerProps>(
104  (
105    { children, className, disabled = false, asChild = false, ...props },
106    ref
107  ) => {
108    const { setOpen } = React.useContext(AlertDialogContext);
109 
110    if (asChild) {
111// … truncated