marksites 0.1.0 → 0.2.1

package/README.md

@@ -25,11 +25,11 @@ const html = markdownToHtml(markdown, {
 });
 ```
 
-見出しレベル2から6までの目次と、GitHub互換の見出しアンカーが自動生成されます。ファイルツリーはGitHubのFilesペインと同様、画面左端へ接する全高のサイドバーとして常時表示し、本文を中央、`目次`とコメントを画面右側へ配置します。左サイドバーはヘッダーの四角いペインアイコンで折り畳むことができ、閉じると本文が左へ広がります。閉じた場合はページ上部に同形の復帰アイコンと、従来どおりポップオーバーでファイル一覧を開く`ファイル`ボタンを並べます。サイドバーの閉状態は`file-sidebar=closed`、ポップオーバーは`marksites-files=open`、開いたフォルダは短縮IDを値とする`open` GETパラメータでページ間に引き継がれます。ファイルパス直後のアイコンでパスをコピーでき、右端にはMarkdownの更新日時をブラウザのローカルタイムゾーンで`YYYY-MM-DD HH:mm:ss`形式にして表示します。タイムゾーン名やUTCオフセットは表示しません。JavaScript実行前はUTCの日時を同じ形式で表示します。現在位置に対応する見出しもハイライトされます。狭い画面では右サイドバーを本文上部、ファイルサイドバーを必要なときだけ開く固定オーバーレイとして表示します。
+見出しレベル2から6までの目次と、GitHub互換の見出しアンカーが自動生成されます。ファイルツリーはGitHubのFilesペインと同様、画面左端へ接する全高のサイドバーとして常時表示し、本文を中央、`目次`とコメントを画面右側へ配置します。ファイル一覧は階層ツリーと更新順を切り替えられ、更新順ではMarkdownのローカルファイル更新日時（mtime）を新しい順に日付でまとめ、時刻を左側の固定幅列、濃い色・太字のファイル名とフォルダアイコン付きの親ディレクトリをその右の2段表示にします。親ディレクトリは変換ルートを`/`、配下を`/src/`のように表示します。同じ日付で同一フォルダのファイルが2件以上連続する場合は、ルート直下を含め、更新順を変えずにフォルダ見出しへまとめます。日付見出しではファイル件数を確認でき、クリックで折り畳めます。初期状態では最新日と現在ファイルを含む日を開き、検索中は一致する日を一時的に展開します。完全な相対パスは各行のツールチップでも確認できます。左サイドバーはヘッダーの四角いペインアイコンで折り畳むことができ、閉じると本文が左へ広がります。閉じた場合はページ上部に同形の復帰アイコンと、従来どおりポップオーバーでファイル一覧を開く`ファイル`ボタンを並べます。サイドバーの閉状態は`file-sidebar=closed`、ポップオーバーは`marksites-files=open`、更新順表示は`file-view=recent`、開いたフォルダは短縮IDを値とする`open` GETパラメータでページ間に引き継がれます。ファイルパス直後のアイコンでパスをコピーできます。Markdownの更新日時は本文カード上部で、ブラウザのローカルタイムゾーンを使った`YYYY-MM-DD HH:mm:ss`形式にして表示します。タイムゾーン名やUTCオフセットは表示しません。JavaScript実行前はUTCの日時を同じ形式で表示します。現在位置に対応する見出しもハイライトされます。狭い画面では右サイドバーを本文上部、ファイルサイドバーを必要なときだけ開く固定オーバーレイとして表示します。
 
-左ファイルサイドバーは幅280pxとし、開閉アイコンは枠線なしで表示します。
+左ファイルサイドバーは幅280pxとし、開閉アイコンは枠線なしで表示します。更新日時は本文カード上部へ表示します。
 
-画面上端には固定ヘッダーを表示します。右上の月・太陽アイコンでライト／ダークモードを切り替え、地球アイコンで生成UIの日本語／英語を切り替えます。Markdown本文、見出し、ファイル名、コメント本文は翻訳対象にしません。選択状態は`theme`と`lang` GETパラメータでページ間に引き継がれます。
+画面上端には固定ヘッダーを表示します。濃色背景と白文字の`marksites`ロゴ、その右に現在のファイルパスを表示します。ファイルパスから開くポップオーバーは左ファイルサイドバーを閉じている場合だけ利用できます。ブラウザのタブ名は`marksites | <ファイル名>`形式です。本文カードは更新日時の下からMarkdown本文を開始します。右上の月・太陽アイコンでライト／ダークモードを切り替え、地球アイコンで生成UIの日本語／英語を切り替えます。Markdown本文、見出し、ファイル名、コメント本文は翻訳対象にしません。選択状態は`theme`と`lang` GETパラメータでページ間に引き継がれます。
 
 ```ts
 const html = markdownToHtml(markdown, {
@@ -74,7 +74,9 @@ npx marksites
 
 単一Markdownの出力先を省略した場合も、`./marksites/`へ同じbasenameのHTMLを保存します。
 
-フォルダを指定すると、配下の `.md` と `.markdown` を再帰的に変換します。出力先でも元のフォルダ階層を維持し、各ページの左側にファイル名で絞り込めるファイルツリー、本文上部に現在のファイルパスを示すパンくずを表示します。コメントが1件以上あるファイルには件数バッジを表示し、上位フォルダには配下の有効コメント合計件数を表示します。Markdownファイル間の相対リンクは `.html` へ書き換えられます。
+フォルダを指定すると、配下の `.md` と `.markdown` を再帰的に変換します。出力先でも元のフォルダ階層を維持し、各ページの左側にファイル名で絞り込めるファイルツリーと相対パスで検索できる更新順一覧、固定ヘッダーに現在のファイルパスを示すパンくずを表示します。コメントが1件以上あるファイルには件数バッジを表示し、上位フォルダには配下の有効コメント合計件数を表示します。Markdownファイル間の相対リンクは `.html` へ書き換えられます。
+
+相対パスで参照したローカル画像は、内容ハッシュ付きの名前で出力先の`_marksites-assets/`へコピーされます。同名画像の衝突を避け、画像変更時は参照するHTMLだけを更新します。外部URL、data URL、ルート相対URLはそのまま保持します。本文画像をクリックすると全画面ビューアーが開き、ボタンまたはホイールで拡大・縮小でき、ドラッグで位置を移動できます。Escapeまたは右上の閉じるボタンで閉じます。
 
 ```sh
 npx marksites docs public
@@ -113,7 +115,16 @@ npx marksites serve
 
 `--host`、`--port`、`--open`を指定できます。ポートを省略すると3000を使用し、すでに使用中なら3001、3002の順に空きポートを自動選択します。`--port`を明示した場合は指定ポートだけを使用し、競合時はエラーになります。`--port 0`ではOSに空きポートを割り当てさせることもできます。実際のURLは起動時に表示され、`--open`もそのURLを開きます。
 
-サーバーは起動時に差分変換を行い、アイドル中のファイル監視や定期処理は行いません。停止後もコメントはHTMLへ埋め込まれているため、生成HTMLを`file://`で閲覧できます。この場合、コメントは閲覧専用です。
+ディレクトリ変換または`serve`へ`--watch`を付けると、Markdownや参照画像の変更を検知して差分変換します。Markdownの新規追加や削除、新しいサブディレクトリにも対応します。
+
+`--verbose`を付けると、文書ごとの変換・スキップ結果を表示します。`--watch`と併用した場合は、検知したイベント種別・対象パスと再変換の開始も表示します。
+
+```sh
+npx marksites docs public/docs --watch
+npx marksites serve docs public/docs --port 4000 --watch --verbose
+```
+
+サーバーは起動時に差分変換を行い、`--watch`指定時だけイベント駆動で入力を監視します。ポーリングや常駐文書キャッシュは使用しません。停止後もコメントはHTMLへ埋め込まれているため、生成HTMLを`file://`で閲覧できます。この場合、コメントは閲覧専用です。
 
 `--open`はWindows、macOS、Linuxに加えてWSLからWindows側のブラウザを開く処理にも対応します。ブラウザ起動コマンドが見つからない場合もサーバーは停止せず、表示されたURLを手動で開けます。
 
@@ -146,6 +157,8 @@ Viteを使用する場合は、`next build` を `vite build` に置き換えま
 
 ## 開発
 
+依存パッケージは、未確認の新バージョンを自動取得しないよう`latest`を使用せず、検証済みバージョンを`package.json`と`package-lock.json`へ記録します。更新時はバージョンを明示的に変更し、テストを実行します。
+
 ```sh
 npm test
 ```

package/dist/cli.js

@@ -7,8 +7,9 @@ import { convertFile } from "./conversion/single-file.js";
 import { MARKSITES_RESERVED_PATH } from "./server/constants.js";
 import { startMarksitesServer } from "./server/server.js";
 import { openBrowser } from "./cli/open-browser.js";
+import { watchConversionInput } from "./conversion/watch.js";
 function usage() {
-    console.error("Usage:\n  marksites [input.md|input-directory] [output.html|output-directory]\n  marksites serve [input-directory] [output-directory] [--host HOST] [--port PORT] [--open]");
+    console.error("Usage:\n  marksites [input.md|input-directory] [output.html|output-directory] [--watch] [--verbose]\n  marksites serve [input-directory] [output-directory] [--host HOST] [--port PORT] [--open] [--watch] [--verbose]");
     process.exit(1);
 }
 function report(result) {
@@ -19,12 +20,22 @@ function report(result) {
 async function serve(args) {
     const positional = [];
     let host = "127.0.0.1", port, shouldOpen = false;
+    let shouldWatch = false;
+    let verbose = false;
     for (let index = 0; index < args.length; index++) {
         const argument = args[index];
         if (argument === "--open") {
             shouldOpen = true;
             continue;
         }
+        if (argument === "--watch") {
+            shouldWatch = true;
+            continue;
+        }
+        if (argument === "--verbose") {
+            verbose = true;
+            continue;
+        }
         if (argument === "--host" || argument === "--port") {
             const value = args[++index];
             if (!value)
@@ -48,7 +59,10 @@ async function serve(args) {
     const input = resolve(inputArgument);
     if (!(await stat(input)).isDirectory())
         throw new Error(`serve input must be a directory: ${inputArgument}`);
-    const initial = await convertDirectoryDetailed(input, positional[1]);
+    const conversionOptions = {
+        onLog: verbose ? (message) => console.log(message) : undefined,
+    };
+    const initial = await convertDirectoryDetailed(input, positional[1], conversionOptions);
     report(initial);
     const output = initial.outputRoot;
     try {
@@ -82,10 +96,22 @@ async function serve(args) {
         projectName: basename(input),
         documents,
         onAnnotationsChange: async () => {
-            await convertDirectoryDetailed(input, output);
+            await convertDirectoryDetailed(input, output, conversionOptions);
         },
     });
     console.log(`marksites server: ${server.url}`);
+    const watcher = shouldWatch
+        ? await watchConversionInput(input, output, async () => {
+            const result = await convertDirectoryDetailed(input, output, conversionOptions);
+            report(result);
+            const nextManifest = JSON.parse(await readFile(join(output, ".marksites-build.json"), "utf8"));
+            documents.clear();
+            for (const [document, value] of Object.entries(nextManifest.files))
+                documents.set(document, value.annotations);
+        }, conversionOptions)
+        : undefined;
+    if (watcher)
+        console.log(`Watching ${input}`);
     if (shouldOpen) {
         const opened = await openBrowser(server.url);
         if (!opened) {
@@ -98,6 +124,7 @@ async function serve(args) {
             if (closing)
                 return;
             closing = true;
+            watcher?.close();
             server.close().then(done, fail);
         };
         process.once("SIGINT", close);
@@ -107,16 +134,47 @@ async function serve(args) {
 async function main() {
     if (process.argv[2] === "serve")
         return serve(process.argv.slice(3));
-    const inputArgument = process.argv[2] ?? ".";
+    const args = process.argv.slice(2);
+    const shouldWatch = args.includes("--watch");
+    const verbose = args.includes("--verbose");
+    const positional = args.filter((argument) => argument !== "--watch" && argument !== "--verbose");
+    const unknown = positional.find((argument) => argument.startsWith("--"));
+    if (unknown)
+        throw new Error(`Unknown option: ${unknown}`);
+    if (positional.length > 2)
+        usage();
+    const inputArgument = positional[0] ?? ".";
     const input = resolve(inputArgument);
     const inputStat = await stat(input);
-    const outputArgument = process.argv[3];
+    const outputArgument = positional[1];
+    const conversionOptions = {
+        onLog: verbose ? (message) => console.log(message) : undefined,
+    };
     if (inputStat.isDirectory()) {
-        report(await convertDirectoryDetailed(input, outputArgument));
+        const initial = await convertDirectoryDetailed(input, outputArgument, conversionOptions);
+        report(initial);
+        if (shouldWatch) {
+            const watcher = await watchConversionInput(input, initial.outputRoot, async () => {
+                report(await convertDirectoryDetailed(input, initial.outputRoot, conversionOptions));
+            }, conversionOptions);
+            console.log(`Watching ${input}`);
+            await new Promise((done) => {
+                const close = () => {
+                    watcher.close();
+                    done();
+                };
+                process.once("SIGINT", close);
+                process.once("SIGTERM", close);
+            });
+        }
         return;
     }
     if (!inputStat.isFile())
         throw new Error(`Input is not a file or directory: ${inputArgument}`);
+    if (shouldWatch)
+        throw new Error("--watch input must be a directory");
+    if (verbose)
+        console.log(`Converting ${input}`);
     console.log(`Created ${await convertFile(input, outputArgument)}`);
 }
 main().catch((error) => {

package/dist/conversion/assets.d.ts

@@ -0,0 +1,8 @@
+import { type Token } from "marked";
+export declare const ASSET_DIRECTORY = "_marksites-assets";
+export interface PreparedAssets {
+    hash: string;
+    outputs: string[];
+    rewrite(token: Token): void;
+}
+export declare function prepareImageAssets(markdown: string, sourcePath: string, outputPath: string, outputRoot: string): Promise<PreparedAssets>;

package/dist/conversion/assets.js

@@ -0,0 +1,62 @@
+import { readFile } from "node:fs/promises";
+import { dirname, extname, join, posix, resolve } from "node:path";
+import { marked } from "marked";
+import { atomicWriteFile } from "../utils/files.js";
+import { contentHash } from "./rendering.js";
+import { pathExists } from "./paths.js";
+export const ASSET_DIRECTORY = "_marksites-assets";
+function localPath(href, sourcePath) {
+    const raw = href.split(/[?#]/, 1)[0];
+    if (!raw ||
+        raw.startsWith("/") ||
+        raw.startsWith("//") ||
+        /^[a-z][a-z\d+.-]*:/i.test(raw))
+        return undefined;
+    try {
+        return resolve(dirname(sourcePath), decodeURIComponent(raw));
+    }
+    catch {
+        return undefined;
+    }
+}
+export async function prepareImageAssets(markdown, sourcePath, outputPath, outputRoot) {
+    const hrefs = new Set();
+    marked.walkTokens(marked.lexer(markdown), (token) => {
+        if (token.type === "image")
+            hrefs.add(token.href);
+    });
+    const rewrites = new Map();
+    const fingerprints = [];
+    const outputs = new Set();
+    for (const href of [...hrefs].sort()) {
+        const source = localPath(href, sourcePath);
+        if (!source || !(await pathExists(source)))
+            continue;
+        let data;
+        try {
+            data = await readFile(source);
+        }
+        catch {
+            continue;
+        }
+        const digest = contentHash(data).slice("sha256:".length);
+        const extension = extname(source).toLowerCase().replace(/[^.a-z0-9]/g, "");
+        const assetPath = posix.join(ASSET_DIRECTORY, `${digest}${extension}`);
+        const suffix = href.slice(href.split(/[?#]/, 1)[0].length);
+        const relativeHref = posix.relative(posix.dirname(outputPath), assetPath);
+        rewrites.set(href, `${relativeHref || posix.basename(assetPath)}${suffix}`);
+        fingerprints.push(`${href}\0${digest}`);
+        outputs.add(assetPath);
+        const destination = join(outputRoot, ...assetPath.split("/"));
+        if (!(await pathExists(destination)))
+            await atomicWriteFile(destination, data);
+    }
+    return {
+        hash: contentHash(fingerprints.join("\n")),
+        outputs: [...outputs].sort(),
+        rewrite(token) {
+            if (token.type === "image")
+                token.href = rewrites.get(token.href) ?? token.href;
+        },
+    };
+}

package/dist/conversion/directory.d.ts

@@ -1,3 +1,3 @@
-import type { ConversionResult } from "./types.js";
-export declare function convertDirectoryDetailed(input: string, outputArgument?: string): Promise<ConversionResult>;
+import type { ConversionResult, ConversionOptions } from "./types.js";
+export declare function convertDirectoryDetailed(input: string, outputArgument?: string, options?: ConversionOptions): Promise<ConversionResult>;
 export declare function convertDirectory(input: string, outputArgument?: string): Promise<number>;

package/dist/conversion/directory.js

@@ -8,6 +8,7 @@ import { BUILD_MANIFEST, assertNoOutputCollisions, loadManifest, writeManifest,
 import { buildBreadcrumbs, buildFileTree } from "./navigation.js";
 import { DEFAULT_OUTPUT_DIRECTORY, findMarkdownFiles, firstExistingPath, pathExists, toLegacyMetadataPaths, } from "./paths.js";
 import { OUTPUT_COMPATIBILITY_VERSION, contentHash, renderFingerprint, rewriteMarkdownLinks, } from "./rendering.js";
+import { prepareImageAssets } from "./assets.js";
 async function migrateLegacyMetadata(files, output) {
     let moved = 0;
     for (const file of files) {
@@ -34,6 +35,22 @@ async function loadSources(files) {
         file.modifiedAt = sourceStat.mtime.toISOString();
     }
 }
+async function prepareAssets(files, output) {
+    for (const file of files) {
+        const assets = await prepareImageAssets(file.source, file.sourcePath, file.outputPath, output);
+        file.assetHash = assets.hash;
+        file.assetOutputs = assets.outputs;
+        file.rewriteImages = assets.rewrite;
+    }
+}
+async function removeUnusedAssets(previous, files, output) {
+    const current = new Set(files.flatMap((file) => file.assetOutputs ?? []));
+    const old = new Set(Object.values(previous?.files ?? {}).flatMap((file) => file.assets ?? []));
+    for (const asset of old) {
+        if (!current.has(asset))
+            await rm(join(output, ...asset.split("/")), { force: true });
+    }
+}
 async function moveRenamedDocuments(files, previous, output, removed) {
     let deleted = 0;
     let metadataMoved = 0;
@@ -104,7 +121,7 @@ async function removeDeletedHtml(removed, previous, output) {
     }
     return { deleted, orphaned };
 }
-async function renderChangedFiles(files, input, output, previous, full) {
+async function renderChangedFiles(files, input, output, previous, full, options) {
     let converted = 0;
     let skipped = 0;
     const manifestFiles = {};
@@ -116,6 +133,7 @@ async function renderChangedFiles(files, input, output, previous, full) {
             old.sourceHash !== file.sourceHash ||
             old.modifiedAt !== file.modifiedAt ||
             old.annotationHash !== file.annotationHash ||
+            old.assetHash !== file.assetHash ||
             !(await pathExists(destination));
         if (changed) {
             await atomicWriteFile(destination, renderMarkdown(file.source, {
@@ -126,12 +144,19 @@ async function renderChangedFiles(files, input, output, previous, full) {
                     items: buildFileTree(files, file.outputPath),
                     breadcrumbs: buildBreadcrumbs(files, file),
                 },
-                markedOptions: { walkTokens: rewriteMarkdownLinks },
+                markedOptions: {
+                    walkTokens: (token) => {
+                        rewriteMarkdownLinks(token);
+                        file.rewriteImages?.(token);
+                    },
+                },
             }, file.annotations));
             converted++;
+            options.onLog?.(`Converted ${file.relativePath} -> ${file.outputPath}`);
         }
         else {
             skipped++;
+            options.onLog?.(`Skipped ${file.relativePath}`);
         }
         manifestFiles[file.relativePath] = {
             sourceHash: file.sourceHash,
@@ -139,11 +164,13 @@ async function renderChangedFiles(files, input, output, previous, full) {
             annotationHash: file.annotationHash,
             output: file.outputPath,
             annotations: file.metadataPath,
+            assetHash: file.assetHash,
+            assets: file.assetOutputs,
         };
     }
     return { converted, skipped, files: manifestFiles };
 }
-export async function convertDirectoryDetailed(input, outputArgument) {
+export async function convertDirectoryDetailed(input, outputArgument, options = {}) {
     const output = outputArgument
         ? resolve(outputArgument)
         : resolve(DEFAULT_OUTPUT_DIRECTORY);
@@ -163,6 +190,7 @@ export async function convertDirectoryDetailed(input, outputArgument) {
         console.warn(loaded.warning);
     const previous = loaded.manifest;
     await loadSources(files);
+    await prepareAssets(files, output);
     let annotationsMoved = await migrateLegacyMetadata(files, output);
     const currentPaths = new Set(files.map((file) => file.relativePath));
     const removed = Object.keys(previous?.files ?? {}).filter((path) => !currentPaths.has(path));
@@ -170,7 +198,7 @@ export async function convertDirectoryDetailed(input, outputArgument) {
     annotationsMoved += renamed.metadataMoved;
     const annotationsCreated = await loadMetadata(files, output);
     const treeHash = contentHash(files
-        .map((file) => `${file.relativePath}\0${file.annotations ? countActiveAnnotations(file.annotations) : 0}`)
+        .map((file) => `${file.relativePath}\0${file.modifiedAt}\0${file.annotations ? countActiveAnnotations(file.annotations) : 0}`)
         .sort()
         .join("\n"));
     const fingerprint = renderFingerprint();
@@ -181,12 +209,13 @@ export async function convertDirectoryDetailed(input, outputArgument) {
         previous.generator.renderFingerprint !== fingerprint ||
         previous.treeHash !== treeHash;
     const removedResult = await removeDeletedHtml(removed, previous, output);
-    const rendered = await renderChangedFiles(files, input, output, previous, full);
+    const rendered = await renderChangedFiles(files, input, output, previous, full, options);
+    await removeUnusedAssets(previous, files, output);
     await writeManifest(manifestPath, {
         schemaVersion: 1,
         generator: {
             name: "marksites",
-            version: "0.1.0",
+            version: "0.2.0",
             outputCompatibilityVersion: OUTPUT_COMPATIBILITY_VERSION,
             renderFingerprint: fingerprint,
         },

package/dist/conversion/navigation.js

@@ -33,6 +33,8 @@ export function buildFileTree(files, currentOutputPath) {
                 .map((file) => ({
                 type: "file",
                 name: basename(file.relativePath),
+                path: file.relativePath,
+                modifiedAt: file.modifiedAt,
                 href: encodeRelativeHref(posix.relative(posix.dirname(currentOutputPath), file.outputPath) ||
                     posix.basename(file.outputPath)),
                 current: file.outputPath === currentOutputPath,

package/dist/conversion/paths.d.ts

@@ -8,3 +8,4 @@ export declare function toPosix(path: string): string;
 export declare function pathExists(path: string): Promise<boolean>;
 export declare function firstExistingPath(paths: string[]): Promise<string | undefined>;
 export declare function findMarkdownFiles(root: string, excludedDirectory?: string): Promise<MarkdownFile[]>;
+export declare function findWatchDirectories(root: string, excludedDirectory?: string): Promise<string[]>;

package/dist/conversion/paths.js

@@ -84,3 +84,26 @@ export async function findMarkdownFiles(root, excludedDirectory) {
     await visit(root, []);
     return files;
 }
+export async function findWatchDirectories(root, excludedDirectory) {
+    const directories = [];
+    async function visit(directory, inheritedRules) {
+        if (directory !== root && (await pathExists(join(directory, BUILD_MANIFEST))))
+            return;
+        directories.push(directory);
+        const rules = await loadGitignoreRules(root, directory, inheritedRules);
+        const entries = await readdir(directory, { withFileTypes: true });
+        for (const entry of entries) {
+            if (!entry.isDirectory())
+                continue;
+            const absolute = join(directory, entry.name);
+            const relativePath = toPosix(relative(root, absolute));
+            if (resolve(absolute) === excludedDirectory ||
+                EXCLUDED_DIRECTORY_NAMES.has(entry.name) ||
+                isGitignored(relativePath, true, rules))
+                continue;
+            await visit(absolute, rules);
+        }
+    }
+    await visit(root, []);
+    return directories;
+}

package/dist/conversion/rendering.d.ts

@@ -1,5 +1,5 @@
 import type { Token } from "marked";
-export declare const OUTPUT_COMPATIBILITY_VERSION = 5;
+export declare const OUTPUT_COMPATIBILITY_VERSION = 7;
 export declare function contentHash(value: string | Buffer): string;
 export declare function rewriteMarkdownLinks(token: Token): void;
 export declare function renderFingerprint(): string;

package/dist/conversion/rendering.js

@@ -1,7 +1,7 @@
 import { createHash } from "node:crypto";
 import { emptyAnnotationDocument } from "../annotations/model.js";
 import { renderMarkdown } from "../markdown-to-html.js";
-export const OUTPUT_COMPATIBILITY_VERSION = 5;
+export const OUTPUT_COMPATIBILITY_VERSION = 7;
 export function contentHash(value) {
     return `sha256:${createHash("sha256").update(value).digest("hex")}`;
 }
@@ -18,7 +18,7 @@ export function rewriteMarkdownLinks(token) {
         token.href = rewriteMarkdownHref(token.href);
 }
 export function renderFingerprint() {
-    const representativeHtml = renderMarkdown("## Heading\n\n[Document](guide.md)\n\n```js\nconst value = 1;\n```\n", {
+    const representativeHtml = renderMarkdown("## Heading\n\n[Document](guide.md)\n\n![Image](image.png)\n\n```js\nconst value = 1;\n```\n", {
         title: "marksites-render-fingerprint",
         modifiedAt: "2026-01-01T00:00:00.000Z",
         fileTree: {
@@ -27,8 +27,10 @@ export function renderFingerprint() {
                 {
                     type: "file",
                     name: "index.md",
+                    path: "index.md",
                     href: "index.html",
                     current: true,
+                    modifiedAt: "2026-01-01T00:00:00.000Z",
                 },
             ],
             breadcrumbs: [{ name: "docs" }, { name: "index.md", current: true }],

package/dist/conversion/single-file.js

@@ -4,6 +4,7 @@ import { readAnnotations } from "../annotations/storage.js";
 import { renderMarkdown } from "../markdown-to-html.js";
 import { atomicWriteFile } from "../utils/files.js";
 import { DEFAULT_OUTPUT_DIRECTORY, firstExistingPath, isMarkdown, pathExists, } from "./paths.js";
+import { prepareImageAssets } from "./assets.js";
 export async function convertFile(input, outputArgument) {
     if (!isMarkdown(input))
         throw new Error(`Input file must use .md or .markdown: ${input}`);
@@ -27,9 +28,13 @@ export async function convertFile(input, outputArgument) {
         stat(input),
     ]);
     await mkdir(dirname(output), { recursive: true });
+    const assets = await prepareImageAssets(markdown, input, basename(output), dirname(output));
     await atomicWriteFile(output, renderMarkdown(markdown, {
         title: basename(input, extname(input)),
         modifiedAt: sourceStat.mtime.toISOString(),
+        markedOptions: {
+            walkTokens: assets.rewrite,
+        },
     }, annotations));
     return output;
 }

package/dist/conversion/types.d.ts

@@ -9,6 +9,9 @@ export interface MarkdownFile {
     modifiedAt?: string;
     annotations?: AnnotationDocument;
     annotationHash?: string;
+    assetHash?: string;
+    assetOutputs?: string[];
+    rewriteImages?: (token: import("marked").Token) => void;
 }
 export interface ManifestFile {
     sourceHash: string;
@@ -16,6 +19,8 @@ export interface ManifestFile {
     annotationHash: string;
     output: string;
     annotations: string;
+    assetHash?: string;
+    assets?: string[];
 }
 export interface BuildManifest {
     schemaVersion: 1;
@@ -37,3 +42,6 @@ export interface ConversionResult {
     orphanedAnnotations: string[];
     outputRoot: string;
 }
+export interface ConversionOptions {
+    onLog?: (message: string) => void;
+}

package/dist/conversion/watch.d.ts

@@ -0,0 +1,7 @@
+export interface ConversionWatcher {
+    close(): void;
+}
+export interface ConversionWatchOptions {
+    onLog?: (message: string) => void;
+}
+export declare function watchConversionInput(input: string, output: string, rebuild: () => Promise<void>, options?: ConversionWatchOptions): Promise<ConversionWatcher>;

package/dist/conversion/watch.js

@@ -0,0 +1,69 @@
+import { watch } from "node:fs";
+import { isAbsolute, relative, resolve, sep } from "node:path";
+import { findWatchDirectories } from "./paths.js";
+export async function watchConversionInput(input, output, rebuild, options = {}) {
+    const watchers = new Map();
+    let timer;
+    let building = false;
+    let pending = false;
+    const outputRelative = relative(input, output);
+    const outputInsideInput = outputRelative !== "" &&
+        !outputRelative.startsWith(`..${sep}`) &&
+        outputRelative !== ".." &&
+        !isAbsolute(outputRelative);
+    const refresh = async () => {
+        const directories = new Set(await findWatchDirectories(input, outputInsideInput ? resolve(output) : undefined));
+        for (const [directory, active] of watchers) {
+            if (!directories.has(directory)) {
+                active.close();
+                watchers.delete(directory);
+            }
+        }
+        for (const directory of directories) {
+            if (watchers.has(directory))
+                continue;
+            watchers.set(directory, watch(directory, (eventType, filename) => {
+                const target = filename ? String(filename) : "(unknown)";
+                options.onLog?.(`Watch event ${eventType}: ${relative(input, resolve(directory, target)) || "."}`);
+                schedule();
+            }));
+        }
+    };
+    const run = async () => {
+        if (building) {
+            pending = true;
+            return;
+        }
+        building = true;
+        try {
+            options.onLog?.("Watch rebuild started");
+            await rebuild();
+            await refresh();
+        }
+        catch (error) {
+            console.error(`Watch rebuild failed: ${error instanceof Error ? error.message : String(error)}`);
+        }
+        finally {
+            building = false;
+            if (pending) {
+                pending = false;
+                schedule();
+            }
+        }
+    };
+    const schedule = () => {
+        if (timer)
+            clearTimeout(timer);
+        timer = setTimeout(run, 100);
+    };
+    await refresh();
+    return {
+        close() {
+            if (timer)
+                clearTimeout(timer);
+            for (const active of watchers.values())
+                active.close();
+            watchers.clear();
+        },
+    };
+}

package/dist/features/file-tree/index.d.ts

@@ -2,6 +2,6 @@ import type { FileBreadcrumb, FileTreeOptions } from "../../types.js";
 export declare function renderFileTree(options?: FileTreeOptions): string;
 export declare function renderFileSidebar(options?: FileTreeOptions): string;
 export declare function renderFileTreeScript(enabled: boolean): string;
-export declare function renderBreadcrumbs(breadcrumbs?: FileBreadcrumb[], modifiedAt?: string): string;
+export declare function renderBreadcrumbs(breadcrumbs?: FileBreadcrumb[]): string;
 export declare function renderModifiedAt(modifiedAt?: string): string;
 export declare function renderModifiedAtScript(enabled: boolean): string;