TreeGrid Vaadin ClassNameGenerator LumoUtility styling

Question

I have a Problem regarding styling a TreeGrid rowise. I want use the ClassNameGenerator to generate classes regarding a POJO object. The problem is, that TreeGrid does not define the "bg-error" class of the Lumo styling locally. Is there a way to use the Lumo style classes inside a TreeGrid?

TreeGrid<POJO> grid = new TreeGrid<>(POJO.class); 
grid.setClassNameGenerator(pojo -> {
    return "bg-error";
});

Answer 1

This unfortunately does not work directly as class name is added to td-element of the internal table element, which is in shadow DOM. So you need to add the styles in frontend/themes/{mytheme}/component/vaadin-grid.css file (note to replace {mytheme} with your actual project theme name).