diff --git a/package-lock.json b/package-lock.json
index 6594a3dcbc..e681929f63 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -36,7 +36,7 @@
         "@nextcloud/logger": "^2.2.1",
         "@nextcloud/moment": "^1.2.1",
         "@nextcloud/router": "^2.0.0",
-        "@nextcloud/vue": "^5.3.1",
+        "@nextcloud/vue": "^6.0.0-beta.3",
         "@nextcloud/vue-dashboard": "^2",
         "@riophae/vue-treeselect": "^0.4.0",
         "@vue/babel-preset-app": "^5.0.8",
@@ -1775,9 +1775,9 @@
       }
     },
     "node_modules/@babel/runtime": {
-      "version": "7.17.9",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.17.9.tgz",
-      "integrity": "sha512-lSiBBvodq29uShpWGNbgFdKYNiFDo5/HIYsaCEY9ff4sb10x9jizo2+pRrSyF4jKZCXqgzuqBOQKbUm90gQwJg==",
+      "version": "7.18.9",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.18.9.tgz",
+      "integrity": "sha512-lkqXDcvlFT5rvEjiu6+QYO+1GXrEHRo2LOtS7E4GtX5ESIZOgepqsZBVIj6Pv+a6zqsya9VCgiK1KAK4BvJDAw==",
       "dependencies": {
         "regenerator-runtime": "^0.13.4"
       },
@@ -2733,6 +2733,19 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/@floating-ui/core": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-0.3.1.tgz",
+      "integrity": "sha512-ensKY7Ub59u16qsVIFEo2hwTCqZ/r9oZZFh51ivcLGHfUwTn8l1Xzng8RJUe91H/UP8PeqeBronAGx0qmzwk2g=="
+    },
+    "node_modules/@floating-ui/dom": {
+      "version": "0.1.10",
+      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-0.1.10.tgz",
+      "integrity": "sha512-4kAVoogvQm2N0XE0G6APQJuCNuErjOfPW8Ux7DFxh8+AfugWflwVJ5LDlHOwrwut7z/30NUvdtHzQ3zSip4EzQ==",
+      "dependencies": {
+        "@floating-ui/core": "^0.3.0"
+      }
+    },
     "node_modules/@gar/promisify": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/@gar/promisify/-/promisify-1.1.2.tgz",
@@ -3349,9 +3362,9 @@
       }
     },
     "node_modules/@nextcloud/capabilities": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@nextcloud/capabilities/-/capabilities-1.0.2.tgz",
-      "integrity": "sha512-HR5vnT2GKTvoQla/WdP+V0/MD1eAGUNWCM0QXVGXQ0TCHb0AORYYMdEQafROsjNSH2kriArFnS/l3YZQrUa9yA==",
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@nextcloud/capabilities/-/capabilities-1.0.4.tgz",
+      "integrity": "sha512-xsmwPPUJ8NN7YfLcq0gpDTibeb9lMBvY/bffMFnHcZi8hMGOouPiEY+CWAgJ5I9W6I2vNeacHUuTanEN5Ncb2A==",
       "dependencies": {
         "@nextcloud/initial-state": "^1.1.2",
         "core-js": "^3.6.4"
@@ -3528,42 +3541,43 @@
       }
     },
     "node_modules/@nextcloud/vue": {
-      "version": "5.3.1",
-      "resolved": "https://registry.npmjs.org/@nextcloud/vue/-/vue-5.3.1.tgz",
-      "integrity": "sha512-f+OSbcS01s2UqYiLSUufJ8tGe5+SqALj1dysPGJm8pJ+R2zH+Pdl8R13YErwzdAa0nHwyISIp9L9MEOUItixRQ==",
+      "version": "6.0.0-beta.3",
+      "resolved": "https://registry.npmjs.org/@nextcloud/vue/-/vue-6.0.0-beta.3.tgz",
+      "integrity": "sha512-Fnenptz/55KIcXP8kDcjUz8Xcm0EARfSkvnpgQvJh12fd1Xkf8B8ziHQAfAPozsV3RmXDbTeGiuQ4VQCQ/rSzw==",
       "dependencies": {
-        "@nextcloud/auth": "^1.2.3",
-        "@nextcloud/axios": "^1.3.2",
+        "@nextcloud/auth": "^1.3.0",
+        "@nextcloud/axios": "^1.10.0",
         "@nextcloud/browser-storage": "^0.1.1",
         "@nextcloud/calendar-js": "^3.0.0",
-        "@nextcloud/capabilities": "^1.0.2",
-        "@nextcloud/dialogs": "^3.0.0",
-        "@nextcloud/event-bus": "^2.0.0",
-        "@nextcloud/l10n": "^1.2.3",
-        "@nextcloud/logger": "^2.0.0",
+        "@nextcloud/capabilities": "^1.0.4",
+        "@nextcloud/dialogs": "^3.1.4",
+        "@nextcloud/event-bus": "^2.1.1",
+        "@nextcloud/l10n": "^1.6.0",
+        "@nextcloud/logger": "^2.2.1",
         "@nextcloud/router": "^2.0.0",
         "debounce": "1.2.1",
-        "emoji-mart-vue-fast": "^10.2.1",
+        "emoji-mart-vue-fast": "^11.1.1",
         "escape-html": "^1.0.3",
+        "floating-vue": "^1.0.0-beta.18",
+        "focus-trap": "^6.9.4",
         "hammerjs": "^2.0.8",
-        "linkify-string": "^3.0.2",
-        "md5": "^2.2.1",
-        "splitpanes": "^2.3.6",
-        "string-length": "^5.0.0",
-        "striptags": "^3.1.1",
+        "linkify-string": "^3.0.4",
+        "md5": "^2.3.0",
+        "splitpanes": "^2.4.1",
+        "string-length": "^5.0.1",
+        "striptags": "^3.2.0",
         "style-loader": "^3.3.1",
         "tributejs": "^5.1.3",
-        "v-click-outside": "^3.0.1",
-        "v-tooltip": "^2.0.3",
-        "vue": "^2.6.14",
-        "vue-color": "^2.7.1",
-        "vue-material-design-icons": "^5.0.0",
+        "v-click-outside": "^3.2.0",
+        "vue": "^2.7.8",
+        "vue-color": "^2.8.1",
+        "vue-material-design-icons": "^5.1.2",
         "vue-multiselect": "^2.1.6",
-        "vue2-datepicker": "^3.6.3"
+        "vue2-datepicker": "^3.11.0"
       },
       "engines": {
-        "node": "^14.0.0",
-        "npm": "^7.0.0"
+        "node": "^16.0.0",
+        "npm": "^7.0.0 || ^8.0.0"
       }
     },
     "node_modules/@nextcloud/vue-dashboard": {
@@ -3736,9 +3750,9 @@
       }
     },
     "node_modules/@nextcloud/vue/node_modules/@nextcloud/event-bus": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/@nextcloud/event-bus/-/event-bus-2.0.0.tgz",
-      "integrity": "sha512-92lEJeDfOLU320mWb2Dm/EtHaRKiyOSSZyfz3MRrbtxja5up8iFK0EVizE5qO3o718Iyy3a6xw/G5Ztwy40EoA==",
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/@nextcloud/event-bus/-/event-bus-2.1.1.tgz",
+      "integrity": "sha512-YEui6N+23uyjBSIUZhf8rEjG9vol7UGgxcgxMddEbO0HS7M/sh1cocRqtn+ZVi/yPybeToGmt68SDPCgwHQHKw==",
       "dependencies": {
         "@types/semver": "^7.1.0",
         "core-js": "^3.6.2",
@@ -3746,9 +3760,9 @@
       }
     },
     "node_modules/@nextcloud/vue/node_modules/ansi-regex": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.0.0.tgz",
-      "integrity": "sha512-tAaOSrWCHF+1Ear1Z4wnJCXA9GGox4K6Ic85a5qalES2aeEwQGr7UC93mwef49536PkCYjzkp0zIxfFvexJ6zQ==",
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.0.1.tgz",
+      "integrity": "sha512-n5M855fKb2SsfMIiFFoVrABHJC8QtHwVx+mHWP3QcEqBHYienj5dHSgjbxtC0WEZXYt4wcD6zrQElDPhFuZgfA==",
       "engines": {
         "node": ">=12"
       },
@@ -3757,20 +3771,20 @@
       }
     },
     "node_modules/@nextcloud/vue/node_modules/char-regex": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/char-regex/-/char-regex-2.0.0.tgz",
