@fy-/fws-vue 0.9.5 → 0.9.6

package/components/fws/UserProfile.vue

@@ -219,7 +219,7 @@ function selectFile(e: Event) {
       id="birthdateFWS"
       v-model="state.userData.Birthdate"
       class="mb-4"
-      type="date"
+      type="datepicker"
       :label="$t('fws_birthdate_label')"
       :error-vuelidate="v$.userData.Birthdate.$errors"
     />

package/components/fws/UserProfileStrict.vue

@@ -132,7 +132,7 @@ const patchUser = async () => {
       id="birthdateFWS"
       v-model="state.userData.Birthdate"
       class="mb-4"
-      type="date"
+      type="datepicker"
       :label="$t('fws_birthdate_label')"
       :error-vuelidate="v$.userData.Birthdate.$errors"
     />

package/components/ui/DefaultInput.vue

@@ -156,6 +156,43 @@ defineExpose({ focus, blur, getInputRef });
             @blur="handleBlur"
           />
         </div>
+        <div v-if="type == 'datepicker'">
+          <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>
+          <div class="relative max-w-sm">
+            <div
+              class="absolute inset-y-0 start-0 flex items-center ps-3.5 pointer-events-none"
+            >
+              <svg
+                class="w-4 h-4 text-fv-neutral-500 dark:text-fv-neutral-400"
+                aria-hidden="true"
+                xmlns="http://www.w3.org/2000/svg"
+                fill="currentColor"
+                viewBox="0 0 20 20"
+              >
+                <path
+                  d="M20 4a2 2 0 0 0-2-2h-2V1a1 1 0 0 0-2 0v1h-3V1a1 1 0 0 0-2 0v1H6V1a1 1 0 0 0-2 0v1H2a2 2 0 0 0-2 2v2h20V4ZM0 18a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8H0v10Zm5-8h10a1 1 0 0 1 0 2H5a1 1 0 0 1 0-2Z"
+                />
+              </svg>
+            </div>
+            <input
+              datepicker
+              type="text"
+              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 ps-10 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"
+              :placeholder="placeholder"
+              :disabled="disabled"
+              :aria-describedby="help ? `${id}-help` : id"
+              :required="req"
+              @focus="handleFocus"
+              @blur="handleBlur"
+              v-model="model"
+            />
+          </div>
+        </div>
         <div v-if="type == 'chips' || type == 'tags'">
           <label
             :for="id"

package/package.json

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