46 lines
1.2 KiB
Markdown
46 lines
1.2 KiB
Markdown
# @fluentui/react-dialog
|
|
|
|
**React Dialog components for [Fluent UI React](https://react.fluentui.dev)**
|
|
|
|
To import React Dialog components:
|
|
|
|
```jsx
|
|
import * as React from 'react';
|
|
import {
|
|
Button,
|
|
Dialog,
|
|
DialogTrigger,
|
|
DialogSurface,
|
|
DialogTitle,
|
|
DialogBody,
|
|
DialogActions,
|
|
DialogContent,
|
|
} from '@fluentui/react-components';
|
|
|
|
export const DialogExample = () => {
|
|
return (
|
|
<Dialog>
|
|
<DialogTrigger>
|
|
<Button>Open dialog</Button>
|
|
</DialogTrigger>
|
|
<DialogSurface>
|
|
<DialogBody>
|
|
<DialogTitle>Dialog title</DialogTitle>
|
|
<DialogContent>
|
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam exercitationem cumque repellendus eaque
|
|
est dolor eius expedita nulla ullam? Tenetur reprehenderit aut voluptatum impedit voluptates in natus iure
|
|
cumque eaque?
|
|
</DialogContent>
|
|
<DialogActions>
|
|
<DialogTrigger>
|
|
<Button appearance="secondary">Close</Button>
|
|
</DialogTrigger>
|
|
<Button appearance="primary">Do Something</Button>
|
|
</DialogActions>
|
|
</DialogBody>
|
|
</DialogSurface>
|
|
</Dialog>
|
|
);
|
|
};
|
|
```
|