-      "integrity": "sha512-oGu2QekBMXgyQNWPDRQ001bjvDnZe4/zBTz37TMbiKz1NbNiyiH5hRkobe7npRN6GfbGbxMYFck/vQ1r9c1VMA==",
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/char-regex/-/char-regex-2.0.1.tgz",
+      "integrity": "sha512-oSvEeo6ZUD7NepqAat3RqoucZ5SeqLJgOvVIwkafu6IP3V0pO38s/ypdVUmDDK6qIIHNlYHJAKX9E7R7HoKElw==",
       "engines": {
         "node": ">=12.20"
       }
     },
     "node_modules/@nextcloud/vue/node_modules/emoji-mart-vue-fast": {
-      "version": "10.2.1",
-      "resolved": "https://registry.npmjs.org/emoji-mart-vue-fast/-/emoji-mart-vue-fast-10.2.1.tgz",
-      "integrity": "sha512-PtKihhsXBEEw1jHwnoRyJAnJP1OlK4EJrEze58EbUUV7iHWGLub+yuiNSj2Uo1JBHraz4fw/pH98nFysVoe0qg==",
+      "version": "11.1.1",
+      "resolved": "https://registry.npmjs.org/emoji-mart-vue-fast/-/emoji-mart-vue-fast-11.1.1.tgz",
+      "integrity": "sha512-mMN49N2lCQCjanSzLYBS1PlBO+7Do092FnrsWwogwmOo4p+L8N3L8TjcDk30ByXMCjSEcCDsjupCxIcaBpVNKg==",
       "dependencies": {
         "@babel/polyfill": "^7.12.1",
-        "@babel/runtime": "^7.16.3",
+        "@babel/runtime": "^7.18.6",
         "vue-virtual-scroller": "^1.0.10"
       },
       "peerDependencies": {
@@ -3778,9 +3792,9 @@
       }
     },
     "node_modules/@nextcloud/vue/node_modules/linkify-string": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/linkify-string/-/linkify-string-3.0.3.tgz",
-      "integrity": "sha512-mYfEM39FgGyoPPvi2PdAxEZXbjdJho8sxib+PLHs4/dc8qoHLklQIrxT8TN1Yeb902ZFkiZvTdn9Hfi1nPBqzg==",
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/linkify-string/-/linkify-string-3.0.4.tgz",
+      "integrity": "sha512-OnNqqRjlYXaXipIAbBC8sDXsSumI1ftatzFg141Pw9HEXWjTVLFcMZoKbFupshqWRavtNJ6QHLa+u6AlxxgeRw==",
       "peerDependencies": {
         "linkifyjs": "^3.0.0"
       }
@@ -3817,12 +3831,12 @@
       }
     },
     "node_modules/@nextcloud/vue/node_modules/string-length": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/string-length/-/string-length-5.0.0.tgz",
-      "integrity": "sha512-1qjpci3h1G7BUi6dt5uAVyrO2FMUdjj3XWU970/eQh0YKhlYZ8bJMC/+BUpD21YdEhmuHv2nnbUUn024+cC7YQ==",
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/string-length/-/string-length-5.0.1.tgz",
+      "integrity": "sha512-9Ep08KAMUn0OadnVaBuRdE2l615CQ508kr0XMadjClfYpdCyvrbFp6Taebo8yyxokQ4viUd/xPPUA4FGgUa0ow==",
       "dependencies": {
         "char-regex": "^2.0.0",
-        "strip-ansi": "^7.0.0"
+        "strip-ansi": "^7.0.1"
       },
       "engines": {
         "node": ">=12.20"
@@ -3832,11 +3846,11 @@
       }
     },
     "node_modules/@nextcloud/vue/node_modules/strip-ansi": {
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.0.0.tgz",
-      "integrity": "sha512-UhDTSnGF1dc0DRbUqr1aXwNoY3RgVkSWG8BrpnuFIxhP57IqbS7IRta2Gfiavds4yCxc5+fEAVVOgBZWnYkvzg==",
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.0.1.tgz",
+      "integrity": "sha512-cXNxvT8dFNRVfhVME3JAe98mkXDYN2O1l7jmcwMnOslDeESg1rF/OZMtK0nRAhiari1unG5cD4jG3rapUAkLbw==",
       "dependencies": {
-        "ansi-regex": "^6.0.0"
+        "ansi-regex": "^6.0.1"
       },
       "engines": {
         "node": ">=12"
@@ -6392,6 +6406,11 @@
         "node": ">=12"
       }
     },
+    "node_modules/date-format-parse": {
+      "version": "0.2.7",
+      "resolved": "https://registry.npmjs.org/date-format-parse/-/date-format-parse-0.2.7.tgz",
+      "integrity": "sha512-/+lyMUKoRogMuTeOVii6lUwjbVlesN9YRYLzZT/g3TEZ3uD9QnpjResujeEqUW+OSNbT7T1+SYdyEkTcRv+KDQ=="
+    },
     "node_modules/de-indent": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz",
@@ -7902,6 +7921,26 @@
       "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.1.1.tgz",
       "integrity": "sha512-zAoAQiudy+r5SvnSw3KJy5os/oRJYHzrzja/tBDqrZtNhUw8bt6y8OBzMWcjWr+8liV8Eb6yOhw8WZ7VFZ5ZzA=="
     },
+    "node_modules/floating-vue": {
+      "version": "1.0.0-beta.18",
+      "resolved": "https://registry.npmjs.org/floating-vue/-/floating-vue-1.0.0-beta.18.tgz",
+      "integrity": "sha512-mRFc78szc1BTbhlCa4okb7wAGPuH/IID+yqJ+yrTMQ038H8WIAsPV/WFgWCaXqe8d1Z12LkMqiHDVorCJy8M2A==",
+      "dependencies": {
+        "@floating-ui/dom": "^0.1.10",
+        "vue-resize": "^1.0.0"
+      },
+      "peerDependencies": {
+        "vue": "^2.6.10"
+      }
+    },
+    "node_modules/focus-trap": {
+      "version": "6.9.4",
+      "resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-6.9.4.tgz",
+      "integrity": "sha512-v2NTsZe2FF59Y+sDykKY+XjqZ0cPfhq/hikWVL88BqLivnNiEffAsac6rP6H45ff9wG9LL5ToiDqrLEP9GX9mw==",
+      "dependencies": {
+        "tabbable": "^5.3.3"
+      }
+    },
     "node_modules/follow-redirects": {
       "version": "1.15.0",
       "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.0.tgz",
@@ -12795,9 +12834,9 @@
       "integrity": "sha512-U+MTEOO0AiDzxwFvoa4JVnMV6mZlJKk2sBLt90s7G0Gd0Mlknc7kxEn3nuDPNZRta7O2uy8oLcZLVT+4sqNZHQ=="
     },
     "node_modules/splitpanes": {
-      "version": "2.3.6",
-      "resolved": "https://registry.npmjs.org/splitpanes/-/splitpanes-2.3.6.tgz",
-      "integrity": "sha512-2sif1pmOQw/N+/jRbVzqTJ32lkhJax8jQfaXCebRK/SFCadHOnAaXDcWW8PpEcr9vKpfzH7gxJ8Sq/74HECr/g=="
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/splitpanes/-/splitpanes-2.4.1.tgz",
+      "integrity": "sha512-kpEo1WuMXuc6QfdQdO2V/fl/trONlkUKp+pputsLTiW9RMtwEvjb4/aYGm2m3+KAzjmb+zLwr4A4SYZu74+pgQ=="
     },
     "node_modules/sprintf-js": {
       "version": "1.0.3",
@@ -13378,6 +13417,11 @@
       "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
       "dev": true
     },
+    "node_modules/tabbable": {
+      "version": "5.3.3",
+      "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-5.3.3.tgz",
+      "integrity": "sha512-QD9qKY3StfbZqWOPLp0++pOrAVb/HbUi5xCc8cUo4XjP19808oaMiDzn0leBY5mCespIBM0CIZePzZjgzR83kA=="
+    },
     "node_modules/table": {
       "version": "6.8.0",
       "resolved": "https://registry.npmjs.org/table/-/table-6.8.0.tgz",
@@ -14038,9 +14082,9 @@
       }
     },
     "node_modules/v-click-outside": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/v-click-outside/-/v-click-outside-3.1.2.tgz",
-      "integrity": "sha512-gMdRqfRE6m6XU6SiFi3dyBlFB2MWogiXpof8Aa3LQysrl9pzTndqp/iEaAphLoadaQUFnQ0ec6fLLaxr7LiY6A==",
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/v-click-outside/-/v-click-outside-3.2.0.tgz",
+      "integrity": "sha512-QD0bDy38SHJXQBjgnllmkI/rbdiwmq9RC+/+pvrFjYJKTn8dtp7Penf9q1lLBta280fYG2q53mgLhQ+3l3z74w==",
       "engines": {
         "node": ">=6"
       }
@@ -14223,9 +14267,9 @@
       }
     },
     "node_modules/vue-material-design-icons": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/vue-material-design-icons/-/vue-material-design-icons-5.0.0.tgz",
