methanol 0.0.0 → 0.0.2

package/src/state.js

@@ -0,0 +1,179 @@
+/* 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.
+ */
+
+import { resolve } from 'path'
+import yargs from 'yargs/yargs'
+import { hideBin } from 'yargs/helpers'
+
+const PROJECT_ROOT = resolve('.')
+
+const withCommonOptions = (y) =>
+	y
+		.positional('input', {
+			describe: 'Pages directory',
+			type: 'string',
+			nargs: 1
+		})
+		.positional('output', {
+			describe: 'Output directory',
+			type: 'string',
+			nargs: 1
+		})
+		.option('input', {
+			alias: 'i',
+			describe: 'Pages directory',
+			type: 'string',
+			requiresArg: true,
+			nargs: 1
+		})
+		.option('components', {
+			describe: 'Components directory',
+			type: 'string',
+			requiresArg: true,
+			nargs: 1
+		})
+		.option('assets', {
+			describe: 'Assets/public directory',
+			type: 'string',
+			requiresArg: true,
+			nargs: 1
+		})
+		.option('output', {
+			alias: 'o',
+			describe: 'Output directory',
+			type: 'string',
+			requiresArg: true,
+			nargs: 1
+		})
+		.option('config', {
+			alias: 'c',
+			describe: 'Config file path',
+			type: 'string',
+			requiresArg: true,
+			nargs: 1
+		})
+		.option('site-name', {
+			describe: 'Site name override',
+			type: 'string',
+			requiresArg: true,
+			nargs: 1
+		})
+		.option('port', {
+			describe: 'Port for dev/preview',
+			type: 'number',
+			requiresArg: true,
+			nargs: 1
+		})
+		.option('host', {
+			describe: 'Host for dev/preview',
+			type: 'string',
+			coerce: (value) => {
+				if (value == null) return null
+				if (value === true || value === '' || value === 'true') return true
+				return value
+			}
+		})
+		.option('intermediate-dir', {
+			describe: 'Write intermediate HTML output to a directory',
+			type: 'string',
+			requiresArg: true,
+			nargs: 1
+		})
+		.option('emit-intermediate', {
+			describe: 'Emit intermediate HTML output to the default build dir',
+			type: 'boolean',
+			default: false
+		})
+		.option('code-highlighting', {
+			describe: 'Enable or disable code highlighting',
+			type: 'string',
+			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
+				if (normalized === 'false') return false
+				return null
+			}
+		})
+
+const parser = yargs(hideBin(process.argv))
+	.scriptName('methanol')
+	.usage('Usage: $0 <command> [options]')
+	.command('dev [input]', 'Start the Methanol dev server', withCommonOptions)
+	.command('build [input] [output]', 'Build the static site', withCommonOptions)
+	.command('serve [input] [output]', 'Serve the production build', withCommonOptions)
+	.command('preview [input] [output]', false, withCommonOptions)
+	.help()
+	.wrap(null)
+
+const argv = parser.parseSync()
+
+export const cli = {
+	argv,
+	command: argv._[0] ? String(argv._[0]) : null,
+	showHelp: () => parser.showHelp(),
+	CLI_INTERMEDIATE_DIR: argv['intermediate-dir'] || null,
+	CLI_EMIT_INTERMEDIATE: Boolean(argv['emit-intermediate']),
+	CLI_HOST: argv.host ?? null,
+	CLI_PORT: typeof argv.port === 'number' ? argv.port : null,
+	CLI_PAGES_DIR: argv.input || null,
+	CLI_COMPONENTS_DIR: argv.components || null,
+	CLI_ASSETS_DIR: argv.assets || null,
+	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
+}
+
+export const state = {
+	PROJECT_ROOT,
+	ROOT_DIR: PROJECT_ROOT,
+	SITE_NAME: 'Methanol Site',
+	PAGES_DIR: resolve(PROJECT_ROOT, 'pages'),
+	COMPONENTS_DIR: resolve(PROJECT_ROOT, 'components'),
+	STATIC_DIR: resolve(PROJECT_ROOT, 'public'),
+	BUILD_DIR: resolve(PROJECT_ROOT, 'build'),
+	DIST_DIR: resolve(PROJECT_ROOT, 'dist'),
+	VIRTUAL_HTML_OUTPUT_ROOT: PROJECT_ROOT,
+	INTERMEDIATE_DIR: null,
+	THEME_COMPONENTS_DIR: null,
+	THEME_PAGES_DIR: null,
+	THEME_PUBLIC_DIR: null,
+	THEME_ENV: null,
+	USER_THEME: null,
+	USER_VITE_CONFIG: null,
+	USER_MDX_CONFIG: null,
+	USER_PUBLIC_OVERRIDE: false,
+	SOURCES: [],
+	PAGEFIND_ENABLED: false,
+	PAGEFIND_OPTIONS: null,
+	PAGEFIND_BUILD: null,
+	USER_PRE_BUILD_HOOKS: [],
+	USER_POST_BUILD_HOOKS: [],
+	THEME_PRE_BUILD_HOOKS: [],
+	THEME_POST_BUILD_HOOKS: [],
+	STARRY_NIGHT_ENABLED: false,
+	STARRY_NIGHT_OPTIONS: null,
+	CURRENT_MODE: 'production',
+	RESOLVED_MDX_CONFIG: undefined,
+	RESOLVED_VITE_CONFIG: undefined
+}

