tailwind_merge 0.3.1 → 0.4.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: b6224f510ea4b41c69dcfd5afebd2275a160f35a4bd0d566abf939de17467e73
-  data.tar.gz: 703cde0f5f4995926c368abd799db4a2b39a495ad8563958d6efe6a5b10c1e1b
+  metadata.gz: 5e16a945fd3a3872687ebacc6fa3a18ca60424e735e31f28461e500116c7fd5f
+  data.tar.gz: 3b8b7ef9495914b7004cada2918c3ecb22099f1279607fe6dc1cd47db3018be6
 SHA512:
-  metadata.gz: 20a49d6ed7f51d50c9397e187ec1ebd5244b9ad3757008d7dadbdae866a2660d29b2cec4b55e39f1daea444ba3f2acec1a0d3a24217d5a0f4888ba932c7b259a
-  data.tar.gz: c11f641d5314e975bfd0cdfe7e25e5b21245645bec46649b7ffbe1c35dedeff94951a3984bb6dce9f99852e6c393f4a1e402489b1d7286466aacbe11991de8f4
+  metadata.gz: f13054805b9efa04fa50dd84f4ffb57823f026d865e050f7617a89bc4374cd520950887defe714c49e1d50ed9a88e8a0bb27383b0a67f4ba4cdba6f8b8918667
+  data.tar.gz: af31f90a35a33964f9fc5f0e141310c5437a322be4b906123de557e9c1a925bcea8709dc6888035905bb9eb3dbf29fb822ae0835e0529fbf36d354928445b538

data/CHANGELOG.md

@@ -1,4 +1,54 @@
-**Full Changelog**: https://github.com/gjtorikian/tailwind_merge/compare/v0.3.0...v0.3.1
+# Changelog
 
+## [v0.4.0](https://github.com/gjtorikian/tailwind_merge/tree/v0.4.0) (2022-11-11)
 
