feat(Controls): introduce `StatusInput`

`StatusInput` is a wrapper around `StatusBaseInput` to provide additional
component composition for labels, error messages and alike

Closes #288

ui/StatusQ/sandbox/StatusInputPage.qml

@@ -10,40 +10,45 @@ import Sandbox 0.1
 Column {
     spacing: 8
 
-    StatusBaseInput {
-        placeholderText: "Placeholder"
+    StatusInput {
+        input.placeholderText: "Placeholder"
     }
 
-    StatusBaseInput {
-        placeholderText: "Disabled"
-        enabled: false
+    StatusInput {
+        input.placeholderText: "Disabled"
+        input.enabled: false
     }
 
-    StatusBaseInput {
-        placeholderText: "Clearable"
-        clearable: true
+    StatusInput {
+        input.placeholderText: "Clearable"
+        input.clearable: true
     }
 
-    StatusBaseInput {
-        placeholderText: "Invalid"
-        valid: false
+    StatusInput {
+        input.placeholderText: "Invalid"
+        input.valid: false
     }
 
-    StatusBaseInput {
-        multiline: true
-        placeholderText: "Multiline"
+    StatusInput {
+        label: "Label"
+        input.placeholderText: "Placeholder"
     }
 
-    StatusBaseInput {
-        multiline: true
-        placeholderText: "Multiline with static height"
-        implicitHeight: 100
+    StatusInput {
+        input.multiline: true
+        input.placeholderText: "Multiline"
     }
 
-    StatusBaseInput {
-        multiline: true
-        placeholderText: "Multiline with max/min"
-        minimumHeight: 80
-        maximumHeight: 200
+    StatusInput {
+        input.multiline: true
+        input.placeholderText: "Multiline with static height"
+        input.implicitHeight: 100
+    }
+
+    StatusInput {
+        input.multiline: true
+        input.placeholderText: "Multiline with max/min"
+        input.minimumHeight: 80
+        input.maximumHeight: 200
     }
 }

ui/StatusQ/src/StatusQ/Controls/StatusInput.qml

@@ -0,0 +1,42 @@
+import QtQuick 2.14
+
+import StatusQ.Core 0.1
+import StatusQ.Core.Theme 0.1
+import StatusQ.Controls 0.1
+
+Item {
+    id: root
+
+    implicitWidth: 480
+    height: label.anchors.topMargin +
+            label.height + 
+            statusBaseInput.anchors.topMargin +
+            statusBaseInput.height + 8
+
+    property alias input: statusBaseInput
+    property string label: ""
+
+    StatusBaseText {
+        id: label
+        height: visible ? implicitHeight : 0
+        anchors.top: parent.top
+        anchors.left: parent.left
+        anchors.topMargin: visible ? 8 : 0
+        anchors.leftMargin: 16
+        visible: !!root.label
+
+        text: root.label
+        font.pixelSize: 15
+        color: Theme.palette.directColor1
+    }
+
+    StatusBaseInput {
+        id: statusBaseInput
+        anchors.top:  label.bottom
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.topMargin: 8
+        anchors.leftMargin: 16
+        anchors.rightMargin: 16
+    }
+}

ui/StatusQ/src/StatusQ/Controls/qmldir

@@ -15,4 +15,5 @@ StatusRadioButton 0.1 StatusRadioButton.qml
 StatusCheckBox 0.1 StatusCheckBox.qml
 StatusSlider 0.1 StatusSlider.qml
 StatusBaseInput 0.1 StatusBaseInput.qml
+StatusInput 0.1 StatusInput.qml
 StatusPickerButton 0.1 StatusPickerButton.qml