Reuse code

If you need to insert the same or similar code snippets many times, reuse them. This helps make your configuration shorter and makes it easier for you to edit duplicate chunks of code.

$ref to any snippet inside the configuration

You can insert a code snippet from another part of the configuration anywhere inside the configuration. To do this, use the structure { "$ref": "" }.

This is useful when you need to insert the same snippet at multiple places in your code. For example, if you need to run the same action using multiple buttons, put this action in a variable and call it using $ref.

View example in the sandbox

Tip. Store your reused code using variables in vars. Otherwise, you may need to change the path in the $ref property when you edit the configuration.

The path in the $ref structure starts from the root. Array elements start from zero. Example:

Note. Some components have properties with the type ref or something similar, like In such cases, that property is a pointer to a specific interface element.


The helper.transform component lets you convert one array into another. This is useful if you don't know the number of elements in the array, or the array is very big.