Is it possible to insert a web component into an SVG element?

Question

Is it possible to embed a web component inside an SVG element and then display child SVG elements in the web component?

I'd like to componentise the elements on my svg canvas but I just get an empty component when attempting this.

<svg height="100" width="100">
    <circle-elem></circle-elem>
</svg> 

class CircleElem extends HTMLElement {
    connectedCallback() {
        this.innerHTML = `<circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />`;
    }
}

customElements.define('circle-elem', CircleElem);

CodePen