1.7 KiB
1.7 KiB
ModalDialog
ModalDialog is used for displaying modal dialogs
Usage
import ModalDialog from "@appserver/components/modal-dialog";
<ModalDialog visible={false} scale={false} displayType="auto" zIndex={310}>
<ModalDialog.Header>"Change password"</ModalDialog.Header>
<ModalDialog.Body>
<div>
Send the password change instruction to the{" "}
<a href="mailto:asc@story.book">asc@story.book</a> email address
</div>
</ModalDialog.Body>
<ModalDialog.Footer>
<Button
label="Send"
size="big"
primary={true}
onClick={() => alert("It's works!")}
/>
</ModalDialog.Footer>
</ModalDialog>
Properties
Props | Type | Required | Values | Default | Description |
---|---|---|---|---|---|
visible |
bool |
- | - | - | Display dialog or not |
displayType |
oneOf |
- | auto , modal , aside |
auto |
Display type |
scale |
bool |
- | - | - | Indicates the side panel has scale |
onClose |
func |
- | - | - | Will be triggered when a close button is clicked |
zIndex |
number |
- | - | 310 |
CSS z-index |
bodyPadding |
string |
- | - | 16px 0 |
CSS padding props for body section |