How to customize StyleManager input components?

The demo version on GrapesJS site has some custom style input components (i.e. opacity slider, "undo" button by the property name...) How is this achieved? Is there anyway I can use them with my own plugin?

Those are part of the configuration.

For property clearing use this option

styleManager: { clearProperties: 1 },

The opacity is built using the slider type, here is the part from the source of the demo https://github.com/artf/grapesjs/blob/53cfe888a0ee5d49c43cd4e3fa5daf0b55f8277c/demo.html#L1101-L1108

Also how do I get my custom sector properties to behave like the buildProps? In my case I have to translate all strings, so I can't use buildProps, but the custom props don't behave like the buildProps does. They are not taking the components attribute initial value on component:selected as the buildProps does, color picker doesn't show onClick and so on.

You can translate the strings by extending buildProps Take a look at the demo source

https://github.com/artf/grapesjs/blob/53cfe888a0ee5d49c43cd4e3fa5daf0b55f8277c/demo.html#L1036-L1052

As you see I change the default labels of properties like margin/padding by extending them in properties (using property or id as an identifier). You can also see the flex-width which is totally custom and placed there just to make use of buildProps for other built-in properties