Compare Versions - tailwind-merge
npm / tailwind-merge / Compare Versions
New Features
- Add support for Tailwind CSS v4.2 by @dcastil in https://github.com/dcastil/tailwind-merge/pull/651
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v3.4.1...v3.5.0
Thanks to @brandonmcconnell, @manavm1990, @langy, @roboflow, @syntaxfm, @getsentry, @codecov, a private sponsor, @block, @openclaw, @sourcegraph and more via @thnxdev for sponsoring tailwind-merge! ❤️
Bug Fixes
- Prevent arbitrary font-family and font-weight from merging by @roneymoon in https://github.com/dcastil/tailwind-merge/pull/635
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v3.4.0...v3.4.1
Thanks to @brandonmcconnell, @manavm1990, @langy, @roboflow, @syntaxfm, @getsentry, @codecov, a private sponsor, @block, @openclaw, @sourcegraph and more via @thnxdev for sponsoring tailwind-merge! ❤️
New Features
- Performance optimizations which make tailwind-merge >10% faster
- Vibe optimization by @quantizor in https://github.com/dcastil/tailwind-merge/pull/547
- Additional optimizations by @quantizor in https://github.com/dcastil/tailwind-merge/pull/619
Documentation
- Improve docs by clarifying things, adding more examples by @dcastil in https://github.com/dcastil/tailwind-merge/pull/618
- Make examples more realistic by @dcastil in https://github.com/dcastil/tailwind-merge/pull/617
- Add custom variant as an alternative to docs by @kidonng in https://github.com/dcastil/tailwind-merge/pull/592
Other
- Improve benchmarking suite by @quantizor in https://github.com/dcastil/tailwind-merge/pull/620
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v3.3.1...v3.4.0
Thanks to @brandonmcconnell, @manavm1990, @langy, @roboflow, @syntaxfm, @getsentry, @codecov and a private sponsor for sponsoring tailwind-merge! ❤️
Bug Fixes
- Fix arbitrary value using
color-mix()not being detected as color by @dcastil in https://github.com/dcastil/tailwind-merge/pull/591
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v3.3.0...v3.3.1
Thanks to @brandonmcconnell, @manavm1990, @langy, @roboflow, @syntaxfm, @getsentry, @codecov, @sourcegraph, a private sponsor, @block and @shawt3000 for sponsoring tailwind-merge! ❤️
New Features
- Add support for tailwind CSS v4.1.5 by @dcastil in https://github.com/dcastil/tailwind-merge/pull/575
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v3.2.0...v3.3.0
Thanks to @brandonmcconnell, @manavm1990, @langy, @roboflow, @syntaxfm, @getsentry, @codecov, @sourcegraph, a private sponsor and @block for sponsoring tailwind-merge! ❤️
New Features
- Add support for Tailwind CSS v4.1 by @dcastil in https://github.com/dcastil/tailwind-merge/pull/565
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v3.1.0...v3.2.0
Thanks to @brandonmcconnell, @manavm1990, @langy, @jamesreaco, @roboflow, @syntaxfm, @getsentry, @codecov, @sourcegraph and a private sponsor for sponsoring tailwind-merge! ❤️
New Features
- Add support for Tailwind CSS v4.0.10 by @dcastil in https://github.com/dcastil/tailwind-merge/pull/546
Bug Fixes
- Fix length variable in
via-(length:*)class being merged withvia-<color>classes accidentally by @dcastil in https://github.com/dcastil/tailwind-merge/pull/559
Documentation
- Fix typo in comment in types.ts by @roottool in https://github.com/dcastil/tailwind-merge/pull/549
- Update shadow scale recipe to tailwind merge v3 API by @dcastil in https://github.com/dcastil/tailwind-merge/pull/545
Other
- Fix metrics report action erroring on PRs from forks by @dcastil in https://github.com/dcastil/tailwind-merge/pull/551
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v3.0.2...v3.1.0
Thanks to @brandonmcconnell, @manavm1990, @langy, @jamesreaco, @roboflow, @syntaxfm, @getsentry, @codecov, @sourcegraph and a private sponsor for sponsoring tailwind-merge! ❤️
Bug Fixes
- Fix
pxvalue not being recognized for some class groups by @dcastil in https://github.com/dcastil/tailwind-merge/pull/538 - Fix doc comment being in incorrect place in default config by @gjtorikian in https://github.com/dcastil/tailwind-merge/pull/526
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v3.0.1...v3.0.2
Thanks to @brandonmcconnell, @manavm1990, @langy, @jamesreaco, @roboflow, @syntaxfm, @getsentry, @codecov, @sourcegraph and a private sponsor for sponsoring tailwind-merge! ❤️
Bug Fixes
- Update info about supported Tailwind CSS version in README by @dcastil in b9c136d
- Update incorrect link in v3 changelog by @dcastil in e22885e
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v3.0.0...v3.0.1
Thanks to @brandonmcconnell, @manavm1990, @langy, @jamesreaco, @roboflow, @syntaxfm, @getsentry, @codecov, @sourcegraph and a private sponsor for sponsoring tailwind-merge! ❤️
Tailwind CSS v4 is here and it's time to upgrade tailwind-merge to support it. tailwind-merge v3.0.0 is more accurate than ever and follows the Tailwind CSS spec more closely than in v2. That is thanks to Tailwind CSS v4 being more consistent than ever.
This release drops support for Tailwind CSS v3 and in turn adds support for Tailwind CSS v4. That means you should upgrade to Tailwind CSS v4 and tailwind-merge v3 together. All breaking changes are related to the Tailwind CSS v4 support.
Check out the migration guide and if you have any questions, feel free to create an issue.
Breaking Changes
- Dropping support for Tailwind CSS v3 in favor of support for Tailwind CSS v4 by @dcastil in https://github.com/dcastil/tailwind-merge/pull/518
- Theme scales keys changed and now match Tailwind CSS v4 theme variable namespace exactly by @dcastil in https://github.com/dcastil/tailwind-merge/pull/518
isLengthvalidator was removed and split into separate validatorsisNumberandisFractionby @dcastil in https://github.com/dcastil/tailwind-merge/pull/518- Prefix defined in config shouldn't include combining
-character anymore by @dcastil in https://github.com/dcastil/tailwind-merge/pull/518 - Tailwind CSS v3 prefix position in class not supported anymore in favor of Tailwind CSS v4 position by @dcastil in https://github.com/dcastil/tailwind-merge/pull/518
- Custom separators are no longer supported by @dcastil in https://github.com/dcastil/tailwind-merge/pull/518
- New mandatory
orderSensitiveModifiersproperty in config when usingcreateTailwindMergeby @dcastil in https://github.com/dcastil/tailwind-merge/pull/518 DefaultThemeGroupIdstype union consists of different string literals than before by @dcastil in https://github.com/dcastil/tailwind-merge/pull/518- Classes removed in Tailwind CSS v4 are not supported by tailwind-merge anymore by @dcastil in https://github.com/dcastil/tailwind-merge/pull/518
New Features
- Support for new important modifier position at the end of class by @dcastil in https://github.com/dcastil/tailwind-merge/pull/518
- Support for arbitrary CSS variable syntax by @dcastil in https://github.com/dcastil/tailwind-merge/pull/518
- There are a bunch of new validators used by tailwind-merge, primarily for new Tailwind CSS v4 features like arbitrary CSS variables by @dcastil in https://github.com/dcastil/tailwind-merge/pull/518
Bug Fixes
- Previously some order-sensitive modifiers like
before:were treated as not order-sensitive. This is now fixed by @dcastil in https://github.com/dcastil/tailwind-merge/pull/518
Documentation
- Added section explaining order-sensitive modifiers to configuration docs by @dcastil in https://github.com/dcastil/tailwind-merge/pull/518
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.6.0...v3.0.0
Thanks to @brandonmcconnell, @manavm1990, @langy, @jamesreaco, @roboflow, @syntaxfm, @getsentry, @codecov, @sourcegraph and a private sponsor for sponsoring tailwind-merge! ❤️
Bug Fixes
- Fix arbitrary value using
color-mixnot being detected as color by @dcastil in #591- This fix was backported from v3.3.1 to make it available for v2 users.
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.6.0...v2.6.1
Thanks to @brandonmcconnell, @manavm1990, @langy, @roboflow, @syntaxfm, @getsentry, @codecov, a private sponsor, @block, @openclaw and more via @thnxdev for sponsoring tailwind-merge! ❤️
New Features
- Export ConfigExtension type from package by @dcastil in https://github.com/dcastil/tailwind-merge/pull/505
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.5.5...v2.6.0
Thanks to @brandonmcconnell, @manavm1990, @langy, @jamesreaco, @roboflow, @syntaxfm, @getsentry, @codecov, @sourcegraph, a private sponsor and more via @thnxdev for sponsoring tailwind-merge! ❤️
Bug Fixes
- Fix typo "fractons" instead of "fractions" in "stacked-fractions" class by @oliverhaas in https://github.com/dcastil/tailwind-merge/pull/492
Documentation
- Add installation instructions to configuration docs by @dcastil in https://github.com/dcastil/tailwind-merge/pull/486
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.5.4...v2.5.5
Thanks to @brandonmcconnell, @manavm1990, @langy, @jamesreaco, @roboflow, @syntaxfm, @getsentry, @codecov and more via @thnxdev for sponsoring tailwind-merge! ❤️
Bug Fixes
- Fix incorrect paths within sourcemaps by @dcastil in https://github.com/dcastil/tailwind-merge/pull/483
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.5.3...v2.5.4
Thanks to @brandonmcconnell, @manavm1990, @langy, @jamesreaco, @roboflow and @codecov for sponsoring tailwind-merge! ❤️
Bug Fixes
- Add missing logical border color properties by @sherlockdoyle in https://github.com/dcastil/tailwind-merge/pull/478
Documentation
- Add benchmark reporting to PRs and commits by @XantreDev in https://github.com/dcastil/tailwind-merge/pull/455
Other
- Switch test suite to vitest by @dcastil in https://github.com/dcastil/tailwind-merge/pull/461
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.5.2...v2.5.3
Thanks to @brandonmcconnell, @manavm1990, @langy, @jamesreaco, @roboflow, @xeger and @MrDeatHHH for sponsoring tailwind-merge! ❤️
Sorry for all the bugs today!
Bug Fixes
- Fix multiline input not working anymore by @dcastil in https://github.com/dcastil/tailwind-merge/pull/459
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.5.1...v2.5.2
Thanks to @brandonmcconnell, @manavm1990, @langy, @jamesreaco and @jamaluddinrumi for sponsoring tailwind-merge! ❤️
Bug Fixes
- Fix space at beginning of input causing infinite loop by @dcastil in https://github.com/dcastil/tailwind-merge/pull/457
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.5.0...v2.5.1
Thanks to @brandonmcconnell, @manavm1990, @langy, @jamesreaco and @jamaluddinrumi for sponsoring tailwind-merge! ❤️
New Features
- Performance improvements in mergeClassList by @XantreDev in https://github.com/dcastil/tailwind-merge/pull/450 and @rortan134 in https://github.com/dcastil/tailwind-merge/pull/445
- Use arrow functions where possible to help with minification by @VIKTORVAV99 in https://github.com/dcastil/tailwind-merge/pull/449
Bug Fixes
- Fix bg-opacity arbitrary percentages not being recognized properly by @dcastil in https://github.com/dcastil/tailwind-merge/pull/451
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.4.0...v2.5.0
Thanks to @brandonmcconnell, @manavm1990, @langy and @jamesreaco for sponsoring tailwind-merge! ❤️
New Features
- Allow hooking into class parsing logic (experimental) by @dcastil in https://github.com/dcastil/tailwind-merge/pull/444
- There is no info to this in the docs because this is experimental, but there is a new
experimentalParseClassNameproperty in the config that allows you to customize how tailwind-merge recognizes classes. If you're interested, you can read how to use it in the inline JSDocs and subscribe to https://github.com/dcastil/tailwind-merge/issues/385 for upcoming more powerful low-level functionality.
- There is no info to this in the docs because this is experimental, but there is a new
- Create security policy by @dcastil in https://github.com/dcastil/tailwind-merge/pull/439
- Added documentation on how to report potential vulnerabilities
- Avoid
@babel/runtimedependency by @dcastil in https://github.com/dcastil/tailwind-merge/pull/431- Now no dependencies in tailwind-merge anymore. This dependency was only used in the
tailwind-merge/es5bundle anyway which I don't optimize for.
- Now no dependencies in tailwind-merge anymore. This dependency was only used in the
Documentation
- Comment/typo fixes by @barvian in https://github.com/dcastil/tailwind-merge/pull/443
- Fix typo in doc/recipes.md by @dsernst in https://github.com/dcastil/tailwind-merge/pull/428
- Add tailwind-merge-dotnet to similar packages by @desmondinho in https://github.com/dcastil/tailwind-merge/pull/415
Other
- Added GitHub Action that adds context-v2 label to every issue, discussion and PR by @Pritam1211 in https://github.com/dcastil/tailwind-merge/pull/434
- Replace size-limit action with own metrics-report action by @dcastil in https://github.com/dcastil/tailwind-merge/pull/433
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.3.0...v2.4.0
Thanks to @brandonmcconnell, @manavm1990, @langy, @jamesreaco and @microsoft for sponsoring tailwind-merge! ❤️
New Features
- Add support for mix-blend-plus-darker utility by @dcastil in https://github.com/dcastil/tailwind-merge/pull/403
- Added support for bigint in ClassNameValue type by @LarsArtmann in https://github.com/dcastil/tailwind-merge/pull/402
Documentation
- Add tailwind-merge-go to similar packages in docs by @Oudwins in https://github.com/dcastil/tailwind-merge/pull/396
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.2.2...v2.3.0
Thanks to @brandonmcconnell, @manavm1990, @langy and @jamesreaco for sponsoring tailwind-merge! ❤️
Bug Fixes
- Fix arbitrary shadow with inset not recognized by @dcastil in https://github.com/dcastil/tailwind-merge/pull/392
Documentation
- Fix minor typos in
configuration.mdby @stephan281094 in https://github.com/dcastil/tailwind-merge/pull/372
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.2.1...v2.2.2
Thanks to @brandonmcconnell, @manavm1990, @langy, a private sponsor and @jamesreaco for sponsoring tailwind-merge! ❤️
Bug Fixes
- Fix stroke-color being incorrectly detected as stroke-width by @dcastil in https://github.com/dcastil/tailwind-merge/pull/371
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.2.0...v2.2.1
Thanks to @brandonmcconnell, @manavm1990 and @langy for sponsoring tailwind-merge! ❤️
New Features
- Add support for Tailwind CSS v3.4 by @dcastil in https://github.com/dcastil/tailwind-merge/pull/360
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.1.0...v2.2.0
Thanks to @brandonmcconnell, @manavm1990, @ErwinAI and @langy for sponsoring tailwind-merge! ❤️
New Features
- Add
ClassValidatortype to package exports by @dcastil in https://github.com/dcastil/tailwind-merge/pull/348
Bug Fixes
- Fix display class not removed when it precedes line-clamp class by @dcastil in https://github.com/dcastil/tailwind-merge/pull/347
Documentation
- Fix curly bracket typo in config docs by @Kosai106 in https://github.com/dcastil/tailwind-merge/pull/349
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v2.0.0...v2.1.0
Thanks to @brandonmcconnell, @manavm1990, @ErwinAI and @langy for sponsoring tailwind-merge! ❤️
The tailwind-merge v2 release has been sitting here almost finished for 2 months already. But the timing was never quite right, especially thinking about the increased support needed after the release. In the meantime, the product of the company I work at launched in public beta and I married. Thank you for your patience.
This release focuses on making it easier to configure the library for new users. Check out the migration guide and if you have any questions, feel free to create an issue.
Breaking Changes
- Fix
background-imageandbackground-positionbeing merged incorrectly by @dcastil in https://github.com/dcastil/tailwind-merge/pull/300- Values for
background-positionandbackground-sizecan look very similar and Tailwind CSS uses the samebg-prefix for both groups. This results in some limitations for tailwind-merge. If you use background position or background size with arbitrary values, please read this section about how to use them.
- Values for
- Make types of available keys more strict and configurable through generics by @kachkaev in https://github.com/dcastil/tailwind-merge/pull/279
- Make it possible to override elements with
extendTailwindMergeby @dcastil in https://github.com/dcastil/tailwind-merge/pull/294 - Separate validators better by @dcastil in https://github.com/dcastil/tailwind-merge/pull/292
- Make
conflictingClassGroupModifiersin config non-optional by @dcastil in https://github.com/dcastil/tailwind-merge/pull/291 - Move separator to config by @dcastil in https://github.com/dcastil/tailwind-merge/pull/290
- Remove
modulefield from package.json by @dcastil in https://github.com/dcastil/tailwind-merge/pull/289 - Remove deprecated exports by @dcastil in https://github.com/dcastil/tailwind-merge/pull/288
- Transpile lib to more modern JS by @dcastil in https://github.com/dcastil/tailwind-merge/pull/287
New Features
- Make types of available keys more strict and configurable through generics by @kachkaev in https://github.com/dcastil/tailwind-merge/pull/279
- Make it possible to override elements with
extendTailwindMergeby @dcastil in https://github.com/dcastil/tailwind-merge/pull/294 - Separate validators better by @dcastil in https://github.com/dcastil/tailwind-merge/pull/292
- Make
conflictingClassGroupModifiersin config non-optional by @dcastil in https://github.com/dcastil/tailwind-merge/pull/291 - Move separator to config by @dcastil in https://github.com/dcastil/tailwind-merge/pull/290
- Remove
modulefield from package.json by @dcastil in https://github.com/dcastil/tailwind-merge/pull/289 - Remove deprecated exports by @dcastil in https://github.com/dcastil/tailwind-merge/pull/288
- Transpile lib to more modern JS by @dcastil in https://github.com/dcastil/tailwind-merge/pull/287
- Add ES5 bundle by @dcastil in https://github.com/dcastil/tailwind-merge/pull/286
Bug Fixes
- Fix touch action classes overriding each other incorrectly by @dcastil in https://github.com/dcastil/tailwind-merge/pull/313
- Fix
background-imageandbackground-positionbeing merged incorrectly by @dcastil in https://github.com/dcastil/tailwind-merge/pull/300 - Fix number validators accidentally returning
truefor empty strings by @dcastil in https://github.com/dcastil/tailwind-merge/pull/295 - Rename lazy-initializaton.test.ts to lazy-initialization.test.ts by @CrutchTheClutch in https://github.com/dcastil/tailwind-merge/pull/284
Documentation
- Explain limitations of arbitrary values in
bg-sizeandbg-positionclass groups in docs by @dcastil in https://github.com/dcastil/tailwind-merge/pull/328
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.14.0...v2.0.0
Thanks to @quezlatch, @brandonmcconnell, @manavm1990 and @ErwinAI for sponsoring tailwind-merge! ❤️
New Features
- Improve support for arbitrary values by @dcastil in https://github.com/dcastil/tailwind-merge/pull/263
- Previously, tailwind-merge checked the content of the arbitrary value portion of a class in most cases to understand whether the type of the arbitrary value is correct (e.g. it checked for number followed by length unit for the length type). That lead to the issue that a class like
mt-[calc(theme(fontSize.4xl)/1.125)]would not be recognized correctly because no length unit is present in the arbitrary value. - I changed the check of the arbitrary value to also pass when a
calc(),min(),max()andclamp()function is used in the arbitrary value. - In ambiguous cases, you can use data type labels to mark the type of a class. Read more
- Moreover, I removed the check where the type of the arbitrary value is unambiguous. In the class
mt-[…]the arbitrary value can only be a length, so I don't check for it. A consequence of this is that if you use non-Tailwind classes likemt-[this-is-totally-not-tailwind], tailwind-merge will recognize it as a Tailwind class from now on. Please don't use classes that look like Tailwind classes with arbitrary value but aren't Tailwind classes with tailwind-merge (in default config) to prevent incorrect merging behavior.
- Previously, tailwind-merge checked the content of the arbitrary value portion of a class in most cases to understand whether the type of the arbitrary value is correct (e.g. it checked for number followed by length unit for the length type). That lead to the issue that a class like
Bug Fixes
- Fix
col-span-fullclass missing in default config by @dcastil in https://github.com/dcastil/tailwind-merge/pull/267 - Fix arbitrary value with no present length unit not being recognized by @dcastil in https://github.com/dcastil/tailwind-merge/pull/263
Documentation
- Add missing info about where to call config functions to docs by @dcastil in https://github.com/dcastil/tailwind-merge/pull/264
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.13.2...v1.14.0
Bug Fixes
- Fix TypeScript issue when using
moduleResolution: node16by @LiamMartens in https://github.com/dcastil/tailwind-merge/pull/245
Documentation
- Fix grammar and typos in docs by @jmmarco in https://github.com/dcastil/tailwind-merge/pull/249
- Add tailwind-merge-php to similar packages in docs by @JamesHemery in https://github.com/dcastil/tailwind-merge/pull/246
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.13.1...v1.13.2
Thanks to @bluetch for sponsoring tailwind-merge! ❤️
Bug Fixes
- Fix
basis-autoandbasis-fullnot being merged correctly by @lukasz-kapica in https://github.com/dcastil/tailwind-merge/pull/242
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.13.0...v1.13.1
This release focuses on improvements to the docs.
Bug Fixes
- Fix arbitrary length
0without unit not being recognized by @dcastil in https://github.com/dcastil/tailwind-merge/pull/237 - Fix typo in comment in default-config.ts by @CrutchTheClutch in https://github.com/dcastil/tailwind-merge/pull/227
Documentation
- Add intro video from Simon Vrachliotis to docs by @dcastil in https://github.com/dcastil/tailwind-merge/pull/239
- @simonswiss made an intro video to tailwind-merge which I added to the docs. Check it out here!
- Add docs about when to use tailwind-merge by @dcastil in https://github.com/dcastil/tailwind-merge/pull/230
- I added a new page to the docs about when and how to use tailwind-merge which should help you to decide whether you should use it and what alternative approaches exist.
- Make it clearer in docs that tailwind-merge supports composition of class strings by @dcastil in https://github.com/dcastil/tailwind-merge/pull/229
Other
- Add npm package provenance by @dcastil in https://github.com/dcastil/tailwind-merge/pull/219
- GitHub introduced a new security feature to verify which source commit and build file were used for a specific npm package version. tailwind-merge now publishes provenance signatures alongside all releases on npm. Read more on the GitHub blog.
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.12.0...v1.13.0
With this release tailwind-merge supports all features introduced in Tailwind CSS v3.3.
New Features
- Add support for postfix modifier by @dcastil in https://github.com/dcastil/tailwind-merge/pull/214
- This adds support for
line-heightmodifiers infont-sizeutilities liketext-lg/7and more potential postfix modifiers in the future (learn more). - All classes are checked for postfix modifiers since there will be more in the future and they'll be configurable with plugins.
- tailwind-merge can't know from the class syntax alone whether something is a modifier or not. E.g. there is
w-1/2which doesn't contain a modifier. So tailwind-merge always checks whether class without potential modifier exists and if it doesn't it checks for full class. This behavior might get reversed in the next major version as a breaking change (learn more). - Added
conflictingClassGroupModifiersobject to tailwind-merge config (learn more).
- This adds support for
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.11.0...v1.12.0
New Features
- Add support for Tailwind CSS v3.3 except line-height shorthand by @dcastil in https://github.com/dcastil/tailwind-merge/pull/210
- The line-height shorthand in font-size utilities (
text-lg/7) introduced in Tailwind CSS v3.3 is not yet supported in tailwind-merge because that feature is a bit more involved. I'll add support for it in a future release. More info in https://github.com/dcastil/tailwind-merge/issues/211. - Added new validator
isPercentwhich is needed internally for the default scale of color stop positions. - New theme key
gradientColorStopPositionssupported in tailwind-merge. - New logical properties like
ps-0(padding-inline-start: 0px;) are de-duplicated away when using the matching property for all sides afterwards like in this casep-0, but not when using single axis sides likepx-0becausepadding-inline-startcan also be the top or bottom padding depending on writing mode.- Basically
twMerge('ps-0 p-0') === 'p-0' && twMerge('ps-0 px-0') === 'ps-0 px-0'. - If you want to use logical properties and know which writing modes your app is limited to, add the right conflicts yourself to your tailwind-merge config.
- Basically
- The line-height shorthand in font-size utilities (
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.10.0...v1.11.0
Thanks to @brandonmcconnell for sponsoring tailwind-merge! ❤️
New Features
- Add support for container query length units in arbitrary values by @LesnoyPudge in https://github.com/dcastil/tailwind-merge/pull/204
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.9.1...v1.10.0
Bug Fixes
- Fix arbitrary floats not supported in opacity, scale, etc. by @dcastil in https://github.com/dcastil/tailwind-merge/pull/196
- Up until now classes like
opacity-50 opacity-[.025]weren't merged correctly. You might not have noticed since classes with arbitrary values are defined after the default ones in the output stylesheet, but merging it the other way around (opacity-[.025] opacity-50) would have led to a styling bug. - This fix led to a new validator
isNumber.
- Up until now classes like
- Fix arbitrary border color value being merged incorrectly by @dcastil in https://github.com/dcastil/tailwind-merge/pull/195
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.9.0...v1.9.1
New Features
- Support decimals in T-shirt sizes by @farreldarian in https://github.com/dcastil/tailwind-merge/pull/189
Documentation
- Fixes typo in recipes docs by @nicklemmon in https://github.com/dcastil/tailwind-merge/pull/181
Other
- Added test case by @chuanyu0201 in https://github.com/dcastil/tailwind-merge/pull/186
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.8.1...v1.9.0
Bug Fixes
- Fix incorrect class group conflicts in grid-related classes by @dcastil in https://github.com/dcastil/tailwind-merge/pull/177
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.8.0...v1.8.1
Thanks to @aniravi24 for sponsoring tailwind-merge! ❤️
New Features
- Add support for custom separator by @dcastil in https://github.com/dcastil/tailwind-merge/pull/168
- Add support for dynamic viewport units in arbitrary lengths by @dcastil in https://github.com/dcastil/tailwind-merge/pull/166
- Rename
jointotwJoinby @dcastil in https://github.com/dcastil/tailwind-merge/pull/161- I deprecated the
joinfunction and renamed it totwJointo make replacing it via search and replace easier sincejoinis a common function name. You don't need to change anything right now, but if you have some spare time, rename join → twJoin in your code since thejoinfunction will be removed in the next major release.
- I deprecated the
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.7.0...v1.8.0
Thanks to @gjtorikian for sponsoring tailwind-merge! ❤️
New Features
- Add support for Tailwind CSS v3.2 by @dcastil and @brandonmcconnell in https://github.com/dcastil/tailwind-merge/pull/159
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.6.2...v1.7.0
Bug Fixes
- Fix arbitrary numbers not working in stroke-width by @dcastil in https://github.com/dcastil/tailwind-merge/pull/153
- Now tailwind-merge handles classes like
stroke-[3]correctly. - I deprecated the validator
isArbitraryWeightand renamed it toisArbitraryNumberto reflect its broader use case. You don't need to change anything right now, but if you have some spare time, renameisArbitraryWeight→isArbitraryNumberin your code sinceisArbitraryWeightwill be removed in the next major release.
- Now tailwind-merge handles classes like
Other
- Add package version number to dev releases by @dcastil in https://github.com/dcastil/tailwind-merge/pull/154
- Now dev releases don't start with
0.0.0-devanymore and instead have the version number of the last release, like1.6.1-dev. That makes it easier for tools like Renovate to understand which package version you're using in case you use dev releases.
- Now dev releases don't start with
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.6.1...v1.6.2
Bug Fixes
- Fix h-min not working by @dcastil in https://github.com/dcastil/tailwind-merge/pull/146
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.6.0...v1.6.1
New Features
- Add support for arrays as argument by @dcastil in https://github.com/dcastil/tailwind-merge/pull/127
- You can now use arbitrarily nested arrays as arguments to
twMerge. That's especially handy for nested conditions.twMerge('…', someBool && ['…', anotherBool && '…']) - The joining of arguments is done with a new
joinfunction which is present in the tailwind-merge exports as well. It has the same functionality as clsx but without support for objects as arguments which makes it a little faster. - Why no objects as arguments? You can read about my reasoning in https://github.com/dcastil/tailwind-merge/discussions/137#discussioncomment-3481605.
- You can now use arbitrarily nested arrays as arguments to
Bug Fixes
- Replace matchAll with exec by @dcastil in https://github.com/dcastil/tailwind-merge/pull/133
- This makes tailwind-merge work in older browsers which don't support
String.prototype.matchAll()
- This makes tailwind-merge work in older browsers which don't support
Other
- Add recipes section to docs by @dcastil in https://github.com/dcastil/tailwind-merge/pull/134
- Split docs into multiple files by @dcastil in https://github.com/dcastil/tailwind-merge/pull/131
- Add comments to released PRs and their related issues by @dcastil in https://github.com/dcastil/tailwind-merge/pull/130
- Add tests to check actual CJS and ESM package exports by @dcastil in https://github.com/dcastil/tailwind-merge/pull/129
- Remove ts files from npm package by @dcastil in https://github.com/dcastil/tailwind-merge/pull/128
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.5.1...v1.6.0
Thanks to @charkour for sponsoring tailwind-merge! ❤️
Bug Fixes
- Fix arbitrary z-index value not being recognized by @dcastil in https://github.com/dcastil/tailwind-merge/pull/116
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.5.0...v1.5.1
Thanks to @charkour for sponsoring tailwind-merge! ❤️
New Features
- Added missing ESM
typessubpath export condition by @scott-lc in https://github.com/dcastil/tailwind-merge/pull/113- This makes tailwind-merge work in TypeScript projects using the new
nodenextmodule type introduced in TypeScript 4.7.
- This makes tailwind-merge work in TypeScript projects using the new
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.4.0...v1.5.0
Thanks to @charkour for sponsoring tailwind-merge! ❤️
New Features
- Optimize runtime performance by using Map by @dcastil in https://github.com/dcastil/tailwind-merge/pull/105
Bug Fixes
- Fix overriding w-full with w-fit not working by @dcastil in https://github.com/dcastil/tailwind-merge/pull/112
Other
- Publish dev releases of every commit on main branch by @dcastil in https://github.com/dcastil/tailwind-merge/pull/104
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.3.0...v1.4.0
Thanks to @charkour for sponsoring tailwind-merge! ❤️
New Features
- Add support for Tailwind v3.1 by @dcastil in https://github.com/dcastil/tailwind-merge/pull/103
Bug Fixes
- Fix readme typos by @oshi97 in https://github.com/dcastil/tailwind-merge/pull/102
- Fix typos in comments by @szamanr in https://github.com/dcastil/tailwind-merge/pull/89
Other
- Add community health files by @dcastil in https://github.com/dcastil/tailwind-merge/pull/93
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.2.1...v1.3.0
Thanks to @charkour for sponsoring tailwind-merge! ❤️
Bug Fixes
- Fix isArbitraryWeight incorrectly using
weight:instead ofnumber:for disambiguation for arbitrary values by @liuqiang1357 in https://github.com/dcastil/tailwind-merge/pull/85 - Fix typos in README.md by @Gri-ffin in https://github.com/dcastil/tailwind-merge/pull/82
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.2.0...v1.2.1
Thanks to @charkour for sponsoring tailwind-merge! ❤️
New Features
- Add prefix support by @dcastil in https://github.com/dcastil/tailwind-merge/pull/78
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.1.1...v1.2.0
Thanks to @charkour for sponsoring tailwind-merge! ❤️
Bug Fixes
- Fix TypeScript types not being linked correctly in package.json by @navin-moorthy and @dcastil in https://github.com/dcastil/tailwind-merge/pull/75
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.1.0...v1.1.1
New Features
- Fix missing arbitrary value support in some class groups by @dcastil in https://github.com/dcastil/tailwind-merge/pull/73
- Adds arbitrary value support for class groups
grayscale,invert,sepia,grow,shrink,object-position,shadow,drop-shadow,rotate,skewandtransform-origin - Fixes
break-insideclasses being merged incorrectly - Adds missing classes
overline,underline-offset,content-none - Fixes typo in class group name
bg-repeeat→bg-repeat - Adds
isArbitraryShadowvalidator
- Adds arbitrary value support for class groups
- Improve tree-shaking by @dcastil in https://github.com/dcastil/tailwind-merge/pull/65
- I changed the build output significantly here and removed
"type": "module"from the package.json. I did test the new npm package output in Node and in the browser, but it's hard to account for every possible build system tailwind-merge is used in. If some issues come up with bundling tailwind-merge, please open an issue!
- I changed the build output significantly here and removed
Bug Fixes
- Fix stroke-color utilities being merged with stroke-width utilities by @dcastil in https://github.com/dcastil/tailwind-merge/pull/72
- Fix mix-blend utilities getting merged incorrectly by @dcastil in https://github.com/dcastil/tailwind-merge/pull/71
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v1.0.0...v1.1.0
v1! 🎉
Overview
After being 5 months on v0 I think it's time to release a stable version of tailwind-merge. Tailwind v3 was released yesterday and it's no coincidence that I'm releasing tailwind-merge v1 today. I added full support for Tailwind v3 so you can update both at once.
There are no breaking changes in the tailwind-merge types and some breaking changes for a small number of users in the return values, so you should get through smoothly.
By the way, you can now sponsor this project. 😊
Breaking Changes
-
twMerge,extendTailwindMerge- Outline utilities from Tailwind v2 don't get merged anymore since they were replaced by outline width, outline style, outline offset and outline color in Tailwind v3 (https://github.com/dcastil/tailwind-merge/pull/63/commits/55ab167b7167519873c5dd4d258dc62212d1659a, https://github.com/dcastil/tailwind-merge/pull/63)
- The classes
overflow-ellipsisandoverflow-clipwill not get merged with classtruncateanymore, but the new Tailwind v3 classestext-ellipsisandtext-clipwill. (https://github.com/dcastil/tailwind-merge/pull/63/commits/65b03e48914ac5d7d52eea9ec178b204d30609c9, https://github.com/dcastil/tailwind-merge/pull/63) - The classes
decoration-sliceanddecoration-clonewon't get merged anymore andbox-decoration-slidenadbox-decoration-clonewill (https://github.com/dcastil/tailwind-merge/pull/63/commits/bfe2cc9bb221107fa0bf363cc325ddbb04677f43, https://github.com/dcastil/tailwind-merge/pull/63)
-
getDefaultConfig- Removed class group
outlinesince it was removed in Tailwind v3 (https://github.com/dcastil/tailwind-merge/pull/63/commits/55ab167b7167519873c5dd4d258dc62212d1659a, https://github.com/dcastil/tailwind-merge/pull/63) - Renamed class group
vertival-alignment(yes, the typo was in the code) tovertical-align(https://github.com/dcastil/tailwind-merge/pull/63/commits/1269ce68ae39807ceadbecc98c0929fdfdb446d0, https://github.com/dcastil/tailwind-merge/pull/63) - Renamed class groups
flex-basis,flex-growandflex-shrinktobasis,growandshrinkto stay consistent with Tailwind v3 (https://github.com/dcastil/tailwind-merge/pull/63/commits/e6d8912e47bf9a89346b9b0cc822fb2bff2af172, https://github.com/dcastil/tailwind-merge/pull/63)
- Removed class group
-
validatorsisCustomLengthandisCustomValuewere renamed toisArbitraryLengthandisArbitraryValueto be consistent with naming in Tailwind v3 documentation (https://github.com/dcastil/tailwind-merge/pull/63/commits/adc3c02c7f035069beec1c62777ec008172587ab, https://github.com/dcastil/tailwind-merge/pull/63)
New Features
- Add support for Tailwind v3 by @dcastil in https://github.com/dcastil/tailwind-merge/pull/63
- Support for all the new utility classes and variants in Tailwind v3.0.0
- Support for arbitrary properties like
[--my-var:20px] - Support for important modifiers in arbitrary properties like
![--my-very-important-var: 21px] - Support for new labels for classes with arbitrary value:
size,position,url,weightandfamily - New validators
isTshirtSize,isArbitrarySize,isArbitraryPosition,isArbitraryUrlandisArbitraryWeight, check them out in the documentation! (https://github.com/dcastil/tailwind-merge/pull/63/commits/fec2b18870f6806e602009632b52b9fe89ebfb83, https://github.com/dcastil/tailwind-merge/pull/63/commits/f8acd7ca5be6cc40ad4c1cbdee7522bbc44c7870, https://github.com/dcastil/tailwind-merge/pull/63)
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.9.0...v1.0.0
New Features
- Mimic theme from Tailwind config in tailwind-merge config by @dcastil in https://github.com/dcastil/tailwind-merge/pull/55
- Adds support for some theme properties like
spacing,borderRadius, etc. More on that in the theme docs.
- Adds support for some theme properties like
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.8.2...v0.9.0
Bug Fixes
- Fix custom values for list-style-type missing in default config by @dcastil in https://github.com/dcastil/tailwind-merge/pull/53
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.8.1...v0.8.2
Bug Fixes
- Fix missing support for custom values in some class groups in default config by @dcastil in https://github.com/dcastil/tailwind-merge/pull/52
- Adds missing support for custom values in following class groups: Grid Auto Columns, Grid Auto Rows, Max-Width, Transition Property, Transition Timing Function, Animation, Fill, Stroke
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.8.0...v0.8.1
Summary
This is a big release with breaking changes. These were necessary to improve the API before the coming v1.0.0 release and to add better plugin support. If you feel like writing a plugin, check out the plugins section in the docs!
Breaking Changes
- Previously there was a list of prefixes in the tailwind-merge config which was used to match Tailwind prefixes. I removed those and match all prefixes as valid Tailwind prefixes. This is only a breaking change if you use non-Tailwind classes with
:in them which look like Tailwind classes after the prefix. tailwind-merge will treat those as Tailwind classes and resolve conflicts incorrectly. (https://github.com/dcastil/tailwind-merge/pull/50) createTailwindMerge- If you added custom prefixes to your tailwind-merge config, you can remove them now. If you use TypeScript, you need to remove them. (https://github.com/dcastil/tailwind-merge/pull/50)
- Doesn't get passed the
getDefaultConfigcallback anymore. You need to call the exported functiongetDefaultConfiginstead to get the default config. (https://github.com/dcastil/tailwind-merge/pull/42) - You probably don't need
createTailwindMergeanyway. Use the new and much simpler to useextendTailwindMergeinstead. (https://github.com/dcastil/tailwind-merge/pull/49)
New Features
- Add plugin documentation by @dcastil in https://github.com/dcastil/tailwind-merge/pull/51
- (Breaking change) Consider all prefixes as valid Tailwind prefixes by @dcastil in https://github.com/dcastil/tailwind-merge/pull/50
- Add
extendTailwindMergefunction by @dcastil in https://github.com/dcastil/tailwind-merge/pull/49 - Add
mergeConfigsfunction by @dcastil in https://github.com/dcastil/tailwind-merge/pull/45 - (Breaking change) Code-split default config out by @dcastil in https://github.com/dcastil/tailwind-merge/pull/42
- Enable multiple
createConfigfunctions by @dcastil in https://github.com/dcastil/tailwind-merge/pull/40 - Add validators to package exports by @dcastil in https://github.com/dcastil/tailwind-merge/pull/38
Bug Fixes
- Remove unwated side effects when mutating default config by @dcastil in https://github.com/dcastil/tailwind-merge/pull/43
- Also added the
Configtype to the package exports
- Also added the
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.7.1...v0.8.0
Bug Fixes
- Fix CommonJS imports not working by @navin-moorthy and @dcastil in https://github.com/dcastil/tailwind-merge/pull/31
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.7.0...v0.7.1
New Features
- Allow passing
falsetotwMergeby @dcastil in https://github.com/dcastil/tailwind-merge/pull/25
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.6.0...v0.7.0
New Features
- Allow passing
nullas argument totwMerge#20 by @dcastil
Bug Fixes
- Fix merges with important modifier not working when using prefixed classes by @dcastil in https://github.com/dcastil/tailwind-merge/pull/22
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.5.2...v0.6.0
Bug Fixes
- Add support for custom classes like
cursor-[grab]by @dcastil in https://github.com/dcastil/tailwind-merge/pull/19 - Fix incorrect conflicts in Font Variant Numeric classes by @dcastil in https://github.com/dcastil/tailwind-merge/pull/18
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.5.1...v0.5.2
Bug Fixes
- Fix incorrect conflict between ring and shadow by @dcastil in https://github.com/dcastil/tailwind-merge/pull/15
- Fix not all JIT-enabled pseudo variants working by @dcastil in https://github.com/dcastil/tailwind-merge/pull/14
Other
- Add CodeQL security analysis to repo by @dcastil in https://github.com/dcastil/tailwind-merge/pull/10
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.5.0...v0.5.1
New Features
- Add support for Tailwind CSS v2.2.6 by @dcastil in https://github.com/dcastil/tailwind-merge/pull/8
- Delay
twMergeinitialization until first call by @dcastil in https://github.com/dcastil/tailwind-merge/pull/7
Other
- Make logo in README version-specific by @dcastil in https://github.com/dcastil/tailwind-merge/pull/6
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.4.0...v0.5.0
Breaking Changes
createTailwindMerge- Config type changed and returned object from
getDefaultConfigchanged. (https://github.com/dcastil/tailwind-merge/pull/3)dynamicClassesandstandaloneClasseswere merged intoclassGroupsconflictingGroupswere renamed toconflictingClassGroups- Class group IDs are keys of
classGroupsobject instead of full path to class group. E.g.dynamicClasses.foo.0→foo.
- Config type changed and returned object from
New Features
- (Breaking change) Simplify config by @dcastil in https://github.com/dcastil/tailwind-merge/pull/3
- Add support for Tailwind v2.2.5 by @dcastil in https://github.com/dcastil/tailwind-merge/pull/2
Bug Fixes
- Fix non-conflicting border classes being merged incorrectly by @dcastil in https://github.com/dcastil/tailwind-merge/pull/5
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.3.0...v0.4.0
New Features
- Enable named class group collections by @dcastil in 16a31751fdfd87c39683fb4506dec6a0bf118772
- Class group collections in config can be an object, so you can use group references like
dynamicClasses.flex.directioninstead of just index-based ones likedynamicClasses.flex.0. More info on this in thecreateTailwindMerge()API reference.
- Class group collections in config can be an object, so you can use group references like
Bug Fixes
- Fix small typos in README by @KeKs0r in https://github.com/dcastil/tailwind-merge/pull/1
Other
- tailwind-merge now has a logo by @dcastil in 9402c8ec1b19714bb8ecb158eb124b89a8c1ba64, b96997942d4e92e045c9b08e7314843305b41fe2, dae2aaabf8c00b0d5086aff744aa2c53513daf33, e9e88060578483a3ed4728430f7b188e51aaef49, 4e2d9f160dae00e18ebcbecf54f4dd33dc4264bb
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.2.0...v0.3.0
New Features
- Add support for important modifier by @dcastil in 17a9e9d9d805ba585372e01a9eefae1dba89368b
- Add support for per-side border colors by @dcastil in 6cd9ee255e1a6fb42e5262b7835f876e2ce8e3ae
- Add support for content utiltites by @dcastil in fd097c611b5fa02ff6142b66f5ad96d596feed42
- Add support for caret color by @dcastil in fd097c611b5fa02ff6142b66f5ad96d596feed42
- Add support for JIT-only prefixes by @dcastil in fd097c611b5fa02ff6142b66f5ad96d596feed42
- Mark package as side effect-free by @dcastil in 6d00af33049c3c7171bce3f1affd561986cc6bfe
Bug Fixes
- Fix classes like
bottom-autonot being detected as Tailwind classesby @dcastil in ec65b84f0aab57d1305019e4a143772d675798a2
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.1.2...v0.2.0
Bug Fixes
- Fix errors when importing tailwind-merge as third party dependency. by @dcastil in 3335956da15fdcc484904976864816413fad68f6
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.1.1...v0.1.2
No changes here. Just testing automated npm publish.
Full Changelog: https://github.com/dcastil/tailwind-merge/compare/v0.1.0...v0.1.1
First published version of tailwind-merge. 🎉
Full Changelog: https://github.com/dcastil/tailwind-merge/commits/v0.1.0