TabView {
        id: tabs
        width: browserWindow.width / 1.8
        function createEmptyTab(profile) {
            var tab = addTab("new tab", tabComponent);
            // We must do this first to make sure that tab.active gets set so that tab.item gets instantiated immediately.
            tab.active = true;
            tab.title = Qt.binding(function() { return tab.item.title });
            tab.item.profile = profile;
            return tab;

        }

        anchors.top: parent.top
        anchors.bottom: devToolsView.bottom
        anchors.left: parent.left
        anchors.right: parent.right
        Component.onCompleted: createEmptyTab(defaultProfile)

        // Add custom tab view style so we can customize the tabs to include a close button
        style: TabViewStyle {
            id: whiteTabs
            property color frameColor: "#999"
            property color fillColor: "#eee"
            property color nonSelectedColor: "#ddd"
            frameOverlap: 1
            frame: Rectangle {
                color: "#fff"
                border.color: frameColor
            }
            tab: Rectangle {
                id: tabRectangle
                width: 600
                height: 23
                color: styleData.selected ? '#C4C4C4' : '#DDDDDD'
                radius: 4
                clip: true

                implicitWidth: Math.max(50, 100)
                implicitHeight: Math.max(text.height + 10, 20)

                Text {
                    id: text
                    anchors.left: parent.left
                    anchors.verticalCenter: parent.verticalCenter
                    height: 15
                    anchors.leftMargin: 26
                    anchors.topMargin: 26
                    text: styleData.title
                    elide: Text.ElideRight
                    color: styleData.selected ? "black" : frameColor
                }
                Button {
                    anchors.right: parent.right
                    anchors.verticalCenter: parent.verticalCenter
                    anchors.rightMargin: 1
                    height: 12
                    iconSource: "icons/close.svg"
                    style: ButtonStyle {
                        background: Rectangle {
                            implicitWidth: 30
                            implicitHeight: 35
                            color: control.hovered ? "#ccc" : tabRectangle.color

                        }}
                    onClicked: tabs.removeTab(styleData.index);
                }

                Button {
                    anchors.left: parent.left
                    anchors.verticalCenter: parent.verticalCenter
                    anchors.rightMargin: 10
                    height: 15
                    iconSource: "icons/add.svg"
                    style: ButtonStyle {
                        background: Rectangle {
                            implicitWidth: 10
                            implicitHeight: 10
                            color: control.hovered ? "#ccc" : tabRectangle.color
                        }}
                    onClicked: tabs.createEmptyTab(styleData.index);
                }
            }
        }