MiHCM
overlay/@mihcm/ui·v0.21.0·stable

Dialog

Accessible modal dialog built on native <dialog>. Composable: Dialog, DialogContent, DialogHeader, DialogBody, DialogFooter, DialogTitle, DialogDescription, DialogClose.

ConfiguratorExamplesUsageAccessibilityApi

Live preview

Adjust the controls on the right; the preview and code update in real time.

Edit Profile

Make changes to your profile here.

Dialog body content goes here. You can place forms, text, or any other content.

example.tsxtsx
StackBlitz
import { Dialog, DialogContent, DialogHeader, DialogBody, DialogFooter, DialogTitle, DialogDescription, DialogClose } from '@mihcm/ui/Dialog';

export function Example() {
  return (
    <Dialog
  size="md"
  title="Edit Profile"
  description="Make changes to your profile here."
    ></Dialog>
  );
}

Install

Both paths are valid. CLI ships the source into your repo (you own it). Install pins via npm.

npx @mihcm/cli add Dialog
Copies the source into components/ds/Dialog.tsx. You own the file. Use --out to override the directory or --force to overwrite.