Type 'unique symbol' cannot be used to index type 'Component'.

Bug report

Describe the bug

When I use npm run build, following error appears:

nr build

> realworld@0.0.0 build /Users/tyankatsu/project/realworld
> tsc && vite build

node_modules/@stitches/react/types/index.d.ts:42:70 - error TS2536: Type 'unique symbol' cannot be used to index type 'Component'.

42 export type VariantProps<Component> = StyledComponent.TransformProps<Component[StyledComponent.$$StyledComponentProps], Component[StyledComponent.$$StyledComponentMedia]>
                                                                        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/@stitches/react/types/index.d.ts:42:121 - error TS2536: Type 'unique symbol' cannot be used to index type 'Component'.

42 export type VariantProps<Component> = StyledComponent.TransformProps<Component[StyledComponent.$$StyledComponentProps], Component[StyledComponent.$$StyledComponentMedia]>
                                                                                                                           ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


Found 2 errors.

npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! realworld@0.0.0 build: `tsc && vite build`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the realworld@0.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/tyankatsu/.npm/_logs/2021-09-02T13_57_06_027Z-debug.log

To Reproduce

Steps to reproduce the behavior, please provide code snippets or a repository:

1. Go to https://github.com/tyankatsu0105/realworld/tree/4b53223aac598d5eee5af07dc3939c671b07da1e
2. run npm run build
3. See error

Expected behavior

Succeed to build.

System information

• OS: macOS
• Version of Stitches: 1.0.0
• Version of Node.js: 12.22.0

[rothsandro]

I have the same error in a Angular 12 project. It works when I update TypeScript from 4.3 to 4.4 (see release notes). But this not officially supported by Angular 12, I need to add disableTypeScriptVersionCheck: true in my tsconfig.

As a better workaround I added skipLibCheck: true in my tsconfig.

{
  "compilerOptions": {
    // ...
    "skipLibCheck": true
  }
}

[lukemartin]

@peduarte 👋

Unfortunately that still doesn’t seem to work 😕

Errors:

package.json here: https://github.com/lukemartin/gql-share/blob/stitches/package.json

Let me know if there’s anything else I can do to help ✌️