[Vue] enable full typescript compilation + fix typing errors in existing Vue code (#18545)

* rebuild CoreHome

* quick fix

* built vue files

* fix angularjs issue

* add comment

* update umd files

* 4.6.1-rc1

* 4.6.1

* fix field array title

* apply some pr feedback

* apply more pr feedback

* another fix

* tweak

* fix ng-change not executed before ng-model

* fix another set of issues

* fix another issue

* rebuild vue

* better ng-change/ng-model fix

* update some screenshots

* rebuild vue

* remove some TODOs

* initiate initial ng-change ONLY for site selectors where this behavior applies

* emit/broadcast on correct scope in wrapper

* rebuild vue

* fix some issues

* couple more fixes

* fix another title issue

* rebuild vue

* do not report on ajax errors in notifications if not logged in

* migrate reporting page and model

* rebuild vue

* create sites selector model adapter

* fix siteselector vue bug, initial site is only set if there is just one site available

* rebuild vue

* migrate plugin settings directive

* remove TODO

* migrate plugin filter directive

* migrate two more plugins directives

* migrate save button

* fix a bunch of bugs

* fix another widget bug

* allow change event name between angularjs and vue

* rebuild vue

* migrate plugin form directive

* get to work

* migrate select-on-focus directive and start migrating report-export directive

* finish migrating report export directive & popover component + create reusable function to create vue app and add globals to it

* rebuild vue

* remove angularjs files and move less contents to vue dir

* migrate sparkline component

* migrate progressbar component

* migrate content intro & content table directives

* rebuild vue

* migrate piwik-ajax-form component to vue

* migrate popover handler directive to service class

* migrate dropdownbutton directive though it does not seem to be in use

* migrate show sensitive data directive

* build vue

* built vue files

* fix function signature

* fix vue warning

* fix ajax request race condition

* rebuild vue

* add new notification type "help" so the help notification is not cleared when clearing transient notifications

* fix some bugs and tests

* update screenshot

* update screenshot & fix a test

* allow using unminified jquery ui + fix bug in last fix

* fix error when enrichedheadline is used in modal

* add polyfill min.js

* remove two todos

* fix widget url logic

* update some screenshots and fix sanitization/escape issue

* update screenshots

* rebuild vue

* fix url location updating regression in MatomoUrl.updateLocation use

* submodule

* update screenshots and fix possible error in json parse

* built vue files

* Merge branch 'vue-period-selector-regression' into vue-reporting-menu

* rebuild vue

* use correct variable

* rebuild vue

* fix widget url logic

* segment parameter can be undefined now for some reason

* fix ngmodel binding in siteselector adapter (for last time hopefully)

* the original site selector only set the first site to the first site in the initial sites query if there was only one site in the entire matomo instance

* fix sitesmanager ui test failure

* fix usersettings test failure

* rebuild vue

* more siteselector tweaks.

* build CoreHome

* more siteselector tweaks.

* another siteselector issue

* update screenshots

* update screenshot and try to fix random failure

* fix some issues in widget.vue when containerid is specified

* fix couple tests

* fix several test failures

* fix string concat

* fix test failure

* extra change

* fix last change and random failure

* styling fix

* fix last fix

* real fix this time

* fix stray request

* proper fix

* update build files

* try to fix random failure

* do not submit form

* check for api errors in promise chain in ajaxhelper.ts

* force a digest after a location change

* use proper abortcontroller method instead of promise hack, have to add new polyfill + try to fix random test failure

* some UI test fixes

* fix some report export issues

* several save button fixes + make replace approximation in createAngularJsAdapter better

* fix sparkline

* apply after manual click triggering in savebutton

* css fixes and piwik-content-table was never applied by angularjs in installtion

* rebuild vue

* add names to divs so they can still be queried as they were in angularjs

* rebuild vue

* rebuild vue

* now that format_metrics checkbox works, need to check it

* small delay before processing first popover

* fix dropdown class/directive name

* fix overlay test

* remove unintended changes

* remove unintended changes

* do not do a passthrough transpile of vue typescript, and fix many typescript errors in existing code

* more typescript fixes

* even more fixes

* workarounds to fix recursive typing issues

* get corehome to build w/ full typescript build and output type definitions to local dir

* get outputted typings to be used when compiling other plugins and fix typescript issues in CorePluginsAdmin

* readd corehome umd

* fix typescript errors in ExampleVue plugin

* fix feedback typescript errors

* update screenshots

* Show a summary of new features (#18065)

* Added "What is new" notification display, populated by a new event

* Removed test example event hook

* Added support for applying a link attribute to menu items, fixes layout issue for mobile with html menu items

* Updated UI test screenshots

* Revert accidental edit

* Hide the "What's new" icon if there are no new features to show

* Changed to use changes.json, track user last viewed, added ui test

* Fix UserManager unit tests broken by new ts_changes_viewed user field

* Moved getChanges to separate helper class, added unit test, added user view access check

* Updated to add new changes table and populate only on plugin update/install

* Added missing fixture class, updated UI screenshots

* Updated matomo font to add ringing bell and new releases icons

* Fix for integration test

* Reworked class structure, removed unnecessary angular directive, merged templates, other tidy ups

* built vue files

* built vue files

* Added null user check, missing table exception handling, show plugin name in change title, better handling of missing change fields

* Added sample changes file, moved UserChanges db code to changes model, added return type hints, better db error code handling, various other improvements

* Revert accidental UI screenshot commit

* Fix for incorrect link name parameter in sample changes, switched back to using $db->query for INSERT IGNORE

* Integration test fix, UI screenshot updates

* Test fix

* Added link styling, show CoreHome changes without plugin prefix in title

* Update UI test screenshot

* Added styles to the popover, added event for filtering changes

* Test fix

* UI test screenshot updates

Co-authored-by: sgiehl <stefan@matomo.org>
Co-authored-by: bx80 <bx80@users.noreply.github.com>

* Update test translation (#18531)

update a test failed XML

* updates all submodules (#18541)

Co-authored-by: diosmosis <diosmosis@users.noreply.github.com>

* Translations update from Hosted Weblate (#18529)

* Translated using Weblate (Greek)

Currently translated at 100.0% (162 of 162 strings)

Translation: Matomo/Plugin CoreAdminHome
Translate-URL: https://hosted.weblate.org/projects/matomo/plugin-coreadminhome/el/

[ci skip]

Co-authored-by: Hosted Weblate <hosted@weblate.org>
Co-authored-by: Vasilis Lourdas <dev@lourdas.eu>

* Translated using Weblate (Chinese (Simplified))

Currently translated at 83.9% (136 of 162 strings)

Translation: Matomo/Plugin CoreAdminHome
Translate-URL: https://hosted.weblate.org/projects/matomo/plugin-coreadminhome/zh_Hans/

[ci skip]

Translated using Weblate (Chinese (Simplified))

Currently translated at 99.6% (620 of 622 strings)

Translation: Matomo/Matomo Base
Translate-URL: https://hosted.weblate.org/projects/matomo/matomo-base/zh_Hans/

[ci skip]

Co-authored-by: Hosted Weblate <hosted@weblate.org>
Co-authored-by: 刘韬 <lyuutau@outlook.com>

* Update translation files

Updated by "Squash Git commits" hook in Weblate.

Translation: Matomo/Plugin CoreAdminHome
Translate-URL: https://hosted.weblate.org/projects/matomo/plugin-coreadminhome/

[ci skip]

Co-authored-by: Vasilis Lourdas <dev@lourdas.eu>
Co-authored-by: 刘韬 <lyuutau@outlook.com>

* [Vue] migrate report export directive and popover (#18440)

* update files

* sidenav start

* make getRef a utility method

* tweak

* add return type

* finish converting side-nav directive

* starting on reporting menu conversion

* remove unused properties

* convert reporting pages service

* migrate report metadata store

* remove angularjs files

* migrating reporting pages store

* make store adapters more immutable

* get service adapters to work

* fix a UI test

* another html fix

* migrate most of reporting menu directive and model

* Use themed font family for input forms to override materialize.css styling

* rebuild vue

* add a missing div

* ui test fixes

* update styling

* get to build

* get to load in the UI w/o error

* clone result of functions

* fix compile issue

* migrate widget loader and get to load in UI

* rebuild vue

* migrate widgetcontainer

* migrate widget bydimension container

* migrate widget + add tooltips directive

* quick fix

* Updating version to 4.6.0

* loading in page

* update expected screenshot

* add wait just in case travis is slow

* fix ordering bug

* add another wait

* rebuild vue

* css tweak

* fix some bugs and tests

* undo screenshot changes

* Menus test passing locally

* [Vue] date picker viewDate property is not kept up to date (#18385)

* viewDate ref is not kept up to date

* rebuild corehome

* reporting menu subcategory items are meant to be normal links

* update some screenshots

* use innerText instead of text() since angularjs maintains newlines in HTML that vue does not add

* trigger angularjs digest after ajaxhelper request

* rebuild vue

* update screenshots, fix bug in link generation in reporting menu and allow syncing multiple screenshot regexes at a time

* undo box-shadow change for UI tests

* fix more issues & update more tests

* update some screenshots

* fix some tests

* rebuild CoreHome

* quick fix

* built vue files

* fix angularjs issue

* add comment

* update umd files

* 4.6.1-rc1

* 4.6.1

* fix field array title

* apply some pr feedback

* apply more pr feedback

* another fix

* tweak

* fix ng-change not executed before ng-model

* fix another set of issues

* fix another issue

* rebuild vue

* better ng-change/ng-model fix

* update some screenshots

* rebuild vue

* remove some TODOs

* initiate initial ng-change ONLY for site selectors where this behavior applies

* emit/broadcast on correct scope in wrapper

* rebuild vue

* fix some issues

* couple more fixes

* fix another title issue

* rebuild vue

* do not report on ajax errors in notifications if not logged in

* migrate reporting page and model

* rebuild vue

* create sites selector model adapter

* fix siteselector vue bug, initial site is only set if there is just one site available

* rebuild vue

* migrate plugin settings directive

* remove TODO

* migrate plugin filter directive

* migrate two more plugins directives

* migrate save button

* fix a bunch of bugs

* fix another widget bug

* allow change event name between angularjs and vue

* rebuild vue

* migrate plugin form directive

* get to work

* migrate select-on-focus directive and start migrating report-export directive

* finish migrating report export directive & popover component + create reusable function to create vue app and add globals to it

* rebuild vue

* remove angularjs files and move less contents to vue dir

* built vue files

* fix function signature

* fix vue warning

* fix ajax request race condition

* rebuild vue

* add new notification type "help" so the help notification is not cleared when clearing transient notifications

* fix some bugs and tests

* update screenshot

* update screenshot & fix a test

* allow using unminified jquery ui + fix bug in last fix

* fix error when enrichedheadline is used in modal

* add polyfill min.js

* remove two todos

* fix widget url logic

* update some screenshots and fix sanitization/escape issue

* update screenshots

* rebuild vue

* fix url location updating regression in MatomoUrl.updateLocation use

* submodule

* update screenshots and fix possible error in json parse

* built vue files

* Merge branch 'vue-period-selector-regression' into vue-reporting-menu

* rebuild vue

* use correct variable

* rebuild vue

* fix widget url logic

* segment parameter can be undefined now for some reason

* fix ngmodel binding in siteselector adapter (for last time hopefully)

* the original site selector only set the first site to the first site in the initial sites query if there was only one site in the entire matomo instance

* fix sitesmanager ui test failure

* fix usersettings test failure

* rebuild vue

* more siteselector tweaks.

* build CoreHome

* more siteselector tweaks.

* another siteselector issue

* update screenshots

* update screenshot and try to fix random failure

* fix some issues in widget.vue when containerid is specified

* fix couple tests

* fix several test failures

* fix string concat

* fix test failure

* extra change

* fix last change and random failure

* styling fix

* fix last fix

* real fix this time

* fix stray request

* proper fix

* update build files

* try to fix random failure

* do not submit form

* check for api errors in promise chain in ajaxhelper.ts

* force a digest after a location change

* use proper abortcontroller method instead of promise hack, have to add new polyfill + try to fix random test failure

* some UI test fixes

* fix some report export issues

* several save button fixes + make replace approximation in createAngularJsAdapter better

* apply after manual click triggering in savebutton

* add names to divs so they can still be queried as they were in angularjs

* rebuild vue

* now that format_metrics checkbox works, need to check it

* fix unintended changes

* updated expected screenshots

* update two more

* go back to previous format_metrics behavior in popover

Co-authored-by: Justin Velluppillai <justin@innocraft.com>
Co-authored-by: justinvelluppillai <justinvelluppillai@users.noreply.github.com>
Co-authored-by: Matthieu Aubry <mattab@users.noreply.github.com>

* [Vue] remove support in vue for FormField.allSettings (#18542)

* deprecate support in vue for FormField.allSettings since deep watching the property doesnt quite work

* built vue files

* update screenshots

* update screenshot

* Show a summary of new features (#18065)

* Added "What is new" notification display, populated by a new event

* Removed test example event hook

* Added support for applying a link attribute to menu items, fixes layout issue for mobile with html menu items

* Updated UI test screenshots

* Revert accidental edit

* Hide the "What's new" icon if there are no new features to show

* Changed to use changes.json, track user last viewed, added ui test

* Fix UserManager unit tests broken by new ts_changes_viewed user field

* Moved getChanges to separate helper class, added unit test, added user view access check

* Updated to add new changes table and populate only on plugin update/install

* Added missing fixture class, updated UI screenshots

* Updated matomo font to add ringing bell and new releases icons

* Fix for integration test

* Reworked class structure, removed unnecessary angular directive, merged templates, other tidy ups

* built vue files

* built vue files

* Added null user check, missing table exception handling, show plugin name in change title, better handling of missing change fields

* Added sample changes file, moved UserChanges db code to changes model, added return type hints, better db error code handling, various other improvements

* Revert accidental UI screenshot commit

* Fix for incorrect link name parameter in sample changes, switched back to using $db->query for INSERT IGNORE

* Integration test fix, UI screenshot updates

* Test fix

* Added link styling, show CoreHome changes without plugin prefix in title

* Update UI test screenshot

* Added styles to the popover, added event for filtering changes

* Test fix

* UI test screenshot updates

Co-authored-by: sgiehl <stefan@matomo.org>
Co-authored-by: bx80 <bx80@users.noreply.github.com>

* Update test translation (#18531)

update a test failed XML

* updates all submodules (#18541)

Co-authored-by: diosmosis <diosmosis@users.noreply.github.com>

* Translations update from Hosted Weblate (#18529)

* Translated using Weblate (Greek)

Currently translated at 100.0% (162 of 162 strings)

Translation: Matomo/Plugin CoreAdminHome
Translate-URL: https://hosted.weblate.org/projects/matomo/plugin-coreadminhome/el/

[ci skip]

Co-authored-by: Hosted Weblate <hosted@weblate.org>
Co-authored-by: Vasilis Lourdas <dev@lourdas.eu>

* Translated using Weblate (Chinese (Simplified))

Currently translated at 83.9% (136 of 162 strings)

Translation: Matomo/Plugin CoreAdminHome
Translate-URL: https://hosted.weblate.org/projects/matomo/plugin-coreadminhome/zh_Hans/

[ci skip]

Translated using Weblate (Chinese (Simplified))

Currently translated at 99.6% (620 of 622 strings)

Translation: Matomo/Matomo Base
Translate-URL: https://hosted.weblate.org/projects/matomo/matomo-base/zh_Hans/

[ci skip]

Co-authored-by: Hosted Weblate <hosted@weblate.org>
Co-authored-by: 刘韬 <lyuutau@outlook.com>

* Update translation files

Updated by "Squash Git commits" hook in Weblate.

Translation: Matomo/Plugin CoreAdminHome
Translate-URL: https://hosted.weblate.org/projects/matomo/plugin-coreadminhome/

[ci skip]

Co-authored-by: Vasilis Lourdas <dev@lourdas.eu>
Co-authored-by: 刘韬 <lyuutau@outlook.com>

* [Vue] migrate report export directive and popover (#18440)

* update files

* sidenav start

* make getRef a utility method

* tweak

* add return type

* finish converting side-nav directive

* starting on reporting menu conversion

* remove unused properties

* convert reporting pages service

* migrate report metadata store

* remove angularjs files

* migrating reporting pages store

* make store adapters more immutable

* get service adapters to work

* fix a UI test

* another html fix

* migrate most of reporting menu directive and model

* Use themed font family for input forms to override materialize.css styling

* rebuild vue

* add a missing div

* ui test fixes

* update styling

* get to build

* get to load in the UI w/o error

* clone result of functions

* fix compile issue

* migrate widget loader and get to load in UI

* rebuild vue

* migrate widgetcontainer

* migrate widget bydimension container

* migrate widget + add tooltips directive

* quick fix

* Updating version to 4.6.0

* loading in page

* update expected screenshot

* add wait just in case travis is slow

* fix ordering bug

* add another wait

* rebuild vue

* css tweak

* fix some bugs and tests

* undo screenshot changes

* Menus test passing locally

* [Vue] date picker viewDate property is not kept up to date (#18385)

* viewDate ref is not kept up to date

* rebuild corehome

* reporting menu subcategory items are meant to be normal links

* update some screenshots

* use innerText instead of text() since angularjs maintains newlines in HTML that vue does not add

* trigger angularjs digest after ajaxhelper request

* rebuild vue

* update screenshots, fix bug in link generation in reporting menu and allow syncing multiple screenshot regexes at a time

* undo box-shadow change for UI tests

* fix more issues & update more tests

* update some screenshots

* fix some tests

* rebuild CoreHome

* quick fix

* built vue files

* fix angularjs issue

* add comment

* update umd files

* 4.6.1-rc1

* 4.6.1

* fix field array title

* apply some pr feedback

* apply more pr feedback

* another fix

* tweak

* fix ng-change not executed before ng-model

* fix another set of issues

* fix another issue

* rebuild vue

* better ng-change/ng-model fix

* update some screenshots

* rebuild vue

* remove some TODOs

* initiate initial ng-change ONLY for site selectors where this behavior applies

* emit/broadcast on correct scope in wrapper

* rebuild vue

* fix some issues

* couple more fixes

* fix another title issue

* rebuild vue

* do not report on ajax errors in notifications if not logged in

* migrate reporting page and model

* rebuild vue

* create sites selector model adapter

* fix siteselector vue bug, initial site is only set if there is just one site available

* rebuild vue

* migrate plugin settings directive

* remove TODO

* migrate plugin filter directive

* migrate two more plugins directives

* migrate save button

* fix a bunch of bugs

* fix another widget bug

* allow change event name between angularjs and vue

* rebuild vue

* migrate plugin form directive

* get to work

* migrate select-on-focus directive and start migrating report-export directive

* finish migrating report export directive & popover component + create reusable function to create vue app and add globals to it

* rebuild vue

* remove angularjs files and move less contents to vue dir

* built vue files

* fix function signature

* fix vue warning

* fix ajax request race condition

* rebuild vue

* add new notification type "help" so the help notification is not cleared when clearing transient notifications

* fix some bugs and tests

* update screenshot

* update screenshot & fix a test

* allow using unminified jquery ui + fix bug in last fix

* fix error when enrichedheadline is used in modal

* add polyfill min.js

* remove two todos

* fix widget url logic

* update some screenshots and fix sanitization/escape issue

* update screenshots

* rebuild vue

* fix url location updating regression in MatomoUrl.updateLocation use

* submodule

* update screenshots and fix possible error in json parse

* built vue files

* Merge branch 'vue-period-selector-regression' into vue-reporting-menu

* rebuild vue

* use correct variable

* rebuild vue

* fix widget url logic

* segment parameter can be undefined now for some reason

* fix ngmodel binding in siteselector adapter (for last time hopefully)

* the original site selector only set the first site to the first site in the initial sites query if there was only one site in the entire matomo instance

* fix sitesmanager ui test failure

* fix usersettings test failure

* rebuild vue

* more siteselector tweaks.

* build CoreHome

* more siteselector tweaks.

* another siteselector issue

* update screenshots

* update screenshot and try to fix random failure

* fix some issues in widget.vue when containerid is specified

* fix couple tests

* fix several test failures

* fix string concat

* fix test failure

* extra change

* fix last change and random failure

* styling fix

* fix last fix

* real fix this time

* fix stray request

* proper fix

* update build files

* try to fix random failure

* do not submit form

* check for api errors in promise chain in ajaxhelper.ts

* force a digest after a location change

* use proper abortcontroller method instead of promise hack, have to add new polyfill + try to fix random test failure

* some UI test fixes

* fix some report export issues

* several save button fixes + make replace approximation in createAngularJsAdapter better

* apply after manual click triggering in savebutton

* add names to divs so they can still be queried as they were in angularjs

* rebuild vue

* now that format_metrics checkbox works, need to check it

* fix unintended changes

* updated expected screenshots

* update two more

* go back to previous format_metrics behavior in popover

Co-authored-by: Justin Velluppillai <justin@innocraft.com>
Co-authored-by: justinvelluppillai <justinvelluppillai@users.noreply.github.com>
Co-authored-by: Matthieu Aubry <mattab@users.noreply.github.com>

* [Vue] remove support in vue for FormField.allSettings (#18542)

* deprecate support in vue for FormField.allSettings since deep watching the property doesnt quite work

* built vue files

* update screenshots

* update screenshot

* fix tests

* rebuild

* order plugins by dependencies in vue:build and fix warning in corehome build

Co-authored-by: Justin Velluppillai <justin@innocraft.com>
Co-authored-by: justinvelluppillai <justinvelluppillai@users.noreply.github.com>
Co-authored-by: Matthieu Aubry <mattab@users.noreply.github.com>
Co-authored-by: Ben Burgess <88810029+bx80@users.noreply.github.com>
Co-authored-by: sgiehl <stefan@matomo.org>
Co-authored-by: bx80 <bx80@users.noreply.github.com>
Co-authored-by: Peter Zhang <peter@innocraft.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: Weblate (bot) <hosted@weblate.org>
Co-authored-by: Vasilis Lourdas <dev@lourdas.eu>
Co-authored-by: 刘韬 <lyuutau@outlook.com>

7 files changed, 54 insertions, 71 deletions

diff --git a/plugins/ExampleVue/vue/dist/ExampleVue.umd.1.js b/plugins/ExampleVue/vue/dist/ExampleVue.umd.1.js
index 37a1f0ca8f..1f1d57ec3c 100644
--- a/plugins/ExampleVue/vue/dist/ExampleVue.umd.1.js
+++ b/plugins/ExampleVue/vue/dist/ExampleVue.umd.1.js
@@ -10,10 +10,10 @@ __webpack_require__.r(__webpack_exports__);
 // EXTERNAL MODULE: external {"commonjs":"vue","commonjs2":"vue","root":"Vue"}
 var external_commonjs_vue_commonjs2_vue_root_Vue_ = __webpack_require__("8bbf");
 
-// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.vue?vue&type=template&id=75d288a9&scoped=true
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.vue?vue&type=template&id=5199cc7c&scoped=true
 
 
-Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-75d288a9");
+Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-5199cc7c");
 
 var _hoisted_1 = {
   class: "example-component"
@@ -52,12 +52,12 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     _: 1
   }, 8, ["modelValue"])]);
 }
-// CONCATENATED MODULE: ./plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.vue?vue&type=template&id=75d288a9&scoped=true
+// CONCATENATED MODULE: ./plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.vue?vue&type=template&id=5199cc7c&scoped=true
 
 // EXTERNAL MODULE: external "CoreHome"
 var external_CoreHome_ = __webpack_require__("19dc");
 
-// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-typescript/node_modules/cache-loader/dist/cjs.js??ref--14-0!./node_modules/@vue/cli-plugin-typescript/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-plugin-typescript/node_modules/ts-loader??ref--14-3!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.vue?vue&type=script&lang=ts
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-typescript/node_modules/cache-loader/dist/cjs.js??ref--14-0!./node_modules/babel-loader/lib!./node_modules/@vue/cli-plugin-typescript/node_modules/ts-loader??ref--14-2!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.vue?vue&type=script&lang=ts
 
 
 /* harmony default export */ var ExampleComponentvue_type_script_lang_ts = (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["defineComponent"])({
@@ -70,23 +70,21 @@ var external_CoreHome_ = __webpack_require__("19dc");
       showDialog: false
     };
   },
-  setup: function setup() {
-    return {
-      increment: function increment() {
-        this.count += 1;
-        this.showDialog = this.count > 15;
-      },
-      decrement: function decrement() {
-        this.count -= 1;
-        this.showDialog = this.count > 15;
-      }
-    };
+  methods: {
+    increment: function increment() {
+      this.count += 1;
+      this.showDialog = this.count > 15;
+    },
+    decrement: function decrement() {
+      this.count -= 1;
+      this.showDialog = this.count > 15;
+    }
   }
 }));
 // CONCATENATED MODULE: ./plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.vue?vue&type=script&lang=ts
  
-// EXTERNAL MODULE: ./plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.vue?vue&type=style&index=0&id=75d288a9&lang=less&scoped=true
-var ExampleComponentvue_type_style_index_0_id_75d288a9_lang_less_scoped_true = __webpack_require__("6541");
+// EXTERNAL MODULE: ./plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.vue?vue&type=style&index=0&id=5199cc7c&lang=less&scoped=true
+var ExampleComponentvue_type_style_index_0_id_5199cc7c_lang_less_scoped_true = __webpack_require__("4044");
 
 // CONCATENATED MODULE: ./plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.vue
 
@@ -95,24 +93,24 @@ var ExampleComponentvue_type_style_index_0_id_75d288a9_lang_less_scoped_true = _
 
 
 ExampleComponentvue_type_script_lang_ts.render = render
-ExampleComponentvue_type_script_lang_ts.__scopeId = "data-v-75d288a9"
+ExampleComponentvue_type_script_lang_ts.__scopeId = "data-v-5199cc7c"
 
 /* harmony default export */ var ExampleComponent = __webpack_exports__["default"] = (ExampleComponentvue_type_script_lang_ts);
 
 /***/ }),
 
-/***/ "6541":
+/***/ "4044":
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-/* harmony import */ var _node_modules_vue_cli_service_node_modules_mini_css_extract_plugin_dist_loader_js_ref_10_oneOf_1_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_ref_10_oneOf_1_1_node_modules_vue_cli_service_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_10_oneOf_1_2_node_modules_less_loader_dist_cjs_js_ref_10_oneOf_1_3_node_modules_vue_cli_service_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_ExampleComponent_vue_vue_type_style_index_0_id_75d288a9_lang_less_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("7143");
-/* harmony import */ var _node_modules_vue_cli_service_node_modules_mini_css_extract_plugin_dist_loader_js_ref_10_oneOf_1_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_ref_10_oneOf_1_1_node_modules_vue_cli_service_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_10_oneOf_1_2_node_modules_less_loader_dist_cjs_js_ref_10_oneOf_1_3_node_modules_vue_cli_service_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_ExampleComponent_vue_vue_type_style_index_0_id_75d288a9_lang_less_scoped_true__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_cli_service_node_modules_mini_css_extract_plugin_dist_loader_js_ref_10_oneOf_1_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_ref_10_oneOf_1_1_node_modules_vue_cli_service_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_10_oneOf_1_2_node_modules_less_loader_dist_cjs_js_ref_10_oneOf_1_3_node_modules_vue_cli_service_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_ExampleComponent_vue_vue_type_style_index_0_id_75d288a9_lang_less_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _node_modules_vue_cli_service_node_modules_mini_css_extract_plugin_dist_loader_js_ref_10_oneOf_1_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_ref_10_oneOf_1_1_node_modules_vue_cli_service_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_10_oneOf_1_2_node_modules_less_loader_dist_cjs_js_ref_10_oneOf_1_3_node_modules_vue_cli_service_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_ExampleComponent_vue_vue_type_style_index_0_id_5199cc7c_lang_less_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("9852");
+/* harmony import */ var _node_modules_vue_cli_service_node_modules_mini_css_extract_plugin_dist_loader_js_ref_10_oneOf_1_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_ref_10_oneOf_1_1_node_modules_vue_cli_service_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_10_oneOf_1_2_node_modules_less_loader_dist_cjs_js_ref_10_oneOf_1_3_node_modules_vue_cli_service_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_ExampleComponent_vue_vue_type_style_index_0_id_5199cc7c_lang_less_scoped_true__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_cli_service_node_modules_mini_css_extract_plugin_dist_loader_js_ref_10_oneOf_1_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_ref_10_oneOf_1_1_node_modules_vue_cli_service_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_10_oneOf_1_2_node_modules_less_loader_dist_cjs_js_ref_10_oneOf_1_3_node_modules_vue_cli_service_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_ExampleComponent_vue_vue_type_style_index_0_id_5199cc7c_lang_less_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
 /* unused harmony reexport * */
 
 
 /***/ }),
 
-/***/ "7143":
+/***/ "9852":
 /***/ (function(module, exports, __webpack_require__) {
 
 // extracted by mini-css-extract-plugin
diff --git a/plugins/ExampleVue/vue/dist/ExampleVue.umd.js b/plugins/ExampleVue/vue/dist/ExampleVue.umd.js
index 65ebeba859..ff2a87592d 100644
--- a/plugins/ExampleVue/vue/dist/ExampleVue.umd.js
+++ b/plugins/ExampleVue/vue/dist/ExampleVue.umd.js
@@ -96,7 +96,7 @@ return /******/ (function(modules) { // webpackBootstrap
 /******/ 		if(installedCssChunks[chunkId]) promises.push(installedCssChunks[chunkId]);
 /******/ 		else if(installedCssChunks[chunkId] !== 0 && cssChunks[chunkId]) {
 /******/ 			promises.push(installedCssChunks[chunkId] = new Promise(function(resolve, reject) {
-/******/ 				var href = "css/" + ({}[chunkId]||chunkId) + "." + {"1":"3373f545"}[chunkId] + ".css";
+/******/ 				var href = "css/" + ({}[chunkId]||chunkId) + "." + {"1":"d4a31fec"}[chunkId] + ".css";
 /******/ 				var fullhref = __webpack_require__.p + href;
 /******/ 				var existingLinkTags = document.getElementsByTagName("link");
 /******/ 				for(var i = 0; i < existingLinkTags.length; i++) {
@@ -279,7 +279,7 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__8bbf__;
 __webpack_require__.r(__webpack_exports__);
 
 // EXPORTS
-__webpack_require__.d(__webpack_exports__, "exampleVueComponentAdapter", function() { return /* reexport */ exampleVueComponentAdapter; });
+__webpack_require__.d(__webpack_exports__, "exampleVueComponentAdapter", function() { return /* reexport */ ExampleComponent_adapter; });
 
 // CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/setPublicPath.js
 // This file is imported into lib/wc client bundles.
@@ -300,6 +300,9 @@ if (typeof window !== 'undefined') {
 // EXTERNAL MODULE: external {"commonjs":"vue","commonjs2":"vue","root":"Vue"}
 var external_commonjs_vue_commonjs2_vue_root_Vue_ = __webpack_require__("8bbf");
 
+// EXTERNAL MODULE: external "CoreHome"
+var external_CoreHome_ = __webpack_require__("19dc");
+
 // CONCATENATED MODULE: ./plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.adapter.ts
 /*!
  * Matomo - free/libre analytics platform
@@ -308,23 +311,14 @@ var external_commonjs_vue_commonjs2_vue_root_Vue_ = __webpack_require__("8bbf");
  * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
  */
 
+
 var AsyncExampleComponent = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["defineAsyncComponent"])(function () {
   return __webpack_require__.e(/* import() */ 1).then(__webpack_require__.bind(null, "2d21"));
 });
-function exampleVueComponentAdapter() {
-  return {
-    restrict: 'A',
-    scope: {},
-    template: '',
-    link: function exampleVueComponentAdapterLink(scope, element) {
-      var vueApp = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createApp"])(AsyncExampleComponent);
-      vueApp.config.globalProperties.$sanitize = window.vueSanitize;
-      vueApp.mount(element[0]);
-    }
-  };
-}
-exampleVueComponentAdapter.$inject = [];
-angular.module('piwikApp').directive('exampleVueComponent', exampleVueComponentAdapter);
+/* harmony default export */ var ExampleComponent_adapter = (Object(external_CoreHome_["createAngularJsAdapter"])({
+  component: AsyncExampleComponent,
+  directiveName: 'exampleVueComponent'
+}));
 // CONCATENATED MODULE: ./plugins/ExampleVue/vue/src/index.ts
 /*!
  * Matomo - free/libre analytics platform
diff --git a/plugins/ExampleVue/vue/dist/ExampleVue.umd.min.1.js b/plugins/ExampleVue/vue/dist/ExampleVue.umd.min.1.js
index aaa44566a8..7f267b6946 100644
--- a/plugins/ExampleVue/vue/dist/ExampleVue.umd.min.1.js
+++ b/plugins/ExampleVue/vue/dist/ExampleVue.umd.min.1.js
@@ -1,2 +1,2 @@
-(("undefined"!==typeof self?self:this)["webpackJsonpExampleVue"]=("undefined"!==typeof self?self:this)["webpackJsonpExampleVue"]||[]).push([[1],{"2d21":function(e,t,n){"use strict";n.r(t);var o=n("8bbf");Object(o["pushScopeId"])("data-v-75d288a9");var c={class:"example-component"},a=Object(o["createElementVNode"])("div",{class:"ui-confirm exampleDialog"},[Object(o["createElementVNode"])("h2",null,"Alert"),Object(o["createElementVNode"])("p",null," The count is greater than 1 right now! "),Object(o["createElementVNode"])("input",{type:"button",value:"OK",role:"yes"})],-1);function i(e,t,n,i,l,u){var r=Object(o["resolveComponent"])("MatomoDialog");return Object(o["openBlock"])(),Object(o["createElementBlock"])("div",c,[Object(o["createElementVNode"])("button",{onClick:t[0]||(t[0]=function(){return e.decrement&&e.decrement.apply(e,arguments)})},"-"),Object(o["createTextVNode"])(" "+Object(o["toDisplayString"])(e.count)+" ",1),Object(o["createElementVNode"])("button",{onClick:t[1]||(t[1]=function(){return e.increment&&e.increment.apply(e,arguments)})},"+"),Object(o["createVNode"])(r,{modelValue:e.showDialog,"onUpdate:modelValue":t[2]||(t[2]=function(t){return e.showDialog=t})},{default:Object(o["withCtx"])((function(){return[a]})),_:1},8,["modelValue"])])}Object(o["popScopeId"])();var l=n("19dc"),u=Object(o["defineComponent"])({components:{MatomoDialog:l["MatomoDialog"]},data:function(){return{count:12,showDialog:!1}},setup:function(){return{increment:function(){this.count+=1,this.showDialog=this.count>15},decrement:function(){this.count-=1,this.showDialog=this.count>15}}}});n("6541");u.render=i,u.__scopeId="data-v-75d288a9";t["default"]=u},6541:function(e,t,n){"use strict";n("7143")},7143:function(e,t,n){}}]);
+(("undefined"!==typeof self?self:this)["webpackJsonpExampleVue"]=("undefined"!==typeof self?self:this)["webpackJsonpExampleVue"]||[]).push([[1],{"2d21":function(e,t,n){"use strict";n.r(t);var o=n("8bbf");Object(o["pushScopeId"])("data-v-5199cc7c");var c={class:"example-component"},a=Object(o["createElementVNode"])("div",{class:"ui-confirm exampleDialog"},[Object(o["createElementVNode"])("h2",null,"Alert"),Object(o["createElementVNode"])("p",null," The count is greater than 1 right now! "),Object(o["createElementVNode"])("input",{type:"button",value:"OK",role:"yes"})],-1);function l(e,t,n,l,i,u){var r=Object(o["resolveComponent"])("MatomoDialog");return Object(o["openBlock"])(),Object(o["createElementBlock"])("div",c,[Object(o["createElementVNode"])("button",{onClick:t[0]||(t[0]=function(){return e.decrement&&e.decrement.apply(e,arguments)})},"-"),Object(o["createTextVNode"])(" "+Object(o["toDisplayString"])(e.count)+" ",1),Object(o["createElementVNode"])("button",{onClick:t[1]||(t[1]=function(){return e.increment&&e.increment.apply(e,arguments)})},"+"),Object(o["createVNode"])(r,{modelValue:e.showDialog,"onUpdate:modelValue":t[2]||(t[2]=function(t){return e.showDialog=t})},{default:Object(o["withCtx"])((function(){return[a]})),_:1},8,["modelValue"])])}Object(o["popScopeId"])();var i=n("19dc"),u=Object(o["defineComponent"])({components:{MatomoDialog:i["MatomoDialog"]},data:function(){return{count:12,showDialog:!1}},methods:{increment:function(){this.count+=1,this.showDialog=this.count>15},decrement:function(){this.count-=1,this.showDialog=this.count>15}}});n("4044");u.render=l,u.__scopeId="data-v-5199cc7c";t["default"]=u},4044:function(e,t,n){"use strict";n("9852")},9852:function(e,t,n){}}]);
 //# sourceMappingURL=ExampleVue.umd.min.1.js.map
\ No newline at end of file
diff --git a/plugins/ExampleVue/vue/dist/ExampleVue.umd.min.js b/plugins/ExampleVue/vue/dist/ExampleVue.umd.min.js
index 4429a42014..ce8a3795aa 100644
--- a/plugins/ExampleVue/vue/dist/ExampleVue.umd.min.js
+++ b/plugins/ExampleVue/vue/dist/ExampleVue.umd.min.js
@@ -1,2 +1,2 @@
-(function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t(require("CoreHome"),require("vue")):"function"===typeof define&&define.amd?define(["CoreHome"],t):"object"===typeof exports?exports["ExampleVue"]=t(require("CoreHome"),require("vue")):e["ExampleVue"]=t(e["CoreHome"],e["Vue"])})("undefined"!==typeof self?self:this,(function(e,t){return function(e){function t(t){for(var n,r,u=t[0],i=t[1],a=0,f=[];a<u.length;a++)r=u[a],Object.prototype.hasOwnProperty.call(o,r)&&o[r]&&f.push(o[r][0]),o[r]=0;for(n in i)Object.prototype.hasOwnProperty.call(i,n)&&(e[n]=i[n]);l&&l(t);while(f.length)f.shift()()}var n={},r={0:0},o={0:0};function u(e){return i.p+"ExampleVue.umd.min."+({}[e]||e)+".js"}function i(t){if(n[t])return n[t].exports;var r=n[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,i),r.l=!0,r.exports}i.e=function(e){var t=[],n={1:1};r[e]?t.push(r[e]):0!==r[e]&&n[e]&&t.push(r[e]=new Promise((function(t,n){for(var o="css/"+({}[e]||e)+"."+{1:"3373f545"}[e]+".css",u=i.p+o,a=document.getElementsByTagName("link"),f=0;f<a.length;f++){var c=a[f],l=c.getAttribute("data-href")||c.getAttribute("href");if("stylesheet"===c.rel&&(l===o||l===u))return t()}var p=document.getElementsByTagName("style");for(f=0;f<p.length;f++){c=p[f],l=c.getAttribute("data-href");if(l===o||l===u)return t()}var s=document.createElement("link");s.rel="stylesheet",s.type="text/css",s.onload=t,s.onerror=function(t){var o=t&&t.target&&t.target.src||u,i=new Error("Loading CSS chunk "+e+" failed.\n("+o+")");i.code="CSS_CHUNK_LOAD_FAILED",i.request=o,delete r[e],s.parentNode.removeChild(s),n(i)},s.href=u;var d=document.getElementsByTagName("head")[0];d.appendChild(s)})).then((function(){r[e]=0})));var a=o[e];if(0!==a)if(a)t.push(a[2]);else{var f=new Promise((function(t,n){a=o[e]=[t,n]}));t.push(a[2]=f);var c,l=document.createElement("script");l.charset="utf-8",l.timeout=120,i.nc&&l.setAttribute("nonce",i.nc),l.src=u(e);var p=new Error;c=function(t){l.onerror=l.onload=null,clearTimeout(s);var n=o[e];if(0!==n){if(n){var r=t&&("load"===t.type?"missing":t.type),u=t&&t.target&&t.target.src;p.message="Loading chunk "+e+" failed.\n("+r+": "+u+")",p.name="ChunkLoadError",p.type=r,p.request=u,n[1](p)}o[e]=void 0}};var s=setTimeout((function(){c({type:"timeout",target:l})}),12e4);l.onerror=l.onload=c,document.head.appendChild(l)}return Promise.all(t)},i.m=e,i.c=n,i.d=function(e,t,n){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},i.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(i.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)i.d(n,r,function(t){return e[t]}.bind(null,r));return n},i.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="plugins/ExampleVue/vue/dist/",i.oe=function(e){throw console.error(e),e};var a=("undefined"!==typeof self?self:this)["webpackJsonpExampleVue"]=("undefined"!==typeof self?self:this)["webpackJsonpExampleVue"]||[],f=a.push.bind(a);a.push=t,a=a.slice();for(var c=0;c<a.length;c++)t(a[c]);var l=f;return i(i.s="fae3")}({"19dc":function(t,n){t.exports=e},"8bbf":function(e,n){e.exports=t},fae3:function(e,t,n){"use strict";if(n.r(t),n.d(t,"exampleVueComponentAdapter",(function(){return a})),"undefined"!==typeof window){var r=window.document.currentScript,o=r&&r.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);o&&(n.p=o[1])}var u=n("8bbf"),i=Object(u["defineAsyncComponent"])((function(){return n.e(1).then(n.bind(null,"2d21"))}));function a(){return{restrict:"A",scope:{},template:"",link:function(e,t){var n=Object(u["createApp"])(i);n.config.globalProperties.$sanitize=window.vueSanitize,n.mount(t[0])}}}a.$inject=[],angular.module("piwikApp").directive("exampleVueComponent",a)}})}));
+(function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t(require("CoreHome"),require("vue")):"function"===typeof define&&define.amd?define(["CoreHome"],t):"object"===typeof exports?exports["ExampleVue"]=t(require("CoreHome"),require("vue")):e["ExampleVue"]=t(e["CoreHome"],e["Vue"])})("undefined"!==typeof self?self:this,(function(e,t){return function(e){function t(t){for(var r,n,u=t[0],i=t[1],a=0,f=[];a<u.length;a++)n=u[a],Object.prototype.hasOwnProperty.call(o,n)&&o[n]&&f.push(o[n][0]),o[n]=0;for(r in i)Object.prototype.hasOwnProperty.call(i,r)&&(e[r]=i[r]);l&&l(t);while(f.length)f.shift()()}var r={},n={0:0},o={0:0};function u(e){return i.p+"ExampleVue.umd.min."+({}[e]||e)+".js"}function i(t){if(r[t])return r[t].exports;var n=r[t]={i:t,l:!1,exports:{}};return e[t].call(n.exports,n,n.exports,i),n.l=!0,n.exports}i.e=function(e){var t=[],r={1:1};n[e]?t.push(n[e]):0!==n[e]&&r[e]&&t.push(n[e]=new Promise((function(t,r){for(var o="css/"+({}[e]||e)+"."+{1:"d4a31fec"}[e]+".css",u=i.p+o,a=document.getElementsByTagName("link"),f=0;f<a.length;f++){var c=a[f],l=c.getAttribute("data-href")||c.getAttribute("href");if("stylesheet"===c.rel&&(l===o||l===u))return t()}var s=document.getElementsByTagName("style");for(f=0;f<s.length;f++){c=s[f],l=c.getAttribute("data-href");if(l===o||l===u)return t()}var p=document.createElement("link");p.rel="stylesheet",p.type="text/css",p.onload=t,p.onerror=function(t){var o=t&&t.target&&t.target.src||u,i=new Error("Loading CSS chunk "+e+" failed.\n("+o+")");i.code="CSS_CHUNK_LOAD_FAILED",i.request=o,delete n[e],p.parentNode.removeChild(p),r(i)},p.href=u;var d=document.getElementsByTagName("head")[0];d.appendChild(p)})).then((function(){n[e]=0})));var a=o[e];if(0!==a)if(a)t.push(a[2]);else{var f=new Promise((function(t,r){a=o[e]=[t,r]}));t.push(a[2]=f);var c,l=document.createElement("script");l.charset="utf-8",l.timeout=120,i.nc&&l.setAttribute("nonce",i.nc),l.src=u(e);var s=new Error;c=function(t){l.onerror=l.onload=null,clearTimeout(p);var r=o[e];if(0!==r){if(r){var n=t&&("load"===t.type?"missing":t.type),u=t&&t.target&&t.target.src;s.message="Loading chunk "+e+" failed.\n("+n+": "+u+")",s.name="ChunkLoadError",s.type=n,s.request=u,r[1](s)}o[e]=void 0}};var p=setTimeout((function(){c({type:"timeout",target:l})}),12e4);l.onerror=l.onload=c,document.head.appendChild(l)}return Promise.all(t)},i.m=e,i.c=r,i.d=function(e,t,r){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},i.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(i.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)i.d(r,n,function(t){return e[t]}.bind(null,n));return r},i.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="plugins/ExampleVue/vue/dist/",i.oe=function(e){throw console.error(e),e};var a=("undefined"!==typeof self?self:this)["webpackJsonpExampleVue"]=("undefined"!==typeof self?self:this)["webpackJsonpExampleVue"]||[],f=a.push.bind(a);a.push=t,a=a.slice();for(var c=0;c<a.length;c++)t(a[c]);var l=f;return i(i.s="fae3")}({"19dc":function(t,r){t.exports=e},"8bbf":function(e,r){e.exports=t},fae3:function(e,t,r){"use strict";if(r.r(t),r.d(t,"exampleVueComponentAdapter",(function(){return f})),"undefined"!==typeof window){var n=window.document.currentScript,o=n&&n.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);o&&(r.p=o[1])}var u=r("8bbf"),i=r("19dc"),a=Object(u["defineAsyncComponent"])((function(){return r.e(1).then(r.bind(null,"2d21"))})),f=Object(i["createAngularJsAdapter"])({component:a,directiveName:"exampleVueComponent"})}})}));
 //# sourceMappingURL=ExampleVue.umd.min.js.map
\ No newline at end of file
diff --git a/plugins/ExampleVue/vue/dist/css/1.3373f545.css b/plugins/ExampleVue/vue/dist/css/1.d4a31fec.css
index e1b4698758..ca386a1367 100644
--- a/plugins/ExampleVue/vue/dist/css/1.3373f545.css
+++ b/plugins/ExampleVue/vue/dist/css/1.d4a31fec.css
@@ -1 +1 @@
-.example-component[data-v-75d288a9]{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center}.example-component button[data-v-75d288a9]{background-color:indigo;color:#fff;margin:8px}
\ No newline at end of file
+.example-component[data-v-5199cc7c]{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center}.example-component button[data-v-5199cc7c]{background-color:indigo;color:#fff;margin:8px}
\ No newline at end of file
diff --git a/plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.adapter.ts b/plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.adapter.ts
index b848fa8518..1dcdf6a6d0 100644
--- a/plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.adapter.ts
+++ b/plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.adapter.ts
@@ -5,24 +5,12 @@
  * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
  */
 
-import { createApp, defineAsyncComponent } from 'vue';
+import { defineAsyncComponent } from 'vue';
+import { createAngularJsAdapter } from 'CoreHome';
 
 const AsyncExampleComponent = defineAsyncComponent(() => import('./ExampleComponent.vue'));
 
-export default function exampleVueComponentAdapter(): ng.IDirective {
-  return {
-    restrict: 'A',
-    scope: {
-    },
-    template: '',
-    link: function exampleVueComponentAdapterLink(scope: ng.IScope, element: ng.IAugmentedJQuery) {
-      const vueApp = createApp(AsyncExampleComponent);
-      vueApp.config.globalProperties.$sanitize = window.vueSanitize;
-      vueApp.mount(element[0]);
-    },
-  };
-}
-
-exampleVueComponentAdapter.$inject = [];
-
-angular.module('piwikApp').directive('exampleVueComponent', exampleVueComponentAdapter);
+export default createAngularJsAdapter({
+  component: AsyncExampleComponent,
+  directiveName: 'exampleVueComponent',
+});
diff --git a/plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.vue b/plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.vue
index 0af7c22cde..94aa40254a 100644
--- a/plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.vue
+++ b/plugins/ExampleVue/vue/src/ExampleComponent/ExampleComponent.vue
@@ -42,27 +42,30 @@
 import { defineComponent } from 'vue';
 import { MatomoDialog } from 'CoreHome';
 
+interface ExampleComponentState {
+  count: number;
+  showDialog: boolean;
+}
+
 export default defineComponent({
   components: {
     MatomoDialog,
   },
-  data() {
+  data(): ExampleComponentState {
     return {
       count: 12,
       showDialog: false,
     };
   },
-  setup() {
-    return {
-      increment() {
-        this.count += 1;
-        this.showDialog = this.count > 15;
-      },
-      decrement() {
-        this.count -= 1;
-        this.showDialog = this.count > 15;
-      },
-    };
+  methods: {
+    increment() {
+      this.count += 1;
+      this.showDialog = this.count > 15;
+    },
+    decrement() {
+      this.count -= 1;
+      this.showDialog = this.count > 15;
+    },
   },
 });
 </script>