Show

Show takes an accessor in when. While it is truthy, the children render, otherwise the fallback.

Children as a function

A function in children receives the truthy value. It runs once per branch, untracked: the branch is built again only when the truthy value changes, such as another object or falsy to truthy. Bind signals read inside it with ${() => ...} as usual.

As a tag

html`
  <${Show} when=${() => this.open.value}>
    <p>Now you see me</p>
  </${Show}>
`

A node child is moved in and out, not rebuilt, so it keeps its listeners and bindings.