package/src/virtual-module/inject.js

@@ -0,0 +1,30 @@
+/* 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.
+ */
+
+import { createDOMRenderer } from 'refui/dom'
+import { defaults } from 'refui/browser'
+import { lazy } from 'refui'
+import { init } from '/.methanol_virtual_module/loader.js'
+
+const reg = import('/.methanol_virtual_module/registry.js')
+
+const R = createDOMRenderer(defaults)
+
+reg.then((m) => init(m.registry, R))

package/src/virtual-module/loader.js

@@ -0,0 +1,116 @@
+/* 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.
+ */
+
+export function init(registry, R) {
+	if (!registry) return
+
+	async function $$rwnd(key, id, props, target = document.currentScript) {
+		const loader = registry[key]
+
+		if (!loader) {
+			target.remove()
+			return
+		}
+
+		const renderer = (await loader()).default
+
+		if (!renderer) {
+			if (process.env.NODE_ENV !== 'production') {
+				throw new Error(`[REWiND] Hydration failed! Component '${key}' does not export \`default\`!`)
+			}
+
+			return
+		}
+
+		const findRewindAnchor = (node, token) => {
+			const marker = `{${token}}`
+			let current = node
+			while (current) {
+				let cursor = current.previousSibling
+				while (cursor) {
+					if (cursor.nodeType === 8 && cursor.nodeValue === marker) {
+						return cursor
+					}
+					cursor = cursor.previousSibling
+				}
+				current = current.parentNode
+			}
+			return null
+		}
+
+		const collectChildren = (fragment, token) => {
+			const startMarker = `[${token}[`
+			const endMarker = `]${token}]`
+			const walker = document.createTreeWalker(
+				fragment,
+				NodeFilter.SHOW_COMMENT,
+				null,
+			)
+			let start = null
+			let end = null
+			while (walker.nextNode()) {
+				const value = walker.currentNode.nodeValue
+				if (!start && value === startMarker) {
+					start = walker.currentNode
+					continue
+				}
+				if (start && value === endMarker) {
+					end = walker.currentNode
+					break
+				}
+			}
+			if (!start || !end) return []
+			const range = document.createRange()
+			range.setStartAfter(start)
+			range.setEndBefore(end)
+			const childrenFragment = range.extractContents()
+			return Array.from(childrenFragment.childNodes)
+		}
+
+		const idStr = id.toString(16)
+
+		const anchor = findRewindAnchor(target, idStr)
+		if (!anchor || !anchor.parentNode) {
+			target.replaceWith(R.c(renderer, props))
+			return
+		}
+
+		const range = document.createRange()
+		range.setStartAfter(anchor)
+		range.setEndBefore(target)
+		const between = range.extractContents()
+		const children = collectChildren(between, idStr)
+		const rendered = R.c(renderer, props, ...children)
+		target.replaceWith(rendered)
+		anchor.remove()
+	}
+
+	let loaded = []
+	if (window.$$rwnd) {
+		loaded = window.$$rwnd.$$loaded
+	}
+	window.$$rwnd = $$rwnd
+
+	if (loaded) {
+		for (let i = 0; i < loaded.length; i++) {
+			$$rwnd.apply(null, loaded[i])
+		}
+	}
+}

