T4012: Signal will not unwrap

Cause

A signal is nested inside an object, and templates only unwrap top-level signals. {s.count} would show the signal itself, not its value.

Example

<contract>
{ "name": "Card", "role": "group", "parts": ["root"] }
</contract>
<script>
const s = { count: state(0) }
</script>
<template><div class="root">{s.count}</div></template>

What you see

ERROR  T4012  app/components/Card.tess:7:30
  Signal "s.count" is nested inside an object and will not unwrap in the template. Destructure it to a top-level binding or read .value.
  Run `tessera explain T4012` for details.

Fix

Destructure it to a top-level binding, or read .value in the script.

All errors and warnings