refactor(vue-vuetify): centralize clearable logic in useVuetifyControl

yaffol · yaffol · commit 8cd3e18e1bec · 2025-11-26T23:51:58.000Z
diff --git a/packages/vue-vuetify/src/controls/AnyOfStringOrEnumControlRenderer.vue b/packages/vue-vuetify/src/controls/AnyOfStringOrEnumControlRenderer.vue
@@ -27,7 +27,7 @@
           : undefined
       "
       :items="items"
-      :clearable="appliedOptions.clearable !== undefined ? appliedOptions.clearable : control.enabled"
+      :clearable="clearable"
       v-bind="vuetifyProps('v-combobox')"
       @update:model-value="onChange"
       @focus="handleFocus"
diff --git a/packages/vue-vuetify/src/controls/DateControlRenderer.vue b/packages/vue-vuetify/src/controls/DateControlRenderer.vue
@@ -19,11 +19,7 @@
       :error-messages="control.errors"
       v-bind="vuetifyProps('v-text-field')"
       v-model="inputModel"
-      :clearable="
-        appliedOptions.clearable !== undefined
-          ? appliedOptions.clearable
-          : control.enabled
-      "
+      :clearable="clearable"
       @focus="handleFocus"
       @blur="handleBlur"
       v-maska:[options]="maska"
diff --git a/packages/vue-vuetify/src/controls/DateTimeControlRenderer.vue b/packages/vue-vuetify/src/controls/DateTimeControlRenderer.vue
@@ -19,7 +19,7 @@
       :error-messages="control.errors"
       v-bind="vuetifyProps('v-text-field')"
       v-model="inputModel"
-      :clearable="appliedOptions.clearable !== undefined ? appliedOptions.clearable : control.enabled"
+      :clearable="clearable"
       @focus="handleFocus"
       @blur="handleBlur"
       v-maska:[options]="maska"
diff --git a/packages/vue-vuetify/src/controls/EnumControlRenderer.vue b/packages/vue-vuetify/src/controls/EnumControlRenderer.vue
@@ -17,7 +17,7 @@
       :persistent-hint="persistentHint()"
       :required="control.required"
       :error-messages="control.errors"
-      :clearable="appliedOptions.clearable !== undefined ? appliedOptions.clearable : control.enabled"
+      :clearable="clearable"
       :model-value="control.data"
       :items="control.options"
       item-title="label"
diff --git a/packages/vue-vuetify/src/controls/IntegerControlRenderer.vue b/packages/vue-vuetify/src/controls/IntegerControlRenderer.vue
@@ -19,7 +19,7 @@
       :required="control.required"
       :error-messages="control.errors"
       :model-value="value"
-      :clearable="appliedOptions.clearable !== undefined ? appliedOptions.clearable : control.enabled"
+      :clearable="clearable"
       v-bind="vuetifyProps('v-text-field')"
       @update:model-value="onChange"
       @focus="handleFocus"
diff --git a/packages/vue-vuetify/src/controls/MultiStringControlRenderer.vue b/packages/vue-vuetify/src/controls/MultiStringControlRenderer.vue
@@ -26,7 +26,7 @@
           ? control.schema.maxLength
           : undefined
       "
-      :clearable="appliedOptions.clearable !== undefined ? appliedOptions.clearable : control.enabled"
+      :clearable="clearable"
       multi-line
       v-bind="vuetifyProps('v-textarea')"
       @update:model-value="onChange"
diff --git a/packages/vue-vuetify/src/controls/NumberControlRenderer.vue b/packages/vue-vuetify/src/controls/NumberControlRenderer.vue
@@ -20,7 +20,7 @@
       :required="control.required"
       :error-messages="control.errors"
       :model-value="value"
-      :clearable="appliedOptions.clearable !== undefined ? appliedOptions.clearable : control.enabled"
+      :clearable="clearable"
       v-bind="vuetifyProps('v-number-input')"
       @update:model-value="onChange"
       @focus="handleFocus"
diff --git a/packages/vue-vuetify/src/controls/OneOfEnumControlRenderer.vue b/packages/vue-vuetify/src/controls/OneOfEnumControlRenderer.vue
@@ -17,7 +17,7 @@
       :persistent-hint="persistentHint()"
       :required="control.required"
       :error-messages="control.errors"
-      :clearable="appliedOptions.clearable !== undefined ? appliedOptions.clearable : control.enabled"
+      :clearable="clearable"
       :model-value="control.data"
       :items="control.options"
       item-title="label"
