FIG-001/ INTERACTION

click to expand.

Toggle label-click expansion and watch beforeExpandChange veto decisions stream into a live event log.

  • clickToExpandNode makes the whole field label a toggle, not just the disclosure arrow.
  • beforeExpandChange runs before every expand or collapse and can veto the change — return false to keep a node as-is.
  • Each decision streams into a live event log so you can see exactly which node fired and whether it was allowed.
↩ all examples
prop · clickToExpandNodehook · beforeExpandChange mode · live running source
veto
{
    request:{
      id:"req_01HX…",
      method:"POST",
      headers:{
        content-type:"application/json",
        x-trace-id:"t-9913"
      },
      body:{
        email:"ada@example.com",
        plan:"pro"
      }
    },
    response:{
      status:201,
      headers:{
        cache-control:"no-store"
      },
      body:{
        id:42,
        createdAt:"2026-04-20T12:00:00Z"
      }
    },
    timing:{
      dnsMs:4,
      tlsMs:18,
      ttfbMs:84
    }
}
category · interaction
sheet · sheet 01 / 01
⟳ to re-run

Click to Expand