-
Notifications
You must be signed in to change notification settings - Fork 4.2k
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
Revise LinkControl suggestions UI to use MenuItem #50978
Conversation
Size Change: +338 B (0%) Total Size: 1.43 MB
ℹ️ View Unchanged
|
Flaky tests detected in 890dde8. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/5354665144
|
We can use the MenuItem info prop to pass the permalink. |
fc857f1
to
98dd225
Compare
@richtabor I made some changes here and fixed the tests. Let me know what you think of it. We need to choose and implement the visual "states" for the suggestions list:
I've hacked something in but if you have a clear idea on these that would help. |
Wouldn't the MenuItem component styles be fine here? |
Uh oh! What happened? Looks like we need to rebase |
27dae0c
to
abf3553
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We need to address:
keyboard arrow keys do not workadd visual states for aria-selectedpressingthis is present inTAB
when in input results in selection of that resulttrunk
.
I think that will be handled in a seperate PR. @jasmussen @richtabor are you happy with this visual selected state? As you can see when the item is not selected all the padding looks fine, but when it is it looks like a mistake (at least to me) as the selected item looks very close to the edge of the popover. |
Needs improving
MenuItem already has hover/focus styles
ba7681b
to
e7a0a9d
Compare
@tellthemachines Let's bring this into 6.3. It was missing that label as you identified in #52517 (comment) Thank you 🙏 |
Done! This should really have been cherry-picked before #51712, would have avoided a ton of conflict-solving. |
* Use "link" instead of "URL" for URL_TYPE * Use MenuItem for search create button * Use sentence case for "Create page" * Use a MenuGroup for search results * Use MenuItem for search item * Refactoring styles (WIP) * Preserve whitespace in results text * Reinstate result item information including permalink * Remove debugging CSS code * Reinstate CSS to control size of rich previews favicon * Remove other commented out CSS code * Reinstate selected styles * Remove more redundant CSS * Add some basic results hover/focus styling. Needs improving * Improve icon alignment * Update tests to handle wording changes * Remove inconsistent hover/focus style MenuItem already has hover/focus styles * Reinstate is-selected visual state * Update test to make sense in context of #51011 See #51011 * Fix locator for result text --------- Co-authored-by: Dave Smith <[email protected]>
Absolutely. Apologies that this happened. Just an oversight I'm afraid. We had a lot of concurrent PRs and this one slipped through the net. Appreciate your time and effort resolving 🙇♂️ |
* Use "link" instead of "URL" for URL_TYPE * Use MenuItem for search create button * Use sentence case for "Create page" * Use a MenuGroup for search results * Use MenuItem for search item * Refactoring styles (WIP) * Preserve whitespace in results text * Reinstate result item information including permalink * Remove debugging CSS code * Reinstate CSS to control size of rich previews favicon * Remove other commented out CSS code * Reinstate selected styles * Remove more redundant CSS * Add some basic results hover/focus styling. Needs improving * Improve icon alignment * Update tests to handle wording changes * Remove inconsistent hover/focus style MenuItem already has hover/focus styles * Reinstate is-selected visual state * Update test to make sense in context of WordPress#51011 See WordPress#51011 * Fix locator for result text --------- Co-authored-by: Dave Smith <[email protected]>
* Site Editor: Restore quick inserter 'Browse all' button (#52529) * Site Editor: Restore quick inserter 'Browse all' button * Remove leftover comment * Patterns: update the title of Pattern block in the block inspector card (#52010) * Site Editor Pages: load the appropriate template if posts page set (#52266) * This commit: - links the posts page to the homepage template when a post page is set - abstracts logic to get page item props * The Posts Page resolves to display the Home or Index template only. Adding a check to skip the Front Page * Showing homepage settings for posts pages that are set as the post page in reading settings * Post pages that have been set to display posts will redirect to first the home template, then the index template. The fallback is the post id of the page. * Reverted refactor of packages/edit-site/src/components/sidebar-navigation-screen-page/index.js Will do it in a follow up * Allow editing existing footnote from formats toolbar (#52506) * Block Editor: Display variation icon in the 'BlockDraggable' component (#52502) * Patterns: add option to set sync status when adding from wp-admin patterns list (#52352) * Show a modal to set sync status if adding pattern from pattern list page * Make sure the modal loads if post settings panel not open * don't load modal component at all if not new post * Simplify the sync status so undefined always = synced * Update packages/editor/src/components/post-sync-status/index.js --------- Co-authored-by: Ramon <[email protected]> * Revise LinkControl suggestions UI to use MenuItem (#50978) * Use "link" instead of "URL" for URL_TYPE * Use MenuItem for search create button * Use sentence case for "Create page" * Use a MenuGroup for search results * Use MenuItem for search item * Refactoring styles (WIP) * Preserve whitespace in results text * Reinstate result item information including permalink * Remove debugging CSS code * Reinstate CSS to control size of rich previews favicon * Remove other commented out CSS code * Reinstate selected styles * Remove more redundant CSS * Add some basic results hover/focus styling. Needs improving * Improve icon alignment * Update tests to handle wording changes * Remove inconsistent hover/focus style MenuItem already has hover/focus styles * Reinstate is-selected visual state * Update test to make sense in context of #51011 See #51011 * Fix locator for result text --------- Co-authored-by: Dave Smith <[email protected]> * Fix LinkControl mark highlight to bold (#52517) * Add 'reusable' keyword to Pattern blocks (#52543) * Fix missing Add Template Part button in Template Parts page (#52542) * Tweak copy for the reusable block rename hint (#52581) * Trim footnote anchors from excerpts (#52518) * Trim footnote anchors from excerpts * Add comments, fix spacing, appease linter * Site Editor: Reset device preview type when exiting the editing mode (#52566) * Make "My patterns" permanently visible (#52531) * Hide site hub when resizing frame upwards to avoid overlap (#52180) * Fix "Manage all patterns" link appearance (#52532) * Fix "Manage all patterns" link * Update focus style * Update navigation menu title size & weight in detail panels (#52477) * Update menu title size * Adjust font weight * Site Editor Patterns: Ensure sidebar does not shrink when long pattern titles are used (#52547) * Edit Site: Select templateType from the store inside the useSiteEditorSettings hook (#52503) * Add width to ensure ellipsis is applied (#52575) * Cover Block: Fix block deprecation when fixed background is enabled (#51612) * ResizableFrame: Make keyboard accessible (#52443) * ResizableFrame: Make keyboard accessible * Fix outline in Safari * Use proper CSS modifier * Add aria-label to button * Keep handle enlarged when resizing (Safari) * Add back visually hidden help text * Don't switch to edit mode * Make the handle a role="separator" * Revert to `button` * Switch description text to `div hidden` * Prevent keydown event default when right/left arrow * Change minimum frame width to 320px * Mention shift key in description text * Only render resize handle when in View mode * Fix importing classic menus (#52573) * use the same create hook for classic import * Remove redundant arg to hook --------- Co-authored-by: Dave Smith <[email protected]> * Site Editor: Fix navigation menu sidebar actions order and label (#52592) * Avoid errors in Dimension visualizers when switching between iframed and non-iframed editors (#52588) * Patterns: Add client side pagination to patterns list (#52538) Co-authored-by: Saxon Fletcher <[email protected]> * Site Editor: Make sidebar back button go *back* instead of *up* if possible (#52456) * Navigator: Add replace option to goTo() and goToParent() * Site Editor: Make sidebar back button go back instead of up if possible * Adapt template part hint copy (#52527) * Try "panel" instead of "page" * Update template-part-hint.js --------- Co-authored-by: George Mamadashvili <[email protected]> Co-authored-by: Glen Davies <[email protected]> Co-authored-by: Ramon <[email protected]> Co-authored-by: Miguel Fonseca <[email protected]> Co-authored-by: Rich Tabor <[email protected]> Co-authored-by: Dave Smith <[email protected]> Co-authored-by: Robert Anderson <[email protected]> Co-authored-by: James Koster <[email protected]> Co-authored-by: Andrew Serong <[email protected]> Co-authored-by: arthur791004 <[email protected]> Co-authored-by: Aki Hamano <[email protected]> Co-authored-by: Lena Morita <[email protected]> Co-authored-by: Andrei Draganescu <[email protected]> Co-authored-by: Saxon Fletcher <[email protected]>
What?
Part of #50885, as part of a greater LinkControl refresh effort. Note that this should follow #50977.
<MenuItem>
for items instead of custom buttons + styles.Testing Instructions
Screenshots or screencast
CleanShot.2023-05-25.at.14.08.30.mp4
Co-authored-by: Dave Smith [email protected]