ContextMenuProps in version 5.x.x has typing conflict with @types/react v18.2.14

[pettyron]

Environment

React 18 (@types/react v18.2.14), TypeScript 5, Windows 10, Node v16

• Package version(s): @blueprintjs/core@5.0.1
• Operating System: Windows 10
• Browser name and version: Chrome 114.0.5735.199

Steps to reproduce

1. Running tsc command to build output triggers the error.

Actual behavior

Console returns this error:

node_modules/@blueprintjs/core/lib/esm/components/context-menu/contextMenu.d.ts:33:18 - error TS2430: Interface 'ContextMenuProps' incorrectly extends interface 'Omit<HTMLAttributes<HTMLElement>, "className" | "children" | "onContextMenu">'.
  Types of property 'content' are incompatible.
    Type 'Element | ((props: ContextMenuContentProps) => Element)' is not assignable to type 'string'.
      Type 'Element' is not assignable to type 'string'.

Expected behavior

No error

Possible solution

// The solution is that the interface should look like this:
export interface ContextMenuProps extends Omit<React.HTMLAttributes<HTMLElement>, "children" | "className" | "content" | "onContextMenu">, React.RefAttributes<any>, Props {
    /**
     * Menu content. This will usually be a Blueprint `<Menu>` component.
     * This optionally functions as a render prop so you can use component state to render content.
     */
    content: JSX.Element | ((props: ContextMenuContentProps) => JSX.Element | undefined) | undefined;
    ...
}

// But instead it looks like this:
export interface ContextMenuProps extends Omit<React.HTMLAttributes<HTMLElement>, "children" | "className" | "onContextMenu">, React.RefAttributes<any>, Props {
    /**
     * Menu content. This will usually be a Blueprint `<Menu>` component.
     * This optionally functions as a render prop so you can use component state to render content.
     */
    content: JSX.Element | ((props: ContextMenuContentProps) => JSX.Element | undefined) | undefined;
    ...
}

[pettyron]

The reason this fails, as it does, is because the latest React types has in their HTMLAttributes interface, listed under RDFa Attributes, content?: string | undefined.

[pettyron]

I was able to roll my types for React back to @types/react v18.0.28 along with setting yarn resolutions, in my packages.json, to use this React types version. That resolves my issue and it helps to inform you this is only a conflict with React's latest typings (v18.2.14).