Disclosure
Disclosures are expandable areas of content that are summarized or otherwise labeled to indicate what they relate to. There is a trigger that must be manually selected which allows the user to show and hide the additional content that is available.
Design
Section titled “ Design” In Practice
Section titled “ In Practice”The Disclosure component simplifies the user experience by revealing interfaces upon request. It combines inline and block layout components to improve readability, allowing users to easily scan and comprehend the content for a better overall experience.
- Disclosures have two main parts:
- The trigger that opens and closes the related content.
- The container that displays the disclosed content.
- The disclosed content may include interactive elements.
- Disclosures are collapsed by default. However, the default state can be changed if needed.
- More than one disclosure item can be expanded at one time.
Accessibility
Section titled “ Accessibility”- Disclosure triggers are keyboard operable.
- The Disclosure is a native browser control and does not require additional JS.
- For more information, see our accessibility guidelines.