quartz-community/explorer
1
0
Fork 0
mirror of https://github.com/quartz-community/explorer.git synced 2026-07-22 02:50:24 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions
No description
51 commits 1 branch 0 tags 279 KiB
TypeScript 86.7%
SCSS 13.3%
Find a file
saberzero1 87cc7d6d9e
chore: commit dist/ and remove prepare script 
Pre-built output is now committed to the repository so that
Quartz can skip the build step during plugin installation.
The prepare script is removed to prevent redundant builds
when installing from npm/git.
2026-03-14 21:58:29 +01:00
.github/workflows Initial commit 2026-02-07 02:03:54 +01:00
dist chore: commit dist/ and remove prepare script 2026-03-14 21:58:29 +01:00
src feat: add render event listener for in-place DOM re-initialization 2026-03-12 19:45:42 +01:00
test fix: resolve ESLint and formatting issues for CI compliance 2026-03-09 03:47:39 +01:00
.eslintrc.json fix: explorer not loading 2026-02-09 20:24:35 +01:00
.gitignore chore: commit dist/ and remove prepare script 2026-03-14 21:58:29 +01:00
.prettierrc Initial commit 2026-02-07 02:03:54 +01:00
CHANGELOG.md Initial commit 2026-02-07 02:03:54 +01:00
LICENSE Initial commit 2026-02-07 02:03:54 +01:00
package-lock.json chore: commit dist/ and remove prepare script 2026-03-14 21:58:29 +01:00
package.json chore: commit dist/ and remove prepare script 2026-03-14 21:58:29 +01:00
README.md docs: update README for v5 unified config system 2026-02-25 16:07:11 +01:00
tsconfig.json Migrate types to use @quartz-community/types exports 2026-02-13 13:18:24 +01:00
tsup.config.ts fix: compile SCSS via sass instead of raw text to prevent lightningcss errors 2026-02-26 16:44:50 +01:00
vitest.config.ts fix: explorer not loading 2026-02-09 20:24:35 +01:00

README.md

@quartz-community/explorer

The Explorer component for Quartz - navigate your digital garden with an interactive file tree.

Features

  • 📁 Interactive folder tree with collapse/expand functionality
  • 📱 Mobile-friendly slide-out navigation
  • 💾 Persistent state (remembers open/closed folders)
  • 🔗 Configurable folder click behavior (link or collapse)
  • ⚡ Built-in search and overflow handling

Installation

npx quartz plugin add github:quartz-community/explorer

Usage

plugins:
  - source: github:quartz-community/explorer
    enabled: true
    layout:
      position: left
      priority: 50

For advanced use cases, you can override in TypeScript:

import * as ExternalPlugin from "./.quartz/plugins";

ExternalPlugin.Explorer({
  title: "Explorer",
  folderDefaultState: "collapsed",
  folderClickBehavior: "link",
  useSavedState: true,
});

Configuration Options

interface ExplorerOptions {
  /** Title displayed above the explorer */
  title?: string;

  /** Default state for folders: "collapsed" or "open" */
  folderDefaultState: "collapsed" | "open";

  /** Behavior when clicking folders: "collapse" to toggle, "link" to navigate */
  folderClickBehavior: "collapse" | "link";

  /** Whether to persist folder state in localStorage */
  useSavedState: boolean;

  /** Custom sort function for entries */
  sortFn?: (a: FileTrieNode, b: FileTrieNode) => number;

  /** Custom filter function for entries */
  filterFn?: (node: FileTrieNode) => boolean;

  /** Custom map function for transforming entries */
  mapFn?: (node: FileTrieNode) => void;

  /** Order in which to apply filter, map, and sort */
  order?: Array<"filter" | "map" | "sort">;
}

Default Behavior

By default, the Explorer:

  • Shows folders in a collapsed state
  • Opens folders when clicked (navigates to index page)
  • Saves folder states between sessions
  • Excludes the "tags" folder from the tree
  • Sorts folders first, then files alphabetically

Development

This is a first-party Quartz community plugin. It serves as both:

  1. A production-ready Explorer component
  2. A reference implementation for building Quartz community plugins

Documentation

See the Quartz documentation for more information.

License

MIT