It’s definitely nice one. After some time I got something slightly better if you like. Instead of drilling down layers I found it’s more convenient to have configurable width property instead
This way I can quickly set the size of an element to a specific value.
Here how it works
On top level this is a container for anything I like, in this particular it’s a form element that sits inside auto sized container. There are two props, one is to select specific input type and another one to adjust the width
Form Control component fills the width
The most important part is a width component. It’s like size tokens in TailwindCSS
As you can see it’s exactly the same spacer. I just made bunch of them to get as many sizes as I need
Here is some live action
Yay or nay? )