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 8a59d69c_497a_ace6_5c02_034d47d656c0["alert-dialog.tsx"] 1d141819_425e_b5fd_4c8e_32f7c6a42cf2["react"] 8a59d69c_497a_ace6_5c02_034d47d656c0 --> 1d141819_425e_b5fd_4c8e_32f7c6a42cf2 191e4a89_25e4_f7a3_d5fb_d71d101e0990["utils"] 8a59d69c_497a_ace6_5c02_034d47d656c0 --> 191e4a89_25e4_f7a3_d5fb_d71d101e0990 c79cdc74_50fb_62bd_465f_35936d2c5eac["button"] 8a59d69c_497a_ace6_5c02_034d47d656c0 --> c79cdc74_50fb_62bd_465f_35936d2c5eac 9c463da6_747b_38dc_586b_cbb4873070b1["radix-ui"] 8a59d69c_497a_ace6_5c02_034d47d656c0 --> 9c463da6_747b_38dc_586b_cbb4873070b1 style 8a59d69c_497a_ace6_5c02_034d47d656c0 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-rtl/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 start-1/2 top-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 rtl:translate-x-1/2",
// ... (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, Changelog 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-rtl/alert-dialog.tsx (domain: DocumentationAtlas, subdomain: Changelog, directory: apps/v4/examples/radix/ui-rtl).
Analyze Your Own Codebase
Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.
Try Supermodel Free