Side panel

Show/Hide content without a modal screen

A side panel is a special container that slides in from the right hand side when opened.

You can put any components or blocks that you wish inside a side panel, however it is particularly well suited to form entry.

Side panel with nested form block

Side panel with nested form block

App preview of a side panel

App preview of a side panel

Opening a side panel

Side panels are opened via the Open Side Panel Action. This could be triggered from a button click, or some other event such as on change.

You can choose to open any side panel that is anywhere in the screen component tree.

Closing a side panel

A side panel can be closed by a user simply clicking an area outside of the panel, or by clicking the close arrow.

Close side panel

Close side panel

Alternatively, the Close Side Panel action can be used.

No screen needs to be selected as this action will automatically close any currently open side panel.

👍

Table block

The Table block supports built-in side panels for quickly viewing row detail or creating new entries.