Sidebars yippee

docs/.gitignore

@@ -2,6 +2,8 @@
 dist/
 # generated types
 .astro/
+# generated schema pages
+src/content/docs/schemas/
 
 # dependencies
 node_modules/

docs/astro.config.mjs

@@ -4,9 +4,16 @@ import starlight from "@astrojs/starlight";
 import { generateSchema } from "./src/schema_generator";
 
 generateSchema("body_schema.json");
+generateSchema("star_system_schema.json");
+generateSchema("translation_schema.json");
+generateSchema("addon_manifest_schema.json");
+generateSchema("dialogue_schema.xsd");
+generateSchema("text_schema.xsd");
+generateSchema("shiplog_schema.xsd");
 
 // https://astro.build/config
 export default defineConfig({
+    site: "https://nh.outerwildsmods.com",
     compressHTML: true,
     integrations: [
         starlight({
@@ -14,6 +21,9 @@ export default defineConfig({
             description:
                 "Documentation on how to use the New Horizons planet creation tool for Outer Wilds.",
             defaultLocale: "en-us",
+            components: {
+                PageSidebar: "/src/components/ConditionalPageSidebar.astro"
+            },
             customCss: ["/src/styles/custom.css"],
             logo: {
                 src: "/src/assets/icon.webp",

docs/src/components/ConditionalPageSidebar.astro

@@ -0,0 +1,50 @@
+---
+import type { Props } from "@astrojs/starlight/props";
+import Default from "@astrojs/starlight/components/PageSidebar.astro";
+import { SchemaTools } from "../schema_utils";
+import type { MarkdownHeading } from "astro";
+
+const isSchema = Astro.props.slug.startsWith("schemas/");
+
+type TocItem = Exclude<ReturnType<Exclude<Props["toc"], undefined>["items"]["find"]>, undefined>;
+
+const injectChild = (items: TocItem[], item: TocItem): void => {
+    const lastItem = items.at(-1);
+    if (!lastItem || lastItem.depth >= item.depth) {
+        items.push(item);
+    } else {
+        return injectChild(lastItem.children, item);
+    }
+}
+
+function generateToC(
+    headings: MarkdownHeading[],
+    title: string
+) {
+    const toc: Array<TocItem> = [{ depth: 2, slug: "_top", text: title, children: [] }];
+    for (const heading of headings) injectChild(toc, { ...heading, children: [] });
+    return toc;
+}
+
+let props = Astro.props;
+
+if (isSchema) {
+    console.log("Is Schema!");
+    const schemaFileName = props.entry.data.head[0]?.attrs?.fileName as string | undefined;
+    if (schemaFileName) {
+        const schema = SchemaTools.readSchema(schemaFileName);
+        const headings = SchemaTools.getHeaders(schema);
+        props.headings = headings;
+        props.toc!.items = generateToC(headings, props.entry.data.title);
+    }
+    console.log(props.toc);
+}
+---
+
+{
+    (
+        <Default {...props}>
+            <slot />
+        </Default>
+    )
+}

docs/src/content/docs/schemas/body-schema/index.mdx

@@ -2,6 +2,10 @@
 title: Celestial Body Schema
 description: Describes a celestial body to generate
 editUrl: false
+head: 
+  - tag: meta
+    attrs:
+      fileName: body_schema.json
 ---
 
 import Schema from "/src/components/Schemas/Schema.astro";

docs/src/schema_generator.ts

@@ -1,7 +1,10 @@
-import { Schema, SchemaTools } from "./schema_utils";
+import { SchemaTools } from "./schema_utils";
 import * as fs from "node:fs";
 
-const addFrontmatter = (content: string, frontmatter: Record<string, boolean | string>) => {
+const addFrontmatter = (
+    content: string,
+    frontmatter: Record<string, boolean | string | object>
+) => {
     const entries = Object.entries(frontmatter).map(([key, value]) => `${key}: ${value}`);
 
     if (entries.length === 0) {
@@ -23,7 +26,8 @@ export const generateSchema = (fileName: string) => {
     const frontMatter = {
         title: SchemaTools.getTitle(schema) as string,
         description: SchemaTools.getDescription(schema) as string,
-        editUrl: false
+        editUrl: false,
+        head: `\n  - tag: meta\n    attrs:\n      fileName: ${schema.fileName}`
     };
 
     const content = `import Schema from "/src/components/Schemas/Schema.astro";\n\n<Schema fileName="${schema.fileName}" />\n`;

docs/src/styles/custom.css

@@ -1,3 +1,29 @@
+/* Dark mode colors. */
 :root {
-    --sl-hue-accent: 133;
+    --sl-color-accent-low: #002d0f;
+    --sl-color-accent: #007f39;
+    --sl-color-accent-high: #9fd9aa;
+    --sl-color-white: #ffffff;
+    --sl-color-gray-1: #eeeeee;
+    --sl-color-gray-2: #c2c2c2;
+    --sl-color-gray-3: #8b8b8b;
+    --sl-color-gray-4: #585858;
+    --sl-color-gray-5: #383838;
+    --sl-color-gray-6: #272727;
+    --sl-color-black: #181818;
+}
+/* Light mode colors. */
+:root[data-theme="light"] {
+    --sl-color-accent-low: #b8e4c0;
+    --sl-color-accent: #00823a;
+    --sl-color-accent-high: #003e18;
+    --sl-color-white: #181818;
+    --sl-color-gray-1: #272727;
+    --sl-color-gray-2: #383838;
+    --sl-color-gray-3: #585858;
+    --sl-color-gray-4: #8b8b8b;
+    --sl-color-gray-5: #c2c2c2;
+    --sl-color-gray-6: #eeeeee;
+    --sl-color-gray-7: #f6f6f6;
+    --sl-color-black: #ffffff;
 }