@pruddiman/mdmirror 0.1.0

package/dist/theme/styles.css

@@ -0,0 +1,462 @@
+/* mdmirror default theme */
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+:root {
+  --sidebar-width: 280px;
+  --content-max-width: 48rem;
+  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+  --font-mono: "SF Mono", "Fira Code", "Fira Mono", Menlo, Consolas, monospace;
+  --color-bg: #ffffff;
+  --color-text: #1a1a2e;
+  --color-text-muted: #6b7280;
+  --color-border: #e5e7eb;
+  --color-sidebar-bg: #f9fafb;
+  --color-sidebar-hover: #f3f4f6;
+  --color-active: #2563eb;
+  --color-active-bg: #eff6ff;
+  --color-link: #2563eb;
+  --color-code-bg: #f3f4f6;
+  --color-blockquote-border: #d1d5db;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --color-bg: #0d1117;
+    --color-text: #e6edf3;
+    --color-text-muted: #8b949e;
+    --color-border: #30363d;
+    --color-sidebar-bg: #161b22;
+    --color-sidebar-hover: #21262d;
+    --color-active: #58a6ff;
+    --color-active-bg: #1f3a5f;
+    --color-link: #58a6ff;
+    --color-code-bg: #161b22;
+    --color-blockquote-border: #30363d;
+  }
+}
+
+html {
+  font-size: 16px;
+  line-height: 1.6;
+}
+
+body {
+  font-family: var(--font-sans);
+  color: var(--color-text);
+  background: var(--color-bg);
+  display: flex;
+  min-height: 100vh;
+}
+
+/* Sidebar */
+.sidebar {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: var(--sidebar-width);
+  height: 100vh;
+  overflow-y: auto;
+  background: var(--color-sidebar-bg);
+  border-right: 1px solid var(--color-border);
+  padding: 1.5rem 0;
+  z-index: 100;
+}
+
+.sidebar-header {
+  padding: 0 1.25rem 1rem;
+  border-bottom: 1px solid var(--color-border);
+  margin-bottom: 1rem;
+}
+
+.site-title {
+  font-size: 1.1rem;
+  font-weight: 700;
+  color: var(--color-text);
+  text-decoration: none;
+}
+
+.site-title:hover {
+  color: var(--color-active);
+}
+
+.menu-toggle {
+  display: none;
+  background: none;
+  border: none;
+  cursor: pointer;
+  padding: 0.5rem;
+}
+
+.menu-toggle span {
+  display: block;
+  width: 20px;
+  height: 2px;
+  background: var(--color-text);
+  margin: 4px 0;
+  transition: 0.3s;
+}
+
+/* Search */
+.search-container {
+  padding: 0 0.75rem 0.75rem;
+  position: relative;
+}
+
+.search-input {
+  width: 100%;
+  padding: 0.4rem 0.75rem;
+  border: 1px solid var(--color-border);
+  border-radius: 0.375rem;
+  background: var(--color-bg);
+  color: var(--color-text);
+  font-size: 0.875rem;
+  font-family: var(--font-sans);
+  outline: none;
+}
+
+.search-input:focus {
+  border-color: var(--color-active);
+}
+
+.search-results {
+  display: none;
+  position: absolute;
+  top: 100%;
+  left: 0.75rem;
+  right: 0.75rem;
+  background: var(--color-bg);
+  border: 1px solid var(--color-border);
+  border-radius: 0.375rem;
+  list-style: none;
+  padding: 0.25rem 0;
+  z-index: 200;
+  max-height: 300px;
+  overflow-y: auto;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+}
+
+.search-results li a {
+  display: block;
+  padding: 0.4rem 0.75rem;
+  font-size: 0.875rem;
+  color: var(--color-text);
+  text-decoration: none;
+}
+
+.search-results li a:hover {
+  background: var(--color-sidebar-hover);
+}
+
+.search-no-results {
+  padding: 0.4rem 0.75rem;
+  font-size: 0.875rem;
+  color: var(--color-text-muted);
+}
+
+/* Navigation */
+.sidebar nav ul {
+  list-style: none;
+  padding: 0;
+}
+
+.sidebar nav > ul {
+  padding: 0 0.75rem;
+}
+
+.sidebar nav li {
+  margin: 0;
+}
+
+.sidebar nav li a,
+.sidebar nav li summary span,
+.sidebar nav li summary a {
+  display: block;
+  padding: 0.35rem 0.75rem;
+  color: var(--color-text-muted);
+  text-decoration: none;
+  font-size: 0.9rem;
+  border-radius: 0.375rem;
+  transition: color 0.15s, background 0.15s;
+}
+
+.sidebar nav li a:hover,
+.sidebar nav li summary span:hover,
+.sidebar nav li summary a:hover {
+  color: var(--color-text);
+  background: var(--color-sidebar-hover);
+}
+
+.sidebar nav li.active > a,
+.sidebar nav li.active > details > summary a {
+  color: var(--color-active);
+  background: var(--color-active-bg);
+  font-weight: 600;
+}
+
+/* Section expand/collapse */
+.sidebar nav details {
+  margin: 0;
+}
+
+.sidebar nav details summary {
+  cursor: pointer;
+  list-style: none;
+  display: flex;
+  align-items: center;
+}
+
+.sidebar nav details summary::-webkit-details-marker {
+  display: none;
+}
+
+/* Chevron indicator for expandable sections */
+.sidebar nav details summary::before {
+  content: "";
+  display: inline-block;
+  width: 0.35rem;
+  height: 0.35rem;
+  border-right: 1.5px solid var(--color-text-muted);
+  border-bottom: 1.5px solid var(--color-text-muted);
+  transform: rotate(-45deg);
+  transition: transform 0.15s ease;
+  margin-right: 0.35rem;
+  flex-shrink: 0;
+}
+
+.sidebar nav details[open] > summary::before {
+  transform: rotate(45deg);
+}
+
+.sidebar nav details > ul {
+  padding-left: 0.75rem;
+  border-left: 1px solid var(--color-border);
+  margin-left: 1rem;
+}
+
+/* Main content */
+.content {
+  margin-left: var(--sidebar-width);
+  flex: 1;
+  padding: 2rem 3rem;
+  max-width: calc(var(--content-max-width) + 6rem);
+}
+
+.content article {
+  max-width: var(--content-max-width);
+}
+
+/* Typography */
+.content h1 {
+  font-size: 2rem;
+  font-weight: 800;
+  margin-bottom: 1rem;
+  line-height: 1.2;
+  border-bottom: 1px solid var(--color-border);
+  padding-bottom: 0.5rem;
+}
+
+.content h2 {
+  font-size: 1.5rem;
+  font-weight: 700;
+  margin-top: 2rem;
+  margin-bottom: 0.75rem;
+  line-height: 1.3;
+}
+
+.content h3 {
+  font-size: 1.25rem;
+  font-weight: 600;
+  margin-top: 1.5rem;
+  margin-bottom: 0.5rem;
+}
+
+.content h4, .content h5, .content h6 {
+  font-size: 1.1rem;
+  font-weight: 600;
+  margin-top: 1.25rem;
+  margin-bottom: 0.5rem;
+}
+
+.content p {
+  margin-bottom: 1rem;
+}
+
+.content a {
+  color: var(--color-link);
+  text-decoration: none;
+}
+
+.content a:hover {
+  text-decoration: underline;
+}
+
+/* Lists */
+.content ul, .content ol {
+  margin-bottom: 1rem;
+  padding-left: 1.5rem;
+}
+
+.content li {
+  margin-bottom: 0.25rem;
+}
+
+.content li > ul,
+.content li > ol {
+  margin-bottom: 0;
+  margin-top: 0.25rem;
+}
+
+/* Code */
+.content code {
+  font-family: var(--font-mono);
+  font-size: 0.875em;
+  background: var(--color-code-bg);
+  padding: 0.15em 0.35em;
+  border-radius: 0.25rem;
+}
+
+.content pre {
+  background: var(--color-code-bg);
+  padding: 1rem 1.25rem;
+  border-radius: 0.5rem;
+  overflow-x: auto;
+  margin-bottom: 1rem;
+  line-height: 1.5;
+}
+
+.content pre code {
+  background: none;
+  padding: 0;
+  font-size: 0.85rem;
+}
+
+/* Tables */
+.content table {
+  width: 100%;
+  border-collapse: collapse;
+  margin-bottom: 1rem;
+  font-size: 0.9rem;
+}
+
+.content th,
+.content td {
+  padding: 0.5rem 0.75rem;
+  border: 1px solid var(--color-border);
+  text-align: left;
+}
+
+.content th {
+  background: var(--color-code-bg);
+  font-weight: 600;
+}
+
+.content tr:nth-child(even) {
+  background: var(--color-sidebar-bg);
+}
+
+/* Blockquotes */
+.content blockquote {
+  border-left: 3px solid var(--color-blockquote-border);
+  padding: 0.5rem 1rem;
+  margin-bottom: 1rem;
+  color: var(--color-text-muted);
+  font-style: italic;
+}
+
+.content blockquote p:last-child {
+  margin-bottom: 0;
+}
+
+/* Images */
+.content img {
+  max-width: 100%;
+  height: auto;
+  border-radius: 0.5rem;
+}
+
+/* Horizontal rules */
+.content hr {
+  border: none;
+  border-top: 1px solid var(--color-border);
+  margin: 2rem 0;
+}
+
+/* Mermaid diagrams */
+.content .mermaid {
+  visibility: hidden;
+  background: transparent;
+  text-align: center;
+  padding: 1rem 0;
+  margin-bottom: 1rem;
+}
+
+.content .mermaid svg {
+  max-width: 100%;
+  height: auto;
+}
+
+/* Shiki syntax highlighting overrides */
+.content pre:has(code) {
+  background: var(--color-code-bg);
+}
+
+.content pre .shiki {
+  background: transparent !important;
+  padding: 0;
+  margin: 0;
+  overflow-x: auto;
+}
+
+.content pre .shiki code {
+  background: transparent;
+  font-family: var(--font-mono);
+  font-size: 0.85rem;
+}
+
+/* Shiki dual-theme: show light tokens by default, dark tokens in dark mode */
+.shiki span[style*="--shiki-dark"] {
+  color: var(--shiki-light);
+}
+
+@media (prefers-color-scheme: dark) {
+  .shiki span[style*="--shiki-dark"] {
+    color: var(--shiki-dark) !important;
+  }
+}
+
+/* Responsive */
+@media (max-width: 768px) {
+  .sidebar {
+    transform: translateX(-100%);
+    transition: transform 0.3s ease;
+  }
+
+  .sidebar.open {
+    transform: translateX(0);
+  }
+
+  .menu-toggle {
+    display: block;
+    position: fixed;
+    top: 1rem;
+    left: 1rem;
+    z-index: 200;
+    background: var(--color-bg);
+    border: 1px solid var(--color-border);
+    border-radius: 0.375rem;
+    padding: 0.5rem;
+  }
+
+  .content {
+    margin-left: 0;
+    padding: 2rem 1.5rem;
+    padding-top: 4rem;
+  }
+}

