How to use tagged template literals ?

[ryanpark]

Hi 🐼

I am encountering difficulties while trying to use template literals and I am receiving the following error:
App.jsx:8 Uncaught TypeError: styled.button is not a function

I initialized a project with the tagged template literal syntax, run the following command.
panda init -p --syntax template-literal --jsx-framework react

also add following flag at panda config file
jsxFramework: "react",

Here is my code :

import { styled } from "../styled-system/jsx";
const Button = styled.button` background-color: #fff; border: 1px solid #000; color: #000; padding: 0.5rem 1rem; `;

<Button />

Is anything I miss here ? Thanks

[anubra266]

@ryanpark I'm unable to reproduce
https://play.panda-css.com/iYzHt7FaPX
Might have forgotten to re run panda codegen

[ryanpark]

Thanks @anubra266
It's syntax: 'template-literal', I need to add this one at config file

But I found another issue with cva. The issue has already been posted as shown below:
#987

See example
https://play.panda-css.com/O6LaqoPWVn

[anubra266]

Your pánda Init should add it automatically cause you added the syntax flag