alert-dialog.tsx — ui Source File
Architecture documentation for alert-dialog.tsx, a tsx file in the ui codebase. 4 imports, 0 dependents.
Entity Profile
Dependency Diagram
graph LR 6d72b436_37b7_96be_dfc3_952e47aa0854["alert-dialog.tsx"] 1d141819_425e_b5fd_4c8e_32f7c6a42cf2["react"] 6d72b436_37b7_96be_dfc3_952e47aa0854 --> 1d141819_425e_b5fd_4c8e_32f7c6a42cf2 191e4a89_25e4_f7a3_d5fb_d71d101e0990["utils"] 6d72b436_37b7_96be_dfc3_952e47aa0854 --> 191e4a89_25e4_f7a3_d5fb_d71d101e0990 4b1d2128_46d9_46f0_b915_b6e1925b7876["button"] 6d72b436_37b7_96be_dfc3_952e47aa0854 --> 4b1d2128_46d9_46f0_b915_b6e1925b7876 9c463da6_747b_38dc_586b_cbb4873070b1["radix-ui"] 6d72b436_37b7_96be_dfc3_952e47aa0854 --> 9c463da6_747b_38dc_586b_cbb4873070b1 style 6d72b436_37b7_96be_dfc3_952e47aa0854 fill:#6366f1,stroke:#818cf8,color:#fff
Relationship Graph
Source Code
"use client"
import * as React from "react"
import { cn } from "@/examples/radix/lib/utils"
import { Button } from "@/examples/radix/ui/button"
import { AlertDialog as AlertDialogPrimitive } from "radix-ui"
function AlertDialog({
...props
}: React.ComponentProps<typeof AlertDialogPrimitive.Root>) {
return <AlertDialogPrimitive.Root data-slot="alert-dialog" {...props} />
}
function AlertDialogTrigger({
...props
}: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>) {
return (
<AlertDialogPrimitive.Trigger data-slot="alert-dialog-trigger" {...props} />
)
}
function AlertDialogPortal({
...props
}: React.ComponentProps<typeof AlertDialogPrimitive.Portal>) {
return (
<AlertDialogPrimitive.Portal data-slot="alert-dialog-portal" {...props} />
)
}
function AlertDialogOverlay({
className,
...props
}: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>) {
return (
<AlertDialogPrimitive.Overlay
data-slot="alert-dialog-overlay"
className={cn(
"data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 fixed inset-0 z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs",
className
)}
{...props}
/>
)
}
function AlertDialogContent({
className,
size = "default",
...props
}: React.ComponentProps<typeof AlertDialogPrimitive.Content> & {
size?: "default" | "sm"
}) {
return (
<AlertDialogPortal>
<AlertDialogOverlay />
<AlertDialogPrimitive.Content
data-slot="alert-dialog-content"
data-size={size}
className={cn(
"data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 bg-background ring-foreground/10 group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl p-4 ring-1 duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm",
// ... (139 more lines)
Domain
Subdomains
Functions
Dependencies
- button
- radix-ui
- react
- utils
Source
Frequently Asked Questions
What does alert-dialog.tsx do?
alert-dialog.tsx is a source file in the ui codebase, written in tsx. It belongs to the DocumentationAtlas domain, ContentSourcing subdomain.
What functions are defined in alert-dialog.tsx?
alert-dialog.tsx defines 12 function(s): AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, and 2 more.
What does alert-dialog.tsx depend on?
alert-dialog.tsx imports 4 module(s): button, radix-ui, react, utils.
Where is alert-dialog.tsx in the architecture?
alert-dialog.tsx is located at apps/v4/examples/radix/ui/alert-dialog.tsx (domain: DocumentationAtlas, subdomain: ContentSourcing, directory: apps/v4/examples/radix/ui).
Analyze Your Own Codebase
Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.
Try Supermodel Free