docs(dialog): add docs for using dialog in context menu or dropdown (#55)

This commit is contained in:
Yousef Alsayid
2023-02-08 12:18:43 -05:00
committed by GitHub
parent 06c9c54fa9
commit bfa28f782d

View File

@@ -57,3 +57,38 @@ import {
</DialogContent>
</Dialog>
```
## Notes
To activate the Dialog component from within a Context Menu or Dropdown Menu, you must encase the Context Menu or
Dropdown Menu component in the Dialog component. For more information, refer to the linked issue [here](https://github.com/radix-ui/primitives/issues/1836).
```tsx
<Dialog>
<ContextMenu>
<ContextMenuTrigger>Right click</ContextMenuTrigger>
<ContextMenuContent>
<ContextMenuItem>Open</ContextMenuItem>
<ContextMenuItem>Download</ContextMenuItem>
<DialogTrigger asChild>
<ContextMenuItem>
<span>Delete</span>
</ContextMenuItem>
</DialogTrigger>
</ContextMenuContent>
</ContextMenu>
<DialogContent>
<DialogHeader>
<DialogTitle>Are you sure absolutely sure?</DialogTitle>
<DialogDescription>
This action cannot be undone. Are you sure you want to permanently delete this file from our servers?
</DialogDescription>
</DialogHeader>
<DialogFooter>
<Button type="submit">
Confirm
</Button>
</DialogFooter>
</DialogContent>
</Dialog>
```