Advanced tab

The Advanced tab provides configuration for visibility, looping, and component identification.

Visible

A toggle switch (default: On) that controls whether the component is rendered on the page. Turn it off to hide the component.

Loop

Configure the component to render multiple times based on a datasource.

If a property displays the Variable Binding icon , that means it supports variable binding.

Property	UI Control	Default	Description
Loop Data	Switch Setter (Json setter / Variable input)	-	Click to bind a data array that the component will iterate over. Use the Switch Setter to choose between JsonSetter (enter JSON directly) and Variable Input.
Loop Item	Text input	item	The variable name for the current item in each iteration.
Loop Index	Text input	index	The variable name for the current index in each iteration.
Loop Key	Switch Setter (String setter / Variable input)	-	A unique key field from the data to optimise rendering performance.

ID and Name

The ID and Name fields in the Advanced section of the Props tab uniquely identify the component element. Both are auto-generated from the component title: dots and spaces in the title are automatically replaced with underscores. You can override these values manually.

Render unique identifier (key)

A text input for setting the React key prop, which helps optimise re-rendering. Supports string setter and variable binding.

refId

An identifier that uniquely identifies this component instance in the component tree. You can edit this to override the auto-generated value.

Last updated on 20 May 2026