- "content": "import { Icon } from '@/registry/new-york/components/ui/icon';\nimport { NativeOnlyAnimatedView } from '@/registry/new-york/components/ui/native-only-animated-view';\nimport { cn } from '@/registry/new-york/lib/utils';\nimport * as DialogPrimitive from '@rn-primitives/dialog';\nimport { X } from 'lucide-react-native';\nimport * as React from 'react';\nimport { Platform, Text, View, type ViewProps } from 'react-native';\nimport { FadeIn, FadeOut } from 'react-native-reanimated';\nimport { FullWindowOverlay as RNFullWindowOverlay } from 'react-native-screens';\n\nconst Dialog = DialogPrimitive.Root;\n\nconst DialogTrigger = DialogPrimitive.Trigger;\n\nconst DialogPortal = DialogPrimitive.Portal;\n\nconst DialogClose = DialogPrimitive.Close;\n\nconst FullWindowOverlay = Platform.OS === 'ios' ? RNFullWindowOverlay : React.Fragment;\n\nfunction DialogOverlay({\n className,\n children,\n ...props\n}: Omit<DialogPrimitive.OverlayProps, 'asChild'> &\n React.RefAttributes<DialogPrimitive.OverlayRef> & {\n children?: React.ReactNode;\n }) {\n return (\n <FullWindowOverlay>\n <DialogPrimitive.Overlay\n className={cn(\n 'absolute bottom-0 left-0 right-0 top-0 z-50 flex items-center justify-center bg-black/50 p-2',\n Platform.select({\n web: 'animate-in fade-in-0 fixed cursor-default [&>*]:cursor-auto',\n }),\n className\n )}\n {...props}\n asChild={Platform.OS !== 'web'}>\n <NativeOnlyAnimatedView entering={FadeIn.duration(200)} exiting={FadeOut.duration(150)}>\n <NativeOnlyAnimatedView entering={FadeIn.delay(50)} exiting={FadeOut.duration(150)}>\n <>{children}</>\n </NativeOnlyAnimatedView>\n </NativeOnlyAnimatedView>\n </DialogPrimitive.Overlay>\n </FullWindowOverlay>\n );\n}\nfunction DialogContent({\n className,\n portalHost,\n children,\n ...props\n}: DialogPrimitive.ContentProps &\n React.RefAttributes<DialogPrimitive.ContentRef> & {\n portalHost?: string;\n }) {\n return (\n <DialogPortal hostName={portalHost}>\n <DialogOverlay>\n <DialogPrimitive.Content\n className={cn(\n 'bg-background border-border z-50 flex w-full max-w-[calc(100%-2rem)] flex-col gap-4 rounded-lg border p-6 shadow-lg shadow-black/5 sm:max-w-lg',\n Platform.select({\n web: 'animate-in fade-in-0 zoom-in-95 duration-200',\n }),\n className\n )}\n {...props}>\n <>{children}</>\n <DialogPrimitive.Close\n className={cn(\n 'absolute right-4 top-4 rounded opacity-70 active:opacity-100',\n Platform.select({\n web: 'ring-offset-background focus:ring-ring data-[state=open]:bg-accent transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-offset-2',\n })\n )}\n hitSlop={12}>\n <Icon\n as={X}\n className={cn('text-accent-foreground web:pointer-events-none size-4 shrink-0')}\n />\n <Text className=\"sr-only\">Close</Text>\n </DialogPrimitive.Close>\n </DialogPrimitive.Content>\n </DialogOverlay>\n </DialogPortal>\n );\n}\n\nfunction DialogHeader({ className, ...props }: ViewProps) {\n return (\n <View className={cn('flex flex-col gap-2 text-center sm:text-left', className)} {...props} />\n );\n}\n\nfunction DialogFooter({ className, ...props }: ViewProps) {\n return (\n <View\n className={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', className)}\n {...props}\n />\n );\n}\n\nfunction DialogTitle({\n className,\n ...props\n}: DialogPrimitive.TitleProps & React.RefAttributes<DialogPrimitive.TitleRef>) {\n return (\n <DialogPrimitive.Title\n className={cn('text-foreground text-lg font-semibold leading-none', className)}\n {...props}\n />\n );\n}\n\nfunction DialogDescription({\n className,\n ...props\n}: DialogPrimitive.DescriptionProps & React.RefAttributes<DialogPrimitive.DescriptionRef>) {\n return (\n <DialogPrimitive.Description\n className={cn('text-muted-foreground text-sm', className)}\n {...props}\n />\n );\n}\n\nexport {\n Dialog,\n DialogClose,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogOverlay,\n DialogPortal,\n DialogTitle,\n DialogTrigger,\n};\n",
0 commit comments