From a8001e9554a319782d8557acb8f19358996b5828 Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Mon, 10 Mar 2025 22:13:22 +0000
Subject: [PATCH] feat: support non-singleton explorer

---
 quartz/components/Explorer.tsx |   16 ++++++++--------
 1 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/quartz/components/Explorer.tsx b/quartz/components/Explorer.tsx
index 9c6319a..56784f1 100644
--- a/quartz/components/Explorer.tsx
+++ b/quartz/components/Explorer.tsx
@@ -6,7 +6,8 @@
 import { classNames } from "../util/lang"
 import { i18n } from "../i18n"
 import { FileTrieNode } from "../util/fileTrie"
-import OverflowList from "./OverflowList"
+import OverflowListFactory from "./OverflowList"
+import { concatenateResources } from "../util/resources"
 
 type OrderEntries = "sort" | "filter" | "map"
 
@@ -56,6 +57,7 @@
 
 export default ((userOpts?: Partial<Options>) => {
   const opts: Options = { ...defaultOptions, ...userOpts }
+  const { OverflowList, overflowListAfterDOMLoaded } = OverflowListFactory()
 
   const Explorer: QuartzComponent = ({ cfg, displayClass }: QuartzComponentProps) => {
     return (
@@ -73,8 +75,7 @@
       >
         <button
           type="button"
-          id="mobile-explorer"
-          class="explorer-toggle hide-until-loaded"
+          class="explorer-toggle mobile-explorer hide-until-loaded"
           data-mobile={true}
           aria-controls="explorer-content"
         >
@@ -95,8 +96,7 @@
         </button>
         <button
           type="button"
-          id="desktop-explorer"
-          class="title-button explorer-toggle"
+          class="title-button explorer-toggle desktop-explorer"
           data-mobile={false}
           aria-expanded={true}
         >
@@ -116,8 +116,8 @@
             <polyline points="6 9 12 15 18 9"></polyline>
           </svg>
         </button>
-        <div id="explorer-content" aria-expanded={false}>
-          <OverflowList id="explorer-ul" />
+        <div class="explorer-content" aria-expanded={false}>
+          <OverflowList class="explorer-ul" />
         </div>
         <template id="template-file">
           <li>
@@ -157,6 +157,6 @@
   }
 
   Explorer.css = style
-  Explorer.afterDOMLoaded = script + OverflowList.afterDOMLoaded("explorer-ul")
+  Explorer.afterDOMLoaded = concatenateResources(script, overflowListAfterDOMLoaded)
   return Explorer
 }) satisfies QuartzComponentConstructor

--
Gitblit v1.10.0