包括vaadin-combo-box-item的样式

Question

我正在尝试使用客户ComponentRenderer在Vaadin Flow组合框中添加标记图标：

new ComponentRenderer<>(locale -> {
            HorizontalLayout item = new HorizontalLayout();
            item.setDefaultVerticalComponentAlignment(FlexComponent.Alignment.BASELINE);

            Span langIcon = new Span();
            langIcon.addClassNames("flag-icon", "flag-icon-" + getTranslation("App.Language.Flag", locale));
            item.add(langIcon);

            item.add(new Span(locale.getDisplayLanguage(locale)));

            return item;
        });

图标来自 flag-icon-css （请参阅here），该图标通过gradle编译依赖项“ org.webjars.bowergithub.lipis：flag-icon-css：3.3.0包含在内”和主布局类上的注释@StyleSheet("frontend://bower_components/flag-icon-css/css/flag-icon.min.css")。在带有ListBox组件的其他位置，按预期显示图标。但是，在组合框中通过ComponentRenderer使用时，什么也没有显示。

检查HTML，我发现ComboBox中的<vaadin-combo-box-item>呈现了其阴影根下的所有内容，而ListBox中的<vaadin-item>则将其呈现为<slot>。 那是为什么？以及如何在组合框项目中使用标记图标CSS样式？