Skip to main content
DetailPanel displays a single record from a schema table. This page explains the props, how the record is resolved from the URL, and how edit mode interacts with user permissions. By default it renders in read mode; set editable: true to expose an edit toggle that lets users update field values in place. The record is resolved from a URL path parameter, which makes DetailPanel the natural destination for a row click in a Table block — Table navigates to /<resource>/<id> and DetailPanel reads the record at that path.

​
Example

detail-panel.json
{
  "block": "DetailPanel",
  "props": {
    "schema_table": "customers",
    "record_id_param": "id",
    "fields": ["name", "email", "status", "notes"],
    "editable": true
  }
}

​
Props

​
How it binds to data

The block reads record_id_param from the current URL. On a page mounted with a parameterized segment for the record id, setting record_id_param: "id" tells the runtime to look up the record whose primary key matches that segment. The lookup uses runQuery with a single-row filter.
The exact URL routing syntax (/customers/:id vs /customers/[id]) is not enumerated in the source. Verify against the Builder MCP routing schema or packages/loom-types/ before shipping production routing.

​
Edit mode and permissions

When editable is true, users see a toggle that switches the panel from read mode to an editable form. The source describes edit access as “toggled by user permissions” — the precise model is gated by authUser roles and schema-level grants, but the full configuration shape is not enumerated in the source.
Edit access is gated by user permissions. The exact roles or grants involved are not enumerated here — check the authUser capability reference and your workspace schema grants.

​
Patterns

​
Common props

In addition to the DetailPanel-specific props, every block accepts id, class_overrides, visible_if, and analytics_event. See common props on the PageBlocks overview.

​
Where to go next