KvalityUI

Dialog

Модальное окно. Для подтверждений есть готовый подвал с кнопками DialogActionFooter.

Живой код — редактируйте
function Example() {
  const [open, setOpen] = useState(false);
  return (
    <Dialog open={open} onOpenChange={setOpen}>
      <DialogTrigger asChild>
        <Button variant="outline">Отключить уведомления</Button>
      </DialogTrigger>
      <DialogContent>
        <DialogHeader>
          <DialogTitle>Отключить уведомления?</DialogTitle>
          <DialogDescription>
            Новые заявки перестанут приходить в Telegram-чат проекта.
          </DialogDescription>
        </DialogHeader>
        <DialogActionFooter
          confirmText="Отключить"
          confirmVariant="destructive"
          onCancel={() => setOpen(false)}
          onConfirm={() => setOpen(false)}
        />
      </DialogContent>
    </Dialog>
  );
}

render(<Example />);

Пропсы DialogContent

Prop

Type

Также принимает стандартные атрибуты DialogContentPropsHTMLAttributesDismissableLayerPropsDialogContentImplProps

Пропсы DialogActionFooter

Prop

Type

On this page