@foldkit/ui Animation: content passed through h.submodel cannot contain parent event handlers #1629

Animation.ViewInputs.content is a plain Html value. When that content contains an element with a parent event handler, h.submodel throws at render time:

Foldkit: h.submodel `viewInputs` may only contain functions at the top level. Found a function at `viewInputs.content.children.[1].data.on.click`. Lift it to the top level of `viewInputs` so it can be auto-scoped to the parent boundary, or pass the value as primitive data.

The Animation page says to use Animation directly when your own content needs the same lifecycle, but there is no supported way to animate content that contains a button, link, or input bound to a parent Message. Dialog (toView) and Disclosure (toView with animatePanel) avoid this because they build their content inside a top-level callback, which h.submodel scopes to the parent boundary.

Reproduction

h.submodel({
  slotId: detailAnimation.id,
  model: detailAnimation,
  view: Animation.view,
  viewInputs: {
    animateSize: true,
    content: h.div([], [
      h.p([], ['The details could not be loaded.']),
      h.button([h.OnClick(Message.ClickedRetry())], ['Retry']),
    ]),
  },
  toParentMessage: message => Message.GotDetailAnimationMessage({ message }),
})

Possible directions

• Add a top-level callback to Animation.ViewInputs, such as toContent: () => Html, which h.submodel already scopes to the parent boundary.
• Until then, document on the Animation page that content cannot contain event handlers.

I hit this while building an expandable table row whose detail panel has a Retry button. The current workaround renders the button outside the animated wrapper, so it disappears instantly on collapse instead of animating with the panel.