feat(ComboBox): extract Delegate in other file

resources.qrc

@@ -216,6 +216,7 @@
     <file>ui/modules/Common/Form/CheckBoxText.qml</file>
     <file>ui/modules/Common/Form/ComboBox.js</file>
     <file>ui/modules/Common/Form/ComboBox.qml</file>
+    <file>ui/modules/Common/Form/CommonItemDelegate.qml</file>
     <file>ui/modules/Common/Form/DroppableTextArea.qml</file>
     <file>ui/modules/Common/Form/Fields/HexField.qml</file>
     <file>ui/modules/Common/Form/Fields/NumericField.qml</file>
@@ -273,6 +274,7 @@
     <file>ui/modules/Common/Styles/Form/Buttons/TextButtonBStyle.qml</file>
     <file>ui/modules/Common/Styles/Form/CheckBoxTextStyle.qml</file>
     <file>ui/modules/Common/Styles/Form/ComboBoxStyle.qml</file>
+    <file>ui/modules/Common/Styles/Form/CommonItemDelegateStyle.qml</file>
     <file>ui/modules/Common/Styles/Form/DroppableTextAreaStyle.qml</file>
     <file>ui/modules/Common/Styles/Form/Fields/NumericFieldStyle.qml</file>
     <file>ui/modules/Common/Styles/Form/Fields/TextAreaFieldStyle.qml</file>

ui/modules/Common/Form/ComboBox.qml

@@ -4,7 +4,6 @@ import QtQuick.Layouts 1.3
 
 import Common 1.0
 import Common.Styles 1.0
-import Utils 1.0
 
 import 'ComboBox.js' as Logic
 
@@ -82,65 +81,13 @@ Controls.ComboBox {
 
   // ---------------------------------------------------------------------------
 
-  delegate: Controls.ItemDelegate {
+  delegate: CommonItemDelegate {
     id: item
 
-    readonly property var flattenedModel: comboBox.textRole.length &&
+    container: comboBox
+    flattenedModel: comboBox.textRole.length &&
       (typeof modelData !== 'undefined' ? modelData : model)
-
+    itemIcon: Logic.getEntryIcon(item)
-    hoverEnabled: true
     width: comboBox.width
-
-    background: Rectangle {
-      color: item.hovered
-        ? ComboBoxStyle.delegate.color.hovered
-        : ComboBoxStyle.delegate.color.normal
-
-      Rectangle {
-        anchors.left: parent.left
-        color: ComboBoxStyle.delegate.indicator.color
-
-        height: parent.height
-        width: ComboBoxStyle.delegate.indicator.width
-
-        visible: item.hovered
-      }
-
-      Rectangle {
-        anchors.bottom: parent.bottom
-        color: ComboBoxStyle.delegate.separator.color
-
-        height: ComboBoxStyle.delegate.separator.height
-        width: parent.width
-
-        visible: comboBox.count !== index + 1
-      }
-    }
-
-    contentItem: RowLayout {
-      spacing: ComboBoxStyle.delegate.contentItem.spacing
-      width: item.width
-
-      Icon {
-        icon: Logic.getEntryIcon(item)
-        iconSize: ComboBoxStyle.delegate.contentItem.iconSize
-
-        visible: icon.length > 0
-      }
-
-      Text {
-        Layout.fillWidth: true
-
-        color: ComboBoxStyle.delegate.contentItem.text.color
-        elide: Text.ElideRight
-
-        font {
-          bold: comboBox.currentIndex === index
-          pointSize: ComboBoxStyle.delegate.contentItem.text.pointSize
-        }
-
-        text: item.flattenedModel[textRole] || modelData
-      }
-    }
   }
 }

ui/modules/Common/Form/CommonItemDelegate.qml

@@ -0,0 +1,70 @@
+import QtQuick 2.7
+import QtQuick.Controls 2.2 as Controls
+import QtQuick.Layouts 1.3
+
+import Common 1.0
+import Common.Styles 1.0
+
+// =============================================================================
+
+Controls.ItemDelegate {
+  id: item
+
+  property var container
+  property var flattenedModel
+  property var itemIcon
+
+  hoverEnabled: true
+
+  background: Rectangle {
+    color: item.hovered
+      ? CommonItemDelegateStyle.color.hovered
+      : CommonItemDelegateStyle.color.normal
+
+    Rectangle {
+      anchors.left: parent.left
+      color: CommonItemDelegateStyle.indicator.color
+
+      height: parent.height
+      width: CommonItemDelegateStyle.indicator.width
+
+      visible: item.hovered
+    }
+
+    Rectangle {
+      anchors.bottom: parent.bottom
+      color: CommonItemDelegateStyle.separator.color
+
+      height: CommonItemDelegateStyle.separator.height
+      width: parent.width
+
+      visible: container.count !== index + 1
+    }
+  }
+
+  contentItem: RowLayout {
+    spacing: CommonItemDelegateStyle.contentItem.spacing
+    width: item.width
+
+    Icon {
+      icon: item.itemIcon
+      iconSize: CommonItemDelegateStyle.contentItem.iconSize
+
+      visible: icon.length > 0
+    }
+
+    Text {
+      Layout.fillWidth: true
+
+      color: CommonItemDelegateStyle.contentItem.text.color
+      elide: Text.ElideRight
+
+      font {
+        bold: container.currentIndex === index
+        pointSize: CommonItemDelegateStyle.contentItem.text.pointSize
+      }
+
+      text: item.flattenedModel[textRole] || modelData
+    }
+  }
+}

ui/modules/Common/Styles/Form/ComboBoxStyle.qml

@@ -34,31 +34,4 @@ QtObject {
       property int pointSize: Units.dp * 10
     }
   }
