Convert an existing React Component into a Webcomponent?

My aim is to use convert a react component say Header.tsx into a Webcomponent and use it inside App.tsx. Like this

  <ThemeProvider theme={theme}>
    <my-header/>
   </ThemeProvider>

I'm trying to use react-to-webcomponent package . But I'm not clear how to use it.

Do I need to add

const HeaderComp = reactToWebComponent(Header, React, ReactDOM);

customElements.define("my-header", HeaderComp);

inside the Header file? How do I register/import the webcomponent then?