diff --git a/packages/vue-vuetify/src/controls/StringControlRenderer.vue b/packages/vue-vuetify/src/controls/StringControlRenderer.vue
@@ -26,7 +26,7 @@
           ? control.schema.maxLength
           : undefined
       "
-      :clearable="appliedOptions.clearable !== undefined ? appliedOptions.clearable : control.enabled"
+      :clearable="clearable"
       :model-value="control.data"
       :items="suggestions"
       hide-no-data
@@ -64,7 +64,7 @@
           ? control.schema.maxLength
           : undefined
       "
-      :clearable="appliedOptions.clearable !== undefined ? appliedOptions.clearable : control.enabled"
+      :clearable="clearable"
       v-bind="vuetifyProps('v-text-field')"
       @update:model-value="onChange"
       @focus="handleFocus"
diff --git a/packages/vue-vuetify/src/controls/StringMaskControlRenderer.vue b/packages/vue-vuetify/src/controls/StringMaskControlRenderer.vue
@@ -25,7 +25,7 @@
           ? control.schema.maxLength
           : undefined
       "
-      :clearable="appliedOptions.clearable !== undefined ? appliedOptions.clearable : control.enabled"
+      :clearable="clearable"
       @click:clear="clear"
       v-bind="vuetifyProps('v-text-field')"
       @focus="handleFocus"
diff --git a/packages/vue-vuetify/src/controls/TimeControlRenderer.vue b/packages/vue-vuetify/src/controls/TimeControlRenderer.vue
@@ -19,7 +19,7 @@
       :error-messages="control.errors"
       v-bind="vuetifyProps('v-text-field')"
       v-model="inputModel"
-      :clearable="appliedOptions.clearable !== undefined ? appliedOptions.clearable : control.enabled"
+      :clearable="clearable"
       @focus="handleFocus"
       @blur="handleBlur"
       v-maska:[options]="maska"
diff --git a/packages/vue-vuetify/src/util/composition.ts b/packages/vue-vuetify/src/util/composition.ts
@@ -140,6 +140,7 @@ export const useVuetifyControl = <
     errors: string;
     id: string;
     visible: boolean;
+    enabled: boolean;
   },
   I extends {
     control: ComputedRef<T>;
@@ -215,6 +216,12 @@ export const useVuetifyControl = <
 
   const rawErrors = computed(() => input.control.value.errors);
 
+  const clearable = computed(() => {
+    return appliedOptions.value.clearable !== undefined
+      ? appliedOptions.value.clearable
+      : input.control.value.enabled;
+  });
+
   return {
     ...input,
     control: overwrittenControl,
@@ -226,6 +233,7 @@ export const useVuetifyControl = <
     vuetifyProps,
     persistentHint,
     computedLabel,
+    clearable,
     touched,
     handleBlur,
     handleFocus,

Original file line number	Diff line number	Diff line change
`@@ -27,7 +27,7 @@`
`27`	`27`	`: undefined`
`28`	`28`	`"`
`29`	`29`	`:items="items"`
`30`		`- :clearable="appliedOptions.clearable !== undefined ? appliedOptions.clearable : control.enabled"`
	`30`	`+ :clearable="clearable"`
`31`	`31`	`v-bind="vuetifyProps('v-combobox')"`
`32`	`32`	`@update:model-value="onChange"`
`33`	`33`	`@focus="handleFocus"`
Original file line number	Diff line number	Diff line change
`@@ -26,7 +26,7 @@`
`26`	`26`	`? control.schema.maxLength`
`27`	`27`	`: undefined`
`28`	`28`	`"`
`29`		`- :clearable="appliedOptions.clearable !== undefined ? appliedOptions.clearable : control.enabled"`
	`29`	`+ :clearable="clearable"`
`30`	`30`	`multi-line`
`31`	`31`	`v-bind="vuetifyProps('v-textarea')"`
`32`	`32`	`@update:model-value="onChange"`
Original file line number	Diff line number	Diff line change
`@@ -25,7 +25,7 @@`
`25`	`25`	`? control.schema.maxLength`
`26`	`26`	`: undefined`
`27`	`27`	`"`
`28`		`- :clearable="appliedOptions.clearable !== undefined ? appliedOptions.clearable : control.enabled"`
	`28`	`+ :clearable="clearable"`
`29`	`29`	`@click:clear="clear"`
`30`	`30`	`v-bind="vuetifyProps('v-text-field')"`
`31`	`31`	`@focus="handleFocus"`