package/dist/types.d.ts

@@ -0,0 +1,99 @@
+/**
+ * Shared TypeScript type definitions for mdmirror.
+ * Based on data-model.md entity definitions.
+ */
+export interface SourceFolder {
+    /** Resolved absolute path to the root documentation directory */
+    path: string;
+    /** Whether the path exists and is a directory */
+    exists: boolean;
+}
+export type FileType = "md" | "txt";
+export interface Document {
+    /** Path relative to the source folder root (e.g., "guides/getting-started.md") */
+    sourcePath: string;
+    /** Resolved absolute path on disk for reading content */
+    absolutePath: string;
+    /** Clean URL slug derived from the relative path */
+    slug: string;
+    /** Page title, derived from front matter, first heading, or filename */
+    title: string;
+    /** Short description from front matter (used in meta tags) */
+    description: string;
+    /** Raw source content of the file */
+    content: string;
+    /** HTML output after markdown processing */
+    renderedHtml: string;
+    /** Determines rendering strategy */
+    fileType: FileType;
+    /** True if filename is index.md or README.md */
+    isIndex: boolean;
+    /** Derived from filename for navigation ordering */
+    sortKey: string;
+}
+export type NavigationNodeType = "section" | "page";
+export interface NavigationNode {
+    /** Display text in navigation */
+    label: string;
+    /** URL slug for this node */
+    slug: string;
+    /** Determines rendering in the sidebar */
+    type: NavigationNodeType;
+    /** Child nodes (only for sections) */
+    children: NavigationNode[];
+    /** Ordering key */
+    sortKey: string;
+    /** Whether this node corresponds to the currently viewed page */
+    isActive: boolean;
+    /** For sections: the index.md/README.md landing page if one exists */
+    indexDocument: Document | null;
+    /** Nesting level (0 = root level) */
+    depth: number;
+}
+export interface NavigationTree {
+    /** Top-level navigation nodes */
+    root: NavigationNode[];
+    /** Flat list of all documents for iteration/lookup */
+    flatPages: Document[];
+    /** Count of all pages in the tree */
+    totalPages: number;
+}
+export type SiteMode = "serve" | "build";
+export interface Site {
+    /** The input directory */
+    sourceFolder: SourceFolder;
+    /** The generated navigation hierarchy */
+    navigationTree: NavigationTree;
+    /** All processed documents */
+    documents: Document[];
+    /** The active visual theme configuration */
+    theme: Theme;
+    /** Whether running as dev server or generating static output */
+    mode: SiteMode;
+}
+export interface Theme {
+    /** HTML template function */
+    layoutTemplate: string;
+    /** CSS content for the default theme */
+    stylesheet: string;
+    /** Client-side JS files to include */
+    clientScripts: string[];
+}
+export interface ServerConfig {
+    /** HTTP server port. Default: 3000 */
+    port: number;
+    /** Bind address. Default: localhost */
+    host: string;
+    /** Absolute path to the source folder being served */
+    sourcePath: string;
+    /** Whether WebSocket live reload is active */
+    liveReload: boolean;
+}
+export interface BuildConfig {
+    /** Directory to write static output. Default: ./dist */
+    outputDir: string;
+    /** Absolute path to the source folder being built */
+    sourcePath: string;
+    /** Base URL for links. Default: ./ */
+    baseUrl: string;
+}

