refactor(doc-data): Use static imports for doc entries

src/components/doc-data.ts

@@ -27,52 +27,59 @@ function getBody(raw: string): string {
   return match ? match[1] : raw;
 }
 
-/** Glob import all .md files in src/doc-entries/ */
+function parseEntry(raw: string): DocEntry | null {
-const modules = import.meta.webpackContext("./", {
-  recursive: false,
-  regExp: /\.md$/,
-});
-
-/** Lazy-loaded doc entries, parsed on first access. */
-let _entries: DocEntry[] | null = null;
-
-export function loadDocEntries(): DocEntry[] {
-  if (_entries) return _entries;
-
-  const entries: DocEntry[] = [];
-
-  for (const key of modules.keys()) {
-    const mod = modules(key);
-    const raw =
-      typeof mod === "string"
-        ? mod
-        : ((mod as { default?: string }).default ?? "");
-    if (!raw) continue;
-
   const fm = parseFrontmatter(raw);
-    if (!fm) continue;
+  if (!fm) return null;
-
+  return {
-    const body = getBody(raw);
-
-    entries.push({
     tag: fm.tag as string,
     icon: fm.icon as string,
     title: fm.title as string,
     description: fm.description as string,
     syntax: fm.syntax as string,
     props: (fm.props as DocEntry["props"]) ?? [],
-      body,
+    body: getBody(raw),
-    });
+  };
 }
 
-  // Sort alphabetically by tag
+// Static imports – each .md file is asset/source so imports are strings.
-  entries.sort((a, b) => a.tag.localeCompare(b.tag));
+// Add a new import here when creating a new doc entry.
-  _entries = entries;
+import mdDiceRaw from "../doc-entries/md-dice.md";
-  return entries;
+import mdTableRaw from "../doc-entries/md-table.md";
+import mdLinkRaw from "../doc-entries/md-link.md";
+import mdPinsRaw from "../doc-entries/md-pins.md";
+import mdFontRaw from "../doc-entries/md-font.md";
+import mdBgRaw from "../doc-entries/md-bg.md";
+import mdBorderRaw from "../doc-entries/md-border.md";
+import mdEmbedRaw from "../doc-entries/md-embed.md";
+import mdDeckRaw from "../doc-entries/md-deck.md";
+import mdYarnRaw from "../doc-entries/md-yarn-spinner.md";
+import mdTokenRaw from "../doc-entries/md-token.md";
+import mdTokenViewerRaw from "../doc-entries/md-token-viewer.md";
+import mdCommanderRaw from "../doc-entries/md-commander.md";
+
+const rawDocuments: string[] = [
+  mdDiceRaw,
+  mdTableRaw,
+  mdLinkRaw,
+  mdPinsRaw,
+  mdFontRaw,
+  mdBgRaw,
+  mdBorderRaw,
+  mdEmbedRaw,
+  mdDeckRaw,
+  mdYarnRaw,
+  mdTokenRaw,
+  mdTokenViewerRaw,
+  mdCommanderRaw,
+];
+
+let _entries: DocEntry[] | null = null;
+
+function loadDocEntries(): DocEntry[] {
+  if (_entries) return _entries;
+  _entries = rawDocuments.map(parseEntry).filter(Boolean) as DocEntry[];
+  _entries.sort((a, b) => a.tag.localeCompare(b.tag));
+  return _entries;
 }
 
-/**
- * Direct static array for the DocDialog sidebar — uses webpackContext
- * so all .md files in doc-entries/ are bundled automatically.
- */
 export const docEntries = loadDocEntries();

src/global.d.ts

@@ -11,6 +11,11 @@ interface ImportMeta {
     options: {
       recursive?: boolean;
       regExp?: RegExp;
-    }
+    },
   ): WebpackContext;
 }
+
+declare module "*.md" {
+  const content: string;
+  export default content;
+}