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:
Toggletips, similar to Tooltips, provide contextual support for users when needed. They are hidden by default, a UI trigger or text link are clicked to set them to their visible state. Toggletips, unlike tooltips, are persistent until a user takes action to dismiss them by clicking on the required “X” (close) trigger. Toggletips are capable of containing varying types of complex content including interactive components, buttons, and dropdowns.
Toggletips are able to house various types of content. Below is a potential list:
There are currently 2 themes available for the Toggletip.
This is the default theme, usually used in forms to show more information.
Tooltip with a red background.
function onClose() { // code to execute when the toggletip is closed } return ( <Toggletip content="Toggletip body" title="This is the title of the Toggletip" footer="Toggletip footer text" closeButton={true} onClose={onClose} > <IconButton name="question-circle" tooltip="IconButton containing a Toggletip" /> </Toggletip> );
Name | Description | Default |
---|---|---|
theme | The theme used to display the toggletip "info""error" | - |
title | The title to be displayed on the header stringElement | - |
closeButton | determine whether to show or not the close button * boolean | - |
onClose | Callback function to be called when the toggletip is closed (() => void) | - |
placement | The preferred placement of the toggletip "auto""bottom""top""right""left""bottom-start""bottom-end""top-start" | - |
content* | The text or component that houses the content of the toggleltip ToggletipContent | - |
footer | The text or component to be displayed on the toggletip's bottom stringElement | - |
children* | The UI control users interact with to display toggletips Element | - |
fitContent | Determine whether the toggletip should fit its content or not boolean | - |
show | Determine whether the toggletip should be shown or not boolean | - |
onOpen | Callback function to be called when the toggletip is opened (() => void) | - |