chore: Update plausible

Author: sidharthv96

packages/mermaid/src/docs/.vitepress/components/EditorSelectionModal.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { onMounted, onUnmounted, ref } from 'vue';
+import { track } from '@plausible-analytics/tracker';
 
 interface Feature {
   iconUrl: string;
@@ -52,7 +53,8 @@ const editorColumns: EditorColumn[] = [
     description: 'Code only, no login',
     buttonText: 'Start free',
     buttonUrl: 'https://mermaid.live/edit',
-    buttonClasses: 'bg-[#BEDDE3] hover:bg-[#5CA3B4] text-[#1E1A2E] hover:text-white hover:shadow-md',
+    buttonClasses:
+      'bg-[#BEDDE3] hover:bg-[#5CA3B4] text-[#1E1A2E] hover:text-white hover:shadow-md',
     features: openSourceFeatures,
   },
 ];
@@ -67,6 +69,7 @@ const handleMouseDown = (e: MouseEvent) => {
   ) {
     e.preventDefault();
     isVisible.value = !isVisible.value;
+    track('editorSelectionModalOpen');
   }
 };
 
@@ -82,7 +85,7 @@ onUnmounted(() => {
 <template>
   <div
     v-if="isVisible"
-    class="fixed top-0 left-0 z-50 flex h-screen w-screen backdrop-blur-sm items-center justify-center bg-[#8585A4]/40 plausible-event-name=editorSelectionModalOpen"
+    class="fixed top-0 left-0 z-50 flex h-screen w-screen backdrop-blur-sm items-center justify-center bg-[#8585A4]/40"
     @click.self="isVisible = false"
   >
     <div
@@ -115,7 +118,7 @@ onUnmounted(() => {
             'mb-6 flex h-10 w-full items-center justify-center rounded-xl',
             column.buttonClasses,
             'plausible-event-name=editorPick',
-            `plausible-event-type=${column.id}`
+            `plausible-event-type=${column.id}`,
           ]"
         >
           {{ column.buttonText }}

packages/mermaid/src/docs/.vitepress/config.ts

@@ -48,15 +48,6 @@ export default defineConfig({
       'meta',
       { property: 'og:image', content: 'https://mermaid.js.org/mermaid-logo-horizontal.svg' },
     ],
-    [
-      'script',
-      {
-        defer: 'true',
-        'data-domain': 'mermaid.js.org',
-        // All tracked stats are public and available at https://p.mermaid.live/mermaid.js.org
-        src: 'https://p.mermaid.live/js/script.tagged-events.outbound-links.js',
-      },
-    ],
   ],
   themeConfig: {
     logo: getHeaderLogo(docsHostname()),

packages/mermaid/src/docs/.vitepress/theme/index.ts

@@ -15,6 +15,7 @@ import type { EnhanceAppContext } from 'vitepress';
 import Theme from 'vitepress/theme';
 import { h } from 'vue';
 import '../style/main.css';
+import { init } from '@plausible-analytics/tracker';
 
 export default {
   ...DefaultTheme,
@@ -29,6 +30,18 @@ export default {
     });
   },
   enhanceApp({ app, router }: EnhanceAppContext) {
+    if (typeof window !== 'undefined') {
+      init({
+        domain: 'mermaid.js.org',
+        // All tracked stats are public and available at https://p.mermaid.live/mermaid.js.org
+        endpoint: 'https://p.mermaid.live/api/event',
+        bindToWindow: true,
+        // captureOnLocalhost: true,
+        autoCapturePageviews: true,
+        outboundLinks: true,
+      });
+    }
+
     // register global components
     app.component('Mermaid', Mermaid);
     app.component('Contributors', Contributors);

packages/mermaid/src/docs/package.json

@@ -17,6 +17,7 @@
   },
   "dependencies": {
     "@mdi/font": "^7.4.47",
+    "@plausible-analytics/tracker": "^0.4.4",
     "@vueuse/core": "^13.9.0",
     "font-awesome": "^4.7.0",
     "jiti": "^2.4.2",