@ayushshanker/mdo 0.2.0 → 0.4.0

package/README.md

@@ -1,6 +1,6 @@
-# @ayushshanker/mdo
+# mdo
 
-`@ayushshanker/mdo` is the npm package name. It installs the `mdo` CLI for previewing Markdown files and folders in your browser.
+Contains `mdo` CLI for previewing Markdown files and folders in your browser.
 
 ## Install
 
@@ -89,7 +89,7 @@ mdo docs --port 3000
 ## Flags
 
 - `--dark` uses the GitHub dark theme
-- `--theme <name>` selects `github`, `github-dark`, `sepia`, `earth`, `earthsong`, `gruvbox`, or `dracula`
+- `--theme <name>` selects `github-light`, `github-dark`, `belafonte-day`, `belafonte-night`, `earth`, `earthsong`, or `dracula`
 - `--output <file>` writes HTML to disk instead of opening the browser; file mode only
 - `--port <port>` uses a fixed port for folder mode
 - `--help` prints usage information

package/lib/browser.js

@@ -0,0 +1,42 @@
+"use strict";
+
+const { spawn } = require("node:child_process");
+
+function getBrowserCommand(target) {
+  switch (process.platform) {
+    case "darwin":
+      if (/^[a-zA-Z][a-zA-Z\d+\-.]*:/.test(target)) {
+        return { command: "/usr/bin/open", args: ["-u", target] };
+      }
+      return { command: "/usr/bin/open", args: [target] };
+    case "win32":
+      return {
+        command: "cmd",
+        args: ["/c", "start", "", target]
+      };
+    default:
+      return { command: "xdg-open", args: [target] };
+  }
+}
+
+function openInBrowser(target) {
+  const { command, args } = getBrowserCommand(target);
+
+  return new Promise((resolve, reject) => {
+    const child = spawn(command, args, {
+      detached: true,
+      stdio: "ignore"
+    });
+
+    child.once("error", reject);
+    child.once("spawn", () => {
+      child.unref();
+      resolve();
+    });
+  });
+}
+
+module.exports = {
+  getBrowserCommand,
+  openInBrowser
+};

package/lib/cli.js

@@ -12,15 +12,38 @@ const {
   validatePort
 } = require("./utils");
 
