From c479901f9d9b7a6e618edc2e4e995287dda22d4e Mon Sep 17 00:00:00 2001
From: Irineu Junior <irineu@fmd.ag>
Date: Mon, 19 Feb 2024 22:57:47 -0300
Subject: [PATCH] feat(textarea) adiciona contador de caracteres

---
 docs/form.md                                  |  2 +-
 src/View/Components/Forms/Inputs/Textarea.php | 39 +++++++++++--------
 2 files changed, 24 insertions(+), 17 deletions(-)

diff --git a/docs/form.md b/docs/form.md
index bbd02da..dbf174b 100644
--- a/docs/form.md
+++ b/docs/form.md
@@ -8,7 +8,7 @@
         <x-form.input name="name" label="Nome" required/>
     </div>
     <div class="mb-3">
-        <x-form.textarea name="message" label="Mensagem" required/>
+        <x-form.textarea name="message" label="Mensagem" maxlength=100 required/>
     </div>
     <div class="mb-3">
         @php
diff --git a/src/View/Components/Forms/Inputs/Textarea.php b/src/View/Components/Forms/Inputs/Textarea.php
index 41794b1..f2d1beb 100644
--- a/src/View/Components/Forms/Inputs/Textarea.php
+++ b/src/View/Components/Forms/Inputs/Textarea.php
@@ -24,22 +24,29 @@ public function __construct(
     public function render(): string|View
     {
         return <<<'HTML'
-            @if($label)
-                <x-form.label for="{{ $name . $uuid }}" @class(['required' => $attributes->has('required')])>
-                    {{ str($label)->lower()->ucfirst() }}
-                </x-form.label>
-            @endif
-            <textarea wire:model="{{ $name }}" {{ $attributes->merge([
-                                    'id' => $name . $uuid,
-                                    'rows' => $rows,
-                                ])->class([
-                                    'form-control',
-                                    'is-invalid' => $errors->has($name),
-                            ])
-                        }}
-                    ></textarea>
-            <x-form.error field="{{ $name }}"/>
-            <x-form.hint message="{{ $hint }}"/>
+            <div x-data="{ count: 0 }" x-init="count = $refs.fieldToCount.value.length">
+                @if($label)
+                    <x-form.label for="{{ $name . $uuid }}" @class(['required' => $attributes->has('required')])>
+                        {{ str($label)->lower()->ucfirst() }}
+                        @if($attributes->has('maxlength'))
+                            <span class="form-label-description">
+                            <span x-html="count"></span>/<span x-html="$refs.fieldToCount.maxLength"></span></span>
+                        @endif
+                    </x-form.label>
+                @endif
+                <textarea wire:model="{{ $name }}" {{ $attributes->merge([
+                                        'id' => $name . $uuid,
+                                        'rows' => $rows,
+                                    ])->class([
+                                        'form-control',
+                                        'is-invalid' => $errors->has($name),
+                                ])
+                            }}
+                            x-ref="fieldToCount" x-on:keyup="count = $refs.fieldToCount.value.length"
+                        ></textarea>
+                <x-form.error field="{{ $name }}"/>
+                <x-form.hint message="{{ $hint }}"/>
+            </div>
         HTML;
     }
 }