#3486785 Adding preview functionality
Closes #3486785
-
Implement Preview button in top bar -
In Preview mode show the current preview without the overlay -
Updated Hero component to have a hover state on buttons and a href so that it can be used for testing interactivity -
Render a new, minimal, top bar when in preview mode -
In preview mode, intercept all links and show a dialog instead. -
Swap Page data and Settings in left bar -
Settings tab is unavailable when there is no selected component -
Leverage Router to access the preview via /preview route and then control preview width with a /:width param. -
Move editor to /editor route -
Separate states to handle "disable overlay" and "show preview" so that, in future, we can disable the overlay via a keyboard shortcut -
I've actually added a "hidden" keyboard short cut ("v") that when held will disable the overlay and allow access to the iFrame. I'm leaving it in, even though it's buggy, because it's useful as a developer to have an easy way to inspect elements in the preview iFrame. It can be polished/developed further in a later MR. -
Tests for Preview mode
Edited by Jesse Baker