+function themeNames() {
+  return Object.keys(THEMES);
+}
+
+function hasBareThemeFlag(argv) {
+  for (let index = 0; index < argv.length; index += 1) {
+    if (argv[index] !== "--theme") {
+      continue;
+    }
+
+    const next = argv[index + 1];
+    if (!next || next.startsWith("-")) {
+      return true;
+    }
+  }
+
+  return false;
+}
+
+function printThemeList() {
+  process.stdout.write(`Available themes:\n${themeNames().map((name) => `- ${name}`).join("\n")}\n`);
+}
+
 function resolveThemeOption(options) {
   if (options.theme) {
     if (!Object.hasOwn(THEMES, options.theme)) {
-      throw new Error(`Theme must be one of: ${Object.keys(THEMES).join(", ")}.`);
+      throw new Error(`Theme must be one of: ${themeNames().join(", ")}.`);
     }
     return options.theme;
   }
 
-  return options.dark ? "github-dark" : "github";
+  return options.dark ? "github-dark" : "github-light";
 }
 
 function buildProgram() {
@@ -34,7 +57,7 @@ function buildProgram() {
     .option("--dark", "Use GitHub dark theme.")
     .option(
       "--theme <name>",
-      `Use a named theme: ${Object.keys(THEMES).join(", ")}.`
+      `Use a named theme: ${themeNames().join(", ")}.`
     )
     .option("--output <file>", "Write HTML to a file instead of opening the browser.")
     .option("--port <port>", "Use a fixed port for folder mode.", validatePort)
@@ -56,6 +79,11 @@ Examples:
 }
 
 async function runCli(argv = process.argv) {
+  if (hasBareThemeFlag(argv.slice(2))) {
+    printThemeList();
+    return;
+  }
+
   const program = buildProgram();
   program.exitOverride();
 

package/lib/constants.js

@@ -11,7 +11,7 @@ const MERMAID_VERSION = "11.12.0";
 const MERMAID_CDN_URL = `https://cdn.jsdelivr.net/npm/mermaid@${MERMAID_VERSION}/dist/mermaid.min.js`;
 const LIGHT_HLJS_THEME = "github.css";
 const DARK_HLJS_THEME = "github-dark.css";
-const GITHUB_MARKDOWN_CSS = "github-markdown.css";
+const GITHUB_MARKDOWN_LIGHT_CSS = "github-markdown-light.css";
 const GITHUB_MARKDOWN_DARK_CSS = "github-markdown-dark.css";
 const DEFAULT_ARTICLE_TITLE = "Markdown Preview";
 const PACKAGE_ROOT = path.resolve(__dirname, "..");
@@ -19,7 +19,7 @@ const PACKAGE_ROOT = path.resolve(__dirname, "..");
 module.exports = {
 	DARK_HLJS_THEME,
 	DEFAULT_ARTICLE_TITLE,
-	GITHUB_MARKDOWN_CSS,
+	GITHUB_MARKDOWN_LIGHT_CSS,
 	GITHUB_MARKDOWN_DARK_CSS,
 	LIGHT_HLJS_THEME,
 	LOOPBACK_HOST,

package/lib/file-mode.js

@@ -2,7 +2,7 @@
 
 const fs = require("node:fs/promises");
 const path = require("node:path");
-const open = require("open");
+const { openInBrowser } = require("./browser");
 const { renderMarkdownFile } = require("./renderer");
 const {
   humanUrlPath,
@@ -26,13 +26,17 @@ async function runFileMode({ filePath, outputPath, cwdRealPath, themeName }) {
   await writeUtf8File(htmlPath, html);
 
   try {
-    await open(htmlPath);
+    await openInBrowser(htmlPath);
   } catch (error) {
     process.stderr.write(`Browser open failed. File available at ${htmlPath}\n`);
-    throw new Error(`Failed to open browser for ${humanUrlPath(cwdRealPath, filePath)}.`);
+    return {
+      browserOpened: false,
+      outputPath: htmlPath,
+      visiblePath: humanUrlPath(cwdRealPath, filePath)
+    };
   }
 
-  return { outputPath: htmlPath, opened: true };
+  return { browserOpened: true, outputPath: htmlPath, visiblePath: humanUrlPath(cwdRealPath, filePath) };
 }
 
 module.exports = {

package/lib/folder-mode.js

@@ -3,10 +3,10 @@
 const http = require("node:http");
 const fs = require("node:fs/promises");
 const path = require("node:path");
-const open = require("open");
+const { openInBrowser } = require("./browser");
 const { LOOPBACK_HOST, MAX_PORT, MIN_PORT, PORT_RETRIES } = require("./constants");
 const { renderDirectoryListing, renderMarkdownFile } = require("./renderer");
-const { isMarkdownPath, toPosixPath } = require("./utils");
+const { isMarkdownPath } = require("./utils");
 
 async function resolveInsideRoot(rootRealPath, requestPath) {
   const normalized = decodeURIComponent(requestPath || "/");
@@ -145,19 +145,18 @@ function installShutdownHandlers(server) {
       return;
     }
     shuttingDown = true;
-    const timeout = setTimeout(() => {
-      process.exit(0);
-    }, 2000);
-    timeout.unref();
-
-    server.close(() => {
-      clearTimeout(timeout);
-      process.exit(0);
-    });
+    server.close();
+    if (signal === "SIGINT") {
+      process.exit(130);
+    }
+    if (signal === "SIGTERM") {
+      process.exit(143);
+    }
+    process.exit(0);
   };
 
-  process.on("SIGINT", shutdown);
-  process.on("SIGTERM", shutdown);
+  process.once("SIGINT", shutdown);
+  process.once("SIGTERM", shutdown);
 }
 
 async function runFolderMode({ directoryPath, fixedPort, themeName }) {
@@ -215,13 +214,13 @@ async function runFolderMode({ directoryPath, fixedPort, themeName }) {
 
   const url = `http://${LOOPBACK_HOST}:${port}/`;
   try {
-    await open(url);
+    await openInBrowser(url);
   } catch {
     process.stderr.write(`Browser open failed. Server available at ${url}\n`);
-    throw new Error("Failed to open browser.");
+    return { browserOpened: false, port, rootRealPath, url, server };
   }
 
-  return { port, rootRealPath, url, server };
+  return { browserOpened: true, port, rootRealPath, url, server };
 }
 
 module.exports = {

package/lib/renderer.js

@@ -10,7 +10,7 @@ const hljs = require("highlight.js");
 const {
   DARK_HLJS_THEME,
   DEFAULT_ARTICLE_TITLE,
-  GITHUB_MARKDOWN_CSS,
+  GITHUB_MARKDOWN_LIGHT_CSS,
   GITHUB_MARKDOWN_DARK_CSS,
   LIGHT_HLJS_THEME,
   MERMAID_CDN_URL,
@@ -26,7 +26,7 @@ function loadCss(relativePath) {
   return fs.readFileSync(cssPath, "utf8");
 }
 
-const markdownCssLight = loadCss(`github-markdown-css/${GITHUB_MARKDOWN_CSS}`);
+const markdownCssLight = loadCss(`github-markdown-css/${GITHUB_MARKDOWN_LIGHT_CSS}`);
 const markdownCssDark = loadCss(`github-markdown-css/${GITHUB_MARKDOWN_DARK_CSS}`);
 const hljsCssLight = loadCss(`highlight.js/styles/${LIGHT_HLJS_THEME}`);
 const hljsCssDark = loadCss(`highlight.js/styles/${DARK_HLJS_THEME}`);
@@ -56,7 +56,7 @@ function createMarkdownRenderer() {
 const renderer = createMarkdownRenderer();
 
 const THEMES = {
-  github: {
+  "github-light": {
     accent: "#0969da",
     background: "#ffffff",
     color: "#1f2328",
@@ -78,28 +78,59 @@ const THEMES = {
     navFontColor: "#8b949e",
     overlayCss: ""
   },
-  sepia: {
-    accent: "#8b5e34",
-    background: "#f6efe2",
-    color: "#433422",
+  "belafonte-day": {
+    accent: "#8f5a2b",
+    background: "#f6f1e7",
+    color: "#3d3126",
     darkMode: false,
     hljsCss: hljsCssLight,
     markdownCss: markdownCssLight,
     mermaidTheme: "neutral",
-    navFontColor: "#6e5a43",
+    navFontColor: "#6f5a46",
     overlayCss: `
-body { background-image: linear-gradient(180deg, rgba(139, 94, 52, 0.06), rgba(139, 94, 52, 0)); }
+body { background-image: linear-gradient(135deg, rgba(143, 90, 43, 0.08), rgba(191, 143, 84, 0.05)); }
 .markdown-body {
-  color: #433422;
+  color: #3d3126;
 }
 .markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .markdown-body h5, .markdown-body h6 {
-  color: #2f2418;
+  color: #2b2219;
 }
 .markdown-body pre, .markdown-body code, .markdown-body blockquote {
-  background-color: rgba(114, 87, 56, 0.08);
+  background-color: rgba(120, 90, 59, 0.09);
 }
 .markdown-body table tr {
-  background-color: rgba(255, 255, 255, 0.35);
+  background-color: rgba(255, 248, 238, 0.5);
+}
+.markdown-body a, .mdo-nav a {
+  color: #8f5a2b;
+}
+`
+  },
+  "belafonte-night": {
+    accent: "#d7995b",
+    background: "#20111b",
+    color: "#f2e7d5",
+    darkMode: true,
+    hljsCss: hljsCssDark,
+    markdownCss: markdownCssDark,
+    mermaidTheme: "dark",
+    navFontColor: "#ccb9a4",
+    overlayCss: `
+body { background-image: radial-gradient(circle at top, rgba(215, 153, 91, 0.2), rgba(32, 17, 27, 0) 42%); }
+.markdown-body {
+  color: #f2e7d5;
+}
+.markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .markdown-body h5, .markdown-body h6 {
+  color: #ffd7a8;
+}
+.markdown-body pre, .markdown-body code, .markdown-body blockquote {
+  background-color: rgba(75, 49, 44, 0.94);
+}
+.markdown-body table tr {
+  background-color: rgba(92, 62, 54, 0.45);
+}
+.markdown-body a, .mdo-nav a {
+  color: #d7995b;
 }
 `
   },
@@ -157,34 +188,6 @@ body { background-image: radial-gradient(circle at top, rgba(185, 119, 50, 0.2),
 .markdown-body table tr {
   background-color: rgba(90, 66, 49, 0.48);
 }
-`
-  },
-  gruvbox: {
-    accent: "#d79921",
-    background: "#282828",
-    color: "#ebdbb2",
-    darkMode: true,
-    hljsCss: hljsCssDark,
-    markdownCss: markdownCssDark,
-    mermaidTheme: "dark",
-    navFontColor: "#d5c4a1",
-    overlayCss: `
-body { background-image: linear-gradient(180deg, rgba(215, 153, 33, 0.08), rgba(40, 40, 40, 0)); }
-.markdown-body {
-  color: #ebdbb2;
-}
-.markdown-body a, .mdo-nav a {
-  color: #d79921;
-}
-.markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .markdown-body h5, .markdown-body h6 {
-  color: #fabd2f;
-}
-.markdown-body pre, .markdown-body code, .markdown-body blockquote {
-  background-color: rgba(60, 56, 54, 0.95);
-}
-.markdown-body table tr {
-  background-color: rgba(80, 73, 69, 0.45);
-}
 `
   },
   dracula: {
@@ -215,7 +218,7 @@ body { background-image: radial-gradient(circle at top, rgba(189, 147, 249, 0.18
 };
 
 function resolveTheme(themeName) {
-  return THEMES[themeName] || THEMES.github;
+  return THEMES[themeName] || THEMES["github-light"];
 }
 
 function buildStyles(themeName) {
@@ -306,7 +309,7 @@ async function renderMarkdownFile(filePath, options = {}) {
   return {
     html: buildDocument({
       bodyHtml,
-      themeName: options.themeName || "github",
+      themeName: options.themeName || "github-light",
       title,
       backHref: options.backHref,
       backLabel: options.backLabel,
@@ -336,7 +339,7 @@ function renderDirectoryListing({ directoryName, entries, themeName, requestPath
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <meta http-equiv="Content-Security-Policy" content="default-src 'none'; style-src 'unsafe-inline';">
     <title>${escapeHtml(heading)}</title>
-    <style>${buildStyles(themeName || "github")}</style>
+    <style>${buildStyles(themeName || "github-light")}</style>
   </head>
   <body>
     ${backHref}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@ayushshanker/mdo",
-	"version": "0.2.0",
+	"version": "0.4.0",
 	"description": "Preview Markdown files and folders in the browser",
 	"bin": {
 		"mdo": "bin/mdo.js"