This commit is contained in:
Aniket Dhakane 2026-01-29 05:38:37 +01:00 committed by GitHub
commit 47b2df132b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -20,6 +20,10 @@ export interface Options {
filterFn: (node: FileTrieNode) => boolean
mapFn: (node: FileTrieNode) => void
order: OrderEntries[]
components?: {
Component: QuartzComponent
position: "before" | "after"
}[]
}
const defaultOptions: Options = {
@ -48,6 +52,7 @@ const defaultOptions: Options = {
},
filterFn: (node) => node.slugSegment !== "tags",
order: ["filter", "map", "sort"],
components: [],
}
export type FolderState = {
@ -60,9 +65,12 @@ export default ((userOpts?: Partial<Options>) => {
const opts: Options = { ...defaultOptions, ...userOpts }
const { OverflowList, overflowListAfterDOMLoaded } = OverflowListFactory()
const Explorer: QuartzComponent = ({ cfg, displayClass }: QuartzComponentProps) => {
const Explorer: QuartzComponent = ({ cfg, displayClass, ...props }: QuartzComponentProps) => {
const id = `explorer-${numExplorers++}`
const beforeComponents = (opts.components || []).filter((c) => c.position === "before")
const afterComponents = (opts.components || []).filter((c) => c.position === "after")
return (
<div
class={classNames(displayClass, "explorer")}
@ -120,7 +128,27 @@ export default ((userOpts?: Partial<Options>) => {
</svg>
</button>
<div id={id} class="explorer-content" aria-expanded={false} role="group">
{beforeComponents.map((comp, idx) => {
const componentName = comp.Component.displayName || `component-${idx}`
const key = `before-${componentName}-${idx}`
return (
<div key={key}>
<comp.Component {...props} cfg={cfg} />
</div>
)
})}
<OverflowList class="explorer-ul" />
{afterComponents.map((comp, idx) => {
const componentName = comp.Component.displayName || `component-${idx}`
const key = `before-${componentName}-${idx}`
return (
<div key={key}>
<comp.Component {...props} cfg={cfg} />
</div>
)
})}
</div>
<template id="template-file">
<li>
@ -159,7 +187,17 @@ export default ((userOpts?: Partial<Options>) => {
)
}
Explorer.css = style
Explorer.afterDOMLoaded = concatenateResources(script, overflowListAfterDOMLoaded)
const additionalCSS = opts.components?.map((c) => c.Component.css) || []
const additionalAfterDOM = opts.components?.map((c) => c.Component.afterDOMLoaded) || []
const additionalBeforeDOM = opts.components?.map((c) => c.Component.beforeDOMLoaded) || []
Explorer.css = concatenateResources(style, ...additionalCSS)
Explorer.afterDOMLoaded = concatenateResources(
script,
overflowListAfterDOMLoaded,
...additionalAfterDOM,
)
Explorer.beforeDOMLoaded = concatenateResources(...additionalBeforeDOM)
return Explorer
}) satisfies QuartzComponentConstructor