From 72cf84cb40322baec2987cbe27baf2eaf3cc5537 Mon Sep 17 00:00:00 2001
From: Steph <35910788+huynhicode@users.noreply.github.com>
Date: Wed, 12 Feb 2025 14:02:01 -0800
Subject: [PATCH 1/5] wip

---
 .../src/docs/.vitepress/components/TopBar.vue | 118 ++++++++++++++++--
 1 file changed, 107 insertions(+), 11 deletions(-)

diff --git a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
index ff0b344c5..51fd413cc 100644
--- a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
+++ b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
@@ -1,40 +1,136 @@
 <script setup lang="ts">
-import { ref, onMounted } from 'vue';
+import { ref, onMounted, computed } from 'vue';
+import { namespace } from '../../../../dist/diagrams/state/stateDb';
 
 interface Taglines {
+  name: string;
+  design: string;
   label: string;
   url: string;
 }
 
-const taglines: Taglines[] = [
+const allTaglines: Taglines[] = [
   {
-    label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
-    url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard',
+    name: 'A AI Bundle',
+    design: '1',
+    label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
+    url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_A',
   },
   {
-    label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
-    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor',
+    name: 'B AI Bundle',
+    design: '2',
+    label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
+    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_B',
   },
   {
+    name: 'C AI Bundle',
+    design: '1',
+    label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
+    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_C',
+  },
+  {
+    name: 'D AI Bundle',
+    design: '2',
+    label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
+    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_D',
+  },
+  {
+    name: 'A Teams',
+    design: '1',
     label: 'Diagram live with teammates in Mermaid Chart',
-    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams',
+    url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_A',
   },
   {
-    label: 'Replace ChatGPT Pro, Mermaid.live, and LucidChart with Mermaid Pro',
-    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle',
+    name: 'B Teams',
+    design: '2',
+    label: 'Diagram live with teammates in Mermaid Chart',
+    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_B',
+  },
+  {
+    name: 'C Teams',
+    design: '1',
+    label: 'Diagram live with teammates in Mermaid Pro',
+    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_C',
+  },
+  {
+    name: 'D Teams',
+    design: '2',
+    label: 'Diagram live with teammates in Mermaid Pro',
+    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_D',
+  },
+  {
+    name: 'A Visual Editor',
+    design: '1',
+    label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
+    url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_A',
+  },
+  {
+    name: 'B Visual Editor',
+    design: '2',
+    label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
+    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_B',
+  },
+  {
+    name: 'C Visual Editor',
+    design: '1',
+    label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
+    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_C',
+  },
+  {
+    name: 'D Visual Editor',
+    design: '2',
+    label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
+    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_D',
+  },
+  {
+    name: 'A Whiteboard',
+    design: '1',
+    label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+    url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_A',
+  },
+  {
+    name: 'B Whiteboard',
+    design: '2',
+    label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_A',
+  },
+  {
+    name: 'C Whiteboard',
+    design: '1',
+    label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+    url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_B',
+  },
+  {
+    name: 'D Whiteboard',
+    design: '2',
+    label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_B',
   },
 ];
 
+// Randomly select group A, B, C, or D
+const groups = ['A', 'B', 'C', 'D'];
+const selectedGroup = groups[Math.floor(Math.random() * groups.length)];
+const taglines = allTaglines.filter((tagline) => tagline.name.startsWith(selectedGroup));
+
 let index = ref(Math.floor(Math.random() * taglines.length));
 onMounted(() => {
   setInterval(() => {
     index.value = (index.value + 1) % taglines.length;
-  }, 5_000);
+  }, 2_000);
+});
+
+const currentDesign = computed(() => {
+  const designMap: { [key: string]: string } = {
+    '1': '#f56565',
+    '2': '#4299e1',
+  };
+  return designMap[taglines[index.value].design];
 });
 </script>
 
 <template>
-  <div class="mb-4 w-full top-bar bg-gradient-to-r from-[#bd34fe] to-[#ff3670] flex p-1">
+  <div :style="{ background: currentDesign }" class="mb-4 w-full top-bar flex p-1">
     <p class="w-full tracking-wide fade-text">
       <transition name="fade" mode="out-in">
         <a

From ec0e3e4cd68f9b2f57c437d76a39f7de0dcf6fbc Mon Sep 17 00:00:00 2001
From: Steph <35910788+huynhicode@users.noreply.github.com>
Date: Wed, 12 Feb 2025 16:00:28 -0800
Subject: [PATCH 2/5] update styling

---
 .../src/docs/.vitepress/components/TopBar.vue      | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
