This simple class for Vaadin 14/23 implements web component wrapper for HTML & Html component

CustomComponent.java

package org.tatu.vaadin20.components;

import com.vaadin.flow.component.Component;
import com.vaadin.flow.component.Html;
import com.vaadin.flow.dom.Element;
import com.vaadin.flow.dom.ShadowRoot;

public class CustomComponent extends Component {

    /**
     * Wrap Html component as web component with given tag name.
     * 
     * @param tag
     *            Tag name, needs to have at least one -, e.g. "tag-name"
     * @param html
     *            Html component.
     */
    public CustomComponent(String tag, Html html) {
        super(null);
        setup(tag, html);
    }

    /**
     * Generate web component using tag name and given HTML fragment with a
     * single root element.
     * 
     * @param tag
     *            Tag name, needs to have at least one -, e.g. "tag-name"
     * @param htmlString
     *            HTML fragment with a single root element.
     */
    public CustomComponent(String tag, String htmlString) {
        super(null);
        Html html = new Html(htmlString);
        setup(tag, html);
    }

    private void setup(String tag, Html html) {
        Element el = new Element(tag);
        setElement(this, el);
        el.attachShadow();
        ShadowRoot shadow = el.getShadowRoot().get();
        shadow.appendChild(html.getElement());
    }

}