Basic BlocksThe basic blocks are a collection of blocks you most likely will use often to present content to your users. These blocks will allow you to add text, buttons, and links to your app. Your users can then trigger workflows and navigate throughout your app more easily.
null
Text
Text blocks will be widely used in your app wherever you want to present written content to your users. They are simple to use but can become powerful when you utilize the dynamic data editor. You can insert regular static text into the content property or you can take it to the next level and click the little + icon to add a dynamic data slot. This allows you to reference text from any source on your page or database connections. In the example above we have connected the text block to the current value of input.
Text
Properties reference
Prop Name
Type
Default
  • Initial Value
    Text
    -
  • Placeholder
    Text
    “Enter some text…”
  • Format
    “Text” | “Email” | “Password” | “Phone” | “Search” | “URL” | “Hidden”
    Text
Button
The button block is used for triggering workflows in your app. You have the option of adding an icon as well to help your users understand it’s function. A type like “submit” can be assigned to buttons placed inside forms which will submit the form when clicked.
Properties reference
Prop Name
Type
Default
  • Type
    Data Types
    Empty
  • Data
    Data Selector
    Unset
Image
Image blocks display an image uploaded through the media library, additionally you can connect the image block up to a dynamic data source for example if you want to display a list of products. The largest image that can be uploaded through the media library is 6mb.
Properties reference
Prop Name
Type
Default
  • Image
    URL
    -
  • Description
    Text
    -
  • Is Critical?
    Boolean
    False
Icon
The icon block allows you to give your users non-text context to features in your app. You can choose between any of the icons in the react-icons package. The size and color of the icon can easily be changed by adjusting the font-size and color under the typography section of design props.
External Link
The external link can be used as a hyperlink that points to a webpage or resource outside of the current website or domain. External links can be particularly valuable to your users when used to provide authoritative sources that give context and build trust. The external link block is a container you can place blocks inside, the target area is anywhere inside the link container.
Properties reference
Prop Name
Type
Default
  • Link
    Text
    -
  • Open in new tab
    Boolean
    -
Internal Link
On the other hand, an internal link points to another page within the same website or domain. The primary benefit of using internal links is that the page the link points to starts loading as soon as a user hovers over the link, resulting in instantaneous page changes. Additionally, internal links are always synced, even if you decide to rename the path or change the domain of your app.
Properties reference
Prop Name
Type
Default
  • Link
    Page Selector
    Index
  • Query Params
    Query Object
    -
  • Open in new tab
    Boolean
    -