index 51fd413cc..179b8759a 100644
--- a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
+++ b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
@@ -117,20 +117,24 @@ let index = ref(Math.floor(Math.random() * taglines.length));
 onMounted(() => {
   setInterval(() => {
     index.value = (index.value + 1) % taglines.length;
-  }, 2_000);
+  }, 5_000);
 });
 
 const currentDesign = computed(() => {
   const designMap: { [key: string]: string } = {
-    '1': '#f56565',
-    '2': '#4299e1',
+    '1': 'bg-gradient-to-r from-[#bd34fe] to-[#ff3670] ',
+    '2': 'bg-[#2E2183]',
   };
   return designMap[taglines[index.value].design];
 });
+
+const buttonClass = computed(() => {
+  return taglines[index.value].design === '1' ? 'bg-[#2E2183]' : 'bg-[#E0095F]';
+});
 </script>
 
 <template>
-  <div :style="{ background: currentDesign }" class="mb-4 w-full top-bar flex p-1">
+  <div :class="[currentDesign]" class="mb-4 w-full top-bar flex p-2">
     <p class="w-full tracking-wide fade-text">
       <transition name="fade" mode="out-in">
         <a
@@ -140,7 +144,7 @@ const currentDesign = computed(() => {
           class="unstyled flex justify-center items-center gap-4 text-white tracking-wide plausible-event-name=bannerClick"
         >
           <span class="font-semibold">{{ taglines[index].label }}</span>
-          <button class="rounded bg-[#111113] p-1 px-2 text-sm font-semibold tracking-wide">
+          <button :class="['rounded-lg p-2 px-4 font-semibold tracking-wide', buttonClass]">
             Try now
           </button>
         </a>

From 6471ae4d494c1c666731e5b9d5a38d9c6c7295c1 Mon Sep 17 00:00:00 2001
From: Steph <35910788+huynhicode@users.noreply.github.com>
Date: Thu, 13 Feb 2025 01:59:42 -0800
Subject: [PATCH 3/5] additional changes

---
 packages/mermaid/src/docs/.vitepress/components/TopBar.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
index 179b8759a..bc3b1a199 100644
--- a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
+++ b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
@@ -108,7 +108,6 @@ const allTaglines: Taglines[] = [
   },
 ];
 
-// Randomly select group A, B, C, or D
 const groups = ['A', 'B', 'C', 'D'];
 const selectedGroup = groups[Math.floor(Math.random() * groups.length)];
 const taglines = allTaglines.filter((tagline) => tagline.name.startsWith(selectedGroup));
@@ -144,7 +143,7 @@ const buttonClass = computed(() => {
           class="unstyled flex justify-center items-center gap-4 text-white tracking-wide plausible-event-name=bannerClick"
         >
           <span class="font-semibold">{{ taglines[index].label }}</span>
-          <button :class="['rounded-lg p-2 px-4 font-semibold tracking-wide', buttonClass]">
+          <button :class="['rounded-lg p-1.5 px-4 font-semibold tracking-wide', buttonClass]">
             Try now
           </button>
         </a>

From 0342579b9c6392ae5286de25ae4fe9117e904dfb Mon Sep 17 00:00:00 2001
From: Steph <35910788+huynhicode@users.noreply.github.com>
Date: Thu, 13 Feb 2025 15:05:24 -0800
Subject: [PATCH 4/5] additional updates

---
 .../src/docs/.vitepress/components/TopBar.vue | 205 ++++++++----------
 1 file changed, 92 insertions(+), 113 deletions(-)

diff --git a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
index bc3b1a199..14d495e62 100644
--- a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
+++ b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
@@ -3,114 +3,99 @@ import { ref, onMounted, computed } from 'vue';
 import { namespace } from '../../../../dist/diagrams/state/stateDb';
 
 interface Taglines {
-  name: string;
-  design: string;
   label: string;
   url: string;
 }
 
-const allTaglines: Taglines[] = [
-  {
-    name: 'A AI Bundle',
-    design: '1',
-    label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
-    url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_A',
+const allTaglines: { [key: string]: { design: number; taglines: Taglines[] } } = {
+  A: {
+    design: 1,
+    taglines: [
+      {
+        label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
+        url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_A',
+      },
+      {
+        label: 'Diagram live with teammates in Mermaid Chart',
+        url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_A',
+      },
+      {
+        label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
+        url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_A',
+      },
+      {
+        label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+        url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_A',
+      },
+    ],
   },
-  {
-    name: 'B AI Bundle',
-    design: '2',
-    label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
-    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_B',
+  B: {
+    design: 2,
+    taglines: [
+      {
+        label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
+        url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_B',
+      },
+      {
+        label: 'Diagram live with teammates in Mermaid Chart',
+        url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_B',
+      },
+      {
+        label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
+        url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_B',
+      },
+      {
+        label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+        url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_A',
+      },
+    ],
   },
-  {
-    name: 'C AI Bundle',
-    design: '1',
-    label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
-    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_C',
+  C: {
+    design: 1,
+    taglines: [
+      {
+        label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
+        url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_C',
+      },
+      {
+        label: 'Diagram live with teammates in Mermaid Pro',
+        url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_C',
+      },
+      {
+        label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
+        url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_C',
+      },
+      {
+        label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+        url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_B',
+      },
+    ],
   },
-  {
-    name: 'D AI Bundle',
-    design: '2',
-    label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
-    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_D',
+  D: {
+    design: 2,
+    taglines: [
+      {
+        label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
+        url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_D',
+      },
+      {
+        label: 'Diagram live with teammates in Mermaid Pro',
+        url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_D',
+      },
+      {
+        label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
+        url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_D',
+      },
+      {
+        label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+        url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_B',
+      },
+    ],
   },
-  {
-    name: 'A Teams',
-    design: '1',
-    label: 'Diagram live with teammates in Mermaid Chart',
-    url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_A',
-  },
-  {
-    name: 'B Teams',
-    design: '2',
-    label: 'Diagram live with teammates in Mermaid Chart',
-    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_B',
-  },
-  {
-    name: 'C Teams',
-    design: '1',
-    label: 'Diagram live with teammates in Mermaid Pro',
-    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_C',
-  },
-  {
-    name: 'D Teams',
-    design: '2',
-    label: 'Diagram live with teammates in Mermaid Pro',
-    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_D',
-  },
-  {
-    name: 'A Visual Editor',
-    design: '1',
-    label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
-    url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_A',
-  },
-  {
-    name: 'B Visual Editor',
-    design: '2',
-    label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
-    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_B',
-  },
-  {
-    name: 'C Visual Editor',
-    design: '1',
-    label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
-    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_C',
-  },
-  {
-    name: 'D Visual Editor',
-    design: '2',
-    label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
-    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_D',
-  },
-  {
-    name: 'A Whiteboard',
-    design: '1',
-    label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
-    url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_A',
-  },
-  {
-    name: 'B Whiteboard',
-    design: '2',
-    label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
-    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_A',
-  },
-  {
-    name: 'C Whiteboard',
-    design: '1',
-    label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
-    url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_B',
-  },
-  {
-    name: 'D Whiteboard',
-    design: '2',
-    label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
-    url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_B',
-  },
-];
+};
 
-const groups = ['A', 'B', 'C', 'D'];
-const selectedGroup = groups[Math.floor(Math.random() * groups.length)];
-const taglines = allTaglines.filter((tagline) => tagline.name.startsWith(selectedGroup));
+const { design, taglines } =
+  Object.values(allTaglines)[Math.floor(Math.random() * Object.values(allTaglines).length)];
 
 let index = ref(Math.floor(Math.random() * taglines.length));
 onMounted(() => {
@@ -118,22 +103,13 @@ onMounted(() => {
     index.value = (index.value + 1) % taglines.length;
   }, 5_000);
 });
-
-const currentDesign = computed(() => {
-  const designMap: { [key: string]: string } = {
-    '1': 'bg-gradient-to-r from-[#bd34fe] to-[#ff3670] ',
-    '2': 'bg-[#2E2183]',
-  };
-  return designMap[taglines[index.value].design];
-});
-
-const buttonClass = computed(() => {
-  return taglines[index.value].design === '1' ? 'bg-[#2E2183]' : 'bg-[#E0095F]';
-});
 </script>
 
 <template>
-  <div :class="[currentDesign]" class="mb-4 w-full top-bar flex p-2">
+  <div
+    :class="[design === 1 ? 'bg-gradient-to-r from-[#bd34fe] to-[#ff3670] ' : 'bg-[#2E2183]']"
+    class="mb-4 w-full top-bar flex p-2"
+  >
     <p class="w-full tracking-wide fade-text">
       <transition name="fade" mode="out-in">
         <a
@@ -143,7 +119,10 @@ const buttonClass = computed(() => {
           class="unstyled flex justify-center items-center gap-4 text-white tracking-wide plausible-event-name=bannerClick"
         >
           <span class="font-semibold">{{ taglines[index].label }}</span>
-          <button :class="['rounded-lg p-1.5 px-4 font-semibold tracking-wide', buttonClass]">
+          <button
+            :class="[design === 1 ? 'bg-[#2E2183]' : 'bg-[#E0095F]']"
+            class="rounded-lg p-1.5 px-4 font-semibold tracking-wide"
+          >
             Try now
           </button>
         </a>

From 8ab60c3a7a6665f926d4f70bdcf4b7879b906b69 Mon Sep 17 00:00:00 2001
From: Steph <35910788+huynhicode@users.noreply.github.com>
Date: Thu, 13 Feb 2025 15:07:50 -0800
Subject: [PATCH 5/5] remove unused import

---
 packages/mermaid/src/docs/.vitepress/components/TopBar.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
index 14d495e62..8f7314b54 100644
--- a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
+++ b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
@@ -1,6 +1,5 @@
 <script setup lang="ts">
 import { ref, onMounted, computed } from 'vue';
-import { namespace } from '../../../../dist/diagrams/state/stateDb';
 
 interface Taglines {
   label: string;