basic search implementation

globals.d.ts

@@ -0,0 +1,10 @@
+export declare global {
+  interface Document {
+    addEventListener<K extends keyof CustomEventMap>(type: K,
+      listener: (this: Document, ev: CustomEventMap[K]) => void): void;
+    dispatchEvent<K extends keyof CustomEventMap>(ev: CustomEventMap[K]): void;
+  }
+  interface Window {
+    spaNavigate(url: URL, isBack: boolean = false)
+  }
+}

package-lock.json

@@ -15,8 +15,8 @@
         "chalk": "^4.1.2",
         "cli-spinner": "^0.2.10",
         "d3": "^7.8.5",
-        "d3-force-reuse": "^1.0.1",
         "esbuild-sass-plugin": "^2.9.0",
+        "flexsearch": "0.7.21",
         "github-slugger": "^2.0.0",
         "globby": "^13.1.4",
         "gray-matter": "^4.0.3",
@@ -57,6 +57,7 @@
       "devDependencies": {
         "@types/cli-spinner": "^0.2.1",
         "@types/d3": "^7.4.0",
+        "@types/flexsearch": "^0.7.3",
         "@types/hast": "^2.3.4",
         "@types/node": "^20.1.2",
         "@types/pretty-time": "^1.1.2",
@@ -403,20 +404,20 @@
       "integrity": "sha512-Bu+AMaXNjrpjh41znzHqaz3r2Nr8hHuHZT6V2LBKMhyMl0FgKA62PNYbqnfgmzOhoWZj70Zecisbo4H1rotP5g=="
     },
     "node_modules/@floating-ui/dom": {
-      "version": "1.4.0",
+      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.4.0.tgz",
+      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.4.1.tgz",
-      "integrity": "sha512-b4F0iWffLiqb/TpP2PWVOixrZqE6ni+6VT64AmFH7sJIF3SFPLbe6/h3jQ5Cwffs+HaC9A8V0TQzCPBwVvziIA==",
+      "integrity": "sha512-loCXUOLzIC3jp50RFOKXZ/kQjjz26ryr/23M+FWG9jrmAv8lRf3DUfC2AiVZ3+K316GOhB08CR+Povwz8e9mDw==",
       "dependencies": {
         "@floating-ui/core": "^1.3.1"
       }
     },
     "node_modules/@inquirer/checkbox": {
-      "version": "1.2.8",
+      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/@inquirer/checkbox/-/checkbox-1.2.8.tgz",
+      "resolved": "https://registry.npmjs.org/@inquirer/checkbox/-/checkbox-1.3.1.tgz",
-      "integrity": "sha512-yTnAsimBDy2Ft5Ky/0nNqJLkLYTX9/teuvkAHKm+aeOMVSaUfp8bPchkj6VThR5AHwzUhSnUswuYVUzTzWMzsw==",
+      "integrity": "sha512-3l3aC6gYOPGaVOa9cNe4dZ8t96e3CFifC3Hee1MD+F7qaRxGAuXnhCQiUr4ngj2P7xd9U3DCDbLXNsLKQoHYCg==",
       "dependencies": {
-        "@inquirer/core": "^1.3.0",
+        "@inquirer/core": "^2.1.0",
-        "@inquirer/type": "^1.0.5",
+        "@inquirer/type": "^1.1.0",
         "ansi-escapes": "^4.3.2",
         "chalk": "^4.1.2",
         "figures": "^3.2.0"
@@ -425,6 +426,27 @@
         "node": ">=14.18.0"
       }
     },
+    "node_modules/@inquirer/checkbox/node_modules/@inquirer/core": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-2.1.0.tgz",
+      "integrity": "sha512-Hq9hZ5G/VUaeWkSs283HZwwMbe79lcOI5HWwW1GIM1ohouy2/x489Qf/A1BJYvMUj+QG4LSB5LtVMjn9P3Ge6Q==",
+      "dependencies": {
+        "@inquirer/type": "^1.1.0",
+        "ansi-escapes": "^4.3.2",
+        "chalk": "^4.1.2",
+        "cli-spinners": "^2.8.0",
+        "cli-width": "^4.0.0",
+        "figures": "^3.2.0",
+        "mute-stream": "^1.0.0",
+        "run-async": "^3.0.0",
+        "string-width": "^4.2.3",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=14.18.0"
+      }
+    },
     "node_modules/@inquirer/confirm": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/@inquirer/confirm/-/confirm-1.0.11.tgz",
@@ -460,12 +482,12 @@
       }
     },
     "node_modules/@inquirer/editor": {
-      "version": "1.0.11",
+      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/editor/-/editor-1.0.11.tgz",
+      "resolved": "https://registry.npmjs.org/@inquirer/editor/-/editor-1.2.0.tgz",
-      "integrity": "sha512-fAvkEKVRelMe5NzB1GM2zmAqbV0OWwAhXd6r34VgCKBAEfwI622A3M06g0ObL9qkcs0U+YW0G943X0ZqcUmKnQ==",
+      "integrity": "sha512-NMXLLNadvqIR6TD6mNZRa/PKHTvdaa4ndGGeXl+DwybQ4K7cVSJNRrztixpM1KDEoG8Ape5ightNwq25cyugTg==",
       "dependencies": {
-        "@inquirer/core": "^1.3.0",
+        "@inquirer/core": "^2.1.0",
-        "@inquirer/type": "^1.0.5",
+        "@inquirer/type": "^1.1.0",
         "chalk": "^4.1.2",
         "external-editor": "^3.0.3"
       },
@@ -473,13 +495,34 @@
         "node": ">=14.18.0"
       }
     },
-    "node_modules/@inquirer/expand": {
+    "node_modules/@inquirer/editor/node_modules/@inquirer/core": {
-      "version": "1.0.11",
+      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/expand/-/expand-1.0.11.tgz",
+      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-2.1.0.tgz",
-      "integrity": "sha512-7JBEHJGyNx2KdRbrVrkD7aNz9P8FI54ug3WORwaJ3q/z19jy8+ItkswEkSn0cy1QHhB30fx3QlJdjFX14i59wA==",
+      "integrity": "sha512-Hq9hZ5G/VUaeWkSs283HZwwMbe79lcOI5HWwW1GIM1ohouy2/x489Qf/A1BJYvMUj+QG4LSB5LtVMjn9P3Ge6Q==",
       "dependencies": {
-        "@inquirer/core": "^1.3.0",
+        "@inquirer/type": "^1.1.0",
-        "@inquirer/type": "^1.0.5",
+        "ansi-escapes": "^4.3.2",
+        "chalk": "^4.1.2",
+        "cli-spinners": "^2.8.0",
+        "cli-width": "^4.0.0",
+        "figures": "^3.2.0",
+        "mute-stream": "^1.0.0",
+        "run-async": "^3.0.0",
+        "string-width": "^4.2.3",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=14.18.0"
+      }
+    },
+    "node_modules/@inquirer/expand": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@inquirer/expand/-/expand-1.1.1.tgz",
+      "integrity": "sha512-fXk5NG2FOAiluDWPYfXHuof3sklL/HhZh3NnXfnBZ2IhTCRzXvlXRcQcPlev2sGcZknHn0g6JdKlxjSa+7H2nQ==",
+      "dependencies": {
+        "@inquirer/core": "^2.1.0",
+        "@inquirer/type": "^1.1.0",
         "chalk": "^4.1.2",
         "figures": "^3.2.0"
       },
@@ -487,26 +530,68 @@
         "node": ">=14.18.0"
       }
     },
