1 files changed, 41 insertions, 22 deletions

diff --git a/src/imports/controls/material/ComboBox.qml b/src/imports/controls/material/ComboBox.qml
index c38c2b01..0721e8f3 100644
--- a/src/imports/controls/material/ComboBox.qml
+++ b/src/imports/controls/material/ComboBox.qml
@@ -34,12 +34,12 @@
 **
 ****************************************************************************/
 
-import QtQuick 2.8
+import QtQuick 2.9
 import QtQuick.Window 2.2
-import QtQuick.Controls 2.1
-import QtQuick.Templates 2.1 as T
-import QtQuick.Controls.Material 2.1
-import QtQuick.Controls.Material.impl 2.1
+import QtQuick.Controls 2.2
+import QtQuick.Templates 2.2 as T
+import QtQuick.Controls.Material 2.2
+import QtQuick.Controls.Material.impl 2.2
 
 T.ComboBox {
     id: control
@@ -51,11 +51,8 @@ T.ComboBox {
                                       indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding)
     baselineOffset: contentItem.y + contentItem.baselineOffset
 
-    spacing: 6
-    // external vertical padding is 6 (to increase touch area)
-    padding: 12
-    leftPadding: padding - 4
-    rightPadding: padding - 4
+    leftPadding: padding + (!control.mirrored || !indicator || !indicator.visible ? 0 : indicator.width + spacing)
+    rightPadding: padding + (control.mirrored || !indicator || !indicator.visible ? 0 : indicator.width + spacing)
 
     Material.elevation: flat ? control.pressed || control.hovered ? 2 : 0
                              : control.pressed ? 8 : 2
@@ -63,31 +60,42 @@ T.ComboBox {
     Material.foreground: flat ? undefined : Material.primaryTextColor
 
     delegate: MenuItem {
-        width: control.popup.width
+        width: parent.width
         text: control.textRole ? (Array.isArray(control.model) ? modelData[control.textRole] : model[control.textRole]) : modelData
-        Material.foreground: control.currentIndex === index ? control.popup.Material.accent : control.popup.Material.foreground
+        Material.foreground: control.currentIndex === index ? parent.Material.accent : parent.Material.foreground
         highlighted: control.highlightedIndex === index
         hoverEnabled: control.hoverEnabled
     }
 
     indicator: Image {
-        x: control.mirrored ? control.leftPadding : control.width - width - control.rightPadding
+        x: control.mirrored ? control.padding : control.width - width - control.padding
         y: control.topPadding + (control.availableHeight - height) / 2
         source: "image://material/drop-indicator/" + (control.enabled ? control.Material.foreground : control.Material.hintTextColor)
         sourceSize.width: width
         sourceSize.height: height
     }
 
-    contentItem: Text {
-        leftPadding: control.mirrored && control.indicator ? control.indicator.width + control.spacing : 0
-        rightPadding: !control.mirrored && control.indicator ? control.indicator.width + control.spacing : 0
+    contentItem: T.TextField {
+        padding: 6
+        leftPadding: control.editable ? 2 : control.mirrored ? 0 : 12
+        rightPadding: control.editable ? 2 : control.mirrored ? 12 : 0
+
+        text: control.editable ? control.editText : control.displayText
+
+        enabled: control.editable
+        autoScroll: control.editable
+        readOnly: control.popup.visible
+        inputMethodHints: control.inputMethodHints
+        validator: control.validator
 
-        text: control.displayText
         font: control.font
         color: control.enabled ? control.Material.foreground : control.Material.hintTextColor
+        selectionColor: control.Material.accentColor
+        selectedTextColor: control.Material.primaryHighlightedTextColor
         horizontalAlignment: Text.AlignLeft
         verticalAlignment: Text.AlignVCenter
-        elide: Text.ElideRight
+
+        cursorDelegate: CursorDelegate { }
     }
 
     background: Rectangle {
@@ -98,32 +106,43 @@ T.ComboBox {
         y: 6
         height: parent.height - 12
         radius: control.flat ? 0 : 2
-        color: control.Material.dialogColor
+        color: !control.editable ? control.Material.dialogColor : "transparent"
 
         Behavior on color {
+            enabled: !control.editable
             ColorAnimation {
                 duration: 400
             }
         }
 
-        layer.enabled: control.enabled && control.Material.background.a > 0
+        layer.enabled: control.enabled && !control.editable && control.Material.background.a > 0
         layer.effect: ElevationEffect {
             elevation: control.Material.elevation
         }
 
+        Rectangle {
+            visible: control.editable
+            y: parent.y + control.baselineOffset
+            width: parent.width
+            height: control.activeFocus ? 2 : 1
+            color: control.editable && control.activeFocus ? control.Material.accentColor : control.Material.hintTextColor
+        }
+
         Ripple {
             clip: control.flat
             clipRadius: control.flat ? 0 : 2
-            width: parent.width
+            x: control.editable && control.indicator ? control.indicator.x : 0
+            width: control.editable && control.indicator ? control.indicator.width : parent.width
             height: parent.height
             pressed: control.pressed
-            anchor: control
+            anchor: control.editable && control.indicator ? control.indicator : control
             active: control.pressed || control.visualFocus || control.hovered
             color: control.Material.rippleColor
         }
     }
 
     popup: T.Popup {
+        y: control.editable ? control.height - 5 : 0
         width: control.width
         implicitHeight: contentItem.implicitHeight
         transformOrigin: Item.Top