Collapse Menu

Collapse menus are typically used for navigation to different pages or sections.

A collapse menu contains 3 parts:

1. Title container

2. Arrow icon to collapse and expand the menu (on the right)

3. Menu content

You can customize all three parts. For example, in menu content, you can add a Clickable with Text inside, and set an interaction on the clickable to navigate to a different page.

Properties

Group ID: If you have multiple collapse menus, group them together by Group ID. To group elements, give them the same ID.

Single Collapse: If you have grouped collapsed menus by Group ID, turning on Single Collapse ensures that only one collapse menu will be open at a time.

Default Expand: When on, the collapse menu will be expanded by default.

See Tooltip for tooltip configurations.

Supported Events

Toggle menu: Triggered when user toggles the menu arrow.

Supported Actions

Set Data: Change element data. See Data Store.

Set Loading: Set loading animation. See Set loading animations.

Visit Interactions for more on events and actions.