Revert recent Lume upgrades to fix h1 problem

_components/SidebarNav/comp.tsx → _components/SidebarNav.tsx

@@ -1,5 +1,5 @@
 // deno-lint-ignore-file no-explicit-any
-import ReferenceSidebarNav from "../../reference/_components/ReferenceSidebarNav.tsx";
+import ReferenceSidebarNav from "../reference/_components/ReferenceSidebarNav.tsx";
 
 export default function (data: Lume.Data) {
   const sectionData = data.sectionData;
@@ -129,3 +129,5 @@ function SidebarCategoryHeading(props: {
     </h2>
   );
 }
+
+export const js = `import "/js/sidebar.client.js";`;

_components/ThemeToggle/comp.tsx → _components/ThemeToggle.tsx

@@ -20,3 +20,8 @@ export default function () {
     </button>
   );
 }
+
+export const js = `
+import "/js/darkmode.client.js";
+import "/js/darkmode-toggle.client.js";
+`;

_components/VideoPlayer/comp.tsx → _components/VideoPlayer.tsx

@@ -32,3 +32,7 @@ function urlMatcher(url: string): string | undefined {
   const match = url.match(urlPattern);
   return match?.[3];
 }
+
+export const js = `
+  import "/js/youtube-lite.client.js";
+`;

_config.ts

@@ -2,13 +2,16 @@ import "@std/dotenv/load";
 
 import lume from "lume/mod.ts";
 import esbuild from "lume/plugins/esbuild.ts";
-import jsx from "lume/plugins/jsx.ts";
+import jsx from "lume/plugins/jsx_preact.ts";
 import mdx from "lume/plugins/mdx.ts";
 import ogImages from "lume/plugins/og_images.ts";
+import postcss from "lume/plugins/postcss.ts";
 import redirects from "lume/plugins/redirects.ts";
 import search from "lume/plugins/search.ts";
 import sitemap from "lume/plugins/sitemap.ts";
-import tailwind from "lume/plugins/tailwindcss.ts";
+import postcssNesting from "npm:@tailwindcss/nesting";
+
+import tailwind from "@tailwindcss/postcss";
 
 import Prism from "./prism.ts";
 
@@ -157,25 +160,23 @@ site.use(search());
 site.use(jsx());
 site.use(mdx());
 
-site.add("js");
+site.use(
+  postcss({
+    includes: false,
+    plugins: [postcssNesting, tailwind()],
+  }),
+);
+
 site.use(
   esbuild({
-    extensions: [".ts"],
+    extensions: [".client.ts", ".client.js"],
     options: {
       minify: false,
       splitting: true,
-      alias: {
-        "node:crypto": "./_node-crypto.js",
-      },
     },
   }),
 );
 
-site.add("style.css");
-site.use(tailwind({
-  minify: true,
-}));
-
 site.use(toc({ anchor: false }));
 site.use(title());
 site.use(sitemap());
@@ -209,7 +210,7 @@ site.addEventListener("afterBuild", async () => {
       Deno.writeTextFileSync(site.dest("llms-full.txt"), llmsFullTxt);
       log.info("Generated llms-full.txt in site root");
     } catch (error) {
-      log.error("Error generating LLMs files:" + error);
+      log.error("Error generating LLMs files:", error);
     }
   }
 });