+[Full Changelog](https://github.com/gjtorikian/tailwind_merge/compare/v0.3.1...v0.4.0)
 
+**Merged pull requests:**
+
+- Support custom seperators [\#5](https://github.com/gjtorikian/tailwind_merge/pull/5) ([gjtorikian](https://github.com/gjtorikian))
+
+## [v0.3.1](https://github.com/gjtorikian/tailwind_merge/tree/v0.3.1) (2022-11-03)
+
+[Full Changelog](https://github.com/gjtorikian/tailwind_merge/compare/v0.3.0...v0.3.1)
+
+## [v0.3.0](https://github.com/gjtorikian/tailwind_merge/tree/v0.3.0) (2022-10-20)
+
+[Full Changelog](https://github.com/gjtorikian/tailwind_merge/compare/v0.2.0...v0.3.0)
+
+**Merged pull requests:**
+
+- Support Tailwind 3.2 [\#4](https://github.com/gjtorikian/tailwind_merge/pull/4) ([gjtorikian](https://github.com/gjtorikian))
+
+## [v0.2.0](https://github.com/gjtorikian/tailwind_merge/tree/v0.2.0) (2022-10-14)
+
+[Full Changelog](https://github.com/gjtorikian/tailwind_merge/compare/v0.1.3...v0.2.0)
+
+## [v0.1.3](https://github.com/gjtorikian/tailwind_merge/tree/v0.1.3) (2022-10-11)
+
+[Full Changelog](https://github.com/gjtorikian/tailwind_merge/compare/v0.1.2...v0.1.3)
+
+## [v0.1.2](https://github.com/gjtorikian/tailwind_merge/tree/v0.1.2) (2022-10-11)
+
+[Full Changelog](https://github.com/gjtorikian/tailwind_merge/compare/v0.1.1...v0.1.2)
+
+## [v0.1.1](https://github.com/gjtorikian/tailwind_merge/tree/v0.1.1) (2022-10-11)
+
+[Full Changelog](https://github.com/gjtorikian/tailwind_merge/compare/v0.1.0...v0.1.1)
+
+**Closed issues:**
+
+- Should arrays be supported? [\#1](https://github.com/gjtorikian/tailwind_merge/issues/1)
+
+**Merged pull requests:**
+
+- Fix h-min [\#3](https://github.com/gjtorikian/tailwind_merge/pull/3) ([gjtorikian](https://github.com/gjtorikian))
+- Fix example in README [\#2](https://github.com/gjtorikian/tailwind_merge/pull/2) ([marcoroth](https://github.com/marcoroth))
+
+## [v0.1.0](https://github.com/gjtorikian/tailwind_merge/tree/v0.1.0) (2022-08-15)
+
+[Full Changelog](https://github.com/gjtorikian/tailwind_merge/compare/e748f00d53e86ece8ce2543735f3327cb30c1959...v0.1.0)
+
+
+
+\* *This Changelog was automatically generated by [github_changelog_generator](https://github.com/github-changelog-generator/github-changelog-generator)*

data/Gemfile

@@ -10,3 +10,5 @@ gem "rake", "~> 13.0"
 gem "minitest", "~> 5.0"
 
 gem "rubocop", "~> 1.21"
+
+gem "github_changelog_generator", "~> 1.16"

data/README.md

@@ -27,9 +27,7 @@ If you use Tailwind with a component-based UI renderer (like [ViewComponent](htt
 
 ```html
 <!-- app/components/confirm_email_component.html.erb -->
-<div class="border rounded px-2 py-1">
-  Please confirm your email address.
-</div>
+<div class="border rounded px-2 py-1">Please confirm your email address.</div>
 ```
 
 ```ruby
@@ -53,9 +51,9 @@ tailwind-merge overrides conflicting classes and keeps everything else untouched
 
 ### Optimized for speed
 
--   Results get cached by default, so you don't need to worry about wasteful re-renders. The library uses a thread-safe [LRU cache](<https://en.wikipedia.org/wiki/Cache_replacement_policies#Least_recently_used_(LRU)>) which stores up to 500 different results. The cache size can be modified via config options.
--   Expensive computations happen upfront so that `merge` calls without a cache hit stay fast.
--   These computations are called lazily on the first call to `merge` to prevent it from impacting app startup performance if it isn't used initially.
+- Results get cached by default, so you don't need to worry about wasteful re-renders. The library uses a thread-safe [LRU cache](<https://en.wikipedia.org/wiki/Cache_replacement_policies#Least_recently_used_(LRU)>) which stores up to 500 different results. The cache size can be modified via config options.
+- Expensive computations happen upfront so that `merge` calls without a cache hit stay fast.
+- These computations are called lazily on the first call to `merge` to prevent it from impacting app startup performance if it isn't used initially.
 
 ### Last conflicting class wins
 
@@ -150,10 +148,10 @@ If you're using a custom Tailwind config, you may need to configure tailwind-mer
 
 The default [`twMerge`](#twmerge) function is configured in a way that you can still use it if all the following points apply to your Tailwind config:
 
--   Only using color names which don't clash with other Tailwind class names
--   Only deviating by number values from number-based Tailwind classes
--   Only using font-family classes which don't clash with default font-weight classes
--   Sticking to default Tailwind config for everything else
+- Only using color names which don't clash with other Tailwind class names
+- Only deviating by number values from number-based Tailwind classes
+- Only using font-family classes which don't clash with default font-weight classes
+- Sticking to default Tailwind config for everything else
 
 If some of these points don't apply to you, you can test whether the merge still works as intended with your custom classes. Otherwise, you need create your own custom merge function by either extending the default tailwind-merge config or using a completely custom one.
 
@@ -165,9 +163,11 @@ The `tailwind_merge` config is an object with several keys:
 
 ```ruby
 tailwindMergeConfig = {
-    # ↓ Set how many values should be stored in cache.
+    # ↓ *Optional* Define how many values should be stored in cache.
     cache_size: 500,
-    # ↓ Optional prefix from Tailwind config
+    # ↓ *Optional* modifier separator from Tailwind config
+    separator: ':',
+    # ↓ *Optional* prefix from Tailwind config
     prefix: 'tw-',
     theme: {
         # Theme scales are defined here
@@ -283,17 +283,17 @@ If you modified one of these theme scales in your Tailwind config, you can add a
 
 Here's a brief summary for each validator:
 
--   `IS_LENGTH` checks whether a class part is a number (`3`, `1.5`), a fraction (`3/4`), a arbitrary length (`[3%]`, `[4px]`, `[length:var(--my-var)]`), or one of the strings `px`, `full` or `screen`.
--   `IS_ARBITRARY_LENGTH` checks for arbitrary length values (`[3%]`, `[4px]`, `[length:var(--my-var)]`).
--   `IS_INTEGER` checks for integer values (`3`) and arbitrary integer values (`[3]`).
--   `IS_ARBITRARY_VALUE` checks whether the class part is enclosed in brackets (`[something]`)
--   `IS_TSHIRT_SIZE`checks whether class part is a T-shirt size (`sm`, `xl`), optionally with a preceding number (`2xl`).
--   `IS_ARBITRARY_SIZE` checks whether class part is an arbitrary value which starts with `size:` (`[size:200px_100px]`) which is necessary for background-size classNames.
--   `IS_ARBITRARY_POSITION` checks whether class part is an arbitrary value which starts with `position:` (`[position:200px_100px]`) which is necessary for background-position classNames.
--   `IS_ARBITRARY_URL` checks whether class part is an arbitrary value which starts with `url:` or `url(` (`[url('/path-to-image.png')]`, `url:var(--maybe-a-url-at-runtime)]`) which is necessary for background-image classNames.
--   `IS_ARBITRARY_NUMBER` checks whether class part is an arbitrary value which starts with `number:` or is a number (`[number:var(--value)]`, `[450]`) which is necessary for font-weight classNames.
--   `IS_ARBITRARY_SHADOW` checks whether class part is an arbitrary value which starts with the same pattern as a shadow value (`[0_35px_60px_-15px_rgba(0,0,0,0.3)]`), namely with two lengths separated by a underscore.
--   `IS_ANY` always returns true. Be careful with this validator as it might match unwanted classes. I use it primarily to match colors or when it's certain there are no other class groups in a namespace.
+- `IS_LENGTH` checks whether a class part is a number (`3`, `1.5`), a fraction (`3/4`), a arbitrary length (`[3%]`, `[4px]`, `[length:var(--my-var)]`), or one of the strings `px`, `full` or `screen`.
+- `IS_ARBITRARY_LENGTH` checks for arbitrary length values (`[3%]`, `[4px]`, `[length:var(--my-var)]`).
+- `IS_INTEGER` checks for integer values (`3`) and arbitrary integer values (`[3]`).
+- `IS_ARBITRARY_VALUE` checks whether the class part is enclosed in brackets (`[something]`)
+- `IS_TSHIRT_SIZE`checks whether class part is a T-shirt size (`sm`, `xl`), optionally with a preceding number (`2xl`).
+- `IS_ARBITRARY_SIZE` checks whether class part is an arbitrary value which starts with `size:` (`[size:200px_100px]`) which is necessary for background-size classNames.
+- `IS_ARBITRARY_POSITION` checks whether class part is an arbitrary value which starts with `position:` (`[position:200px_100px]`) which is necessary for background-position classNames.
+- `IS_ARBITRARY_URL` checks whether class part is an arbitrary value which starts with `url:` or `url(` (`[url('/path-to-image.png')]`, `url:var(--maybe-a-url-at-runtime)]`) which is necessary for background-image classNames.
+- `IS_ARBITRARY_NUMBER` checks whether class part is an arbitrary value which starts with `number:` or is a number (`[number:var(--value)]`, `[450]`) which is necessary for font-weight classNames.
+- `IS_ARBITRARY_SHADOW` checks whether class part is an arbitrary value which starts with the same pattern as a shadow value (`[0_35px_60px_-15px_rgba(0,0,0,0.3)]`), namely with two lengths separated by a underscore.
+- `IS_ANY` always returns true. Be careful with this validator as it might match unwanted classes. I use it primarily to match colors or when it's certain there are no other class groups in a namespace.
 
 ## Contributing
 

data/lib/tailwind_merge/config.rb

@@ -106,6 +106,7 @@ module TailwindMerge
 
     DEFAULTS = {
       cache_size: 500,
+      separator: ":",
       theme: {
         "colors" => [IS_ANY],
         "spacing" => [IS_LENGTH],

data/lib/tailwind_merge/modifier_utils.rb

@@ -0,0 +1,64 @@
+# frozen_string_literal: true
+
+module TailwindMerge
+  module ModifierUtils
+    IMPORTANT_MODIFIER = "!"
+
+    def split_modifiers(class_name, separator: nil)
+      separator ||= ":"
+      separator_length = separator.length
+
+      modifiers = []
+      bracket_depth = 0
+      modifier_start = 0
+
+      class_name.each_char.with_index do |char, index|
+        if bracket_depth.zero? && char == separator[0]
+          if separator_length == 1 || class_name[index..(index + separator_length - 1)] == separator
+            modifiers << class_name[modifier_start..index]
+            modifier_start = index + separator_length
+          end
+        end
+
+        if class_name[index] == "["
+          bracket_depth += 1
+        elsif class_name[index] == "]"
+          bracket_depth -= 1
+        end
+      end
+
+      base_class_name_with_important_modifier = modifiers.empty? ? class_name : class_name[modifier_start..-1]
+      has_important_modifier = base_class_name_with_important_modifier.start_with?(IMPORTANT_MODIFIER)
+      base_class_name = has_important_modifier ? base_class_name_with_important_modifier[1..-1] : base_class_name_with_important_modifier
+
+      [modifiers, has_important_modifier, base_class_name]
+    end
+
+    # Sorts modifiers according to following schema:
+    # - Predefined modifiers are sorted alphabetically
+    # - When an arbitrary variant appears, it must be preserved which modifiers are before and after it
+    def sort_modifiers(modifiers)
+      if modifiers.length <= 1
+        return modifiers
+      end
+
+      sorted_modifiers = []
+      unsorted_modifiers = []
+
+      modifiers.each do |modifier|
+        is_arbitrary_variant = modifier[0] == "["
+
+        if is_arbitrary_variant
+          sorted_modifiers.push(unsorted_modifiers.sort, modifier)
+          unsorted_modifiers = []
+        else
+          unsorted_modifiers.push(modifier)
+        end
+      end
+
+      sorted_modifiers.push(...unsorted_modifiers.sort)
+
+      sorted_modifiers
+    end
+  end
+end

data/lib/tailwind_merge/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module TailwindMerge
-  VERSION = "0.3.1"
+  VERSION = "0.4.0"
 end

data/lib/tailwind_merge.rb

@@ -11,6 +11,7 @@ require_relative "tailwind_merge/version"
 require_relative "tailwind_merge/validators"
 require_relative "tailwind_merge/config"
 require_relative "tailwind_merge/class_utils"
+require_relative "tailwind_merge/modifier_utils"
 
 require "strscan"
 require "set"
@@ -18,9 +19,9 @@ require "set"
 module TailwindMerge
   class Merger
     include Config
+    include ModifierUtils
 
     SPLIT_CLASSES_REGEX = /\s+/
-    IMPORTANT_MODIFIER = "!"
 
     def initialize(config: {})
       @config = if config.fetch(:theme, nil)
@@ -48,7 +49,7 @@ module TailwindMerge
       class_groups_in_conflict = Set.new
 
       classes.strip.split(SPLIT_CLASSES_REGEX).map do |original_class_name|
-        modifiers, has_important_modifier, base_class_name = split_modifiers(original_class_name)
+        modifiers, has_important_modifier, base_class_name = split_modifiers(original_class_name, separator: @config[:separator])
 
         class_group_id = @class_utils.class_group_id(base_class_name)
 
@@ -59,7 +60,7 @@ module TailwindMerge
           }
         end
 
-        variant_modifier = sort_modifiers(modifiers).join("")
+        variant_modifier = sort_modifiers(modifiers).join(":")
 
         modifier_id = has_important_modifier ? "#{variant_modifier}#{IMPORTANT_MODIFIER}" : variant_modifier
 
@@ -89,67 +90,5 @@ module TailwindMerge
         true
       end.reverse.map { |parsed| parsed[:original_class_name] }.join(" ")
     end
-
-    SPLIT_MODIFIER_REGEX = /[:\[\]]/
-    private def split_modifiers(class_name)
-      modifiers = []
-
-      bracket_depth = 0
-      modifier_start = 0
-
-      ss = StringScanner.new(class_name)
-
-      until ss.eos?
-        portion = ss.scan_until(SPLIT_MODIFIER_REGEX)
-
-        if portion.nil?
-          ss.terminate
-          next
-        end
-        pos = ss.pos - 1
-        if class_name[pos] == ":" && bracket_depth.zero?
-          next_modifier_start = pos
-          modifiers << class_name[modifier_start..next_modifier_start]
-          modifier_start = next_modifier_start + 1
-        elsif class_name[pos] == "["
-          bracket_depth += 1
-        elsif class_name[pos] == "]"
-          bracket_depth -= 1
-        end
-      end
-
-      base_class_name_with_important_modifier = modifiers.empty? ? class_name : class_name[modifier_start..-1]
-      has_important_modifier = base_class_name_with_important_modifier.start_with?(IMPORTANT_MODIFIER)
-      base_class_name = has_important_modifier ? base_class_name_with_important_modifier[1..-1] : base_class_name_with_important_modifier
-
-      [modifiers, has_important_modifier, base_class_name]
-    end
-
-    # Sorts modifiers according to following schema:
-    # - Predefined modifiers are sorted alphabetically
-    # - When an arbitrary variant appears, it must be preserved which modifiers are before and after it
-    private def sort_modifiers(modifiers)
-      if modifiers.length <= 1
-        return modifiers
-      end
-
-      sorted_modifiers = []
-      unsorted_modifiers = []
-
-      modifiers.each do |modifier|
-        is_arbitrary_variant = modifier[0] == "["
-
-        if is_arbitrary_variant
-          sorted_modifiers.push(unsorted_modifiers.sort, modifier)
-          unsorted_modifiers = []
-        else
-          unsorted_modifiers.push(modifier)
-        end
-      end
-
-      sorted_modifiers.push(...unsorted_modifiers.sort)
-
-      sorted_modifiers
-    end
   end
 end

data/script/generate_changelog

@@ -0,0 +1,3 @@
+#!/bin/sh
+
+ CHANGELOG_GITHUB_TOKEN="$GITHUB_TOKEN" bundle exec github_changelog_generator -u gjtorikian -p tailwind_merge

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: tailwind_merge
 version: !ruby/object:Gem::Version
-  version: 0.3.1
+  version: 0.4.0
 platform: ruby
 authors:
 - Garen J. Torikian
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2022-11-03 00:00:00.000000000 Z
+date: 2022-11-11 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: lru_redux
@@ -138,8 +138,10 @@ files:
 - lib/tailwind_merge.rb
 - lib/tailwind_merge/class_utils.rb
 - lib/tailwind_merge/config.rb
+- lib/tailwind_merge/modifier_utils.rb
 - lib/tailwind_merge/validators.rb
 - lib/tailwind_merge/version.rb
+- script/generate_changelog
 - tailwind_merge.gemspec
 homepage: https://www.github.com/gjtorikian/tailwind_merge
 licenses: