traits group

[aliibrahim123]

is there any way to do traits group

[protozoo]

I am interested in this too. The app I'm working one has some components with tons of traits, really difficult for the user to find the right one. Being able to group them, similarly as the styles panel, would be very help ful. Is there any way of achieving this? Thanks!

[badiuciprian]

Maybe (probably) not the best approach, but what I did was to append the traits to different divs by id (for example I have the 'colors' category set up ) on component selected.
Also you would like to remove the trait once the component is deselected.
For example I looked for a trait named backgroundImage:
You also need a timer, to wait until the traits are generated

const Color = document.getElementById(color);

grapesJsEditor.on('component:selected', function (model: Component) {
  setTimeout(() => {
    model.getTrait('backgroundImage') && Color.append(document.querySelector('.gjs-trt-trait__wrp-backgroundImage'));
  }, 100);
});

grapesJsEditor.on('component:deselected', function (model: Component) {
model.getTrait('backgroundImage') && document.querySelector('.gjs-trt-trait__wrp-backgroundImage').remove();
})
.....