API for registering custom icons for the editor

[getdave]

There have been quite a few requests to allow us to customise the icons used in blocks in the editor

• Pagination Links: Allow users to upload custom pagination icon #51118
• Add ability to style and/or use a custom icon for responsive menu  #37930
• Add support for icons in Button blocks #16513

Currently this is not possible.

Whilst exploring this in #51527 I suggested exploring a new API to allow developers to register their own custom icons with the editor.

register_editor_icon(
    name: 'myicon',
    label: 'My Icon',
    svg: // SVG markup here
);

As I suggested we would need to register this PHP side and sanitize the SVG there.

Then on output we would:

• PHP: use esc_ functions.
• JS: use dangerouslySetInnerHTML with equivalent escape functions.

[MaggieCabrera]

Related #16513

[getdave]

@scruffian Is there any scope here to absorb icons as part of global styles as some kind of element? Is that even possible?

[MaggieCabrera]

I think it makes more sense for it to be a block?

[getdave]

I think it makes more sense for it to be a block?

I agree that having a block for "icon" might be useful. However, this issue is specifically about providing a means for developers to use custom icons within the editor.

What we need is a means to register those icons (note: that doesn't mean we need to be able to upload them).

One use case for such an API can be found here.

[getdave]

Prior art for Media Categories

[scruffian]

Is there any scope here to absorb icons as part of global styles as some kind of element? Is that even possible?

It's possible to create an icon element, but I don't think it would help much with what you're seeking to achieve here. It could be a good followup though.

[getdave]

I think we should consider doing this via Theme JSON instead. I'm going to think about this some more and come up with a counter proposal.