fix: allow multiple chars in click event node id (#60)

Author: dword-design

src/add-click-event.js

@@ -0,0 +1,2 @@
+export default (diagram, options = {}) =>
+  diagram.replace(/^(\s*click\s+[^\s]+\s*)$/gm, `$1 mermaidClick_${options.id}`)

src/click-event-regex.spec.js

@@ -0,0 +1,35 @@
+import { endent } from '@dword-design/functions'
+import tester from '@dword-design/tester'
+
+import self from './add-click-event'
+
+export default tester(
+  {
+    'multiple chars': {
+      result: endent`
+      graph TD
+        click AA mermaidClick_<id>
+    `,
+      subject: endent`
+      graph TD
+        click AA
+    `,
+    },
+    works: {
+      result: endent`
+      graph TD
+        click A mermaidClick_<id>
+    `,
+      subject: endent`
+      graph TD
+        click A
+    `,
+    },
+  },
+  [
+    {
+      transform: test => () =>
+        expect(self(test.subject, { id: '<id>' })).toEqual(test.result),
+    },
+  ]
+)

src/index.vue

@@ -1,16 +1,15 @@
 <script>
 import { nanoid } from 'nanoid'
 
+import addClickEvent from './add-click-event'
+
 export default {
   beforeDestroy() {
     delete window[`mermaidClick_${this.id}`]
   },
   computed: {
     finalValue() {
-      return this.value.replace(
-        /^(\s*click\s+[^\s]\s*)$/gm,
-        `$1 mermaidClick_${this.id}`
-      )
+      return addClickEvent(this.value, { id: this.id })
     },
     id: () => nanoid(),
   },