tailwind_merge 0.8.0 → 0.9.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: e5402fe57c8b5f28ac07847bc17a04c6b5cd1ba9ad62ce945920759a95aece31
-  data.tar.gz: 0ef6aad523beb48f559b70e6e88662e0db9df8269152d2ccdcb5d08b5f96801b
+  metadata.gz: 7d905f5929fbbcbe4a1b9b1f23360ca7d1e74fc388ad652c4a4e31b4bcb6443f
+  data.tar.gz: 4e8958d9d569b65a6426a3c1bf261fccc70e887f7ff9c776d3c2b14d30711221
 SHA512:
-  metadata.gz: 568f47ffb9084553b5efc2b37dadcfdf1da552f698340f94bbbd6695618836213d4906b820370e55418350176d2d47c6f63dea5c5957efd34987b0a5ccb2cd4f
-  data.tar.gz: f4656fe96ddfed6d74308733575503b33a69cecd9ff261cded4e60978e7a9927652afbd09a2ad0b02ea8988c6540730bc63cbec1edb4f782b5e14d04d4cbebe7
+  metadata.gz: 81befe07862ea9726ab174d4a5cc95c276166b35580250a495313ec670a49ffdf920d9143a05167578cf695f4a5b3b765783669e63c67339cd7c3e09ba9ee488
+  data.tar.gz: 29a9d62e4ed4ed10baed3fddf1feb66090008a6a5713733bb1cffb504c3942632a276138913c985a7a734b0be1e07ea3460556bc9cb9206321ad0ceab8612f2b

data/CHANGELOG.md

@@ -1,3 +1,17 @@
+## [v0.8.1] - 19-09-2023
+**Full Changelog**: https://github.com/gjtorikian/tailwind_merge/compare/v0.8.0...v0.8.1
+## [v0.8.0] - 19-09-2023
+## What's Changed
+* Add clarifications to README by @borama in https://github.com/gjtorikian/tailwind_merge/pull/17
+* Bump actions/checkout from 3 to 4 by @dependabot in https://github.com/gjtorikian/tailwind_merge/pull/18
+* Update What's it for example in README by @borama in https://github.com/gjtorikian/tailwind_merge/pull/19
+* Swap to using IMAGE, not URL by @gjtorikian in https://github.com/gjtorikian/tailwind_merge/pull/20
+
+## New Contributors
+* @borama made their first contribution in https://github.com/gjtorikian/tailwind_merge/pull/17
+* @dependabot made their first contribution in https://github.com/gjtorikian/tailwind_merge/pull/18
+
+**Full Changelog**: https://github.com/gjtorikian/tailwind_merge/compare/v0.7.4...v0.8.0
 ## [v0.7.4] - 03-07-2023
 null
 ## [v0.7.3] - 26-06-2023

data/README.md

@@ -51,7 +51,7 @@ tailwind-merge overrides conflicting classes and keeps everything else untouched
 
 ### Merging behavior
 
-`tailwind_merge` is designed to be predictable and intuitive. It follows a set of rules to determine which class "wins" when there are conflicts. Here is a brief overview of the conflict resolutions which `tailwind_merge` can do.
+`tailwind_merge` is built to be intuitive. It follows a set of rules to determine which class wins when there are conflicts. Here is a brief overview of its conflict resolution.
 
 ### Last conflicting class wins
 
@@ -305,9 +305,9 @@ 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_LENGTH` checks whether a class part is a number (`3`, `1.5`), a fraction (`3/4`), 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_INTEGER` checks for integer values (`3`).
 - `IS_PERCENT` checks for percent values (`12.5%`) which is used for color stop positions.
 - `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`).

data/lib/tailwind_merge/config.rb

@@ -66,7 +66,7 @@ module TailwindMerge
     OVERFLOW = -> { ["auto", "hidden", "clip", "visible", "scroll"] }
     SPACING_WITH_AUTO_AND_ARBITRARY = -> { ["auto", IS_ARBITRARY_VALUE, SPACING] }
     SPACING_WITH_ARBITRARY = -> { [IS_ARBITRARY_VALUE, SPACING] }
