^{Originally posted by bph April 23, 2024}
In the outreach channel, there was a discussion around this topic :

Jessica Lyschik elaborated:

When creating a custom block, I have some settings defined inside InspectorControls with like toggles, selects, inputs, etc. Now I have to implement a setting that I can't get done with the provided Components, so I'd like to know how to create my own component, preferably in JSX.

Fabian Kägy had some tips:

I tend to start by wrapping my control in the BaseControl

It already gives you all the styles for labels, help text etc. And from there it really is just plain react, and you can do whatever you want.

I’m building components like that here in this package for example: https://github.com/10up/block-components/

This here is a simple one that just exports a light wrapper around another control: https://github.com/10up/block-components/blob/develop/components/color-settings/index.js

But it can also be much more complex like in this example here for an icon picker: https://github.com/10up/block-components/blob/88f68d8df1e3912abf4c976b7c8b8fa72b964a3d/components/icon-picker/icon-picker.js#L68 -L91