Skip to content

Add exit overlay button - #81981

Draft
coderGtm wants to merge 3 commits into
WordPress:trunkfrom
coderGtm:feat/exit-overlay-button
Draft

coderGtm wants to merge 3 commits into
WordPress:trunkfrom
coderGtm:feat/exit-overlay-button

Conversation

@coderGtm

Copy link
Copy Markdown
Contributor

What?

Closes #75210

Adds an "Exit original" button to the Document tab of the Settings sidebar when editing a template part in the isolated (overlay) editor, mirroring the "Edit original" button used to enter it.

Why?

There is currently no way to exit the isolated template part editor from the Settings sidebar. Users must use the "Back" button in the editor toolbar, which is easy to miss and inaccessible when the toolbar is not in view. This change provides a discoverable, sidebar-based way to return to the previous editing context, matching the existing "Edit original" entry affordance.

How?

Adds a new ExitTemplatePartPanel component in packages/editor/src/components/exit-template-part-panel. It:

  • Renders only when the current post type is wp_template_part (i.e. inside the isolated template part editor), and only when getEditorSettings().onNavigateToPreviousEntityRecord is available (it is provided by both edit-post and edit-site; it is undefined when there is no previous entity to return to, e.g. in the regular post editor).
  • Renders a secondary "Exit original" button that calls onNavigateToPreviousEntityRecord(), the same callback the "Edit original" flow uses to navigate back.
  • Is wired into the Document tab of the Settings sidebar, right after the template part content panel.
  • Ships with unit tests covering all render/no-render conditions and the click navigation, plus an e2e test for the exit flow in the site editor.

Testing Instructions

  1. Build the plugin from this branch and activate it on a WordPress install using a block theme (e.g. Twenty Twenty-Five).
  2. Go to Appearance → Editor (Site Editor) to edit the Home template ("Blog Home · Template").
  3. Click the Header template part in the canvas.
  4. Click Edit original in the block toolbar to enter the isolated template part editor (page header shows "Header · Template Part").
  5. Open the Settings sidebar (Settings button in the top bar). If the "Block" tab is shown, switch to the "Template Part" (Document) tab.
  6. Scroll down — below the "Content" section you should see the "Exit original" button.
  7. Click Exit original — you should return to the Home template editor ("Blog Home · Template").
  8. Negative checks — the button should not appear:
    • When editing a regular template (not inside a template part) in the Site Editor.
    • In the regular post/page editor (Edit Post).
    • In the Block tab of the sidebar while inside a template part.

Testing Instructions for Keyboard

  1. In the Site Editor, select the Header template part and press Enter to open its block toolbar.
  2. Tab to Edit original and press Enter to enter the isolated template part editor.
  3. Press Ctrl+Shift+Period (or the Settings keyboard shortcut) to open the Settings sidebar.
  4. Tab through the sidebar — the "Exit original" button is reachable, focusable, and activates with Enter/Space, returning to the template.

Screenshots or screencast

Before After

Use of AI Tools

This PR was developed with the assistance of AI tooling (opencode) for implementation and testing. All changes were reviewed by the author, including lint, formatting, and unit test verification.

@github-actions github-actions Bot added the [Package] Editor /packages/editor label Aug 24, 2026

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[Package] Editor /packages/editor

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add "Exit Overlay" button in sidebar for consistent overlay editor navigation

1 participant