@tayacrystals/lore 0.1.0

package/utils/rehype-file-tree.ts

@@ -0,0 +1,229 @@
+import type { Element, ElementContent, Text } from "hast";
+import { h } from "hastscript";
+
+/** SVG icon for a file */
+function fileIcon(): Element {
+  return h(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "16",
+      height: "16",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      class: "ft-icon",
+    },
+    [
+      h("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }),
+      h("path", { d: "M14 2v4a2 2 0 0 0 2 2h4" }),
+    ],
+  );
+}
+
+/** SVG icon for a folder */
+function folderIcon(): Element {
+  return h(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "16",
+      height: "16",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      class: "ft-icon",
+    },
+    [
+      h("path", {
+        d: "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z",
+      }),
+    ],
+  );
+}
+
+/** Check if a node is an element with a given tag */
+function isElement(node: ElementContent, tag: string): node is Element {
+  return node.type === "element" && node.tagName === tag;
+}
+
+/** Check if text looks like a placeholder (... or ellipsis) */
+function isPlaceholder(text: string): boolean {
+  const trimmed = text.trim();
+  return trimmed === "..." || trimmed === "\u2026";
+}
+
+/** Get text content of a node (shallow) */
+function getTextContent(node: ElementContent): string {
+  if (node.type === "text") return node.value;
+  if (node.type === "element") {
+    return node.children.map((c: ElementContent) => getTextContent(c)).join("");
+  }
+  return "";
+}
+
+/** Check if a name ends with / (directory marker) */
+function isDirectoryName(name: string): boolean {
+  return name.endsWith("/");
+}
+
+/**
+ * Process a single <li> into a file tree entry.
+ * Returns the transformed element.
+ */
+function processListItem(li: Element): Element {
+  const children = li.children.filter(
+    (c: ElementContent) => !(c.type === "text" && (c as Text).value.trim() === ""),
+  );
+
+  // Separate nested <ul> from inline content
+  const inlineContent: ElementContent[] = [];
+  let nestedList: Element | null = null;
+
+  for (const child of children) {
+    if (isElement(child, "ul")) {
+      nestedList = child;
+    } else {
+      inlineContent.push(child);
+    }
+  }
+
+  // Extract the file/folder name and detect features
+  let isHighlighted = false;
+  let isDirectory = nestedList !== null;
+  const nameNodes: ElementContent[] = [];
+  const commentNodes: ElementContent[] = [];
+  let foundName = false;
+
+  for (const node of inlineContent) {
+    if (!foundName) {
+      if (isElement(node, "strong")) {
+        // Highlighted entry
+        isHighlighted = true;
+        nameNodes.push(...node.children);
+        foundName = true;
+      } else if (isElement(node, "a")) {
+        nameNodes.push(node);
+        foundName = true;
+      } else if (node.type === "text") {
+        const text = node.value;
+        // The name is the first word/path segment
+        if (!text.trim()) continue;
+        nameNodes.push(node);
+        foundName = true;
+      } else if (isElement(node, "code")) {
+        nameNodes.push(node);
+        foundName = true;
+      } else {
+        nameNodes.push(node);
+        foundName = true;
+      }
+    } else {
+      commentNodes.push(node);
+    }
+  }
+
+  // Check if the name text implies a directory
+  const nameText = nameNodes.map((n) => getTextContent(n)).join("").trim();
+  if (isDirectoryName(nameText)) {
+    isDirectory = true;
+  }
+
+  // Check for placeholder
+  if (isPlaceholder(nameText)) {
+    return h("li", { class: "ft-entry ft-placeholder" }, [
+      h("span", { class: "ft-entry-inner" }, [
+        h("span", { class: "ft-name ft-placeholder-text" }, [
+          { type: "text", value: "\u2026" } as Text,
+        ]),
+      ]),
+    ]);
+  }
+
+  // Clean trailing slash from directory names for display
+  const displayNameNodes: ElementContent[] = nameNodes.map((n) => {
+    if (n.type === "text" && n.value.endsWith("/")) {
+      return { ...n, value: n.value.slice(0, -1) } as Text;
+    }
+    return n;
+  });
+
+  // Build the icon
+  const icon = isDirectory ? folderIcon() : fileIcon();
+
+  // Build name span
+  const nameSpan = h(
+    "span",
+    { class: isHighlighted ? "ft-name ft-highlight" : "ft-name" },
+    displayNameNodes,
+  );
+
+  // Build comment span if present
+  const commentSpan =
+    commentNodes.length > 0
+      ? h("span", { class: "ft-comment" }, commentNodes)
+      : null;
+
+  const entryInner: ElementContent[] = [icon, nameSpan];
+  if (commentSpan) entryInner.push(commentSpan);
+
+  if (isDirectory && nestedList) {
+    // Process nested list recursively
+    const processedList = processFileList(nestedList);
+
+    // Directory with children: collapsible
+    const summary = h("summary", { class: "ft-entry-inner ft-dir-summary" }, entryInner);
+    const details = h("details", { open: true }, [summary, processedList]);
+
+    return h("li", { class: "ft-entry ft-directory" }, [details]);
+  } else if (isDirectory) {
+    // Empty directory (name ended with / but no children)
+    return h("li", { class: "ft-entry ft-directory" }, [
+      h("span", { class: "ft-entry-inner" }, entryInner),
+    ]);
+  } else {
+    // Regular file
+    return h("li", { class: "ft-entry ft-file" }, [
+      h("span", { class: "ft-entry-inner" }, entryInner),
+    ]);
+  }
+}
+
+/** Process a <ul> element, transforming all its <li> children */
+function processFileList(ul: Element): Element {
+  const processed = ul.children
+    .filter((child: ElementContent): child is Element => isElement(child, "li"))
+    .map((li: Element) => processListItem(li));
+
+  return h("ul", { class: "ft-list", role: "tree" }, processed);
+}
+
+/**
+ * Transform raw HTML (from markdown list) into file tree HTML.
+ * Takes the HTML string from the slot and returns transformed HTML.
+ */
+export async function transformFileTree(html: string): Promise<string> {
+  const { rehype } = await import("rehype");
+  const { toHtml } = await import("hast-util-to-html");
+  const { visit } = await import("unist-util-visit");
+
+  const processor = rehype().data("settings", { fragment: true });
+  const tree = processor.parse(html);
+
+  // Find the top-level <ul> and process it
+  visit(tree, "element", (node, index, parent) => {
+    if (node.tagName === "ul" && parent && index !== undefined) {
+      const processed = processFileList(node);
+      (parent.children as ElementContent[])[index] = processed;
+      return "skip";
+    }
+  });
+
+  return toHtml(tree);
+}

