show error type in Typescript

[uixcrazy]

Describe the bug
I have this issue with version 4.0.1

Can you show me how to fix it?

[mohsinulhaq]

Please attach a Codesandbox reproducing this error.

[uasi]

I've got the same problem. Here is a repro: https://codesandbox.io/s/20210210-react-popper-tooltip-type-error-repro-6ywvc?file=/src/index.js

For those who have encountered the same error and is googling the error message:

$ tsc -noEmit -p tsconfig.json -rootDir src

src/popper.tsx:6:11 - error TS2322: Type '{ style: { alignContent?: "normal" | "center" | "end" | "start" | "inherit" | (string & {}) | "-moz-initial" | "initial" | "revert" | "unset" | "space-around" | "space-between" | ... 5 more ... | undefined; ... 774 more ...; vectorEffect?: "none" | ... 6 more ... | undefined; } | { ...; } | { ...; }; }' is not assignable to type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'.
  Type '{ style: { alignContent?: "normal" | "center" | "end" | "start" | "inherit" | (string & {}) | "-moz-initial" | "initial" | "revert" | "unset" | "space-around" | "space-between" | ... 5 more ... | undefined; ... 774 more ...; vectorEffect?: "none" | ... 6 more ... | undefined; } | { ...; } | { ...; }; }' is not assignable to type 'HTMLAttributes<HTMLDivElement>'.
    Types of property 'style' are incompatible.
      Type '{ alignContent?: "normal" | "center" | "end" | "start" | "inherit" |(string & {}) | "-moz-initial" | "initial" | "revert" | "unset" | "space-around"| "space-between" | "space-evenly" | ... 4 more ... | undefined; ... 774 more ...; vectorEffect?: "none" | ... 6 more ... | undefined; } | { ...; } | { ...; }' is not assignable to type 'CSSProperties | undefined'.
        Type '{ alignContent?: "normal" | "center" | "end" | "start" | "inherit"| (string & {}) | "-moz-initial" | "initial" | "revert" | "unset" | "space-around" | "space-between" | "space-evenly" | ... 4 more ... | undefined; ... 774 more ...; vectorEffect?: "none" | ... 6 more ... | undefined; }' is not assignable to type 'CSSProperties'.
          Types of property 'overflowX' are incompatible.
            Type '"auto" | "inherit" | "hidden" | "visible" | "scroll" | "-moz-initial" | "initial" | "revert" | "unset" | "clip" | "-moz-hidden-unscrollable" | undefined' is not assignable to type '"auto" | "inherit" | "hidden" | "visible" |"scroll" | "-moz-initial" | "initial" | "revert" | "unset" | undefined'.
              Type '"clip"' is not assignable to type '"auto" | "inherit" | "hidden" | "visible" | "scroll" | "-moz-initial" | "initial" | "revert" | "unset" | undefined'.

6   return <div {...getTooltipProps()}></div>;
            ~~~


Found 1 error.

error Command failed with exit code 2.

[uasi]

Updated csstype@3.0.3 (an indirect dependency via @types/react) to csstype@3.0.6 in the repro and the error disappeard.

@uixcrazy try removing and re-installing @types/react and any packages that depend on csstype. Simply running yarn upgrade @types/react or yarn upgrade csstype will not work; run yarn remove @types/react && yarn add -D @types/react or equevalent npm commands if you are using npm.

[mohsinulhaq]

closing this as it's not an issue from within our lib