Token Syntax
Tokens use {{ }} double-brace syntax — the same pattern familiar from template engines like Handlebars and Jinja. They can appear anywhere inside a string or as the full value of a config property.
Basic Syntax Forms
// 1. Full property replacement — property is entirely a token
"dataSource": "GetLeadById"
"params": { "id": "{{ route.id }}" } // id param = the route id
// 2. Inline in a string — token embedded in text
"title": "Lead: {{ route.id }}" // "Lead: lead-123"
"content": "Welcome, {{ context.name }}!"
// 3. Boolean expression — resolves to true/false
"visibilityExpression": "{{ context.roles.includes('admin') }}"
// 4. Numeric expression
"pageSize": "{{ variables.pageSize || 20 }}" // variable with fallback
// 5. Chained access
"title": "{{ route.id }} — {{ context.tenantId }}"
// 6. Conditional expression
"label": "{{ variables.isEditing ? 'Save' : 'Edit' }}"
Expression Language
The token resolver supports a subset of JavaScript expressions:
| Operator / Feature | Example |
|---|---|
| Property access | {{ context.userId }} |
| Array method | {{ context.roles.includes('admin') }} |
| Ternary | {{ variables.count > 0 ? variables.count : 'None' }} |
| Nullish coalescing | {{ variables.name ?? 'Unnamed' }} |
| String concat | {{ route.id + '-detail' }} |
| Comparison | {{ variables.status === 'active' }} |
| Logical | {{ variables.a && variables.b }} |
What Is NOT Supported
- Function declarations or
functionkeyword awaitor async expressions- Loops (
for,while) - Variable assignment (
variables.x = 5does not work in a token — use Set Variable action) - Network calls (
fetch,XMLHttpRequest) - Access to globals like
window,document,localStorage
All token expressions are evaluated and their result is placed into the config property. If the property expects a number and the token resolves to a string "20", App Studio attempts type coercion. However, if the result is undefined (e.g., a variable is not declared), the property falls back to the widget definition's default value.
Autocomplete in the Properties Editor
When you click the "T" token mode button on a property field and start typing {{, the Properties Editor shows autocomplete suggestions for all available token paths based on the current app state:
- All declared app variables (
variables.*) - All route parameters of the current AppPage (
route.*) - All context tokens (
context.*) - All widgets with accessible state (
widget.*)