Support TaggedTemplateExpression
Closed this issue ยท 4 comments
alex-kinokon commented
Is your feature request related to a problem? Please describe
Feature request.
Describe the solution you'd like
Support tagged template expressions in addition to custom functions. For an example taken from https://github.com/tailwindlabs/prettier-plugin-tailwindcss#sorting-classes-in-template-literals:
{
"tailwindFunctions": ["tw"],
}
const mySortedClasses = tw`bg-white p-4 dark:bg-black`
Describe alternatives you've considered
Additional context
ony3000 commented
@alex-kinokon v0.6.6
has been released, check it out!
u3u commented
Hi, I encountered this error when I upgraded from 0.6.6
โ
to 0.7.0
โ.
Finally found that if backticks or TaggedTemplateExpression
are used, this error will occur.
If single quotes are used, there is no problem.
test/__fixtures__/tw.tsx
const tw = String.raw
const clsx = (...args: any) => args
const twMerge = clsx
const twJoin = clsx
export const classes = clsx(
'px-4 py-2 text-base text-white rounded bg-blue-500',
{
'text-gray-100 bg-blue-700': true,
},
)
export const styles = {
root: tw`dark:text-white text-md text-black`,
base: twMerge(['z-[1] relative', twJoin('inset-0 absolute flex items-center')]),
}
export function Callout({ children }: React.PropsWithChildren) {
return (
<label className="[view-transition-name:upload] mx-auto max-w-md cursor-pointer flex flex-col items-center justify-center gap-2 rounded-lg bg-white p-8 shadow-panel transition active:scale-95 border-2 border-dashed border-transparent can-hover:hover:border-primary hover:-translate-y-1">
{children}
</label>
);
}