The Panel component allows you to group other components for better display management.

A typical use case for a panel is to use it like a column, with several other components grouped together next to a large component, such as an image. Without the panel, the other components can become misaligned. For example, the first component would be aligned with the large image component, but the other components would be placed below the image, regardless of their width. Panels give you more control over your form display.

Attributes: General

Attribute Description
ID The unique ID of the component.
Label The label of the component.
Store panel data into single variable The binding for the component. Use an expression to bind the component to its value and specify where the value is saved. For example, use {{myVariableName}} to store the value of the component in a variable named myVariableName. Use prefixes to define the scope of the value, for example, root. for referencing the root case to store the value in or parent. to store the value in the parent work item of the current one. For example, {{}} stores the value in the root case using a variable named foo.
Ignored Determines if the component should be hidden and the value excluded from any payload.
Visible Determines whether the component is visible or hidden. You can also use this expression to only show or hide the component based on another component. For example, if this component is bound to a checkbox component, you can use this expression to show or hide this component based on the checkbox selection made by the user. This is enabled by default.
Enabled Determines whether the component is enabled or disabled. This is enabled by default.

Attributes: Details

Attribute Description
Collapsible Determines whether you can collapse or expand the component.

Enabling this option adds a + / - icon in the upper-right corner of the panel.

Initially collapsed Determines whether the component is initially collapsed on the form.