New: Add Alpine.magic helper

CarbonPackages · Feb 29, 2024 · fedf384 · fedf384
1 parent b5d838d
commit fedf384
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 4 deletions.
diff --git a/Classes/EelHelper/AlpineJSHelper.php b/Classes/EelHelper/AlpineJSHelper.php
@@ -18,7 +18,7 @@ class AlpineJSHelper implements ProtectedContextAwareInterface
      * @param iterable|mixed $arguments
      * @return string
      */
-    public function xData(string $name, ...$arguments): string
+    public function xData(string $name, mixed ...$arguments): string
     {
         $result = [];
         foreach ($arguments as $argument) {
@@ -39,7 +39,7 @@ public function xData(string $name, ...$arguments): string
      * @param array|iterable $array
      * @return string
      */
-    public function object($array): ?string
+    public function object(iterable $array): ?string
     {
         if ($array instanceof Traversable) {
             $array = iterator_to_array($array);
@@ -53,7 +53,23 @@ public function object($array): ?string
     }
 
     /**
-     * Use this to pass a javascript expression inside of the `AlpineJS.object` or `AlpineJS.xData` helper
+     * Generate a function call for AlpineJS magics
+     *
+     * @param string $name The name of the magic function
+     * @param iterable|mixed $arguments
+     * @return string
+     */
+    public function magic(string $name, mixed ...$arguments)
+    {
+        if (!str_starts_with($name, '$')) {
+            $name = '$' . $name;
+        }
+
+        return $this->xData($name, ...$arguments);
+    }
+
+    /**
+     * Use this to pass a javascript expression inside of the `AlpineJS.object`, `AlpineJS.xData` or `AlpineJS.magic` helper
      *
      * @param string $value
      * @return string

diff --git a/README.md b/README.md
@@ -313,9 +313,28 @@ AlpineJS.xData('nested', {nested: {value: true}}) == 'nested({nested:{value:true
 
 **Return** The string for the x-data function call
 
+### `AlpineJS.magic(name, arg1, arg2, ..argN)`
+
+Generate a call for a magic function for AlpineJS..
+Supports nested arrays. In named arrays (`{first:1,second:null}`) `null` get filtered out, but in list
+arrays (`[1,null]`) and in plain values the will stay.
+
+Examples:
+
+```elm
+AlpineJS.magic('dispatch', 'notify') == '$dispatch('notify')'
+AlpineJS.magic('$dispatch', 'notify', { message: 'Hello World!' }) == '$dispatch('notify',{message:'Hello World!'})'
+AlpineJS.xData('dispatch', 'notify', { message: true, nested: {value: true} }) == '$dispatch('notify',{message:true,nested:{value:true}})'
+```
+
+- `name` (string) The name for the magic. If not prefixed with an `$`, it will automatically prefixed.
+- `...arguments` (mixed) The options for the function
+
+**Return** The string for the magic function call
+
 ### `AlpineJS.expression(value)`
 
-Use this to pass a javascript expression inside of the `AlpineJS.object` or `AlpineJS.xData` helper
+Use this to pass a javascript expression inside of the `AlpineJS.object`, `AlpineJS.xData` or `AlpineJS.magic` helper
 
 Example: