How to use Slider Revolution tag names in a React / JSX component?

Question

I have following coponent:

export default function Home() {
    return (
        <main className="site-main">
            <rs-fullwidth-wrap
                id="rev_slider_2_1_forcefullwidth"
                style={{ marginTop: '0px', marginBottom: '0px' }}
            >

got this:

Property 'rs-fullwidth-wrap' does not exist on type 'JSX.IntrinsicElements'.

I tried to add this before return

declare namespace JSX {
    interface IntrinsicElements {
        'rs-fullwidth-wrap': any
        'rs-module-wrap': any
    }
}

Did not help. What else I can do?

Answer 1

Your declaration is incorrect, try this:

declare global {
  namespace JSX {
    interface IntrinsicElements {
      "rs-fullwidth-wrap": JSX.IntrinsicElements["div"];
    }
  }
}