Pular para o conteúdo
A
Get Pro

Dialog

OverlaysCLI

Modal (Radix) com 5 tamanhos, 5 superfícies, animação de entrada/saída e botão fechar opcional.

Instalação

bash
pnpm add aura-ui-components aura-ui-tailwind

Depois, importe o CSS uma vez no seu arquivo global (Tailwind v4):

css
/* app/globals.css */
@import "aura-ui-tailwind";
@import "aura-ui-components/tailwind.css";

Uso

tsx
import {
  Dialog,
  DialogTrigger,
  DialogPortal,
  DialogClose,
  DialogOverlay,
  DialogContent,
  DialogHeader,
  DialogFooter
} from "aura-ui-components/dialog";

API

Exportações

DialogDialogTriggerDialogPortalDialogCloseDialogOverlayDialogContentDialogHeaderDialogFooterDialogTitleDialogDescriptiondialogContentVariants

Tipos

DialogContentProps

Dependências npm

@radix-ui/react-dialogclass-variance-authority

Código-fonte

É exatamente o arquivo que o CLI copia para o seu projeto — edite à vontade.