Fold classes in custom `cn` function
Closed this issue · 2 comments
davidpaulsson commented
Hey! Thanks for a great little library ✨
Is it possible to modify the settings somehow to hide classes in custom fns? I see you support clsx #26 for example.
I have this fn called cn
that looks like this (clsx & twMerge, pattern made popular by shadcn/ui and others)
import { type ClassValue, clsx } from 'clsx';
import { twMerge } from 'tailwind-merge';
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs));
}
I'd like to fold classes that look like this basically
<h1
className={cn('max-w-[14ch] text-balance font-bold', {
'text-[clamp(2.75rem,7.7cqw,7.5rem)] leading-[clamp(3rem,8cqw,8rem)]': !isPageHero,
'text-2xl ml:text-3xl': isPageHero,
})}
>
{title}
</h1>
kpyszkowski commented
+1
I need it a lot!
For cva
function as well. Would be great to implement adjustable regex just like Tailwind IntelliSense VSCode extension does:
{
"tailwindCSS.experimental.classRegex": [
["cva\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"],
["cn\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"]
]
}
stivoat commented
Just released an update