Skip to main content
A Playground Definition is a JSON object mapping heavily to the Workflow Definition structure, but it is explicitly designed to define customizable, interactive application layouts rather than invisible backend processes.

High-Level Structure

Every Playground Definition uses the following JSON signature:
{
  "type": "playground_definition",
  "version": "1.0.1",
  "components": [
    // Array of UI Widget Objects
  ],
  "connections": [
    // Array of Interactive Connections
  ]
}

Top-Level Properties

PropertyTypeDescription
typestringConstant identifier. Must be exactly "playground_definition".
versionstringSchema version. Currently "1.0.1".
componentsarrayA list of distinct interactive UI instances to render (e.g., chat boxes, charts).
connectionsarrayA list of connections describing interaction pathways between widgets or external resources.

Playground Widgets (Components)

Just like Workflow Components, Playground widgets rely on interfaces to define their behavior. However, they generally pertain to user-facing interactions.
{
  "id": "302e66bc-8b8b-4d49-a88d-500f8c422f8d",
  "category": "widget",
  "type": "widget.tradingview",
  "name": "TradingView Chart",
  "ports": [
    {
      "category": "data_input",
      "route": "message",
      "value": {
        "type": "component_alias",
        "alias": "ticker_viz_AAPL_1m"
      }
    },
    {
      "category": "data_input",
      "route": "width",
      "value": {
        "type": "integer",
        "integer": 700
      }
    },
    {
      "category": "data_input",
      "route": "height",
      "value": {
        "type": "integer",
        "integer": 500
      }
    }
  ],
  "position": {
    "x": -3341.5386043389353,
    "y": -1843.5798926414566
  }
}
Notice the inclusion of dimension details directly within layout positioning to inform the rendering engine on space allocation.