-    "node_modules/@inquirer/input": {
+    "node_modules/@inquirer/expand/node_modules/@inquirer/core": {
-      "version": "1.1.2",
+      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/input/-/input-1.1.2.tgz",
+      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-2.1.0.tgz",
-      "integrity": "sha512-7/fS1EE9gvQJ7/NVKpsoyJeZAqbEoOiQBg6D8+YaCwnbEldXhKSyS53VlWoYrDWryw8XNutMpJI3o9vLxDw8KQ==",
+      "integrity": "sha512-Hq9hZ5G/VUaeWkSs283HZwwMbe79lcOI5HWwW1GIM1ohouy2/x489Qf/A1BJYvMUj+QG4LSB5LtVMjn9P3Ge6Q==",
       "dependencies": {
-        "@inquirer/core": "^1.3.0",
+        "@inquirer/type": "^1.1.0",
-        "@inquirer/type": "^1.0.5",
+        "ansi-escapes": "^4.3.2",
+        "chalk": "^4.1.2",
+        "cli-spinners": "^2.8.0",
+        "cli-width": "^4.0.0",
+        "figures": "^3.2.0",
+        "mute-stream": "^1.0.0",
+        "run-async": "^3.0.0",
+        "string-width": "^4.2.3",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=14.18.0"
+      }
+    },
+    "node_modules/@inquirer/input": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@inquirer/input/-/input-1.2.1.tgz",
+      "integrity": "sha512-OYwG3dEo1+lMAE6rYB8b1HTg8eSP++jk0pHSjKZu00gTlN5IHW/dliB82nsWe9Bn//93E9LJ1KrhjFMqOzkCFw==",
+      "dependencies": {
+        "@inquirer/core": "^2.1.0",
+        "@inquirer/type": "^1.1.0",
         "chalk": "^4.1.2"
       },
       "engines": {
         "node": ">=14.18.0"
       }
     },
-    "node_modules/@inquirer/password": {
+    "node_modules/@inquirer/input/node_modules/@inquirer/core": {
-      "version": "1.0.11",
+      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/password/-/password-1.0.11.tgz",
+      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-2.1.0.tgz",
-      "integrity": "sha512-2GtNIBN906V5PzLFe0GIrXKInZM47T7QZdET0ML0sdGn4HFI7WEN+Gw0W2yC+0xhiTtm1kdrhFxRNIq8AZFnLA==",
+      "integrity": "sha512-Hq9hZ5G/VUaeWkSs283HZwwMbe79lcOI5HWwW1GIM1ohouy2/x489Qf/A1BJYvMUj+QG4LSB5LtVMjn9P3Ge6Q==",
       "dependencies": {
-        "@inquirer/input": "^1.1.2",
+        "@inquirer/type": "^1.1.0",
-        "@inquirer/type": "^1.0.5",
+        "ansi-escapes": "^4.3.2",
+        "chalk": "^4.1.2",
+        "cli-spinners": "^2.8.0",
+        "cli-width": "^4.0.0",
+        "figures": "^3.2.0",
+        "mute-stream": "^1.0.0",
+        "run-async": "^3.0.0",
+        "string-width": "^4.2.3",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=14.18.0"
+      }
+    },
+    "node_modules/@inquirer/password": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@inquirer/password/-/password-1.1.1.tgz",
+      "integrity": "sha512-3M03aA04hOA4lRjLviB9uGoNmmd1YDNo4CYSFM9Uh4qlXdgvhke3xPU07k3kVstRIo0Te1hF14RL7vEgHJQ8tA==",
+      "dependencies": {
+        "@inquirer/input": "^1.2.1",
+        "@inquirer/type": "^1.1.0",
         "chalk": "^4.1.2"
       },
       "engines": {
@@ -533,25 +618,46 @@
       }
     },
     "node_modules/@inquirer/rawlist": {
-      "version": "1.1.3",
+      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@inquirer/rawlist/-/rawlist-1.1.3.tgz",
+      "resolved": "https://registry.npmjs.org/@inquirer/rawlist/-/rawlist-1.2.1.tgz",
-      "integrity": "sha512-aBlXdQeADYbk9pFG4Z8HvRnjM7i/RYKJmf311infV2ivkD+d1QIdWdo0RnCuqk0m/6tdYsRgkhWGVhEkeh0nQg==",
+      "integrity": "sha512-t8lMbE3Gqook4PvQYQl9eVJrl/mBy5kCgolwY9El8HLyGZ7Wc3SGIqHnQUlha4qms8HPOdUIBzyPfcAXl5+3SQ==",
       "dependencies": {
-        "@inquirer/core": "^1.3.0",
+        "@inquirer/core": "^2.1.0",
-        "@inquirer/type": "^1.0.5",
+        "@inquirer/type": "^1.1.0",
         "chalk": "^4.1.2"
       },
       "engines": {
         "node": ">=14.18.0"
       }
     },
-    "node_modules/@inquirer/select": {
+    "node_modules/@inquirer/rawlist/node_modules/@inquirer/core": {
-      "version": "1.1.7",
+      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/select/-/select-1.1.7.tgz",
+      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-2.1.0.tgz",
-      "integrity": "sha512-3Ym0WOoVduu/AG5GwIxa+fNz8Eop7S1zADbUmMsllrubdYu7qMe9HaTHCb5JOjaVNSoFJuYPH6TizFzGVFVrCQ==",
+      "integrity": "sha512-Hq9hZ5G/VUaeWkSs283HZwwMbe79lcOI5HWwW1GIM1ohouy2/x489Qf/A1BJYvMUj+QG4LSB5LtVMjn9P3Ge6Q==",
       "dependencies": {
-        "@inquirer/core": "^1.3.0",
+        "@inquirer/type": "^1.1.0",
-        "@inquirer/type": "^1.0.5",
+        "ansi-escapes": "^4.3.2",
+        "chalk": "^4.1.2",
+        "cli-spinners": "^2.8.0",
+        "cli-width": "^4.0.0",
+        "figures": "^3.2.0",
+        "mute-stream": "^1.0.0",
+        "run-async": "^3.0.0",
+        "string-width": "^4.2.3",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=14.18.0"
+      }
+    },
+    "node_modules/@inquirer/select": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@inquirer/select/-/select-1.2.1.tgz",
+      "integrity": "sha512-13JDLtlwFoqQUYRdMzz5wP3a4DWccJfNA/8M8MDUhhZ8HeKZ3MPaTMlpxwY+Q0Jgbmt56nf7xUuck0XXPce8Xw==",
+      "dependencies": {
+        "@inquirer/core": "^2.1.0",
+        "@inquirer/type": "^1.1.0",
         "ansi-escapes": "^4.3.2",
         "chalk": "^4.1.2",
         "figures": "^3.2.0"
@@ -560,10 +666,31 @@
         "node": ">=14.18.0"
       }
     },
