Sorry, but you either have no stories or none are selected somehow.
If the problem persists, check the browser console, or the terminal you've run Storybook from.
The component failed to render properly, likely due to a configuration issue in Storybook. Here are some common causes and how you can address them:
Generic Modal component.
Example usage:
<Modal title="title" isOpen={true}> <div>Some body</div> <Modal.ButtonRow> <Button variant="secondary" fill="outline"> Cancel </Button> <Button>Save</Button> </Modal.ButtonRow> </Modal>
For buttons at the bottom of the modal you should always use:
Name | Description | Default | ||
---|---|---|---|---|
icon | "play""google""microsoft""github""gitlab""okta""discord""hipchat"
| - | ||
iconTooltip | string
| - | ||
title* | Title for the modal or custom header element stringElement | - | ||
className | string | - | ||
contentClassName | string | - | ||
closeOnEscape | boolean | - | ||
closeOnBackdropClick | boolean | - | ||
trapFocus | boolean | - | ||
isOpen | boolean | - | ||
onDismiss | (() => void) | - | ||
onClickBackdrop | If not set will call onDismiss if that is set. (() => void) | - |
Custom header element with tabs
Name | Description | Default |
---|---|---|
icon* | "play""google""microsoft""github""gitlab""okta""discord""hipchat" | - |
title* | string | - |
tabs* | ModalTab[] | - |
activeTab* | string | - |
onChangeTab* | (tab: ModalTab) => void | - |