package/dist/types.js

@@ -0,0 +1,6 @@
+/**
+ * Shared TypeScript type definitions for mdmirror.
+ * Based on data-model.md entity definitions.
+ */
+export {};
+//# sourceMappingURL=types.js.map

package/dist/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;;GAGG"}

package/package.json

@@ -0,0 +1,76 @@
+{
+  "name": "@pruddiman/mdmirror",
+  "version": "0.1.0",
+  "description": "Zero-config CLI tool that turns any folder of markdown files into a browsable documentation site",
+  "type": "module",
+  "bin": {
+    "mdmirror": "dist/cli/index.js"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "scripts": {
+    "build": "tsc && cp src/theme/styles.css dist/theme/styles.css",
+    "prepare": "npm run build",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "dev": "tsx src/cli/index.ts",
+    "lint": "eslint src tests",
+    "lint:fix": "eslint src tests --fix",
+    "format": "prettier --write src tests",
+    "format:check": "prettier --check src tests"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/PatrickRuddiman/mdmirror.git"
+  },
+  "keywords": [
+    "markdown",
+    "documentation",
+    "static-site",
+    "cli"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "author": "",
+  "license": "ISC",
+  "bugs": {
+    "url": "https://github.com/PatrickRuddiman/mdmirror/issues"
+  },
+  "homepage": "https://github.com/PatrickRuddiman/mdmirror#readme",
+  "dependencies": {
+    "@shikijs/rehype": "^3.22.0",
+    "chokidar": "^5.0.0",
+    "citty": "^0.2.1",
+    "mermaid": "^11.12.3",
+    "minisearch": "^7.2.0",
+    "rehype-raw": "^7.0.0",
+    "rehype-stringify": "^10.0.1",
+    "remark-extract-frontmatter": "^3.2.0",
+    "remark-frontmatter": "^5.0.0",
+    "remark-gfm": "^4.0.1",
+    "remark-parse": "^11.0.0",
+    "remark-rehype": "^11.1.2",
+    "unified": "^11.0.5",
+    "unist-util-visit": "^5.1.0",
+    "ws": "^8.19.0",
+    "yaml": "^2.8.3"
+  },
+  "devDependencies": {
+    "@eslint/js": "^10.0.1",
+    "@types/node": "^25.3.0",
+    "@types/ws": "^8.18.1",
+    "eslint": "^10.1.0",
+    "eslint-config-prettier": "^10.1.8",
+    "prettier": "^3.8.1",
+    "tsx": "^4.21.0",
+    "typescript": "^5.9.3",
+    "typescript-eslint": "^8.57.1",
+    "vitest": "^4.0.18"
+  }
+}