Could not find a declaration file for module 'react-signature-canvas'

[SumitShrestha11]

Error:

Could not find a declaration file for module 'react-signature-canvas'. '../node_modules/react-signature-canvas/dist/index.mjs' implicitly has an 'any' type.
  There are types at '../node_modules/react-signature-canvas/dist/index.d.ts', but this result could not be resolved when respecting package.json "exports". The 'react-signature-canvas' library may need to update its package.json or typings.

Then I installed the types as yarn add @types/react-signature-canvas@latest --dev

import { useRef } from 'react';
import ReactSignatureCanvas from 'react-signature-canvas';

export const SignaturePad = () => {
  const signatureCanvasRef = useRef(null);
  return (
    <div className='p-5'>
      <ReactSignatureCanvas
        ref={signatureCanvasRef}
        canvasProps={{ className: 'w-full rounded-sm  border-1 border-neutral-700' }}
      />
    </div>
  );
};

then I get

'ReactSignatureCanvas' cannot be used as a JSX component.
  Its type 'typeof ReactSignatureCanvas' is not a valid JSX element type.
    Types of construct signatures are incompatible.
      Type 'new (props: ReactSignatureCanvasProps) => ReactSignatureCanvas' is not assignable to type 'new (props: any) => Component<any, any, any>'.
        Construct signature return types 'ReactSignatureCanvas' and 'Component<any, any, any>' are incompatible.
          The types returned by 'render()' are incompatible between these types.
            Type 'import("/home/outside/projects/reset-one/node_modules/@types/react-signature-canvas/node_modules/@types/react/index").ReactNode' is not assignable to type 'React.ReactNode'.
              Type 'ReactElement<unknown, string | JSXElementConstructor<any>>' is not assignable to type 'ReactNode'.
                Property 'children' is missing in type 'ReactElement<unknown, string | JSXElementConstructor<any>>' but required in type 'ReactPortal'.

[agilgur5]

Could not find a declaration file for module 'react-signature-canvas'. '../node_modules/react-signature-canvas/dist/index.mjs' implicitly has an 'any' type.
  There are types at '../node_modules/react-signature-canvas/dist/index.d.ts', but this result could not be resolved when respecting package.json "exports". The 'react-signature-canvas' library may need to update its package.json or typings.

So this has been fixed by #126 / is duplicative of the root cause therein.
I haven't released a new version yet as I had a pretty bad flare-up in my condition the past ~2ish weeks. Hopefully I'll be able to get to it this week as I'm feeling better overall (but not fully back yet).

In the meantime, you can workaround it like in the PR, with patch-package, or in a manner similar to taybenlor/runno#323 (comment):

tsconfig.json

// tsconfig.json
"compilerOptions": {
  "paths": {
    "react-signature-canvas": ["./node_modules/react-signature-canvas"]
   },
  // ...
}

Then I installed the types as yarn add @types/react-signature-canvas@latest --dev

This shouldn't be needed with versions 1.1.0-alpha.1 and above. TS prefers the built-in types as well, although I'm not actually sure what it does in the error case as you have here. If you didn't change the react-signature-canvas version, then I guess it tries to use the @types/ package then?

'ReactSignatureCanvas' cannot be used as a JSX component.
  ...
                Property 'children' is missing in type 'ReactElement<unknown, string | JSXElementConstructor<any>>' but required in type 'ReactPortal'.

The error is slightly different but I believe this is a duplicate of #117. As I wrote there, that duplicates upstream DefinitelyTyped/DefinitelyTyped#71404, DefinitelyTyped/DefinitelyTyped#71859, DefinitelyTyped/DefinitelyTyped#71858, DefinitelyTyped/DefinitelyTyped#71657 etc.

It appears to be due to mismatched versions of react vs @types/react afaict. Per DefinitelyTyped/DefinitelyTyped#71404 (comment), it looks like you can workaround this by pinning the correct version of @types/react.

[agilgur5]

So this has been fixed by #126 [...]
I haven't released a new version yet

#126 (and #131) have been released in v1.1.0-alpha.2

[SumitShrestha11]

@agilgur5 Great! Its working fine now