add conditional merging

README.md

@@ -62,12 +62,54 @@ define("KIRBY_HELPER_ATTR", false);
 <div class="h-full bg-neutral-100 w-1/2">[...]</div>
 ```
 
+### `cls()`
+
+`cls()` applies Tailwind Merge behaviour and outputs the contents of class attribute. This can be used to work better with the conditional merge syntax this plugin provides, and also for nesting.
+
+#### Example
+
+```php
+// site/snippets/blocks/simple-text.php
+<div class="<?= cls([
+        'bg-neutral-white',
+        'py-32' => true,
+        cls([
+            'px-16' => $block->type() !== 'simple-text',
+            'px-8' => $block->type() === 'centered-text'
+        ]) => $page->intendedTemplate() == 'home'
+    ]); ?>">[...]</div>
+
+// site/templates/home.php
+// output
+<div class="bg-neutral-white py-32 px-16">[...]</div>
+
+// site/templates/article.php
+// output
+<div class="bg-neutral-white py-32">[...]</div>
+```
+
+### Conditional merging
+
+This conditional merge syntax using arrays can be used with the `merge()` and `attr()` functions as well.
+
+```php
+<div <?= merge([
+        'bg-neutral-white', // always applied if no condition is present
+        'py-32' => true, // always applied, because condition is true
+        cls([ // this works like an "AND", ANY entries in cls function will only be applied if the condition is true, this results in...
+            'px-16' => $block->type() !== 'simple-text', // applied when block type is not 'simple-text', but intendedTemplate is 'home'
+            'px-8' => $block->type() === 'centered-text' // applied when block type is 'centered-text' and intendedTemplate is 'home', also replaces 'px-16' from above
+        ]) => $page->intendedTemplate() == 'home' // "parent" AND condition
+    ]) ?>>[...]</div>
+```
+
 ## Options
 
 | Option          | Default | Description                            |
 | --------------- | ------- | -------------------------------------- |
 | `prefix`        | ``      | Set a prefix for your tailwind classes |
 | `helpers.attr`  | `true`  | Register the `attr()` helper function  |
+| `helpers.cls`   | `true`  | Register the `cls()` helper function   |
 | `helpers.merge` | `true`  | Register the `merge()` helper function |
 
 Options allow you to fine tune the behaviour of the plugin. You can set them in your `config.php` file:

classes/TwMerge.php

@@ -14,25 +14,57 @@ public static function instance()
     ])->make();
   }
 
+  public static function buildClassAttr(string|array $classes): string
+  {
+    if (is_string($classes)) {
+      return $classes;
+    }
+
+    $classList = [];
+
+    foreach ($classes as $class => $condition) {
+      if (is_numeric($class)) {
+        if (is_array($condition)) {
+          $classList[] = self::buildClassAttr($condition);
+        } else {
+          $classList[] = $condition;
+        }
+      } elseif ($condition) {
+        if (is_array($class)) {
+          $classList[] = self::buildClassAttr($class);
+        } else {
+          $classList[] = $class;
+        }
+      }
+    }
+
+    return implode(' ', $classList);
+  }
+
+  public static function cls(string|array $value): string
+  {
+    return self::instance()->merge(self::buildClassAttr($value)) ?? ' ';
+  }
+
   public static function attr(
     string|array $name,
     $value = null,
     string|null $before = null,
     string|null $after = null
   ): string|null {
     if ($name === 'class') {
-      $value =  self::instance()->merge($value);
+      $value = self::cls($value);
     }
 
     if (is_array($name) && isset($name['class'])) {
-      $name['class'] = self::instance()->merge($name['class']);
+      $name['class'] = self::cls($name['class']);
     }
 
     return Html::attr($name, $value, $before, $after);
   }
 
-  public static function merge(string|array $classes, ...$args): string
+  public static function merge(...$classes): string
   {
-    return self::attr('class', [$classes, ...$args]);
+    return self::attr('class', $classes) ?? ' ';
   }
 }

composer.json

@@ -1,7 +1,7 @@
 {
   "name": "tobimori/kirby-tailwind-merge",
   "description": "Tailwind Merge for Kirby CMS",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "type": "kirby-plugin",
   "keywords": [
     "kirby",

helpers.php

@@ -24,3 +24,13 @@ function merge(...$classes): string
     return TwMerge::merge($classes);
   }
 }
+
+if (option('tobimori.tailwind-merge.helpers.cls', true)) {
+  /**
+   * Outputs the contents of the class html attribute and intelligently merges classes with Tailwind Merge.
+   */
+  function cls(...$classes): string
+  {
+    return TwMerge::cls($classes);
+  }
+}

index.php

@@ -9,7 +9,8 @@
     'prefix' => '',
     'helpers' => [
       'attr' => true,
-      'merge' => true
+      'merge' => true,
+      'cls' => true
     ]
   ]
 ]);