-
-  property QtObject delegate: QtObject {
-    property QtObject color: QtObject {
-      property color hovered: Colors.o
-      property color normal: Colors.q
-    }
-
-    property QtObject contentItem: QtObject {
-      property int iconSize: 20
-      property int spacing: 5
-
-      property QtObject text: QtObject {
-        property color color: Colors.d
-        property int pointSize: Units.dp * 10
-      }
-    }
-
-    property QtObject indicator: QtObject {
-      property color color: Colors.i
-      property int width: 5
-    }
-
-    property QtObject separator: QtObject {
-      property color color: Colors.c
-      property int height: 1
-    }
-  }
 }

ui/modules/Common/Styles/Form/CommonItemDelegateStyle.qml

@@ -0,0 +1,34 @@
+pragma Singleton
+import QtQml 2.2
+
+import Colors 1.0
+import Units 1.0
+
+// =============================================================================
+
+QtObject {
+  property QtObject color: QtObject {
+    property color hovered: Colors.o
+    property color normal: Colors.q
+  }
+
+  property QtObject contentItem: QtObject {
+    property int iconSize: 20
+    property int spacing: 5
+
+    property QtObject text: QtObject {
+      property color color: Colors.d
+      property int pointSize: Units.dp * 10
+    }
+  }
+
+  property QtObject indicator: QtObject {
+    property color color: Colors.i
+    property int width: 5
+  }
+
+  property QtObject separator: QtObject {
+    property color color: Colors.c
+    property int height: 1
+  }
+}

ui/modules/Common/Styles/qmldir

@@ -16,6 +16,7 @@ singleton ListFormStyle             1.0 Form/ListFormStyle.qml
 singleton SearchBoxStyle            1.0 Form/SearchBoxStyle.qml
 singleton SliderStyle               1.0 Form/SliderStyle.qml
 singleton SwitchStyle               1.0 Form/SwitchStyle.qml
+singleton CommonItemDelegateStyle   1.0 Form/CommonItemDelegateStyle.qml
 singleton TransparentTextInputStyle 1.0 Form/TransparentTextInputStyle.qml
 
 singleton AbstractTextButtonStyle   1.0 Form/Buttons/AbstractTextButtonStyle.qml