package/utils/sidebar.ts

@@ -0,0 +1,97 @@
+import type { CollectionEntry } from "astro:content";
+import type { SidebarGroupConfig } from "../config";
+
+const BASE_URL = import.meta.env.BASE_URL || "/";
+
+export interface SidebarItem {
+  type: "link";
+  label: string;
+  href: string;
+  order: number;
+  icon?: string;
+}
+
+export interface SidebarGroup {
+  type: "group";
+  label: string;
+  order: number;
+  slug: string;
+  items: SidebarEntry[];
+}
+
+export type SidebarEntry = SidebarItem | SidebarGroup;
+
+function titleCase(str: string): string {
+  return str
+    .replace(/[-_]/g, " ")
+    .replace(/\b\w/g, (c) => c.toUpperCase());
+}
+
+export function buildSidebar(
+  entries: CollectionEntry<"docs">[],
+  sidebarConfig: Record<string, SidebarGroupConfig>,
+): SidebarEntry[] {
+  const published = entries.filter((e) => !e.data.draft);
+  return buildLevel(published, sidebarConfig, "", 0);
+}
+
+function buildLevel(
+  entries: CollectionEntry<"docs">[],
+  configAtLevel: Record<string, SidebarGroupConfig>,
+  prefix: string,
+  depth: number,
+): SidebarEntry[] {
+  const groups = new Map<string, CollectionEntry<"docs">[]>();
+  const topLevel: SidebarItem[] = [];
+
+  for (const entry of entries) {
+    const relativePath = prefix ? entry.id.slice(prefix.length + 1) : entry.id;
+    const parts = relativePath.split("/");
+
+    if (parts.length > 1) {
+      const groupSlug = parts[0];
+      if (!groups.has(groupSlug)) {
+        groups.set(groupSlug, []);
+      }
+      groups.get(groupSlug)!.push(entry);
+    } else {
+      const href = entry.id === "index" ? `${BASE_URL}docs` : `${BASE_URL}docs/${entry.id}`;
+      topLevel.push({
+        type: "link",
+        label: entry.data.title,
+        href,
+        order: entry.data.order,
+        icon: entry.data.icon,
+      });
+    }
+  }
+
+  const result: SidebarEntry[] = [];
+
+  // Add top-level items (excluding index at root level only)
+  for (const item of topLevel) {
+    if (depth === 0 && item.href === "/docs") continue;
+    result.push(item);
+  }
+
+  // Add groups (recursively)
+  for (const [slug, groupEntries] of groups) {
+    const fullSlug = prefix ? `${prefix}/${slug}` : slug;
+    const config = configAtLevel[slug];
+    const childConfig = config?.children ?? {};
+
+    const items = buildLevel(groupEntries, childConfig, fullSlug, depth + 1);
+    items.sort((a, b) => a.order - b.order);
+
+    result.push({
+      type: "group",
+      label: config?.label ?? titleCase(slug),
+      order: config?.order ?? 999,
+      slug: fullSlug,
+      items,
+    });
+  }
+
+  result.sort((a, b) => a.order - b.order);
+  return result;
+}

