use loader pattern

Widgets/DankIconPicker.qml

@@ -19,7 +19,7 @@ Rectangle {
   height: 32
   radius: Theme.cornerRadius
   color: Theme.surfaceContainer
-  border.color: dropdownPopup.visible ? Theme.primary : (mouseArea.containsMouse ? Theme.outline : Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.5))
+  border.color: dropdownLoader.active ? Theme.primary : (mouseArea.containsMouse ? Theme.outline : Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.5))
   border.width: 1
 
   property var iconCategories: [
@@ -66,11 +66,7 @@ Rectangle {
     anchors.fill: parent
     hoverEnabled: true
     onClicked: {
-      if (dropdownPopup.visible) {
-        dropdownPopup.visible = false
-      } else {
-        dropdownPopup.visible = true
-      }
+      dropdownLoader.active = !dropdownLoader.active
     }
   }
 
@@ -102,7 +98,7 @@ Rectangle {
   }
 
   DankIcon {
-    name: dropdownPopup.visible ? "expand_less" : "expand_more"
+    name: dropdownLoader.active ? "expand_less" : "expand_more"
     size: 16
     color: Theme.outline
     anchors.right: parent.right
@@ -110,10 +106,15 @@ Rectangle {
     anchors.verticalCenter: parent.verticalCenter
   }
 
-  PanelWindow {
+  Loader {
+    id: dropdownLoader
+    active: false
+    asynchronous: true
+    
+    sourceComponent: PanelWindow {
       id: dropdownPopup
       
-    visible: false
+      visible: true
       implicitWidth: 320
       implicitHeight: Math.min(500, dropdownContent.implicitHeight + 32)
       color: "transparent"
@@ -131,7 +132,7 @@ Rectangle {
       // Click outside to close
       MouseArea {
         anchors.fill: parent
-      onClicked: dropdownPopup.visible = false
+        onClicked: dropdownLoader.active = false
       }
 
       Rectangle {
@@ -232,7 +233,7 @@ Rectangle {
                         var trimmedText = text.trim()
                         if (trimmedText) {
                           root.iconSelected(trimmedText, "text")
-                        dropdownPopup.visible = false
+                          dropdownLoader.active = false
                         }
                       }
                     }
@@ -296,7 +297,7 @@ Rectangle {
                         cursorShape: Qt.PointingHandCursor
                         onClicked: {
                           root.iconSelected(modelData, "icon")
-                        dropdownPopup.visible = false
+                          dropdownLoader.active = false
                         }
                       }
 
@@ -315,6 +316,7 @@ Rectangle {
         }
       }
     }
+  }
 
   function setIcon(iconName, type) {
     if (type === "text") {