Card

A bordered container with an optional title. Cards provide a visual grouping for related content with a built-in styled border, padding, and optional header.

Properties

Property	Type	Default	Description
title	text	''	Optional title displayed at the top of the card. Supports expressions. Leave empty for no title.

Events

• onClick -- Fires when the card is clicked. Attach an action to make the card interactive.

Container

This widget is a container -- you can drag other widgets inside it.

Example

A product card inside a Repeater:

Title: `{ {row.product_name}}`

With child widgets inside:

• Image -- src: { {row.image_url}}
• Text -- content: { {row.description}}
• Text -- content: ${ {row.price}}
• Button -- label: Add to Cart

Tips

• The Card comes with default padding, border, and border-radius. Customize these via the Design tab.
• Use expressions in the title to make it dynamic: { {row.name}} - { {row.status}}.
• Leave title empty if you want a plain bordered container without a header.
• Cards work well inside Repeaters and Listing Grids to display each data row as a visual card.
• Add hover styles (via element states in the Design tab) for interactive cards.