3 ms·
What makes it better compared to de-facto standard `classnames` library? const styles = tw({ base: "p-4 rounded-lg shadow-md", dark: { if: isDark
by StrandedKitty 2y ago
What makes it better compared to de-facto standard `classnames` library?
const styles = tw({
base: "p-4 rounded-lg shadow-md",
dark: { if: isDarkMode, classes: "bg-gray-800 text-white" },
light: { if: !isDarkMode, classes: "bg-white text-black" },
});
can be written as
const styles = classNames("p-4 rounded-lg shadow-md", {
"bg-gray-800 text-white": isDarkMode,
"bg-white text-black": !isDarkMode,
});
which requires less boilerplate and arguably looks a bit cleaner.
- encodeincode 2y agoThank you for your feedback. To be honest, I wasn’t aware of the classnames library, so thank you for pointing it out. When designing `tw`, I wanted to use an object-based approach, since it felt more intuitive. I appreciate you letting me know about something I wasn’t aware of.