Function Editor
Introduction
In Wized all dynamic fields are powered by functions. A dynamic field is any field that can change based on user input or other factors. For example, the following fields are dynamic:
- The text of an element that is populated from an API response.
- The visibility of an element that is based on a user's input.
- The body of a request that is populated from the user's selections.
What's a Function?
A function is a piece of code that takes some input and returns some output. For example, the following function takes a number parameter as input and returns the number multiplied by 2:
(number) => {
return number * 2;
};In the case of Wized all dynamic fields are powered by a function that takes predefined parameters and expects an output. For example, the following function is used to dynamically populate the user's name in a text element:
(c, f, i, n, r, v, e, t) => {
return r.load_user.data.name;
};The Function Field
Function fields look like this in the configuration panels: 
When clicking on a function field box, the Function Editor panel will open providing you a full code editor experience: 
Autocompletion
The Function Editor provides autocompletion for all parameters. This means that when you start typing a parameter, a list of available values will be shown. For example, when typing v. a list with all available variables will be shown:
If you want to manually open the autocompletion list, you can press Ctrl + Space on your keyboard.
Keyboard Shortcuts
The Function Editor uses VS Code's editor under the hood, which provides a lot of useful keyboard shortcuts. Here are some of the most useful ones:
| Shortcut | Description |
|---|---|
Ctrl + X | Cut line (empty selection) |
Ctrl + C | Copy line (empty selection) |
Alt + ↑ / ↓ | Move line up/down |
Shift + Alt + ↓ / ↑ | Copy line up/down |
Ctrl + Shift + K | Delete line |
Ctrl + Enter | Insert line below |
Ctrl + Shift + Enter | Insert line above |
Ctrl + Shift + \ | Jump to matching bracket |
Ctrl + ] / [ | Indent/outdent line |
Home / End | Go to beginning/end of line |
Ctrl + Home | Go to beginning of file |
Ctrl + End | Go to end of file |
Ctrl + ↑ / ↓ | Scroll line up/down |
Alt + PgUp / PgDn | Scroll page up/down |
Ctrl + G | Go to Line... |
Ctrl + F | Find |
Ctrl + H | Replace |
Ctrl + D | Add selection to next find |
Alt + Click | Insert additional cursor |
Ctrl + U | Undo last cursor operation |
F2 | Rename variable |