Qt Quick Contacts List view

 // Copyright (C) 2026 The Qt Company Ltd.
 // SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause

 import QtQuick 2.0
 // ![Custom DetailsEditWidget is used for entering new or modifying existing contact detlais]
 Item {
     width: parent.width - 30
     height: 20

     property alias label: label.text
     property alias value: valueText.text
     property alias color: valueText.color
     property alias inputFocus: valueText.focus
     property bool isPreferred: false
     property bool requestPreferred: false
     property bool showPreferredField: false

     property string old

     Text {
         id: label
         font {
             family: "Helvetica"
             pixelSize: 15
             bold: true
             italic: true
         }
     }

     Rectangle {
         id: inputField
         width: 180
         height: 20
         anchors.left: label.right
         anchors.leftMargin: 6
         color: "white"
         border {
             width: 2
             color: "darkgreen"
         }

         TextInput {
             id: valueText
             anchors.fill: parent
             anchors.leftMargin: 5
             font {
                 pixelSize: 16
                 family: "Helvetica"
             }
             onFocusChanged: {
                 if (focus === true) { // when entering text field
                     old = valueText.text
                 } else { // when exiting text field
                     if (valueText.text !== old) {
                         valueText.color = "red"
                     }
                 }
             }
         }
     }

     Text {
         id: labelFav

         anchors.left: inputField.right
         anchors.leftMargin: 5

         font {
             family: "Helvetica"
             pixelSize: 15
             bold: true
             italic: true
         }
         text: "favorite:"
         visible: showPreferredField
     }

     Rectangle {
         anchors.left: labelFav.right
         anchors.leftMargin: 5
         anchors.verticalCenter: labelFav.verticalCenter
         width: 10
         height: 10
         color: isPreferred || requestPreferred ? "black" : "white"
         visible: showPreferredField

         MouseArea {
             anchors.fill: parent
             onClicked: requestPreferred = !requestPreferred
         }
     }
 }
 // ![Custom DetailsEditWidget is used for entering new or modifying existing contact detlais]