hanko-elements seems incompatible with @types/react@19.0.0

[willyfromtheblock]

Checklist

• I could not find a solution in the existing issues or docs.
• I agree to follow this project's Code of Conduct.

Describe the bug

Hi,

I'm using components/HankoAuth.tsx for nextjs, more or less straight from your docs.

Upgrading @types/react to ^19.0.0 gives me an

Property 'hanko-auth' does not exist on type 'JSX.IntrinsicElements'.ts(2339)

error.

Same thing happens for <hanko-profile />.

---

I have googled around a bit and this might be related to the leading small letter of <hanko-auth />?

    "@types/react": "^18.3.3",

still works

Reproducing the bug

upgrade @types/react to ^19.0.0

Logs

Configuration

Hanko Version

"@teamhanko/hanko-elements": "^1.4.0",

OS Hanko Backend

None

OS Version Hanko Backend

No response

OS

None

OS Version

No response

Browser Version

No response

Environment

None

Additional Context

No response

[FilippTrigub]

And I was thinking, I'm the only one with this issue...any fix beyond downgrading?

[FreddyDevelop]

Staring from React 19 the JSX namespace is not longer global but react scoped. As a workaround you can add a new file (e.g. "custom.d.ts") with:

import { HankoAuthElementProps, HankoProfileElementProps, HankoEventsElementProps } from "@teamhanko/hanko-elements";

declare module "react" {
  namespace JSX {
    interface IntrinsicElements {
        "hanko-auth": HankoAuthElementProps;
        "hanko-login": HankoAuthElementProps;
        "hanko-registration": HankoAuthElementProps;
        "hanko-profile": HankoProfileElementProps;
        "hanko-events": HankoEventsElementProps;
    }
  }
}

More information about it can be found here