first commit

calcom/packages/ui/components/dialog/Dialog.docs.mdx

@@ -0,0 +1,52 @@
+import { Meta } from "@storybook/blocks";
+import { Title, CustomArgsTable } from "@calcom/storybook/components";
+import { Dialog, DialogContent, DialogFooter, DialogClose, DialogHeader } from "./Dialog";
+import * as DialogStories from "./Dialog.stories";
+
+<Meta of={DialogStories} />
+
+<Title title="Dialog" suffix="Brief" subtitle="Version 1.0 — Last Update: 18 Aug 2023" />
+
+## Definition
+
+The `Dialog` component provides a flexible way to create dialogs in your application.
+
+## Structure
+
+The `Dialog` component is composed of the following components:
+
+- `Dialog`: The main component that wraps the entire dialog. It manages the dialog's open and close states.
+
+- `DialogContent`: Represents the content of the dialog. It can have different sizes, types, and an optional icon.
+
+- `DialogHeader`: Renders the header of the dialog, including the title and subtitle.
+
+- `DialogFooter`: Renders the footer of the dialog, which can contain action buttons.
+
+- `DialogClose`: Renders a close button for the dialog.
+
+## Components Arguments
+
+### Dialog
+
+<CustomArgsTable of={Dialog} />
+
+### DialogContent
+
+<CustomArgsTable of={DialogContent} />
+
+### DialogHeader
+
+<CustomArgsTable of={DialogHeader} />
+
+### DialogFooter
+
+<CustomArgsTable of={DialogFooter} />
+
+### DialogClose
+
+<CustomArgsTable of={DialogClose} />
+
+{/* ## Dialog Story
+
+<Canvas of={DialogStories.Default}/> */}