zudoku 0.1.1-dev.18 → 0.1.1-dev.19

package/src/vite/plugin-html.ts

@@ -0,0 +1,50 @@
+import { Plugin } from "vite";
+
+const themeScript = `
+if (
+  localStorage.getItem("theme") === "dark" ||
+  (!("theme" in localStorage) &&
+    window.matchMedia("(prefers-color-scheme: dark)").matches)
+) {
+  document.documentElement.classList.add("dark");
+} else {
+  document.documentElement.classList.remove("dark");
+}
+`.trim();
+
+const viteHtmlPlugin = (): Plugin => {
+  return {
+    name: "vite-zudoku-core-plugin",
+    transformIndexHtml: (html) => {
+      return {
+        html,
+        tags: [
+          {
+            tag: "script",
+            attrs: { type: "module" },
+            children: themeScript,
+            injectTo: "head",
+          },
+          {
+            tag: "link",
+            attrs: {
+              rel: "preconnect",
+              href: "https://cdn.zuplo.com/",
+            },
+            injectTo: "head",
+          },
+          {
+            tag: "link",
+            attrs: {
+              rel: "stylesheet",
+              href: "https://cdn.zuplo.com/static/fonts/geist.css",
+            },
+            injectTo: "head",
+          },
+        ],
+      };
+    },
+  };
+};
+
+export default viteHtmlPlugin;

package/src/vite/plugin-mdx.ts

@@ -0,0 +1,74 @@
+import rehypeMetaAsAttributes from "@lekoarts/rehype-meta-as-attributes";
+import mdx, { type Options } from "@mdx-js/rollup";
+import withToc from "@stefanprobst/rehype-extract-toc";
+import withTocExport from "@stefanprobst/rehype-extract-toc/mdx";
+import path from "node:path";
+import rehypeSlug from "rehype-slug";
+import remarkComment from "remark-comment";
+import remarkDirective from "remark-directive";
+import remarkDirectiveRehype from "remark-directive-rehype";
+import remarkFrontmatter from "remark-frontmatter";
+import remarkGfm from "remark-gfm";
+import remarkMdxFrontmatter from "remark-mdx-frontmatter";
+import { visit } from "unist-util-visit";
+import { Plugin } from "vite";
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const rehypeCodeBlockPlugin = () => (tree: any) => {
+  visit(tree, "element", (node, index, parent) => {
+    if (node.tagName === "code") {
+      node.properties.inline = `${parent?.tagName !== "pre"}`;
+    }
+  });
+};
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const remarkLinkRewritePlugin = () => (tree: any) => {
+  visit(tree, "link", (node) => {
+    if (!node.url) return;
+
+    if (!node.url.startsWith("http") && !node.url.startsWith("/")) {
+      node.url = path.join("../", node.url);
+    }
+
+    node.url = node.url.replace(/\.mdx?(#.*?)?/, "$1");
+  });
+};
+
+export type DevPortalPluginOptions = {
+  remarkPlugins?: Options["remarkPlugins"];
+  rehypePlugins?: Options["rehypePlugins"];
+};
+
+const viteMdxPlugin = ({
+  remarkPlugins,
+  rehypePlugins,
+}: DevPortalPluginOptions = {}): Plugin => {
+  return {
+    enforce: "pre",
+    ...mdx({
+      providerImportSource: "@mdx-js/react",
+      remarkPlugins: [
+        remarkComment,
+        remarkGfm,
+        remarkFrontmatter,
+        remarkMdxFrontmatter,
+        remarkDirective,
+        remarkDirectiveRehype,
+        remarkLinkRewritePlugin,
+        ...(remarkPlugins ?? []),
+      ],
+      rehypePlugins: [
+        rehypeSlug,
+        rehypeCodeBlockPlugin,
+        rehypeMetaAsAttributes,
+        withToc,
+        withTocExport,
+        ...(rehypePlugins ?? []),
+      ],
+    }),
+    name: "vite-zudoku-mdx-plugin",
+  };
+};
+
+export default viteMdxPlugin;

package/src/vite/plugin-metadata.ts

@@ -0,0 +1,30 @@
+import { writeFileSync } from "node:fs";
+import path from "node:path";
+import { Plugin } from "vite";
+
+/**
+ * Used for debugging, writes metadata to build.
+ */
+const viteBuildMetadata = (): Plugin => {
+  return {
+    name: "vite-zudoku-build-metadata-plugin",
+    buildEnd() {
+      const deps = [];
+      for (const id of this.getModuleIds()) {
+        const m = this.getModuleInfo(id);
+        if (m != null && !m.isExternal) {
+          for (const target of m.importedIds) {
+            deps.push({ source: m.id, target });
+          }
+        }
+      }
+
+      writeFileSync(
+        path.join(__dirname, "graph.json"),
+        JSON.stringify(deps, null, 2),
+      );
+    },
+  };
+};
+
+export default viteBuildMetadata;

package/src/vite/plugin.ts

@@ -0,0 +1,23 @@
+import react from "@vitejs/plugin-react";
+import { type PluginOption } from "vite";
+import { ZudokuPluginOptions } from "../config/config.js";
+import viteApiPlugin from "./plugin-api.js";
+import viteAuthPlugin from "./plugin-auth.js";
+import viteConfigPlugin from "./plugin-config.js";
+import viteDocsPlugin from "./plugin-docs.js";
+import viteHtmlPlugin from "./plugin-html.js";
+import viteMdxPlugin from "./plugin-mdx.js";
+
+export default function vitePlugin(
+  config: ZudokuPluginOptions,
+): PluginOption[] {
+  return [
+    viteMdxPlugin(config.build),
+    react({ include: /\.(mdx?|jsx?|tsx?)$/ }),
+    viteHtmlPlugin(),
+    viteConfigPlugin(config),
+    viteAuthPlugin(config),
+    viteDocsPlugin(config),
+    viteApiPlugin(config),
+  ];
+}