Custom icon for custom template part area

[dinhtungdu]

What problem does this address?

This issue comes from woocommerce/woocommerce-blocks#5221

Currently, we only support 4 icons for template part areas and there is no way plugins/themes can use custom icons for custom areas.

What is your proposed solution?

Custom template part area can have a custom icon.

[gziolo]

Currently, we only support 4 icons for template part areas and there is no way plugins/themes can use custom icons for custom areas.

I see that the same function is duplicated for the block:

gutenberg/packages/block-library/src/template-part/variations.js

Lines 13 to 22 in 12791ec

	function getTemplatePartIcon( iconName ) {
	if ( 'header' === iconName ) {
	return headerIcon;
	} else if ( 'footer' === iconName ) {
	return footerIcon;
	} else if ( 'sidebar' === iconName ) {
	return sidebarIcon;
	}
	return symbolFilledIcon;
	}

The following lines:

gutenberg/packages/block-library/src/template-part/variations.js

Lines 54 to 56 in 12791ec

	...( typeof variation.icon === 'string' && {
	icon: getTemplatePartIcon( variation.icon ),
	} ),

make me wonder if you can register a block variation with the icon expressed as a React element?