fix: add hasfocus to ensure input is tabbable

shopware · Dec 19, 2024 · 4b54b66 · 4b54b66
1 parent 850421e
commit 4b54b66
Showing 1 changed file with 2 additions and 9 deletions.
diff --git a/packages/component-library/src/components/form/mt-colorpicker/mt-colorpicker.vue b/packages/component-library/src/components/form/mt-colorpicker/mt-colorpicker.vue
@@ -43,9 +43,10 @@
           :disabled="disabled"
           :readonly="readonly"
           @click="onClickInput"
-          @keyup.tab="toggleFocusClass"
           @keyup.enter="toggleColorPicker"
           @keyup.escape="outsideClick"
+          @focus="hasFocus = true"
+          @blur="hasFocus = false"
         />
 
         <mt-floating-ui
@@ -1300,14 +1301,6 @@ export default defineComponent({
       this.toggleColorPicker();
     },
 
-    toggleFocusClass() {
-      if (this.hasFocus) {
-        this.removeFocusClass();
-      }
-      this.setFocusClass();
-      console.log(this.hasFocus)
-    },
-
     setFocusClass() {
       this.hasFocus = true;
     },