CollapsibleInlay

Type: React component

A CollapsibleInlay creates a white background with a border around it. This can be used to group certain components visually. For example when designing a form, an Inlay can be used inside a FormRow to group certain fields of the form together visually.

Additionally a CollapsibleInlay allows the user to collapse content of the inlay by clicking its header, showing an animation while collapsing or expanding. If collapsing the Inlay isn't needed, you can use a regular Inlay instead of a CollapsibleInlay.

Props

  1. children

    (Required)

    Type: ReactNode

  2. flex

    (Optional)

    Type: FDS~Flex

    Default value

  3. headerContent

    (Optional)

    Type: React node

    The content to render in the header.

    Default value

  4. isCollapsed

    (Required)

    Type: Boolean

    Whether or not the inlay is currently collapsed.

  5. onChange

    (Required)

  6. spaceVerticalSize

    (Optional)

    Default value