feat(Controls): introduce `StatusPasswordInput`

`StatusPasswordInput` is a wrapper around  `TextField` with an option
to display signing phrase.

sandbox/pages/StatusInputPage.qml

@@ -56,6 +56,15 @@ Column {
         input.clearable: true
     }
 
+    StatusPasswordInput {
+        placeholderText: "Password"
+    }
+
+    StatusPasswordInput {
+        signingPhrase: "orange hello cygnet"
+        placeholderText: "Password"
+    }
+
     Item {
         implicitWidth: 480
         implicitHeight: 82

src/StatusQ/Controls/StatusPasswordInput.qml

@@ -0,0 +1,108 @@
+import QtQuick 2.14
+import QtQuick.Layouts 1.12
+import QtQuick.Controls 2.14
+
+import StatusQ.Core 0.1
+import StatusQ.Core.Theme 0.1
+import StatusQ.Controls 0.1
+
+/*!
+   \qmltype StatusPasswordInput
+   \inherits Item
+   \inqmlmodule StatusQ.Controls
+   \since StatusQ.Controls 0.1
+   \brief The StatusPasswordInput control provides a generic user password input with an option to display signing phrase
+
+   Example of how to use it:
+
+   \qml
+        StatusPasswordInput {
+            signingPhrase: "orange hello cygnet"
+            placeholderText: qsTr("Password")
+        }
+   \endqml
+
+   For a list of available components see StatusQ.
+*/
+
+TextField {
+    id: root
+
+    /*!
+        \qmlproperty string StatusPasswordInput::signingPhrase
+        This property sets the signingPhrase of TextField field and signing seed phrase.
+    */
+    property string signingPhrase: ""
+
+    QtObject {
+        id: d
+
+        readonly property int inputTextPadding: 16
+        readonly property int pixelSize: 15
+        readonly property int radius: 8
+        readonly property int signingPhrasePadding: 8
+        readonly property int signingPhraseWordPadding: 8
+        readonly property int signingPhraseWordsSpacing: 8
+        readonly property int signingPhraseWordsHeight: 30
+
+    }
+
+    leftPadding: d.inputTextPadding
+    rightPadding: root.signingPhrase !== ""?
+                      phrase.width + phrase.anchors.leftMargin + phrase.anchors.rightMargin :
+                      d.inputTextPadding
+    verticalAlignment: Text.AlignVCenter
+    implicitWidth: 480
+    implicitHeight: 44
+
+
+    placeholderTextColor: Theme.palette.baseColor1
+    echoMode: TextInput.Password
+    font.pixelSize: d.pixelSize
+    font.family: Theme.palette.baseFont.name
+    color: Theme.palette.directColor1
+    selectionColor: Theme.palette.primaryColor2
+    selectedTextColor: Theme.palette.directColor1
+    background: Rectangle {
+        id: inputRectangle
+        anchors.fill: parent
+        color: Theme.palette.baseColor5
+        radius: d.radius
+        border.width: root.focus ? 1 : 0
+        border.color: {
+            if (root.focus) {
+                return Theme.palette.primaryColor1
+            }
+            return "transparent"
+        }
+    }
+
+
+    RowLayout {
+        id: phrase
+        anchors.right: parent.right
+        anchors.verticalCenter: parent.verticalCenter
+        anchors.leftMargin: d.signingPhrasePadding
+        anchors.rightMargin: d.signingPhrasePadding
+        spacing: d.signingPhraseWordsSpacing
+        visible: root.signingPhrase !== ""
+        Repeater {
+            model: root.signingPhrase.split(" ")
+            delegate: Rectangle {
+                width: signingPhraseWord.implicitWidth + 2 * d.signingPhraseWordPadding
+                height: d.signingPhraseWordsHeight
+                color: Theme.palette.indirectColor1
+                radius: d.radius
+
+                StatusBaseText {
+                    id: signingPhraseWord
+                    anchors.centerIn: parent
+                    color: Theme.palette.primaryColor1
+                    font.pixelSize: root.font.pixelSize
+                    font.family: root.font.family
+                    text: modelData
+                }
+            }
+        }
+    }
+}

src/StatusQ/Controls/qmldir

@@ -51,3 +51,4 @@ StatusComboBox 0.1 StatusComboBox.qml
 StatusItemDelegate 0.1 StatusItemDelegate.qml
 StatusTextArea 0.1 StatusTextArea.qml
 StatusBackButton 0.1 StatusBackButton.qml
+StatusPasswordInput 0.1 StatusPasswordInput.qml

src/statusq.qrc

@@ -93,6 +93,7 @@
         <file>StatusQ/Controls/StatusLabeledSlider.qml</file>
         <file>StatusQ/Controls/StatusNavBarTabButton.qml</file>
         <file>StatusQ/Controls/StatusPasswordStrengthIndicator.qml</file>
+        <file>StatusQ/Controls/StatusPasswordInput.qml</file>
         <file>StatusQ/Controls/StatusPickerButton.qml</file>
         <file>StatusQ/Controls/StatusPinInput.qml</file>
         <file>StatusQ/Controls/StatusProgressBar.qml</file>