@fy-/fws-vue 2.0.45 → 2.0.48

package/components/ui/DefaultInput.vue

@@ -205,53 +205,63 @@ defineExpose({ focus, blur, getInputRef });
           </div>
         </div>
         -->
-        <div v-if="type == 'textrea-grow'">
+
+        <div v-if="type == 'chips' || type == 'tags'">
           <label
             :for="id"
-            v-if="label"
+            v-if="label || placeholder"
             class="block mb-2 text-sm font-medium text-fv-neutral-900 dark:text-white"
-            >{{ label }}
+            >{{ label ? label : placeholder }}
           </label>
+          <!-- @vue-skip -->
+          <DefaultTagInput
+            v-model="model"
+            :id="id"
+            :disabled="disabled"
+            :color="color"
+            :error="checkErrors"
+            :help="help"
+            :max-lenght-per-tag="maxLengthPerTag"
+          />
+        </div>
+        <div class="group relative" v-else-if="type == 'textarea-grow'">
+          <label
+            v-if="label"
+            :for="id"
+            class="block mb-2 text-sm font-medium text-fv-neutral-900 dark:text-white"
+            >{{ label }}</label
+          >
           <div class="grow-wrap">
-            <input
-              ref="inputRef"
-              type="textarea"
+            <!-- @vue-skip -->
+            <textarea
               :id="id"
               :name="id"
+              ref="inputRef"
               :class="{
                 error: checkErrors,
               }"
               v-model="model"
-              :autocomplete="autocomplete"
               :placeholder="placeholder"
               :disabled="disabled"
               :aria-describedby="help ? `${id}-help` : id"
-              class="bg-fv-neutral-50 border border-fv-neutral-300 text-fv-neutral-900 text-sm rounded-lg focus:ring-fv-primary-500 focus:border-fv-primary-500 block w-full p-2.5 dark:bg-fv-neutral-700 dark:border-fv-neutral-600 dark:placeholder-fv-neutral-400 dark:text-white dark:focus:ring-fv-primary-500 dark:focus:border-fv-primary-500"
               :required="req"
               @focus="handleFocus"
               @blur="handleBlur"
-            />
+              class="block p-2.5 w-full text-sm text-fv-neutral-900 bg-fv-neutral-50 rounded-lg border border-fv-neutral-300 focus:ring-fv-primary-500 focus:border-fv-primary-500 dark:bg-fv-neutral-700 dark:border-fv-neutral-600 dark:placeholder-fv-neutral-400 dark:text-white dark:focus:ring-fv-primary-500 dark:focus:border-fv-primary-500"
+            ></textarea>
+          </div>
+          <div
+            v-if="dpOptions.counterMax && model"
+            class="-mt-2 text-sm text-fv-neutral-500 dark:text-fv-neutral-400"
+            :class="{
+              'text-red-500 dark:text-red-300':
+                model?.toString().length > dpOptions.counterMax,
+            }"
+          >
+            {{ model?.toString().length }} / {{ dpOptions.counterMax }}
           </div>
         </div>
-        <div v-if="type == 'chips' || type == 'tags'">
-          <label
-            :for="id"
-            v-if="label || placeholder"
-            class="block mb-2 text-sm font-medium text-fv-neutral-900 dark:text-white"
-            >{{ label ? label : placeholder }}
-          </label>
-          <!-- @vue-skip -->
-          <DefaultTagInput
-            v-model="model"
-            :id="id"
-            :disabled="disabled"
-            :color="color"
-            :error="checkErrors"
-            :help="help"
-            :max-lenght-per-tag="maxLengthPerTag"
-          />
-        </div>
-        <div class="group relative" v-else-if="type == 'textarea-g'">
+        <div class="group relative" v-else-if="type == 'textarea'">
           <label
             v-if="label"
             :for="id"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fy-/fws-vue",
-  "version": "2.0.45",
+  "version": "2.0.48",
   "author": "Florian 'Fy' Gasquez <m@fy.to>",
   "license": "MIT",
   "repository": {