package/src/virtual-module/pagefind.js

@@ -0,0 +1,108 @@
+/* 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.
+ */
+
+let pagefindInit = null
+let pagefindUiInit = null
+let pagefindUiReady = false
+
+const dynamicImport = (path) => {
+	try {
+		const importer = new Function('p', 'return import(p)')
+		return importer(path)
+	} catch {
+		return import(/* @vite-ignore */path)
+	}
+}
+
+export const loadPagefind = async () => {
+	if (pagefindInit) return pagefindInit
+	pagefindInit = new Promise((resolve) => {
+		if (typeof window === 'undefined') {
+			resolve(null)
+			return
+		}
+		dynamicImport('/pagefind/pagefind.js')
+			.then((mod) => {
+				if (!mod) return resolve(null)
+				if (mod.search) return resolve(mod)
+				if (mod.default?.search) return resolve(mod.default)
+				return resolve(mod.default || mod)
+			})
+			.catch(() => resolve(null))
+	})
+	return pagefindInit
+}
+
+const defaultUiOptions = {
+	element: '#pagefind-ui',
+	showImages: false,
+	resetStyles: false
+}
+
+const resolveTarget = (element) => {
+	if (!element) return null
+	if (typeof element === 'string') {
+		return document.querySelector(element)
+	}
+	return element
+}
+
+const initPagefindUI = (options) => {
+	const PagefindUI = window.PagefindUI
+	if (!PagefindUI) return false
+	const merged = { ...defaultUiOptions, ...(options || {}) }
+	const target = resolveTarget(merged.element)
+	if (!target) return false
+	new PagefindUI(merged)
+	pagefindUiReady = true
+	return true
+}
+
+export const loadPagefindUI = async (options = {}) => {
+	if (pagefindUiReady) return true
+	if (pagefindUiInit) return pagefindUiInit
+	pagefindUiInit = new Promise((resolve) => {
+		if (typeof window === 'undefined') {
+			resolve(false)
+			return
+		}
+		const done = (value) => resolve(Boolean(value))
+		if (window.PagefindUI) {
+			done(initPagefindUI(options))
+			return
+		}
+		const script = document.createElement('script')
+		script.src = '/pagefind/pagefind-ui.js'
+		script.async = true
+		script.onload = () => done(initPagefindUI(options))
+		script.onerror = () => done(false)
+		document.head.appendChild(script)
+	})
+	return pagefindUiInit
+}
+
+export const focusPagefindInput = () => {
+	if (typeof document === 'undefined') return
+	const input =
+		document.querySelector('#pagefind-ui input[type="search"]') || document.querySelector('#pagefind-ui input')
+	if (input) {
+		input.focus()
+	}
+}

package/src/vite-plugins.js