-      "integrity": "sha512-lYSJFW/TyQqmg7MvUbEB8ua1mwWy/v8qve7QJuA/UWUAXC4/yVUdAm4pg/sM9+k5n7VLckBv6ucOROuGBsGPDQ=="
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/vue-material-design-icons/-/vue-material-design-icons-5.1.2.tgz",
+      "integrity": "sha512-nD1qFM2qAkMlVoe23EfNKIeMfYl6YjHZjSty9q0mwc2gXmPmvEhixywJQhM+VF5KVBI1zAkVTNLoUEERPY10pA=="
     },
     "node_modules/vue-multiselect": {
       "version": "2.1.6",
@@ -14392,21 +14436,16 @@
       "integrity": "sha512-yaX2its9XAJKGuQqf7LsiZHHSkxsIK8rmCOQOvEGEoF41blKRK8qr9my4qYoD6ikdLss4n8tKqYBecmaY0+WJg=="
     },
     "node_modules/vue2-datepicker": {
-      "version": "3.9.0",
-      "resolved": "https://registry.npmjs.org/vue2-datepicker/-/vue2-datepicker-3.9.0.tgz",
-      "integrity": "sha512-nRqIZx5Ks0TDHFyzyHYIlfmuszEsEvRhwJ6HGuGGHQpjOfrIgkJ9B0pnEEJaVS3LKX6IWCVQMUq0H7I2UKmHqA==",
+      "version": "3.11.0",
+      "resolved": "https://registry.npmjs.org/vue2-datepicker/-/vue2-datepicker-3.11.0.tgz",
+      "integrity": "sha512-zbMkAjYwDTXZozZtkpSwqxq7nEeBt7zoHL+oQcdjEXAqzJHhmatE6sl6JSr58PMIx2WOK0c6QBXozSqT32iQAQ==",
       "dependencies": {
-        "date-format-parse": "^0.2.6"
+        "date-format-parse": "^0.2.7"
       },
       "peerDependencies": {
         "vue": "^2.5.0"
       }
     },
-    "node_modules/vue2-datepicker/node_modules/date-format-parse": {
-      "version": "0.2.6",
-      "resolved": "https://registry.npmjs.org/date-format-parse/-/date-format-parse-0.2.6.tgz",
-      "integrity": "sha512-sdxnYAWmLopeb+6Hmw+vo3or4OCJOnh4+YoJ9p+Id3o2EnNP0INpTqx7wr8UregfMpgaSZAH473R/ytiaB3gVg=="
-    },
     "node_modules/vuex": {
       "version": "3.6.2",
       "resolved": "https://registry.npmjs.org/vuex/-/vuex-3.6.2.tgz",
@@ -16134,9 +16173,9 @@
       }
     },
     "@babel/runtime": {
-      "version": "7.17.9",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.17.9.tgz",
-      "integrity": "sha512-lSiBBvodq29uShpWGNbgFdKYNiFDo5/HIYsaCEY9ff4sb10x9jizo2+pRrSyF4jKZCXqgzuqBOQKbUm90gQwJg==",
+      "version": "7.18.9",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.18.9.tgz",
+      "integrity": "sha512-lkqXDcvlFT5rvEjiu6+QYO+1GXrEHRo2LOtS7E4GtX5ESIZOgepqsZBVIj6Pv+a6zqsya9VCgiK1KAK4BvJDAw==",
       "requires": {
         "regenerator-runtime": "^0.13.4"
       }
@@ -16808,6 +16847,19 @@
         }
       }
     },
+    "@floating-ui/core": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-0.3.1.tgz",
+      "integrity": "sha512-ensKY7Ub59u16qsVIFEo2hwTCqZ/r9oZZFh51ivcLGHfUwTn8l1Xzng8RJUe91H/UP8PeqeBronAGx0qmzwk2g=="
+    },
+    "@floating-ui/dom": {
+      "version": "0.1.10",
+      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-0.1.10.tgz",
+      "integrity": "sha512-4kAVoogvQm2N0XE0G6APQJuCNuErjOfPW8Ux7DFxh8+AfugWflwVJ5LDlHOwrwut7z/30NUvdtHzQ3zSip4EzQ==",
+      "requires": {
+        "@floating-ui/core": "^0.3.0"
+      }
+    },
     "@gar/promisify": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/@gar/promisify/-/promisify-1.1.2.tgz",
@@ -17293,9 +17345,9 @@
       "requires": {}
     },
     "@nextcloud/capabilities": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@nextcloud/capabilities/-/capabilities-1.0.2.tgz",
-      "integrity": "sha512-HR5vnT2GKTvoQla/WdP+V0/MD1eAGUNWCM0QXVGXQ0TCHb0AORYYMdEQafROsjNSH2kriArFnS/l3YZQrUa9yA==",
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@nextcloud/capabilities/-/capabilities-1.0.4.tgz",
+      "integrity": "sha512-xsmwPPUJ8NN7YfLcq0gpDTibeb9lMBvY/bffMFnHcZi8hMGOouPiEY+CWAgJ5I9W6I2vNeacHUuTanEN5Ncb2A==",
       "requires": {
         "@nextcloud/initial-state": "^1.1.2",
         "core-js": "^3.6.4"
@@ -17447,38 +17499,39 @@
       }
     },
     "@nextcloud/vue": {
-      "version": "5.3.1",
-      "resolved": "https://registry.npmjs.org/@nextcloud/vue/-/vue-5.3.1.tgz",
-      "integrity": "sha512-f+OSbcS01s2UqYiLSUufJ8tGe5+SqALj1dysPGJm8pJ+R2zH+Pdl8R13YErwzdAa0nHwyISIp9L9MEOUItixRQ==",
+      "version": "6.0.0-beta.3",
+      "resolved": "https://registry.npmjs.org/@nextcloud/vue/-/vue-6.0.0-beta.3.tgz",
+      "integrity": "sha512-Fnenptz/55KIcXP8kDcjUz8Xcm0EARfSkvnpgQvJh12fd1Xkf8B8ziHQAfAPozsV3RmXDbTeGiuQ4VQCQ/rSzw==",
       "requires": {
-        "@nextcloud/auth": "^1.2.3",
-        "@nextcloud/axios": "^1.3.2",
+        "@nextcloud/auth": "^1.3.0",
+        "@nextcloud/axios": "^1.10.0",
         "@nextcloud/browser-storage": "^0.1.1",
         "@nextcloud/calendar-js": "^3.0.0",
-        "@nextcloud/capabilities": "^1.0.2",
-        "@nextcloud/dialogs": "^3.0.0",
-        "@nextcloud/event-bus": "^2.0.0",
-        "@nextcloud/l10n": "^1.2.3",
-        "@nextcloud/logger": "^2.0.0",
+        "@nextcloud/capabilities": "^1.0.4",
+        "@nextcloud/dialogs": "^3.1.4",
+        "@nextcloud/event-bus": "^2.1.1",
+        "@nextcloud/l10n": "^1.6.0",
+        "@nextcloud/logger": "^2.2.1",
         "@nextcloud/router": "^2.0.0",
         "debounce": "1.2.1",
-        "emoji-mart-vue-fast": "^10.2.1",
+        "emoji-mart-vue-fast": "^11.1.1",
         "escape-html": "^1.0.3",
+        "floating-vue": "^1.0.0-beta.18",
+        "focus-trap": "^6.9.4",
         "hammerjs": "^2.0.8",
-        "linkify-string": "^3.0.2",
-        "md5": "^2.2.1",
-        "splitpanes": "^2.3.6",
-        "string-length": "^5.0.0",
-        "striptags": "^3.1.1",
+        "linkify-string": "^3.0.4",
+        "md5": "^2.3.0",
+        "splitpanes": "^2.4.1",
+        "string-length": "^5.0.1",
+        "striptags": "^3.2.0",
         "style-loader": "^3.3.1",
         "tributejs": "^5.1.3",
-        "v-click-outside": "^3.0.1",
-        "v-tooltip": "^2.0.3",
-        "vue": "^2.6.14",
-        "vue-color": "^2.7.1",
-        "vue-material-design-icons": "^5.0.0",
+        "v-click-outside": "^3.2.0",
+        "vue": "^2.7.8",
+        "vue-color": "^2.8.1",
+        "vue-material-design-icons": "^5.1.2",
         "vue-multiselect": "^2.1.6",
-        "vue2-datepicker": "^3.6.3"
+        "vue2-datepicker": "^3.11.0"
       },
       "dependencies": {
         "@nextcloud/auth": {
@@ -17514,9 +17567,9 @@
           }
         },
         "@nextcloud/event-bus": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/@nextcloud/event-bus/-/event-bus-2.0.0.tgz",
-          "integrity": "sha512-92lEJeDfOLU320mWb2Dm/EtHaRKiyOSSZyfz3MRrbtxja5up8iFK0EVizE5qO3o718Iyy3a6xw/G5Ztwy40EoA==",
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/@nextcloud/event-bus/-/event-bus-2.1.1.tgz",
+          "integrity": "sha512-YEui6N+23uyjBSIUZhf8rEjG9vol7UGgxcgxMddEbO0HS7M/sh1cocRqtn+ZVi/yPybeToGmt68SDPCgwHQHKw==",
           "requires": {
             "@types/semver": "^7.1.0",
             "core-js": "^3.6.2",
@@ -17524,29 +17577,29 @@
           }
         },
         "ansi-regex": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.0.0.tgz",
-          "integrity": "sha512-tAaOSrWCHF+1Ear1Z4wnJCXA9GGox4K6Ic85a5qalES2aeEwQGr7UC93mwef49536PkCYjzkp0zIxfFvexJ6zQ=="
+          "version": "6.0.1",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.0.1.tgz",
+          "integrity": "sha512-n5M855fKb2SsfMIiFFoVrABHJC8QtHwVx+mHWP3QcEqBHYienj5dHSgjbxtC0WEZXYt4wcD6zrQElDPhFuZgfA=="
         },
         "char-regex": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/char-regex/-/char-regex-2.0.0.tgz",
