update

Author: ken-okabe

_site/0-book/unit-5/section-3/1-map.md

@@ -35,16 +35,15 @@ When you call `map`, a **Dependency** is registered internally between the two `
 
 The dependency created by `map` is **Static**. Once you define the relationship `labels = numbers.map(...)`, the rule itself—the transformation of the value—does not change later.
 
-```mermaid
-flowchart LR
-  Start --> Stop
+```d2
+Documentation -> Website: Starlight
 ```
 
 ```txt
         +-----------------+      .map(x => `Score: ${x}`)     +-----------------+
         | numbers         | --------------------------------> | labels          |
-        | (Timeline<number>) |                                  | (Timeline<string>) |
-        +-----------------+                                 +-----------------+
+        | (Timeline<number>) |                                | (Timeline<string>) |
+        +-----------------+                                   +-----------------+
               ^                                                     |
               | .define(Now, 100)                                   V
               +-------------                                 Value propagates to "Score: 100"

astro.config.mjs

@@ -12,6 +12,8 @@ import rehypeMathjax from 'rehype-mathjax';
 
 import mermaid from 'astro-mermaid';
 
+import d2 from 'astro-d2';
+
 export default defineConfig({
   // GitHub Pages configuration
   site: 'https://ken-okabe.github.io',
@@ -21,26 +23,23 @@ export default defineConfig({
   routing: {
     prefixDefaultLocale: true,
   },
-  integrations: [
-    mermaid(), // ⚠️ Must come BEFORE starlight
-    starlight({
-      title: 'Experience Quality Coding for AI',
-      defaultLocale: 'en',
-      locales: {
-        en: { label: 'English', lang: 'en' },
-        ja: { label: '日本語', lang: 'ja' }, // Label for language picker can be in Japanese
-      },
-      plugins: [
-        // Call the imported plugin as a function
-        starlightSidebarTopics(
-          generatedTopics,
-          {
-            // Plugin options here, if any
-          }
-        ),
-      ],
-    }),
-  ],
+  integrations: [ starlight({
+    title: 'Experience Quality Coding for AI',
+    defaultLocale: 'en',
+    locales: {
+      en: { label: 'English', lang: 'en' },
+      ja: { label: '日本語', lang: 'ja' }, // Label for language picker can be in Japanese
+    },
+    plugins: [
+      // Call the imported plugin as a function
+      starlightSidebarTopics(
+        generatedTopics,
+        {
+          // Plugin options here, if any
+        }
+      ),
+    ],
+  }), d2()],
   // Global Markdown configuration for Astro
   markdown: {
     remarkPlugins: [remarkMath],
@@ -62,4 +61,4 @@ export default defineConfig({
     //   wrap: true,
     // },
   },
-});
+});

package-lock.json

@@ -13,7 +13,7 @@
   "dependencies": {
     "@astrojs/starlight": "^0.34.3",
     "astro": "^5.6.1",
-    "astro-mermaid": "^1.0.4",
+    "astro-d2": "^0.8.0",
     "fs-extra": "^11.3.0",
     "gray-matter": "^4.0.3",
     "mdast-util-to-string": "^4.0.0",

package.json

@@ -38,16 +38,15 @@ When you call `map`, a **Dependency** is registered internally between the two `
 
 The dependency created by `map` is **Static**. Once you define the relationship `labels = numbers.map(...)`, the rule itself—the transformation of the value—does not change later.
 
-```mermaid
-flowchart LR
-  Start --> Stop
+```d2
+Documentation -> Website: Starlight
 ```
 
 ```txt
         +-----------------+      .map(x => `Score: ${x}`)     +-----------------+
         | numbers         | --------------------------------> | labels          |
-        | (Timeline<number>) |                                  | (Timeline<string>) |
-        +-----------------+                                 +-----------------+
+        | (Timeline<number>) |                                | (Timeline<string>) |
+        +-----------------+                                   +-----------------+
               ^                                                     |
               | .define(Now, 100)                                   V
               +-------------                                 Value propagates to "Score: 100"