Skip to content

Commit cfce0c3

Browse files
authored
Merge pull request #7344 from umbraco/v16/cms/ufm-expressions
UFM Expressions
2 parents cc8854c + f4a3824 commit cfce0c3

File tree

1 file changed

+35
-1
lines changed

1 file changed

+35
-1
lines changed

16/umbraco-cms/reference/umbraco-flavored-markdown.md

Lines changed: 35 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ The curly brackets indicate that the UFM syntax should be processed. The `umbVal
3737

3838
With this example, the syntax `{umbValue: bodyText}` would be processed and rendered as the following markup:
3939

40-
```js
40+
```javascript
4141
<ufm-label-value alias="bodyText"></ufm-label-value>
4242
```
4343

@@ -68,6 +68,40 @@ The following UFM filters are available to use.
6868
| Uppercase | `uppercase` | `{umbValue: headline \| uppercase}` |
6969
| Word Limit | `word-limit` | `{umbValue: intro \| word-limit:15}` |
7070

71+
72+
## UFM Expressions (JavaScript-like syntax)
73+
74+
UFM can also support JavaScript-like expressions to allow for basic logic within label templates and descriptions. This is especially useful for advanced label rendering, fallback values, and dynamic formatting without developing your own custom UFM components or filters.
75+
76+
### Syntax
77+
78+
Expressions are defined using the `${ ... }` syntax. This is different to the syntax outlined above. You can use standard JavaScript operators, function calls, and property access.
79+
80+
**Examples:**
81+
82+
```markdown
83+
${ propertyAlias } // Renders a literal value
84+
${ propertyAlias.length } // Property drilling
85+
${ propertyAlias.length > 0 ? "Yes" : "No" } // Conditionals
86+
${ propertyAlias | uppercase } // Piped filters, as detailed above
87+
${ propertyAlias.toUpperCase() } // Native JavaScript functions
88+
${ 1 + 2 } // Expression evaluation/calculation; renders "3"
89+
```
90+
91+
Expressions can reference property aliases, perform calculations, concatenate strings, and more.
92+
93+
### Supported operations
94+
95+
- Arithmetic (`+`, `-`, `*`, `/`)
96+
- Logical (`&&`, `||`, `!`)
97+
- Conditional (`? :`)
98+
- Function calls (limited to safe native/built-in functions like `toUpperCase()`, `toLowerCase()`, etc.)
99+
- Property access (`myProperty.length`)
100+
101+
### Sandboxed evaluation
102+
103+
All expressions are evaluated in a sandbox. Only safe operations and methods are allowed. Access to global objects, external APIs, or unsafe functions will be blocked. To extend expressions with your own functions, it is recommended to use the piped UFM Filter syntax.
104+
71105
## UFM components
72106

73107
### Available UFM components

0 commit comments

Comments
 (0)