Studio Kit

Bloco

Modal

Janela modal genérica baseada em Dialog (Radix). Overlay escurecido com blur, fechar ao clicar fora ou tecla Esc, foco preso e gerenciado automaticamente. Acessível por padrão.

npx shadcn add @studio/modal

Preview

Confirmar publicação

Esta ação tornará a página visível para todos os visitantes. Você pode reverter a qualquer momento.

O conteúdo entra no ar imediatamente após a confirmação.

Fecha por Esc, clique no overlay ou nos botões — acessível por padrão

Props

Prop Tipo Descrição
title string Título no topo do modal (obrigatório)
triggerLabel string Texto do botão que abre o modal
description string Texto de apoio abaixo do título
children ReactNode Conteúdo do corpo do modal
confirmLabel string Texto do botão de confirmação (omita para esconder)
cancelLabel string Texto do botão de cancelar
onConfirm () => void Callback ao confirmar
open boolean Estado controlado de abertura (opcional)
onOpenChange (open: boolean) => void Handler de mudança quando controlado
className string Classes adicionais para o conteúdo