shelving/ui/tree/TreeCards.js

Toolkit for using data in JavaScript.

import { jsx as _jsx } from "react/jsx-runtime";
import { walkElements } from "../../util/element.js";
import { DirectoryCard } from "../docs/DirectoryCard.js";
import { DocumentationCard } from "../docs/DocumentationCard.js";
import { FileCard } from "../docs/FileCard.js";
import { createMapper } from "../misc/Mapper.js";
/** Mapping + Mapper pair for tree cards — wrap children in `<TreeCardMapping>` to override. */
export const [TreeCardMapping, TreeCardMapper] = createMapper({
    "tree-directory": DirectoryCard,
    "tree-file": FileCard,
    "tree-documentation": DocumentationCard,
});
/**
 * Render a list of tree elements as a stack of cards.
 * - Each element is dispatched via `<TreeCardMapper>` to its registered renderer.
 * - `path` is threaded through to each card so it can compute its href as `path + name`.
 * - To override the renderer for a specific element type, wrap in `<TreeCardMapping mapping={…}>`.
 */
export function TreeCards({ path = "/", children }) {
    return _jsx(TreeCardMapper, { path: path, children: walkElements(children) });
}