I completely love it! Fantastic work, thanks for doing this.

Not blockers, because this is such a leap, but small tweaks could be:

• Offer 16, 24, 32 sizes. We don't actually use either 32 or 40, but we do use 16 in rare cases, like inside "badge".
• There's something off with the vertical alignment of the toggle, I wonder if the row as a whole can be bottom aligned? Or can the toggle be inside a basecontrol so it gets an extra label?

We can potentially tweak the help text too. How about:

Emphasize icons available in the SVG icon registry.

None of this is blocking, feel free to ship.

Another thing worth looking at, is to make all the Storybook folders collapsed by default. Although Storybook is often used for component docs, those arguably are best found through a search still, which means the folders don't necessarily need to be expanded. The benefit of collapsing them by default (like Audi does), is that it brings more glanceability to the categorization of elements in Storybook, e.g. Icons gets vastly more findable. Which feels worth it!

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: jasmussen <joen@git.wordpress.org>
Co-authored-by: mcsf <mcsf@git.wordpress.org>
Co-authored-by: mirka <0mirka00@git.wordpress.org>
Co-authored-by: juanfra <juanfra@git.wordpress.org>
Co-authored-by: Mamaduka <mamaduka@git.wordpress.org>
Co-authored-by: tyxla <tyxla@git.wordpress.org>
Co-authored-by: ciampo <mciampini@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

Flaky tests detected in 01cf376.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/22743675122
📝 Reported issues:

• [Flaky Test] should insert media, convert to blocks, and undo in one step #36123 in /test/e2e/specs/editor/blocks/classic.spec.js
• [Flaky Test] should not create undo levels when publishing #48864 in /test/e2e/specs/editor/various/undo.spec.js

Thanks for the review!

• Offer 16, 24, 32 sizes. We don't actually use either 32 or 40, but we do use 16 in rare cases, like inside "badge".
• There's something off with the vertical alignment of the toggle, I wonder if the row as a whole can be bottom aligned? Or can the toggle be inside a basecontrol so it gets an extra label?

We can potentially tweak the help text too. How about:

Emphasize icons available in the SVG icon registry.

For some reason the lint check is failing so I'm investigating the cause 👀

Unfortunately, as I understand it, to eliminate the CI error, we need to implement everything using only native elements, without depending on @wordpress/components. Otherwise, we'll have a circular dependency, and the @wordpress/icons npm will include unnecessary @wordpress/components.

The UI ended up looking a bit clunky, but I still think the functional improvement is worth it.

Size Change: 0 B

Total Size: 6.89 MB

_{compressed-size-action}

Can we use Storybook controls for this? The size definitely falls into that category, but I'm not 100% sure regarding the other two.

That is a bit more rudimentary indeed, but I agree that it's still a vast improvement over what ships.

Storybook is in a bit of a forgotten/unloved state already, so any little PR we land will improve it, and there's a lot of opportunity there.

This is a nice improvement. I think we can allow for some UI clunkyness in the Storybook stories, especially if it's in favor of usability.

Can we use Storybook controls for this?Can we use Storybook controls for this?

I tried this and it seems to work fine. However, performance seems a little slower than when using native elements. Also, for some reason I couldn't get the Description field to appear visually.

@mirka Thanks for the advice! I was able to restore the UI from the component package without any errors in 17b4837

Nit: I changed the order of stories in 01cf376

Before

After

In case it's not implemented yet, one item in my wishlist is that the story state (ie. search text, icon size, highlight toggle) is stored in the URL as it makes it super easy to share a link to see a specific subset of icons.

In that case, I guess that using Storybook controls would enable it by default?

Anyway, not a blocker at all

@ciampo, I tried to sync the story state and URL by using useArgs. What do you think?

I tried to sync the story state and URL by using useArgs. What do you think?

Looks great, thank you 🙏 Feel free to merge

I noticed the library shows up on the "Docs" page, but none of the controls (search, icon seize, "highlight public icons") work there. Should we hide if from that page, or is there something we need to do to get it working? It works fine on the dedicated "Library" page.

I noticed the library shows up on the "Docs" page, but none of the controls (search, icon seize, "highlight public icons") work there.

Nice catch! I think that disabling autodocs is probably the easiest solution. #76620