+    "node_modules/@inquirer/select/node_modules/@inquirer/core": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-2.1.0.tgz",
+      "integrity": "sha512-Hq9hZ5G/VUaeWkSs283HZwwMbe79lcOI5HWwW1GIM1ohouy2/x489Qf/A1BJYvMUj+QG4LSB5LtVMjn9P3Ge6Q==",
+      "dependencies": {
+        "@inquirer/type": "^1.1.0",
+        "ansi-escapes": "^4.3.2",
+        "chalk": "^4.1.2",
+        "cli-spinners": "^2.8.0",
+        "cli-width": "^4.0.0",
+        "figures": "^3.2.0",
+        "mute-stream": "^1.0.0",
+        "run-async": "^3.0.0",
+        "string-width": "^4.2.3",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=14.18.0"
+      }
+    },
     "node_modules/@inquirer/type": {
-      "version": "1.0.5",
+      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/type/-/type-1.0.5.tgz",
+      "resolved": "https://registry.npmjs.org/@inquirer/type/-/type-1.1.0.tgz",
-      "integrity": "sha512-MCEsk3Ep4D8UwwyCGdMmtoTwfC78oxHusUKex1qR+WTJP4MKK/mykCTCXApbYYRBYuTpT71kdoOr9vxySh+l5Q==",
+      "integrity": "sha512-XMaorygt2o/mXinZg/OOz6d3JKuV3o4jRc/3KDiVPeKLLkjiO4iJErbLKtKn+Od2ZC2lbiFQkrIuloVpEubisA==",
       "engines": {
         "node": ">=14.18.0"
       }
@@ -1158,6 +1285,12 @@
         "@types/ms": "*"
       }
     },
+    "node_modules/@types/flexsearch": {
+      "version": "0.7.3",
+      "resolved": "https://registry.npmjs.org/@types/flexsearch/-/flexsearch-0.7.3.tgz",
+      "integrity": "sha512-HXwADeHEP4exXkCIwy2n1+i0f1ilP1ETQOH5KDOugjkTFZPntWo0Gr8stZOaebkxsdx+k0X/K6obU/+it07ocg==",
+      "dev": true
+    },
     "node_modules/@types/geojson": {
       "version": "7946.0.10",
       "resolved": "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.10.tgz",
@@ -1199,9 +1332,9 @@
       }
     },
     "node_modules/@types/node": {
-      "version": "20.2.5",
+      "version": "20.3.1",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.2.5.tgz",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.3.1.tgz",
-      "integrity": "sha512-JJulVEQXmiY9Px5axXHeYGLSjhkZEnD+MDPDGbCbIAbMslkKwmygtZFy1X6s/075Yo94sf8GuSlFfPzysQrWZQ==",
+      "integrity": "sha512-EhcH/wvidPy1WeML3TtYFGR83UzjxeWRen9V402T8aUGYsCHOmfoisV3ZSg03gAFIbLq8TnWOJ0f4cALtnSEUg==",
       "dev": true
     },
     "node_modules/@types/parse5": {
@@ -1519,11 +1652,11 @@
       }
     },
     "node_modules/commander": {
-      "version": "8.3.0",
+      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-7.2.0.tgz",
-      "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==",
+      "integrity": "sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==",
       "engines": {
-        "node": ">= 12"
+        "node": ">= 10"
       }
     },
     "node_modules/concat-map": {
@@ -1711,25 +1844,6 @@
         "node": ">=12"
       }
     },
-    "node_modules/d3-dsv/node_modules/commander": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-7.2.0.tgz",
-      "integrity": "sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==",
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/d3-dsv/node_modules/iconv-lite": {
-      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
-      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
-      "dependencies": {
-        "safer-buffer": ">= 2.1.2 < 3.0.0"
-      },
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/d3-ease": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/d3-ease/-/d3-ease-3.0.1.tgz",
@@ -1762,19 +1876,6 @@
         "node": ">=12"
       }
     },
-    "node_modules/d3-force-reuse": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/d3-force-reuse/-/d3-force-reuse-1.0.1.tgz",
-      "integrity": "sha512-TyJfszB6JZmzOYr3oDayjm0LE1Fz0wsn9DkDcYopDOXY/M07rTTDGQ5wYQMZjmcobND3+Og53CATORFbFuQUqw==",
-      "dependencies": {
-        "d3-quadtree": "^1.0.3"
-      }
-    },
-    "node_modules/d3-force-reuse/node_modules/d3-quadtree": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/d3-quadtree/-/d3-quadtree-1.0.7.tgz",
-      "integrity": "sha512-RKPAeXnkC59IDGD0Wu5mANy0Q2V28L+fNe65pOCXVdVuTJS3WPKaJlFHer32Rbh9gIo9qMuJXio8ra4+YmIymA=="
-    },
     "node_modules/d3-format": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-3.1.0.tgz",
@@ -2143,6 +2244,17 @@
         "node": ">=4"
       }
     },
+    "node_modules/external-editor/node_modules/iconv-lite": {
+      "version": "0.4.24",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
+      "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/fast-glob": {
       "version": "3.2.12",
       "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.12.tgz",
@@ -2211,6 +2323,11 @@
         "node": ">=8"
       }
     },
+    "node_modules/flexsearch": {
+      "version": "0.7.21",
+      "resolved": "https://registry.npmjs.org/flexsearch/-/flexsearch-0.7.21.tgz",
+      "integrity": "sha512-W7cHV7Hrwjid6lWmy0IhsWDFQboWSng25U3VVywpHOTJnnAZNPScog67G+cVpeX9f7yDD21ih0WDrMMT+JoaYg=="
+    },
     "node_modules/foreground-child": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.1.1.tgz",
