From d9b5c591a73e178c2011ca3faa30b3a014f0b1a6 Mon Sep 17 00:00:00 2001
From: FlipWarthog <83613837+FlipWarthog@users.noreply.github.com>
Date: Thu, 21 Dec 2023 19:29:17 -0500
Subject: [PATCH] Fix #4567 - DropDown: Labels unassociated from DropDown
 unless :editable="true" (#4572)

* Fix #4567: DropDown: Labels unassociated from DropDown unless :editable="true"

* Format fix
---
 components/lib/dropdown/Dropdown.vue | 25 +++++++++++++++++++++++++
 1 file changed, 25 insertions(+)

diff --git a/components/lib/dropdown/Dropdown.vue b/components/lib/dropdown/Dropdown.vue
index 833d5c454..9f5727777 100755
--- a/components/lib/dropdown/Dropdown.vue
+++ b/components/lib/dropdown/Dropdown.vue
@@ -187,6 +187,7 @@ export default {
     outsideClickListener: null,
     scrollHandler: null,
     resizeListener: null,
+    labelClickListener: null,
     overlay: null,
     list: null,
     virtualScroller: null,
@@ -218,6 +219,7 @@ export default {
         this.id = this.id || UniqueComponentId();
 
         this.autoUpdateModel();
+        this.bindLabelClickListener();
     },
     updated() {
         if (this.overlayVisible && this.isModelValueChanged) {
@@ -229,6 +231,7 @@ export default {
     beforeUnmount() {
         this.unbindOutsideClickListener();
         this.unbindResizeListener();
+        this.unbindLabelClickListener();
 
         if (this.scrollHandler) {
             this.scrollHandler.destroy();
@@ -707,6 +710,28 @@ export default {
                 this.resizeListener = null;
             }
         },
+        bindLabelClickListener() {
+            if (!this.editable && !this.labelClickListener) {
+                const label = document.querySelector(`label[for="${this.inputId}"]`);
+
+                if (label && DomHandler.isVisible(label)) {
+                    this.labelClickListener = () => {
+                        DomHandler.focus(this.$refs.focusInput);
+                    };
+
+                    label.addEventListener('click', this.labelClickListener);
+                }
+            }
+        },
+        unbindLabelClickListener() {
+            if (this.labelClickListener) {
+                const label = document.querySelector(`label[for="${this.inputId}"]`);
+
+                if (label && DomHandler.isVisible(label)) {
+                    label.removeEventListener('click', this.labelClickListener);
+                }
+            }
+        },
         hasFocusableElements() {
             return DomHandler.getFocusableElements(this.overlay, ':not([data-p-hidden-focusable="true"])').length > 0;
         },