diff --git a/CMakeLists.txt b/CMakeLists.txt
--- a/CMakeLists.txt
+++ b/CMakeLists.txt
@@ -1,4 +1,4 @@
-project(kirigami)
+project(kirigami2)
 
 cmake_minimum_required(VERSION 2.8.12)
 set(KF5_MIN_VERSION "5.18.0")
@@ -48,19 +48,19 @@
 include(KDECMakeSettings)
 include(KDECompilerSettings NO_POLICY_SCOPE)
 
-set(CMAKECONFIG_INSTALL_DIR "${KDE_INSTALL_CMAKEPACKAGEDIR}/KF5Kirigami")
+set(CMAKECONFIG_INSTALL_DIR "${KDE_INSTALL_CMAKEPACKAGEDIR}/KF5Kirigami2")
 
 ecm_configure_package_config_file(
-  "${CMAKE_CURRENT_SOURCE_DIR}/KF5KirigamiConfig.cmake.in"
-  "${CMAKE_CURRENT_BINARY_DIR}/KF5KirigamiConfig.cmake"
+  "${CMAKE_CURRENT_SOURCE_DIR}/KF5Kirigami2Config.cmake.in"
+  "${CMAKE_CURRENT_BINARY_DIR}/KF5Kirigami2Config.cmake"
   INSTALL_DESTINATION  ${CMAKECONFIG_INSTALL_DIR}
   PATH_VARS  KF5_INCLUDE_INSTALL_DIR CMAKE_INSTALL_PREFIX
 )
 
 install(FILES
-  "${CMAKE_CURRENT_BINARY_DIR}/KF5KirigamiConfig.cmake"
-  "${CMAKE_CURRENT_BINARY_DIR}/KF5KirigamiConfigVersion.cmake"
-  "${CMAKE_CURRENT_SOURCE_DIR}/KF5KirigamiMacros.cmake"
+  "${CMAKE_CURRENT_BINARY_DIR}/KF5Kirigami2Config.cmake"
+  "${CMAKE_CURRENT_BINARY_DIR}/KF5Kirigami2ConfigVersion.cmake"
+  "${CMAKE_CURRENT_SOURCE_DIR}/KF5Kirigami2Macros.cmake"
   DESTINATION "${CMAKECONFIG_INSTALL_DIR}"
   COMPONENT Devel
 )
@@ -70,10 +70,10 @@
 ecm_setup_version(${KF5_VERSION}
     VARIABLE_PREFIX KIRIGAMI
     VERSION_HEADER "${CMAKE_CURRENT_BINARY_DIR}/kirigami_version.h"
-    PACKAGE_VERSION_FILE "${CMAKE_CURRENT_BINARY_DIR}/KF5KirigamiConfigVersion.cmake"
+    PACKAGE_VERSION_FILE "${CMAKE_CURRENT_BINARY_DIR}/KF5Kirigami2ConfigVersion.cmake"
     SOVERSION 5)
 
-find_package(Qt5 ${QT_MIN_VERSION} REQUIRED NO_MODULE COMPONENTS Core Quick Test Gui Svg)
+find_package(Qt5 ${QT_MIN_VERSION} REQUIRED NO_MODULE COMPONENTS Core Quick Test Gui Svg QuickControls2)
 
 if(PLASMA_ENABLED)
 # treat plasma as an optinal dep: full functionality is expected with only Qt
@@ -105,6 +105,7 @@
 find_package(PkgConfig)
 #########################################################################
 
+add_subdirectory(autotests)
 add_subdirectory(src)
 #TODO: conditional
 if (BUILD_EXAMPLES)
diff --git a/KF5KirigamiConfig.cmake.in b/KF5Kirigami2Config.cmake.in
rename from KF5KirigamiConfig.cmake.in
rename to KF5Kirigami2Config.cmake.in
--- a/KF5KirigamiConfig.cmake.in
+++ b/KF5Kirigami2Config.cmake.in
@@ -8,4 +8,4 @@
 
 #set(Kirigami_LIBRARIES KF5::Kirigami)
 
-include("${CMAKE_CURRENT_LIST_DIR}/KF5KirigamiMacros.cmake")
+include("${CMAKE_CURRENT_LIST_DIR}/KF5Kirigami2Macros.cmake")
diff --git a/KF5KirigamiMacros.cmake b/KF5Kirigami2Macros.cmake
rename from KF5KirigamiMacros.cmake
rename to KF5Kirigami2Macros.cmake
--- a/KF5KirigamiMacros.cmake
+++ b/KF5Kirigami2Macros.cmake
@@ -74,7 +74,7 @@
         _find_breeze_icon(${_iconName} _iconPath)
         message (STATUS ${_iconPath})
         if (EXISTS ${_iconPath})
-            install(FILES ${_iconPath} DESTINATION ${KDE_INSTALL_QMLDIR}/org/kde/kirigami/icons/ RENAME ${_iconName}.svg)
+            install(FILES ${_iconPath} DESTINATION ${KDE_INSTALL_QMLDIR}/org/kde/kirigami.2/icons/ RENAME ${_iconName}.svg)
         endif()
 
     endforeach()
diff --git a/Mainpage.dox b/Mainpage.dox
--- a/Mainpage.dox
+++ b/Mainpage.dox
@@ -55,7 +55,7 @@
 
 @code
 import QtQuick 2.1
