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  ScrollView,
13} from "react-native";
14import { cn } from "@/lib/utils";
15import { Ionicons } from "@expo/vector-icons";
16 
17interface DialogProps {
18  children: React.ReactNode;
19  className?: string;
20  open?: boolean;
21  onOpenChange?: (open: boolean) => void;
22}
23 
24interface DialogTriggerProps {
25  children: React.ReactNode;
26  className?: string;
27  disabled?: boolean;
28  asChild?: boolean;
29}
30 
31interface DialogContentProps {
32  children: React.ReactNode;
33  className?: string;
34  showCloseButton?: boolean;
35  onInteractOutside?: () => void;
36}
37 
38interface DialogHeaderProps {
39  className?: string;
40  children: React.ReactNode;
41}
42 
43interface DialogFooterProps {
44  className?: string;
45  children: React.ReactNode;
46}
47 
48interface DialogTitleProps {
49  className?: string;
50  children: React.ReactNode;
51}
52 
53interface DialogDescriptionProps {
54  className?: string;
55  children: React.ReactNode;
56}
57 
58interface DialogCloseProps {
59  children: React.ReactElement<{ onPress?: (e: any) => void }>;
60  className?: string;
61}
62 
63const DialogContext = React.createContext<{
64  open: boolean;
65  setOpen: (open: boolean) => void;
66  handleClose?: () => void;
67}>({
68  open: false,
69  setOpen: () => { },
70});
71 
72const Dialog = React.forwardRef<View, DialogProps>(
73  ({ children, className, open = false, onOpenChange, ...props }, ref) => {
74    const [internalOpen, setInternalOpen] = React.useState(false);
75 
76    const isControlled = open !== undefined;
77    const isOpen = isControlled ? open : internalOpen;
78 
79    const setOpen = React.useCallback(
80      (value: boolean) => {
81        if (!isControlled) {
82          setInternalOpen(value);
83        }
84        onOpenChange?.(value);
85      },
86      [isControlled, onOpenChange]
87    );
88 
89    return (
90      <DialogContext.Provider value={{ open: isOpen, setOpen }}>
91        <View ref={ref} className={cn("", className)} {...props}>
92          {children}
93        </View>
94      </DialogContext.Provider>
95    );
96  }
97);
98 
99Dialog.displayName = "Dialog";
100 
101const DialogTrigger = React.forwardRef<View, DialogTriggerProps>(
102  (
103    { children, className, disabled = false, asChild = false, ...props },
104    ref
105  ) => {
106    const { setOpen } = React.useContext(DialogContext);
107 
108    if (asChild) {
109      const child = React.Children.only(children) as React.ReactElement<{
110        onPress?: (e: any) => void;
111        ref?: React.Ref<any>;
112// … truncated