Igloo branding


A disclosure is a widget that toggles the visibility of content by clicking a button.


To install @igloo-ui/disclosure in your project, you will need to run the following command using npm:

npm install @igloo-ui/disclosure

If you prefer Yarn, use the following command instead:

yarn add @igloo-ui/disclosure


Then to use the component in your code just import it!

import Substract from '@igloo-ui/icons/dist/Substract';

import Disclosure from '@igloo-ui/disclosure';

  icon={<Substract size="large" />}
  description="0.8pt in the last 30 days"
  <div style={{ background: '#F7F9FA', padding: '2.4rem' }}>
    Our organization values diversity.


childrenReactNodeThe component content to display when expanding
classNamestringAdd a specific class to the disclosure
dataTeststringAdd a data-test tag for automated tests
defaultExpandedbooleanWhether or not the disclosure is expanded by default (uncontrolled)
descriptionReactNodeThe description of the disclosure
iconReactNodeAn icon to show as the first element in disclosure
isExpandedbooleanWhether or not the disclosure is expanded (controlled)
isLowContrastbooleanTrue for a light appearance (no shadow, icon or border)
onClose() => voidCallback when the disclosure is closed
onOpen() => voidCallback when the disclosure is opened
titlestringThe title of the disclosure