-    LENGTH_WITH_EMPTY = -> { ["", IS_LENGTH] }
+    LENGTH_WITH_EMPTY_AND_ARBITRARY = -> { ["", IS_LENGTH, IS_ARBITRARY_LENGTH] }
     NUMBER_WITH_AUTO_AND_ARBITRARY = -> { ["auto", IS_NUMBER, IS_ARBITRARY_VALUE] }
     POSITIONS = -> {
       [
@@ -114,13 +114,13 @@ module TailwindMerge
       separator: ":",
       theme: {
         "colors" => [IS_ANY],
-        "spacing" => [IS_LENGTH],
+        "spacing" => [IS_LENGTH, IS_ARBITRARY_LENGTH],
         "blur" => ["none", "", IS_TSHIRT_SIZE, IS_ARBITRARY_VALUE],
         "brightness" => NUMBER.call,
         "border-color" => [COLORS],
         "border-radius" => ["none", "", "full", IS_TSHIRT_SIZE, IS_ARBITRARY_VALUE],
         "border-spacing" => SPACING_WITH_ARBITRARY.call,
-        "border-width" => LENGTH_WITH_EMPTY.call,
+        "border-width" => LENGTH_WITH_EMPTY_AND_ARBITRARY.call,
         "contrast" => NUMBER.call,
         "grayscale" => ZERO_AND_EMPTY.call,
         "hue-rotate" => NUMBER_AND_ARBITRARY.call,
@@ -322,7 +322,7 @@ module TailwindMerge
         # Z-Index
         # @see https://tailwindcss.com/docs/z-index
         ##
-        "z" => [{ "z" => ["auto", IS_INTEGER] }],
+        "z" => [{ "z" => ["auto", IS_INTEGER, IS_ARBITRARY_VALUE] }],
         # Flexbox and Grid
         ##
         # Flex Basis
@@ -358,7 +358,7 @@ module TailwindMerge
         # Order
         # @see https://tailwindcss.com/docs/order
         ##
-        "order" => [{ "order" => ["first", "last", "none", IS_INTEGER] }],
+        "order" => [{ "order" => ["first", "last", "none", IS_INTEGER, IS_ARBITRARY_VALUE] }],
         ##
         # Grid Template Columns
         # @see https://tailwindcss.com/docs/grid-template-columns
@@ -368,7 +368,7 @@ module TailwindMerge
         # Grid Column Start / End
         # @see https://tailwindcss.com/docs/grid-column
         ##
-        "col-start-end" => [{ "col" => ["auto", { "span" => ["full", IS_INTEGER] }, IS_ARBITRARY_VALUE] }],
+        "col-start-end" => [{ "col" => ["auto", { "span" => ["full", IS_INTEGER, IS_ARBITRARY_VALUE] }, IS_ARBITRARY_VALUE] }],
 
         ##
         # Grid Column Start
@@ -389,7 +389,7 @@ module TailwindMerge
         # Grid Row Start / End
         # @see https://tailwindcss.com/docs/grid-row
         ##
-        "row-start-end" => [{ "row" => ["auto", { "span" => [IS_INTEGER] }] }],
+        "row-start-end" => [{ "row" => ["auto", { "span" => [IS_INTEGER, IS_ARBITRARY_VALUE] }, IS_ARBITRARY_VALUE] }],
         ##
         # Grid Row Start
         # @see https://tailwindcss.com/docs/grid-row
@@ -626,7 +626,7 @@ module TailwindMerge
         # Min-Height
         # @see https://tailwindcss.com/docs/min-height
         ##
-        "min-h" => [{ "min-h" => ["min", "max", "fit", IS_ARBITRARY_VALUE, IS_LENGTH] }],
+        "min-h" => [{ "min-h" => ["min", "max", "fit", IS_LENGTH, IS_ARBITRARY_VALUE] }],
         ##
         # Max-Height
         # @see https://tailwindcss.com/docs/max-height
@@ -730,7 +730,7 @@ module TailwindMerge
         # @see https://tailwindcss.com/docs/line-height
         ##
         "leading" => [
-          { "leading" => ["none", "tight", "snug", "normal", "relaxed", "loose", IS_ARBITRARY_VALUE, IS_LENGTH] },
+          { "leading" => ["none", "tight", "snug", "normal", "relaxed", "loose", IS_LENGTH, IS_ARBITRARY_VALUE] },
         ],
         #
         # List Style Image
@@ -787,12 +787,12 @@ module TailwindMerge
         # Text Decoration Thickness
         # @see https://tailwindcss.com/docs/text-decoration-thickness
         ##
-        "text-decoration-thickness" => [{ "decoration" => ["auto", "from-font", IS_LENGTH] }],
+        "text-decoration-thickness" => [{ "decoration" => ["auto", "from-font", IS_LENGTH, IS_ARBITRARY_LENGTH] }],
         ##
         # Text Underline Offset
         # @see https://tailwindcss.com/docs/text-underline-offset
         ##
-        "underline-offset" => [{ "underline-offset" => ["auto", IS_ARBITRARY_VALUE, IS_LENGTH] }],
+        "underline-offset" => [{ "underline-offset" => ["auto", IS_LENGTH, IS_ARBITRARY_VALUE] }],
         ##
         # Text Decoration Color
         # @see https://tailwindcss.com/docs/text-decoration-color
@@ -1147,12 +1147,12 @@ module TailwindMerge
         # Outline Offset
         # @see https://tailwindcss.com/docs/outline-offset
         ##
-        "outline-offset" => [{ "outline-offset" => [IS_ARBITRARY_VALUE, IS_LENGTH] }],
+        "outline-offset" => [{ "outline-offset" => [IS_LENGTH, IS_ARBITRARY_VALUE] }],
         ##
         # Outline Width
         # @see https://tailwindcss.com/docs/outline-width
         ##
-        "outline-w" => [{ "outline" => [IS_LENGTH] }],
+        "outline-w" => [{ "outline" => [IS_LENGTH, IS_ARBITRARY_LENGTH] }],
         ##
         # Outline Color
         # @see https://tailwindcss.com/docs/outline-color
@@ -1162,7 +1162,7 @@ module TailwindMerge
         # Ring Width
         # @see https://tailwindcss.com/docs/ring-width
         ##
-        "ring-w" => [{ "ring" => LENGTH_WITH_EMPTY.call }],
+        "ring-w" => [{ "ring" => LENGTH_WITH_EMPTY_AND_ARBITRARY.call }],
         ##
         # Ring Width Inset
         # @see https://tailwindcss.com/docs/ring-width
@@ -1182,7 +1182,7 @@ module TailwindMerge
         # Ring Offset Width
         # @see https://tailwindcss.com/docs/ring-offset-width
         ##
-        "ring-offset-w" => [{ "ring-offset" => [IS_LENGTH] }],
+        "ring-offset-w" => [{ "ring-offset" => [IS_LENGTH, IS_ARBITRARY_LENGTH] }],
         ##
         # Ring Offset Color
         # @see https://tailwindcss.com/docs/ring-offset-color
@@ -1647,16 +1647,33 @@ module TailwindMerge
         ##
         "touch" => [
           {
-            "touch" => [
-              "auto",
-              "none",
-              "pinch-zoom",
-              "manipulation",
-              { "pan" => ["x", "left", "right", "y", "up", "down"] },
-            ],
+            "touch" => ["auto", "none", "manipulation"],
+          },
+        ],
+        ##
+        # Touch Action X
+        # @see https://tailwindcss.com/docs/touch-action
+        ##
+        "touch-x" => [
+          {
+            "touch-pan" => ["x", "left", "right"],
           },
         ],
         ##
+        # Touch Action Y
+        # @see https://tailwindcss.com/docs/touch-action
+        ##
+        "touch-y" => [
+          {
+            "touch-pan" => ["y", "up", "down"],
+          },
+        ],
+        ##
+        # Touch Action Pinch Zoom
+        # @see https://tailwindcss.com/docs/touch-action
+        ##
+        "touch-pz" => ["touch-pinch-zoom"],
+        ##
         # User Select
         # @see https://tailwindcss.com/docs/user-select
         ##
@@ -1678,7 +1695,7 @@ module TailwindMerge
         # Stroke Width
         # @see https://tailwindcss.com/docs/stroke-width
         ##
-        "stroke-w" => [{ "stroke" => [IS_LENGTH, IS_ARBITRARY_NUMBER] }],
+        "stroke-w" => [{ "stroke" => [IS_LENGTH, IS_ARBITRARY_LENGTH, IS_ARBITRARY_NUMBER] }],
         ##
         # Stroke
         # @see https://tailwindcss.com/docs/stroke
@@ -1783,6 +1800,10 @@ module TailwindMerge
         ],
         "scroll-px" => ["scroll-pr", "scroll-pl"],
         "scroll-py" => ["scroll-pt", "scroll-pb"],
+        "touch" => ["touch-x", "touch-y", "touch-pz"],
+        "touch-x" => ["touch"],
+        "touch-y" => ["touch"],
+        "touch-pz" => ["touch"],
       },
       conflicting_class_group_modifiers: {
         "font-size": ["leading"],

data/lib/tailwind_merge/validators.rb

@@ -63,26 +63,13 @@ module TailwindMerge
     IS_LENGTH = ->(value) {
       numeric?(value) ||
         STRING_LENGTHS.include?(value) ||
-        FRACTION_REGEX.match?(value) ||
-        IS_ARBITRARY_LENGTH.call(value)
+        FRACTION_REGEX.match?(value)
     }
 
     IS_ARBITRARY_LENGTH = ->(value) {
       arbitrary_value?(value, "length", is_length_only)
     }
 
-    IS_ARBITRARY_SIZE = ->(value) {
-      arbitrary_value?(value, SIZE_LABELS, is_never)
-    }
-
-    IS_ARBITRARY_POSITION = ->(value) {
-      arbitrary_value?(value, "position", is_never)
-    }
-
-    IS_ARBITRARY_IMAGE = ->(value) {
-      arbitrary_value?(value, IMAGE_LABELS, is_image)
-    }
-
     IS_ARBITRARY_NUMBER = ->(value) {
       arbitrary_value?(value, "number", is_number)
     }
@@ -91,26 +78,38 @@ module TailwindMerge
       is_number.call(value)
     }
 
-    IS_PERCENT = ->(value) {
-      value.end_with?("%") && is_number.call(value[0..-2])
+    IS_INTEGER = ->(value) {
+      is_integer_only.call(value)
     }
 
-    IS_INTEGER = ->(value) {
-      is_integer_only.call(value) || arbitrary_value?(value, "number", is_integer_only)
+    IS_PERCENT = ->(value) {
+      value.end_with?("%") && is_number.call(value[0..-2])
     }
 
     IS_ARBITRARY_VALUE = ->(value) {
       ARBITRARY_VALUE_REGEX.match(value)
     }
 
-    IS_ANY = ->(_) { return true }
-
     IS_TSHIRT_SIZE = ->(value) {
       TSHIRT_UNIT_REGEX.match?(value)
     }
 
+    IS_ARBITRARY_SIZE = ->(value) {
+      arbitrary_value?(value, SIZE_LABELS, is_never)
+    }
+
+    IS_ARBITRARY_POSITION = ->(value) {
+      arbitrary_value?(value, "position", is_never)
+    }
+
+    IS_ARBITRARY_IMAGE = ->(value) {
+      arbitrary_value?(value, IMAGE_LABELS, is_image)
+    }
+
     IS_ARBITRARY_SHADOW = ->(value) {
       arbitrary_value?(value, "", is_shadow)
     }
+
+    IS_ANY = ->(_) { return true }
   end
 end

data/lib/tailwind_merge/version.rb

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

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: tailwind_merge
 version: !ruby/object:Gem::Version
-  version: 0.8.0
+  version: 0.9.0
 platform: ruby
 authors:
 - Garen J. Torikian
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2023-09-19 00:00:00.000000000 Z
+date: 2023-11-04 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: lru_redux
@@ -99,7 +99,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.4.19
+rubygems_version: 3.4.21
 signing_key: 
 specification_version: 4
 summary: Utility function to efficiently merge Tailwind CSS classes without style