Problem
The Screen node config (title / description / fields / object-form — expanded in #1927) is authored blind: there's no way to see what the screen will look like to the end user. The Debug simulator, when paused at a screen, shows only paused — it doesn't render the form. Screen flows are user-facing wizards, so designing a form without seeing it is error-prone (field order, labels, types, object-form layout).
Proposal
A live preview that renders the screen as the end user would see it — title, description, the input fields (or the full object-form when objectName is set). Surface it in the node config panel and/or in the Debug simulator when paused at a screen. Reuse the runtime ScreenSpec renderer (and plugin-form/ObjectForm for object-form mode) so the preview matches runtime exactly.
Acceptance criteria
Pointers
- The flow-runner renders the
ScreenSpec at runtime (the engine's screen executor emits it) — reuse that renderer.
inspectors/flow-node-config.ts — screen config group.
plugin-form ObjectForm for object-form mode.
previews/FlowSimulatorPanel.tsx — the paused-at-screen state where a preview would also fit.
Problem
The Screen node config (title / description / fields / object-form — expanded in #1927) is authored blind: there's no way to see what the screen will look like to the end user. The Debug simulator, when paused at a screen, shows only
paused— it doesn't render the form. Screen flows are user-facing wizards, so designing a form without seeing it is error-prone (field order, labels, types, object-form layout).Proposal
A live preview that renders the screen as the end user would see it — title, description, the input
fields(or the full object-form whenobjectNameis set). Surface it in the node config panel and/or in the Debug simulator when paused at a screen. Reuse the runtimeScreenSpecrenderer (andplugin-form/ObjectFormfor object-form mode) so the preview matches runtime exactly.Acceptance criteria
title,description(with{var}interpolation),fields, and object-form mode (objectName/defaults).Pointers
ScreenSpecat runtime (the engine'sscreenexecutor emits it) — reuse that renderer.inspectors/flow-node-config.ts—screenconfig group.plugin-formObjectFormfor object-form mode.previews/FlowSimulatorPanel.tsx— the paused-at-screen state where a preview would also fit.