@@ -0,0 +1,173 @@
+/* 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.
+ */
+
+import { createRequire } from 'node:module'
+import { readFile } from 'node:fs/promises'
+import { existsSync } from 'node:fs'
+import { resolve } from 'node:path'
+import { normalizePath } from 'vite'
+import { state } from './state.js'
+import { genRegistryScript } from './components.js'
+import { INJECT_SCRIPT, LOADER_SCRIPT, PAGEFIND_SCRIPT } from './assets.js'
+import { projectRequire } from './node-loader.js'
+
+const require = createRequire(import.meta.url)
+
+export const methanolVirtualHtmlPlugin = (htmlCache) => {
+	const prefix = normalizePath(state.VIRTUAL_HTML_OUTPUT_ROOT + '/')
+	return {
+		name: 'methanol-virtual-html',
+		resolveId(id) {
+			const normalized = normalizePath(id)
+			if (normalized.startsWith(prefix) && htmlCache.has(normalized)) {
+				return normalized
+			}
+		},
+		load(id) {
+			const normalized = normalizePath(id)
+			if (normalized.startsWith(prefix) && htmlCache.has(normalized)) {
+				return htmlCache.get(normalized) ?? null
+			}
+		}
+	}
+}
+
+export const methanolPreviewRoutingPlugin = (distDir, notFoundPath) => ({
+	name: 'methanol-preview-routing',
+	configurePreviewServer(server) {
+		return () => {
+			let cachedHtml = null
+			const loadNotFoundHtml = async () => {
+				if (!existsSync(notFoundPath)) return null
+				if (cachedHtml != null) return cachedHtml
+				cachedHtml = await readFile(notFoundPath, 'utf-8')
+				return cachedHtml
+			}
+			const handler = async (req, res, next) => {
+				if (!req.url || req.method !== 'GET') {
+					return next()
+				}
+				const accept = req.headers.accept || ''
+				let pathname = req.url
+				try {
+					pathname = new URL(req.url, 'http://methanol').pathname
+					pathname = decodeURIComponent(pathname)
+				} catch {}
+				const hasTrailingSlash = pathname.endsWith('/') && pathname !== '/'
+				if (pathname.includes('.') && !pathname.endsWith('.html')) {
+					return next()
+				}
+				if (!pathname.endsWith('.html') && !accept.includes('text/html')) {
+					return next()
+				}
+				const resolveHtmlPath = (value) => resolve(distDir, value.replace(/^\//, ''))
+				const candidates = []
+				if (pathname === '/' || pathname === '') {
+					candidates.push(resolveHtmlPath('/index.html'))
+				} else if (pathname.endsWith('.html')) {
+					candidates.push(resolveHtmlPath(pathname))
+				} else {
+					candidates.push(resolveHtmlPath(`${pathname}.html`))
+					candidates.push(resolveHtmlPath(`${pathname}/index.html`))
+				}
+				if (candidates.some((candidate) => existsSync(candidate))) {
+					return next()
+				}
+				const html = await loadNotFoundHtml()
+				if (!html) {
+					return next()
+				}
+				res.statusCode = 404
+				res.setHeader('Content-Type', 'text/html')
+				res.end(html)
+			}
+			if (Array.isArray(server.middlewares.stack)) {
+				server.middlewares.stack.unshift({ route: '', handle: handler })
+			} else {
+				server.middlewares.use(handler)
+			}
+		}
+	}
+})
+
+const virtualModulePrefix = '/.methanol_virtual_module/'
+const resolvedVirtualModulePrefix = '\0' + virtualModulePrefix
+
+const virtualModuleMap = {
+	get 'registry.js'() {
+		return `export const registry = ${genRegistryScript()}`
+	},
+	'loader.js': LOADER_SCRIPT,
+	'inject.js': INJECT_SCRIPT,
+	'pagefind.js': PAGEFIND_SCRIPT
+}
+
+const getModuleIdSegment = (id, start) => {
+	return new URL(id.slice(start), 'http://methanol').pathname.slice(1)
+}
+
+export const methanolResolverPlugin = () => {
+	return {
+		name: 'methanol-resolver',
+		resolveId(id) {
+			if (id === 'refui' || id.startsWith('refui/')) {
+				try {
+					return projectRequire.resolve(id)
+				} catch {
+					return require.resolve(id)
+				}
+			}
+
+			if (id === 'methanol' || id.startsWith('methanol/')) {
+				return require.resolve(id)
+			}
+
+			if (id.startsWith(virtualModulePrefix)) {
+				const _moduleId = getModuleIdSegment(id, virtualModulePrefix.length)
+				if (Object.prototype.hasOwnProperty.call(virtualModuleMap, _moduleId)) {
+					return '\0' + id
+				}
+			}
+
+			if (state.SOURCES.length) {
+				const { pathname, search } = new URL(id, 'http://methanol')
+				for (const entry of state.SOURCES) {
+					const { find, replacement } = entry
+					if (!find || !replacement) continue
+					if (typeof find === 'string') {
+						if (pathname === find || pathname.startsWith(`${find}/`)) {
+							return `${replacement}${pathname.slice(find.length)}${search}`
+						}
+						continue
+					}
+					if (find instanceof RegExp && find.test(pathname)) {
+						return `${pathname.replace(find, replacement)}${search}`
+					}
+				}
+			}
+		},
+		load(id) {
+			if (id.startsWith(resolvedVirtualModulePrefix)) {
+				const _moduleId = getModuleIdSegment(id, resolvedVirtualModulePrefix.length)
+				return virtualModuleMap[_moduleId]
+			}
+		}
+	}
+}

package/themes/default/components/ThemeAccentSwitch.client.jsx

@@ -0,0 +1,95 @@
+/* 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.
+ */
+
+import { signal, $ } from 'refui'
+
+const ACCENTS = [
+	{ id: 'default', label: 'Amber', color: '#ffa000' },
+	{ id: 'rose', label: 'Rose', color: '#f43f5e' },
+	{ id: 'blue', label: 'Indigo', color: '#818cf8' },
+	{ id: 'green', label: 'Teal', color: '#2dd4bf' },
+	{ id: 'purple', label: 'Violet', color: '#a78bfa' }
+]
+
+export default function () {
+	const currentAccent = signal('default')
+	const isOpen = signal(false)
+
+	// Initialize theme from localStorage
+	if (typeof window !== 'undefined') {
+		const saved = localStorage.getItem('methanol-accent')
+		if (saved && ACCENTS.some((a) => a.id === saved)) {
+			currentAccent.value = saved
+			if (saved !== 'default') {
+				document.documentElement.classList.add(`accent-${saved}`)
+			}
+		}
+
+		// Close popup when clicking outside
+		document.addEventListener('click', (e) => {
+			if (!e.target.closest('.theme-switch-wrapper')) {
+				isOpen.value = false
+			}
+		})
+	}
+
+	const setAccent = (id) => {
+		const oldId = currentAccent.value
+
+		// Remove old
+		if (oldId !== 'default') {
+			document.documentElement.classList.remove(`accent-${oldId}`)
+		}
+
+		// Add new
+		if (id !== 'default') {
+			document.documentElement.classList.add(`accent-${id}`)
+		}
+
+		currentAccent.value = id
+		localStorage.setItem('methanol-accent', id)
+		isOpen.value = false
+	}
+
+	const togglePopup = () => {
+		isOpen.value = !isOpen.value
+	}
+
+	return (
+		<div class="theme-switch-container">
+			<div class="theme-switch-wrapper">
+				<div class={$(() => `accent-popup ${isOpen.value ? 'open' : ''}`)}>
+					{ACCENTS.map((accent) => (
+						<button
+							class={$(() => `accent-option ${currentAccent.value === accent.id ? 'active' : ''}`)}
+							on:click={() => setAccent(accent.id)}
+						>
+							<span class="option-circle" style={`background-color: ${accent.color}`}></span>
+							{accent.label}
+						</button>
+					))}
+				</div>
+				<button class="theme-switch-btn" on:click={togglePopup} attr:aria-label="Select accent color">
+					<div class="accent-circle"></div>
+				</button>
+			</div>
+		</div>
+	)
+}