Simple form causes infinite spinner?

I’m trying to use styled forms by using the html template. This is a vastly simplified example, but it just spins on a cell that tries to print the form. How do I get the input values from a form like this?

I think I get it, though I’d argue it’s pretty non-intuitive. I was just doing:

viewof form = html<form>${input}</form> and then putting “form” in a cell. I don’t know why it breaks, but it does. If I use Input.form it’s better, though I lose some flexibility in terms of iterating over all inputs to the form (for localstorage persistence)

Here is the local storage form wrapper:

A couple links that might help:

I think it’s roughly like: when you declare a cell with viewof, it treats the cell as an asynchronous generator that yields each time the cell emits an “input” event. The form element doesn’t natively do that when you type in one its elements, which is why we have the Inputs.form wrapper.

If you just have:

viewof form = html`<form>${input}</form>`
form

…then form is a promise that never resolves, because it’s waiting for that input event to yield.