Skip to content

#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

Merge request reports

Loading