-          "integrity": "sha512-oGu2QekBMXgyQNWPDRQ001bjvDnZe4/zBTz37TMbiKz1NbNiyiH5hRkobe7npRN6GfbGbxMYFck/vQ1r9c1VMA=="
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/char-regex/-/char-regex-2.0.1.tgz",
+          "integrity": "sha512-oSvEeo6ZUD7NepqAat3RqoucZ5SeqLJgOvVIwkafu6IP3V0pO38s/ypdVUmDDK6qIIHNlYHJAKX9E7R7HoKElw=="
         },
         "emoji-mart-vue-fast": {
-          "version": "10.2.1",
-          "resolved": "https://registry.npmjs.org/emoji-mart-vue-fast/-/emoji-mart-vue-fast-10.2.1.tgz",
-          "integrity": "sha512-PtKihhsXBEEw1jHwnoRyJAnJP1OlK4EJrEze58EbUUV7iHWGLub+yuiNSj2Uo1JBHraz4fw/pH98nFysVoe0qg==",
+          "version": "11.1.1",
+          "resolved": "https://registry.npmjs.org/emoji-mart-vue-fast/-/emoji-mart-vue-fast-11.1.1.tgz",
+          "integrity": "sha512-mMN49N2lCQCjanSzLYBS1PlBO+7Do092FnrsWwogwmOo4p+L8N3L8TjcDk30ByXMCjSEcCDsjupCxIcaBpVNKg==",
           "requires": {
             "@babel/polyfill": "^7.12.1",
-            "@babel/runtime": "^7.16.3",
+            "@babel/runtime": "^7.18.6",
             "vue-virtual-scroller": "^1.0.10"
           }
         },
         "linkify-string": {
-          "version": "3.0.3",
-          "resolved": "https://registry.npmjs.org/linkify-string/-/linkify-string-3.0.3.tgz",
-          "integrity": "sha512-mYfEM39FgGyoPPvi2PdAxEZXbjdJho8sxib+PLHs4/dc8qoHLklQIrxT8TN1Yeb902ZFkiZvTdn9Hfi1nPBqzg==",
+          "version": "3.0.4",
+          "resolved": "https://registry.npmjs.org/linkify-string/-/linkify-string-3.0.4.tgz",
+          "integrity": "sha512-OnNqqRjlYXaXipIAbBC8sDXsSumI1ftatzFg141Pw9HEXWjTVLFcMZoKbFupshqWRavtNJ6QHLa+u6AlxxgeRw==",
           "requires": {}
         },
         "linkifyjs": {
@@ -17572,20 +17625,20 @@
           }
         },
         "string-length": {
-          "version": "5.0.0",
-          "resolved": "https://registry.npmjs.org/string-length/-/string-length-5.0.0.tgz",
-          "integrity": "sha512-1qjpci3h1G7BUi6dt5uAVyrO2FMUdjj3XWU970/eQh0YKhlYZ8bJMC/+BUpD21YdEhmuHv2nnbUUn024+cC7YQ==",
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/string-length/-/string-length-5.0.1.tgz",
+          "integrity": "sha512-9Ep08KAMUn0OadnVaBuRdE2l615CQ508kr0XMadjClfYpdCyvrbFp6Taebo8yyxokQ4viUd/xPPUA4FGgUa0ow==",
           "requires": {
             "char-regex": "^2.0.0",
-            "strip-ansi": "^7.0.0"
+            "strip-ansi": "^7.0.1"
           }
         },
         "strip-ansi": {
-          "version": "7.0.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.0.0.tgz",
-          "integrity": "sha512-UhDTSnGF1dc0DRbUqr1aXwNoY3RgVkSWG8BrpnuFIxhP57IqbS7IRta2Gfiavds4yCxc5+fEAVVOgBZWnYkvzg==",
+          "version": "7.0.1",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.0.1.tgz",
+          "integrity": "sha512-cXNxvT8dFNRVfhVME3JAe98mkXDYN2O1l7jmcwMnOslDeESg1rF/OZMtK0nRAhiari1unG5cD4jG3rapUAkLbw==",
           "requires": {
-            "ansi-regex": "^6.0.0"
+            "ansi-regex": "^6.0.1"
           }
         },
         "yallist": {
@@ -19696,6 +19749,11 @@
         }
       }
     },
+    "date-format-parse": {
+      "version": "0.2.7",
+      "resolved": "https://registry.npmjs.org/date-format-parse/-/date-format-parse-0.2.7.tgz",
+      "integrity": "sha512-/+lyMUKoRogMuTeOVii6lUwjbVlesN9YRYLzZT/g3TEZ3uD9QnpjResujeEqUW+OSNbT7T1+SYdyEkTcRv+KDQ=="
+    },
     "de-indent": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz",
@@ -20813,6 +20871,23 @@
       "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.1.1.tgz",
       "integrity": "sha512-zAoAQiudy+r5SvnSw3KJy5os/oRJYHzrzja/tBDqrZtNhUw8bt6y8OBzMWcjWr+8liV8Eb6yOhw8WZ7VFZ5ZzA=="
     },
+    "floating-vue": {
+      "version": "1.0.0-beta.18",
+      "resolved": "https://registry.npmjs.org/floating-vue/-/floating-vue-1.0.0-beta.18.tgz",
+      "integrity": "sha512-mRFc78szc1BTbhlCa4okb7wAGPuH/IID+yqJ+yrTMQ038H8WIAsPV/WFgWCaXqe8d1Z12LkMqiHDVorCJy8M2A==",
+      "requires": {
+        "@floating-ui/dom": "^0.1.10",
+        "vue-resize": "^1.0.0"
+      }
+    },
+    "focus-trap": {
+      "version": "6.9.4",
+      "resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-6.9.4.tgz",
+      "integrity": "sha512-v2NTsZe2FF59Y+sDykKY+XjqZ0cPfhq/hikWVL88BqLivnNiEffAsac6rP6H45ff9wG9LL5ToiDqrLEP9GX9mw==",
+      "requires": {
+        "tabbable": "^5.3.3"
+      }
+    },
     "follow-redirects": {
       "version": "1.15.0",
       "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.0.tgz",
@@ -24310,9 +24385,9 @@
       "integrity": "sha512-U+MTEOO0AiDzxwFvoa4JVnMV6mZlJKk2sBLt90s7G0Gd0Mlknc7kxEn3nuDPNZRta7O2uy8oLcZLVT+4sqNZHQ=="
     },
     "splitpanes": {
-      "version": "2.3.6",
-      "resolved": "https://registry.npmjs.org/splitpanes/-/splitpanes-2.3.6.tgz",
-      "integrity": "sha512-2sif1pmOQw/N+/jRbVzqTJ32lkhJax8jQfaXCebRK/SFCadHOnAaXDcWW8PpEcr9vKpfzH7gxJ8Sq/74HECr/g=="
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/splitpanes/-/splitpanes-2.4.1.tgz",
+      "integrity": "sha512-kpEo1WuMXuc6QfdQdO2V/fl/trONlkUKp+pputsLTiW9RMtwEvjb4/aYGm2m3+KAzjmb+zLwr4A4SYZu74+pgQ=="
     },
     "sprintf-js": {
       "version": "1.0.3",
@@ -24734,6 +24809,11 @@
       "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
       "dev": true
     },
+    "tabbable": {
+      "version": "5.3.3",
+      "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-5.3.3.tgz",
+      "integrity": "sha512-QD9qKY3StfbZqWOPLp0++pOrAVb/HbUi5xCc8cUo4XjP19808oaMiDzn0leBY5mCespIBM0CIZePzZjgzR83kA=="
+    },
     "table": {
       "version": "6.8.0",
       "resolved": "https://registry.npmjs.org/table/-/table-6.8.0.tgz",
@@ -25225,9 +25305,9 @@
       "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg=="
     },
     "v-click-outside": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/v-click-outside/-/v-click-outside-3.1.2.tgz",
-      "integrity": "sha512-gMdRqfRE6m6XU6SiFi3dyBlFB2MWogiXpof8Aa3LQysrl9pzTndqp/iEaAphLoadaQUFnQ0ec6fLLaxr7LiY6A=="
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/v-click-outside/-/v-click-outside-3.2.0.tgz",
+      "integrity": "sha512-QD0bDy38SHJXQBjgnllmkI/rbdiwmq9RC+/+pvrFjYJKTn8dtp7Penf9q1lLBta280fYG2q53mgLhQ+3l3z74w=="
     },
     "v-tooltip": {
       "version": "2.1.3",
@@ -25375,9 +25455,9 @@
       }
     },
     "vue-material-design-icons": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/vue-material-design-icons/-/vue-material-design-icons-5.0.0.tgz",
