From 94ff47df5240fd5339b48da98a2bac50f5dd8bdb Mon Sep 17 00:00:00 2001
From: George <34766485+Georglider@users.noreply.github.com>
Date: Tue, 5 Nov 2024 19:26:34 +0300
Subject: [PATCH] feat: alwaysClearable prop

---
 src/VueDatePicker/components/DatepickerInput.vue | 4 ++--
 src/VueDatePicker/props.ts                       | 1 +
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/VueDatePicker/components/DatepickerInput.vue b/src/VueDatePicker/components/DatepickerInput.vue
index 2a2421cd..08f9f8d9 100644
--- a/src/VueDatePicker/components/DatepickerInput.vue
+++ b/src/VueDatePicker/components/DatepickerInput.vue
@@ -58,11 +58,11 @@
                     @click="emit('toggle')"
                 />
             </div>
-            <span v-if="$slots['clear-icon'] && inputValue && clearable && !disabled && !readonly" class="dp--clear-btn"
+            <span v-if="$slots['clear-icon'] && (alwaysClearable || inputValue && clearable && !disabled && !readonly)" class="dp--clear-btn"
                 ><slot name="clear-icon" :clear="onClear"
             /></span>
             <button
-                v-if="clearable && !$slots['clear-icon'] && inputValue && !disabled && !readonly"
+                v-if="!$slots['clear-icon'] && (alwaysClearable || clearable && inputValue && !disabled && !readonly)"
                 :aria-label="defaultedAriaLabels?.clearInput"
                 class="dp--clear-btn"
                 type="button"
diff --git a/src/VueDatePicker/props.ts b/src/VueDatePicker/props.ts
index 3ba89a61..f1bd9cd5 100644
--- a/src/VueDatePicker/props.ts
+++ b/src/VueDatePicker/props.ts
@@ -120,6 +120,7 @@ export const AllProps = {
     placeholder: { type: String as PropType<string>, default: '' },
     hideInputIcon: { type: Boolean as PropType<boolean>, default: false },
     clearable: { type: Boolean as PropType<boolean>, default: true },
+    alwaysClearable: { type: Boolean as PropType<boolean>, default: false },
     state: { type: Boolean as PropType<boolean | null>, default: null },
     required: { type: Boolean as PropType<boolean>, default: false },
     autocomplete: { type: String as PropType<string>, default: 'off' },