@@ -2266,9 +2383,9 @@
       "integrity": "sha512-IaOQ9puYtjrkq7Y0Ygl9KDZnrf/aiUJYUpVf89y8kyaxbRG7Y1SrX/jaumrv81vc61+kiMempujsM3Yw7w5qcw=="
     },
     "node_modules/glob": {
-      "version": "10.2.6",
+      "version": "10.2.7",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.2.6.tgz",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-10.2.7.tgz",
-      "integrity": "sha512-U/rnDpXJGF414QQQZv5uVsabTVxMSwzS5CH0p3DRCIV6ownl4f7PzGnkGmvlum2wB+9RlJWJZ6ACU1INnBqiPA==",
+      "integrity": "sha512-jTKehsravOJo8IJxUGfZILnkvVJM/MOfHRs8QcXolVef2zNI9Tqyy5+SeuOAZd3upViEZQLyFpQhYiHLrMUNmA==",
       "dependencies": {
         "foreground-child": "^3.1.0",
         "jackspeak": "^2.0.3",
@@ -2298,9 +2415,9 @@
       }
     },
     "node_modules/globby": {
-      "version": "13.1.4",
+      "version": "13.2.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-13.1.4.tgz",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-13.2.0.tgz",
-      "integrity": "sha512-iui/IiiW+QrJ1X1hKH5qwlMQyv34wJAYwH1vrf8b9kBA4sNiif3gKsMHa+BrdnOpEudWjpotfa7LrTzB1ERS/g==",
+      "integrity": "sha512-jWsQfayf13NvqKUIL3Ta+CIqMnvlaIDFveWE/dpOZ9+3AMEJozsxDvKA02zync9UuvOM8rOXzsD5GqKP4OnWPQ==",
       "dependencies": {
         "dir-glob": "^3.0.1",
         "fast-glob": "^3.2.11",
@@ -2609,11 +2726,11 @@
       }
     },
     "node_modules/iconv-lite": {
-      "version": "0.4.24",
+      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
-      "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
+      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
       "dependencies": {
-        "safer-buffer": ">= 2.1.2 < 3"
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
       },
       "engines": {
         "node": ">=0.10.0"
@@ -2820,6 +2937,14 @@
         "katex": "cli.js"
       }
     },
