v0.1.12

What's Changed

• Custom tailwind merge config cache fixed
• Performance improvements added

Benchmark

TV without slots & tw-merge (enabled) x 424,170 ops/sec ±0.15% (95 runs sampled)
TV without slots & tw-merge (disabled) x 475,632 ops/sec ±1.07% (93 runs sampled)
TV with slots & tw-merge (enabled) x 288,266 ops/sec ±1.09% (96 runs sampled)
TV with slots & tw-merge (disabled) x 331,401 ops/sec ±0.69% (95 runs sampled)
TV without slots & custom tw-merge config x 411,441 ops/sec ±0.53% (98 runs sampled)
TV with slots & custom tw-merge config x 375,262 ops/sec ±0.20% (102 runs sampled)

Fastest is TV without slots & tw-merge (disabled)

v0.1.11

What's Changed

• feat: improving performance by @TIMMLOPK in #68
• feat: tailwind merge initialized only once, it improves a lot the performance when using custom tailwind-merge config. by @jrgarciadev in #81. Ref: dcastil/tailwind-merge#4

New Contributors

• @TIMMLOPK made their first contribution in #68

Full Changelog: v0.1.10...v0.1.11

v0.1.10

What's Changed

• Fix Tailwind merge extend config by @jrgarciadev in #73

Full Changelog: v0.1.8...v0.1.10

v0.1.9

What's Changed

• Fix Tailwind Merge config, partial values accepted

v0.1.7

What's Changed

• Fix VariantProps are of type any by @zwagnr in #60
• Fix support typescript 5.1.3 by @tianenpang in #62

New Contributors

• @zwagnr made their first contribution in #60

Full Changelog: v0.1.6...v0.1.7

v0.1.6

What's Changed

• Fix types by @mskelton in #41

Full Changelog: v0.1.5...v0.1.6

v0.1.5

What's Changed

Performance improvement. 🚀

• Use TVReturnType to prevent circular references by @mskelton in #39

Before

Screen.Recording.2023-04-25.at.9.28.41.PM.mov

After

Screen.Recording.2023-04-25.at.9.29.23.PM.mov

New Contributors

• @mskelton made their first contribution in #39

Huge thanks to @mskelton 🚀

Full Changelog: v0.1.3...v0.1.5

v0.1.3

What's Changed

• Fix: Update CONTRIBUTING.md by @acald-creator in #26
• feat: avoid empty strings in the result by @tianenpang in #38

New Contributors

• @acald-creator made their first contribution in #26

Full Changelog: v0.1.2...v0.1.3

v0.1.2

What's Changed

🐛 Fixes

• fix: exclude transform without responsive variants by @tianenpang in #30

Credits

Huge thanks to @tianenpang 🙏🏻

Full Changelog: v0.1.1...v0.1.2

v0.1.0

What's Changed

🚀 Features

• On-Demand transform. by @tianenpang
• New config api responsiveVariants. by @tianenpang
• New parameter added compoundSlots to apply classes to multiple slots at once, this reduces the amount of repeated code by @jrgarciadev
• tailwind-merge package upgraded to 1.10.0 by @jrgarciadev

🐛 Fixes

• Fixed issue with failed transform when using extend. by @tianenpang
• Fixed issue with children slots are now being returned for extended tv functions with slots #23 by @jrgarciadev

⚙️ Refactor

• Types declaration improved by @jrgarciadev
• Tests improved by @jrgarciadev

🔴 Breaking Changes

To be able to use Responsive Variants you need to include responsiveVariants: true or responsiveVariants:['xs', 'sm', ....allDesiredVariants'] in the configuration object. This ensures that tv functions only generate responsive variants for the specified breakpoints, significantly reducing the amount of CSS generated in the final bundle.

Example:

const button = tv({
  base: "font-semibold text-white py-1 px-3 rounded-full active:opacity-80",
  variants: {
	color: {
		primary: "bg-blue-500 hover:bg-blue-700",
		secondary: "bg-purple-500 hover:bg-purple-700",
		success: "bg-green-500 hover:bg-green-700",
	},
	size: {
		small: "py-1 px-2 text-xs",
		medium: "py-1 px-2 text-sm",
		large: "py-1.5 px-3 text-md",
	},
  },
},
+ {
+  responsiveVariants: ['sm', 'md']
+ }
);

// the function call remains unchanged.
button({
	color: {
		initial: "primary",
		sm: "success",
		md: "secondary",
	},
	size: {
		initial: "small",
		sm: "medium",
		md: "large",
	},
})}

Credits

Huge thanks to @tianenpang 🙏🏻

Stay tuned to the documentation website for examples. 🚀

Full Changelog: v0.0.31...v0.1.0