feat: support non-singleton explorer

This commit is contained in:
Jacky Zhao
2025-03-10 15:13:04 -07:00
parent dd940a007c
commit a8001e9554
15 changed files with 168 additions and 146 deletions

View File

@ -6,7 +6,8 @@ import script from "./scripts/explorer.inline"
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 type FolderState = {
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 @@ export default ((userOpts?: Partial<Options>) => {
>
<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 @@ export default ((userOpts?: Partial<Options>) => {
</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 @@ export default ((userOpts?: Partial<Options>) => {
<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 @@ export default ((userOpts?: Partial<Options>) => {
}
Explorer.css = style
Explorer.afterDOMLoaded = script + OverflowList.afterDOMLoaded("explorer-ul")
Explorer.afterDOMLoaded = concatenateResources(script, overflowListAfterDOMLoaded)
return Explorer
}) satisfies QuartzComponentConstructor