Nesting a ScrollView into a PinchArea doesn't work as expected

import QtQuick 2.0
import QtQuick.Controls 1.0

Rectangle {
    id: root
    width: 1200
    height: 200
    property real itemWidth: 100

    PinchArea {
        anchors.fill: parent
        pinch.minimumScale: 0.1
        pinch.maximumScale: 10
        property real origWidth
        property real origX

        onPinchStarted: {
            origX = flick.contentX;
            origWidth = root.itemWidth;
        }

        onPinchUpdated: {
            flick.contentX = origX * pinch.scale;
            root.itemWidth = origWidth * pinch.scale;
        }

        onPinchFinished: flick.returnToBounds()

        ScrollView {
            anchors.fill: parent

            Flickable {
                id: flick
                contentWidth: row.width

                Row {
                    id: row
                    spacing: 20
                    Repeater {
                        model: 30
                        Rectangle {
                            width: itemWidth
                            height: 40
                            border.width: 1
                            color: ma.containsMouse ? "red" : "white"
                            border.color: "black"
                            antialiasing: true
                            property int t: index
                            Text {
                                anchors.centerIn: parent
                                text: parent.t
                            }

                            MouseArea {
                                id: ma
                                hoverEnabled: true
                                anchors.fill: parent
                                onPositionChanged: console.log(mouse.x, mouse.y)
                            }
                        }
                    }
                }
            }
        }
    }
}