Modal

Preview

import Button from "@repo/ui/Button";
import Modal from "@repo/ui/Modal";

<Button onClick={() => setOpen(true)}>کلیک کن</Button>

<Modal
  open={open}
  type="danger"
  title="عنوان مودال"
  description="لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ."
  onAdmit={async () => {
    await new Promise((resolve) => setTimeout(resolve, 2000));
    setOpen(false);
  }}
  onDeny={() => setOpen(false)}
/>

Installation

npx the-dig@latest add Button,Modal

Props

Prop	Type	Default
open *	boolean	-
type *	"info" | "success" | "danger" | "warning"	-
title *	string	-
description	string	-
onAdmit *	() => Promise<void>	-
onDeny *	VoidFunction	-
className	string	-

Types

Info

import Button from "@repo/ui/Button";
import Modal from "@repo/ui/Modal";

<Button onClick={() => setOpen(true)}>کلیک کن</Button>

<Modal
  open={open}
  type="info"
  title="عنوان مودال"
  description="لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ."
  onAdmit={async () => {
    await new Promise((resolve) => setTimeout(resolve, 2000));
    setOpen(false);
  }}
  onDeny={() => setOpen(false)}
/>

Success

import Button from "@repo/ui/Button";
import Modal from "@repo/ui/Modal";

<Button onClick={() => setOpen(true)}>کلیک کن</Button>

<Modal
  open={open}
  type="success"
  title="عنوان مودال"
  description="لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ."
  onAdmit={async () => {
    await new Promise((resolve) => setTimeout(resolve, 2000));
    setOpen(false);
  }}
  onDeny={() => setOpen(false)}
/>

Warning

import Button from "@repo/ui/Button";
import Modal from "@repo/ui/Modal";

<Button onClick={() => setOpen(true)}>کلیک کن</Button>

<Modal
  open={open}
  type="warning"
  title="عنوان مودال"
  description="لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ."
  onAdmit={async () => {
    await new Promise((resolve) => setTimeout(resolve, 2000));
    setOpen(false);
  }}
  onDeny={() => setOpen(false)}
/>

Danger

import Button from "@repo/ui/Button";
import Modal from "@repo/ui/Modal";

<Button onClick={() => setOpen(true)}>کلیک کن</Button>

<Modal
  open={open}
  type="danger"
  title="عنوان مودال"
  description="لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ."
  onAdmit={async () => {
    await new Promise((resolve) => setTimeout(resolve, 2000));
    setOpen(false);
  }}
  onDeny={() => setOpen(false)}
/>