SWC Regression in 12.2.0: "ReferenceError: x is not defined" in css template literal that uses local variable

[fabb]

Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: linux
  Arch: x64
  Version: Ubuntu 20.04.0 LTS Fri Jul 22 2022 14:10:10 GMT+0200 (Central European Summer Time)
Binaries:
  Node: 16.14.2
  npm: 7.17.0
  Yarn: 1.22.10
  pnpm: N/A
Relevant packages:
  next: 12.2.3-canary.17
  eslint-config-next: N/A
  react: 18.2.0
  react-dom: 18.2.0

What browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

No response

Describe the Bug

When using a local variable in a css template literal as a parameter for a function execution, it fails the build with ReferenceError: x is not defined.

export default function Home() {
  const { x } = { x: 4 };

  return (
    <div
      css={css`
      // ReferenceError: x is not defined
      ${myCss(x)}
  `}
    />
  );
}

const myCss = (x: number) => css`
  margin: ${x}px;
`;

Expected Behavior

Should compile. Worked fine in next.js <12.2.0, and works fine with babel.

Link to reproduction

https://stackblitz.com/edit/vercel-next-js-8dfxwb?file=pages/index.tsx

To Reproduce

Just run npm run build in the example repo.

[github-actions]

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.