Patterns: Spotlight Mode Option makes patterns in inserter look greyed out

[AndrewJDFerguson]

Description

This appears to be a defect, as I cannot think of any reason why enabling Spotlight mode should affect the Block Inserter sidebar interface.

Below is the information I originally posted on the WordPress.org support forum. The response I got there confirmed the behavior.

Using the Gutenberg editor with Spotlight mode turned on is the way I like to work, as many times I cannot otherwise quickly determine which block is selected.

Recently, I was viewing the Patterns tab of the Block Inserter sidebar, and it was displaying all of the available patterns grayed out, or ghosted. This made it difficult to determine what the pattern would render as on a page, and of course, clicking a pattern adds it to the page, when all I really want at that moment is to find a pattern to use. Once I know which pattern I want, then I will add it to the page.

Anyhow, I wondered why the patterns were all ghosted, and it turns out the culprit is Spotlight Mode. If that is turned off, the Patterns tab in the Block Inserter shows the available patterns in a normal, and in my view, useful way. Note that this ghosting also happens with the Block/Pattern/Reusable Block preview shown when hovering over an item on one of those tabs. Overall, this ghosting behavior is less than useful in my view.

Granted, any user could just toggle the Spotlight Mode option on/off as needed, but that is awkward, and I really think that Spotlight Mode should only affect the page or template content that is being worked on, not the sidebar.

Is this considered a feature, or a bug?
Is there a way to change this behavior without having to changing the options each time I use the Pattern tab?
Is there something I am missing here?

Thanks!

Step-by-step reproduction instructions

1. Enable Spotlight Mode Option
2. Open Block Inserter sidebar
3. Click the Patterns tab
4. Note that the available patterns all appear grayed/ghosted, making it difficult to visualize the available patterns
5. Disable Spotlight Mode Option
6. Again view the Patterns tab
7. Note that the available patterns are not grayed/ghosted. This is how I feel it should always be, even if Spotlight Mode is enabled
8. I attempted to add a screen capture, but keep getting a "Something went really wrong, and we can't process the file." message, but seeing that this was confirmed by threadi (@threadi) on the WordPress Forum, I don't think it is totally necessary at this time

Screenshots, screen recording, code snippet

No response

Environment info

• WordPress 6.0.1
• Edge Version 103.0.1264.62 (Official build) (64-bit)
• Windows 11 Pro

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

[jordesign]

Confirmed in testing. @annezazu This seems like it (might) be a quick win in terms of rough edges in the pattern experience for 6.5?

[annezazu]

Added as a polish item in hopes it can perhaps make it to 6.5. If anyone has time, it would be great to get a video or screenshot of what's going on. I'm on bad wifi at an airport and it won't let me load my test site :D

[jordesign]

@annezazu Great suggestion - here we go.

pattern_inserter_spotlight_mode.mov

[annezazu]

Thank you so much! Just was returning to add one in and appreciate you taking care of it.