-import org.kde.kirigami 1.0 as Kirigami
+import org.kde.kirigami 2.0 as Kirigami
 
 Kirigami.ApplicationWindow {
     id: root
diff --git a/autotests/CMakeLists.txt b/autotests/CMakeLists.txt
new file mode 100644
--- /dev/null
+++ b/autotests/CMakeLists.txt
@@ -0,0 +1 @@
+add_test(qmltests COMMAND qmltestrunner WORKING_DIRECTORY ${CMAKE_CURRENT_SOURCE_DIR})
diff --git a/autotests/tst_pagerow.qml b/autotests/tst_pagerow.qml
new file mode 100644
--- /dev/null
+++ b/autotests/tst_pagerow.qml
@@ -0,0 +1,105 @@
+/*
+ *   Copyright 2016 Aleix Pol Gonzalez <aleixpol@kde.org>
+ *
+ *   This program is free software; you can redistribute it and/or modify
+ *   it under the terms of the GNU Library General Public License as
+ *   published by the Free Software Foundation; either version 2, or
+ *   (at your option) any later version.
+ *
+ *   This program is distributed in the hope that it will be useful,
+ *   but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *   GNU Library General Public License for more details
+ *
+ *   You should have received a copy of the GNU Library General Public
+ *   License along with this program; if not, write to the
+ *   Free Software Foundation, Inc.,
+ *   51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+
+import QtQuick 2.7
+import QtQuick.Controls 2.1
+import QtQuick.Window 2.1
+import org.kde.kirigami 2.0 as Kirigami
+import QtTest 1.0
+
+TestCase {
+    id: testCase
+//     when: mainWindow.visible
+    width: 400
+    height: 400
+//     visible: true
+    when: mainWindow.visible
+    name: "GoBack"
+
+    Kirigami.ApplicationWindow {
+        id: mainWindow
+        width: 480
+        height: 360
+        visible: true
+        pageStack.initialPage: Kirigami.Page {
+            Rectangle {
+                anchors.fill: parent
+                color: "green"
+            }
+        }
+    }
+
+    Component {
+        id: randomPage
+        Kirigami.Page {
+            Rectangle {
+                anchors.fill: parent
+                color: "red"
+            }
+        }
+    }
+
+    SignalSpy {
+        id: spyCurrentIndex
+        target: mainWindow.pageStack
+        signalName: "currentIndexChanged"
+    }
+
+    SignalSpy {
+        id: spyActive
+        target: mainWindow
+        signalName: "activeChanged"
+    }
+
+    function initTestCase() {
+        spyActive.clear()
+        spyCurrentIndex.clear()
+    }
+
+    function test_pop() {
+        compare(mainWindow.pageStack.depth, 1)
+        mainWindow.pageStack.push(randomPage)
+        compare(mainWindow.pageStack.depth, 2)
+        mainWindow.pageStack.pop()
+        compare(mainWindow.pageStack.depth, 1)
+    }
+
+    function test_goBack() {
+        compare(spyCurrentIndex.count, 0)
+        compare(mainWindow.pageStack.depth, 1)
+        mainWindow.pageStack.push(randomPage)
+        compare(mainWindow.pageStack.depth, 2)
+        compare(spyCurrentIndex.count, 1)
+        mainWindow.requestActivate()
+        spyActive.clear()
+        spyCurrentIndex.clear()
+        var sa = spyActive.wait(12321313)
+        verify(mainWindow.active || sa)
+        console.log("lalala", mainWindow.active)
+        keyClick(Qt.Key_Left, Qt.AltModifier)
+
+        spyCurrentIndex.wait(5000)
+
+        compare(mainWindow.pageStack.depth, 2)
+        compare(mainWindow.pageStack.currentIndex, 0)
+        compare(spyCurrentIndex.count, 1)
+        mainWindow.pageStack.pop()
+        compare(mainWindow.pageStack.depth, 1)
+    }
+}
diff --git a/examples/CMakeLists.txt b/examples/CMakeLists.txt
--- a/examples/CMakeLists.txt
+++ b/examples/CMakeLists.txt
@@ -1,5 +1,5 @@
 
 add_subdirectory(android)
 
-install(DIRECTORY gallery/ DESTINATION ${KDE_INSTALL_DATAROOTDIR}/kpackage/genericqml/org.kde.kirigami.gallery)
-install(FILES gallery/metadata.desktop DESTINATION ${XDG_APPS_INSTALL_DIR} RENAME org.kde.kirigami.gallery.desktop)
+install(DIRECTORY gallery/ DESTINATION ${KDE_INSTALL_DATAROOTDIR}/kpackage/genericqml/org.kde.kirigami2.gallery)
+install(FILES gallery/metadata.desktop DESTINATION ${XDG_APPS_INSTALL_DIR} RENAME org.kde.kirigami2.gallery.desktop)
diff --git a/examples/android/AndroidManifest.xml b/examples/android/AndroidManifest.xml
--- a/examples/android/AndroidManifest.xml
+++ b/examples/android/AndroidManifest.xml
@@ -50,7 +50,7 @@
             <!-- auto screen scale factor -->
         </activity>
     </application>
-    <uses-sdk android:minSdkVersion="9" android:targetSdkVersion="14"/>
+    <uses-sdk android:minSdkVersion="16" android:targetSdkVersion="16"/>
     <supports-screens android:largeScreens="true" android:normalScreens="true" android:anyDensity="true" android:smallScreens="true"/>
 
     <!-- The following comment will be replaced upon deployment with default permissions based on the dependencies of the application.
diff --git a/examples/android/CMakeLists.txt b/examples/android/CMakeLists.txt
--- a/examples/android/CMakeLists.txt
+++ b/examples/android/CMakeLists.txt
@@ -1,14 +1,14 @@
 
-set(kirigamigallery_SRCS
+set(kirigami2gallery_SRCS
     main.cpp
     )
 
 qt5_add_resources(RESOURCES resources.qrc)
 
-add_executable(kirigamigallery ${kirigamigallery_SRCS} ${RESOURCES})
-target_link_libraries(kirigamigallery Qt5::Core  Qt5::Qml Qt5::Quick Qt5::Svg)
+add_executable(kirigami2gallery ${kirigami2gallery_SRCS} ${RESOURCES})
+target_link_libraries(kirigami2gallery Qt5::Core  Qt5::Qml Qt5::Quick Qt5::Svg Qt5::QuickControls2)
 
-install(TARGETS kirigamigallery ${KF5_INSTALL_TARGETS_DEFAULT_ARGS})
+install(TARGETS kirigami2gallery ${KF5_INSTALL_TARGETS_DEFAULT_ARGS})
 
-include(${CMAKE_SOURCE_DIR}/KF5KirigamiMacros.cmake)
+include(${CMAKE_SOURCE_DIR}/KF5Kirigami2Macros.cmake)
 kirigami_package_breeze_icons(ICONS applications-graphics view-list-icons folder-sync view-list-details configure document-edit dialog-cancel document-decrypt mail-reply-sender bookmarks folder)
diff --git a/examples/android/main.cpp b/examples/android/main.cpp
--- a/examples/android/main.cpp
+++ b/examples/android/main.cpp
@@ -7,9 +7,12 @@
 
 Q_DECL_EXPORT int main(int argc, char *argv[])
 {
+    QGuiApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
     QGuiApplication app(argc, argv);
 
     qputenv("QML_IMPORT_TRACE", "1");
+    //FIXME
+    qputenv("QT_QUICK_CONTROLS_STYLE", "Material");
     QQmlApplicationEngine engine;
     
     engine.load(QUrl(QStringLiteral("qrc:///contents/ui/ExampleApp.qml")));
diff --git a/examples/android/qtquickcontrols2.conf b/examples/android/qtquickcontrols2.conf
new file mode 100644
--- /dev/null
+++ b/examples/android/qtquickcontrols2.conf
@@ -0,0 +1,11 @@
+[Controls]
+Style=Material
+
+[Material]
+Primary=#2196F3
+Accent=#2196F3
+Theme=System
+
+[Universal]
+Accent=#2196F3
+Theme=System
diff --git a/examples/android/resources.qrc b/examples/android/resources.qrc
--- a/examples/android/resources.qrc
+++ b/examples/android/resources.qrc
@@ -11,9 +11,11 @@
         <file alias="contents/ui/gallery/MultipleColumnsGallery.qml">../gallery/contents/ui/gallery/MultipleColumnsGallery.qml</file>
         <file alias="contents/ui/gallery/ListViewGallery.qml">../gallery/contents/ui/gallery/ListViewGallery.qml</file>
         <file alias="contents/ui/gallery/SwitchGallery.qml">../gallery/contents/ui/gallery/SwitchGallery.qml</file>
+        <file alias="contents/ui/gallery/TabBarGallery.qml">../gallery/contents/ui/gallery/TabBarGallery.qml</file>
         <file alias="contents/ui/gallery/TextFieldGallery.qml">../gallery/contents/ui/gallery/TextFieldGallery.qml</file>
         <file alias="contents/ui/gallery/ColorsGallery.qml">../gallery/contents/ui/gallery/ColorsGallery.qml</file>
         <file alias="contents/ui/ExampleApp.qml">../gallery/contents/ui/ExampleApp.qml</file>
         <file alias="metadata.desktop">../gallery/metadata.desktop</file>
+        <file alias="qtquickcontrols2.conf">qtquickcontrols2.conf</file>
     </qresource>
 </RCC>
diff --git a/examples/gallery/contents/ui/DesktopExampleApp.qml b/examples/gallery/contents/ui/DesktopExampleApp.qml
--- a/examples/gallery/contents/ui/DesktopExampleApp.qml
+++ b/examples/gallery/contents/ui/DesktopExampleApp.qml
@@ -20,7 +20,7 @@
 import QtQuick 2.1
 import QtQuick.Controls 1.4 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0 as Kirigami
+import org.kde.kirigami 2.0 as Kirigami
 import "gallery"
 
 Kirigami.ApplicationWindow {
diff --git a/examples/gallery/contents/ui/ExampleApp.qml b/examples/gallery/contents/ui/ExampleApp.qml
--- a/examples/gallery/contents/ui/ExampleApp.qml
+++ b/examples/gallery/contents/ui/ExampleApp.qml
@@ -19,14 +19,15 @@
 
 import QtQuick 2.1
 import QtQuick.Controls 1.4 as Controls
+import QtQuick.Controls 2.0 as QQC2
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0 as Kirigami
+import org.kde.kirigami 2.0 as Kirigami
 import "gallery"
 
 Kirigami.ApplicationWindow {
     id: root
 
-    //header: Kirigami.ToolBarApplicationHeader {}
+    header: Kirigami.ApplicationHeader {}
 
     globalDrawer: Kirigami.GlobalDrawer {
         title: "Widget gallery"
@@ -86,17 +87,17 @@
             }
             ]
 
-        Controls.CheckBox {
+        QQC2.CheckBox {
             checked: true
             text: "Option 1"
         }
-        Controls.CheckBox {
+        QQC2.CheckBox {
             text: "Option 2"
         }
-        Controls.CheckBox {
+        QQC2.CheckBox {
             text: "Option 3"
         }
-        Controls.Slider {
+        QQC2.Slider {
             Layout.fillWidth: true
             value: 0.5
         }
diff --git a/examples/gallery/contents/ui/MainPage.qml b/examples/gallery/contents/ui/MainPage.qml
--- a/examples/gallery/contents/ui/MainPage.qml
+++ b/examples/gallery/contents/ui/MainPage.qml
@@ -18,9 +18,9 @@
  */
 
 import QtQuick 2.1
-import QtQuick.Controls 1.4 as Controls
+import QtQuick.Controls 2.0 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0 as Kirigami
+import org.kde.kirigami 2.0 as Kirigami
 
 Kirigami.ScrollablePage {
     id: pageRoot
@@ -86,14 +86,22 @@
                 component: "Switch"
             }
             ListElement {
+                text: "Tab Bar"
+                component: "TabBar"
+            }
+            ListElement {
                 text: "Text Field"
                 component: "TextField"
             }
             ListElement {
                 text: "Multiple Columns"
                 component: "MultipleColumns"
             }
             ListElement {
+                text: "Misc widgets"
+                component: "Misc"
+            }
+            ListElement {
                 text: "List View"
                 component: "ListView"
             }
@@ -109,6 +117,7 @@
         delegate: Kirigami.BasicListItem {
             id: listItem
 
+            reserveSpaceForIcon: false
             label: model.text
 
             property Item ownPage
diff --git a/examples/gallery/contents/ui/gallery/ButtonGallery.qml b/examples/gallery/contents/ui/gallery/ButtonGallery.qml
--- a/examples/gallery/contents/ui/gallery/ButtonGallery.qml
+++ b/examples/gallery/contents/ui/gallery/ButtonGallery.qml
@@ -18,9 +18,9 @@
  */
 
 import QtQuick 2.0
-import QtQuick.Controls 1.2 as Controls
+import QtQuick.Controls 2.0 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 ScrollablePage {
     id: page
@@ -31,11 +31,11 @@
 
     actions {
         main: Action {
-            iconName: sheet.opened ? "dialog-cancel" : "document-edit"
+            iconName: sheet.sheetOpen ? "dialog-cancel" : "document-edit"
             text: "Main Action Text"
-            checked: sheet.opened
+            checked: sheet.sheetOpen
             checkable: true
-            onCheckedChanged: sheet.opened = checked;
+            onCheckedChanged: sheet.sheetOpen = checked;
         }
         left: Action {
             iconName: "go-previous"
@@ -64,27 +64,26 @@
             },
             Action {
                 text: "Action for Sheet"
-                visible: sheet.opened
+                visible: sheet.sheetOpen
             }
         ]
     }
 
 
     //Close the drawer with the back button
     onBackRequested: {
-        if (bottomDrawer.opened) {
+        if (bottomDrawer.drawerOpen) {
             event.accepted = true;
             bottomDrawer.close();
         }
-        if (sheet.opened) {
+        if (sheet.sheetOpen) {
             event.accepted = true;
             sheet.close();
         }
     }
 
     OverlayDrawer {
         id: bottomDrawer
-        anchors.fill: parent
         edge: Qt.BottomEdge
         contentItem: Item {
             implicitHeight: childrenRect.height + Units.gridUnit
@@ -104,6 +103,7 @@
             }
         }
     }
+    
 
     OverlaySheet {
         id: sheet
@@ -187,34 +187,9 @@
         }
         Controls.ToolButton {
             text: "Tool Button non flat"
-            property bool flat: false
+            flat: false
             anchors.horizontalCenter: parent.horizontalCenter
             onClicked: showPassiveNotification(text + " clicked")
         }
-        Controls.ToolButton {
-            iconName: "go-previous"
-            property bool flat: false
-            anchors.horizontalCenter: parent.horizontalCenter
-            onClicked: showPassiveNotification("Button clicked")
-        }
-        Row {
-            spacing: 0
-            anchors.horizontalCenter: parent.horizontalCenter
-            Controls.ToolButton {
-                iconName: "edit-cut"
-                property bool flat: false
-                onClicked: showPassiveNotification("Cut clicked")
-            }
-            Controls.ToolButton {
-                iconName: "edit-copy"
-                property bool flat: false
-                onClicked: showPassiveNotification("Copy clicked")
-            }
-            Controls.ToolButton {
-                iconName: "edit-paste"
-                property bool flat: false
-                onClicked: showPassiveNotification("Paste clicked")
-            }
-        }
     }
 }
diff --git a/examples/gallery/contents/ui/gallery/CheckBoxGallery.qml b/examples/gallery/contents/ui/gallery/CheckBoxGallery.qml
--- a/examples/gallery/contents/ui/gallery/CheckBoxGallery.qml
+++ b/examples/gallery/contents/ui/gallery/CheckBoxGallery.qml
@@ -18,26 +18,26 @@
  */
 
 import QtQuick 2.0
-import QtQuick.Controls 1.2 as Controls
+import QtQuick.Controls 2.0 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 ScrollablePage {
     id: page
     actions {
         main: Action {
-            iconName: sheet.opened ? "dialog-cancel" : "document-edit"
+            iconName: sheet.sheetOpen ? "dialog-cancel" : "document-edit"
             text: "Main Action Text"
-            checked: sheet.opened
+            checked: sheet.sheetOpen
             checkable: true
-            onCheckedChanged: sheet.opened = checked;
+            onCheckedChanged: sheet.sheetOpen = checked;
         }
         contextualActions: [
-            Controls.Action {
+            Action {
                 text:"Action 1"
                 onTriggered: showPassiveNotification("Action 1 clicked")
             },
-            Controls.Action {
+            Action {
                 text:"Action 2"
                 onTriggered: showPassiveNotification("Action 2 clicked")
             }
@@ -64,6 +64,7 @@
             Layout.fillWidth: true
             Layout.minimumHeight: Units.gridUnit * 10
             GridLayout {
+                id: grid
                 anchors.centerIn: parent
                 columns: 3
                 rows: 3
@@ -105,6 +106,15 @@
                     enabled: false
                 }
             }
+            Controls.CheckBox {
+                anchors {
+                    top: grid.bottom
+                    left: grid.left
+                }
+                text: "Tristate"
+                checked: true
+                tristate: true
+            }
         }
     }
 }
diff --git a/examples/gallery/contents/ui/gallery/ColorsGallery.qml b/examples/gallery/contents/ui/gallery/ColorsGallery.qml
--- a/examples/gallery/contents/ui/gallery/ColorsGallery.qml
+++ b/examples/gallery/contents/ui/gallery/ColorsGallery.qml
@@ -20,7 +20,7 @@
 import QtQuick 2.0
 import QtQuick.Controls 1.2 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 ScrollablePage {
     title: "Colors"
diff --git a/examples/gallery/contents/ui/gallery/ListViewGallery.qml b/examples/gallery/contents/ui/gallery/ListViewGallery.qml
--- a/examples/gallery/contents/ui/gallery/ListViewGallery.qml
+++ b/examples/gallery/contents/ui/gallery/ListViewGallery.qml
@@ -20,20 +20,20 @@
 import QtQuick 2.0
 import QtQuick.Controls 1.2 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0 as Kirigami
+import org.kde.kirigami 2.0 as Kirigami
 
 Kirigami.ScrollablePage {
     id: page
     Layout.fillWidth: true
     title: "Long List view"
 
     actions {
         main: Kirigami.Action {
-            iconName: sheet.opened ? "dialog-cancel" : "document-edit"
+            iconName: sheet.sheetOpen ? "dialog-cancel" : "document-edit"
             text: "Main Action Text"
-            checked: sheet.opened
+            checked: sheet.sheetOpen
             checkable: true
-            onCheckedChanged: sheet.opened = checked;
+            onCheckedChanged: sheet.sheetOpen = checked;
         }
     }
 
@@ -47,13 +47,14 @@
     }
 
     background: Rectangle {
-        color: Theme.viewBackgroundColor
+        color: Kirigami.Theme.viewBackgroundColor
     }
     Kirigami.OverlaySheet {
         id: sheet
+        parent: applicationWindow().overlay
         ListView {
             model: 100
-            implicitWidth: Units.gridUnit * 30
+            implicitWidth: Kirigami.Units.gridUnit * 30
             delegate: Kirigami.BasicListItem {
                 label: "Item in sheet" + modelData
             }
@@ -69,10 +70,9 @@
         model: 200
         delegate: Kirigami.SwipeListItem {
             id: listItem
-            Kirigami.Label {
+            contentItem: Kirigami.Label {
                 height: Math.max(implicitHeight, Kirigami.Units.iconSizes.smallMedium)
                 anchors.verticalCenter: parent.verticalCenter
-                x: y
                 text: "Item " + modelData
                 color: listItem.checked || (listItem.pressed && !listItem.checked && !listItem.sectionDelegate) ? listItem.activeTextColor : listItem.textColor
             }
diff --git a/examples/gallery/contents/ui/gallery/MiscGallery.qml b/examples/gallery/contents/ui/gallery/MiscGallery.qml
new file mode 100644
--- /dev/null
+++ b/examples/gallery/contents/ui/gallery/MiscGallery.qml
@@ -0,0 +1,144 @@
+/*
+ *   Copyright 2016 Aleix Pol Gonzalez <aleixpol@kde.org>
+ *
+ *   This program is free software; you can redistribute it and/or modify
+ *   it under the terms of the GNU Library General Public License as
+ *   published by the Free Software Foundation; either version 2 or
+ *   (at your option) any later version.
+ *
+ *   This program is distributed in the hope that it will be useful,
+ *   but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *   GNU Library General Public License for more details
+ *
+ *   You should have received a copy of the GNU Library General Public
+ *   License along with this program; if not, write to the
+ *   Free Software Foundation, Inc.,
+ *   51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+
+import QtQuick 2.0
+import QtQuick.Controls 2.0 as Controls
+import QtQuick.Layouts 1.2
+import org.kde.kirigami 2.0
+
+ScrollablePage {
+    id: page
+    title: "Misc controls"
+
+    header: Controls.ToolBar {
+        RowLayout {
+            anchors.verticalCenter: parent.verticalCenter
+            Controls.ToolButton {
+                text: "ToolButton"
+            }
+            Controls.ToolButton {
+                text: "Menu"
+                onClicked: menu.open();
+                Controls.Menu {
+                    id: menu
+                    x: parent.width - width
+                    transformOrigin: Controls.Menu.TopRight
+
+                    Controls.MenuItem {
+                        checkable: true
+                        text: "Item1"
+                    }
+                    Controls.MenuItem {
+                        text: "Item2"
+                    }
+                }
+            }
+        }
+    }
+
+    Controls.Popup {
+        id: dialog
+        modal: true
+        focus: true
+        x: (page.width - width) / 2
+        y: page.height / 2 - height
+        width: Units.gridUnit * 20
+        contentHeight: popupColumn.height
+
+        Column {
+            id: popupColumn
+            spacing: 20
+
+            Controls.Label {
+                width: dialog.availableWidth
+                text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam id risus id augue euismod accumsan. Nunc vestibulum placerat bibendum. Morbi commodo auctor varius. Donec molestie euismod ultrices. Sed facilisis augue nec eros auctor."
+                wrapMode: Label.Wrap
+            }
+            Controls.Button {
+                anchors.right: parent.right
+                text: "Ok"
+                onClicked: dialog.close()
+            }
+        }
+    }
+
+    ColumnLayout {
+        anchors.centerIn: parent
+        Controls.Button {
+            Layout.alignment: Qt.AlignHCenter
+            text: "Dialog"
+            onClicked: dialog.open()
+        }
+        Controls.Dial {
+            Layout.alignment: Qt.AlignHCenter
+        }
+        Controls.SpinBox {
+            editable: true
+            Layout.alignment: Qt.AlignHCenter
+        }
+        Controls.ComboBox {
+            model: ["First", "Second", "Third"]
+            Layout.alignment: Qt.AlignHCenter
+        }
+        Controls.GroupBox {
+            title: "Title"
+            Layout.alignment: Qt.AlignHCenter
+
+            ColumnLayout {
+                id: options
+
+                Controls.RadioButton {
+                    text: "First"
+                    checked: true
+                }
+                Controls.RadioButton {
+                    text: "Second"
+                    checked: false
+                }
+                Controls.RadioButton {
+                    text: "Third"
+                    checked: false
+                }
+            }
+        }
+        Column {
+            Layout.alignment: Qt.AlignHCenter
+            Controls.ItemDelegate {
+                width: 300
+                text: "Delegate1"
+            }
+            Controls.ItemDelegate {
+                width: 300
+                text: "Delegate2"
+            }
+            Controls.CheckDelegate {
+                width: 300
+                text: "Delegate3"
+            }
+            Controls.SwitchDelegate {
+                width: 300
+                text: "Delegate4"
+            }
+            Controls.RadioDelegate {
+                width: 300
+                text: "Delegate5"
+            }
+        }
+    }
+}
diff --git a/examples/gallery/contents/ui/gallery/MultipleColumnsGallery.qml b/examples/gallery/contents/ui/gallery/MultipleColumnsGallery.qml
--- a/examples/gallery/contents/ui/gallery/MultipleColumnsGallery.qml
+++ b/examples/gallery/contents/ui/gallery/MultipleColumnsGallery.qml
@@ -18,9 +18,9 @@
  */
 
 import QtQuick 2.0
-import QtQuick.Controls 1.2 as Controls
+import QtQuick.Controls 2.0 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 ScrollablePage {
     id: page
diff --git a/examples/gallery/contents/ui/gallery/NonScrollableGallery.qml b/examples/gallery/contents/ui/gallery/NonScrollableGallery.qml
--- a/examples/gallery/contents/ui/gallery/NonScrollableGallery.qml
+++ b/examples/gallery/contents/ui/gallery/NonScrollableGallery.qml
@@ -20,20 +20,20 @@
 import QtQuick 2.0
 import QtQuick.Controls 1.2 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 Page {
     id: page
     Layout.fillWidth: true
     title: "Simple Page"
 
     actions {
         main: Action {
-            iconName: sheet.opened ? "dialog-cancel" : "document-edit"
+            iconName: sheet.sheetOpen ? "dialog-cancel" : "document-edit"
             text: "Main Action Text"
-            checked: sheet.opened
+            checked: sheet.sheetOpen
             checkable: true
-            onCheckedChanged: sheet.opened = checked;
+            onCheckedChanged: sheet.sheetOpen = checked;
         }
     }
 
diff --git a/examples/gallery/contents/ui/gallery/ProgressBarGallery.qml b/examples/gallery/contents/ui/gallery/ProgressBarGallery.qml
--- a/examples/gallery/contents/ui/gallery/ProgressBarGallery.qml
+++ b/examples/gallery/contents/ui/gallery/ProgressBarGallery.qml
@@ -18,9 +18,9 @@
  */
 
 import QtQuick 2.0
-import QtQuick.Controls 1.2 as Controls
+import QtQuick.Controls 2.0 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 ScrollablePage {
     id: page
@@ -69,18 +69,18 @@
                 Layout.alignment: Qt.AlignRight
             }
             Controls.ProgressBar {
-                minimumValue: 0
-                maximumValue: 100
+                from: 0
+                to: 100
                 value: timer.value
                 Layout.maximumWidth: Units.gridUnit * 10
             }
             Label {
                 text: "Indeterminate:"
                 Layout.alignment: Qt.AlignRight
             }
             Controls.ProgressBar {
-                minimumValue: 0
-                maximumValue: 100
+                from: 0
+                to: 100
                 indeterminate: true
                 Layout.maximumWidth: Units.gridUnit * 10
             }
@@ -106,26 +106,6 @@
                 Layout.minimumWidth: Units.iconSizes.enormous
                 Layout.minimumHeight: width
             }
-            Label {
-                text: "Vertical:"
-                Layout.alignment: Qt.AlignRight
-            }
-            RowLayout {
-                Controls.ProgressBar {
-                    Layout.minimumWidth: Units.gridUnit * 2
-                    Layout.maximumHeight: Units.gridUnit * 8
-                    minimumValue: 0
-                    maximumValue: 100
-                    value: timer.value
-                    orientation: Qt.Vertical
-                }
-                Controls.ProgressBar {
-                    Layout.minimumWidth: Units.gridUnit * 2
-                    Layout.maximumHeight: Units.gridUnit * 8
-                    indeterminate: true
-                    orientation: Qt.Vertical
-                }
-            }
         }
     }
 }
diff --git a/examples/gallery/contents/ui/gallery/RadioButtonGallery.qml b/examples/gallery/contents/ui/gallery/RadioButtonGallery.qml
--- a/examples/gallery/contents/ui/gallery/RadioButtonGallery.qml
+++ b/examples/gallery/contents/ui/gallery/RadioButtonGallery.qml
@@ -18,9 +18,9 @@
  */
 
 import QtQuick 2.0
-import QtQuick.Controls 1.2 as Controls
+import QtQuick.Controls 2.0 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 ScrollablePage {
     id: page
@@ -44,63 +44,63 @@
         }
     }
 
+    Controls.ButtonGroup {
+        buttons: column1.children
+    }
 
     ColumnLayout {
         width: page.width
-        Controls.ExclusiveGroup {
-            id: radioGroup
-        }
-        Controls.ExclusiveGroup {
-            id: radioGroup2
-        }
 
         Item {
             Layout.fillWidth: true
             Layout.minimumHeight: Units.gridUnit * 10
-            GridLayout {
+            RowLayout {
                 anchors.centerIn: parent
-                columns: 3
-                rows: 3
-                rowSpacing: Units.smallSpacing
-
-                Item {
-                    width: 1
-                    height: 1
-                }
-                Label {
-                    text: "Normal"
-                }
-                Label {
-                    text: "Disabled"
-                    enabled: false
-                }
-                Label {
-                    text: "On"
-                }
-                Controls.RadioButton {
-                    text: "On"
-                    checked: true
-                    exclusiveGroup: radioGroup
-                }
-                Controls.RadioButton {
-                    text: "On"
-                    checked: true
-                    enabled: false
-                    exclusiveGroup: radioGroup2
-                }
-                Label {
-                    text: "Off"
+                ColumnLayout {
+                    Layout.fillHeight: true
+                    Item {
+                        width: 1
+                        height: 1
+                        Layout.fillHeight: true
+                    }
+                    Label {
+                        text: "On"
+                        Layout.preferredHeight: radio1.height
+                    }
+                    Label {
+                        text: "Off"
+                        Layout.preferredHeight: radio1.height
+                    }
                 }
-                Controls.RadioButton {
-                    text: "Off"
-                    checked: false
-                    exclusiveGroup: radioGroup
+                ColumnLayout {
+                    id: column1
+                    Label {
+                        text: "Normal"
+                    }
+                    Controls.RadioButton {
+                        id: radio1
+                        text: "On"
+                        checked: true
+                    }
+                    Controls.RadioButton {
+                        text: "Off"
+                        checked: false
+                    }
                 }
-                Controls.RadioButton {
-                    text: "Off"
-                    checked: false
+                ColumnLayout {
+                    id: column2
                     enabled: false
-                    exclusiveGroup: radioGroup2
+                    Label {
+                        text: "Disabled"
+                    }
+                    Controls.RadioButton {
+                        text: "On"
+                        checked: true
+                    }
+                    Controls.RadioButton {
+                        text: "Off"
+                        checked: false
+                    }
                 }
             }
         }
diff --git a/examples/gallery/contents/ui/gallery/SliderGallery.qml b/examples/gallery/contents/ui/gallery/SliderGallery.qml
--- a/examples/gallery/contents/ui/gallery/SliderGallery.qml
+++ b/examples/gallery/contents/ui/gallery/SliderGallery.qml
@@ -18,9 +18,9 @@
  */
 
 import QtQuick 2.0
-import QtQuick.Controls 1.2 as Controls
+import QtQuick.Controls 2.0 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 ScrollablePage {
     id: page
@@ -59,28 +59,39 @@
                     text: "Normal:"
                 }
                 Controls.Slider {
+                    id: slider
                     Layout.minimumWidth: Units.gridUnit * 15
                     value: 2
-                    maximumValue: 5.0
+                    to: 5.0
+                    Controls.ToolTip {
+                        parent: slider.handle
+                        visible: slider.pressed
+                        text: slider.position.toFixed(1)
+                    }
                 }
                 Label {
                     text: "Disabled:"
                 }
                 Controls.Slider {
                     enabled: false
                     Layout.minimumWidth: Units.gridUnit * 15
                     value: 2
-                    maximumValue: 5.0
+                    to: 5.0
                 }
                 Label {
                     text: "Thickmarks:"
                 }
                 Controls.Slider {
+                    id: slider2
                     Layout.minimumWidth: Units.gridUnit * 15
-                    tickmarksEnabled: true
-                    maximumValue: 5.0
+                    to: 5.0
                     stepSize: 1.0
                     value: 3
+                    Controls.ToolTip {
+                        parent: slider2.handle
+                        visible: slider2.pressed
+                        text: slider2.position.toFixed(1)
+                    }
                 }
                 Label {
                     text: "Vertical:"
@@ -91,15 +102,14 @@
                         Layout.minimumWidth: 2
                         Layout.minimumHeight: Units.gridUnit * 10
                         value: 2
-                        maximumValue: 5.0
+                        to: 5.0
                         orientation: Qt.Vertical
                     }
                     Controls.Slider {
                         Layout.minimumWidth: 2
                         Layout.minimumHeight: Units.gridUnit * 10
                         value: 3
-                        tickmarksEnabled: true
-                        maximumValue: 5.0
+                        to: 5.0
                         stepSize: 1.0
                         orientation: Qt.Vertical
                     }
diff --git a/examples/gallery/contents/ui/gallery/SwitchGallery.qml b/examples/gallery/contents/ui/gallery/SwitchGallery.qml
--- a/examples/gallery/contents/ui/gallery/SwitchGallery.qml
+++ b/examples/gallery/contents/ui/gallery/SwitchGallery.qml
@@ -18,9 +18,9 @@
  */
 
 import QtQuick 2.0
-import QtQuick.Controls 1.2 as Controls
+import QtQuick.Controls 2.0 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 ScrollablePage {
     id: page
@@ -55,20 +55,24 @@
                 }
                 Controls.Switch {
                     checked: true
+                    text: "On"
                 }
                 Controls.Switch {
                     checked: true
                     enabled: false
+                    text: "On"
                 }
                 Label {
                     text: "Off"
                 }
                 Controls.Switch {
                     checked: false
+                    text: "Off"
                 }
                 Controls.Switch {
                     checked: false
                     enabled: false
+                    text: "Off"
                 }
             }
         }
diff --git a/examples/gallery/contents/ui/gallery/TabBarGallery.qml b/examples/gallery/contents/ui/gallery/TabBarGallery.qml
new file mode 100644
--- /dev/null
+++ b/examples/gallery/contents/ui/gallery/TabBarGallery.qml
@@ -0,0 +1,83 @@
+/*
+ *   Copyright 2016 Marco Martin <mart@kde.org>
+ *
+ *   This program is free software; you can redistribute it and/or modify
+ *   it under the terms of the GNU Library General Public License as
+ *   published by the Free Software Foundation; either version 2 or
+ *   (at your option) any later version.
+ *
+ *   This program is distributed in the hope that it will be useful,
+ *   but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *   GNU Library General Public License for more details
+ *
+ *   You should have received a copy of the GNU Library General Public
+ *   License along with this program; if not, write to the
+ *   Free Software Foundation, Inc.,
+ *   51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+
+import QtQuick 2.1
+import QtQuick.Controls 2.0 as Controls
+import QtQuick.Layouts 1.2
+import org.kde.kirigami 2.0
+
+Page {
+    id: page
+
+    title: "Tab Bar"
+
+    header: Controls.TabBar {
+        id: tabBar
+        currentIndex: swipeView.currentIndex
+
+        Controls.TabButton {
+            text: "First"
+        }
+        Controls.TabButton {
+            text: "Second"
+        }
+        Controls.TabButton {
+            text: "Third"
+        }
+    }
+ 
+    Controls.SwipeView {
+        id: swipeView
+        anchors.fill: parent
+        currentIndex: tabBar.currentIndex
+        clip: true
+
+        Repeater {
+            model: 3
+
+            Item {
+                Label {
+                    width: parent.width
+                    wrapMode: Label.Wrap
+                    horizontalAlignment: Qt.AlignHCenter
+                    text: "Page " + modelData
+                }
+                Controls.TabBar {
+                    position: Controls.TabBar.Footer
+                    anchors {
+                        bottom: parent.bottom
+                        horizontalCenter: parent.horizontalCenter
+                    }
+                    Controls.TabButton {
+                        text: "First"
+                    }
+                    Controls.TabButton {
+                        text: "Second"
+                    }
+                    Controls.TabButton {
+                        text: "Third"
+                    }
+                    Controls.TabButton {
+                        text: "Fourth"
+                    }
+                }
+            }
+        }
+    }
+}
diff --git a/examples/gallery/contents/ui/gallery/TextFieldGallery.qml b/examples/gallery/contents/ui/gallery/TextFieldGallery.qml
--- a/examples/gallery/contents/ui/gallery/TextFieldGallery.qml
+++ b/examples/gallery/contents/ui/gallery/TextFieldGallery.qml
@@ -18,9 +18,9 @@
  */
 
 import QtQuick 2.0
-import QtQuick.Controls 1.2 as Controls
+import QtQuick.Controls 2.0 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 ScrollablePage {
     id: page
@@ -63,6 +63,7 @@
             text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eu nisl ac nibh malesuada pretium ut sit amet libero. Nulla libero arcu, pharetra a dignissim nec, iaculis sit amet metus. Suspendisse quis justo efficitur, pharetra dui maximus, aliquam dolor. Vestibulum vel imperdiet turpis. Mauris ut leo mauris. Praesent ut libero sollicitudin, tincidunt nisi a, efficitur erat. Curabitur lacinia leo et tempor aliquam."
             Layout.minimumWidth: Units.gridUnit * 12
             Layout.minimumHeight: Units.gridUnit * 12
+            wrapMode: TextArea.WordWrap
         }
     }
 }
diff --git a/examples/gallery/metadata.desktop b/examples/gallery/metadata.desktop
--- a/examples/gallery/metadata.desktop
+++ b/examples/gallery/metadata.desktop
@@ -25,7 +25,7 @@
 X-KDE-ParentApp=
 X-KDE-PluginInfo-Author=Marco Martin
 X-KDE-PluginInfo-Email=mart@kde.org
-X-KDE-PluginInfo-Name=org.kde.kirigami.gallery
+X-KDE-PluginInfo-Name=org.kde.kirigami2.gallery
 X-KDE-PluginInfo-Version=1.0
 X-KDE-PluginInfo-Website=http://kde.org
 X-KDE-PluginInfo-Category=Graphics
diff --git a/examples/simpleexamples/AbstractApplicationWindow.qml b/examples/simpleexamples/AbstractApplicationWindow.qml
--- a/examples/simpleexamples/AbstractApplicationWindow.qml
+++ b/examples/simpleexamples/AbstractApplicationWindow.qml
@@ -20,7 +20,7 @@
 import QtQuick 2.1
 import QtQuick.Controls 1.4 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0 as Kirigami
+import org.kde.kirigami 2.0 as Kirigami
 
 Kirigami.AbstractApplicationWindow {
     id: root
@@ -119,9 +119,9 @@
             if (event.key == Qt.Key_Back ||
             (event.key === Qt.Key_Left && (event.modifiers & Qt.AltModifier))) {
                 event.accepted = true;
-                if (root.contextDrawer && root.contextDrawer.opened) {
+                if (root.contextDrawer && root.contextDrawer.drawerOpen) {
                     root.contextDrawer.close();
-                } else if (root.globalDrawer && root.globalDrawer.opened) {
+                } else if (root.globalDrawer && root.globalDrawer.drawerOpen) {
                     root.globalDrawer.close();
                 } else {
                     var backEvent = {accepted: false}
diff --git a/examples/simpleexamples/FixedSidebar.qml b/examples/simpleexamples/FixedSidebar.qml
--- a/examples/simpleexamples/FixedSidebar.qml
+++ b/examples/simpleexamples/FixedSidebar.qml
@@ -20,7 +20,7 @@
 import QtQuick 2.1
 import QtQuick.Controls 1.4 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0 as Kirigami
+import org.kde.kirigami 2.0 as Kirigami
 
 Kirigami.ApplicationWindow {
     id: root
@@ -30,7 +30,7 @@
 
     pageStack.initialPage: mainPageComponent
     globalDrawer: Kirigami.OverlayDrawer {
-        opened: true
+        drawerOpen: true
         modal: false
         contentItem: Item {
             implicitWidth: Kirigami.Units.gridUnit * 10
diff --git a/examples/simpleexamples/MultipleColumnsGallery.qml b/examples/simpleexamples/MultipleColumnsGallery.qml
--- a/examples/simpleexamples/MultipleColumnsGallery.qml
+++ b/examples/simpleexamples/MultipleColumnsGallery.qml
@@ -20,7 +20,7 @@
 import QtQuick 2.0
 import QtQuick.Controls 1.2 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 ScrollablePage {
     id: page
diff --git a/examples/simpleexamples/SplitDrawer.qml b/examples/simpleexamples/SplitDrawer.qml
--- a/examples/simpleexamples/SplitDrawer.qml
+++ b/examples/simpleexamples/SplitDrawer.qml
@@ -20,7 +20,7 @@
 import QtQuick 2.1
 import QtQuick.Controls 1.4 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0 as Kirigami
+import org.kde.kirigami 2.0 as Kirigami
 
 Kirigami.ApplicationWindow {
     id: root
@@ -31,7 +31,7 @@
     pageStack.initialPage: mainPageComponent
     globalDrawer: Kirigami.SplitDrawer {
         id: drawer
-        opened: true
+        drawerOpen: true
         //modal: false
         contentItem: Column {
             //implicitWidth: Kirigami.Units.gridUnit * 10
diff --git a/examples/simpleexamples/TabBarHeader.qml b/examples/simpleexamples/TabBarHeader.qml
--- a/examples/simpleexamples/TabBarHeader.qml
+++ b/examples/simpleexamples/TabBarHeader.qml
@@ -20,7 +20,7 @@
 import QtQuick 2.1
 import QtQuick.Controls 1.4 as Controls
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0 as Kirigami
+import org.kde.kirigami 2.0 as Kirigami
 
 Kirigami.ApplicationWindow {
     id: root
diff --git a/examples/simpleexamples/customdrawer.qml b/examples/simpleexamples/customdrawer.qml
--- a/examples/simpleexamples/customdrawer.qml
+++ b/examples/simpleexamples/customdrawer.qml
@@ -18,7 +18,7 @@
  */
 
 import QtQuick 2.1
-import org.kde.kirigami 1.0 as Kirigami
+import org.kde.kirigami 2.0 as Kirigami
 
 Kirigami.ApplicationWindow {
     id: root
diff --git a/examples/simpleexamples/minimal.qml b/examples/simpleexamples/minimal.qml
--- a/examples/simpleexamples/minimal.qml
+++ b/examples/simpleexamples/minimal.qml
@@ -18,7 +18,7 @@
  */
 
 import QtQuick 2.1
-import org.kde.kirigami 1.0 as Kirigami
+import org.kde.kirigami 2.0 as Kirigami
 
 Kirigami.ApplicationWindow {
     id: root
diff --git a/scripts/gen_qmltypes.sh b/scripts/gen_qmltypes.sh
--- a/scripts/gen_qmltypes.sh
+++ b/scripts/gen_qmltypes.sh
@@ -14,4 +14,4 @@
 
 echo "using '${QMLPLUGINDUMP}' as dump tool" >&2
 
-${QMLPLUGINDUMP} -noinstantiate -platform xcb org.kde.kirigami 1.0 "${1}"
+${QMLPLUGINDUMP} -noinstantiate -platform xcb org.kde.kirigami 2.0 "${1}"
diff --git a/src/CMakeLists.txt b/src/CMakeLists.txt
--- a/src/CMakeLists.txt
+++ b/src/CMakeLists.txt
@@ -23,21 +23,22 @@
 add_library(kirigamiplugin SHARED ${kirigami_SRCS})
 target_link_libraries(kirigamiplugin Qt5::Core  Qt5::Qml Qt5::Quick)
 
-install(TARGETS kirigamiplugin DESTINATION ${KDE_INSTALL_QMLDIR}/org/kde/kirigami)
+install(TARGETS kirigamiplugin DESTINATION ${KDE_INSTALL_QMLDIR}/org/kde/kirigami.2)
 
-install(DIRECTORY controls/ DESTINATION ${KDE_INSTALL_QMLDIR}/org/kde/kirigami)
+install(DIRECTORY controls/ DESTINATION ${KDE_INSTALL_QMLDIR}/org/kde/kirigami.2)
 
 if (PLASMA_ENABLED)
-    install(DIRECTORY styles/Plasma DESTINATION ${KDE_INSTALL_QMLDIR}/org/kde/kirigami/styles)
+    install(DIRECTORY styles/Plasma DESTINATION ${KDE_INSTALL_QMLDIR}/org/kde/kirigami.2/styles)
 endif()
 if (DESKTOP_ENABLED)
-    install(DIRECTORY styles/Desktop DESTINATION ${KDE_INSTALL_QMLDIR}/org/kde/kirigami/styles)
+    install(DIRECTORY styles/Desktop DESTINATION ${KDE_INSTALL_QMLDIR}/org/kde/kirigami.2/styles)
 endif()
+install(DIRECTORY styles/Material DESTINATION ${KDE_INSTALL_QMLDIR}/org/kde/kirigami.2/styles)
 
-install(FILES ${platformspecific} DESTINATION ${KDE_INSTALL_QMLDIR}/org/kde/kirigami)
+install(FILES ${platformspecific} DESTINATION ${KDE_INSTALL_QMLDIR}/org/kde/kirigami.2)
 
 include(ECMGeneratePriFile)
-ecm_generate_pri_file(BASE_NAME Kirigami LIB_NAME KF5Kirigami DEPS "core qml quick svg" FILENAME_VAR PRI_FILENAME )
+ecm_generate_pri_file(BASE_NAME Kirigami2 LIB_NAME KF5Kirigami2 DEPS "core qml quick svg" FILENAME_VAR PRI_FILENAME )
 install(FILES ${PRI_FILENAME}
         DESTINATION ${ECM_MKSPECS_INSTALL_DIR})
 
diff --git a/src/controls/AbstractApplicationHeader.qml b/src/controls/AbstractApplicationHeader.qml
--- a/src/controls/AbstractApplicationHeader.qml
+++ b/src/controls/AbstractApplicationHeader.qml
@@ -18,7 +18,7 @@
  */
 
 import QtQuick 2.5
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 import "private"
 import "templates" as T
diff --git a/src/controls/AbstractApplicationWindow.qml b/src/controls/AbstractApplicationWindow.qml
--- a/src/controls/AbstractApplicationWindow.qml
+++ b/src/controls/AbstractApplicationWindow.qml
@@ -18,9 +18,9 @@
  */
 
 import QtQuick 2.5
-import QtQuick.Controls 1.3 as Controls
+import QtQuick.Controls 2.0 as QQC2
 import "templates/private"
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 import QtGraphicalEffects 1.0
 
 /**
@@ -38,7 +38,7 @@
  *
  * Example usage:
  * @code
- * import org.kde.kirigami 1.0 as Kirigami
+ * import org.kde.kirigami 2.0 as Kirigami
  *
  * Kirigami.ApplicationWindow {
  *  [...]
@@ -77,7 +77,7 @@
  *
  * @inherit QtQuick.Controls.ApplicationWindow
  */
-Controls.ApplicationWindow {
+QQC2.ApplicationWindow {
     id: root
 
     /**
@@ -103,7 +103,7 @@
     function showPassiveNotification(message, timeout, actionText, callBack) {
         if (!internal.__passiveNotification) {
             var component = Qt.createComponent("templates/private/PassiveNotification.qml");
-            internal.__passiveNotification = component.createObject(contentItem.parent);
+            internal.__passiveNotification = component.createObject(overlay.parent);
         }
 
         internal.__passiveNotification.showNotification(message, timeout, actionText, callBack);
@@ -140,7 +140,7 @@
     * To achieve a titlebar that stays completely fixed just set the 3 sizes as the same
     * //FIXME: this should become an actual ApplicationHeader
     */
-    property var header: undefined
+    header: undefined
 
     /**
      * controlsVisible: bool
@@ -151,12 +151,12 @@
     property bool controlsVisible: true
 
     /**
-     * globalDrawer: AbstractDrawer
+     * globalDrawer: OverlayDrawer
      * The drawer for global actions, that will be opened by sliding from the
      * left screen edge or by dragging the ActionButton to the right.
      * It is recommended to use the GlobalDrawer class here
      */
-    property AbstractDrawer globalDrawer
+    property OverlayDrawer globalDrawer
 
     /**
      * wideScreen: bool
@@ -166,16 +166,16 @@
     property bool wideScreen: width >= Units.gridUnit * 60
 
     /**
-     * contextDrawer: AbstractDrawer
+     * contextDrawer: OverlayDrawer
      * The drawer for context-dependednt actions, that will be opened by sliding from the
      * right screen edge or by dragging the ActionButton to the left.
      * It is recommended to use the ContextDrawer class here.
      * The contents of the context drawer should depend from what page is
      * loaded in the main pageStack
      *
      * Example usage:
      * @code
-     * import org.kde.kirigami 1.0 as Kirigami
+     * import org.kde.kirigami 2.0 as Kirigami
      *
      * Kirigami.ApplicationWindow {
      *  [...]
@@ -187,7 +187,7 @@
      * @endcode
      *
      * @code
-     * import org.kde.kirigami 1.0 as Kirigami
+     * import org.kde.kirigami 2.0 as Kirigami
      *
      * Kirigami.Page {
      *   [...]
@@ -214,7 +214,7 @@
      * When this page will be the current one, the context drawer will visualize
      * contextualActions defined as property in that page.
      */
-    property AbstractDrawer contextDrawer
+    property OverlayDrawer contextDrawer
 
     /**
      * reachableMode: bool
@@ -245,6 +245,8 @@
         }
     }
 
+    contentItem.anchors.left: contentItem.parent.left
+    contentItem.anchors.right: contentItem.parent.right
     contentItem.anchors.topMargin: root.wideScreen && header && controlsVisible ? header.height : 0
     contentItem.anchors.leftMargin: root.globalDrawer && (root.globalDrawer.modal === false) ? root.globalDrawer.contentItem.width * root.globalDrawer.position : 0
     contentItem.anchors.rightMargin: root.contextDrawer && root.contextDrawer.modal === false ? root.contextDrawer.contentItem.width * root.contextDrawer.position : 0
@@ -266,16 +268,16 @@
     }
 
     Binding {
-        when: globalDrawer !== undefined
+        when: globalDrawer !== undefined && root.visible
         target: globalDrawer
         property: "parent"
-        value: contentItem.parent
+        value: overlay
     }
     Binding {
-        when: contextDrawer !== undefined
+        when: contextDrawer !== undefined && root.visible
         target: contextDrawer
         property: "parent"
-        value: contentItem.parent
+        value: overlay
     }
     onPageStackChanged: pageStack.parent = contentItem;
 
diff --git a/src/controls/ApplicationWindow.qml b/src/controls/ApplicationWindow.qml
--- a/src/controls/ApplicationWindow.qml
+++ b/src/controls/ApplicationWindow.qml
@@ -20,7 +20,7 @@
 import QtQuick 2.5
 import QtQuick.Controls.Private 1.0
 import "templates/private"
-import org.kde.kirigami 1.0 as Kirigami
+import org.kde.kirigami 2.0 as Kirigami
 import QtGraphicalEffects 1.0
 
 /**
@@ -35,7 +35,7 @@
  *
  * Example usage:
  * @code
- * import org.kde.kirigami 1.0 as Kirigami
+ * import org.kde.kirigami 2.0 as Kirigami
  *
  * Kirigami.ApplicationWindow {
  *  [...]
@@ -129,9 +129,9 @@
         onCurrentIndexChanged: root.reachableMode = false;
 
         function goBack() {
-            if (root.contextDrawer && root.contextDrawer.opened && root.contextDrawer.modal) {
+            if (root.contextDrawer && root.contextDrawer.drawerOpen && root.contextDrawer.modal) {
                 root.contextDrawer.close();
-            } else if (root.globalDrawer && root.globalDrawer.opened && root.globalDrawer.modal) {
+            } else if (root.globalDrawer && root.globalDrawer.drawerOpen && root.globalDrawer.modal) {
                 root.globalDrawer.close();
             } else {
                 var backEvent = {accepted: false}
@@ -150,7 +150,7 @@
                 }
             }
         }
-        Keys.onReleased: {
+        Keys.onReleased: {print("AAA"+event.key)
             if (event.key == Qt.Key_Back ||
             (event.key === Qt.Key_Left && (event.modifiers & Qt.AltModifier))) {
                 event.accepted = true;
@@ -165,11 +165,4 @@
         }
         focus: true
     }
-
-    Component.onCompleted: {
-        if (root.header === undefined) {
-            var component = Qt.createComponent(Qt.resolvedUrl("./ApplicationHeader.qml"));
-            root.header = component.createObject(root.contentItem.parent);
-        }
-    }
 }
diff --git a/src/controls/BasicListItem.qml b/src/controls/BasicListItem.qml
--- a/src/controls/BasicListItem.qml
+++ b/src/controls/BasicListItem.qml
@@ -19,7 +19,7 @@
 
 import QtQuick 2.1
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 /**
  * An item delegate for the primitive ListView component.
@@ -46,11 +46,18 @@
      */
     property alias icon: iconItem.source
 
+    /**
+     * reserveSpaceForIcon: bool
+     * If true, even when there is no icon the space will be reserved for it
+     * It's useful in layouts where only some entries have an icon,
+     * having the text all horizontally aligned
+     */
+    property alias reserveSpaceForIcon: iconItem.visible
+
+    default property alias _basicDefault: layout.children
+
     RowLayout {
-        anchors {
-            left: parent.left
-            verticalCenter: parent.verticalCenter
-        }
+        id: layout
         Icon {
             id: iconItem
             Layout.minimumHeight: Units.iconSizes.smallMedium
@@ -60,6 +67,7 @@
         }
         Label {
             id: labelItem
+            Layout.fillWidth: true
             color: listItem.checked || listItem.pressed ? listItem.activeTextColor : listItem.textColor
         }
     }
diff --git a/src/controls/ContextDrawer.qml b/src/controls/ContextDrawer.qml
--- a/src/controls/ContextDrawer.qml
+++ b/src/controls/ContextDrawer.qml
@@ -19,16 +19,17 @@
 
 import QtQuick 2.1
 import QtQuick.Layouts 1.2
-import QtQuick.Controls 1.0 as QtControls
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
+
+import "templates/private"
 
 /**
  * A drawer specialization that will show a list of actions that are
  * specific of the current page shown by the application
  *
  * Example usage:
  * @code
- * import org.kde.kirigami 1.0 as Kirigami
+ * import org.kde.kirigami 2.0 as Kirigami
  *
  * Kirigami.ApplicationWindow {
  *  [...]
@@ -40,7 +41,7 @@
  * @endcode
  *
  * @code
- * import org.kde.kirigami 1.0 as Kirigami
+ * import org.kde.kirigami 2.0 as Kirigami
  *
  * Kirigami.Page {
  *   [...]
@@ -83,7 +84,12 @@
     property var actions: pageStack.currentItem ? pageStack.currentItem.contextualActions : null
     enabled: menu.count > 0
     edge: Qt.RightEdge
-    opened: false
+    drawerOpen: false
+
+    //list items go to edges, have their own padding
+    leftPadding: 0
+    rightPadding: 0
+    bottomPadding: 0
 
     handleVisible: applicationWindow == undefined || applicationWindow().wideScreen == true ? false : applicationWindow().controlsVisible
 
@@ -95,7 +101,7 @@
         }
     }
 
-    contentItem: QtControls.ScrollView {
+    contentItem: ScrollView {
         implicitWidth: Units.gridUnit * 20
         ListView {
             id: menu
@@ -147,7 +153,7 @@
                     } else {
                         console.warning("Don't know how to trigger the action")
                     }
-                    root.opened = false;
+                    root.drawerOpen = false;
                 }
             }
         }
diff --git a/src/controls/GlobalDrawer.qml b/src/controls/GlobalDrawer.qml
--- a/src/controls/GlobalDrawer.qml
+++ b/src/controls/GlobalDrawer.qml
@@ -18,21 +18,22 @@
  */
 
 import QtQuick 2.1
-import QtQuick.Controls 1.4 as Controls
+import QtQuick.Controls 2.0 as QQC2
 import QtQuick.Layouts 1.2
 import QtGraphicalEffects 1.0
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 import "private"
+import "templates/private"
 
 /**
  * A drawer specialization intended for the global actions of the application
  * valid regardless of the application state (think about the menubar
  * of a desktop application).
  *
  * Example usage:
  * @code
- * import org.kde.kirigami 1.0 as Kirigami
+ * import org.kde.kirigami 2.0 as Kirigami
  *
  * Kirigami.ApplicationWindow {
  *  [...]
@@ -95,7 +96,7 @@
      *
      * Example usage:
      * @code
-     * import org.kde.kirigami 1.0 as Kirigami
+     * import org.kde.kirigami 2.0 as Kirigami
      *
      * Kirigami.ApplicationWindow {
      *  [...]
@@ -134,7 +135,7 @@
      *
      * Example usage:
      * @code
-     * import org.kde.kirigami 1.0 as Kirigami
+     * import org.kde.kirigami 2.0 as Kirigami
      *
      * Kirigami.ApplicationWindow {
      *  [...]
@@ -158,7 +159,7 @@
      *
      * Example usage:
      * @code
-     * import org.kde.kirigami 1.0 as Kirigami
+     * import org.kde.kirigami 2.0 as Kirigami
      *
      * Kirigami.ApplicationWindow {
      *  [...]
@@ -201,11 +202,11 @@
     function resetMenu() {
         stackView.pop(stackView.initialItem);
         if (root.modal) {
-            root.opened = false;
+            root.drawerOpen = false;
         }
     }
 
-    contentItem: Controls.ScrollView {
+    contentItem: ScrollView {
         id: scrollView
         anchors.fill: parent
         implicitWidth: Math.min (Units.gridUnit * 20, root.parent.width * 0.8)
@@ -313,7 +314,7 @@
                     visible: children.length > 0 && childrenRect.height > 0
                 }
 
-                Controls.StackView {
+                QQC2.StackView {
                     id: stackView
                     Layout.fillWidth: true
                     Layout.minimumHeight: currentItem ? currentItem.implicitHeight : 0
@@ -378,8 +379,8 @@
                                 opacity: enabled ? 1.0 : 0.3
                                 Icon {
                                     anchors {
-                                        verticalCenter: parent.verticalCenter
-                                        right: parent.right
+                                        verticalCenter: contentItem.verticalCenter
+                                        right: contentItem.right
                                     }
                                     height: Units.iconSizes.smallMedium
                                     selected: listItem.checked || listItem.pressed
diff --git a/src/controls/Heading.qml b/src/controls/Heading.qml
--- a/src/controls/Heading.qml
+++ b/src/controls/Heading.qml
@@ -18,7 +18,7 @@
 */
 
 import QtQuick 2.0
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 /**
  * A heading label used for subsections of texts.
@@ -30,7 +30,7 @@
  * Example usage:
  *
  * @code
- * import org.kde.kirigami 1.0 as Kirigami
+ * import org.kde.kirigami 2.0 as Kirigami
  * [...]
  * Column {
  *     Kirigami.Heading {
diff --git a/src/controls/Icon.qml b/src/controls/Icon.qml
--- a/src/controls/Icon.qml
+++ b/src/controls/Icon.qml
@@ -19,7 +19,7 @@
 
 import QtQuick 2.0
 import QtGraphicalEffects 1.0
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 Item {
     id: root
diff --git a/src/controls/Label.qml b/src/controls/Label.qml
--- a/src/controls/Label.qml
+++ b/src/controls/Label.qml
@@ -18,7 +18,8 @@
 */
 
 import QtQuick 2.1
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
+import QtQuick.Templates 2.0 as T2
 
 /**
  * This is a label which uses the plasma Theme.
@@ -32,7 +33,7 @@
  *
  * @inherit QtQuick.Text
  */
-Text {
+T2.Label {
     id: root
 
     height: Math.round(Math.max(paintedHeight, Units.gridUnit * 1.6))
diff --git a/src/controls/OverlayDrawer.qml b/src/controls/OverlayDrawer.qml
--- a/src/controls/OverlayDrawer.qml
+++ b/src/controls/OverlayDrawer.qml
@@ -19,7 +19,8 @@
 
 import QtQuick 2.1
 import QtGraphicalEffects 1.0
-import org.kde.kirigami 1.0
+import QtQuick.Templates 2.0 as T2
+import org.kde.kirigami 2.0
 
 import "private"
 import "templates" as T
@@ -40,39 +41,15 @@
         color: Theme.viewBackgroundColor
 
         Item {
-            id: drawerHandle
-            z: -1
-
-            anchors {
-                right: root.edge == Qt.LeftEdge ? undefined : parent.left
-                left: root.edge == Qt.RightEdge ? undefined : parent.right
-                bottom: parent.bottom
-            }
-            visible: root.enabled && (root.edge == Qt.LeftEdge || root.edge == Qt.RightEdge)
-            width: Units.iconSizes.medium + Units.smallSpacing * 2
-            height: width
-            opacity: root.handleVisible ? 1 : 0
-            Behavior on opacity {
-                NumberAnimation {
-                    duration: Units.longDuration
-                    easing.type: Easing.InOutQuad
-                }
-            }
-            transform: Translate {
-                id: translateTransform
-                x: root.handleVisible ? 0 : (root.edge == Qt.LeftEdge ? -drawerHandle.width : drawerHandle.width)
-                Behavior on x {
-                    NumberAnimation {
-                        duration: Units.longDuration
-                        easing.type: !root.handleVisible ? Easing.OutQuad : Easing.InQuad
-                    }
-                }
-            }
+            parent: root.handle
+            anchors.fill: parent
             Item {
                 opacity: 0.4 + root.position
                 anchors {
-                    fill:parent
-                    margins: -Units.gridUnit
+                    fill: parent
+                    topMargin: -Units.gridUnit
+                    leftMargin: root.edge == Qt.RightEdge ? -Units.gridUnit : 0
+                    rightMargin: root.edge == Qt.RightEdge ? 0 : -Units.gridUnit
                 }
                 layer.enabled: true
                 Rectangle {
@@ -91,8 +68,10 @@
                     id: handleGraphics
                     color: Theme.viewBackgroundColor
                     anchors {
-                        fill:parent
-                        margins: Units.gridUnit
+                        fill: parent
+                        topMargin: Units.gridUnit
+                        leftMargin: root.edge == Qt.RightEdge ? Units.gridUnit : 0
+                        rightMargin: root.edge == Qt.RightEdge ? 0 : Units.gridUnit
                     }
                 }
             }
diff --git a/src/controls/OverlaySheet.qml b/src/controls/OverlaySheet.qml
--- a/src/controls/OverlaySheet.qml
+++ b/src/controls/OverlaySheet.qml
@@ -18,7 +18,7 @@
 */
 
 import QtQuick 2.5
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 import "private"
 import "templates" as T
 
diff --git a/src/controls/Page.qml b/src/controls/Page.qml
--- a/src/controls/Page.qml
+++ b/src/controls/Page.qml
@@ -19,53 +19,42 @@
 
 import QtQuick 2.1
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 import "private"
+import QtQuick.Templates 2.0 as T2
 
 /**
  * Page is a container for all the app pages: everything pushed to the
  * ApplicationWindow stackView should be a Page instabnce (or a subclass,
  * such as ScrollablePage)
  * @see ScrollablePage
  */
-Item {
+T2.Page {
     id: root
 
     /**
-     * title: string
-     * Title for the page
-     */
-    property string title
-
-    /**
      * leftPadding: int
      * default contents padding at left
      */
-    property int leftPadding: Units.gridUnit
+    leftPadding: Units.gridUnit
 
     /**
      * topPadding: int
      * default contents padding at top
      */
-    property int topPadding: Units.gridUnit
+    topPadding: Units.gridUnit
 
     /**
      * rightPadding: int
      * default contents padding at right
      */
-    property int rightPadding: Units.gridUnit
+    rightPadding: Units.gridUnit
 
     /**
      * bottomPadding: int
      * default contents padding at bottom
      */
-    property int bottomPadding: Units.gridUnit
-
-    /**
-     * contentData: Item
-     * The main items contained in this Page
-     */
-    default property alias contentData: container.data
+    bottomPadding: Units.gridUnit
 
     /**
      * flickable: Flickable
@@ -85,7 +74,7 @@
      *
      * Example usage:
      * @code
-     * import org.kde.kirigami 1.0 as Kirigami
+     * import org.kde.kirigami 2.0 as Kirigami
      *
      * Kirigami.ApplicationWindow {
      *  [...]
@@ -97,7 +86,7 @@
      * @endcode
      *
      * @code
-     * import org.kde.kirigami 1.0 as Kirigami
+     * import org.kde.kirigami 2.0 as Kirigami
      *
      * Kirigami.Page {
      *   [...]
@@ -132,7 +121,7 @@
      * Example usage:
      *
      * @code
-     * import org.kde.kirigami 1.0 as Kirigami
+     * import org.kde.kirigami 2.0 as Kirigami
      * Kirigami.Page {
      *     actions.main: Kirigami.Action {
      *         iconName: "edit"
@@ -154,7 +143,7 @@
      * Example usage:
      *
      * @code
-     * import org.kde.kirigami 1.0 as Kirigami
+     * import org.kde.kirigami 2.0 as Kirigami
      * Kirigami.Page {
      *     actions.left: Kirigami.Action {
      *         iconName: "edit"
@@ -176,7 +165,7 @@
      * Example usage:
      *
      * @code
-     * import org.kde.kirigami 1.0 as Kirigami
+     * import org.kde.kirigami 2.0 as Kirigami
      * Kirigami.Page {
      *     actions.right: Kirigami.Action {
      *         iconName: "edit"
@@ -194,7 +183,7 @@
      * Actions properties are grouped.
      *
      * @code
-     * import org.kde.kirigami 1.0 as Kirigami
+     * import org.kde.kirigami 2.0 as Kirigami
      * Kirigami.Page {
      *     actions {
      *         main: Kirigami.Action {...}
@@ -215,22 +204,6 @@
     }
 
     /**
-     * background: Item
-     * This property holds the background item.
-     * Note: If the background item has no explicit size specified,
-     * it automatically follows the control's size.
-     * In most cases, there is no need to specify width or
-     * height for a background item.
-     */
-    property Item background
-
-    onBackgroundChanged: {
-        background.z = -1;
-        background.parent = root;
-        background.anchors.fill = root;
-    }
-
-    /**
      * emitted When the application requests a Back action
      * For instance a global "back" shortcut or the Android
      * Back button has been pressed.
@@ -240,28 +213,25 @@
      */
     signal backRequested(var event);
 
-    Item {
-        id: container
+    anchors.topMargin: (applicationWindow() && !applicationWindow().wideScreen && applicationWindow().controlsVisible && applicationWindow().header ? applicationWindow().header.preferredHeight : 0)
+
+    //NOTE: This exists just because control instances require it
+    contentItem: Item { 
         onChildrenChanged: {
             //NOTE: make sure OverlaySheets are directly under the root
             //so they are over all the contents and don't have margins
-            //TODO: OverlayDrawers as well?
             //search for an OverlaySheet, unfortunately have to blind test properties
             //as there is no way to get the classname from qml objects
+            //TODO: OverlaySheets should be Popup instead?
             for (var i = children.length -1; i >= 0; --i) {
                 var child = children[i];
-                if (child.toString().indexOf("OverlaySheet") === 0) {
+                if (child.toString().indexOf("OverlaySheet") === 0 ||
+                    (child.sheetOpen !== undefined && child.open !== undefined && child.close !== undefined)) {
                     child.parent = root;
+                    child.z = 9997
                 }
             }
         }
-        anchors {
-            fill: parent
-            leftMargin: leftPadding
-            topMargin: topPadding + (applicationWindow === undefined || applicationWindow().wideScreen ? 0 : applicationWindow().header.height)
-            rightMargin: rightPadding
-            bottomMargin: bottomPadding
-        }
     }
 
     Loader {
diff --git a/src/controls/ScrollablePage.qml b/src/controls/ScrollablePage.qml
--- a/src/controls/ScrollablePage.qml
+++ b/src/controls/ScrollablePage.qml
@@ -19,7 +19,7 @@
 
 import QtQuick 2.1
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 import "private"
 
 /**
@@ -88,58 +88,47 @@
      * The main content Item of this page.
      * In the case of a ListView or GridView, both contentItem and flickable
      * will be a pointer to the ListView (or GridView)
+     * NOTE: can't be contentItem as Page's contentItem is final
      */
-    default property alias contentItem: scrollView.contentItem
+    default property QtObject mainItem
 
-    /**
-     * leftPadding: int
-     * default contents padding at left
-     */
-    property alias leftPadding: scrollView.leftPadding
-
-    /**
-     * topPadding: int
-     * default contents padding at top
-     */
-    property alias topPadding: scrollView.topPadding
-
-    /**
-     * rightPadding: int
-     * default contents padding at right
-     */
-    property alias rightPadding: scrollView.rightPadding
-
-    /**
-     * bottomPadding: int
-     * default contents padding at bottom
-     */
-    property alias bottomPadding: scrollView.bottomPadding
+    RefreshableScrollView {
+        id: scrollView
+        z: 0
+        //child of root as it shouldn't have margins
+        parent: root
+        topPadding: (applicationWindow() && applicationWindow().header ? applicationWindow().header.preferredHeight : 0) + (contentItem == flickable ? 0 : root.topPadding)
+        leftPadding: contentItem == flickable ? 0 : root.leftPadding
+        rightPadding: contentItem == flickable ? 0 : root.rightPadding
+        bottomPadding: contentItem == flickable ? 0 : root.bottomPadding
+        anchors {
+            fill: parent
+            topMargin: root.header ? root.header.height : 0
+        }
+    }
 
-    children: [
-        RefreshableScrollView {
-            id: scrollView
-            topPadding: (applicationWindow() && applicationWindow().header ? applicationWindow().header.preferredHeight : 0) + (contentItem == flickable ? 0 : Units.gridUnit)
-            leftPadding: contentItem == flickable ? 0 : Units.gridUnit
-            rightPadding: contentItem == flickable ? 0 : Units.gridUnit
-            bottomPadding: contentItem == flickable ? 0 : Units.gridUnit
-            anchors {
-                fill: parent
-            }
-        },
+    anchors.topMargin: 0
 
-        Item {
-            id: overlay
-            anchors.fill: parent
-            property Item oldContentItem
-        }
-    ]
+    Item {
+        id: overlay
+        parent: root
+        z: 9998
+        anchors.fill: parent
+        property QtObject oldMainItem
+    }
 
-    //HACK to get the contentItem as the last one, all the other eventual items as an overlay
+    //HACK to get the mainItem as the last one, all the other eventual items as an overlay
     //no idea if is the way the user expects
-    onContentItemChanged: {
-         if (overlay.oldContentItem) {
-             overlay.oldContentItem.parent = overlay
+    onMainItemChanged: {
+         if (mainItem.hasOwnProperty("anchors")) {
+             scrollView.contentItem = mainItem
+         //don't try to reparent drawers
+         } else if (mainItem.hasOwnProperty("dragMargin")) {
+             return;
+         }
+         if (overlay.oldMainItem && overlay.oldMainItem.parent != applicationWindow().overlay) {
+             overlay.oldMainItem.parent = overlay
          }
-         overlay.oldContentItem = root.contentItem
+         overlay.oldMainItem = mainItem
     }
 }
diff --git a/src/controls/Separator.qml b/src/controls/Separator.qml
--- a/src/controls/Separator.qml
+++ b/src/controls/Separator.qml
@@ -19,7 +19,7 @@
  */
 
 import QtQuick 2.1
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 /**
  * A visual separator
diff --git a/src/controls/ToolBarApplicationHeader.qml b/src/controls/ToolBarApplicationHeader.qml
--- a/src/controls/ToolBarApplicationHeader.qml
+++ b/src/controls/ToolBarApplicationHeader.qml
@@ -22,24 +22,18 @@
 import QtQuick.Layouts 1.2
 import QtQuick.Controls.Private 1.0
 import "private"
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 
 /**
  * 
  */
 ApplicationHeader {
     id: header
 
-    preferredHeight: 34//spacer.height
+    preferredHeight: 38
     maximumHeight: preferredHeight
 
-    Controls.ToolButton {
-        id: spacer
-        iconName: "go-previous"
-        visible: false
-    }
-
     //FIXME: needs a property difinition to have its own type in qml
     property string _internal: ""
 
@@ -54,7 +48,7 @@
             //more columns shown?
             if (__appWindow.wideScreen) {
                 if (modelData == 0 && view.x > 0) {
-                    return page.width - Math.max(0, view.x - __appWindow.contentItem.x);
+                    return page.width - view.x;
                 } else {
                     return page.width;
                 }
@@ -71,50 +65,31 @@
             id: toolbarComponent
             Row {
                 id: layout
+                anchors.verticalCenter: parent.verticalCenter
                 x: __appWindow.wideScreen ? (Math.min(delegateItem.width - width, Math.max(0, delegateItem.view.contentX - delegateItem.x))) : 0
+                spacing: 2
 
                 Rectangle {
                     anchors.verticalCenter: parent.verticalCenter
                     color: Theme.textColor
                     opacity: 0.3
                     width: Units.devicePixelRatio
                     height: parent.height * 0.6
                 }
-                Controls.ToolButton {
+                PrivateActionToolButton {
                     anchors.verticalCenter: parent.verticalCenter
-                    iconName: page && page.actions && page.actions.main ? page.actions.main.iconName : ""
-                    text: page && page.actions && page.actions.main ? page.actions.main.text : ""
-                    tooltip: page && page.actions && page.actions.main ? page.actions.main.text : ""
-                    checkable: page && page.actions && page.actions.main && page.actions.main.checkable
-                    checked: page && page.actions && page.actions.main && page.actions.main.checked
-                    enabled: page && page.actions && page.actions.main && page.actions.main.enabled
-                    opacity: enabled ? 1 : 0.4
-                    visible: page && page.actions && page.actions.main && page.actions.main.visible
-                    onClicked: page.actions.main.trigger();
+                    action: page && page.actions ? page.actions.left : null
+                    showText: false
                 }
-                Controls.ToolButton {
+                PrivateActionToolButton {
                     anchors.verticalCenter: parent.verticalCenter
-                    iconName: page && page.actions && page.actions.left ? page.actions.left.iconName : ""
-                    text: page && page.actions && page.actions.left ? page.actions.left.text : ""
-                    tooltip: page && page.actions && page.actions.left ? page.actions.left.text : ""
-                    checkable: page && page.actions && page.actions.left && page.actions.left.checkable
-                    checked: page && page.actions && page.actions.left && page.actions.left.checked
-                    enabled: page && page.actions && page.actions.left && page.actions.left.enabled
-                    opacity: enabled ? 1 : 0.4
-                    visible: page && page.actions && page.actions.left && page.actions.left && page.actions.left.visible
-                    onClicked: page.actions.left.trigger();
+                    action: page && page.actions ? page.actions.main : null
+                    showText: false
                 }
-                Controls.ToolButton {
+                PrivateActionToolButton {
                     anchors.verticalCenter: parent.verticalCenter
-                    iconName: page && page.actions && page.actions.right ? page.actions.right.iconName : ""
-                    text: page && page.actions && page.actions.right ? page.actions.right.text : ""
-                    tooltip: page && page.actions && page.actions.right ? page.actions.right.text : ""
-                    checkable: page && page.actions && page.actions.right && page.actions.right.checkable
-                    checked: page && page.actions && page.actions.right && page.actions.right.checked
-                    enabled: page && page.actions && page.actions.right && page.actions.right.enabled
-                    opacity: enabled ? 1 : 0.4
-                    visible: page && page.actions && page.actions.right && page.actions.right && page.actions.right.visible
-                    onClicked: page.actions.right.trigger();
+                    action: page && page.actions ? page.actions.right : null
+                    showText: false
                 }
                 Rectangle {
                     anchors.verticalCenter: parent.verticalCenter
@@ -126,17 +101,10 @@
                 Repeater {
                     id: repeater
                     model: page && page.actions.contextualActions ? page.actions.contextualActions : null
-                    delegate: Controls.ToolButton {
+                    delegate: PrivateActionToolButton {
                         anchors.verticalCenter: parent.verticalCenter
-                        iconName: modelData.iconName
-                        text: modelData.text
-                        tooltip: modelData.text
-                        checkable: modelData.checkable
-                        checked: modelData.checked
-                        enabled: modelData.enabled
-                        opacity: enabled ? 1 : 0.4
+                        action: modelData
                         visible: modelData.visible && x+layout.x+width*2 < delegateItem.width
-                        onClicked: modelData.trigger();
                     }
                 }
             }
diff --git a/src/controls/private/ActionButton.qml b/src/controls/private/ActionButton.qml
--- a/src/controls/private/ActionButton.qml
+++ b/src/controls/private/ActionButton.qml
@@ -20,7 +20,7 @@
 import QtQuick 2.1
 import QtQuick.Layouts 1.2
 import QtGraphicalEffects 1.0
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 import "../templates/private"
 
@@ -60,9 +60,13 @@
         onXChanged: {
             if (mouseArea.pressed || edgeMouseArea.pressed || fakeContextMenuButton.pressed) {
                 if (globalDrawer && globalDrawer.enabled && globalDrawer.modal) {
+                    globalDrawer.peeking = true;
+                    globalDrawer.visible = true;
                     globalDrawer.position = Math.min(1, Math.max(0, (x - root.width/2 + button.width/2)/globalDrawer.contentItem.width + mouseArea.drawerShowAdjust));
                 }
                 if (contextDrawer && contextDrawer.enabled && contextDrawer.modal) {
+                    contextDrawer.peeking = true;
+                    contextDrawer.visible = true;
                     contextDrawer.position = Math.min(1, Math.max(0, (root.width/2 - button.width/2 - x)/contextDrawer.contentItem.width + mouseArea.drawerShowAdjust));
                 }
             }
@@ -117,6 +121,8 @@
                 rightButtonPressedUnderMouse = !buttonPressedUnderMouse && rightAction && mouse.x > buttonGraphics.x + buttonGraphics.width;
             }
             onReleased: {
+                globalDrawer.peeking = false;
+                contextDrawer.peeking = false;
                 //pixel/second
                 var x = button.x + button.width/2;
                 var speed = ((x - startX) / ((new Date()).getTime() - downTimestamp) * 1000);
@@ -378,10 +384,12 @@
 
         onPressed: mouseArea.onPressed(mouse)
         onReleased: {
+            globalDrawer.peeking = false;
+            contextDrawer.peeking = false;
             var pos = root.mapFromItem(fakeContextMenuButton, mouse.x, mouse.y);
-            if (pos.x < root.width/2 || (!contextDrawer.opened && mouse.x > 0 && mouse.x < width)) {
+            if (pos.x < root.width/2 || (!contextDrawer.drawerOpen && mouse.x > 0 && mouse.x < width)) {
                 contextDrawer.open();
-            } else if (contextDrawer.opened && mouse.x > 0 && mouse.x < width) {
+            } else if (contextDrawer.drawerOpen && mouse.x > 0 && mouse.x < width) {
                 contextDrawer.close();
             }
             if (globalDrawer.position > 0.5) {
diff --git a/src/controls/private/CornerShadow.qml b/src/controls/private/CornerShadow.qml
--- a/src/controls/private/CornerShadow.qml
+++ b/src/controls/private/CornerShadow.qml
@@ -19,7 +19,7 @@
 
 import QtQuick 2.1
 import QtGraphicalEffects 1.0
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 RadialGradient {
     id: shadow
diff --git a/src/controls/private/DefaultListItemBackground.qml b/src/controls/private/DefaultListItemBackground.qml
--- a/src/controls/private/DefaultListItemBackground.qml
+++ b/src/controls/private/DefaultListItemBackground.qml
@@ -18,7 +18,8 @@
  */
 
 import QtQuick 2.1
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
+//those 2 for settings
 import QtQuick.Controls 1.0 as Controls
 import QtQuick.Controls.Private 1.0
 
@@ -31,7 +32,7 @@
         anchors.fill: parent
         visible: !Settings.isMobile
         color: listItem.activeBackgroundColor
-        opacity: listItem.containsMouse && !listItem.pressed ? 0.2 : 0
+        opacity: listItem.hovered && !listItem.pressed ? 0.2 : 0
         Behavior on opacity { NumberAnimation { duration: Units.longDuration } }
     }
     Behavior on color {
@@ -42,7 +43,7 @@
 
     on_FirstElementChanged: {
         if (_firstElement) {
-            var newObject = Qt.createQmlObject('import QtQuick 2.0; import org.kde.kirigami 1.0; Separator {anchors {left: parent.left; right: parent.right; top: parent.top} visible: listItem.separatorVisible; color: listItem.textColor}',
+            var newObject = Qt.createQmlObject('import QtQuick 2.0; import org.kde.kirigami 2.0; Separator {anchors {left: parent.left; right: parent.right; bottom: parent.top} visible: listItem.separatorVisible; color: listItem.textColor}',
                                    background);
         }
     }
diff --git a/src/controls/private/EdgeShadow.qml b/src/controls/private/EdgeShadow.qml
--- a/src/controls/private/EdgeShadow.qml
+++ b/src/controls/private/EdgeShadow.qml
@@ -19,7 +19,7 @@
 
 import QtQuick 2.1
 import QtGraphicalEffects 1.0
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 LinearGradient {
     id: shadow
diff --git a/src/controls/private/PrivateActionToolButton.qml b/src/controls/private/PrivateActionToolButton.qml
new file mode 100644
--- /dev/null
+++ b/src/controls/private/PrivateActionToolButton.qml
@@ -0,0 +1,83 @@
+/*
+ *   Copyright 2016 Marco Martin <mart@kde.org>
+ *
+ *   This program is free software; you can redistribute it and/or modify
+ *   it under the terms of the GNU Library General Public License as
+ *   published by the Free Software Foundation; either version 2, or
+ *   (at your option) any later version.
+ *
+ *   This program is distributed in the hope that it will be useful,
+ *   but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *   GNU Library General Public License for more details
+ *
+ *   You should have received a copy of the GNU Library General Public
+ *   License along with this program; if not, write to the
+ *   Free Software Foundation, Inc.,
+ *   51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+
+import QtQuick 2.6
+import QtQuick.Layouts 1.2
+import QtQuick.Templates 2.0 as T
+//QQC1 is needed for StyleItem to fully work
+import QtQuick.Controls 1.0 as QQC1
+import QtQuick.Controls.Private 1.0
+import org.kde.kirigami 2.0
+
+T.ToolButton {
+    id: control
+
+    implicitWidth: Math.max(background.implicitWidth, layout.implicitWidth + 16)
+    implicitHeight: background.implicitHeight
+
+    hoverEnabled: true
+    property Action action
+    property bool showText: true
+
+    text: action ? action.text : ""
+    checkable: action && action.checkable
+    checked: action && action.checked
+    enabled: action && action.enabled
+    opacity: enabled ? 1 : 0.4
+    visible: action && action.visible
+    onClicked: {
+        if (action) {
+            action.trigger();
+        }
+    }
+
+    flat: true
+    contentItem: MouseArea {
+        hoverEnabled: true
+        onPressed: mouse.accepted = false
+        RowLayout {
+            id: layout
+            anchors.centerIn: parent
+            Icon {
+                Layout.minimumWidth: 22
+                Layout.minimumHeight: 22
+                source: control.action ? control.action.iconName : ""
+                visible: control.action && control.action.iconName != ""
+            }
+            Label {
+                text: control.text
+                visible: control.showText
+            }
+        }
+    }
+    background: StyleItem {
+        id: styleitem
+        elementType: control.flat ? "toolbutton" : "button"
+        sunken: control.pressed || (control.checkable && control.checked)
+        raised: !(control.pressed || (control.checkable && control.checked))
+        hover: control.hovered
+        activeControl: control.isDefault ? "default" : "f"
+    }
+    Timer {
+        interval: 1000
+        property string tooltip: action.tooltip.length ? action.tooltip : action.text
+        running: control.hovered && !control.pressed && tooltip.length
+        onTriggered: Tooltip.showText(contentItem, Qt.point(contentItem.mouseX, contentItem.mouseY), tooltip)
+    }
+}
diff --git a/src/controls/private/RefreshableScrollView.qml b/src/controls/private/RefreshableScrollView.qml
--- a/src/controls/private/RefreshableScrollView.qml
+++ b/src/controls/private/RefreshableScrollView.qml
@@ -18,11 +18,11 @@
  */
 
 import QtQuick 2.5
-import QtQuick.Controls 1.3 as Controls
+import QtQuick.Controls 2.0 as QQC2
 import QtGraphicalEffects 1.0
 import QtQuick.Layouts 1.2
-import org.kde.kirigami 1.0
-
+import org.kde.kirigami 2.0
+import "../templates/private" as P
 
 /**
  * RefreshableScrollView is a scroll view for any Flickable that supports the
@@ -33,7 +33,7 @@
  * Example usage:
  *
  * @code
- * import org.kde.kirigami 1.0 as Kirigami
+ * import org.kde.kirigami 2.0 as Kirigami
  * [...]
  * 
  * Kirigami.RefreshableScrollView {
@@ -59,9 +59,8 @@
  *
  * @endcode
  * 
- * @inherit QtQuick.Controls.Scrollview
  */
-Controls.ScrollView {
+P.ScrollView {
     id: root
 
     /**
@@ -104,16 +103,16 @@
     property int bottomPadding: Units.gridUnit
 
 
-    frameVisible: false
+    property Item _swipeFilter
 
     children: [
         Item {
             id: busyIndicatorFrame
             z: 99
             y: -root.flickableItem.contentY-height
             width: root.flickableItem.width
             height: busyIndicator.height + Units.gridUnit * 2
-            Controls.BusyIndicator {
+            QQC2.BusyIndicator {
                 id: busyIndicator
                 anchors.centerIn: parent
                 running: root.refreshing
diff --git a/src/controls/SplitDrawer.qml b/src/controls/private/SwipeItemEventFilter.qml
rename from src/controls/SplitDrawer.qml
rename to src/controls/private/SwipeItemEventFilter.qml
--- a/src/controls/SplitDrawer.qml
+++ b/src/controls/private/SwipeItemEventFilter.qml
@@ -17,29 +17,26 @@
  *   51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 
-import QtQuick 2.1
-import "private"
-import "templates" as T
+import QtQuick 2.5
+import org.kde.kirigami 2.0
 
-/**
- * Split Drawers are used to expose additional UI elements which are optional
- * and can be used in conjunction with the main UI elements.
- * For example the Resource Browser uses a Split Drawer to select
- * different kinds of filters for the main view.
- */
-T.SplitDrawer {
-    id: root
 
-    background: Item {
-        EdgeShadow {
-            edge: Qt.RightEdge
-            anchors {
-                right: parent.left
-                top: parent.top
-                bottom: parent.bottom
-                rightMargin: -1
-            }
-        }
+MouseArea {
+    id: swipeFilter
+    anchors {
+        right: parent.right
+        top: parent.top
+        bottom: parent.bottom
     }
-}
 
+    z: 99999
+    property Item currentItem
+    property real peek
+
+    width: Units.gridUnit
+    onPositionChanged: {
+        var mapped = mapToItem(parent.flickableItem.contentItem, mouse.x, mouse.y);
+        currentItem = parent.flickableItem.itemAt(mapped.x, mapped.y)
+        peek = 1 - mapped.x / parent.flickableItem.contentItem.width
+    }
+}
diff --git a/src/controls/templates/AbstractApplicationHeader.qml b/src/controls/templates/AbstractApplicationHeader.qml
--- a/src/controls/templates/AbstractApplicationHeader.qml
+++ b/src/controls/templates/AbstractApplicationHeader.qml
@@ -20,7 +20,7 @@
 import QtQuick 2.5
 import QtQuick.Layouts 1.2
 import "private"
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 
 /**
@@ -42,16 +42,22 @@
     property int maximumHeight: Units.gridUnit * 3
     default property alias contentItem: mainItem.data
 
-    parent: __appWindow.contentItem.parent
     //FIXME: remove
     property QtObject __appWindow: applicationWindow();
 
     anchors {
-        top: parent.top
         left: parent.left
         right: parent.right
     }
-    height: preferredHeight
+    height: {
+        if (!__appWindow.controlsVisible) {
+            return 1;
+        } else if (__appWindow.wideScreen) {
+            return preferredHeight;
+        } else {
+            return 1;
+        }
+    }
 
     /**
      * background: Item
@@ -62,16 +68,8 @@
 
     onBackgroundChanged: {
         background.z = -1;
-        background.parent = root;
-        background.anchors.fill = root;
-    }
-
-    Behavior on height {
-        enabled: __appWindow.pageStack.currentItem && __appWindow.pageStack.currentItem.flickable && !__appWindow.pageStack.currentItem.flickable.moving
-        NumberAnimation {
-            duration: Units.longDuration
-            easing.type: Easing.InOutQuad
-        }
+        background.parent = headerItem;
+        background.anchors.fill = headerItem;
     }
 
     opacity: height > 0 && -translateTransform.y <= height ? 1 : 0
@@ -82,28 +80,13 @@
         }
     }
 
-    Connections {
-        target: __appWindow
-        onWideScreenChanged: {
-            if (wideScreen) {
-                height = preferredHeight;
-            } else {
-                height = preferredHeight;
-            }
-        }
-        onHeightChanged: root.height = preferredHeight;
-        onReachableModeChanged: root.height = __appWindow.reachableMode  && !__appWindow.wideScreen ? maximumHeight : preferredHeight;
-    }
-
     transform: Translate {
         id: translateTransform
         y: {
             if (__appWindow === undefined) {
                 return 0;
             }
-            if (__appWindow.reachableMode && !__appWindow.wideScreen) {
-                return __appWindow.height/2;
-            } else if (!__appWindow.controlsVisible) {
+            if (!__appWindow.controlsVisible) {
                 return -headerItem.height - Units.smallSpacing;
             } else {
                 return 0;
@@ -122,10 +105,9 @@
         anchors {
             left: parent.left
             right: parent.right
-            bottom: parent.bottom
         }
 
-        height: parent.preferredHeight
+        height: __appWindow.reachableMode ? root.maximumHeight : root.preferredHeight
 
         Connections {
             id: headerSlideConnection
@@ -141,23 +123,20 @@
                 }
 
                 if (__appWindow.wideScreen) {
-                    root.height = root.preferredHeight;
-                } else if (__appWindow.reachableMode && !__appWindow.wideScreen) {
-                    root.height = root.maximumHeight;
+                    headerItem.y = 0;
                 } else {
-                    root.height = Math.min(root.preferredHeight,
-                                           Math.max(root.minimumHeight,
-                                               root.height + oldContentY - __appWindow.pageStack.currentItem.flickable.contentY));
+                    headerItem.y = Math.max(root.minimumHeight - root.preferredHeight, Math.min(0, headerItem.y + oldContentY - __appWindow.pageStack.currentItem.flickable.contentY));
+                    
                     oldContentY = __appWindow.pageStack.currentItem.flickable.contentY;
                 }
             }
             onMovementEnded: {
-                if (root.height > root.preferredHeight) {
+                if (headerItem.y > root.preferredHeight) {
                     //if don't change the position if more then preferredSize is shown
-                } else if (root.height > root.preferredHeight/2 ) {
-                    root.height = root.preferredHeight;
+                } else if (headerItem.y < -(root.preferredHeight - root.minimumHeight)/2 ) {
+                    headerItem.y = root.minimumHeight - root.preferredHeight;
                 } else {
-                    root.height = 0;
+                    headerItem.y = 0;
                 }
             }
         }
@@ -172,15 +151,21 @@
                 } else {
                     headerSlideConnection.oldContentY = 0;
                 }
-                root.height = root.preferredHeight;
+                headerItem.y = 0;
             }
         }
 
         Item {
             id: mainItem
             anchors {
                 fill: parent
-                topMargin: applicationWindow().reachable ? 0 : Math.min(headerItem.height - root.height, headerItem.height - root.preferredHeight)
+            }
+        }
+        Behavior on y {
+            enabled: __appWindow.pageStack.currentItem && __appWindow.pageStack.currentItem.flickable && !__appWindow.pageStack.currentItem.flickable.moving
+            NumberAnimation {
+                duration: Units.longDuration
+                easing.type: Easing.InOutQuad
             }
         }
     }
diff --git a/src/controls/templates/AbstractListItem.qml b/src/controls/templates/AbstractListItem.qml
--- a/src/controls/templates/AbstractListItem.qml
+++ b/src/controls/templates/AbstractListItem.qml
@@ -19,77 +19,34 @@
 
 import QtQuick 2.1
 import QtQuick.Layouts 1.0
-import QtQuick.Controls 1.0 as Controls
-import QtQuick.Controls.Private 1.0
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
+import QtQuick.Templates 2.0 as T2
 
 /**
  * An item delegate for the primitive ListView component.
  *
  * It's intended to make all listviews look coherent.
  *
  * @inherit QtQuick.Item
  */
-Item {
+T2.ItemDelegate {
     id: listItem
     
     /**
-     * contentItem: Item
-     * This property holds the visual content item.
-     *
-     * Note: The content item is automatically resized inside the
-     * padding of the control.
-     */
-     default property Item contentItem
-
-    /**
      * supportsMouseEvents: bool
      * Holds if the item emits signals related to mouse interaction.
      *TODO: remove
      * The default value is false.
      */
-    property alias supportsMouseEvents: itemMouse.enabled
-
-    /**
-     * clicked: signal
-     * This signal is emitted when there is a click.
-     *
-     * This is disabled by default, set enabled to true to use it.
-     * @see enabled
-     */
-    signal clicked
-
-
-    /**
-     * pressAndHold: signal
-     * The user pressed the item with the mouse and didn't release it for a
-     * certain amount of time.
-     *
-     * This is disabled by default, set enabled to true to use it.
-     * @see enabled
-     */
-    signal pressAndHold
-
-    /**
-     * checked: bool
-     * If true makes the list item look as checked or pressed. It has to be set
-     * from the code, it won't change by itself.
-     */
-    property bool checked: false
-
-    /**
-     * pressed: bool
-     * True when the user is pressing the mouse over the list item and
-     * supportsMouseEvents is set to true
-     */
-    property alias pressed: itemMouse.pressed
+    property bool supportsMouseEvents: hoverEnabled
 
     /**
      * containsMouse: bool
      * True when the user hover the mouse over the list item
      * NOTE: on mobile touch devices this will be true only when pressed is also true
+     * TODO: remove?
      */
-    property alias containsMouse: itemMouse.containsMouse
+    property alias containsMouse: listItem.hovered
 
     /**
      * sectionDelegate: bool
@@ -106,17 +63,6 @@
     property bool separatorVisible: true
 
     /**
-     * background: Item
-     * This property holds the background item.
-     *
-     * Note: If the background item has no explicit size specified,
-     * it automatically follows the control's size.
-     * In most cases, there is no need to specify width or
-     * height for a background item.
-     */
-    property Item background
-
-    /**
      * textColor: color
      * Color for the text in the item
      * It is advised to leave the default value (Theme.viewTextColor)
@@ -150,54 +96,25 @@
      */
     property color activeBackgroundColor: Theme.highlightColor
 
-    implicitWidth: contentItem ? contentItem.childrenRect.width : 0
+    default property alias _default: listItem.contentItem
+
+    leftPadding: Units.smallSpacing * 2
+    topPadding: Units.smallSpacing * 2
+    rightPadding: Units.smallSpacing * 2
+    bottomPadding: Units.smallSpacing * 2
+
+    implicitWidth: contentItem ? contentItem.implicitWidth : Units.gridUnit * 12
 
-    implicitHeight: contentItem.height + Units.smallSpacing * 5
+    implicitHeight: contentItem.implicitHeight + Units.smallSpacing * 5
 
     width: parent ? parent.width : implicitWidth
     Layout.fillWidth: true
 
     opacity: enabled ? 1 : 0.6
 
     height: visible ? implicitHeight : 0
 
-    onContentItemChanged: {
-        contentItem.parent = paddingItem;
-    }
-
-    Component.onCompleted: {
-        itemMouse.integrateBackground()
-    }
-
-    MouseArea {
-        id: itemMouse
-        anchors.fill: parent
-        enabled: true
-        hoverEnabled: !Settings.isMobile
-
-        onClicked: listItem.clicked()
-        onPressAndHold: listItem.pressAndHold()
-
-        Item {
-            id: paddingItem
-            z: 2
-            anchors {
-                fill: parent
-                margins: Units.smallSpacing
-            }
-        }
-
-        function integrateBackground() {
-            if (background) {
-                background.parent = itemMouse;
-                background.anchors.fill = itemMouse;
-            }
-        }
-    }
-
-    onBackgroundChanged: {
-        itemMouse.integrateBackground()
-    }
+    hoverEnabled:true
 
     Accessible.role: Accessible.ListItem
 }
diff --git a/src/controls/templates/ApplicationHeader.qml b/src/controls/templates/ApplicationHeader.qml
--- a/src/controls/templates/ApplicationHeader.qml
+++ b/src/controls/templates/ApplicationHeader.qml
@@ -21,7 +21,7 @@
 import QtQuick.Layouts 1.2
 import QtQuick.Controls.Private 1.0
 import "private"
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 
 /**
@@ -80,7 +80,7 @@
         clip: true
         anchors {
             fill: parent
-            leftMargin: Math.max ((backButton ? backButton.width : (titleList.isTabBar ? 0 : Units.smallSpacing*2)), __appWindow.contentItem.x)
+            leftMargin: (backButton ? backButton.width : (titleList.isTabBar ? 0 : Units.smallSpacing*2))
         }
         cacheBuffer: width ? Math.max(0, width * count) : 0
         displayMarginBeginning: __appWindow.pageStack.width * count
@@ -118,8 +118,8 @@
         onContentWidthChanged: gotoIndex(currentIndex);
 
         onContentXChanged: {
-            if (__appWindow.wideScreen && !__appWindow.pageStack.contentItem.moving) {
-                //__appWindow.pageStack.contentItem.contentX = titleList.contentX
+            if (__appWindow.wideScreen && !__appWindow.pageStack.contentItem.moving && titleList.moving) {
+                __appWindow.pageStack.contentItem.contentX = titleList.contentX
             }
         }
         onHeightChanged: {
@@ -152,7 +152,7 @@
                 //more columns shown?
                 if (__appWindow.wideScreen && page) {
                     if (modelData == 0 && titleList.backButton) {
-                        return page.width - Math.max(0, titleList.backButton.width - __appWindow.contentItem.x);
+                        return page.width - titleList.backButton.width;
                     } else {
                         return page.width;
                     }
diff --git a/src/controls/templates/OverlayDrawer.qml b/src/controls/templates/OverlayDrawer.qml
--- a/src/controls/templates/OverlayDrawer.qml
+++ b/src/controls/templates/OverlayDrawer.qml
@@ -18,7 +18,8 @@
  */
 
 import QtQuick 2.1
-import org.kde.kirigami 1.0
+import QtQuick.Templates 2.0 as T2
+import org.kde.kirigami 2.0
 import "private"
 
 /**
@@ -29,58 +30,37 @@
  * This is used for the distinct task of navigating to another page.
  *
  */
-AbstractDrawer {
+T2.Drawer {
     id: root
 
-    z: modal ? (opened ? 100 : 99 ): 98
+    z: modal ? (drawerOpen ? 100 : 99 ): 0
 
 //BEGIN Properties
     /**
-     * page: Item
-     * It's the default property. it's the main content of the drawer page,
-     * the part that is always shown
+     * drawerOpen: bool
+     * true when the drawer is open and visible
      */
-    default property alias page: mainPage.data
+    property bool drawerOpen: false
 
     /**
-     * contentItem: Item
-     * It's the part that can be pulled in and out, will act as a sidebar.
+     * enabled: bool
+     * This property holds whether the item receives mouse and keyboard events. By default this is true.
      */
-    property Item contentItem
+    property bool enabled: true
 
     /**
-     * background: Item
-     * This property holds the background item.
-     * Note: the background will be automatically sized as the whole control
+     * peeking: true
+     * When true the drawer is in a state between open and closed. the drawer is visible but not completely open.
+     * This is usually the case when the user is dragging the drawer from a screen 
+     * edge, so the user is "peeking" what's in the drawer
      */
-    property Item background
+    property bool peeking: false
 
     /**
-     * opened: bool
-     * If true the drawer is open showing the contents of the "drawer"
-     * component.
+     * animating: Bool
+     * True during an animation of a drawer either opening or closing
      */
-    property alias opened: mainFlickable.open
-
-    /**
-     * edge: enumeration
-     * This property holds the edge of the content item at which the drawer
-     * will open from.
-     * The acceptable values are:
-     * Qt.TopEdge: The top edge of the content item.
-     * Qt.LeftEdge: The left edge of the content item (default).
-     * Qt.RightEdge: The right edge of the content item.
-     * Qt.BottomEdge: The bottom edge of the content item.
-     */
-    property int edge: Qt.LeftEdge
-
-    /**
-     * position: real
-     * This property holds the position of the drawer relative to its
-     * final destination. That is, the position will be 0 when the
-     * drawer is fully closed, and 1 when fully open.
-     */
-    property real position: 0
+    readonly property bool animating : enterAnimation.animating || exitAnimation.animating || positionResetAnim.running
 
     /**
      * handleVisible: bool
@@ -90,405 +70,200 @@
     property bool handleVisible: typeof(applicationWindow)===typeof(Function) && applicationWindow() ? applicationWindow().controlsVisible : true
 
     /**
-     * leftPadding: int
-     * default contents padding at left
-     */
-    property int leftPadding: Units.smallSpacing
-
-    /**
-     * topPadding: int
-     * default contents padding at top
-     */
-    property int topPadding: Units.smallSpacing
-
-    /**
-     * rightPadding: int
-     * default contents padding at right
-     */
-    property int rightPadding: Units.smallSpacing
-
-    /**
-     * bottomPadding: int
-     * default contents padding at bottom
-     */
-    property int bottomPadding: Units.smallSpacing
-
-    /**
-     * modal: bool
-     * If true the drawer will be an overlay of the main content,
-     * obscuring it and blocking input.
-     * If false, the drawer will look like a sidebar, with the main content
-     * application still usable.
-     * It is recomended to use modal on mobile devices and not modal on desktop
-     * devices.
-     * Default is true
-     */
-    //property bool modal: true
-//END Properties
-
-
-//BEGIN Methods
-    /**
-     * open: function
-     * This method opens the drawer, animating the movement if a
-     * valid animation has been set.
-     */
-    function open () {
-        mainAnim.to = 0;
-        switch (root.edge) {
-        case Qt.RightEdge:
-            mainAnim.to = drawerPage.width;
-            break;
-        case Qt.BottomEdge:
-            mainAnim.to = drawerPage.height;
-            break;
-        case Qt.LeftEdge:
-        case Qt.TopEdge:
-        default:
-            mainAnim.to = 0;
-            break;
-        }
-        mainAnim.running = true;
-        mainFlickable.open = true;
-    }
-
-    /**
-     * close: function
-     * This method closes the drawer, animating the movement if a
-     * valid animation has been set.
-     */
-    function close () {
-        switch (root.edge) {
-        case Qt.RightEdge:
-        case Qt.BottomEdge:
-            mainAnim.to = 0;
-            break;
-        case Qt.LeftEdge:
-            mainAnim.to = drawerPage.width;
-            break;
-        case Qt.TopEdge:
-            mainAnim.to = drawerPage.height;
-            break;
-        }
-        mainAnim.running = true;
-        mainFlickable.open = false;
-    }
-
-    /**
-     * clicked: signal
-     * This signal is emitted when the drawer is clicked.
-     */
-//END Methods
-
-//BEGIN Signal handlers
-    onBackgroundChanged: {
-        background.z = 1;
-        background.parent = mainItem;
-        background.anchors.fill = drawerPage;
-    }
-
-    onPositionChanged: {
-        if (!mainFlickable.loopCheck) {
-            mainFlickable.loopCheck = true;
-            if (!mainFlickable.flicking && !mainFlickable.dragging && !mainAnim.running) {
-                switch (root.edge) {
-                case Qt.RightEdge:
-                    mainFlickable.contentX = drawerPage.width * position;
-                    break;
-                case Qt.LeftEdge:
-                    mainFlickable.contentX = drawerPage.width * (1-position);
-                    break;
-                case Qt.BottomEdge:
-                    mainFlickable.contentY = drawerPage.height * position;
-                    break;
-                }
-            }
-            mainFlickable.loopCheck = false;
-        }
-    }
-    onContentItemChanged: {
-        contentItem.parent = drawerPage
-        contentItem.anchors.fill = drawerPage
-        if (contentItem.flickableItem !== undefined) {
-            contentItem.anchors.topMargin = 0;
-            contentItem.anchors.leftMargin = 0;
-            contentItem.anchors.bottomMargin = 0;
-            contentItem.anchors.rightMargin = 0;
-        } else {
-            contentItem.anchors.topMargin = root.topPadding;
-            contentItem.anchors.leftMargin = root.leftPadding;
-            contentItem.anchors.bottomMargin = root.bottomPadding;
-            contentItem.anchors.rightMargin = root.rightPadding;
-        }
-    }
-//END Signal handlers
-
-    Item {
-        id: mainPage
-        anchors.fill: parent
-        onChildrenChanged: mainPage.children[0].anchors.fill = mainPage
-    }
-
-    Rectangle {
-        anchors.fill: parent
-        color: "black"
-        opacity: 0.6 * mainFlickable.internalPosition
-        visible: root.modal
-    }
-
-
-    //NOTE: it's a PropertyAnimation instead of a NumberAnimation because
-    //NumberAnimation doesn't have NOTIFY signal on to property
-    PropertyAnimation {
-        id: mainAnim
-        target: mainFlickable
-        properties: (root.edge == Qt.RightEdge || root.edge == Qt.LeftEdge) ? "contentX" : "contentY"
-        duration: Units.longDuration
-        easing.type: mainAnim.to > 0 ? Easing.InQuad : Easing.OutQuad
-    }
-
-    MouseArea {
-        id: edgeMouse
-        anchors {
-            right: root.edge == Qt.LeftEdge ? undefined : parent.right
-            left: root.edge == Qt.RightEdge ? undefined : parent.left
-            top: root.edge == Qt.BottomEdge ? undefined : parent.top
-            bottom: root.edge == Qt.TopEdge ? undefined : parent.bottom
-        }
-        z: 99
-        width: Units.smallSpacing * 3
-        height: Units.smallSpacing * 3
-        property int startMouseX
-        property real oldMouseX
-        property int startMouseY
-        property real oldMouseY
-        property bool startDragging: false
-
-        function managePress(mouse) {
-            if (drawerPage.children.length == 0) {
-                mouse.accepted = false;
-                return;
-            }
-
-            speedSampler.restart();
-            mouse.accepted = true;
-            oldMouseX = startMouseX = mouse.x;
-            oldMouseY = startMouseY = mouse.y;
-            startDragging = false;
-        }
+     * handle: Item
+     * Readonly property that points to the item that will act as a physical
+     * handle for the Drawer
+     **/
+    readonly property Item handle: MouseArea {
+        id: drawerHandle
+        z: 2000000
+        preventStealing: true
+        parent: applicationWindow().overlay.parent
+
+        property int startX
+        property int mappedStartX
         onPressed: {
-            managePress(mouse)
+            root.peeking = true;
+            startX = mouse.x;
+            mappedStartX = mapToItem(parent, startX, 0).x
         }
-
         onPositionChanged: {
-            if (!root.contentItem) {
-                mouse.accepted = false;
-                return;
+            var pos = mapToItem(parent, mouse.x - startX, mouse.y);
+            switch(root.edge) {
+            case Qt.LeftEdge:
+                root.position = pos.x/root.contentItem.width;
+                break;
+            case Qt.RightEdge:
+                root.position = (root.parent.width - pos.x - width)/root.contentItem.width;
+                break;
+            default:
             }
-
-            if (Math.abs(mouse.x - startMouseX) > root.width / 5 ||
-                Math.abs(mouse.y - startMouseY) > root.height / 5) {
-                startDragging = true;
-            }
-            if (startDragging) {
-                switch (root.edge) {
-                case Qt.RightEdge:
-                    mainFlickable.contentX = Math.min(mainItem.width - root.width, mainFlickable.contentX + oldMouseX - mouse.x);
-                    break;
-                case Qt.LeftEdge:
-                    mainFlickable.contentX = Math.max(0, mainFlickable.contentX + oldMouseX - mouse.x);
-                    break;
-                case Qt.BottomEdge:
-                    mainFlickable.contentY = Math.min(mainItem.height - root.height, mainFlickable.contentY + oldMouseY - mouse.y);
-                    break;
-                case Qt.TopEdge:
-                    mainFlickable.contentY = Math.max(0, mainFlickable.contentY + oldMouseY - mouse.y);
-                    break;
-                }
-            }
-            oldMouseX = mouse.x;
-            oldMouseY = mouse.y;
         }
         onReleased: {
-            if (!startDragging) {
-                return;
+            root.peeking = false;
+            
+            if (Math.abs(mapToItem(parent, mouse.x, 0).x - mappedStartX) < Qt.styleHints.startDragDistance) {
+                root.drawerOpen = !root.drawerOpen;
             }
-            speedSampler.running = false;
-            if (speedSampler.speed != 0) {
-                if (root.edge == Qt.RightEdge || root.edge == Qt.LeftEdge) {
-                    mainFlickable.flick(speedSampler.speed, 0);
-                } else {
-                    mainFlickable.flick(0, speedSampler.speed);
-                }
-            } else {
-                if (mainFlickable.internalPosition > 0.5) {
-                    root.open();
-                } else {
-                    root.close();
-                }
+        }
+        onCanceled: {
+            root.peeking = false
+        }
+        x: {
+            switch(root.edge) {
+            case Qt.LeftEdge:
+                return root.background.width * root.position;
+            case Qt.RightEdge:
+                return drawerHandle.parent.width - (root.background.width * root.position) - width;
+            default:
+                return 0;
             }
         }
-    }
 
-    MouseArea {
-        id: handleMouseArea
-        z:999
-        anchors {
-            right: root.edge == Qt.LeftEdge ? undefined : parent.right
-            left: root.edge == Qt.RightEdge ? undefined : parent.left
-            bottom: parent.bottom
-            leftMargin: root.opened ? drawerPage.width : 0
-            rightMargin: root.opened ? drawerPage.width : 0
-        }
-        visible: root.handleVisible && (root.edge == Qt.LeftEdge || root.edge == Qt.RightEdge)
-        width: Units.iconSizes.medium
+        anchors.bottom: parent.bottom
+        visible: root.enabled && (root.edge == Qt.LeftEdge || root.edge == Qt.RightEdge)
+        width: Units.iconSizes.medium + Units.smallSpacing * 2
         height: width
-        onPressed: edgeMouse.managePress(mouse);
-        onPositionChanged: edgeMouse.positionChanged(mouse);
-        onReleased: edgeMouse.released(mouse);
-        onClicked: root.opened ? root.close() : root.open();
-    }
-
-    Timer {
-        id: speedSampler
-        interval: 100
-        repeat: true
-        property real speed
-        property real oldContentX
-        property real oldContentY
-        onTriggered: {
-            if (root.edge == Qt.RightEdge || root.edge == Qt.LeftEdge) {
-                speed = (mainFlickable.contentX - oldContentX) * 10;
-                oldContentX = mainFlickable.contentX;
-            } else {
-                speed = (mainFlickable.contentY - oldContentY) * 10;
-                oldContentY = mainFlickable.contentY;
+        opacity: root.handleVisible ? 1 : 0
+        Behavior on opacity {
+            NumberAnimation {
+                duration: Units.longDuration
+                easing.type: Easing.InOutQuad
             }
         }
-        onRunningChanged: {
-            if (running) {
-                speed = 0;
-                oldContentX = mainFlickable.contentX;
-                oldContentY = mainFlickable.contentY;
-            } else {
-                if (root.edge == Qt.RightEdge || root.edge == Qt.LeftEdge) {
-                    speed = (oldContentX - mainFlickable.contentX) * 10;
-                } else {
-                    speed = (oldContentY - mainFlickable.contentY) * 10;
+        transform: Translate {
+            id: translateTransform
+            x: root.handleVisible ? 0 : (root.edge == Qt.LeftEdge ? -drawerHandle.width : drawerHandle.width)
+            Behavior on x {
+                NumberAnimation {
+                    duration: Units.longDuration
+                    easing.type: !root.handleVisible ? Easing.OutQuad : Easing.InQuad
                 }
             }
         }
     }
 
-    MouseArea {
-        id: mainMouseArea
-        anchors.fill: parent
-        drag.filterChildren: true
-        onClicked: {
-            if ((root.edge == Qt.LeftEdge && mouse.x < drawerPage.width) ||
-                (root.edge == Qt.RightEdge && mouse.x > drawerPage.x - mainFlickable.contentX) ||
-                (root.edge == Qt.TopEdge && mouse.y < drawerPage.height) ||
-                (root.edge == Qt.BottomEdge && mouse.y > drawerPage.y - mainFlickable.contentY)) {
-                return;
-            }
-            root.clicked();
-            root.close();
-        }
-        enabled: (root.edge == Qt.LeftEdge && !mainFlickable.atXEnd) ||
-                 (root.edge == Qt.RightEdge && !mainFlickable.atXBeginning) ||
-                 (root.edge == Qt.TopEdge && !mainFlickable.atYEnd) ||
-                 (root.edge == Qt.BottomEdge && !mainFlickable.atYBeginning) ||
-                 mainFlickable.moving
+//END Properties
 
-        Flickable {
-            id: mainFlickable
-            property bool open
-            anchors.fill: parent
-            interactive: root.modal
-            onOpenChanged: {
-                if (open) {
-                    root.open();
-                    Qt.inputMethod.hide();
-                } else {
-                    root.close();
-                }
+
+//BEGIN reassign properties
+    //default paddings
+    leftPadding: Units.smallSpacing
+    topPadding: Units.smallSpacing
+    rightPadding: Units.smallSpacing
+    bottomPadding: Units.smallSpacing
+
+    parent: modal ? T2.ApplicationWindow.overlay : T2.ApplicationWindow.contentItem
+    height: edge == Qt.LeftEdge || edge == Qt.RightEdge ? applicationWindow().height : Math.min(contentItem.implicitHeight, Math.round(applicationWindow().height*0.8))
+    width:  edge == Qt.TopEdge || edge == Qt.BottomEdge ? applicationWindow().width : Math.min(contentItem.implicitWidth, Math.round(applicationWindow().width*0.8))
+    edge: Qt.LeftEdge
+    modal: true
+
+    dragMargin: enabled && (edge == Qt.LeftEdge || edge == Qt.RightEdge) ? Qt.styleHints.startDragDistance : 0
+    
+    implicitWidth: Math.max(background ? background.implicitWidth : 0, contentWidth + leftPadding + rightPadding)
+    implicitHeight: Math.max(background ? background.implicitHeight : 0, contentHeight + topPadding + bottomPadding)
+
+    contentWidth: contentItem.implicitWidth || (contentChildren.length === 1 ? contentChildren[0].implicitWidth : 0)
+    contentHeight: contentItem.implicitHeight || (contentChildren.length === 1 ? contentChildren[0].implicitHeight : 0)
+
+    enter: Transition {
+        SequentialAnimation {
+            id: enterAnimation
+            /*NOTE: why this? the running status of the enter transition is not relaible and
+             * the SmoothedAnimation is always marked as non running,
+             * so the only way to get to a reliable animating status is with this
+             */
+            property bool animating
+            ScriptAction {
+                script: enterAnimation.animating = true
             }
-            enabled: parent.enabled
-            flickableDirection: root.edge == Qt.LeftEdge || root.edge == Qt.RightEdge ? Flickable.HorizontalFlick : Flickable.VerticalFlick
-            contentWidth: mainItem.width
-            contentHeight: mainItem.height
-            boundsBehavior: Flickable.StopAtBounds
-            readonly property real internalPosition: {
-                switch (root.edge) {
-                case Qt.RightEdge:
-                    return mainFlickable.contentX/drawerPage.width;
-                case Qt.LeftEdge:
-                    return 1 - (mainFlickable.contentX/drawerPage.width);
-                case Qt.BottomEdge:
-                    return mainFlickable.contentY/drawerPage.height;
-                case Qt.TopEdge:
-                    return 1 - (mainFlickable.contentY/drawerPage.height);
-                }
+            SmoothedAnimation {
+                velocity: 5
             }
-            property bool loopCheck: false
-            onInternalPositionChanged: {
-                if (!loopCheck) {
-                    loopCheck = true;
-                    root.position = internalPosition;
-                    loopCheck = false;
-                }
+            ScriptAction {
+                script: enterAnimation.animating = false
             }
+        }
+    }
 
-            onFlickingChanged: {
-                if (!flicking) {
-                    if (internalPosition > 0.5) {
-                        root.open();
-                    } else {
-                        root.close();
-                    }
-                }
+    exit: Transition {
+        SequentialAnimation {
+            id: exitAnimation
+            property bool animating
+            ScriptAction {
+                script: exitAnimation.animating = true
             }
-            onMovingChanged: {
-                if (!moving) {
-                    flickingChanged();
-                }
+            SmoothedAnimation {
+                velocity: 5 
             }
-
-            Item {
-                id: mainItem
-                width: root.width + ((root.edge == Qt.RightEdge || root.edge == Qt.LeftEdge) ? drawerPage.width : 0)
-                height: root.height + ((root.edge == Qt.TopEdge || root.edge == Qt.BottomEdge) ? drawerPage.height : 0)
-                onWidthChanged: {
-                    if (root.edge == Qt.LeftEdge) {
-                        if (root.opened) {
-                            mainFlickable.contentX = 0;
-                        } else {
-                            mainFlickable.contentX = drawerPage.width;
-                        }
-                    }
-                }
-                onHeightChanged: {
-                    if (root.edge == Qt.TopEdge) {
-                        mainFlickable.contentY = drawerPage.Height;
-                    }
-                }
+            ScriptAction {
+                script: exitAnimation.animating = false
+            }
+        }
+    }
+//END reassign properties
 
 
-                Item {
-                    id: drawerPage
-                    z: 3
-                    anchors {
-                        left: root.edge != Qt.RightEdge ? parent.left : undefined
-                        right: root.edge != Qt.LeftEdge ? parent.right : undefined
-                        top: root.edge != Qt.BottomEdge ? parent.top : undefined
-                        bottom: root.edge != Qt.TopEdge ? parent.bottom : undefined
-                    }
+//BEGIN signal handlers
+    onPositionChanged: {
+        if (peeking) {
+            visible = true
+        }
+    }
+    onVisibleChanged: {
+        if (peeking) {
+            visible = true
+        } else {
+            drawerOpen = visible;
+        }
+    }
+    onPeekingChanged:  {
+        if (peeking) {
+            root.enter.enabled = false;
+            root.exit.enabled = false;
+        } else {
+            positionResetAnim.to = position > 0.5 ? 1 : 0;
+            positionResetAnim.running = true
+            root.enter.enabled = true;
+            root.exit.enabled = true;
+        }
+    }
+    onDrawerOpenChanged: {
+        //sync this property only when the component is properly loaded
+        if (!__internal.completed) {
+            return;
+        }
+        positionResetAnim.running = false;
+        if (drawerOpen) {
+            open();
+        } else {
+            close();
+        }
+    }
 
-                    clip: true
-                    width: root.contentItem ? Math.min(root.contentItem.implicitWidth, root.width * 0.7) : 0
-                    height: root.contentItem ? Math.min(root.contentItem.implicitHeight, root.height * 0.7) : 0
-                }
-            }
+    Component.onCompleted: {
+        //if defined as drawerOpen by default in QML, don't animate
+        if (root.drawerOpen) {
+            root.enter.enabled = false;
+            root.visible = true;
+            root.position = 1;
+            root.enter.enabled = true;
+        }
+        __internal.completed = true;
+    }
+//END signal handlers
+
+    //this is as hidden as it can get here
+    property QtObject __internal: QtObject {
+        //here in order to not be accessible from outside
+        property bool completed: false
+        property NumberAnimation positionResetAnim: NumberAnimation {
+            id: positionResetAnim
+            target: root
+            to: 0
+            property: "position"
+            duration: (root.position)*Units.longDuration
         }
     }
 }
diff --git a/src/controls/templates/OverlaySheet.qml b/src/controls/templates/OverlaySheet.qml
--- a/src/controls/templates/OverlaySheet.qml
+++ b/src/controls/templates/OverlaySheet.qml
@@ -18,9 +18,9 @@
 */
 
 import QtQuick 2.5
-import QtQuick.Controls 1.3 as Controls
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 import QtGraphicalEffects 1.0
+import QtQuick.Templates 2.0 as T2
 import "private"
 
 /**
@@ -31,14 +31,9 @@
  * logically done as a new separate Page, even if potentially
  * are taller than the screen space.
  */
-Item {
+QtObject {
     id: root
 
-    z: 999
-
-    anchors.fill: parent
-    visible: false
-
     /**
      * contentItem: Item
      * This property holds the visual content item.
@@ -49,11 +44,11 @@
     default property Item contentItem
 
     /**
-     * opened: bool
+     * sheetOpen: bool
      * If true the sheet is open showing the contents of the OverlaySheet
      * component.
      */
-    property bool opened
+    property bool sheetOpen
 
     /**
      * leftPadding: int
@@ -90,13 +85,15 @@
      */
     property Item background
 
+    property Item parent
+
 
     function open() {
-        root.visible = true;
-        openAnimation.from = -root.height;
+        mainItem.visible = true;
+        openAnimation.from = -mainItem.height;
         openAnimation.to = openAnimation.topOpenPosition;
         openAnimation.running = true;
-        root.opened = true;
+        root.sheetOpen = true;
     }
 
     function close() {
@@ -108,18 +105,7 @@
         closeAnimation.running = true;
     }
 
-    Rectangle {
-        anchors.fill: parent
-        color: Theme.textColor
-        opacity: 0.6 * Math.min(
-            (Math.min(scrollView.flickableItem.contentY + scrollView.flickableItem.height, scrollView.flickableItem.height) / scrollView.flickableItem.height),
-            (2 + (scrollView.flickableItem.contentHeight - scrollView.flickableItem.contentY - scrollView.flickableItem.topMargin - scrollView.flickableItem.bottomMargin)/scrollView.flickableItem.height))
-    }
-
-
-    Component.onCompleted: {
-        scrollView.flickableItem.interactive = true;
-    }
+    
     onBackgroundChanged: {
         background.parent = flickableContents;
         background.z = -1;
@@ -137,122 +123,140 @@
         }
         scrollView.flickableItem.flickableDirection = Flickable.VerticalFlick;
     }
-    onOpenedChanged: {
-        if (opened) {
+    onSheetOpenChanged: {
+        if (sheetOpen) {
             open();
         } else {
             close();
             Qt.inputMethod.hide();
         }
     }
-    onWidthChanged: {
-        if (!contentItem.contentItem)
-            return
 
-        var width = Math.max(root.width/2, Math.min(root.width, root.contentItem.implicitWidth));
-        contentItem.contentItem.x = (root.width - width)/2
-        contentItem.contentItem.width = width;
+    Component.onCompleted: {
+        scrollView.flickableItem.interactive = true;
+        if (!root.parent) {
+            root.parent = applicationWindow().overlay
+        }
     }
-    onHeightChanged: {
-        var focusItem;
 
-        if (typeof applicationWindow !== "undefined") {
-            focusItem = applicationWindow().activeFocusItem;
-        //fallback: hope activeFocusItem is in context
-        } else {
-            focusItem = activeFocusItem;
+    readonly property Item rootItem: MouseArea {
+        id: mainItem
+        //we want to be over any possible OverlayDrawers, including handles
+        parent: root.parent == applicationWindow().overlay ? root.parent.parent : root.parent
+        anchors.fill: parent
+        z: 2000000
+        visible: false
+        drag.filterChildren: true
+        hoverEnabled: true
+
+        onClicked: {
+            var pos = mapToItem(flickableContents, mouse.x, mouse.y);
+            if (!flickableContents.contains(pos)) {
+                root.close();
+            }
         }
 
-        if (!activeFocusItem) {
-            return;
+        onWidthChanged: {
+            if (!contentItem.contentItem)
+                return
+
+            var width = Math.max(mainItem.width/2, Math.min(mainItem.width, root.contentItem.implicitWidth));
+            contentItem.contentItem.x = (mainItem.width - width)/2
+            contentItem.contentItem.width = width;
         }
+        onHeightChanged: {
+            var focusItem;
 
-        //NOTE: there is no function to know if an item is descended from another,
-        //so we have to walk the parent hyerarchy by hand
-        var isDescendent = false;
-        var candidate = focusItem.parent;
-        while (candidate) {
-            if (candidate == root) {
-                isDescendent = true;
-                break;
+            if (typeof applicationWindow !== "undefined") {
+                focusItem = applicationWindow().activeFocusItem;
+            //fallback: hope activeFocusItem is in context
+            } else {
+                focusItem = activeFocusItem;
             }
-            candidate = candidate.parent;
-        }
-        if (!isDescendent) {
-            return;
-        }
 
-        var cursorY = 0;
-        if (focusItem.cursorPosition !== undefined) {
-            cursorY = focusItem.positionToRectangle(focusItem.cursorPosition).y;
-        }
+            if (!activeFocusItem) {
+                return;
+            }
 
-        
-        var pos = focusItem.mapToItem(flickableContents, 0, cursorY - Units.gridUnit*3);
-        //focused item alreqady visible? add some margin for the space of the action buttons
-        if (pos.y >= scrollView.flickableItem.contentY && pos.y <= scrollView.flickableItem.contentY + scrollView.flickableItem.height - Units.gridUnit * 8) {
-            return;
-        }
-        scrollView.flickableItem.contentY = pos.y;
-    }
+            //NOTE: there is no function to know if an item is descended from another,
+            //so we have to walk the parent hyerarchy by hand
+            var isDescendent = false;
+            var candidate = focusItem.parent;
+            while (candidate) {
+                if (candidate == root) {
+                    isDescendent = true;
+                    break;
+                }
+                candidate = candidate.parent;
+            }
+            if (!isDescendent) {
+                return;
+            }
 
+            var cursorY = 0;
+            if (focusItem.cursorPosition !== undefined) {
+                cursorY = focusItem.positionToRectangle(focusItem.cursorPosition).y;
+            }
 
-    NumberAnimation {
-        id: openAnimation
-        property int topOpenPosition: Math.min(-root.height*0.15, scrollView.flickableItem.contentHeight - root.height + Units.gridUnit * 5)
-        property int bottomOpenPosition: (scrollView.flickableItem.contentHeight - root.height) + (Units.gridUnit * 5)
-        target: scrollView.flickableItem
-        properties: "contentY"
-        from: -root.height
-        to: topOpenPosition
-        duration: Units.longDuration
-        easing.type: Easing.OutQuad
-        onRunningChanged: {
-            if (!running && contentItem.contentItem) {
-                var width = Math.max(root.width/2, Math.min(root.width, root.contentItem.implicitWidth));
-                contentItem.contentItem.x = (root.width - width)/2
-                contentItem.contentItem.width = width;
+            
+            var pos = focusItem.mapToItem(flickableContents, 0, cursorY - Units.gridUnit*3);
+            //focused item alreqady visible? add some margin for the space of the action buttons
+            if (pos.y >= scrollView.flickableItem.contentY && pos.y <= scrollView.flickableItem.contentY + scrollView.flickableItem.height - Units.gridUnit * 8) {
+                return;
             }
+            scrollView.flickableItem.contentY = pos.y;
         }
-    }
 
-    SequentialAnimation {
-        id: closeAnimation
-        property int to: -root.height
         NumberAnimation {
+            id: openAnimation
+            property int topOpenPosition: Math.min(-mainItem.height*0.15, scrollView.flickableItem.contentHeight - mainItem.height + Units.gridUnit * 5)
+            property int bottomOpenPosition: (scrollView.flickableItem.contentHeight - mainItem.height) + (Units.gridUnit * 5)
             target: scrollView.flickableItem
             properties: "contentY"
-            to: closeAnimation.to
+            from: -mainItem.height
+            to: topOpenPosition
             duration: Units.longDuration
-            easing.type: Easing.InQuad
-        }
-        ScriptAction {
-            script: {
-                scrollView.flickableItem.contentY = -root.height;
-                root.visible = root.opened = false;
+            easing.type: Easing.OutQuad
+            onRunningChanged: {
+                if (!running && contentItem.contentItem) {
+                    var width = Math.max(mainItem.width/2, Math.min(mainItem.width, root.contentItem.implicitWidth));
+                    contentItem.contentItem.x = (mainItem.width - width)/2
+                    contentItem.contentItem.width = width;
+                }
             }
         }
-    }
 
-    MouseArea {
-        anchors.fill: parent
-        z: 2
-        drag.filterChildren: true
-        hoverEnabled: true
-
-        onClicked: {
-            var pos = mapToItem(flickableContents, mouse.x, mouse.y);
-            if (!flickableContents.contains(pos)) {
-                root.close();
+        SequentialAnimation {
+            id: closeAnimation
+            property int to: -mainItem.height
+            NumberAnimation {
+                target: scrollView.flickableItem
+                properties: "contentY"
+                to: closeAnimation.to
+                duration: Units.longDuration
+                easing.type: Easing.InQuad
+            }
+            ScriptAction {
+                script: {
+                    scrollView.flickableItem.contentY = -mainItem.height;
+                    mainItem.visible = root.sheetOpen = false;
+                }
             }
         }
+        Rectangle {
+            anchors.fill: parent
+            color: Theme.textColor
+            opacity: 0.6 * Math.min(
+                (Math.min(scrollView.flickableItem.contentY + scrollView.flickableItem.height, scrollView.flickableItem.height) / scrollView.flickableItem.height),
+                (2 + (scrollView.flickableItem.contentHeight - scrollView.flickableItem.contentY - scrollView.flickableItem.topMargin - scrollView.flickableItem.bottomMargin)/scrollView.flickableItem.height))
+        }
 
         Item {
             id: flickableContents
             //anchors.horizontalCenter: parent.horizontalCenter
-            x: (root.width - width) / 2
+            x: (mainItem.width - width) / 2
             y: scrollView.flickableItem && root.contentItem.hasOwnProperty("contentY") ? -scrollView.flickableItem.contentY : 0
-            width: root.contentItem.implicitWidth <= 0 ? root.width : Math.max(root.width/2, Math.min(root.width, root.contentItem.implicitWidth))
+            width: root.contentItem.implicitWidth <= 0 ? mainItem.width : Math.max(mainItem.width/2, Math.min(mainItem.width, root.contentItem.implicitWidth))
             height: scrollView.flickableItem && root.contentItem.hasOwnProperty("contentY") ? scrollView.flickableItem.contentHeight : (root.contentItem.height + topPadding + bottomPadding + Units.iconSizes.medium + Units.gridUnit)
             Item {
                 id: contentItemParent
@@ -282,19 +286,19 @@
             target: scrollView.flickableItem
             function movementEnded() {
                 //close
-                if ((root.height + scrollView.flickableItem.contentY) < root.height/2) {
-                    closeAnimation.to = -root.height;
+                if ((mainItem.height + scrollView.flickableItem.contentY) < mainItem.height/2) {
+                    closeAnimation.to = -mainItem.height;
                     closeAnimation.running = true;
-                } else if ((root.height*0.6 + scrollView.flickableItem.contentY) > scrollView.flickableItem.contentHeight) {
+                } else if ((mainItem.height*0.6 + scrollView.flickableItem.contentY) > scrollView.flickableItem.contentHeight) {
                     closeAnimation.to = scrollView.flickableItem.contentHeight
                     closeAnimation.running = true;
 
-                //reset to the default opened position
+                //reset to the default sheetOpen position
                 } else if (scrollView.flickableItem.contentY < openAnimation.topOpenPosition) {
                     openAnimation.from = scrollView.flickableItem.contentY;
                     openAnimation.to = openAnimation.topOpenPosition;
                     openAnimation.running = true;
-                //reset to the default "bottom" opened position
+                //reset to the default "bottom" sheetOpen position
                 } else if (scrollView.flickableItem.contentY > openAnimation.bottomOpenPosition) {
                     openAnimation.from = scrollView.flickableItem.contentY;
                     openAnimation.to = openAnimation.bottomOpenPosition;
@@ -310,7 +314,28 @@
                 }
             }
         }
-        Controls.ScrollView {
+
+        //add an extra background for the scrollbar
+        Rectangle {
+            z: -1
+            parent: scrollView.verticalScrollBar.background
+            anchors.fill:parent
+            color: Theme.viewBackgroundColor
+        }
+        Binding {
+            target: scrollView.verticalScrollBar
+            property: "visible"
+            value: scrollView.flickableItem.contentHeight > mainItem.height*0.8
+        }
+        Connections {
+            target: scrollView.verticalScrollBar
+            onActiveChanged: {
+                if (!scrollView.verticalScrollBar.active) {
+                    scrollView.flickableItem.movementEnded();
+                }
+            }
+        }
+        ScrollView {
             id: scrollView
             anchors.fill: parent
             horizontalScrollBarPolicy: Qt.ScrollBarAlwaysOff
diff --git a/src/controls/templates/SplitDrawer.qml b/src/controls/templates/SplitDrawer.qml
deleted file mode 100644
--- a/src/controls/templates/SplitDrawer.qml
+++ /dev/null
@@ -1,268 +0,0 @@
-/*
- *   Copyright 2012 Marco Martin <mart@kde.org>
- *
- *   This program is free software; you can redistribute it and/or modify
- *   it under the terms of the GNU Library General Public License as
- *   published by the Free Software Foundation; either version 2, or
- *   (at your option) any later version.
- *
- *   This program is distributed in the hope that it will be useful,
- *   but WITHOUT ANY WARRANTY; without even the implied warranty of
- *   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- *   GNU Library General Public License for more details
- *
- *   You should have received a copy of the GNU Library General Public
- *   License along with this program; if not, write to the
- *   Free Software Foundation, Inc.,
- *   51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
- */
-
-import QtQuick 2.1
-import org.kde.kirigami 1.0
-import "private"
-
-/**
- * Split Drawers are used to expose additional UI elements which are optional
- * and can be used in conjunction with the main UI elements.
- * For example the Resource Browser uses a Split Drawer to select
- * different kinds of filters for the main view.
- */
-AbstractDrawer {
-    id: root
-    z:0
-
-    visible: true
-
-    /**
-     * page: Item
-     * It's the default property. it's the main content of the drawer page,
-     * the part that is always shown
-     */
-    default property alias page: mainPage.data
-
-    /**
-     * contentItem: Item
-     * It's the part that can be pulled in and out, will act as a sidebar.
-     */
-    property Item contentItem
-
-    /**
-     * opened: bool
-     * If true the drawer is open showing the contents of the "drawer"
-     * component.
-     */
-    property alias opened: sidebar.open
-
-    /**
-     * position: real
-     * This property holds the position of the drawer relative to its
-     * final destination. That is, the position will be 0 when the
-     * drawer is fully closed, and 1 when fully open.
-     */
-    property real position: 0
-
-    /**
-     * modal: bool
-     * If true the drawer will be an overlay of the main content,
-     * obscuring it and blocking input.
-     * If false, the drawer will look like a sidebar, with the main content
-     * application still usable.
-     * It is recomended to use modal on mobile devices and not modal on desktop
-     * devices.
-     * Default is true
-     */
-    //property bool modal: true
-
-    /**
-     * background: Item
-     * This property holds the background item.
-     *
-     * Note: If the background item has no explicit size specified,
-     * it automatically follows the control's size.
-     * In most cases, there is no need to specify width or
-     * height for a background item.
-     */
-    property Item background
-
-    onBackgroundChanged: {
-        background.parent = browserFrame;
-        background.anchors.fill = browserFrame;
-        background.z = -1;
-    }
-
-    Component.onCompleted: {
-        mainPage.width = browserFrame.width
-        contentItem.parent = drawerPage
-    }
-
-    onPositionChanged: {
-        if (!browserFrame.loopCheck) {
-            browserFrame.loopCheck = true;
-            browserFrame.x = position * drawerPage.width;
-            browserFrame.loopCheck = false;
-        }
-    }
-    onContentItemChanged: contentItem.parent = drawerPage
-    MouseArea {
-        id: mouseEventListener
-        z: 200
-        drag.filterChildren: true
-        //drag.target: browserFrame
-        property int startMouseX
-        property int oldMouseX
-        property int startBrowserFrameX
-        property bool toggle: false
-        property string startState
-        enabled: root.modal
-
-        anchors.fill: parent
-
-        onPressed: {
-            if (drawerPage.children.length == 0 || (browserFrame.state == "Closed" && mouse.x > Units.gridUnit) ||
-                mouse.x < browserFrame.x) {
-                mouse.accepted = false;
-                return;
-            }
-
-            toggle = true;
-            startBrowserFrameX = browserFrame.x;
-            oldMouseX = startMouseX = mouse.x;
-            startState = browserFrame.state;
-            browserFrame.state = "Dragging";
-            browserFrame.x = startBrowserFrameX;
-        }
-
-        onPositionChanged: {
-            browserFrame.x = Math.max(0, browserFrame.x + mouse.x - oldMouseX);
-            oldMouseX = mouse.x;
-            if (Math.abs(mouse.x - startMouseX) > Units.gridUnit * 2) {
-                toggle = false;
-            }
-        }
-
-        onReleased: {
-            if (toggle) {
-                browserFrame.state = startState == "Open" ? "Closed" : "Open"
-            } else if (browserFrame.x < drawerPage.width / 2) {
-                browserFrame.state = "Closed";
-            } else {
-                browserFrame.state = "Open";
-            }
-        }
-        onClicked: root.clicked()
-    }
-
-    Item {
-        id: browserFrame
-        z: 100
-        state: sidebar.open ? "Open" : "Closed"
-        onStateChanged: sidebar.open = (state != "Closed")
-        readonly property real position: Math.abs(x) / drawerPage.width
-        property bool loopCheck: false
-        onPositionChanged: {
-            if (!loopCheck) {
-                loopCheck = true;
-                root.position = position;
-                loopCheck = false;
-            }
-        }
-
-        anchors {
-            top: parent.top
-            bottom: parent.bottom
-        }
-        width: root.width;
-
-        Item {
-            id: mainPage
-            onChildrenChanged: mainPage.children[0].anchors.fill = mainPage
-
-            anchors.fill: parent
-        }
-
-        Rectangle {
-            anchors.fill: parent
-            color: "black"
-            opacity: Math.min(0.4, 0.4 * (browserFrame.x / drawerPage.width))
-            visible: root.modal
-        }
-
-        states: [
-            State {
-                name: "Open"
-                PropertyChanges {
-                    target: browserFrame
-                    x: drawerPage.width
-                }
-
-            },
-            State {
-                name: "Dragging"
-                PropertyChanges {
-                    target: browserFrame
-                    x: mouseEventListener.startBrowserFrameX
-                }
-            },
-            State {
-                name: "Closed"
-                PropertyChanges {
-                    target: browserFrame
-                    x: 0
-                }
-            }
-        ]
-
-        transitions: [
-            Transition {
-                //Exclude Dragging
-                to: "Open,Closed,Hidden"
-                NumberAnimation {
-                    properties: "x"
-                    duration: Units.longDuration
-                    easing.type: Easing.InOutQuad
-                }
-            }
-        ]
-    }
-
-
-    Item {
-        id: sidebar
-
-        property bool open: false
-        onOpenChanged: {
-            if (drawerPage.children.length == 0) {
-                return;
-            }
-
-            if (open) {
-                browserFrame.state = "Open";
-            } else {
-                browserFrame.state = "Closed";
-            }
-        }
-
-        width: browserFrame.x
-        clip: true
-
-        anchors {
-            left: parent.left
-            top: parent.top
-            bottom: parent.bottom
-        }
-
-        Item {
-            id: drawerPage
-            width: Math.min(root.width/4*3, Math.max(root.contentItem ? root.contentItem.implicitWidth : 0, root.width/4))
-            anchors {
-                top: parent.top
-                bottom: parent.bottom
-                left: parent.left
-                topMargin: (applicationWindow !== undefined && applicationWindow().header) && modal ? applicationWindow().header.height : 0
-            }
-            clip: false
-            onChildrenChanged: drawerPage.children[0].anchors.fill = drawerPage
-        }
-    }
-}
-
diff --git a/src/controls/templates/SwipeListItem.qml b/src/controls/templates/SwipeListItem.qml
--- a/src/controls/templates/SwipeListItem.qml
+++ b/src/controls/templates/SwipeListItem.qml
@@ -17,12 +17,12 @@
  *   51 Franklin Street, Fifth Floor, Boston, MA  2.010-1301, USA.
  */
 
-import QtQuick 2.5
+import QtQuick 2.7
 import QtQuick.Layouts 1.2
-import QtQuick.Controls 1.0 as Controls
 import QtQuick.Controls.Private 1.0
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 import "../private"
+import QtQuick.Templates 2.0 as T2
 
 /**
  * An item delegate Intended to support extra actions obtainable
@@ -53,67 +53,24 @@
  *
  * @inherit QtQuick.Item
  */
-Item {
+T2.ItemDelegate {
     id: listItem
 
 //BEGIN properties
     /**
-     * contentItem: Item
-     * This property holds the visual content item.
-     *
-     * Note: The content item is automatically resized inside the
-     * padding of the control.
-     */
-     default property Item contentItem
-
-    /**
      * supportsMouseEvents: bool
      * Holds if the item emits signals related to mouse interaction.
      *TODO: remove
      * The default value is false.
      */
-    property alias supportsMouseEvents: itemMouse.enabled
-
-    /**
-     * clicked: signal
-     * This signal is emitted when there is a click.
-     *
-     * This is disabled by default, set enabled to true to use it.
-     * @see enabled
-     */
-    signal clicked
-
-
-    /**
-     * pressAndHold: signal
-     * The user pressed the item with the mouse and didn't release it for a
-     * certain amount of time.
-     *
-     * This is disabled by default, set enabled to true to use it.
-     * @see enabled
-     */
-    signal pressAndHold
-
-    /**
-     * checked: bool
-     * If true makes the list item look as checked or pressed. It has to be set
-     * from the code, it won't change by itself.
-     */
-    property bool checked: false
-
-    /**
-     * pressed: bool
-     * True when the user is pressing the mouse over the list item and
-     * supportsMouseEvents is set to true
-     */
-    property alias pressed: itemMouse.pressed
+    property alias supportsMouseEvents: listItem.hoverEnabled
 
     /**
      * containsMouse: bool
      * True when the user hover the mouse over the list item
      * NOTE: on mobile touch devices this will be true only when pressed is also true
      */
-    property alias containsMouse: itemMouse.containsMouse
+    property alias containsMouse: listItem.hovered
 
     /**
      * sectionDelegate: bool
@@ -137,26 +94,6 @@
      */
     property list<Action> actions
 
-
-    /**
-     * position: real
-     * This property holds the position of the dragged list item relative to its
-     * final destination (just like the Drawer). That is, the position
-     * will be 0 when the list item is fully closed, and 1 when fully open.
-     */
-    property real position: 0
-
-    /**
-     * background: Item
-     * This property holds the background item.
-     *
-     * Note: If the background item has no explicit size specified,
-     * it automatically follows the control's size.
-     * In most cases, there is no need to specify width or
-     * height for a background item.
-     */
-    property Item background
-
     /**
      * textColor: color
      * Color for the text in the item
@@ -189,12 +126,25 @@
      */
     property color activeBackgroundColor: Theme.highlightColor
 
+    default property alias _default: listItem.contentItem
+
+    implicitWidth: contentItem ? contentItem.implicitWidth : Units.gridUnit * 12
+    width: parent ? parent.width : implicitWidth
+    implicitHeight: contentItem.implicitHeight + Units.smallSpacing * 5
+
+    leftPadding: Units.smallSpacing * 2
+    topPadding: Units.smallSpacing * 2
+    rightPadding: Units.smallSpacing * 2
+    bottomPadding: Units.smallSpacing * 2
+
+//END properties
+
     Item {
         id: behindItem
         parent: listItem
+        z: -1
         anchors {
             fill: parent
-            leftMargin: height
         }
         Rectangle {
             id: shadowHolder
@@ -211,209 +161,164 @@
         }
         EdgeShadow {
             edge: Qt.LeftEdge
-            x: behindItem.width - (behindItem.width * listItem.position)
+            x: listItem.background.x + listItem.background.width
             anchors {
                 top: parent.top
                 bottom: parent.bottom
             }
         }
-    }
-
-    implicitWidth: parent ? parent.width : contentItem.width + paddingItem.anchors.margins * 2
-    implicitHeight: contentItem.height + Units.smallSpacing * 5
-//END properties
-
-//BEGIN signal handlers
-    onBackgroundChanged: {
-        if (background) {
-            background.parent = itemMouse;
-            background.anchors.fill = itemMouse;
-            background.z = -1;
-        }
-    }
-
-    onContentItemChanged: {
-        contentItem.parent = paddingItem
-        contentItem.z = 1;
-    }
-
-    Component.onCompleted: {
-        backgroundChanged();
-        contentItemChanged();
-    }
-
-    onPositionChanged: {
-        if (!mainFlickable.loopCheck && !handleMouse.pressed && !mainFlickable.flicking &&
-            !mainFlickable.dragging && !positionAnimation.running) {
-            mainFlickable.contentX = (listItem.width-listItem.height) * mainFlickable.internalPosition;
-        }
-    }
-//END signal handlers
-
-//BEGIN UI implementation
-    Row {
-        id: actionsLayout
-        z: 1
-        anchors {
-            right: parent.right
-            verticalCenter: parent.verticalCenter
-            rightMargin: y
+        MouseArea {
+            anchors.fill: parent
+            preventStealing: true
+            enabled: background.x != 0
+            onClicked: {
+                positionAnimation.from = background.x;
+                positionAnimation.to = 0;
+                positionAnimation.running = true;
+            }
         }
-        height: Math.min( parent.height / 1.5, Units.iconSizes.medium)
-        width: childrenRect.width
-        property bool exclusive: false
-        property Item checkedButton
-        spacing: Units.largeSpacing
-        Repeater {
-            model: {
-                if (listItem.actions.length == 0) {
-                    return null;
-                } else {
-                    return listItem.actions[0].text !== undefined &&
-                        listItem.actions[0].trigger !== undefined ?
-                            listItem.actions :
-                            listItem.actions[0];
-                }
+        Row {
+            id: actionsLayout
+            z: 1
+            anchors {
+                right: parent.right
+                verticalCenter: parent.verticalCenter
+                rightMargin: listItem.rightPadding
             }
-            delegate: Icon {
-                height: actionsLayout.height
-                width: height
-                source: modelData.iconName
-                enabled: (modelData && modelData.enabled !== undefined) ? modelData.enabled : true;
-                visible: (modelData && modelData.visible !== undefined) ? modelData.visible : true;
-                MouseArea {
-                    anchors {
-                        fill: parent;
-                        margins: -Units.smallSpacing;
+            height: Math.min( parent.height / 1.5, Units.iconSizes.medium)
+            width: childrenRect.width
+            property bool exclusive: false
+            property Item checkedButton
+            spacing: Units.largeSpacing
+            Repeater {
+                model: {
+                    if (listItem.actions.length == 0) {
+                        return null;
+                    } else {
+                        return listItem.actions[0].text !== undefined &&
+                            listItem.actions[0].trigger !== undefined ?
+                                listItem.actions :
+                                listItem.actions[0];
                     }
+                }
+                delegate: Icon {
+                    height: actionsLayout.height
+                    width: height
+                    source: modelData.iconName
                     enabled: (modelData && modelData.enabled !== undefined) ? modelData.enabled : true;
-                    onClicked: {
-                        if (modelData && modelData.trigger !== undefined) {
-                            modelData.trigger();
-                        // assume the model is a list of QAction or Action
-                        } else if (toolbar.model.length > index) {
-                            toolbar.model[index].trigger();
-                        } else {
-                            console.log("Don't know how to trigger the action")
+                    visible: (modelData && modelData.visible !== undefined) ? modelData.visible : true;
+                    MouseArea {
+                        anchors {
+                            fill: parent;
+                            margins: -Units.smallSpacing;
+                        }
+                        enabled: (modelData && modelData.enabled !== undefined) ? modelData.enabled : true;
+                        onClicked: {
+                            if (modelData && modelData.trigger !== undefined) {
+                                modelData.trigger();
+                            }
+                            positionAnimation.from = background.x;
+                            positionAnimation.to = 0;
+                            positionAnimation.running = true;
                         }
-                        positionAnimation.to = 0;
-                        positionAnimation.running = true;
                     }
                 }
             }
         }
     }
 
-    PropertyAnimation {
-        id: positionAnimation
-        target: mainFlickable
-        properties: "contentX"
-        duration: Units.longDuration
-        easing.type: Easing.InOutQuad
-    }
-
-    Flickable {
-        id: mainFlickable
-        z: 2
-        interactive: false
-        boundsBehavior: Flickable.StopAtBounds
-        anchors.fill: parent
-        contentWidth: mainItem.width
-        contentHeight: height
-        onFlickEnded: {
-            if (contentX > width / 2) {
-                positionAnimation.to = width - height;
+    MouseArea {
+        id: handleMouse
+        parent: listItem.background
+        z: 99
+        anchors {
+            right: parent.right
+            top: parent.top
+            bottom: parent.bottom
+            rightMargin: listItem.rightPadding
+        }
+        preventStealing: true
+        width: height
+        property var downTimestamp;
+        property int startX
+        property int startMouseX
+
+        property MouseArea edgeFilter
+
+        onClicked: {
+            positionAnimation.from = background.x;
+            if (listItem.background.x > -listItem.background.width/2) {
+                positionAnimation.to = -listItem.width + height;
             } else {
                 positionAnimation.to = 0;
             }
             positionAnimation.running = true;
         }
-        readonly property real internalPosition:  (mainFlickable.contentX/(listItem.width-listItem.height));
-        property bool loopCheck: false
-        onInternalPositionChanged: {
-            if (!loopCheck) {
-                loopCheck = true;
-                listItem.position = internalPosition;
-                loopCheck = false;
-            }
+        onPressed: {
+            downTimestamp = (new Date()).getTime();
+            startX = listItem.background.x;
+            startMouseX = mouse.x;
         }
+        onPositionChanged: {
+            listItem.background.x = Math.min(0, Math.max(-listItem.width + height, listItem.background.x - (startMouseX - mouse.x)));
+        }
+        onReleased: {
+            var speed = ((startX - listItem.background.x) / ((new Date()).getTime() - downTimestamp) * 1000);
 
-        Item {
-            id: mainItem
-            width: (mainFlickable.width * 2) - handleMouse.width
-            height: mainFlickable.height
-            MouseArea {
-                id: itemMouse
-                anchors {
-                    left: parent.left
-                    top: parent.top
-                    bottom: parent.bottom
-                }
-                hoverEnabled: !Settings.isMobile
-                width: mainFlickable.width
-                onClicked: listItem.clicked()
-                onPressAndHold: listItem.pressAndHold()
-
-                Item {
-                    id: paddingItem
-                    anchors {
-                        fill: parent
-                        margins: Units.smallSpacing
-                        rightMargin: handleIcon.width + Units.smallSpacing
-                    }
-                }
+            if (Math.abs(speed) < Units.gridUnit) {
+                return;
+            }
+            if (speed > listItem.width/2) {
+                positionAnimation.to = -listItem.width + height;
+            } else {
+                positionAnimation.to = 0;
             }
+            positionAnimation.from = background.x;
+            positionAnimation.running = true;
+        }
+        Icon {
+            id: handleIcon
+            anchors.verticalCenter: parent.verticalCenter
+            selected: listItem.checked || (listItem.pressed && !listItem.checked && !listItem.sectionDelegate)
+            width: Units.iconSizes.smallMedium
+            height: width
+            x: y
+            source: listItem.background.x < -listItem.background.width/2 ? "handle-right" : "handle-left"
+        }
+    }
 
-            MouseArea {
-                id: handleMouse
-                anchors {
-                    left: itemMouse.right
-                    right: itemMouse.right
-                    top: parent.top
-                    bottom: parent.bottom
-                    leftMargin:  -height
-                }
-                preventStealing: true
-                property var downTimestamp;
-                property int startX
-                property int startMouseX
+    XAnimator {
+        id: positionAnimation
+        target: background
+        duration: Units.longDuration
+        easing.type: Easing.InOutQuad
+    }
 
-                onClicked: {
-                    if (Math.abs(startX - mainFlickable.contentX) > Units.gridUnit ||
-                        Math.abs(startMouseX - mouse.x) > Units.gridUnit) {
-                        return;
-                    }
-                    if (mainFlickable.contentX > mainFlickable.width / 2) {
-                        positionAnimation.to = 0;
-                    } else {
-                        positionAnimation.to = mainFlickable.width - mainFlickable.height;
-                    }
-                    positionAnimation.running = true;
-                }
-                onPressed: {
-                    downTimestamp = (new Date()).getTime();
-                    startX = mainFlickable.contentX;
-                    startMouseX = mouse.x;
-                }
-                onPositionChanged: {
-                    mainFlickable.contentX = Math.max(0, Math.min(mainFlickable.width - height, mainFlickable.contentX + (startMouseX - mouse.x)))
-                }
-                onReleased: {
-                    var speed = ((startX - mainFlickable.contentX) / ((new Date()).getTime() - downTimestamp) * 1000);
-                    mainFlickable.flick(speed, 0);
-                }
-                Icon {
-                    id: handleIcon
-                    anchors.centerIn: parent
-                    selected: listItem.checked || (listItem.pressed && !listItem.checked && !listItem.sectionDelegate)
-                    width: Units.iconSizes.smallMedium
-                    height: width
-                    source: (mainFlickable.contentX > mainFlickable.width / 2) ? "handle-right" : "handle-left"
-                }
+//BEGIN signal handlers
+    onContentItemChanged: {
+        contentItem.parent = background;
+        contentItem.z = 0;
+    }
+    Component.onCompleted: {
+        //this will happen only once
+        if (Settings.isMobile && !listItem.ListView.view.parent.parent._swipeFilter) {
+            var component = Qt.createComponent(Qt.resolvedUrl("../private/SwipeItemEventFilter.qml"));
+            listItem.ListView.view.parent.parent._swipeFilter = component.createObject(listItem.ListView.view.parent.parent);
+        }
+    }
+    Connections {
+        target: enabled ? listItem.ListView.view.parent.parent._swipeFilter : null
+        property bool enabled: listItem.ListView.view.parent.parent._swipeFilter ? listItem.ListView.view.parent.parent._swipeFilter.currentItem === listItem : false
+        onPeekChanged: listItem.background.x = -(listItem.background.width - listItem.background.height) * listItem.ListView.view.parent.parent._swipeFilter.peek
+        onCurrentItemChanged: {
+            if (!enabled) {
+                positionAnimation.to = 0;
+                positionAnimation.from = background.x;
+                positionAnimation.running = true;
             }
         }
     }
-//END UI implementation
+//END signal handlers
 
     Accessible.role: Accessible.ListItem
 }
diff --git a/src/controls/templates/private/AbstractDrawer.qml b/src/controls/templates/private/AbstractDrawer.qml
deleted file mode 100644
--- a/src/controls/templates/private/AbstractDrawer.qml
+++ /dev/null
@@ -1,51 +0,0 @@
-/*
- *   Copyright 2015 Marco Martin <mart@kde.org>
- *
- *   This program is free software; you can redistribute it and/or modify
- *   it under the terms of the GNU Library General Public License as
- *   published by the Free Software Foundation; either version 2, or
- *   (at your option) any later version.
- *
- *   This program is distributed in the hope that it will be useful,
- *   but WITHOUT ANY WARRANTY; without even the implied warranty of
- *   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- *   GNU Library General Public License for more details
- *
- *   You should have received a copy of the GNU Library General Public
- *   License along with this program; if not, write to the
- *   Free Software Foundation, Inc.,
- *   51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
- */
-
-import QtQuick 2.1
-import QtGraphicalEffects 1.0
-import org.kde.kirigami 1.0
-
-//TODO: This will become a QQC2 Drawer
-//providing just a dummy api for now
-Item {
-    id: root
-    anchors {
-        fill: parent
-        topMargin: !modal && applicationWindow !== undefined && applicationWindow().header && applicationWindow().controlsVisible ? applicationWindow().header.height : 0
-    }
-    z: 9999
-
-    default property alias page: mainPage.data
-    property Item contentItem
-    property bool opened
-    property int edge: Qt.LeftEdge
-    property real position: 0
-    property bool modal: true
-
-    function open () { }
-    function close () { }
-    signal clicked
-
-    Item {
-        id: mainPage
-        anchors.fill: parent
-        onChildrenChanged: mainPage.children[0].anchors.fill = mainPage
-    }
-}
-
diff --git a/src/controls/templates/private/BackButton.qml b/src/controls/templates/private/BackButton.qml
--- a/src/controls/templates/private/BackButton.qml
+++ b/src/controls/templates/private/BackButton.qml
@@ -18,9 +18,11 @@
  */
 
 import QtQuick 2.1
+//for Settings
 import QtQuick.Controls 1.0 as Controls
 import QtQuick.Controls.Private 1.0
-import org.kde.kirigami 1.0
+
+import org.kde.kirigami 2.0
 
 MouseArea {
     anchors {
diff --git a/src/controls/templates/private/ContextIcon.qml b/src/controls/templates/private/ContextIcon.qml
--- a/src/controls/templates/private/ContextIcon.qml
+++ b/src/controls/templates/private/ContextIcon.qml
@@ -20,7 +20,7 @@
 import QtQuick 2.1
 import QtQuick.Layouts 1.2
 import QtGraphicalEffects 1.0
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 Item {
     id: canvas
diff --git a/src/controls/templates/private/MenuIcon.qml b/src/controls/templates/private/MenuIcon.qml
--- a/src/controls/templates/private/MenuIcon.qml
+++ b/src/controls/templates/private/MenuIcon.qml
@@ -20,7 +20,7 @@
 import QtQuick 2.1
 import QtQuick.Layouts 1.2
 import QtGraphicalEffects 1.0
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 Item {
     id: canvas
diff --git a/src/controls/templates/private/PageRow.qml b/src/controls/templates/private/PageRow.qml
--- a/src/controls/templates/private/PageRow.qml
+++ b/src/controls/templates/private/PageRow.qml
@@ -424,18 +424,7 @@
             id: container
             height: mainFlickable.height
             width: root.width
-            state: pendingState
-            property string pendingState: root.width < root.defaultColumnWidth*2 ? "vertical" : (container.level >= pagesLogic.count - 1 ? "last" : "middle");
-
-            //HACK
-            onPendingStateChanged: {
-                stateTimer.restart();
-            }
-            Timer {
-                id: stateTimer
-                interval: 150
-                onTriggered: container.state = container.pendingState
-            }
+            state: root.width < root.defaultColumnWidth*2 ? "vertical" : (container.level >= pagesLogic.count - 1 ? "last" : "middle");
 
             property int level
 
@@ -494,22 +483,6 @@
                     }
                 }
             ]
-            transitions: [
-                Transition {
-                    from: "last,middle"
-                    to: "middle,last"
-                    SequentialAnimation {
-                        NumberAnimation {
-                            property: "width"
-                            duration: Units.longDuration
-                            easing.type: Easing.InOutQuad
-                        }
-                        ScriptAction {
-                           script: mainFlickable.currentItemChanged();
-                        }
-                    }
-                }
-            ]
         }
     }
 
diff --git a/src/controls/templates/private/PassiveNotification.qml b/src/controls/templates/private/PassiveNotification.qml
--- a/src/controls/templates/private/PassiveNotification.qml
+++ b/src/controls/templates/private/PassiveNotification.qml
@@ -18,14 +18,14 @@
  */
 
 import QtQuick 2.5
-import QtQuick.Controls 1.3 as Controls
+import QtQuick.Controls 2.0 as QQC2
 import QtQuick.Layouts 1.2
 import QtGraphicalEffects 1.0
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 MouseArea {
     id: root
-    z: 9999
+    z: 9999999
     width: background.width
     height: background.height
     opacity: 0
@@ -125,7 +125,7 @@
                 elide: Text.ElideRight
                 color: Theme.backgroundColor
             }
-            Controls.Button {
+            QQC2.Button {
                 id: actionButton
                 property var callBack
                 visible: text != ""
diff --git a/src/controls/templates/private/ScrollView.qml b/src/controls/templates/private/ScrollView.qml
new file mode 100644
--- /dev/null
+++ b/src/controls/templates/private/ScrollView.qml
@@ -0,0 +1,74 @@
+/*
+ *   Copyright 2016 Marco Martin <mart@kde.org>
+ *
+ *   This program is free software; you can redistribute it and/or modify
+ *   it under the terms of the GNU Library General Public License as
+ *   published by the Free Software Foundation; either version 2, or
+ *   (at your option) any later version.
+ *
+ *   This program is distributed in the hope that it will be useful,
+ *   but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *   GNU Library General Public License for more details
+ *
+ *   You should have received a copy of the GNU Library General Public
+ *   License along with this program; if not, write to the
+ *   Free Software Foundation, Inc.,
+ *   51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+import QtQuick 2.5
+import QtQuick.Controls 2.0 
+import org.kde.kirigami 2.0
+
+Item {
+    id: root
+    default property Item contentItem
+    property Flickable flickableItem
+
+    //TODO: horizontalScrollBarPolicy is completely noop just for compatibility right now
+    property int horizontalScrollBarPolicy: Qt.ScrollBarAlwaysOff
+    property int verticalScrollBarPolicy: Qt.ScrollBarAsNeeded
+
+    readonly property Item verticalScrollBar: flickableItem.ScrollBar.vertical ? flickableItem.ScrollBar.vertical : null
+
+    onVerticalScrollBarPolicyChanged: {
+        flickableItem.ScrollBar.vertical.visible = verticalScrollBarPolicy == Qt.ScrollBarAlwaysOff
+    }
+
+    onContentItemChanged: {
+        if (contentItem.hasOwnProperty("contentY")) {
+            flickableItem = contentItem;
+            contentItem.parent = flickableParent;
+        } else {
+            flickableItem = flickableComponent.createObject(flickableParent);
+            contentItem.parent = flickableItem.contentItem;
+        }
+        flickableItem.anchors.fill = flickableParent;
+        flickableItem.ScrollBar.vertical = scrollComponent.createObject(root);
+        flickableItem.ScrollBar.vertical.anchors.right = root.right
+    }
+
+    Item {
+        id: flickableParent
+        anchors {
+            fill: parent
+            //FIXME: depending from properietary extension _desktopStyle?
+            //rightMargin: flickableItem.ScrollBar.vertical.visible && flickableItem.ScrollBar.vertical.size < 1.0 && flickableItem.ScrollBar.vertical._desktopStyle ? flickableItem.ScrollBar.vertical.width : 0
+        }
+        clip: true
+    }
+    Component {
+        id: flickableComponent
+        Flickable {
+            anchors {
+                fill: parent
+            }
+            contentWidth: root.contentItem ? root.contentItem.width : 0
+            contentHeight: root.contentItem ? root.contentItem.height : 0
+        }
+    }
+    Component {
+        id: scrollComponent
+        ScrollBar { }
+    }
+}
diff --git a/src/kirigamiplugin.cpp b/src/kirigamiplugin.cpp
--- a/src/kirigamiplugin.cpp
+++ b/src/kirigamiplugin.cpp
@@ -59,42 +59,42 @@
     //TODO: in this plugin it will end up something similar to
     //PlasmaCore's ColorScope?
 
-    qmlRegisterUncreatableType<ApplicationHeaderStyle>(uri, 1, 0, "ApplicationHeaderStyle", "Cannot create objects of type ApplicationHeaderStyle");
-
-    qmlRegisterSingletonType(componentPath(QStringLiteral("Theme.qml")), uri, 1, 0, "Theme");
-    qmlRegisterSingletonType(componentPath(QStringLiteral("Units.qml")), uri, 1, 0, "Units");
-
-    qmlRegisterType(componentPath(QStringLiteral("Action.qml")), uri, 1, 0, "Action");
-    qmlRegisterType(componentPath(QStringLiteral("AbstractApplicationHeader.qml")), uri, 1, 0, "AbstractApplicationHeader");
-    qmlRegisterType(componentPath(QStringLiteral("AbstractApplicationWindow.qml")), uri, 1, 0, "AbstractApplicationWindow");
-    qmlRegisterType(componentPath(QStringLiteral("AbstractListItem.qml")), uri, 1, 0, "AbstractListItem");
-    qmlRegisterType(componentPath(QStringLiteral("ApplicationHeader.qml")), uri, 1, 0, "ApplicationHeader");
-    qmlRegisterType(componentPath(QStringLiteral("ToolBarApplicationHeader.qml")), uri, 1, 0, "ToolBarApplicationHeader");
-    qmlRegisterType(componentPath(QStringLiteral("ApplicationWindow.qml")), uri, 1, 0, "ApplicationWindow");
-    qmlRegisterType(componentPath(QStringLiteral("BasicListItem.qml")), uri, 1, 0, "BasicListItem");
-    qmlRegisterType(componentPath(QStringLiteral("OverlayDrawer.qml")), uri, 1, 0, "OverlayDrawer");
-    qmlRegisterType(componentPath(QStringLiteral("ContextDrawer.qml")), uri, 1, 0, "ContextDrawer");
-    qmlRegisterType(componentPath(QStringLiteral("GlobalDrawer.qml")), uri, 1, 0, "GlobalDrawer");
-    qmlRegisterType(componentPath(QStringLiteral("Heading.qml")), uri, 1, 0, "Heading");
-    qmlRegisterType(componentPath(QStringLiteral("Separator.qml")), uri, 1, 0, "Separator");
+    qmlRegisterUncreatableType<ApplicationHeaderStyle>(uri, 2, 0, "ApplicationHeaderStyle", "Cannot create objects of type ApplicationHeaderStyle");
+
+    qmlRegisterSingletonType(componentPath(QStringLiteral("Theme.qml")), uri, 2, 0, "Theme");
+    qmlRegisterSingletonType(componentPath(QStringLiteral("Units.qml")), uri, 2, 0, "Units");
+
+    qmlRegisterType(componentPath(QStringLiteral("Action.qml")), uri, 2, 0, "Action");
+    qmlRegisterType(componentPath(QStringLiteral("AbstractApplicationHeader.qml")), uri, 2, 0, "AbstractApplicationHeader");
+    qmlRegisterType(componentPath(QStringLiteral("AbstractApplicationWindow.qml")), uri, 2, 0, "AbstractApplicationWindow");
+    qmlRegisterType(componentPath(QStringLiteral("AbstractListItem.qml")), uri, 2, 0, "AbstractListItem");
+    qmlRegisterType(componentPath(QStringLiteral("ApplicationHeader.qml")), uri, 2, 0, "ApplicationHeader");
+    qmlRegisterType(componentPath(QStringLiteral("ToolBarApplicationHeader.qml")), uri, 2, 0, "ToolBarApplicationHeader");
+    qmlRegisterType(componentPath(QStringLiteral("ApplicationWindow.qml")), uri, 2, 0, "ApplicationWindow");
+    qmlRegisterType(componentPath(QStringLiteral("BasicListItem.qml")), uri, 2, 0, "BasicListItem");
+    qmlRegisterType(componentPath(QStringLiteral("OverlayDrawer.qml")), uri, 2, 0, "OverlayDrawer");
+    qmlRegisterType(componentPath(QStringLiteral("ContextDrawer.qml")), uri, 2, 0, "ContextDrawer");
+    qmlRegisterType(componentPath(QStringLiteral("GlobalDrawer.qml")), uri, 2, 0, "GlobalDrawer");
+    qmlRegisterType(componentPath(QStringLiteral("Heading.qml")), uri, 2, 0, "Heading");
+    qmlRegisterType(componentPath(QStringLiteral("Separator.qml")), uri, 2, 0, "Separator");
 
     //The icon is "special: we have to use a wrapper class to QIcon on desktops
 #if !defined(Q_OS_ANDROID) && !defined(Q_OS_IOS)
     if (!m_stylesFallbackChain.isEmpty() && m_stylesFallbackChain.first() == QStringLiteral("Desktop")) {
-        qmlRegisterType<DesktopIcon>(uri, 1, 0, "Icon");
+        qmlRegisterType<DesktopIcon>(uri, 2, 0, "Icon");
     } else {
-        qmlRegisterType(componentPath(QStringLiteral("Icon.qml")), uri, 1, 0, "Icon");
+        qmlRegisterType(componentPath(QStringLiteral("Icon.qml")), uri, 2, 0, "Icon");
     }
 #else
-    qmlRegisterType(componentPath(QStringLiteral("Icon.qml")), uri, 1, 0, "Icon");
+    qmlRegisterType(componentPath(QStringLiteral("Icon.qml")), uri, 2, 0, "Icon");
 #endif
 
-    qmlRegisterType(componentPath(QStringLiteral("Label.qml")), uri, 1, 0, "Label");
-    qmlRegisterType(componentPath(QStringLiteral("OverlaySheet.qml")), uri, 1, 0, "OverlaySheet");
-    qmlRegisterType(componentPath(QStringLiteral("Page.qml")), uri, 1, 0, "Page");
-    qmlRegisterType(componentPath(QStringLiteral("ScrollablePage.qml")), uri, 1, 0, "ScrollablePage");
-    qmlRegisterType(componentPath(QStringLiteral("SplitDrawer.qml")), uri, 1, 0, "SplitDrawer");
-    qmlRegisterType(componentPath(QStringLiteral("SwipeListItem.qml")), uri, 1, 0, "SwipeListItem");
+    qmlRegisterType(componentPath(QStringLiteral("Label.qml")), uri, 2, 0, "Label");
+    qmlRegisterType(componentPath(QStringLiteral("OverlaySheet.qml")), uri, 2, 0, "OverlaySheet");
+    qmlRegisterType(componentPath(QStringLiteral("Page.qml")), uri, 2, 0, "Page");
+    qmlRegisterType(componentPath(QStringLiteral("ScrollablePage.qml")), uri, 2, 0, "ScrollablePage");
+    qmlRegisterType(componentPath(QStringLiteral("SplitDrawer.qml")), uri, 2, 0, "SplitDrawer");
+    qmlRegisterType(componentPath(QStringLiteral("SwipeListItem.qml")), uri, 2, 0, "SwipeListItem");
 }
 
 #include "moc_kirigamiplugin.cpp"
diff --git a/src/qmldir b/src/qmldir
--- a/src/qmldir
+++ b/src/qmldir
@@ -1,23 +1,24 @@
 module org.kde.kirigami
 
-AbstractApplicationHeader 1.0 templates/AbstractApplicationHeader.qml
-AbstractApplicationWindow 1.0 templates/AbstractApplicationWindow.qml
-AbstractListItem 1.0 templates/AbstractListItem.qml
-Action 1.0 templates/Action.qml
-ApplicationHeader 1.0 templates/ApplicationHeader.qml
-ApplicationWindow 1.0 templates/ApplicationWindow.qml
-OverlayDrawer 1.0 templates/OverlayDrawer.qml
-OverlaySheet 1.0 templates/OverlaySheet.qml
-Page 1.0 templates/Page.qml
-SplitDrawer 1.0 templates/SplitDrawer.qml
-SwipeListItem 1.0 templates/SwipeListItem.qml
+AbstractApplicationHeader 2.0 templates/AbstractApplicationHeader.qml
+AbstractApplicationWindow 2.0 templates/AbstractApplicationWindow.qml
+AbstractListItem 2.0 templates/AbstractListItem.qml
+Action 2.0 templates/Action.qml
+ApplicationHeader 2.0 templates/ApplicationHeader.qml
+ApplicationWindow 2.0 templates/ApplicationWindow.qml
+OverlayDrawer 2.0 templates/OverlayDrawer.qml
+OverlaySheet 2.0 templates/OverlaySheet.qml
+Page 2.0 templates/Page.qml
+SplitDrawer 2.0 templates/SplitDrawer.qml
+SwipeListItem 2.0 templates/SwipeListItem.qml
+PageRow 2.0 templates/private/PageRow.qml
 
-BasicListItem 1.0 controls/BasicListItem.qml
-ContextDrawer 1.0 controls/ContextDrawer.qml
-GlobalDrawer 1.0 controls/GlobalDrawer.qml
-Heading 1.0 controls/Heading.qml
-Icon 1.0 controls/Icon.qml
-Label 1.0 controls/Label.qml
-ScrollablePage 1.0 controls/ScrollablePage.qml
-Theme 1.0 controls/Theme.qml
-Units 1.0 controls/Units.qml
+BasicListItem 2.0 controls/BasicListItem.qml
+ContextDrawer 2.0 controls/ContextDrawer.qml
+GlobalDrawer 2.0 controls/GlobalDrawer.qml
+Heading 2.0 controls/Heading.qml
+Icon 2.0 controls/Icon.qml
+Label 2.0 controls/Label.qml
+ScrollablePage 2.0 controls/ScrollablePage.qml
+Theme 2.0 controls/Theme.qml
+Units 2.0 controls/Units.qml
diff --git a/src/styles/Desktop/AbstractApplicationHeader.qml b/src/styles/Desktop/AbstractApplicationHeader.qml
--- a/src/styles/Desktop/AbstractApplicationHeader.qml
+++ b/src/styles/Desktop/AbstractApplicationHeader.qml
@@ -18,7 +18,7 @@
  */
 
 import QtQuick 2.5
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 
 import "../../templates" as T
 
diff --git a/src/styles/Desktop/AbstractListItem.qml b/src/styles/Desktop/AbstractListItem.qml
--- a/src/styles/Desktop/AbstractListItem.qml
+++ b/src/styles/Desktop/AbstractListItem.qml
@@ -18,13 +18,13 @@
  */
 
 import QtQuick 2.1
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 import "../../private"
 import "../../templates" as T
 
 T.AbstractListItem {
     id: listItem
 
     background: DefaultListItemBackground {}
-    implicitHeight: listItem.contentItem.height + Units.smallSpacing*4
+    implicitHeight: contentItem.implicitHeight + Units.smallSpacing * 4
 }
diff --git a/src/styles/Desktop/ApplicationWindow.qml b/src/styles/Desktop/ApplicationWindow.qml
--- a/src/styles/Desktop/ApplicationWindow.qml
+++ b/src/styles/Desktop/ApplicationWindow.qml
@@ -18,7 +18,7 @@
  */
 
 import QtQuick 2.1
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 import "../../" as Base
 
 
diff --git a/src/styles/Desktop/OverlayDrawer.qml b/src/styles/Desktop/OverlayDrawer.qml
--- a/src/styles/Desktop/OverlayDrawer.qml
+++ b/src/styles/Desktop/OverlayDrawer.qml
@@ -18,7 +18,8 @@
  */
 
 import QtQuick 2.1
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
+import QtQuick.Templates 2.0
 
 import "../../templates" as T
 
@@ -36,18 +37,12 @@
 //BEGIN Properties
     background: Rectangle {
         color: Theme.viewBackgroundColor
-        property Item handleBackground: Item {
-        }
 
         Item {
             id: drawerHandle
-            z: -1
+            parent: root.handle
+            anchors.fill: parent
 
-            anchors {
-                right: root.edge == Qt.LeftEdge ? undefined : parent.left
-                left: root.edge == Qt.RightEdge ? undefined : parent.right
-                bottom: parent.bottom
-            }
             visible: root.enabled && (root.edge == Qt.LeftEdge || root.edge == Qt.RightEdge)
             width: Units.iconSizes.medium + Units.smallSpacing * 2
             height: width
@@ -125,5 +120,12 @@
 
     //default to a sidebar in desktop mode
     modal: edge == Qt.TopEdge || edge == Qt.BottomEdge
-    opened: true
+    drawerOpen: true
+    closePolicy: modal ? Popup.CloseOnEscape | Popup.CloseOnPressOutside : Popup.NoAutoClose
+    handleVisible: false
+    onPositionChanged: {
+        if (!modal && !root.peeking && !root.animating) {
+            position = 1;
+        }
+    }
 }
diff --git a/src/styles/Desktop/SwipeListItem.qml b/src/styles/Desktop/SwipeListItem.qml
--- a/src/styles/Desktop/SwipeListItem.qml
+++ b/src/styles/Desktop/SwipeListItem.qml
@@ -18,13 +18,14 @@
  */
 
 import QtQuick 2.5
-import org.kde.kirigami 1.0
+import org.kde.kirigami 2.0
 import "../../private"
 import "../../templates" as T
 
 T.SwipeListItem {
     id: listItem
 
+    rightPadding: Units.gridUnit
     background: DefaultListItemBackground {}
-    implicitHeight: contentItem.height + Units.smallSpacing*4
+    implicitHeight: contentItem.implicitHeight + Units.smallSpacing * 4
 }
diff --git a/src/styles/Material/AbstractListItem.qml b/src/styles/Material/AbstractListItem.qml
new file mode 100644
--- /dev/null
+++ b/src/styles/Material/AbstractListItem.qml
@@ -0,0 +1,63 @@
+/*
+ *   Copyright 2016 Marco Martin <notmart@gmail.com>
+ *
+ *   This program is free software; you can redistribute it and/or modify
+ *   it under the terms of the GNU Library General Public License as
+ *   published by the Free Software Foundation; either version 2, or
+ *   (at your option) any later version.
+ *
+ *   This program is distributed in the hope that it will be useful,
+ *   but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *   GNU Library General Public License for more details
+ *
+ *   You should have received a copy of the GNU Library General Public
+ *   License along with this program; if not, write to the
+ *   Free Software Foundation, Inc.,
+ *   51 Franklin Street, Fifth Floor, Boston, MA  2.010-1301, USA.
+ */
+
+import QtQuick 2.7
+import org.kde.kirigami 2.0
+import "../../private"
+import "../../templates" as T
+
+T.AbstractListItem {
+    id: listItem
+
+    onPressedChanged: {
+        if (pressed) {
+            clickAnim.running = true
+        }
+    }
+    background: DefaultListItemBackground {
+        clip: true
+        //TODO: this will have to reuse QQC2.1 Ripple
+        Rectangle {
+            id: ripple
+            anchors.centerIn: parent
+            width: parent.width
+            height: parent.width
+            radius: width
+            color: Qt.rgba(1,1,1,0.3)
+            scale: 0
+            opacity: 1
+            ParallelAnimation {
+                id: clickAnim
+                ScaleAnimator {
+                    target: ripple
+                    from: 0
+                    to: 1
+                    duration: Units.longDuration
+                }
+                OpacityAnimator {
+                    target: ripple
+                    from: 0
+                    to: 1
+                    duration: Units.longDuration
+                }
+            }
+        }
+    }
+    implicitHeight: contentItem.implicitHeight + Units.smallSpacing * 6
+}
diff --git a/src/styles/Material/SwipeListItem.qml b/src/styles/Material/SwipeListItem.qml
new file mode 100644
--- /dev/null
+++ b/src/styles/Material/SwipeListItem.qml
@@ -0,0 +1,92 @@
+/*
+ *   Copyright 2010 Marco Martin <notmart@gmail.com>
+ *
+ *   This program is free software; you can redistribute it and/or modify
+ *   it under the terms of the GNU Library General Public License as
+ *   published by the Free Software Foundation; either version 2, or
+ *   (at your option) any later version.
+ *
+ *   This program is distributed in the hope that it will be useful,
+ *   but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *   GNU Library General Public License for more details
+ *
+ *   You should have received a copy of the GNU Library General Public
+ *   License along with this program; if not, write to the
+ *   Free Software Foundation, Inc.,
+ *   51 Franklin Street, Fifth Floor, Boston, MA  2.010-1301, USA.
+ */
+
+import QtQuick 2.5
+import org.kde.kirigami 2.0
+import "../../private"
+import "../../templates" as T
+
+/**
+ * An item delegate Intended to support extra actions obtainable
+ * by uncovering them by dragging away the item with the handle
+ * This acts as a container for normal list items.
+ * Any subclass of AbstractListItem can be assigned as the contentItem property.
+ * @code
+ * ListView {
+ *     model: myModel
+ *     delegate: SwipeListItem {
+ *         Label {
+ *             text: model.text
+ *         }
+ *         actions: [
+ *              Action {
+ *                  iconName: "document-decrypt"
+ *                  onTriggered: print("Action 1 clicked")
+ *              },
+ *              Action {
+ *                  iconName: model.action2Icon
+ *                  onTriggered: //do something
+ *              }
+ *         ]
+ *     }
+ * 
+ * }
+ * @endcode
+ *
+ * @inherit QtQuick.Item
+ */
+T.SwipeListItem {
+    id: root
+
+    onPressedChanged: {
+        if (pressed) {
+            clickAnim.running = true
+        }
+    }
+    background: DefaultListItemBackground {
+        clip: true
+        //TODO: this will have to reuse QQC2.1 Ripple
+        Rectangle {
+            id: ripple
+            anchors.centerIn: parent
+            width: parent.width
+            height: parent.width
+            radius: width
+            color: Qt.rgba(1,1,1,0.3)
+            scale: 0
+            opacity: 1
+            ParallelAnimation {
+                id: clickAnim
+                ScaleAnimator {
+                    target: ripple
+                    from: 0
+                    to: 1
+                    duration: Units.longDuration
+                }
+                OpacityAnimator {
+                    target: ripple
+                    from: 0
+                    to: 1
+                    duration: Units.longDuration
+                }
+            }
+        }
+    }
+    implicitHeight: contentItem.implicitHeight + Units.smallSpacing * 6
+}
diff --git a/src/styles/Material/Theme.qml b/src/styles/Material/Theme.qml
new file mode 100644
--- /dev/null
+++ b/src/styles/Material/Theme.qml
@@ -0,0 +1,58 @@
+/*
+ *   Copyright 2015 Marco Martin <mart@kde.org>
+ *
+ *   This program is free software; you can redistribute it and/or modify
+ *   it under the terms of the GNU Library General Public License as
+ *   published by the Free Software Foundation; either version 2, or
+ *   (at your option) any later version.
+ *
+ *   This program is distributed in the hope that it will be useful,
+ *   but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *   GNU Library General Public License for more details
+ *
+ *   You should have received a copy of the GNU Library General Public
+ *   License along with this program; if not, write to the
+ *   Free Software Foundation, Inc.,
+ *   51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+
+import QtQuick 2.7
+import QtQuick.Controls.Material 2.0
+
+pragma Singleton
+
+
+QtObject {
+    id: theme
+
+    property color textColor: theme.Material.foreground
+    onTextColorChanged: theme.Material.foreground = textColor
+    property color disabledTextColor: "#9931363b"
+
+    property color highlightColor: theme.Material.accent
+    onHighlightColorChanged: theme.Material.accent = highlightColor
+    //FIXME: something better?
+    property color highlightedTextColor: theme.Material.background
+    property color backgroundColor: theme.Material.background
+    property color linkColor: "#2196F3"
+    property color visitedLinkColor: "#2196F3"
+
+    property color buttonTextColor: theme.Material.foreground
+    property color buttonBackgroundColor: theme.Material.buttonColor
+    property color buttonHoverColor: theme.Material.highlightedButtonColor
+    property color buttonFocusColor: theme.Material.highlightedButtonColor
+
+    property color viewTextColor: theme.Material.foreground
+    property color viewBackgroundColor: theme.Material.dialogColor
+    property color viewHoverColor: theme.Material.listHighlightColor
+    property color viewFocusColor: theme.Material.listHighlightColor
+
+    property font defaultFont: fontMetrics.font
+
+    property list<QtObject> children: [
+        TextMetrics {
+            id: fontMetrics
+        }
+    ]
+}