Working with Inputs

Each component can be configured through it's properties panel. Click on the component in the canvas to bring up it's properties.


Working with Inputs

Nearly all the inputs on the properties panel support javascript expressions, you can use them to populate the input with dynamic values.

Inputs on the property panel accept both static text and dynamic linked values.

You can combine static and dynamic text to transform data from datasources on the fly!

Apart from plain Javascript expressions, you can also refer to various datasources from your project using dot notation.

You can fetch data from the following datasources.

  • Endpoints You can select any endpoint that you've created to power the input. You can also select any of sub properties of the output from the endpoint. Ex: {{endpoints.getStatistics.counts.numUsers}}
  • Components Similar to endpoints, you can also select another component's properties as an input. Ex: {{components.table.selectedRow}}
  • Variables In case one of your actions sets a variable, you can access it from other components. Ex: {{variables.numberItems}}
  • User You can access the current logged-in user's properties. You can refer to their name, or other properties stored in the user table. Ex: {{user.firstName}}

Helper Dropdown

When you click on an input, a dropdown appears showing various datasources to pull data from into this input. It also shows a preview of what the input finally evaluates to (after processing all dynamic values).


The dropdown also shows an error when the entered value does not match the type of the input (Ex. trying to pass simple text as the content for a table that accepts a list of items)

Did you find what you were looking for?
What went wrong?
Need more help?We have a thriving Discordcommunity that can help you with all things Canonic. →