Modal

npx npix@latest add Modal

<>
  <Button onClick={()=>r(!e)}>
    Try me
  </Button>
  <Modal
    onCancel={()=>r(!1)}
  >
    <div className="space-y-4">
      <header>
        <ModalTitle>
          Sign up for our newsletter
        </ModalTitle>
        <ModalDescription>
          You will get a 10% coupon on sign up.
        </ModalDescription>
      </header>
      <main className="space-y-2 text-sm">
        <label htmlFor="email">
          Enter your email
        </label>
        <Input
          id="email"
          placeholder="Email"
          type="email"
        />
      </main>
      <footer className="flex space-x-4 justify-end">
        <Button onClick={()=>r(!1)}>
          Close
        </Button>
        <Button
          onClick={()=>r(!1)}
          type="primary"
        >
          Confirm
        </Button>
      </footer>
    </div>
  </Modal>
</>