+    "node_modules/katex/node_modules/commander": {
+      "version": "8.3.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz",
+      "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==",
+      "engines": {
+        "node": ">= 12"
+      }
+    },
     "node_modules/kind-of": {
       "version": "6.0.3",
       "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz",
@@ -2846,9 +2971,9 @@
       }
     },
     "node_modules/lru-cache": {
-      "version": "9.1.1",
+      "version": "9.1.2",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-9.1.1.tgz",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-9.1.2.tgz",
-      "integrity": "sha512-65/Jky17UwSb0BuB9V+MyDpsOtXKmYwzhyl+cOa9XUiI4uV2Ouy/2voFP3+al0BjZbJgMBD8FojMpAf+Z+qn4A==",
+      "integrity": "sha512-ERJq3FOzJTxBbFjZ7iDs+NiK4VI9Wz+RdrrAB8dio1oV+YvdPzUEE4QNiT2VD51DkIbCYRUUzCRkssXCHqSnKQ==",
       "engines": {
         "node": "14 || >=16.14"
       }
@@ -3889,9 +4014,9 @@
       }
     },
     "node_modules/preact-render-to-string": {
-      "version": "6.0.3",
+      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/preact-render-to-string/-/preact-render-to-string-6.0.3.tgz",
+      "resolved": "https://registry.npmjs.org/preact-render-to-string/-/preact-render-to-string-6.1.0.tgz",
-      "integrity": "sha512-UUP+EtmLw5ns0fT9C7+CTdLawm1wLmlrZ6WKzJ4Jwhb4EBu4vy5ufIZKlrfvWNnPl1JFoJzZwzfKs97H4N0Vug==",
+      "integrity": "sha512-/AsKU4Q4R8r4aKwwNQrkQQNUVEDmTeZr6IwesDffobFRPcTk4dSQrfo1VOcXjtlcUss6QYEe7JShUGbQIhaw+A==",
       "dependencies": {
         "pretty-format": "^3.8.0"
       },
@@ -4005,10 +4130,11 @@
       }
     },
     "node_modules/rehype-pretty-code": {
-      "version": "0.9.6",
+      "version": "0.9.8",
-      "resolved": "https://registry.npmjs.org/rehype-pretty-code/-/rehype-pretty-code-0.9.6.tgz",
+      "resolved": "https://registry.npmjs.org/rehype-pretty-code/-/rehype-pretty-code-0.9.8.tgz",
-      "integrity": "sha512-l94QKT6w00AIJp1FsbVnbKmcEckKdYkJQfstgiSI4GTt/hSdDrnQRz6rP8r01x1rXNFC2exMG4WY0X7fOpVQGw==",
+      "integrity": "sha512-pwCqh4Y+D2brWBGLu8i9aRP+rfnABdwFIXJ1dSInC+Xf7PxoEOVGNvngFSsfplpJ88IfcgiGirXa+9cIsLEhlA==",
       "dependencies": {
+        "@types/hast": "^2.0.0",
         "hash-obj": "^4.0.0",
         "parse-numeric-range": "^1.3.0"
       },
@@ -4333,9 +4459,9 @@
       "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
     },
     "node_modules/sass": {
-      "version": "1.62.1",
+      "version": "1.63.4",
-      "resolved": "https://registry.npmjs.org/sass/-/sass-1.62.1.tgz",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.63.4.tgz",
-      "integrity": "sha512-NHpxIzN29MXvWiuswfc1W3I0N8SXBd8UR26WntmDlRYf0bSADnwnOjsyMZ3lMezSlArD33Vs3YFhp7dWvL770A==",
+      "integrity": "sha512-Sx/+weUmK+oiIlI+9sdD0wZHsqpbgQg8wSwSnGBjwb5GwqFhYNwwnI+UWZtLjKvKyFlKkatRK235qQ3mokyPoQ==",
       "dependencies": {
         "chokidar": ">=3.0.0 <4.0.0",
         "immutable": "^4.0.0",
@@ -4637,16 +4763,16 @@
       }
     },
     "node_modules/typescript": {
-      "version": "5.0.4",
+      "version": "5.1.3",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.0.4.tgz",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.1.3.tgz",
-      "integrity": "sha512-cW9T5W9xY37cc+jfEnaUvX91foxtHkza3Nw3wkoF4sSlKn0MONdkdEndig/qPBWXNkmplh3NzayQzCiHM4/hqw==",
+      "integrity": "sha512-XH627E9vkeqhlZFQuL+UsyAXEnibT0kWR2FWONlr4sTjvxyJYnyefgrkyECLzM5NenmKzRAy2rR/OlYLA1HkZw==",
       "dev": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
       },
       "engines": {
-        "node": ">=12.20"
+        "node": ">=14.17"
       }
     },
     "node_modules/unherit": {

package.json

@@ -32,6 +32,7 @@
     "cli-spinner": "^0.2.10",
     "d3": "^7.8.5",
     "esbuild-sass-plugin": "^2.9.0",
+    "flexsearch": "0.7.21",
     "github-slugger": "^2.0.0",
     "globby": "^13.1.4",
     "gray-matter": "^4.0.3",
@@ -69,6 +70,7 @@
   "devDependencies": {
     "@types/cli-spinner": "^0.2.1",
     "@types/d3": "^7.4.0",
+    "@types/flexsearch": "^0.7.3",
     "@types/hast": "^2.3.4",
     "@types/node": "^20.1.2",
     "@types/pretty-time": "^1.1.2",

quartz.config.ts

@@ -39,16 +39,16 @@ const config: QuartzConfig = {
   plugins: {
     transformers: [
       Plugin.FrontMatter(),
-      Plugin.Description(),
       Plugin.TableOfContents(),
       Plugin.CreatedModifiedDate({
         priority: ['frontmatter', 'filesystem'] // you can add 'git' here for last modified from Git but this makes the build slower
       }),
-      Plugin.GitHubFlavoredMarkdown(),
       Plugin.ObsidianFlavoredMarkdown(),
-      Plugin.ResolveLinks(),
+      Plugin.GitHubFlavoredMarkdown(),
+      Plugin.CrawlLinks(),
       Plugin.SyntaxHighlighting(),
       Plugin.Katex(),
+      Plugin.Description(),
     ],
     filters: [
       Plugin.RemoveDrafts()
@@ -60,6 +60,7 @@ const config: QuartzConfig = {
         header: [
           Component.PageTitle({ title: "🪴 Quartz 4.0" }),
           Component.Spacer(),
+          Component.Search(),
           Component.Darkmode()
         ],
         beforeBody: [
@@ -73,6 +74,7 @@ const config: QuartzConfig = {
         right: [
           Component.Graph(),
           Component.TableOfContents(),
+          Component.Backlinks()
         ],
         footer: []
       }),

quartz/bootstrap-cli.mjs

@@ -75,12 +75,14 @@ yargs(hideBin(process.argv))
               text = text.replace('export default', '')
               text = text.replace('export', '')
 
+              const sourcefile = path.relative(path.resolve('.'), args.path)
+              const resolveDir = path.dirname(sourcefile)
               const transpiled = await esbuild.build({
                 stdin: {
                   contents: text,
                   loader: 'ts',
-                  resolveDir: '.',
+                  resolveDir,
-                  sourcefile: path.relative(path.resolve('.'), args.path),
+                  sourcefile,
                 },
                 write: false,
                 bundle: true,

quartz/components/Backlinks.tsx

@@ -0,0 +1,19 @@
+import { QuartzComponentConstructor, QuartzComponentProps } from "./types"
+import style from "./styles/backlinks.scss"
+import { relativeToRoot } from "../path"
+
+function Backlinks({ fileData, allFiles }: QuartzComponentProps) {
+  const slug = fileData.slug!
+  const backlinkFiles = allFiles.filter(file => file.links?.includes(slug))
+  return <div class="backlinks">
+    <h3>Backlinks</h3>
+    <ul>
+      {backlinkFiles.length > 0 ?
+        backlinkFiles.map(f => <li><a href={relativeToRoot(slug, f.slug!)} class="internal">{f.frontmatter?.title}</a></li>)
+        : <li>No backlinks found</li>}
+    </ul>
+  </div> 
+}
+
+Backlinks.css = style 
+export default (() => Backlinks) satisfies QuartzComponentConstructor

quartz/components/Search.tsx

@@ -0,0 +1,35 @@
+import { QuartzComponentConstructor } from "./types"
+import style from "./styles/search.scss"
+// @ts-ignore
+import script from "./scripts/search.inline"
+
+export default (() => {
+  function Search() {
+    return <div class="search">
+      <div id="search-icon">
+        <p>Search</p>
+        <div></div>
+        <svg tabIndex={0} aria-labelledby="title desc" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.9 19.7">
+          <title id="title">Search</title>
+          <desc id="desc">Search</desc>
+          <g class="search-path" fill="none">
+            <path stroke-linecap="square" d="M18.5 18.3l-5.4-5.4" />
+            <circle cx="8" cy="8" r="7" />
+          </g>
+        </svg>
+      </div>
+      <div id="search-container">
+        <div id="search-space">
+          <input autocomplete="off" id="search-bar" name="search" type="text" aria-label="Search for something" placeholder="Search for something" />
+          <div id="results-container">
+          </div>
+        </div>
+      </div>
+    </div>
+  }
+
+  Search.afterDOMLoaded = script
+  Search.css = style
+
+  return Search
+}) satisfies QuartzComponentConstructor

quartz/components/index.ts

@@ -8,6 +8,8 @@ import Spacer from "./Spacer"
 import TableOfContents from "./TableOfContents"
 import TagList from "./TagList"
 import Graph from "./Graph" 
+import Backlinks from "./Backlinks"
+import Search from "./Search"
 
 export {
   ArticleTitle,
@@ -19,5 +21,7 @@ export {
   Spacer,
   TableOfContents,
   TagList,
-  Graph
+  Graph,
+  Backlinks,
+  Search
 } 

quartz/components/scripts/graph.inline.ts

@@ -1,5 +1,6 @@
 import { ContentDetails } from "../../plugins/emitters/contentIndex"
 import * as d3 from 'd3'
+import { registerEscapeHandler } from "./handler"
 
 type NodeData = {
   id: string,
@@ -25,7 +26,8 @@ function removeAllChildren(node: HTMLElement) {
 }
 
 async function renderGraph(container: string, slug: string) {
-  const graph = document.getElementById(container)!
+  const graph = document.getElementById(container)
+  if (!graph) return
   removeAllChildren(graph)
 
   let {
@@ -265,16 +267,15 @@ function renderGlobalGraph() {
   const container = document.getElementById("global-graph-outer")
   container?.classList.add("active")
 
-  function hideGlobalGraph(this: HTMLElement, e: HTMLElementEventMap["click"]) {
-    if (e.target !== this) return
 
+  function hideGlobalGraph() {
     container?.classList.remove("active")
-    const graph = document.getElementById("global-graph-container")!
+    const graph = document.getElementById("global-graph-container")
+    if (!graph) return
     removeAllChildren(graph)
   }
 
-  container?.removeEventListener("click", hideGlobalGraph)
+  registerEscapeHandler(container, hideGlobalGraph)
-  container?.addEventListener("click", hideGlobalGraph)
 }
 
 document.addEventListener("nav", async (e: unknown) => {

quartz/components/scripts/handler.ts

@@ -0,0 +1,19 @@
+export function registerEscapeHandler(outsideContainer: HTMLElement | null, cb: () => void) {
+  if (!outsideContainer) return
+  function click(this: HTMLElement, e: HTMLElementEventMap["click"]) {
+    if (e.target !== this) return
+    e.preventDefault()
+    cb()
+  }
+
+  function esc(e: HTMLElementEventMap["keydown"]) {
+    if (!e.key.startsWith("Esc")) return
+    e.preventDefault()
+    cb()
+  }
+
+  outsideContainer?.removeEventListener("click", click)
+  outsideContainer?.addEventListener("click", click)
+  document.removeEventListener("keydown", esc)
+  document.addEventListener('keydown', esc)
+}

quartz/components/scripts/popover.inline.ts

@@ -39,6 +39,7 @@ document.addEventListener("nav", () => {
 
       const popoverElement = document.createElement("div")
       popoverElement.classList.add("popover")
+      // TODO: scroll this element if we specify a header/anchor to jump to
       const popoverInner = document.createElement("div")
       popoverInner.classList.add("popover-inner")
       popoverElement.appendChild(popoverInner)

quartz/components/scripts/search.inline.ts

@@ -0,0 +1,192 @@
+import { Document } from "flexsearch"
+import { ContentDetails } from "../../plugins/emitters/contentIndex"
+import { registerEscapeHandler } from "./handler"
+
+interface Item {
+  slug: string,
+  title: string,
+  content: string,
+}
+let index: Document<Item> | undefined = undefined
+
+function relative(from: string, to: string) {
+  const pieces = [location.protocol, '//', location.host, location.pathname]
+  const url = pieces.join('').slice(0, -from.length) + to
+  return url
+}
+
+function removeAllChildren(node: HTMLElement) {
+  node.innerHTML = ``
+}
+
+const contextWindowWords = 30
+function highlight(searchTerm: string, text: string, trim?: boolean) {
+  const tokenizedTerms = searchTerm.split(/\s+/).filter(t => t !== "")
+  let tokenizedText = text
+    .split(/\s+/)
+    .filter(t => t !== "")
+
+  let startIndex = 0
+  let endIndex = tokenizedText.length - 1
+  if (trim) {
+    const includesCheck = (tok: string) => tokenizedTerms.some((term) => tok.toLowerCase().startsWith(term.toLowerCase()))
+    const occurencesIndices = tokenizedText.map(includesCheck)
+
+    let bestSum = 0
+    let bestIndex = 0
+    for (let i = 0; i < Math.max(tokenizedText.length - contextWindowWords, 0); i++) {
+      const window = occurencesIndices.slice(i, i + contextWindowWords)
+      const windowSum = window.reduce((total, cur) => total + (cur ? 1 : 0), 0)
+      if (windowSum >= bestSum) {
+        bestSum = windowSum
+        bestIndex = i
+      }
+    }
+
+    startIndex = Math.max(bestIndex - contextWindowWords, 0)
+    endIndex = Math.min(startIndex + 2 * contextWindowWords, tokenizedText.length - 1)
+    tokenizedText = tokenizedText.slice(startIndex, endIndex)
+  }
+
+  const slice = tokenizedText.map(tok => {
+    // see if this tok is prefixed by any search terms 
+    for (const searchTok of tokenizedTerms) {
+      if (tok.toLowerCase().includes(searchTok.toLowerCase())) {
+        const regex = new RegExp(searchTok, "gi")
+        return tok.replace(regex, `<span class="highlight">$&</span>`)
+      }
+    }
+    return tok
+  })
+    .join(" ")
+
+  return `${startIndex === 0 ? "" : "..."}${slice}${endIndex === tokenizedText.length - 1 ? "" : "..."}`
+}
+
+const encoder = (str: string) => str.toLowerCase().split(/([^a-z]|[^\x00-\x7F])/)
+document.addEventListener("nav", async (e: unknown) => {
+  const currentSlug = (e as CustomEventMap["nav"]).detail.url
+
+  // setup index if it hasn't been already
+  const data = await fetchData
+  if (!index) {
+    index = new Document({
+      cache: true,
+      charset: 'latin:extra',
+      optimize: true,
+      encode: encoder,
+      document: {
+        id: "slug",
+        index: [
+          {
+            field: "title",
+            tokenize: "forward",
+          },
+          {
+            field: "content",
+            tokenize: "reverse",
+          },
+        ]
+      },
+    })
+
+    for (const [slug, fileData] of Object.entries<ContentDetails>(data)) {
+      index.add({
+        slug,
+        title: fileData.title,
+        content: fileData.content
+      })
+    }
+  }
+
+  const container = document.getElementById("search-container")
+  const searchIcon = document.getElementById("search-icon")
+  const searchBar = document.getElementById("search-bar") as HTMLInputElement | null
+  const results = document.getElementById("results-container")
+
+  function hideSearch() {
+    container?.classList.remove("active")
+    if (searchBar) {
+      searchBar.value = "" // clear the input when we dismiss the search
+    }
+    if (results) {
+      removeAllChildren(results)
+    }
+  }
+
+  function showSearch() {
+    container?.classList.add("active")
+    searchBar?.focus()
+  }
+
+  function shortcutHandler(e: HTMLElementEventMap["keydown"]) {
+    if (e.key === "k" && (e.ctrlKey || e.metaKey)) {
+      e.preventDefault()
+      const searchBarOpen = container?.classList.contains("active")
+      searchBarOpen ? hideSearch() : showSearch()
+    } else if (e.key === "Enter") {
+      const anchor = document.getElementsByClassName("result-card")[0] as HTMLInputElement | null
+      if (anchor) {
+        anchor.click()
+      }
+    }
+  }
+
+  const formatForDisplay = (term: string, slug: string) => ({
+    slug,
+    title: highlight(term, data[slug].title ?? ""),
+    content: highlight(term, data[slug].content ?? "", true),
+  })
+
+  const resultToHTML = ({ slug, title, content }: Item) => {
+    const button = document.createElement("button")
+    button.classList.add("result-card")
+    button.id = slug
+    button.innerHTML = `<h3>${title}</h3><p>${content}</p>`
+    button.addEventListener('click', () => {
+      const targ = relative(currentSlug, slug)
+      window.spaNavigate(new URL(targ))
+    })
+    return button
+  }
+
+  function displayResults(finalResults: Item[]) {
+    if (!results) return
+
+    removeAllChildren(results)
+    if (finalResults.length === 0) {
+      results.innerHTML = `<button class="result-card">
+                    <h3>No results.</h3>
+                    <p>Try another search term?</p>
+                </button>`
+    } else {
+      results.append(...finalResults.map(resultToHTML))
+    }
+
+  }
+
+  function onType(e: HTMLElementEventMap["input"]) {
+    const term = (e.target as HTMLInputElement).value
+    const searchResults = index?.search(term, 5) ?? []
+    const getByField = (field: string): string[] => {
+      const results = searchResults.filter((x) => x.field === field)
+      return results.length === 0 ? [] : [...results[0].result] as string[]
+    }
+
+    // order titles ahead of content
+    const allIds: Set<string> = new Set([...getByField("title"), ...getByField("content")])
+    const finalResults = [...allIds].map(id => formatForDisplay(term, id))
+    displayResults(finalResults)
+  }
+
+
+  document.removeEventListener("keydown", shortcutHandler)
+  document.addEventListener("keydown", shortcutHandler)
+  searchIcon?.removeEventListener("click", showSearch)
+  searchIcon?.addEventListener("click", showSearch)
+  searchBar?.removeEventListener("input", onType)
+  searchBar?.addEventListener("input", onType)
+
+  // register handlers
+  registerEscapeHandler(container, hideSearch)
+})

quartz/components/styles/backlinks.scss

@@ -0,0 +1,22 @@
+.backlinks {
+  & > h3 {
+    font-size: 1rem;
+    margin: 0;
+  }
+
+  & > ul {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+
+    & > li {
+      margin: 0.5rem 0;
+      padding: 0.25rem 1rem;
+      border: var(--lightgray) 1px solid;
+      border-radius: 5px;
+      & > a {
+        background-color: transparent;
+      }
+    }
+  }
+}

quartz/components/styles/popover.scss

@@ -23,6 +23,8 @@
     height: 20rem;
     padding: 0 1rem 1rem 1rem;
     font-weight: initial;
+    line-height: initial;
+    font-size: initial;
     border: 1px solid var(--gray);
     background-color: var(--light);
     border-radius: 5px;
@@ -30,6 +32,10 @@
     overflow: scroll;
   }
 
+  h1 {
+    font-size: 1.5rem;
+  }
+
   visibility: hidden;
   opacity: 0;
   transition: opacity 0.3s ease, visibility 0.3s ease;

quartz/components/styles/search.scss

@@ -0,0 +1,134 @@
+.search {
+  min-width: 5rem;
+  max-width: 12rem;
+  flex-grow: 0.3;
+  margin: 0 1.5rem;
+
+  & > #search-icon {
+    background-color: var(--lightgray);
+    border-radius: 4px;
+    height: 2rem;
+    display: flex;
+    align-items: center;
+    cursor: pointer;
+
+    & > div {
+      flex-grow: 1;
+    }
+
+    & > p {
+      display: inline;
+      padding: 0 1rem;
+    }
+
+    & svg {
+      cursor: pointer;
+      width: 18px;
+      min-width: 18px;
+      margin: 0 0.5rem;
+
+      .search-path {
+        stroke: var(--darkgray);
+        stroke-width: 2px;
+        transition: stroke 0.5s ease;
+      }
+    }
+  }
+
+  & > #search-container {
+    position: fixed;
+    z-index: 999;
+    left: 0;
+    top: 0;
+    width: 100vw;
+    height: 100vh;
+    overflow: scroll;
+    display: none;
+    backdrop-filter: blur(4px);
+
+    &.active {
+      display: inline-block;
+    }
+
+    & > #search-space {
+      width: 50%;
+      margin-top: 15vh;
+      margin-left: auto;
+      margin-right: auto;
+
+      @media all and (max-width: 1200px) {
+        width: 90%;
+      }
+
+      & > * {
+        width: 100%;
+        border-radius: 5px;
+        background: var(--light);
+        box-shadow: 0 14px 50px rgba(27, 33, 48, 0.12), 0 10px 30px rgba(27, 33, 48, 0.16);
+        margin-bottom: 2em;
+      }
+
+      & > input {
+        box-sizing: border-box;
+        padding: 0.5em 1em;
+        font-family: var(--bodyFont);
+        color: var(--dark);
+        font-size: 1.1em;
+        border: 1px solid var(--lightgray);
+
+        &:focus {
+          outline: none;
+        }
+      }
+
+      & > #results-container {
+        & .result-card {
+          padding: 1em;
+          cursor: pointer;
+          transition: background 0.2s ease;
+          border: 1px solid var(--lightgray);
+          border-bottom: none;
+          width: 100%;
+
+          // normalize button props
+          font-family: inherit;
+          font-size: 100%;
+          line-height: 1.15;
+          margin: 0;
+          text-transform: none;
+          text-align: left;
+          background: var(--light);
+          outline: none;
+
+          & .highlight {
+            color: var(--secondary);
+          }
+
+          &:hover, &:focus {
+            background: var(--lightgray);
+          }
+
+          &:first-of-type {
+            border-top-left-radius: 5px;
+            border-top-right-radius: 5px;
+          }
+
+          &:last-of-type {
+            border-bottom-left-radius: 5px;
+            border-bottom-right-radius: 5px;
+            border-bottom: 1px solid var(--lightgray);
+          }
+
+          & > h3 {
+            margin: 0;
+          }
+
+          & > p { 
+            margin-bottom: 0;
+          }
+        }
+      }
+
+    }
+  }
+}

quartz/components/styles/toc.scss

@@ -30,7 +30,6 @@ button#toc {
   overflow: hidden;
   max-height: none;
   transition: max-height 0.3s ease;
-  font-size: 0.9rem;
 
   & ul {
     list-style: none;

quartz/components/types.ts

@@ -10,6 +10,7 @@ export type QuartzComponentProps = {
   cfg: GlobalConfiguration
   children: QuartzComponent[] | JSX.Element[]
   tree: Node<QuartzPluginData>
+  allFiles: QuartzPluginData[]
 }
 
 export type QuartzComponent = ComponentType<QuartzComponentProps> & {

quartz/path.ts

@@ -9,10 +9,6 @@ export function trimPathSuffix(fp: string): string {
   let [cleanPath, anchor] = fp.split("#", 2)
   anchor = anchor === undefined ? "" : "#" + anchor
 
-  if (cleanPath.endsWith("index")) {
-    cleanPath = cleanPath.slice(0, -"index".length)
-  }
-
   return cleanPath + anchor
 }
 
@@ -48,7 +44,8 @@ export function relativeToRoot(slug: string, fp: string): string {
 }
 
 export function relative(src: string, dest: string): string {
-  return path.relative(src, dest)
+  return "./" + path.relative(src, dest)
+
 }
 
 export const QUARTZ = "quartz"

quartz/plugins/emitters/contentIndex.ts

@@ -1,20 +1,7 @@
-import { visit } from "unist-util-visit"
 import { QuartzEmitterPlugin } from "../types"
-import { Element } from "hast"
 import path from "path"
-import { trimPathSuffix } from "../../path"
 
-interface Options {
+export type ContentIndex = Map<string, ContentDetails>
-  indexAnchorLinks: boolean,
-  indexExternalLinks: boolean,
-}
-
-const defaultOptions: Options = {
-  indexAnchorLinks: false,
-  indexExternalLinks: false,
-}
-
-export type ContentIndex = Map<string, ContentDetails> 
 export type ContentDetails = {
   title: string,
   links?: string[],
@@ -22,39 +9,17 @@ export type ContentDetails = {
   content: string,
 }
 
-export const ContentIndex: QuartzEmitterPlugin<Options> = (userOpts) => {
+export const ContentIndex: QuartzEmitterPlugin = () => {
-  const opts = { ...userOpts, ...defaultOptions }
   return {
     name: "ContentIndex",
     async emit(_contentDir, _cfg, content, _resources, emit) {
       const fp = path.join("static", "contentIndex")
       const linkIndex: ContentIndex = new Map()
-      for (const [tree, file] of content) {
+      for (const [_tree, file] of content) {
-        let slug = trimPathSuffix(file.data.slug!)
+        let slug = file.data.slug!
-
-        const outgoing: Set<string> = new Set()
-        visit(tree, 'element', (node: Element) => {
-          if (node.tagName === 'a' && node.properties && typeof node.properties.href === 'string') {
-            let dest = node.properties.href
-            if (dest.startsWith(".")) {
-              const normalizedPath = path.normalize(path.join(slug, dest))
-              dest = trimPathSuffix(normalizedPath)
-              outgoing.add(dest)
-            } else if (dest.startsWith("#")) {
-              if (opts.indexAnchorLinks) {
-                outgoing.add(dest)
-              }
-            } else {
-              if (opts.indexExternalLinks) {
-                outgoing.add(dest)
-              }
-            }
-          }
-        })
-
         linkIndex.set(slug, {
           title: file.data.frontmatter?.title!,
-          links: [...outgoing],
+          links: file.data.links ?? [],
           tags: file.data.frontmatter?.tags,
           content: file.data.text ?? ""
         })

quartz/plugins/emitters/contentPage.tsx

@@ -33,7 +33,7 @@ export const ContentPage: QuartzEmitterPlugin<Options> = (opts) => {
     },
     async emit(_contentDir, cfg, content, resources, emit): Promise<string[]> {
       const fps: string[] = []
-
+      const allFiles = content.map(c => c[1].data)
       for (const [tree, file] of content) {
         const baseDir = resolveToRoot(file.data.slug!)
         const pageResources: StaticResources = {
@@ -50,13 +50,14 @@ export const ContentPage: QuartzEmitterPlugin<Options> = (opts) => {
           externalResources: pageResources,
           cfg,
           children: [],
-          tree
+          tree,
+          allFiles
         }
 
         const Content = opts.content
         const doc = <html>
           <Head {...componentData} />
-          <body data-slug={trimPathSuffix(file.data.slug ?? "")}>
+          <body data-slug={file.data.slug ?? ""}>
             <div id="quartz-root" class="page">
               <Header {...componentData} >
                 {header.map(HeaderComponent => <HeaderComponent {...componentData} />)}

quartz/plugins/index.ts

@@ -51,6 +51,7 @@ export function emitComponentResources(cfg: GlobalConfiguration, resources: Stat
     componentResources.afterDOMLoaded.push(spaRouterScript)
   } else {
     componentResources.afterDOMLoaded.push(`
+      window.spaNavigate = (url, _) => window.location.assign(url)
       const event = new CustomEvent("nav", { detail: { slug: document.body.dataset.slug } })
       document.dispatchEvent(event)`
     )

quartz/plugins/transformers/index.ts

@@ -3,7 +3,7 @@ export { GitHubFlavoredMarkdown } from './gfm'
 export { CreatedModifiedDate } from './lastmod'
 export { Katex } from './latex'
 export { Description } from './description'
-export { ResolveLinks } from './links'
+export { CrawlLinks } from './links'
 export { ObsidianFlavoredMarkdown } from './ofm'
 export { SyntaxHighlighting } from './syntax'
 export { TableOfContents } from './toc'

quartz/plugins/transformers/links.ts

@@ -1,5 +1,5 @@
 import { QuartzTransformerPlugin } from "../types"
-import { relative, relativeToRoot, slugify } from "../../path"
+import { relative, relativeToRoot, slugify, trimPathSuffix } from "../../path"
 import path from "path"
 import { visit } from 'unist-util-visit'
 import isAbsoluteUrl from "is-absolute-url"
@@ -9,14 +9,18 @@ interface Options {
   markdownLinkResolution: 'absolute' | 'relative'
   /** Strips folders from a link so that it looks nice */
   prettyLinks: boolean
+  indexAnchorLinks: boolean
+  indexExternalLinks: boolean
 }
 
 const defaultOptions: Options = {
   markdownLinkResolution: 'absolute',
-  prettyLinks: true
+  prettyLinks: true,
+  indexAnchorLinks: false,
+  indexExternalLinks: false,
 }
 
-export const ResolveLinks: QuartzTransformerPlugin<Partial<Options> | undefined> = (userOpts) => {
+export const CrawlLinks: QuartzTransformerPlugin<Partial<Options> | undefined> = (userOpts) => {
   const opts = { ...defaultOptions, ...userOpts }
   return {
     name: "LinkProcessing",
@@ -36,6 +40,7 @@ export const ResolveLinks: QuartzTransformerPlugin<Partial<Options> | undefined>
             }
           }
 
+          const outgoing: Set<string> = new Set()
           visit(tree, 'element', (node, _index, _parent) => {
             // rewrite all links
             if (
@@ -43,13 +48,27 @@ export const ResolveLinks: QuartzTransformerPlugin<Partial<Options> | undefined>
               node.properties &&
               typeof node.properties.href === 'string'
             ) {
-              node.properties.className = isAbsoluteUrl(node.properties.href) ? "external" : "internal"
+              let dest = node.properties.href
+              node.properties.className = isAbsoluteUrl(dest) ? "external" : "internal"
+
 
               // don't process external links or intra-document anchors
-              if (!(isAbsoluteUrl(node.properties.href) || node.properties.href.startsWith("#"))) {
+              if (!(isAbsoluteUrl(dest) || dest.startsWith("#"))) {
-                node.properties.href = transformLink(node.properties.href)
+                node.properties.href = transformLink(dest)
+              }
+              
+              dest = node.properties.href
+              if (dest.startsWith(".")) {
+                const normalizedPath = path.normalize(path.join(curSlug, dest))
+                outgoing.add(trimPathSuffix(normalizedPath))
+              } else if (dest.startsWith("#")) {
+                if (opts.indexAnchorLinks) {
+                  outgoing.add(dest)
+                }
               } else {
-
+                if (opts.indexExternalLinks) {
+                  outgoing.add(dest)
+                }
               }
 
               // rewrite link internals if prettylinks is on
@@ -70,8 +89,16 @@ export const ResolveLinks: QuartzTransformerPlugin<Partial<Options> | undefined>
               }
             }
           })
+
+          file.data.links = [...outgoing]
         }
       }]
     }
   }
 }
+
+declare module 'vfile' {
+  interface DataMap {
+    links: string[]
+  }
+}

quartz/styles/base.scss

@@ -193,6 +193,7 @@ pre {
 
 code {
   font-size: 0.9em;
+  color: var(--dark);
   font-family: var(--codeFont);
   border-radius: 5px;
   padding: 0.1rem 0.2rem;

tsconfig.json

@@ -1,7 +1,9 @@
 {
   "compilerOptions": {
     "lib": [
-      "esnext"
+      "esnext",
+      "DOM",
+      "DOM.Iterable"
     ],
     "module": "esnext",
     "target": "esnext",