add heading anchors

src/plugins/rehype.js

@@ -12,15 +12,16 @@ export function localPlugins() {
         let dropcapAdded = false;
 
         let moduleScript;
-        let imports = [];
+        let imports = new Set();
         if (needsDropcap) {
-            imports.push("import Dropcap from '$lib/Dropcap.svelte';");
+            imports.add("import Dropcap from '$lib/Dropcap.svelte';");
         }
 
         visit(tree, node => {
             // add slugs to headings
             if (isHeading(node)) {
                 processHeading(node);
+                imports.add("import Heading from '$lib/Heading.svelte';");
                 return SKIP;
             }
 
@@ -38,7 +39,7 @@ export function localPlugins() {
         });
 
         // insert our imports at the top of the `<script context="module">` tag
-        if (imports.length > 0) {
+        if (imports.size > 0) {
             const script = moduleScript.value;
             // split the script where the opening tag ends
             const i = script.indexOf('>');
@@ -46,15 +47,18 @@ export function localPlugins() {
             const remainder = script.slice(i + 1);
 
             // mdvsex uses tabs so we will as well
-            const importScript = imports.join('\n\t');
+            const importScript = Array.from(imports).join('\n\t');
 
-            moduleScript.value = `${openingTag}\n\t${imports}${remainder}`;
+            moduleScript.value = `${openingTag}\n\t${importScript}${remainder}`;
         }
     }
 }
 
 
 function processHeading(node) {
+    const level = node.tagName.slice(1);
+    node.tagName = 'Heading';
+    node.properties.level = level;
     node.properties.id = makeSlug(toText(node));
 }