-      "integrity": "sha512-lYSJFW/TyQqmg7MvUbEB8ua1mwWy/v8qve7QJuA/UWUAXC4/yVUdAm4pg/sM9+k5n7VLckBv6ucOROuGBsGPDQ=="
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/vue-material-design-icons/-/vue-material-design-icons-5.1.2.tgz",
+      "integrity": "sha512-nD1qFM2qAkMlVoe23EfNKIeMfYl6YjHZjSty9q0mwc2gXmPmvEhixywJQhM+VF5KVBI1zAkVTNLoUEERPY10pA=="
     },
     "vue-multiselect": {
       "version": "2.1.6",
@@ -25523,18 +25603,11 @@
       "integrity": "sha512-yaX2its9XAJKGuQqf7LsiZHHSkxsIK8rmCOQOvEGEoF41blKRK8qr9my4qYoD6ikdLss4n8tKqYBecmaY0+WJg=="
     },
     "vue2-datepicker": {
-      "version": "3.9.0",
-      "resolved": "https://registry.npmjs.org/vue2-datepicker/-/vue2-datepicker-3.9.0.tgz",
-      "integrity": "sha512-nRqIZx5Ks0TDHFyzyHYIlfmuszEsEvRhwJ6HGuGGHQpjOfrIgkJ9B0pnEEJaVS3LKX6IWCVQMUq0H7I2UKmHqA==",
+      "version": "3.11.0",
+      "resolved": "https://registry.npmjs.org/vue2-datepicker/-/vue2-datepicker-3.11.0.tgz",
+      "integrity": "sha512-zbMkAjYwDTXZozZtkpSwqxq7nEeBt7zoHL+oQcdjEXAqzJHhmatE6sl6JSr58PMIx2WOK0c6QBXozSqT32iQAQ==",
       "requires": {
-        "date-format-parse": "^0.2.6"
-      },
-      "dependencies": {
-        "date-format-parse": {
-          "version": "0.2.6",
-          "resolved": "https://registry.npmjs.org/date-format-parse/-/date-format-parse-0.2.6.tgz",
-          "integrity": "sha512-sdxnYAWmLopeb+6Hmw+vo3or4OCJOnh4+YoJ9p+Id3o2EnNP0INpTqx7wr8UregfMpgaSZAH473R/ytiaB3gVg=="
-        }
+        "date-format-parse": "^0.2.7"
       }
     },
     "vuex": {
diff --git a/package.json b/package.json
index 005c9659b9..044aad0ac1 100644
--- a/package.json
+++ b/package.json
@@ -42,7 +42,7 @@
     "@nextcloud/logger": "^2.2.1",
     "@nextcloud/moment": "^1.2.1",
     "@nextcloud/router": "^2.0.0",
-    "@nextcloud/vue": "^5.3.1",
+    "@nextcloud/vue": "^6.0.0-beta.3",
     "@nextcloud/vue-dashboard": "^2",
     "@riophae/vue-treeselect": "^0.4.0",
     "@vue/babel-preset-app": "^5.0.8",
diff --git a/src/components/AccountSettings.vue b/src/components/AccountSettings.vue
index 71da855fc5..ac20072e99 100644
--- a/src/components/AccountSettings.vue
+++ b/src/components/AccountSettings.vue
@@ -105,8 +105,8 @@ import EditorSettings from '../components/EditorSettings'
 import AccountDefaultsSettings from '../components/AccountDefaultsSettings'
 import SignatureSettings from '../components/SignatureSettings'
 import AliasSettings from '../components/AliasSettings'
-import AppSettingsDialog from '@nextcloud/vue/dist/Components/AppSettingsDialog'
-import AppSettingsSection from '@nextcloud/vue/dist/Components/AppSettingsSection'
+import AppSettingsDialog from '@nextcloud/vue/dist/Components/NcAppSettingsDialog'
+import AppSettingsSection from '@nextcloud/vue/dist/Components/NcAppSettingsSection'
 import TrustedSenders from './TrustedSenders'
 import SieveAccountForm from './SieveAccountForm'
 import SieveFilterForm from './SieveFilterForm'
diff --git a/src/components/AppSettingsMenu.vue b/src/components/AppSettingsMenu.vue
index 7df1bb782f..c04923a5f0 100644
--- a/src/components/AppSettingsMenu.vue
+++ b/src/components/AppSettingsMenu.vue
@@ -95,7 +95,7 @@
 <script>
 import { generateUrl } from '@nextcloud/router'
 import { showError } from '@nextcloud/dialogs'
-import Button from '@nextcloud/vue/dist/Components/Button'
+import Button from '@nextcloud/vue/dist/Components/NcButton'
 
 import IconInfo from 'vue-material-design-icons/Information'
 import IconEmail from 'vue-material-design-icons/Email'
diff --git a/src/components/AttachmentImageViewer.vue b/src/components/AttachmentImageViewer.vue
index 69265cc42d..aec7d631eb 100644
--- a/src/components/AttachmentImageViewer.vue
+++ b/src/components/AttachmentImageViewer.vue
@@ -9,7 +9,7 @@
 </template>
 
 <script>
-import Modal from '@nextcloud/vue/dist/Components/Modal'
+import Modal from '@nextcloud/vue/dist/Components/NcModal'
 export default {
 	name: 'AttachmentImageViewer',
 	components: {
diff --git a/src/components/Avatar.vue b/src/components/Avatar.vue
index 2b62fa925c..2b65cdd8a8 100644
--- a/src/components/Avatar.vue
+++ b/src/components/Avatar.vue
@@ -33,7 +33,7 @@
 </template>
 
 <script>
-import BaseAvatar from '@nextcloud/vue/dist/Components/Avatar'
+import BaseAvatar from '@nextcloud/vue/dist/Components/NcAvatar'
 import { fetchAvatarUrlMemoized } from '../service/AvatarService'
 import logger from '../logger'
 
diff --git a/src/components/Composer.vue b/src/components/Composer.vue
index 3be49ad31b..3e5b2289df 100644
--- a/src/components/Composer.vue
+++ b/src/components/Composer.vue
@@ -408,23 +408,23 @@ import isArray from 'lodash/fp/isArray'
 import trimStart from 'lodash/fp/trimCharsStart'
 import Autosize from 'vue-autosize'
 import debouncePromise from 'debounce-promise'
-import Actions from '@nextcloud/vue/dist/Components/Actions'
-import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
-import ActionCheckbox from '@nextcloud/vue/dist/Components/ActionCheckbox'
-import ActionInput from '@nextcloud/vue/dist/Components/ActionInput'
-import ActionRadio from '@nextcloud/vue/dist/Components/ActionRadio'
-import Button from '@nextcloud/vue/dist/Components/Button'
+import Actions from '@nextcloud/vue/dist/Components/NcActions'
+import ActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
+import ActionCheckbox from '@nextcloud/vue/dist/Components/NcActionCheckbox'
+import ActionInput from '@nextcloud/vue/dist/Components/NcActionInput'
+import ActionRadio from '@nextcloud/vue/dist/Components/NcActionRadio'
+import Button from '@nextcloud/vue/dist/Components/NcButton'
 import ChevronLeft from 'vue-material-design-icons/ChevronLeft'
 import Delete from 'vue-material-design-icons/Delete'
 import ComposerAttachments from './ComposerAttachments'
 import Download from 'vue-material-design-icons/Download'
-import EmptyContent from '@nextcloud/vue/dist/Components/EmptyContent'
+import EmptyContent from '@nextcloud/vue/dist/Components/NcEmptyContent'
 import IconUpload from 'vue-material-design-icons/Upload'
 import IconFolder from 'vue-material-design-icons/Folder'
 import IconPublic from 'vue-material-design-icons/Link'
 import IconCheck from 'vue-material-design-icons/Check'
-import Multiselect from '@nextcloud/vue/dist/Components/Multiselect'
-import ListItemIcon from '@nextcloud/vue/dist/Components/ListItemIcon'
+import Multiselect from '@nextcloud/vue/dist/Components/NcMultiselect'
+import ListItemIcon from '@nextcloud/vue/dist/Components/NcListItemIcon'
 import RecipientListItem from './RecipientListItem'
 import UnfoldMoreHorizontal from 'vue-material-design-icons/UnfoldMoreHorizontal'
 import UnfoldLessHorizontal from 'vue-material-design-icons/UnfoldLessHorizontal'
@@ -1396,9 +1396,6 @@ export default {
 	background-color: transparent;
 	border: none;
 }
-.send-action-radio {
-	padding: 5px 0 5px 0;
-}
 .send-button {
 	display: flex;
 	align-items: center;
diff --git a/src/components/Dashboard.vue b/src/components/Dashboard.vue
index 86d0db8fcc..53efc6e90d 100644
--- a/src/components/Dashboard.vue
+++ b/src/components/Dashboard.vue
@@ -63,7 +63,7 @@ import { generateUrl, imagePath } from '@nextcloud/router'
 import { DashboardWidget, DashboardWidgetItem } from '@nextcloud/vue-dashboard'
 import orderBy from 'lodash/fp/orderBy'
 import prop from 'lodash/fp/prop'
-import EmptyContent from '@nextcloud/vue/dist/Components/EmptyContent'
+import EmptyContent from '@nextcloud/vue/dist/Components/NcEmptyContent'
 import IconCheck from 'vue-material-design-icons/Check'
 
 import Avatar from '../components/Avatar'
diff --git a/src/components/Envelope.vue b/src/components/Envelope.vue
index 742ada41f8..598eb5adc0 100644
--- a/src/components/Envelope.vue
+++ b/src/components/Envelope.vue
@@ -236,8 +236,8 @@
 	</ListItem>
 </template>
 <script>
-import ListItem from '@nextcloud/vue/dist/Components/ListItem'
-import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
+import ListItem from '@nextcloud/vue/dist/Components/NcListItem'
+import ActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
 import AlertOctagonIcon from 'vue-material-design-icons/AlertOctagon'
 import Avatar from './Avatar'
 import { calculateAccountColor } from '../util/AccountColor'
@@ -272,7 +272,7 @@ import EventModal from './EventModal'
 import EnvelopePrimaryActions from './EnvelopePrimaryActions'
 import { hiddenTags } from './tags.js'
 import { generateUrl } from '@nextcloud/router'
-import ActionLink from '@nextcloud/vue/dist/Components/ActionLink'
+import ActionLink from '@nextcloud/vue/dist/Components/NcActionLink'
 import DownloadIcon from 'vue-material-design-icons/Download'
 
 export default {
diff --git a/src/components/EnvelopeList.vue b/src/components/EnvelopeList.vue
index 98596ad26d..3cb3cc362a 100644
--- a/src/components/EnvelopeList.vue
+++ b/src/components/EnvelopeList.vue
@@ -207,8 +207,8 @@
 </template>
 
 <script>
-import Actions from '@nextcloud/vue/dist/Components/Actions'
-import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
+import Actions from '@nextcloud/vue/dist/Components/NcActions'
+import ActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
 import { showError } from '@nextcloud/dialogs'
 import Envelope from './Envelope'
 import IconDelete from 'vue-material-design-icons/Delete'
diff --git a/src/components/EventModal.vue b/src/components/EventModal.vue
index f65d3ec8e2..ebdded3690 100644
--- a/src/components/EventModal.vue
+++ b/src/components/EventModal.vue
@@ -60,11 +60,11 @@
 
 <script>
 import { createEvent, getTimezoneManager, DateTimeValue, TextProperty } from '@nextcloud/calendar-js'
-import DatetimePicker from '@nextcloud/vue/dist/Components/DatetimePicker'
+import DatetimePicker from '@nextcloud/vue/dist/Components/NcDatetimePicker'
 import jstz from 'jstz'
-import Modal from '@nextcloud/vue/dist/Components/Modal'
+import Modal from '@nextcloud/vue/dist/Components/NcModal'
 
-import Multiselect from '@nextcloud/vue/dist/Components/Multiselect'
+import Multiselect from '@nextcloud/vue/dist/Components/NcMultiselect'
 import { getUserCalendars, importCalendarEvent } from '../service/DAVService'
 import logger from '../logger'
 import CalendarPickerOption from './CalendarPickerOption'
diff --git a/src/components/Imip.vue b/src/components/Imip.vue
index c2be3e08d6..252e30bb38 100644
--- a/src/components/Imip.vue
+++ b/src/components/Imip.vue
@@ -64,8 +64,8 @@
 
 <script>
 import EventData from './imip/EventData'
-// import Button from '@nextcloud/vue/dist/Components/Button'
-// import Actions from '@nextcloud/vue/dist/Components/Actions'
+// import Button from '@nextcloud/vue/dist/Components/NcButton'
+// import Actions from '@nextcloud/vue/dist/Components/NcActions'
 import CloseIcon from 'vue-material-design-icons/Close'
 import CalendarIcon from 'vue-material-design-icons/Calendar'
 import { getParserManager } from '@nextcloud/calendar-js'
diff --git a/src/components/MailboxPicker.vue b/src/components/MailboxPicker.vue
index 31f445dddc..6039e71fd3 100644
--- a/src/components/MailboxPicker.vue
+++ b/src/components/MailboxPicker.vue
@@ -58,7 +58,7 @@
 	</Modal>
 </template>
 <script>
-import Modal from '@nextcloud/vue/dist/Components/Modal'
+import Modal from '@nextcloud/vue/dist/Components/NcModal'
 import IconBreadcrumb from 'vue-material-design-icons/ChevronRight'
 import IconInbox from 'vue-material-design-icons/Home'
 import IconDraft from 'vue-material-design-icons/Pencil'
diff --git a/src/components/MailboxThread.vue b/src/components/MailboxThread.vue
index 8b14af1e02..e0eef81d63 100644
--- a/src/components/MailboxThread.vue
+++ b/src/components/MailboxThread.vue
@@ -65,10 +65,10 @@
 </template>
 
 <script>
-import AppContent from '@nextcloud/vue/dist/Components/AppContent'
-import AppContentList from '@nextcloud/vue/dist/Components/AppContentList'
-import Button from '@nextcloud/vue/dist/Components/Button'
-import Popover from '@nextcloud/vue/dist/Components/Popover'
+import AppContent from '@nextcloud/vue/dist/Components/NcAppContent'
+import AppContentList from '@nextcloud/vue/dist/Components/NcAppContentList'
+import Button from '@nextcloud/vue/dist/Components/NcButton'
+import Popover from '@nextcloud/vue/dist/Components/NcPopover'
 import isMobile from '@nextcloud/vue/dist/Mixins/isMobile'
 import SectionTitle from './SectionTitle'
 import NewMessageButtonHeader from './NewMessageButtonHeader'
diff --git a/src/components/MenuEnvelope.vue b/src/components/MenuEnvelope.vue
index 212b9d6370..758d8bdc9a 100644
--- a/src/components/MenuEnvelope.vue
+++ b/src/components/MenuEnvelope.vue
@@ -195,9 +195,9 @@
 
 <script>
 import axios from '@nextcloud/axios'
-import Actions from '@nextcloud/vue/dist/Components/Actions'
-import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
-import ActionLink from '@nextcloud/vue/dist/Components/ActionLink'
+import Actions from '@nextcloud/vue/dist/Components/NcActions'
+import ActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
+import ActionLink from '@nextcloud/vue/dist/Components/NcActionLink'
 import AlertOctagonIcon from 'vue-material-design-icons/AlertOctagon'
 import { Base64 } from 'js-base64'
 import { buildRecipients as buildReplyRecipients } from '../ReplyBuilder'
@@ -210,7 +210,7 @@ import EventModal from './EventModal'
 import { generateUrl } from '@nextcloud/router'
 import InformationIcon from 'vue-material-design-icons/Information'
 import ImportantIcon from './icons/ImportantIcon'
-import Modal from '@nextcloud/vue/dist/Components/Modal'
+import Modal from '@nextcloud/vue/dist/Components/NcModal'
 import MoveModal from './MoveModal'
 import OpenInNewIcon from 'vue-material-design-icons/OpenInNew'
 import PlusIcon from 'vue-material-design-icons/Plus'
diff --git a/src/components/MessageAttachment.vue b/src/components/MessageAttachment.vue
index 18164c29b2..85c8643332 100644
--- a/src/components/MessageAttachment.vue
+++ b/src/components/MessageAttachment.vue
@@ -67,9 +67,9 @@ import { formatFileSize } from '@nextcloud/files'
 import { translate as t } from '@nextcloud/l10n'
 import { getFilePickerBuilder } from '@nextcloud/dialogs'
 import { mixin as onClickOutside } from 'vue-on-click-outside'
-import PopoverMenu from '@nextcloud/vue/dist/Components/PopoverMenu'
-import Actions from '@nextcloud/vue/dist/Components/Actions'
-import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
+import PopoverMenu from '@nextcloud/vue/dist/Components/NcPopoverMenu'
+import Actions from '@nextcloud/vue/dist/Components/NcActions'
+import ActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
 
 import Logger from '../logger'
 
diff --git a/src/components/MessageHTMLBody.vue b/src/components/MessageHTMLBody.vue
index d18cc93df2..81c7811a6a 100644
--- a/src/components/MessageHTMLBody.vue
+++ b/src/components/MessageHTMLBody.vue
@@ -43,8 +43,8 @@
 import { iframeResizer } from 'iframe-resizer'
 import PrintScout from 'printscout'
 import { trustSender } from '../service/TrustedSenderService'
-import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
-import Actions from '@nextcloud/vue/dist/Components/Actions'
+import ActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
+import Actions from '@nextcloud/vue/dist/Components/NcActions'
 import IconImage from 'vue-material-design-icons/ImageSizeSelectActual'
 import IconMail from 'vue-material-design-icons/Email'
 import IconDomain from 'vue-material-design-icons/Domain'
diff --git a/src/components/Navigation.vue b/src/components/Navigation.vue
index 7642395d2a..db622dad9d 100644
--- a/src/components/Navigation.vue
+++ b/src/components/Navigation.vue
@@ -78,11 +78,11 @@
 </template>
 
 <script>
-import AppNavigation from '@nextcloud/vue/dist/Components/AppNavigation'
+import AppNavigation from '@nextcloud/vue/dist/Components/NcAppNavigation'
 import AppNavigationSettings
-	from '@nextcloud/vue/dist/Components/AppNavigationSettings'
+	from '@nextcloud/vue/dist/Components/NcAppNavigationSettings'
 import AppNavigationSpacer
-	from '@nextcloud/vue/dist/Components/AppNavigationSpacer'
+	from '@nextcloud/vue/dist/Components/NcAppNavigationSpacer'
 
 import NavigationAccount from './NavigationAccount'
 import NavigationAccountExpandCollapse from './NavigationAccountExpandCollapse'
diff --git a/src/components/NavigationAccount.vue b/src/components/NavigationAccount.vue
index ce3d3d13be..5de90e246c 100644
--- a/src/components/NavigationAccount.vue
+++ b/src/components/NavigationAccount.vue
@@ -105,11 +105,11 @@
 </template>
 
 <script>
-import AppNavigationItem from '@nextcloud/vue/dist/Components/AppNavigationItem'
-import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
-import ActionCheckbox from '@nextcloud/vue/dist/Components/ActionCheckbox'
-import ActionInput from '@nextcloud/vue/dist/Components/ActionInput'
-import ActionText from '@nextcloud/vue/dist/Components/ActionText'
+import AppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem'
+import ActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
+import ActionCheckbox from '@nextcloud/vue/dist/Components/NcActionCheckbox'
+import ActionInput from '@nextcloud/vue/dist/Components/NcActionInput'
+import ActionText from '@nextcloud/vue/dist/Components/NcActionText'
 import { formatFileSize } from '@nextcloud/files'
 import { generateUrl } from '@nextcloud/router'
 
diff --git a/src/components/NavigationAccountExpandCollapse.vue b/src/components/NavigationAccountExpandCollapse.vue
index b512193eb6..4264aef16e 100644
--- a/src/components/NavigationAccountExpandCollapse.vue
+++ b/src/components/NavigationAccountExpandCollapse.vue
@@ -24,7 +24,7 @@
 </template>
 
 <script>
-import AppNavigationItem from '@nextcloud/vue/dist/Components/AppNavigationItem'
+import AppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem'
 import logger from '../logger'
 
 export default {
diff --git a/src/components/NavigationMailbox.vue b/src/components/NavigationMailbox.vue
index 6f3cad2630..f6fe5c5137 100644
--- a/src/components/NavigationMailbox.vue
+++ b/src/components/NavigationMailbox.vue
@@ -196,12 +196,12 @@
 </template>
 
 <script>
-import AppNavigationItem from '@nextcloud/vue/dist/Components/AppNavigationItem'
-import AppNavigationCounter from '@nextcloud/vue/dist/Components/AppNavigationCounter'
-import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
-import ActionCheckbox from '@nextcloud/vue/dist/Components/ActionCheckbox'
-import ActionInput from '@nextcloud/vue/dist/Components/ActionInput'
-import ActionText from '@nextcloud/vue/dist/Components/ActionText'
+import AppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem'
+import AppNavigationCounter from '@nextcloud/vue/dist/Components/NcAppNavigationCounter'
+import ActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
+import ActionCheckbox from '@nextcloud/vue/dist/Components/NcActionCheckbox'
+import ActionInput from '@nextcloud/vue/dist/Components/NcActionInput'
+import ActionText from '@nextcloud/vue/dist/Components/NcActionText'
 import IconEmailCheck from 'vue-material-design-icons/EmailCheck'
 import IconExternal from 'vue-material-design-icons/OpenInNew'
 import IconFolder from 'vue-material-design-icons/Folder'
diff --git a/src/components/NavigationOutbox.vue b/src/components/NavigationOutbox.vue
index 458269225d..9a1b3674ec 100644
--- a/src/components/NavigationOutbox.vue
+++ b/src/components/NavigationOutbox.vue
@@ -40,8 +40,8 @@
 </template>
 
 <script>
-import AppNavigationItem from '@nextcloud/vue/dist/Components/AppNavigationItem'
-import CounterBubble from '@nextcloud/vue/dist/Components/CounterBubble'
+import AppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem'
+import CounterBubble from '@nextcloud/vue/dist/Components/NcCounterBubble'
 import IconOutbox from 'vue-material-design-icons/InboxArrowUp'
 
 export default {
diff --git a/src/components/NewMessageButtonHeader.vue b/src/components/NewMessageButtonHeader.vue
index 05ea612d78..a97f9c052a 100644
--- a/src/components/NewMessageButtonHeader.vue
+++ b/src/components/NewMessageButtonHeader.vue
@@ -27,7 +27,7 @@
 </template>
 
 <script>
-import Button from '@nextcloud/vue/dist/Components/Button'
+import Button from '@nextcloud/vue/dist/Components/NcButton'
 import IconAdd from 'vue-material-design-icons/Plus'
 import IconRefresh from 'vue-material-design-icons/Refresh'
 import logger from '../logger'
diff --git a/src/components/NewMessageModal.vue b/src/components/NewMessageModal.vue
index cf0a1795b4..857c91a7d8 100644
--- a/src/components/NewMessageModal.vue
+++ b/src/components/NewMessageModal.vue
@@ -24,7 +24,7 @@
 	</Modal>
 </template>
 <script>
-import Modal from '@nextcloud/vue/dist/Components/Modal'
+import Modal from '@nextcloud/vue/dist/Components/NcModal'
 import logger from '../logger'
 import { toPlain, toHtml, plain } from '../util/text'
 import { saveDraft } from '../service/MessageService'
diff --git a/src/components/NoMessageSelected.vue b/src/components/NoMessageSelected.vue
index 5df96bb30c..9e97ff0b27 100644
--- a/src/components/NoMessageSelected.vue
+++ b/src/components/NoMessageSelected.vue
@@ -30,7 +30,7 @@
 </template>
 
 <script>
-import AppContentDetails from '@nextcloud/vue/dist/Components/AppContentDetails'
+import AppContentDetails from '@nextcloud/vue/dist/Components/NcAppContentDetails'
 import IconMail from 'vue-material-design-icons/Email'
 
 export default {
diff --git a/src/components/Outbox.vue b/src/components/Outbox.vue
index f48fc75055..535e0d1b77 100644
--- a/src/components/Outbox.vue
+++ b/src/components/Outbox.vue
@@ -51,8 +51,8 @@
 </template>
 
 <script>
-import AppContent from '@nextcloud/vue/dist/Components/AppContent'
-import AppContentList from '@nextcloud/vue/dist/Components/AppContentList'
+import AppContent from '@nextcloud/vue/dist/Components/NcAppContent'
+import AppContentList from '@nextcloud/vue/dist/Components/NcAppContentList'
 import Loading from './Loading'
 import Error from './Error'
 import EmptyMailbox from './EmptyMailbox'
diff --git a/src/components/OutboxMessageListItem.vue b/src/components/OutboxMessageListItem.vue
index f33407533c..9f0d306b78 100644
--- a/src/components/OutboxMessageListItem.vue
+++ b/src/components/OutboxMessageListItem.vue
@@ -57,8 +57,8 @@
 </template>
 
 <script>
-import ListItem from '@nextcloud/vue/dist/Components/ListItem'
-import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
+import ListItem from '@nextcloud/vue/dist/Components/NcListItem'
+import ActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
 import Avatar from './Avatar'
 import IconDelete from 'vue-material-design-icons/Delete'
 import { getLanguage, translate as t } from '@nextcloud/l10n'
diff --git a/src/components/RecipientBubble.vue b/src/components/RecipientBubble.vue
index 439d4e974d..ad9cd574da 100644
--- a/src/components/RecipientBubble.vue
+++ b/src/components/RecipientBubble.vue
@@ -88,9 +88,9 @@
 
 <script>
 import { generateUrl } from '@nextcloud/router'
-import UserBubble from '@nextcloud/vue/dist/Components/UserBubble'
-import Popover from '@nextcloud/vue/dist/Components/Popover'
-import Multiselect from '@nextcloud/vue/dist/Components/Multiselect'
+import UserBubble from '@nextcloud/vue/dist/Components/NcUserBubble'
+import Popover from '@nextcloud/vue/dist/Components/NcPopover'
+import Multiselect from '@nextcloud/vue/dist/Components/NcMultiselect'
 
 import { fetchAvatarUrlMemoized } from '../service/AvatarService'
 import { addToContact, findMatches, newContact, autoCompleteByName } from '../service/ContactIntegrationService'
diff --git a/src/components/RecipientListItem.vue b/src/components/RecipientListItem.vue
index 684f348e93..0c73dd2a55 100644
--- a/src/components/RecipientListItem.vue
+++ b/src/components/RecipientListItem.vue
@@ -4,27 +4,23 @@
 			:no-margin="true"
 			:title="option.label"
 			:avatar-size="24" />
-		<Actions>
-			<ActionButton @click.prevent="removeRecipient(option)">
-				<template #icon>
-					<Close :size="20" />
-				</template>
-			</ActionButton>
-		</Actions>
+		<Button type="tertiary-no-background" @click.prevent="removeRecipient(option)">
+			<template #icon>
+				<Close :size="20" />
+			</template>
+		</Button>
 	</div>
 </template>
 
 <script>
-import ListItemIcon from '@nextcloud/vue/dist/Components/ListItemIcon'
-import Actions from '@nextcloud/vue/dist/Components/Actions'
-import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
+import ListItemIcon from '@nextcloud/vue/dist/Components/NcListItemIcon'
+import Button from '@nextcloud/vue/dist/Components/NcButton'
 import Close from 'vue-material-design-icons/Close'
 export default {
 	name: 'RecipientListItem',
 	components: {
 		ListItemIcon,
-		Actions,
-		ActionButton,
+		Button,
 		Close,
 	},
 	props: {
@@ -46,7 +42,7 @@ export default {
 	.multiselect__tags
 	.multiselect__tags-wrap
 	.multiselect__tag--recipient {
-	padding: 0 25px 0 0;
+	padding: 0;
 	border-radius: 25px;
 	border-color: transparent;
 	background-color: var(--color-background-dark);
@@ -63,4 +59,7 @@ export default {
 	height: 24px;
 	width: 24px;
 }
+::v-deep .option {
+	margin-left: 10px;
+}
 </style>
diff --git a/src/components/SignatureSettings.vue b/src/components/SignatureSettings.vue
index 38ec2ff4e5..cb9a154d61 100644
--- a/src/components/SignatureSettings.vue
+++ b/src/components/SignatureSettings.vue
@@ -63,7 +63,7 @@ import logger from '../logger'
 import TextEditor from './TextEditor'
 import { detect, toHtml } from '../util/text'
 import Vue from 'vue'
-import Multiselect from '@nextcloud/vue/dist/Components/Multiselect'
+import Multiselect from '@nextcloud/vue/dist/Components/NcMultiselect'
 
 export default {
 	name: 'SignatureSettings',
diff --git a/src/components/TagModal.vue b/src/components/TagModal.vue
index aa30d31f52..ca211e1d50 100644
--- a/src/components/TagModal.vue
+++ b/src/components/TagModal.vue
@@ -89,11 +89,11 @@
 </template>
 
 <script>
-import Modal from '@nextcloud/vue/dist/Components/Modal'
-import Actions from '@nextcloud/vue/dist/Components/Actions'
-import ActionText from '@nextcloud/vue/dist/Components/ActionText'
-import ActionInput from '@nextcloud/vue/dist/Components/ActionInput'
-import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
+import Modal from '@nextcloud/vue/dist/Components/NcModal'
+import Actions from '@nextcloud/vue/dist/Components/NcActions'
+import ActionText from '@nextcloud/vue/dist/Components/NcActionText'
+import ActionInput from '@nextcloud/vue/dist/Components/NcActionInput'
+import ActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
 import IconRename from 'vue-material-design-icons/Pencil'
 import IconTag from 'vue-material-design-icons/Tag'
 import { showError, showInfo } from '@nextcloud/dialogs'
diff --git a/src/components/Thread.vue b/src/components/Thread.vue
index dc3989769a..328953bdcc 100644
--- a/src/components/Thread.vue
+++ b/src/components/Thread.vue
@@ -47,8 +47,8 @@
 </template>
 
 <script>
-import AppContentDetails from '@nextcloud/vue/dist/Components/AppContentDetails'
-import Popover from '@nextcloud/vue/dist/Components/Popover'
+import AppContentDetails from '@nextcloud/vue/dist/Components/NcAppContentDetails'
+import Popover from '@nextcloud/vue/dist/Components/NcPopover'
 
 import { prop, uniqBy } from 'ramda'
 import debounce from 'lodash/fp/debounce'
diff --git a/src/components/ThreadEnvelope.vue b/src/components/ThreadEnvelope.vue
index bab498eb44..66c0715439 100644
--- a/src/components/ThreadEnvelope.vue
+++ b/src/components/ThreadEnvelope.vue
@@ -148,7 +148,7 @@
 </template>
 <script>
 import Avatar from './Avatar'
-import Button from '@nextcloud/vue/dist/Components/Button'
+import Button from '@nextcloud/vue/dist/Components/NcButton'
 import Error from './Error'
 import importantSvg from '../../img/important.svg'
 import IconFavorite from 'vue-material-design-icons/Star'
diff --git a/src/components/itinerary/CalendarImport.vue b/src/components/itinerary/CalendarImport.vue
index 2479b08c1c..3c20783b04 100644
--- a/src/components/itinerary/CalendarImport.vue
+++ b/src/components/itinerary/CalendarImport.vue
@@ -32,8 +32,8 @@
 </template>
 
 <script>
-import Actions from '@nextcloud/vue/dist/Components/Actions'
-import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
+import Actions from '@nextcloud/vue/dist/Components/NcActions'
+import ActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
 import ical from 'ical.js'
 import moment from '@nextcloud/moment'
 
diff --git a/src/components/settings/AdminSettings.vue b/src/components/settings/AdminSettings.vue
index 8ed74830cd..49e8a4bda8 100644
--- a/src/components/settings/AdminSettings.vue
+++ b/src/components/settings/AdminSettings.vue
@@ -163,14 +163,14 @@
 </template>
 
 <script>
-import Button from '@nextcloud/vue/dist/Components/Button'
+import Button from '@nextcloud/vue/dist/Components/NcButton'
 import logger from '../../logger'
 import { showError, showSuccess } from '@nextcloud/dialogs'
 import ProvisioningSettings from './ProvisioningSettings'
 import AntiSpamSettings from './AntiSpamSettings'
 import IconAdd from 'vue-material-design-icons/Plus'
 import IconSettings from 'vue-material-design-icons/Cog'
-import SettingsSection from '@nextcloud/vue/dist/Components/SettingsSection'
+import SettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection'
 import {
 	disableProvisioning,
 	createProvisioningSettings,
diff --git a/src/components/settings/AntiSpamSettings.vue b/src/components/settings/AntiSpamSettings.vue
index 3768b31ae8..2a380c638c 100644
--- a/src/components/settings/AntiSpamSettings.vue
+++ b/src/components/settings/AntiSpamSettings.vue
@@ -81,7 +81,7 @@ import logger from '../../logger'
 import { loadState } from '@nextcloud/initial-state'
 import { setAntiSpamEmail, deleteAntiSpamEmail } from '../../service/SettingsService'
 import { showError, showSuccess } from '@nextcloud/dialogs'
-import Button from '@nextcloud/vue/dist/Components/Button'
+import Button from '@nextcloud/vue/dist/Components/NcButton'
 import IconUpload from 'vue-material-design-icons/Upload'
 import IconDelete from 'vue-material-design-icons/Delete'
 
diff --git a/src/components/settings/ProvisioningSettings.vue b/src/components/settings/ProvisioningSettings.vue
index 4993299a43..e767dead1e 100644
--- a/src/components/settings/ProvisioningSettings.vue
+++ b/src/components/settings/ProvisioningSettings.vue
@@ -360,7 +360,7 @@
 import logger from '../../logger'
 import ProvisionPreview from './ProvisionPreview'
 import { loadState } from '@nextcloud/initial-state'
-import Button from '@nextcloud/vue/dist/Components/Button'
+import Button from '@nextcloud/vue/dist/Components/NcButton'
 
 import IconUpload from 'vue-material-design-icons/Upload'
 import IconDelete from 'vue-material-design-icons/Delete'
diff --git a/src/views/Home.vue b/src/views/Home.vue
index c2d1ad1b45..a0328d18a7 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -12,7 +12,7 @@
 </template>
 
 <script>
-import Content from '@nextcloud/vue/dist/Components/Content'
+import Content from '@nextcloud/vue/dist/Components/NcContent'
 
 import isMobile from '@nextcloud/vue/dist/Mixins/isMobile'
 import logger from '../logger'
diff --git a/src/views/KeyboardShortcuts.vue b/src/views/KeyboardShortcuts.vue
index 2689bc78a1..7a11e49246 100644
--- a/src/views/KeyboardShortcuts.vue
+++ b/src/views/KeyboardShortcuts.vue
@@ -51,7 +51,7 @@
 </template>
 
 <script>
-import Modal from '@nextcloud/vue/dist/Components/Modal'
+import Modal from '@nextcloud/vue/dist/Components/NcModal'
 
 export default {
 	name: 'KeyboardShortcuts',
diff --git a/src/views/Setup.vue b/src/views/Setup.vue
index 57e2511e69..042a2f25e5 100644
--- a/src/views/Setup.vue
+++ b/src/views/Setup.vue
@@ -19,11 +19,11 @@
 </template>
 
 <script>
-import Content from '@nextcloud/vue/dist/Components/Content'
+import Content from '@nextcloud/vue/dist/Components/NcContent'
 import { loadState } from '@nextcloud/initial-state'
 
 import AccountForm from '../components/AccountForm'
-import EmptyContent from '@nextcloud/vue/dist/Components/EmptyContent'
+import EmptyContent from '@nextcloud/vue/dist/Components/NcEmptyContent'
 import IconMail from 'vue-material-design-icons/Email'
 import Navigation from '../components/Navigation'
 import logger from '../logger'