Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ElementEditor-powered Live Preview #15112

Merged

Conversation

brandonkelly
Copy link
Member

@brandonkelly brandonkelly commented May 31, 2024

Description

Refactors Live Preview to create its own dedicated ElementEditor instance, embedded within the editor pane (similar to element editor slideouts).

By doing that, Live Preview gains feature parity with element editor slideouts:

  • tabs
  • UI elements
  • tab/field conditions
  • dedicated Save button

The parent editor is kept up-to-date with the LP editor’s state, and its content fields are refreshed to get the latest values when LP is closed (if anything changed).

Live Preview, with two content tabs and a Save button in the editor footer

Related issues

Copy link

linear bot commented May 31, 2024

@thupsi
Copy link

thupsi commented May 31, 2024

Yes!!! 🥳

Copy link
Contributor

@brianjhanson brianjhanson left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🎉 I pushed a few little changes directly to the branch, so if you mess with anymore just make sure to pull.

  • Updated to logical properties
  • Ensure the tab menu button shows/hides on resize
  • Fixed some random JS errors I ran into while testing. They may not be totally related to these changes, but figured they were worth fixing either way.

- No longer dependent on a parent ElementEditor instance
- No longer reloaded when reopened, if nothing changed in the main form
- Faster initial load
- Save button
…eview

# Conflicts:
#	src/web/assets/cp/dist/cp.js
#	src/web/assets/cp/dist/cp.js.map
#	src/web/assets/cp/dist/css/cp.css
#	src/web/assets/cp/dist/css/cp.css.map
#	src/web/assets/cp/src/js/ElementEditor.js
[ci skip]
@brandonkelly brandonkelly merged commit 5b901b5 into 5.2 Jun 3, 2024
@brandonkelly brandonkelly deleted the feature/cms-704-elementeditor-powered-live-preview branch June 3, 2024 17:19
@mmikkel
Copy link
Contributor

mmikkel commented Jun 7, 2024

I've spent some time with the revamped live preview now, and just wanted to say that I love it - it's how I always wanted LP to work and it's going to make a huge difference in AX for authors, especially when editing more complex field layouts. Nice work 👏

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants