I am making a custom button script since you can't really customize buttons in QML, and I wanted the script using it to be able to change the font. So I added a string property for the font. But I keep getting this error:

qrc:/qt/qml/gui/CustomButton.qml:34:5: QML QQuickText: Binding loop detected for property "font.family":

Here is the script:

import QtQuick

Rectangle {
    id: button

    property string text: "Button"
    property int padding: 0
    property color normalColor: Theme.palette.button.normal
    property color hoverColor: Theme.palette.button.hover
    property color pressedColor: Theme.palette.button.pressed
    property int borderWidth: 0
    property string borderColor: Theme.palette.button.border
    property string font: Theme.fonts.main

    signal clicked()

    width: 80
    height: 36
    radius: 8
    anchors.margins: padding

    color: mouseArea.pressed
           ? button.pressedColor
           : mouseArea.containsMouse
             ? button.hoverColor
             : button.normalColor


    border {
        color: borderColor
        width: borderWidth
    }

    Text {
        anchors.centerIn: parent
        text: button.text
        color: Theme.palette.text
        font.family: font
    }

    MouseArea {
        id: mouseArea

        anchors.fill: parent
        hoverEnabled: true

        onClicked: button.clicked()
    }
}

Note: Theme.qml is just a storage place of all the different readonly fonts, images, and colors to organize things.