Proof of Concept: Improve Block Toolbar Semantics/Accessibility#53779

Closed

jeryj wants to merge 25 commits intotrunkfrom refactor/block-toolbar-portal

+769-388

Commits on Sep 6, 2023

Move Selected Block Tools into the header toolbar in the DOM but preserve all visual interactions
jeryj
committed
Render selected block toolbar as a fill within a slot in the header toolbar
jeryj
committed
Pass isFixed to ContextualToolbar for styling
jeryj
committed
Add block popover to edit site header slot
jeryj
committed
poc: adjust styles for top toolbar in happy path on desktop and tablet
jeryj
committed
Use SCSS variables for calculating top toolbar height
jeryj
committed
Remove unnecessary z-index
jeryj
committed
Show the toolbar as fixed when on tablet breakpoint even if using popover setting
jeryj
committed
Add classname to selected block tools slot and use bubblesVirtually
jeryj
committed
POC: Remove calculated width from toolbar
jeryj
committed
Move lastFocus into redux store
jeryj
committed
Register global shortcut for moving focus back to the last focused block.
jeryj
committed
Start on escape to return to block selection
jeryj
committed
Add move focus to selected block global shortcut to site editor
jeryj
committed
Rename editor focus-editor shortcut
jeryj
committed
Handle Escape on Toolbar Option 1: Add event listeners to all children via onChildrenKeyDown passed to NavigableToolbar
jeryj
committed
Handle Escape on Toolbar Option 2: Use addEventListener on the selectedblock toolbar, attached to the NavigableToolbar
jeryj
committed
Handle Escape on Toolbar Option 3: Remove bubblesVirtually from block-controls slot
jeryj
committed
POC: DON'T MERGE THIS. Allow tab keypress formatting in rich text fields in editor.
jeryj
committed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Proof of Concept: Improve Block Toolbar Semantics/Accessibility#53779

Commits on Sep 6, 2023

Move Selected Block Tools into the header toolbar in the DOM but preserve all visual interactions

Render selected block toolbar as a fill within a slot in the header toolbar

Pass isFixed to ContextualToolbar for styling

Add block popover to edit site header slot

poc: adjust styles for top toolbar in happy path on desktop and tablet

Use SCSS variables for calculating top toolbar height

Remove unnecessary z-index

Show the toolbar as fixed when on tablet breakpoint even if using popover setting

Add classname to selected block tools slot and use bubblesVirtually

POC: Remove calculated width from toolbar

Move lastFocus into redux store

Register global shortcut for moving focus back to the last focused block.

Start on escape to return to block selection

Add move focus to selected block global shortcut to site editor

Rename editor focus-editor shortcut

Handle Escape on Toolbar Option 1: Add event listeners to all children via onChildrenKeyDown passed to NavigableToolbar

Handle Escape on Toolbar Option 2: Use addEventListener on the selectedblock toolbar, attached to the NavigableToolbar

Handle Escape on Toolbar Option 3: Remove bubblesVirtually from block-controls slot

POC: DON'T MERGE THIS. Allow tab keypress formatting in rich text fields in editor.

Commits on Sep 11, 2023

Add inline rich tools to header popover

Remove z-index hack for using editor block tools in header

Add menubar role to toolbar group

Fix accidental duplicate block iserter in site editor document toolbar

Commits on Sep 12, 2023

Make entire header bar menubar role

Add focusEditorOnEscape to NavigableToolbar to return focus to editor by default on escape keypress