From 20d449e5927e9aa6fec167931cce744f9973df01 Mon Sep 17 00:00:00 2001
From: simonbuehler <simon@00010111.de>
Date: Sat, 19 Feb 2022 17:34:51 +0100
Subject: [PATCH 1/3] add imask.js masking options to input field

---
 resources/views/components/input.blade.php |  7 ++++++-
 src/Components/Input.php                   |  1 +
 src/Input.php                              | 10 ++++++++++
 3 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/resources/views/components/input.blade.php b/resources/views/components/input.blade.php
index 440c912..c734b66 100644
--- a/resources/views/components/input.blade.php
+++ b/resources/views/components/input.blade.php
@@ -1,4 +1,4 @@
-<div {{ $attributes->only('x-data') }} class="{{$field->wrapperClass}}">
+<div @if($field->maskOptions) x-data @endif class="{{$field->wrapperClass}}">
     @if($field->prefix || $field->hasIcon)
         <span class="{{ $field->icon_span }} {{ $field->left_border }}">
             @if($field->icon)
@@ -19,6 +19,7 @@
         @unless($field->disabled)
         <input
             @if($field->required) required @endif
+            @if($field->maskOptions) x-ref="imaskref" x-init="$nextTick(() => IMask($refs.imaskref, {{$field->maskOptions}} ))" @endif
             {{ $attributes->except([...array_keys($attr), 'x-data', 'required', 'disabled'])->merge($attr)->merge(['class' => $errors->has($field->key) ? $field->errorClass : $field->class ]) }}
         />
         @else
@@ -45,3 +46,7 @@
         </span>
     @endif
 </div>
+@tfonce('scripts:imask')
+<script src="https://unpkg.com/imask"></script>
+@endtfonce
+
diff --git a/src/Components/Input.php b/src/Components/Input.php
index c7c7238..0c416bb 100644
--- a/src/Components/Input.php
+++ b/src/Components/Input.php
@@ -53,6 +53,7 @@ protected function defaults(): array
             'min' => 0,
             'max' => null,
             'disabled' => false,
+            'maskOptions' => ''
         ];
     }
 
diff --git a/src/Input.php b/src/Input.php
index fb2e95b..1ebf4bd 100644
--- a/src/Input.php
+++ b/src/Input.php
@@ -25,6 +25,7 @@ class Input extends BaseField
     public $sfxTallIcon;
     public $sfxHtmlIcon;
     public bool $sfxHasIcon = false;
+    public string $maskOptions = '';
 
     protected function overrides(): self
     {
@@ -143,5 +144,14 @@ public function suffixHtmlIcon(string $html): self
         $this->sfxHasIcon = true;
         return $this;
     }
+    /**
+     * @param string $mask_options
+     * @return $this
+     */
+    public function maskOptions(string $mask_options): self
+    {
+        $this->maskOptions = $mask_options;
+        return $this;
+    }
 
 }

From 19dcea6fa9cde39576b1f6aace73ae79439ffc6e Mon Sep 17 00:00:00 2001
From: simonbuehler <simon@00010111.de>
Date: Tue, 22 Feb 2022 14:46:51 +0100
Subject: [PATCH 2/3] only require js when maskOptions are used

should fix the unneeded  js load
---
 resources/views/components/input.blade.php | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/resources/views/components/input.blade.php b/resources/views/components/input.blade.php
index c734b66..b721c81 100644
--- a/resources/views/components/input.blade.php
+++ b/resources/views/components/input.blade.php
@@ -46,7 +46,9 @@
         </span>
     @endif
 </div>
-@tfonce('scripts:imask')
-<script src="https://unpkg.com/imask"></script>
-@endtfonce
+@if($field->maskOptions)
+    @tfonce('scripts:imask')
+        <script src="https://unpkg.com/imask"></script>
+    @endtfonce
+@endif
 

From b741c054020d63d65ae5d9ab38c48326b97efccb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Simon=20B=C3=BChler?= <simon@00010111.de>
Date: Mon, 28 Mar 2022 14:48:33 +0200
Subject: [PATCH 3/3] revert x-data handling

---
 resources/views/components/input.blade.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/views/components/input.blade.php b/resources/views/components/input.blade.php
index b721c81..ad1e622 100644
--- a/resources/views/components/input.blade.php
+++ b/resources/views/components/input.blade.php
@@ -1,4 +1,4 @@
-<div @if($field->maskOptions) x-data @endif class="{{$field->wrapperClass}}">
+<div {{ $attributes->only('x-data') }} class="{{$field->wrapperClass}}">
     @if($field->prefix || $field->hasIcon)
         <span class="{{ $field->icon_span }} {{ $field->left_border }}">
             @if($field->icon)