Props panel in preview UI

[craigfrancies]

Goals

• Allow developers to view the props passed to the email preview
• (Nice to have) Allow live editing of those props to quickly test different inputs

Background

At the moment, there's no way to see what props are being passed to the previewed email via the preview tool.

Being able to view the props would be helpful when checking the preview. Editing them would make it faster to test things like names, codes, or other dynamic values - without needing to jump into the editor, for now code users.

There are some similar ideas in tools like Storybook, which allow real-time prop changes via controls.

Proposal

A simple side panel in the preview UI that:

• Shows the current props
• (Optional) Allows editing them inline or via a JSON view
• Updates the preview live on change

Here’s a quick mockup of what I was thinking it would look like:

I'd be happy to help with UI design and might be able to contribute on the frontend side if the idea is accepted.