methanol 0.0.8 → 0.0.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "methanol",
-  "version": "0.0.8",
+  "version": "0.0.9",
   "description": "Static site generator powered by rEFui and MDX",
   "main": "./index.js",
   "type": "module",
@@ -39,6 +39,7 @@
     "refurbish": "^0.1.8",
     "rehype-slug": "^6.0.0",
     "rehype-starry-night": "^2.2.0",
+    "remark-gfm": "^4.0.1",
     "unist-util-visit": "^5.0.0",
     "vite": "^7.3.0",
     "yargs": "^18.0.0"

package/src/build-system.js

@@ -67,7 +67,7 @@ export const buildHtmlEntries = async () => {
 		await ensureDir(state.INTERMEDIATE_DIR)
 	}
 
-	const logEnabled = state.CURRENT_MODE === 'production' && cli.command === 'build'
+	const logEnabled = state.CURRENT_MODE === 'production' && cli.command === 'build' && !cli.CLI_VERBOSE
 	const stageLogger = createStageLogger(logEnabled)
 	const themeComponentsDir = state.THEME_COMPONENTS_DIR
 	const themeEnv = state.THEME_ENV
@@ -164,6 +164,10 @@ export const buildHtmlEntries = async () => {
 }
 
 export const runViteBuild = async (entry, htmlCache) => {
+	const logEnabled = state.CURRENT_MODE === 'production' && cli.command === 'build' && !cli.CLI_VERBOSE
+	const stageLogger = createStageLogger(logEnabled)
+	const token = stageLogger.start('Building bundle')
+
 	if (state.STATIC_DIR !== false && state.MERGED_ASSETS_DIR) {
 		await preparePublicAssets({
 			themeDir: state.THEME_ASSETS_DIR,
@@ -177,6 +181,7 @@ export const runViteBuild = async (entry, htmlCache) => {
 		root: state.PAGES_DIR,
 		appType: 'mpa',
 		publicDir: state.STATIC_DIR === false ? false : state.STATIC_DIR,
+		logLevel: cli.CLI_VERBOSE ? 'info' : 'silent',
 		build: {
 			outDir: state.DIST_DIR,
 			emptyOutDir: true,
@@ -198,4 +203,5 @@ export const runViteBuild = async (entry, htmlCache) => {
 	const userConfig = await resolveUserViteConfig('build')
 	const finalConfig = userConfig ? mergeConfig(baseConfig, userConfig) : baseConfig
 	await viteBuild(finalConfig)
+	stageLogger.end(token)
 }

package/src/config.js

@@ -24,6 +24,7 @@ import { resolve, isAbsolute, extname, basename } from 'path'
 import { pathToFileURL } from 'url'
 import { mergeConfig } from 'vite'
 import { cli, state } from './state.js'
+import { logger } from './logger.js'
 import { HTMLRenderer } from './renderer.js'
 import { rewindEnv } from './components.js'
 import { env as createEnv } from './rewind.js'
@@ -123,7 +124,7 @@ const warnDevBase = (value) => {
 	if (devBaseWarningShown) return
 	devBaseWarningShown = true
 	const label = value ? ` (received "${value}")` : ''
-	console.warn(`Methanol: \`base\`${label} is disabled in dev mode due to module resolution inconsistencies in Vite. Using "/".\n`)
+	logger.warn(`Methanol: \`base\`${label} is disabled in dev mode due to module resolution inconsistencies in Vite. Using "/".\n`)
 }
 
 const hasOwn = (obj, key) => Object.prototype.hasOwnProperty.call(obj || {}, key)
@@ -264,7 +265,7 @@ export const applyConfig = async (config, mode) => {
 	const configSiteName = cli.CLI_SITE_NAME ?? config.site?.name ?? null
 	state.SITE_NAME = configSiteName || basename(root) || 'Methanol Site'
 	const userSite = config.site && typeof config.site === 'object' ? { ...config.site } : null
-	const siteBase = normalizeSiteBase(userSite?.base)
+	const siteBase = normalizeSiteBase(cli.CLI_BASE || userSite?.base)
 	state.SITE_BASE = siteBase
 	if (userSite) {
 		if (siteBase == null) {
@@ -392,6 +393,9 @@ export const applyConfig = async (config, mode) => {
 	state.THEME_POST_BUILD_HOOKS = normalizeHooks(state.USER_THEME?.postBuild)
 	state.THEME_PRE_BUNDLE_HOOKS = normalizeHooks(state.USER_THEME?.preBundle)
 	state.THEME_POST_BUNDLE_HOOKS = normalizeHooks(state.USER_THEME?.postBundle)
+	if (hasOwn(config, 'gfm')) {
+		state.GFM_ENABLED = config.gfm !== false
+	}
 	const starryNight = resolveStarryNightConfig(config.starryNight)
 	const cliCodeHighlighting = cli.CLI_CODE_HIGHLIGHTING
 	if (cliCodeHighlighting != null) {
@@ -448,6 +452,7 @@ export const resolveUserViteConfig = async (command) => {
 	if (state.RESOLVED_VITE_CONFIG !== undefined) {
 		return state.RESOLVED_VITE_CONFIG
 	}
+
 	const resolveConfig = async (config) => {
 		if (!config) return null
 		if (typeof config === 'function') {
@@ -463,9 +468,10 @@ export const resolveUserViteConfig = async (command) => {
 		}
 		return config || null
 	}
+
 	const themeConfig = await resolveConfig(state.USER_THEME.vite)
 	const userConfig = await resolveConfig(state.USER_VITE_CONFIG)
-	const userHasBase = userConfig && hasOwn(userConfig, 'base')
+
 	if (!themeConfig && !userConfig) {
 		if (state.SITE_BASE) {
 			state.RESOLVED_VITE_CONFIG = { base: state.SITE_BASE }
@@ -484,15 +490,20 @@ export const resolveUserViteConfig = async (command) => {
 		}
 		return state.RESOLVED_VITE_CONFIG
 	}
+
 	state.RESOLVED_VITE_CONFIG = themeConfig
 		? userConfig
 			? mergeConfig(themeConfig, userConfig)
 			: themeConfig
 		: userConfig
-	if (state.SITE_BASE && !userHasBase) {
+
+	const userHasBase = userConfig && hasOwn(userConfig, 'base')
+	if (state.SITE_BASE && (cli.CLI_BASE || !userHasBase)) {
 		state.RESOLVED_VITE_CONFIG.base = state.SITE_BASE
 	}
+
 	state.VITE_BASE = normalizeViteBase(state.RESOLVED_VITE_CONFIG?.base || state.SITE_BASE || '/')
+
 	if (command === 'serve') {
 		if (state.VITE_BASE !== '/' || (state.SITE_BASE && state.SITE_BASE !== '/')) {
 			warnDevBase(state.RESOLVED_VITE_CONFIG?.base || state.SITE_BASE || '')
@@ -500,6 +511,7 @@ export const resolveUserViteConfig = async (command) => {
 		state.RESOLVED_VITE_CONFIG.base = '/'
 		state.VITE_BASE = '/'
 	}
+
 	return state.RESOLVED_VITE_CONFIG
 }
 

package/src/dev-server.js

@@ -344,6 +344,8 @@ export const runViteDev = async () => {
 			} else {
 				return next()
 			}
+		} else if (requestedPath.endsWith('/index')) {
+			renderRoutePath = requestedPath.slice(0, -5) // remove last 'index'
 		}
 
 		try {

package/src/logger.js

@@ -0,0 +1,80 @@
+/* Copyright Yukino Song, SudoMaker Ltd.
+ *
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ * 	http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+const supportColor =
+	typeof process !== 'undefined' &&
+	process.stdout &&
+	(process.stdout.isTTY || process.env.FORCE_COLOR)
+
+const formatter = (open, close, replace = open) =>
+	supportColor
+		? (input) => {
+				const string = '' + input
+				const index = string.indexOf(close, open.length)
+				return ~index
+					? open + getReplace(string, index, close, replace) + close
+					: open + string + close
+			}
+		: (input) => '' + input
+
+const getReplace = (string, index, close, replace) => {
+	const head = string.substring(0, index) + replace
+	const tail = string.substring(index + close.length)
+	const next = tail.indexOf(close)
+	return ~next ? head + getReplace(tail, next, close, replace) : head + tail
+}
+
+export const style = {
+	reset: formatter('\x1b[0m', '\x1b[0m'),
+	bold: formatter('\x1b[1m', '\x1b[22m', '\x1b[22m\x1b[1m'),
+	dim: formatter('\x1b[2m', '\x1b[22m', '\x1b[22m\x1b[2m'),
+	italic: formatter('\x1b[3m', '\x1b[23m'),
+	underline: formatter('\x1b[4m', '\x1b[24m'),
+	inverse: formatter('\x1b[7m', '\x1b[27m'),
+	hidden: formatter('\x1b[8m', '\x1b[28m'),
+	strikethrough: formatter('\x1b[9m', '\x1b[29m'),
+
+	black: formatter('\x1b[30m', '\x1b[39m'),
+	red: formatter('\x1b[31m', '\x1b[39m'),
+	green: formatter('\x1b[32m', '\x1b[39m'),
+	yellow: formatter('\x1b[33m', '\x1b[39m'),
+	blue: formatter('\x1b[34m', '\x1b[39m'),
+	magenta: formatter('\x1b[35m', '\x1b[39m'),
+	cyan: formatter('\x1b[36m', '\x1b[39m'),
+	white: formatter('\x1b[37m', '\x1b[39m'),
+	gray: formatter('\x1b[90m', '\x1b[39m'),
+
+	bgBlack: formatter('\x1b[40m', '\x1b[49m'),
+	bgRed: formatter('\x1b[41m', '\x1b[49m'),
+	bgGreen: formatter('\x1b[42m', '\x1b[49m'),
+	bgYellow: formatter('\x1b[43m', '\x1b[49m'),
+	bgBlue: formatter('\x1b[44m', '\x1b[49m'),
+	bgMagenta: formatter('\x1b[45m', '\x1b[49m'),
+	bgCyan: formatter('\x1b[46m', '\x1b[49m'),
+	bgWhite: formatter('\x1b[47m', '\x1b[49m')
+}
+
+export const logger = {
+	info: (msg) => console.log(`${style.blue('ℹ')}  ${msg}`),
+	success: (msg) => console.log(`${style.green('✔')}  ${msg}`),
+	warn: (msg) => console.log(`${style.yellow('⚠')}  ${msg}`),
+	error: (msg) => console.log(`${style.red('✖')}  ${msg}`),
+	dim: (msg) => console.log(style.dim(msg))
+}

package/src/main.js

@@ -26,6 +26,7 @@ import { runVitePreview } from './preview-server.js'
 import { cli, state } from './state.js'
 import { HTMLRenderer } from './renderer.js'
 import { readFile } from 'fs/promises'
+import { style, logger } from './logger.js'
 
 const printBanner = async () => {
 	try {
@@ -107,6 +108,7 @@ const main = async () => {
 		return
 	}
 	if (isBuild) {
+		const startTime = performance.now()
 		await runHooks(state.USER_PRE_BUILD_HOOKS)
 		await runHooks(state.THEME_PRE_BUILD_HOOKS)
 		const { entry, htmlCache, pagesContext } = await buildHtmlEntries()
@@ -129,6 +131,11 @@ const main = async () => {
 		}
 		await runHooks(state.THEME_POST_BUILD_HOOKS, buildContext)
 		await runHooks(state.USER_POST_BUILD_HOOKS, buildContext)
+		const endTime = performance.now()
+		const duration = endTime - startTime
+		const timeString = duration > 1000 ? `${(duration / 1000).toFixed(2)}s` : `${Math.round(duration)}ms`
+		console.log()
+		logger.success(`Build completed in ${style.bold(timeString)}.`)
 		return
 	}
 	cli.showHelp()

package/src/mdx.js

@@ -25,6 +25,7 @@ import rehypeSlug from 'rehype-slug'
 import extractToc from '@stefanprobst/rehype-extract-toc'
 import withTocExport from '@stefanprobst/rehype-extract-toc/mdx'
 import rehypeStarryNight from 'rehype-starry-night'
+import remarkGfm from 'remark-gfm'
 import { HTMLRenderer } from './renderer.js'
 import { signal, computed, read, Suspense, nextTick } from 'refui'
 import { createPortal } from 'refui/extras'
@@ -260,11 +261,21 @@ const resolveBaseMdxConfig = async () => {
 		jsxImportSource: 'refui',
 		development: state.CURRENT_MODE !== 'production',
 		elementAttributeNameCase: 'html',
-		rehypePlugins: [rehypeSlug, extractToc, [withTocExport, { name: 'toc' }]]
+		rehypePlugins: [rehypeSlug, extractToc, [withTocExport, { name: 'toc' }]],
+		remarkPlugins: []
 	}
+
+	if (state.GFM_ENABLED) {
+		baseMdxConfig.remarkPlugins.push(remarkGfm)
+	}
+
 	const mdxConfig = { ...baseMdxConfig, ...userMdxConfig }
 	const userRehypePlugins = Array.isArray(userMdxConfig.rehypePlugins) ? userMdxConfig.rehypePlugins : []
 	mdxConfig.rehypePlugins = [...baseMdxConfig.rehypePlugins, ...userRehypePlugins]
+
+	const userRemarkPlugins = Array.isArray(userMdxConfig.remarkPlugins) ? userMdxConfig.remarkPlugins : []
+	mdxConfig.remarkPlugins = [...baseMdxConfig.remarkPlugins, ...userRemarkPlugins]
+
 	mdxConfig.rehypePlugins.push(linkResolve)
 	mdxConfig.rehypePlugins.push(methanolCtx)
 	return (cachedMdxConfig = mdxConfig)

package/src/pagefind.js

@@ -22,7 +22,9 @@ import { access } from 'fs/promises'
 import { constants } from 'fs'
 import { join, delimiter } from 'path'
 import { spawn } from 'child_process'
-import { state } from './state.js'
+import { state, cli } from './state.js'
+import { createStageLogger } from './stage-logger.js'
+import { logger } from './logger.js'
 
 const resolvePagefindBin = async () => {
 	const binName = process.platform === 'win32' ? 'pagefind.cmd' : 'pagefind'
@@ -92,16 +94,25 @@ const runCommand = (command, args, options) =>
 export const runPagefind = async () => {
 	const bin = await resolvePagefindBin()
 	if (!bin) {
-		console.log('Pagefind not found; skipping search indexing.')
+		logger.warn('Pagefind not found; skipping search indexing.')
 		return false
 	}
-	console.log('Running Pagefind search indexing...')
+	const logEnabled = state.CURRENT_MODE === 'production' && cli.command === 'build' && !cli.CLI_VERBOSE
+	const stageLogger = createStageLogger(logEnabled)
+	const token = stageLogger.start('Indexing search')
+
+	if (cli.CLI_VERBOSE) {
+		logger.info('Running Pagefind search indexing...')
+	}
+
 	const extraArgs = buildArgsFromOptions(state.PAGEFIND_BUILD)
 	const ok = await runCommand(bin, ['--site', state.DIST_DIR, ...extraArgs], {
-		cwd: state.PROJECT_ROOT
+		cwd: state.PROJECT_ROOT,
+		stdio: cli.CLI_VERBOSE ? 'inherit' : 'ignore'
 	})
 	if (!ok) {
-		console.warn('Pagefind failed to build search index.')
+		logger.warn('Pagefind failed to build search index.')
 	}
+	stageLogger.end(token)
 	return ok
 }

package/src/stage-logger.js

@@ -18,6 +18,8 @@
  * under the License.
  */
 
+import { style } from './logger.js'
+
 const now = () => (typeof performance !== 'undefined' ? performance.now() : Date.now())
 
 export const createStageLogger = (enabled) => {
@@ -43,17 +45,18 @@ export const createStageLogger = (enabled) => {
 	}
 	const start = (label) => {
 		if (!enabled) return null
-		writeLine(`${label}...`, false)
+		writeLine(`${style.cyan('◼')}  ${label}...`, false)
 		return { label, start: now() }
 	}
 	const update = (token, message) => {
 		if (!enabled || !token || !message) return
-		writeLine(message, false)
+		writeLine(`${style.cyan('◼')}  ${message}`, false)
 	}
 	const end = (token) => {
 		if (!enabled || !token) return
-		const duration = Math.round(now() - token.start)
-		writeLine(`${token.label}...\t${duration}ms`, true)
+		const duration = now() - token.start
+		const timeString = duration > 1000 ? `${(duration / 1000).toFixed(2)}s` : `${Math.round(duration)}ms`
+		writeLine(`${style.green('✔')}  ${token.label}\t${style.dim(timeString)}`, true)
 	}
 	return { start, update, end }
 }

package/src/state.js

@@ -103,10 +103,9 @@ const withCommonOptions = (y) =>
 		})
 		.option('code-highlighting', {
 			describe: 'Enable or disable code highlighting',
-			type: 'string',
+			type: 'boolean',
 			coerce: (value) => {
 				if (value == null) return null
-				if (value === true || value === '') return true
 				if (typeof value === 'boolean') return value
 				const normalized = String(value).trim().toLowerCase()
 				if (normalized === 'true') return true
@@ -114,6 +113,18 @@ const withCommonOptions = (y) =>
 				return null
 			}
 		})
+		.option('verbose', {
+			alias: 'v',
+			describe: 'Enable verbose output',
+			type: 'boolean',
+			default: false
+		})
+		.option('base', {
+			describe: 'Base URL override',
+			type: 'string',
+			requiresArg: true,
+			nargs: 1
+		})
 
 const parser = yargs(hideBin(process.argv))
 	.scriptName('methanol')
@@ -141,7 +152,9 @@ export const cli = {
 	CLI_OUTPUT_DIR: argv.output || null,
 	CLI_CONFIG_PATH: argv.config || null,
 	CLI_SITE_NAME: argv['site-name'] || null,
-	CLI_CODE_HIGHLIGHTING: typeof argv['code-highlighting'] === 'boolean' ? argv['code-highlighting'] : null
+	CLI_CODE_HIGHLIGHTING: typeof argv['code-highlighting'] === 'boolean' ? argv['code-highlighting'] : null,
+	CLI_VERBOSE: Boolean(argv.verbose),
+	CLI_BASE: argv.base || null
 }
 
 export const state = {
@@ -180,6 +193,7 @@ export const state = {
 	THEME_POST_BUNDLE_HOOKS: [],
 	STARRY_NIGHT_ENABLED: false,
 	STARRY_NIGHT_OPTIONS: null,
+	GFM_ENABLED: true,
 	CURRENT_MODE: 'production',
 	RESOLVED_MDX_CONFIG: undefined,
 	RESOLVED_VITE_CONFIG: undefined

package/themes/default/sources/style.css

@@ -1735,6 +1735,47 @@ a {
 	justify-content: flex-end;
 }
 
+/* --- Tables (GFM) --- */
+
+.main-content table {
+	width: 100%;
+	border-collapse: collapse;
+	margin: 1.5rem 0;
+	font-size: 0.95rem;
+	overflow-x: auto;
+	display: block; /* Enables horizontal scroll for large tables */
+}
+
+.main-content table thead tr {
+	border-bottom: 2px solid var(--border);
+}
+
+.main-content table th {
+	text-align: left;
+	padding: 0.75rem 1rem;
+	font-weight: 600;
+	color: var(--text);
+	white-space: nowrap;
+}
+
+.main-content table tbody tr {
+	border-bottom: 1px solid var(--border);
+	transition: background-color 0.1s ease;
+}
+
+.main-content table tbody tr:last-child {
+	border-bottom: none;
+}
+
+.main-content table td {
+	padding: 0.75rem 1rem;
+	color: var(--muted);
+}
+
+.main-content table tbody tr:hover {
+	background-color: var(--hover-bg);
+}
+
 /* --- View Transitions --- */
 
 @view-transition {
@@ -1747,3 +1788,151 @@ a {
 	view-transition-name: active-sidebar-bg;
 	contain: layout paint;
 }
+
+/* --- Print Styles --- */
+
+@media print {
+	:root {
+		--bg: #ffffff;
+		--surface: #ffffff;
+		--surface-muted: #f4f4f5;
+		--surface-elevated: #ffffff;
+		--text: #09090b;
+		--muted: #52525b;
+		--border: #e4e4e7;
+		--accent: #000000;
+		--accent-soft: #f4f4f5;
+		--hover-bg: transparent;
+	}
+
+	body {
+		background-color: white !important;
+		background-image: none !important;
+		color: black !important;
+		width: 100% !important;
+		margin: 0 !important;
+		padding: 0 !important;
+		overflow: visible !important;
+	}
+
+	/* Hide UI Elements */
+	.sidebar,
+	.toc-panel,
+	.nav-toggle-label,
+	.toc-toggle-label,
+	.search-toggle-label,
+	.search-modal,
+	.page-nav,
+	.copy-btn,
+	.heading-anchor,
+	.theme-switch-wrapper,
+	.lang-switch-wrapper,
+	.page-meta {
+		display: none !important;
+	}
+
+	/* Layout Overrides */
+	.layout-container,
+	.layout-container.no-toc {
+		display: block !important;
+		max-width: none !important;
+		width: 100% !important;
+		margin: 0 !important;
+		padding: 0 !important;
+	}
+
+	.main-content {
+		padding: 0 !important;
+		width: 100% !important;
+		max-width: none !important;
+	}
+
+	/* Typography & Content */
+	body {
+		font-size: 11pt !important;
+		line-height: 1.5 !important;
+	}
+
+	.main-content {
+		h1 {
+			font-size: 24pt !important;
+			margin-bottom: 1rem !important;
+		}
+
+		h2 {
+			font-size: 18pt !important;
+			margin-top: 1.5rem !important;
+			margin-bottom: 0.75rem !important;
+		}
+
+		h3 {
+			font-size: 14pt !important;
+			margin-top: 1.25rem !important;
+			margin-bottom: 0.5rem !important;
+		}
+
+		p, li {
+			font-size: 11pt !important;
+			margin-bottom: 0.75rem !important;
+		}
+
+		pre, code {
+			font-size: 10pt !important;
+		}
+	}
+
+	h1, h2, h3, h4, h5, h6 {
+		color: black !important;
+		page-break-after: avoid;
+		break-after: avoid;
+	}
+
+	h2 {
+		border-bottom: 1px solid #000 !important;
+	}
+
+	p, li {
+		orphans: 3;
+		widows: 3;
+	}
+
+	a {
+		text-decoration: underline !important;
+		color: black !important;
+	}
+
+	/* Expand external links */
+	a[href^="http"]::after {
+		content: " (" attr(href) ")";
+		font-size: 0.85em;
+		color: #555;
+	}
+
+	/* Clean up code blocks */
+	pre {
+		border: 1px solid #ccc !important;
+		white-space: pre-wrap !important;
+		break-inside: avoid;
+		background: #fafafa !important;
+	}
+
+	/* Blockquotes */
+	blockquote {
+		border-left: 3px solid #ccc !important;
+		background: transparent !important;
+		color: #333 !important;
+		break-inside: avoid;
+	}
+
+	/* Tables */
+	table {
+		break-inside: avoid;
+	}
+
+	/* Page Setup */
+	@page {
+		margin: 2cm;
+		size: auto;
+	}
+}
+