TypeScript issue with PropertyValue and TS v4.8.2

[csantos1113]

Bug report

Describe the bug

using PropertyValue for defining a custom util in TypeScript 4.8.2 generates the following typescript error:

TS4118: The type of this node cannot be serialized because its property '[$$PropertyValue]' cannot be serialized.

To Reproduce

I cannot reproduce this in codesandbox because I can't change the TypeScript version (See: https://github.com/codesandbox/codesandbox-client/issues/942)

1. Create a react server with typescript 4.8.2
2. Create stitches config

const stitches = createStitches({
  utils: {
    marginHorizontal: (value: PropertyValue<'margin'>) => ({
      marginLeft: value,
      marginRight: value
    })
  }
});

export const { css, config, createTheme, getCssText, globalCss, keyframes, reset, styled, theme } =
  stitches;

3. notice the TS error

Expected behavior

I should be able to use PropertyValue on TS 4.8.2

Screenshots

System information

• OS: N/A
• Browser: N/A
• Version of Node.js: N/A
• Version of Stitches: 1.2.8
• Version of TypeScript: 4.8.2

[jackguoAtJogg]

I'm not sure how many people have this issue experience. I'm on Typescript 4.5.2 and getting the same error, and the error came out from no where.

[domcoleman]

I'm not sure how many people have this issue experience. I'm on Typescript 4.5.2 and getting the same error, and the error came out from no where.

If you're using VS Code you can switch to the workspace version of TypeScript, by default it will use VS Code's version.

[jackguoAtJogg]

@domcoleman Thank you! That worked for me 😁

[gabrieloureiro]

Any update? The both version of typescript (vsc and node_modules) are reporting this error.

What is the stable version for stitches?

[jakubzet]

Any update? The both version of typescript (vsc and node_modules) are reporting this error.

What is the stable version for stitches?

@gabrieloureiro You're using the same TypeScript versions in both cases - this can be easily spotted on the screenshot you attached. The last TS version which doesn't throw errors is 4.7.4. Find your package.json file and force appropriate TS version, then reinstall packages and select one from node_modules.

[gabrieloureiro]

Any update? The both version of typescript (vsc and node_modules) are reporting this error. What is the stable version for stitches?

@gabrieloureiro You're using the same TypeScript versions in both cases - this can be easily spotted on the screenshot you attached. The last TS version which doesn't throw errors is 4.7.4. Find your package.json file and force appropriate TS version, then reinstall packages and select one from node_modules.

The version 4.7.4 works well for me. Thank you @jakubzet.

[Andarist]

Since this has changed between 4.7 and 4.8 - is there any TS issue to track this specific regression/change on their side?

[dzek69]

To anyone still using stitches like me, and wanting to upgrade TypeScript, do this:

• install patch-package npm package
• create patches folder in the same folder you have your package.json
• download this file: @stitches+react+1.2.8.zip and extract the contents into patches folder
• in the prepare script in package.json add patch-package command
• npm run prepare

All thanks should go to @jgoz (who fixed that) and @gajus (who created a patch file I slightly modifed). I hope did not miss anyone.