Realm allowed you to write custom flow business logic in JavaScript, you can write it in the <script type="module/realm"> tag, it’s similar to the <script type="module"> tag, but it’s only allowed to be used inside flow tag.
The script tag will be added to the runtime once the custom element is mounted, and will be executed once the flow is triggered.
It’s top level await, so you can use await keyword inside the script tag.
Comma separated list of variables that can be used inside the script tag (see below).
The state of current element, it's an object function that has `get` and `set` method.
Similar to `localState`, but it's global.
The current element instance.
The current element's attribute. It's an object function that has `get` and `set` method.
The current element's attribute list in key-value pair.
It's a utility to get the element by its `ref` attribute value.
Similar to `ref` but it will return an array of elements.
It's an object that contains the event's data. It depends on the event type. If the flow is triggering an element, then the event will be the element's event (see the event below).
The event object will be the element's event, it's an object function that has `preventDefault` method.
If it's sent by <send-event> then the event object will be the value of the event.
If the script tag is inside <listen-event attrchanged> then the event object will be the attribute's name that changed. It will returning `[attribute name, new value, old value]`
If the script tag is inside <listen-event statechanged> then the event object will be the state's name that changed. It will returning `[state name, new value, old value, is global state]`
See how to use script tag on Custom Flow Script page.