@@ -297,7 +298,7 @@ if (Deno.env.get("BUILD_TYPE") == "FULL") {
   site.data("openGraphLayout", "/open_graph/default.jsx");
   site.use(
     ogImages({
-      options: {
+      satori: {
         width: 1200,
         height: 630,
         fonts: [
@@ -326,11 +327,13 @@ if (Deno.env.get("BUILD_TYPE") == "FULL") {
           },
         ],
       },
+      cache: false,
     }),
   );
 }
 
 site.scopedUpdates(
+  (path) => path == "/overrides.css",
   (path) => /\.(js|ts)$/.test(path),
   (path) => path.startsWith("/api/deno/"),
 );

_includes/doc.tsx

@@ -28,24 +28,22 @@ export default function Doc(data: Lume.Data, helpers: Lume.Helpers) {
   }
 
   function getTocCtx(
-    d: Lume.Data,
+    d: unknown,
   ): { document_navigation: unknown; document_navigation_str: string } | null {
-    const tocCandidate =
-      (d.data as { toc_ctx?: unknown } | undefined)?.toc_ctx ??
-        (d as {
-          children?: { props?: { data?: { toc_ctx?: unknown } } };
-        })?.children?.props?.data?.toc_ctx;
-
+    type Toc = {
+      document_navigation: unknown;
+      document_navigation_str: string;
+    };
+    const tocCtx: unknown = (d as {
+      children?: { props?: { data?: { toc_ctx?: unknown } } };
+    })?.children?.props?.data?.toc_ctx;
     if (
-      tocCandidate &&
-      typeof tocCandidate === "object" &&
-      "document_navigation" in tocCandidate &&
-      "document_navigation_str" in tocCandidate
+      tocCtx &&
+      typeof tocCtx === "object" &&
+      "document_navigation" in tocCtx &&
+      "document_navigation_str" in tocCtx
     ) {
-      return tocCandidate as {
-        document_navigation: unknown;
-        document_navigation_str: string;
-      };
+      return tocCtx as Toc;
     }
     return null;
   }

_includes/layout.tsx

@@ -33,7 +33,7 @@ export default function Layout(data: Lume.Data) {
 
         <link
           rel="stylesheet"
-          href={`/style.css${fingerprint ? `?v=${fingerprint}` : ""}`}
+          href={`/styles.css${fingerprint ? `?v=${fingerprint}` : ""}`}
         />
 
         <link
@@ -61,13 +61,13 @@ export default function Layout(data: Lume.Data) {
           name="keywords"
           content="Deno, JavaScript, TypeScript, reference, documentation, guide, tutorial, example"
         />
-        <script type="module" defer src="/script.js"></script>
-        <script type="module" defer src="/js/main.js"></script>
-        <script type="module" defer src="/js/lint_rules.js"></script>
-        <script type="module" defer src="/js/copy.js"></script>
-        <script type="module" defer src="/js/tabs.js"></script>
-        <script type="module" defer src="/js/feedback.js"></script>
-        <script type="module" defer src="/js/search.js"></script>
+        <script type="module" defer src="/components.js"></script>
+        <script type="module" defer src="/main.client.js"></script>
+        <script type="module" defer src="/lint_rules.client.js"></script>
+        <script type="module" defer src="/copy.client.js"></script>
+        <script type="module" defer src="/tabs.client.js"></script>
+        <script type="module" defer src="/feedback.client.js"></script>
+        <script type="module" defer src="/search.client.js"></script>
         <script
           async
           src="https://www.googletagmanager.com/gtm.js?id=GTM-5B5TH8ZJ"

_includes/lintRule.tsx

@@ -97,7 +97,7 @@ export default function LintRule(props: Lume.Data, _helpers: Lume.Helpers) {
 
   return (
     <>
-      <LintRuleTags tags={tags} ruleName={props.title!} />
+      <LintRuleTags tags={tags} ruleName={props.title} />
       {props.children}
     </>
   );

_includes/open_graph/cli-commands.jsx

@@ -1,3 +1,5 @@
+/** @jsxImportSource npm:[email protected] */
+
 export default function ({ title, description, openGraphTitle }) {
   if (!openGraphTitle) {
     title = "deno help";

_includes/open_graph/default.jsx

@@ -1,3 +1,5 @@
+/** @jsxImportSource npm:[email protected] */
+
 export default function ({ title, description, openGraphColor }) {
   if (!title) {
     title = "Deno documentation";

_includes/open_graph/examples.jsx

@@ -1,3 +1,5 @@
+/** @jsxImportSource npm:[email protected] */
+
 export default function ({ title, description }) {
   if (!title) {
     title = "Deno documentation";

deno.json

@@ -8,32 +8,23 @@
     "@std/media-types": "jsr:@std/media-types@^1.0.3",
     "@std/path": "jsr:@std/path@^1.0.8",
     "@deno/doc": "jsr:@deno/[email protected]",
+    "@tailwindcss/cli": "npm:@tailwindcss/cli@^4.1.11",
+    "@tailwindcss/postcss": "npm:@tailwindcss/postcss@^4.1.11",
     "ga4": "https://raw.githubusercontent.com/denoland/ga4/04a1ce209116f158b5ef1658b957bdb109db68ed/mod.ts",
-    "lume/": "https://cdn.jsdelivr.net/gh/lumeland/[email protected]/",
-    "lume/jsx-runtime": "https://cdn.jsdelivr.net/gh/oscarotero/[email protected]/jsx-runtime.ts",
+    "lume/": "https://deno.land/x/[email protected]/",
     "googleapis": "npm:googleapis@^144.0.0",
+    "postcss": "npm:postcss@^8.5.6",
     "prismjs": "npm:[email protected]",
     "tailwindcss": "npm:tailwindcss@^4.1.11",
     "@orama/core": "jsr:@orama/core@^1.2.4",
     "@octokit/core": "npm:@octokit/core@^5.2.0",
     "leo-profanity": "npm:leo-profanity@^1.7.0"
   },
   "tasks": {
-    "lume": {
-      "description": "Run Lume command",
-      "command": "deno run --env-file -P=lume lume/cli.ts"
-    },
-    "dev": "LUME_LOGS=WARN deno task lume -s",
-    "serve": {
-      "description": "Run and serve the site for development",
-      "command": "deno task dev"
-    },
+    "dev": "LUME_LOGS=WARN deno run --env-file -A lume.ts -s",
+    "serve": "deno task dev",
     "start": "deno task dev",
-    "build": {
-      "description": "Build the site for production",
-      "command": "deno task generate:reference && deno task generate:std-docs && BUILD_TYPE=FULL deno task lume"
-    },
-    "build:light": "deno task lume",
+    "build": "deno task generate:reference && deno task generate:std-docs && BUILD_TYPE=FULL deno run --env-file -A --v8-flags=--max-old-space-size=4096 lume.ts && tailwindcss -i styles.css -o _site/styles.css --minify",
     "prod": "deno run --allow-read --allow-env --allow-net server.ts",
     "test": "deno test -A",
     "check:links": "deno run --no-lock --allow-net --allow-env .github/workflows/better_link_checker.ts",
@@ -52,8 +43,8 @@
     "types": [
       "lume/types.ts"
     ],
-    "jsx": "precompile",
-    "jsxImportSource": "lume"
+    "jsx": "react-jsx",
+    "jsxImportSource": "npm:preact"
   },
   "test": {
     "exclude": [
@@ -65,46 +56,5 @@
     "reference_gen",
     "orama"
   ],
-  "unstable": [
-    "temporal",
-    "fmt-component"
-  ],
-  "lint": {
-    "plugins": [
-      "https://cdn.jsdelivr.net/gh/lumeland/[email protected]/lint.ts"
-    ],
-    "rules": {
-      "exclude": [
-        "no-import-prefix"
-      ]
-    }
-  },
-  "nodeModulesDir": "auto",
-  "permissions": {
-    "lume": {
-      "read": true,
-      "write": true,
-      "import": [
-        "cdn.jsdelivr.net:443",
-        "jsr.io:443",
-        "deno.land:443",
-        "esm.sh:443",
-        "raw.githubusercontent.com:443"
-      ],
-      "net": [
-        "0.0.0.0",
-        "cdn.jsdelivr.net:443",
-        "data.jsdelivr.com:443",
-        "jsr.io:443",
-        "deno.land:443",
-        "esm.sh:443",
-        "registry.npmjs.org:443"
-      ],
-      "env": true,
-      "run": true,
-      "ffi": true,
-      "sys": true
-    }
-  },
-  "lock": false
+  "nodeModulesDir": "auto"
 }