package/utils/toc.ts

@@ -0,0 +1,28 @@
+export interface TocItem {
+  depth: number;
+  slug: string;
+  text: string;
+  children: TocItem[];
+}
+
+export interface MarkdownHeading {
+  depth: number;
+  slug: string;
+  text: string;
+}
+
+export function buildToc(headings: MarkdownHeading[]): TocItem[] {
+  const filtered = headings.filter((h) => h.depth >= 2 && h.depth <= 3);
+  const result: TocItem[] = [];
+
+  for (const heading of filtered) {
+    const item: TocItem = { ...heading, children: [] };
+    if (heading.depth === 2) {
+      result.push(item);
+    } else if (result.length > 0) {
+      result[result.length - 1].children.push(item);
+    }
+  }
+
+  return result;
+}

package/virtual.d.ts

@@ -0,0 +1,9 @@
+declare module "virtual:lore/config" {
+  import type { LoreConfig } from "lore/config";
+  const config: LoreConfig;
+  export default config;
+}
+
+declare module "virtual:lore/user-css" {
+  // Side-effect imports only
+}

package/vite-plugin.ts

@@ -0,0 +1,28 @@
+import type { Plugin } from "vite";
+import type { LoreConfig } from "./config";
+
+const VIRTUAL_CONFIG = "virtual:lore/config";
+const VIRTUAL_USER_CSS = "virtual:lore/user-css";
+const RESOLVED_CONFIG = "\0" + VIRTUAL_CONFIG;
+const RESOLVED_USER_CSS = "\0" + VIRTUAL_USER_CSS;
+
+export function vitePluginLore(config: LoreConfig): Plugin {
+  return {
+    name: "lore:virtual-modules",
+    resolveId(id: string) {
+      if (id === VIRTUAL_CONFIG) return RESOLVED_CONFIG;
+      if (id === VIRTUAL_USER_CSS) return RESOLVED_USER_CSS;
+    },
+    load(id: string) {
+      if (id === RESOLVED_CONFIG) {
+        return `export default ${JSON.stringify(config)};`;
+      }
+      if (id === RESOLVED_USER_CSS) {
+        const imports = config.customCss
+          .map((css) => `import "${css}";`)
+          .join("\n");
+        return imports || "// No custom CSS";
+      }
+    },
+  };
+}