rapier-markdown-kit 1.2.9 → 1.2.10

package/dist/kit/render-print.mjs

@@ -171,7 +171,7 @@ function _rapierPrintWillPageCss() {
 
 const CAPTURE_EDGE = 4096, CAPTURE_PIXELS = 4 * 1024 * 1024;
 
-async function _rapierWritePrintPdf({root, css, fontCss = '', canonical, bom = false, filename, title, settings}, {capture, signal, current, maxBytes = 8 * 1024 * 1024, film, ink} = {}) {
+async function _rapierWritePrintPdf({root, css, fontCss = '', canonical, bom = false, filename, title, settings, templatePage = null}, {capture, signal, current, maxBytes = 8 * 1024 * 1024, film, ink} = {}) {
 	const refuse = code => { throw Object.assign(new Error(code), {code}); };
 	const check = () => {
 		if (signal?.aborted) refuse('cancelled');
@@ -187,7 +187,7 @@ async function _rapierWritePrintPdf({root, css, fontCss = '', canonical, bom = f
 	const bodyHeight = Math.floor((height - margins.top - margins.bottom) * 4 / 3);
 	if (bodyWidth < 1 || bodyHeight < 1 || bodyWidth * bodyHeight > 4 * 1024 * 1024) refuse('pdf_page_geometry_invalid');
 	const frame = document.createElement('iframe');
-	let vectors, nativeGlyphs, filmSession;
+	let vectors, backdrop = null, nativeGlyphs, filmSession;
 	let rejectAbort;
 	const aborted = new Promise((_, reject) => { rejectAbort = reject; });
 	aborted.catch(() => {});
@@ -233,6 +233,7 @@ async function _rapierWritePrintPdf({root, css, fontCss = '', canonical, bom = f
 		strip.append(root); surface.append(strip); into.body.append(surface);
 		const main = root.querySelector('main');
 		if (!main) refuse('pdf_render_unavailable');
+		if (templatePage) for (const image of main.querySelectorAll('img')) if (image.getAttribute('src') === templatePage.url) (image.closest('p,figure') || image).remove();
 		main.setAttribute('data-md-theme', 'light');
 		for (const details of main.querySelectorAll('details')) details.open = true;
 		main.getBoundingClientRect();
@@ -255,7 +256,7 @@ async function _rapierWritePrintPdf({root, css, fontCss = '', canonical, bom = f
 		}
 		for (const [name, value] of Object.entries({width: bodyWidth + 'px', height: bodyHeight + 'px',
 			'max-width': 'none', 'min-height': '0', padding: '0', margin: '0', overflow: 'visible',
-			'column-width': bodyWidth + 'px', 'column-gap': '0', 'column-count': 'auto', 'column-fill': 'auto'}))
+			'column-width': bodyWidth + 'px', 'column-gap': '0', 'column-count': 'auto', 'column-fill': 'auto', background: 'none'}))
 			main.style.setProperty(name, value, 'important');
 		globalThis.RapierMath?.fit(main);
 		applyPrintCapitals(main);
@@ -334,11 +335,22 @@ async function _rapierWritePrintPdf({root, css, fontCss = '', canonical, bom = f
 			first += span;
 		}
 		check();
-		const bytes = await writeRasterPdf({pages, textPages, linkPages, vectorPages: vectors.pages, canonical, bom, filename, title, font, width, height, margins,
+		if (templatePage) {
+			const sheetWidth = Math.round(width * 4 / 3), sheetHeight = Math.round(height * 4 / 3);
+			const holder = into.createElement('div'), picture = into.createElement('img');
+			holder.style.cssText = `position:fixed;left:0;top:0;width:${sheetWidth}px;height:${sheetHeight}px;pointer-events:none`;
+			picture.style.cssText = 'display:block;width:100%;height:100%'; picture.src = templatePage.url;
+			holder.append(picture); into.body.append(holder);
+			await step(picture.decode());
+			backdrop = await collectPdfVectors(holder, {width: sheetWidth, height: sheetHeight, count: 1, capture, signal, current, check, maxBytes,
+				sanitizeSvg: globalThis.RapierImageAssets?.sanitizeSvgText});
+			if (!backdrop.pages[0].length) refuse('pdf_template_border_unavailable');
+		}
+		const bytes = await writeRasterPdf({pages, textPages, linkPages, vectorPages: vectors.pages, canonical, bom, filename, title, font, width, height, margins, backdrop: backdrop?.pages[0] || null,
 			pixelWidth: bodyWidth, pixelHeight: bodyHeight, pageNumbers: settings?.pagestyle === 'plain', maxBytes, check});
 		check();
 		return {bytes, pages: count};
-	} finally { filmSession?.close(); nativeGlyphs?.restore(); vectors?.restore(); signal?.removeEventListener('abort', abort); frame.remove(); }
+	} finally { filmSession?.close(); nativeGlyphs?.restore(); vectors?.restore(); backdrop?.restore(); signal?.removeEventListener('abort', abort); frame.remove(); }
 }
 
 async function _rapierPrintTextPages(main, pageWidth, count, check, origin = main.getBoundingClientRect(), nativeNodes = null) {
@@ -481,7 +493,7 @@ function _rapierPrintSlots(text, rtl) {
 	return {slots, count};
 }
 
-async function writeRasterPdf({pages, textPages, linkPages = [], vectorPages = [], canonical, bom = false, filename, title, font, width, height, margins, pixelWidth, pixelHeight, pageNumbers, maxBytes, check}) {
+async function writeRasterPdf({pages, textPages, linkPages = [], vectorPages = [], backdrop = null, canonical, bom = false, filename, title, font, width, height, margins, pixelWidth, pixelHeight, pageNumbers, maxBytes, check}) {
 	const encoder = new TextEncoder(), encode = value => encoder.encode(value);
 	const fail = code => { throw Object.assign(new Error(code), {code}); };
 	const concat = parts => {
@@ -565,11 +577,10 @@ async function writeRasterPdf({pages, textPages, linkPages = [], vectorPages = [
 		const held = pages[index], flate = !!held?.rgb;
 		const picture = stream('/Type /XObject /Subtype /Image /Width ' + pixelWidth + ' /Height ' + pixelHeight + ' /ColorSpace /DeviceRGB /BitsPerComponent 8 /Filter /' + (flate ? 'FlateDecode' : 'DCTDecode'), flate ? held.rgb : held);
 		pages[index] = null;
-		let commands = '/Artifact BMC\nq\n' + [decimal(pixelWidth * .75), 0, 0, decimal(pixelHeight * .75), decimal(margins.left), decimal(height - margins.top - pixelHeight * .75)].join(' ') + ' cm\n/Im0 Do\nQ\nEMC\n';
 		const pictures = ['/Im0 ' + picture + ' 0 R'], states = [];
-		for (const drawing of vectorPages[index] || []) {
-			commands += `q\n.75 0 0 -.75 ${decimal(margins.left)} ${decimal(height - margins.top)} cm\n0 0 ${pixelWidth} ${pixelHeight} re W n\n1 0 0 1 ${decimal(drawing.x)} 0 cm\n`;
-			commands += [drawing.clip.x, drawing.clip.y, drawing.clip.width, drawing.clip.height].map(decimal).join(' ') + ' re W n\n';
+		const emit = (drawing, left, top, clipWidth, clipHeight) => {
+			let out = `q\n.75 0 0 -.75 ${decimal(left)} ${decimal(top)} cm\n0 0 ${clipWidth} ${clipHeight} re W n\n1 0 0 1 ${decimal(drawing.x)} 0 cm\n`;
+			out += [drawing.clip.x, drawing.clip.y, drawing.clip.width, drawing.clip.height].map(decimal).join(' ') + ' re W n\n';
 			for (const piece of drawing.sequence) {
 				if (piece.image) {
 					let shared = sharedImages.get(piece.image);
@@ -583,15 +594,19 @@ async function writeRasterPdf({pages, textPages, linkPages = [], vectorPages = [
 						sharedImages.set(piece.image, shared);
 					}
 					if (!pictures.includes(shared.resource)) pictures.push(shared.resource);
-					commands += `q\n${[piece.width, 0, 0, -piece.height, piece.x, piece.y + piece.height].map(decimal).join(' ')} cm\n${shared.name} Do\nQ\n`;
+					out += `q\n${[piece.width, 0, 0, -piece.height, piece.x, piece.y + piece.height].map(decimal).join(' ')} cm\n${shared.name} Do\nQ\n`;
 				} else {
 					const state = '/Gs' + states.length;
 					states.push(state + ' ' + add('<< /Type /ExtGState /ca ' + decimal(piece.fillAlpha) + ' /CA ' + decimal(piece.strokeAlpha) + ' >>') + ' 0 R');
-					commands += 'q\n' + state + ' gs\n' + piece.commands + 'Q\n';
+					out += 'q\n' + state + ' gs\n' + piece.commands + 'Q\n';
 				}
 			}
-			commands += 'Q\n';
-		}
+			return out + 'Q\n';
+		};
+		let commands = '';
+		for (const drawing of backdrop || []) commands += emit(drawing, 0, height, Math.round(width * 4 / 3), Math.round(height * 4 / 3));
+		commands += '/Artifact BMC\nq\n' + [decimal(pixelWidth * .75), 0, 0, decimal(pixelHeight * .75), decimal(margins.left), decimal(height - margins.top - pixelHeight * .75)].join(' ') + ' cm\n/Im0 Do\nQ\nEMC\n';
+		for (const drawing of vectorPages[index] || []) commands += emit(drawing, margins.left, height - margins.top, pixelWidth, pixelHeight);
 		const textAlphas = new Map();
 		for (const run of textPages[index]) {
 			if (!run.text) continue;

package/dist/kit/render.mjs

@@ -8,6 +8,7 @@ import {documentLanguage, documentSettingsFonts} from '../spec/document-settings
 import {createLineMeasurer, linesHeight} from '../layout/model.mjs';
 import {markPrintCapitals, createPrintCapitals, followingPrintProse} from './print-capitals.mjs';
 import {freezePublishedInk} from './render-ink.mjs';
+import {isTemplatePage, isPageBorderLayout} from '../spec/template-page.mjs';
 export function positionNativeDiagram(drawing) {
   const surface=drawing?.closest?.('.diagram-block,.diagram-live-preview');
   if(!surface?.clientWidth)return;
@@ -109,6 +110,7 @@ async function _rapierBuildArtifact(options, providedContext) {
 	const styledRoot = work ? await _rapierProjectStyledRootAsync(context.semanticRoot, styledOptions)
 		: _rapierProjectStyledRoot(context.semanticRoot, styledOptions);
 	styledRoot.setAttribute('lang', language);
+	const templatePage = _rapierTemplatePage(context.canonical, settings, styledRoot);
 	if (completePage && typeof _rapierFinalizeExportCode === 'function') await _rapierFinalizeExportCode(styledRoot);
 	if (!opts.print) _rapierAnnotateExportBoxPolygons(styledRoot);
 	if (completePage || opts.print) {
@@ -121,7 +123,7 @@ async function _rapierBuildArtifact(options, providedContext) {
 	}
 	if (typeof opts.afterRoot === 'function') await opts.afterRoot(styledRoot);
 	markPrintCapitals(styledRoot);
-	const theme = opts.print
+	const theme = opts.print || templatePage
 		? 'light'
 		: _rapierArtifactPreference('theme', ['system', 'light', 'dark']);
 	const highlights = _rapierArtifactPreference('highlights', ['accent', 'standard']);
@@ -147,7 +149,8 @@ async function _rapierBuildArtifact(options, providedContext) {
 		+ (opts.extraCss ? '\n\n' + opts.extraCss : '')
 		+ (willFont ? '\n\n@font-face{font-family:' + willFont.family + ';src:url(' + await _rapierBlobDataUrl(new Blob([willFont.bytes], { type: 'font/ttf' })) + ') format("truetype")}' : '')
 		+ (settingsCss ? '\n' + settingsCss : '')
-		+ (typographyPrintCss ? '\n' + typographyPrintCss : '');
+		+ (typographyPrintCss ? '\n' + typographyPrintCss : '')
+		+ (templatePage ? '\n' + templatePage.css : '');
 	let factoryFontCss = '';
 	if (!opts.print) {
 		if (fontIndex) await requireDocumentFonts(context.canonical, {parser: md, index: fontIndex, root: styledRoot, settings, css, fontCss, validateFont: runtime.validateFont});
@@ -180,7 +183,7 @@ async function _rapierBuildArtifact(options, providedContext) {
 		+ '<meta name="generator" content="Rapier ' + escapeRapierHtmlText(version) + '">\n'
 		+ '<title>' + escapeRapierHtmlText(pageTitle) + '</title>\n'
 		+ '<style>' + css + '</style>\n</head>\n'
-		+ '<body class="' + bodyClass + '"><main class="' + docClass + '" data-md-theme="' + theme + '">'
+		+ '<body class="' + bodyClass + '">' + (templatePage ? '<div class="rapier-template-border" aria-hidden="true"></div>' : '') + '<main class="' + docClass + '" data-md-theme="' + theme + '">'
 		+ bodyHtml + '</main>' + carrier + layoutScript + inkScript + htmlScript + '</body>\n</html>';
 
 	return {
@@ -191,6 +194,7 @@ async function _rapierBuildArtifact(options, providedContext) {
 		fontCss,
 		fontRequests: fontCss ? fontRequests(styledRoot, {settings, css, fontCss}) : [],
 		settings,
+		templatePage: templatePage && {url: templatePage.url, width: templatePage.width, height: templatePage.height, margin: templatePage.margin},
 		docClass,
 		language,
 		metadata,
@@ -198,6 +202,27 @@ async function _rapierBuildArtifact(options, providedContext) {
 	};
 }
 
+function _rapierTemplatePage(canonical, settings, root) {
+	if (!isTemplatePage(canonical) || !settings?.papersize) return null;
+	let url = '';
+	for (const paragraph of root.querySelectorAll(':scope > p[data-md-layout]')) {
+		const image = paragraph.querySelector('img');
+		const layout = globalThis.RapierMarkdownLayout.parseLayoutAttribute(paragraph.getAttribute('data-md-layout'));
+		const source = image?.getAttribute('src') || '';
+		if (isPageBorderLayout(layout) && /^data:image\/svg\+xml;base64,[A-Za-z0-9+/=]+$/.test(source)) { url = source; paragraph.remove(); break; }
+	}
+	if (!url) return null;
+	const width = settings.papersize.width / 15, height = settings.papersize.height / 15, margin = (settings.geometry?.twips ?? 1440) / 15;
+	const ground = 'background:var(--rapier-template-border) 0 0/100% 100% no-repeat';
+	const css = ':root{--rapier-template-border:url("' + url + '")}\n'
+		+ '@media screen{.rapier-template-border{display:none}body{background:#e8e8e8}.rapier-page{box-sizing:border-box;width:min(100%,' + width + 'px);min-height:' + height + 'px;margin:0 auto;padding:' + margin
+		+ 'px;background:var(--rapier-template-border) 0 0/100% ' + height + 'px repeat-y,#fff;color:#111}}\n'
+		+ '@media print{@page{size:' + width + 'px ' + height + 'px;margin:0}html,body{margin:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}'
+		+ '.rapier-page{box-sizing:border-box;width:auto;max-width:none;margin:0;padding:' + margin + 'px!important;position:relative!important;z-index:1;box-decoration-break:clone;-webkit-box-decoration-break:clone}'
+		+ '.rapier-template-border{display:block;position:fixed;left:0;top:0;width:' + width + 'px;height:' + height + 'px;z-index:0;' + ground + '}}';
+	return {url, width, height, margin, css};
+}
+
 function _rapierPagePreviewMeta(root, fallbackTitle) {
 	const words = node => String(node?.textContent || '').replace(/\s+/g, ' ').trim();
 	const title = words(root.querySelector('h1,h2,h3,h4,h5,h6')) || String(fallbackTitle || '');

package/dist/spec/document-settings.mjs

@@ -72,7 +72,7 @@ export function documentSpacingCss(settings, scope = '.md-render', defaults = fa
 		css += selector + '{margin-block:' + length(row.before) + ' ' + length(row.after) + ';line-height:' + row.line + '}';
 		if (settings?.word && /^h[1-6]$/.test(type)) css += selector + '{font-size:' + length(documentHeadingSize(settings, Number(type[1]))) + '}';
 	}
-	css += scope + ' :is(li,td,th,blockquote)>:last-child{margin-bottom:0}' +
+	css += scope + ' :is(li,td,th,blockquote)>:last-child:not(input){margin-bottom:0}' +
 		scope + ' li:last-child{margin-bottom:0}' + scope + ' li>:is(ul,ol){margin-bottom:0}' +
 		scope + ' .table-scroll-wrap>table{margin-block:0}' +
 		scope + ' pre{font-size:calc(var(--md-text-body) * .7386)}' +

package/dist/spec/template-page.mjs

@@ -0,0 +1,6 @@
+// SPDX-License-Identifier: MIT
+export function isTemplatePage(source) {
+  const match = /^(?:)?---[ \t]*\r?\n([\s\S]*?)\r?\n---[ \t]*(?:\r?\n|$)/.exec(String(source).slice(0, 65536));
+  return !!match && /^template:[ \t]*page[ \t]*(?:#.*)?$/m.test(match[1]);
+}
+export const isPageBorderLayout = layout => layout?.wrap === 'behind' && layout.lock === 'on';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rapier-markdown-kit",
-  "version": "1.2.9",
+  "version": "1.2.10",
   "description": "Read, render and write Self-contained Markdown: one .md file that carries its pictures, drawings and layout, and that any Markdown app can read. HTML renderer, stylesheet, text layout, Will/1 agent permissions, and an edit history with authorship and offline merge. MIT, no dependencies.",
   "keywords": [
     "markdown",