rapier-markdown-kit 1.1.102 → 1.2.3

package/dist/kit/render-print.mjs

@@ -175,7 +175,7 @@ function _rapierPrintWillPageCss() {
 // The capture's own limits (agent/visual.mjs VISUAL_LIMITS): the longest edge and the most pixels one capture returns.
 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} = {}) {
+async function _rapierWritePrintPdf({root, css, fontCss = '', canonical, bom = false, filename, title, settings}, {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');
@@ -193,7 +193,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;
+	let vectors, nativeGlyphs, filmSession;
 	let rejectAbort;
 	const aborted = new Promise((_, reject) => { rejectAbort = reject; });
 	aborted.catch(() => {});
@@ -273,6 +273,8 @@ async function _rapierWritePrintPdf({root, css, fontCss = '', canonical, bom = f
 		globalThis.RapierMath?.fit(main);
 		applyPrintCapitals(main);
 		applyTypography(main, {all: true});
+		// The document's ink marks, drawn on the words where they now stand on the page.
+		ink?.(main);
 		const count = Math.max(1, Math.ceil((main.scrollWidth - 1) / bodyWidth));
 		if (!Number.isSafeInteger(count)) refuse('pdf_page_geometry_invalid');
 		// Captured document font bytes own a same-name family; factory glyphs must
@@ -296,48 +298,59 @@ async function _rapierWritePrintPdf({root, css, fontCss = '', canonical, bom = f
 		}
 		const font = _rapierPrintWillFont(text);
 		strip.style.width = count * bodyWidth + 'px';
-		// A capture costs the whole document, however little of it the clip takes, so the pages that carry no picture share captures: as many to one
-		// as the capture's own limits allow, fewer when the capture refuses its size. A page with a picture is captured alone, so the picture keeps
-		// the capture's byte limit to itself.
-		let share = main.querySelector('img,svg,canvas,video,picture') ? 1
-			: Math.max(1, Math.min(Math.floor(CAPTURE_EDGE / bodyWidth), Math.floor(CAPTURE_PIXELS / (bodyWidth * bodyHeight))));
+		strip.style.transform = 'none';
+		// One styled film is reused for every page window. Batches stay inside the capture edge
+		// and pixel limits. A picture no longer forces its own capture. Pixels are deflated once.
+		if (typeof film !== 'function') refuse('pdf_render_unavailable');
+		// step() can reject after the film resolves (the document changed, or the attempt was
+		// cancelled). The session would otherwise keep its abort listener with no owner.
+		let pendingFilm = null, abandonFilm = false;
+		const trackedFilm = Promise.resolve(film({root: surface, signal, current, frame: {width: count * bodyWidth, height: bodyHeight}})).then(session => {
+			if (abandonFilm) session?.close?.();
+			else pendingFilm = session;
+			return session;
+		});
+		try {
+			filmSession = await step(trackedFilm);
+			pendingFilm = null;
+		} catch (error) {
+			abandonFilm = true;
+			pendingFilm?.close?.();
+			pendingFilm = null;
+			throw error;
+		}
+		let share = Math.max(1, Math.min(Math.floor(CAPTURE_EDGE / bodyWidth), Math.floor(CAPTURE_PIXELS / (bodyWidth * bodyHeight))));
 		const pages = [];
 		let imageBytes = 0;
+		const pack = async rgb => {
+			const packed = new Uint8Array(await step(new Response(new Blob([rgb]).stream().pipeThrough(new CompressionStream('deflate'))).arrayBuffer()));
+			imageBytes += packed.byteLength;
+			if (imageBytes > maxBytes) refuse('export_too_large');
+			pages.push({rgb: packed});
+		};
 		for (let first = 0; first < count;) {
 			check();
 			const span = Math.min(share, count - first);
-			surface.style.width = span * bodyWidth + 'px';
-			strip.style.transform = `translateX(${-first * bodyWidth}px)`;
-			let captured;
-			try { captured = await capture({root: surface, clip: {x: 0, y: 0, width: span * bodyWidth, height: bodyHeight}, signal, current}); }
-			catch (error) {
-				if (error?.code === 'visual_too_large' && span > 1) { share = Math.ceil(span / 2); continue; }
-				throw error;
-			}
-			check();
-			const image = new into.defaultView.Image();
-			image.src = 'data:' + captured.mimeType + ';base64,' + captured.data;
 			try {
-				await step(image.decode());
-				for (let offset = 0; offset < span; offset++) {
-					const canvas = into.createElement('canvas'); canvas.width = bodyWidth; canvas.height = bodyHeight;
-					try {
-						const context = canvas.getContext('2d', {alpha: false});
-						if (!context) refuse('pdf_render_unavailable');
-						context.fillStyle = '#fff'; context.fillRect(0, 0, bodyWidth, bodyHeight);
-						context.drawImage(image, offset * bodyWidth, 0, bodyWidth, bodyHeight, 0, 0, bodyWidth, bodyHeight);
-						// Preserve the capture's exact pixels. A JPEG re-encode changes
-						// glyph edges, pictures and paint even at its highest quality.
-						const rgba = context.getImageData(0, 0, bodyWidth, bodyHeight).data;
+				const shot = await step(filmSession.raster({x: first * bodyWidth, y: 0, width: span * bodyWidth, height: bodyHeight}));
+				if (shot?.width !== span * bodyWidth || shot?.height !== bodyHeight || !(shot.rgb instanceof Uint8Array)) refuse('pdf_render_unavailable');
+				if (span === 1) await pack(shot.rgb);
+				else {
+					const row = bodyWidth * 3;
+					for (let offset = 0; offset < span; offset++) {
 						const rgb = new Uint8Array(bodyWidth * bodyHeight * 3);
-						for (let at = 0, to = 0; at < rgba.length; at += 4) {rgb[to++] = rgba[at]; rgb[to++] = rgba[at + 1]; rgb[to++] = rgba[at + 2];}
-						const packed = new Uint8Array(await step(new Response(new Blob([rgb]).stream().pipeThrough(new CompressionStream('deflate'))).arrayBuffer()));
-						imageBytes += packed.byteLength;
-						if (imageBytes > maxBytes) refuse('export_too_large');
-						pages.push({rgb: packed});
-					} finally { canvas.width = canvas.height = 0; }
+						for (let y = 0; y < bodyHeight; y++) {
+							const from = (y * shot.width + offset * bodyWidth) * 3;
+							rgb.set(shot.rgb.subarray(from, from + row), y * row);
+						}
+						await pack(rgb);
+					}
 				}
-			} finally { image.src = ''; }
+				shot.rgb = null;
+			} catch (error) {
+				if (error?.code === 'visual_too_large' && span > 1) { share = Math.ceil(span / 2); continue; }
+				throw error;
+			}
 			first += span;
 		}
 		check();
@@ -345,7 +358,7 @@ async function _rapierWritePrintPdf({root, css, fontCss = '', canonical, bom = f
 			pixelWidth: bodyWidth, pixelHeight: bodyHeight, pageNumbers: settings?.pagestyle === 'plain', maxBytes, check});
 		check();
 		return {bytes, pages: count};
-	} finally { nativeGlyphs?.restore(); vectors?.restore(); signal?.removeEventListener('abort', abort); frame.remove(); }
+	} finally { filmSession?.close(); nativeGlyphs?.restore(); vectors?.restore(); signal?.removeEventListener('abort', abort); frame.remove(); }
 }
 
 // Ranges locate the actual text fragments after column layout. Splitting a text node at
@@ -355,7 +368,7 @@ async function _rapierPrintTextPages(main, pageWidth, count, check, origin = mai
 	const pages = Array.from({length: count}, () => []), walker = into.createTreeWalker(main, 5);
 	const markerMetrics = _rapierPrintWillMetrics(Array.from(main.querySelectorAll('.rapier-will-carrier'), node => node.textContent));
 	const markerLost = () => { throw _rapierPrintWillLost('a marker has no readable position on the page', 'Try another browser'); };
-	const range = into.createRange();
+	const range = into.createRange(), segmenter = new Intl.Segmenter(undefined, {granularity: 'grapheme'});
 	let nodes = 0, operations = 0;
 	for (let node; (node = walker.nextNode());) {
 		if (++nodes % 128 === 0) { await new Promise(resolve => setTimeout(resolve, 0)); check(); }
@@ -374,6 +387,7 @@ async function _rapierPrintTextPages(main, pageWidth, count, check, origin = mai
 		const preserve = /pre|break-spaces/.test(style.whiteSpace);
 		const block = element.closest('p,h1,h2,h3,h4,h5,h6,li,pre,td,th,figcaption,blockquote,.rapier-will-carrier') || element;
 		const native = nativeNodes?.get(node);
+		let characters = null;
 		const pageOf = x => Math.max(0, Math.min(count - 1, Math.floor((x - origin.left + .01) / pageWidth)));
 		const visit = (start, end) => {
 			if (++operations % 128 === 0) check();
@@ -385,7 +399,8 @@ async function _rapierPrintTextPages(main, pageWidth, count, check, origin = mai
 			const first = rects[0], page = pageOf(first.left);
 			const oneLine = rects.every(rect => pageOf(rect.left) === page && pageOf(rect.width ? rect.right - .02 : rect.left) === page && Math.abs(rect.top - first.top) < .5);
 			let middle = formula ? start : Math.floor((start + end) / 2);
-			if (middle > start && /[\uD800-\uDBFF]/.test(value[middle - 1]) && /[\uDC00-\uDFFF]/.test(value[middle])) middle--;
+			// A line never breaks inside a character: halve between whole ones (a letter and its marks, a conjunct, an emoji).
+			if (middle > start) middle = (characters ||= segmenter.segment(value)).containing(middle).index;
 			const cluster = native?.find(item => item.start < middle && item.end > middle);
 			if (cluster) middle = cluster.start > start ? cluster.start : cluster.end;
 			if (!oneLine && middle > start && middle < end) { visit(start, middle); visit(middle, end); return; }
@@ -398,7 +413,7 @@ async function _rapierPrintTextPages(main, pageWidth, count, check, origin = mai
 			if (carrier && right === x) right += Array.from(text).length * markerMetrics.advance * markerMetrics.size / 1000;
 			const bottom = Math.max(...rects.map(rect => rect.bottom)) - origin.top;
 			const parts = native ? native.filter(item => item.start >= start && item.end <= end && item.text).map(item => ({...item}))
-				: [{text, x, y, width: right - x, height: bottom - y}];
+				: [{text, x, y, width: right - x, height: bottom - y, rtl: style.direction === 'rtl'}];
 			const last = pages[page].at(-1);
 			if (last && !formula && !last.math && last.block === block && last.carrier === carrier && Math.abs(last.y - y) < Math.max(2, Math.min(last.height, bottom - y) * .2)) {
 				if (!preserve && last.text.endsWith(' ') && text.startsWith(' ') && parts.length) {
@@ -416,6 +431,24 @@ async function _rapierPrintTextPages(main, pageWidth, count, check, origin = mai
 		visit(0, value.length);
 	}
 	check();
+	// Trailing-carrier print CSS pulls a last marker up so it stays on the sheet.
+	// Keep that paint; put the searchable object after the preceding words so
+	// reading order matches the source (the marker itself has no visible ink).
+	const pageHeight = origin.height;
+	for (const page of pages) {
+		let prev = null;
+		for (const run of page) {
+			if (run.carrier && prev && run.y + 0.25 < prev.y + prev.height * .8) {
+				const next = Math.min(pageHeight - 0.5, prev.y + prev.height * .85);
+				if (next > run.y) {
+					const dy = next - run.y;
+					run.y += dy;
+					for (const part of run.parts || []) part.y += dy;
+				}
+			}
+			prev = run;
+		}
+	}
 	return pages.map(page => page.map(({block, carrier, ...run}) => run));
 }
 
@@ -450,6 +483,28 @@ function _rapierPrintLinkPages(main, width, height, count) {
   return {_rapierWillSentinelPlan, _rapierPrintWillAdmit, _rapierPrintWillFont, _rapierPrintWillMetrics, _rapierPrintWillPlace, _rapierPrintWillLost, _rapierPrintWillPageCss, _rapierWritePrintPdf};
 }
 
+// Where each scalar of an invisible text run stands, in character slots from the run's left edge: a mark shares its letter's
+// slot, a right-to-left word runs from the right, and so do the words of a right-to-left line (strong letters only; one line).
+function _rapierPrintSlots(text, rtl) {
+	const pieces = [];
+	let scalars = 0, count = 0;
+	for (const {segment} of new Intl.Segmenter(undefined, {granularity: 'grapheme'}).segment(text)) {
+		const dir = /[\p{Script=Arabic}\p{Script=Hebrew}\p{Script=Syriac}\p{Script=Thaana}\p{Script=Nko}]/u.test(segment) ? 'r' : /\p{L}/u.test(segment) ? 'l' : '';
+		const cluster = {from: scalars, length: Array.from(segment).length}, last = pieces.at(-1);
+		scalars += cluster.length; count++;
+		if (last && (!dir || !last.dir || last.dir === dir)) { last.clusters.push(cluster); last.dir ||= dir; }
+		else pieces.push({dir, clusters: [cluster]});
+	}
+	const slots = new Array(scalars);
+	let slot = 0;
+	for (const piece of rtl ? pieces.reverse() : pieces) {
+		for (const cluster of (piece.dir || (rtl ? 'r' : 'l')) === 'r' ? piece.clusters.reverse() : piece.clusters) {
+			slots.fill(slot++, cluster.from, cluster.from + cluster.length);
+		}
+	}
+	return {slots, count};
+}
+
 // A standard PDF page tree, image streams, Unicode text and an associated source file.
 // It accepts already-rendered pages, so there is no second document grammar or layout engine.
 async function writeRasterPdf({pages, textPages, linkPages = [], vectorPages = [], canonical, bom = false, filename, title, font, width, height, margins, pixelWidth, pixelHeight, pageNumbers, maxBytes, check}) {
@@ -515,24 +570,31 @@ async function writeRasterPdf({pages, textPages, linkPages = [], vectorPages = [
 		const type = add('<< /Type /Font /Subtype /Type0 /BaseFont /' + name + ' /Encoding /Identity-H /DescendantFonts [' + descendant + ' 0 R] /ToUnicode ' + mapping + ' 0 R >>');
 		nativeResources.push(entry.name + ' ' + type + ' 0 R');
 	}
+	const sharedImages = new Map();
 	for (let index = 0; index < pages.length; index++) {
 		check();
-		const picture = stream('/Type /XObject /Subtype /Image /Width ' + pixelWidth + ' /Height ' + pixelHeight + ' /ColorSpace /DeviceRGB /BitsPerComponent 8 /Filter /' + (pages[index].rgb ? 'FlateDecode' : 'DCTDecode'), pages[index].rgb || pages[index]);
+		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 = 'q\n' + [decimal(pixelWidth * .75), 0, 0, decimal(pixelHeight * .75), decimal(margins.left), decimal(height - margins.top - pixelHeight * .75)].join(' ') + ' cm\n/Im0 Do\nQ\n';
-		const pictures = ['/Im0 ' + picture + ' 0 R'], states = [], rasterCache = new Map();
+		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';
 			for (const piece of drawing.sequence) {
 				if (piece.image) {
-					let name = rasterCache.get(piece.image);
-					if (!name) {
+					let shared = sharedImages.get(piece.image);
+					if (!shared) {
 						const image = piece.image;
 						const mask = stream('/Type /XObject /Subtype /Image /Width ' + image.width + ' /Height ' + image.height + ' /ColorSpace /DeviceGray /BitsPerComponent 8 /Filter /FlateDecode', image.alpha);
 						const object = stream('/Type /XObject /Subtype /Image /Width ' + image.width + ' /Height ' + image.height + ' /ColorSpace /DeviceRGB /BitsPerComponent 8 /SMask ' + mask + ' 0 R /Filter /FlateDecode', image.rgb);
-						name = '/Im' + pictures.length; pictures.push(name + ' ' + object + ' 0 R'); rasterCache.set(image, name);
+						image.alpha = image.rgb = null;
+						const name = '/Im' + (sharedImages.size + 1);
+						shared = {name, resource: name + ' ' + object + ' 0 R'};
+						sharedImages.set(piece.image, shared);
 					}
-					commands += `q\n${[piece.width, 0, 0, -piece.height, piece.x, piece.y + piece.height].map(decimal).join(' ')} cm\n${name} Do\nQ\n`;
+					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`;
 				} else {
 					const state = '/Gs' + states.length;
 					states.push(state + ' ' + add('<< /Type /ExtGState /ca ' + decimal(piece.fillAlpha) + ' /CA ' + decimal(piece.strokeAlpha) + ' >>') + ' 0 R');
@@ -556,11 +618,12 @@ async function writeRasterPdf({pages, textPages, linkPages = [], vectorPages = [
 					commands += `${state} gs\n${part.rgba.slice(0, 3).map(decimal).join(' ')} rg\n${entry.name} ${decimal(part.size * .75)} Tf\n0 Tr\n1 0 0 1 ${decimal(margins.left + part.x * .75)} ${decimal(height - margins.top - part.baseline * .75)} Tm\n<${value}> Tj\n`;
 				} else {
 					const characters = Array.from(part.text); if (!characters.length) continue;
-					const advance = part.width * .75 / characters.length, size = Math.max(.1, advance * 2), scaleY = Math.max(.1, part.height * .75) / size;
+					const {slots, count} = _rapierPrintSlots(part.text, part.rtl);
+					const advance = part.width * .75 / count, size = Math.max(.1, advance * 2), scaleY = Math.max(.1, part.height * .75) / size;
 					const baseline = decimal(height - margins.top - (part.y + part.height * .8) * .75);
 					for (let letter = 0; letter < characters.length; letter++) {
 						const value = codes.get(characters[letter].codePointAt(0)).toString(16).padStart(4, '0');
-						commands += `/F1 ${decimal(size)} Tf\n3 Tr\n1 0 0 ${decimal(scaleY)} ${decimal(margins.left + part.x * .75 + letter * advance)} ${baseline} Tm\n<${value}> Tj\n`;
+						commands += `/F1 ${decimal(size)} Tf\n3 Tr\n1 0 0 ${decimal(scaleY)} ${decimal(margins.left + part.x * .75 + slots[letter] * advance)} ${baseline} Tm\n<${value}> Tj\n`;
 					}
 				}
 			}
@@ -580,14 +643,27 @@ async function writeRasterPdf({pages, textPages, linkPages = [], vectorPages = [
 	put(2, '<< /Type /Pages /Count ' + kids.length + ' /Kids [' + kids.map(id => id + ' 0 R').join(' ') + '] >>');
 	put(1, '<< /Type /Catalog /Pages 2 0 R /Names << /EmbeddedFiles << /Names [<feff' + hex(filename) + '> ' + file + ' 0 R] >> >> /AF [' + file + ' 0 R] >>');
 	const info = add('<< /Producer (Rapier) /Title <feff' + hex(title || filename.replace(/\.[^.]*$/, '')) + '> >>');
-	const parts = [encode('%PDF-1.7\n%\u00e2\u00e3\u00cf\u00d3\n')], offsets = [0];
-	let length = parts[0].length;
+	const header = encode('%PDF-1.7\n%\u00e2\u00e3\u00cf\u00d3\n'), offsets = new Array(objects.length);
+	let cursor = header.length;
+	for (let id = 1; id < objects.length; id++) {
+		offsets[id] = cursor;
+		cursor += (id + ' 0 obj\n').length + objects[id].length + 8;
+	}
+	const xrefAt = cursor;
+	const xref = encode('xref\n0 ' + objects.length + '\n0000000000 65535 f \n' + offsets.slice(1).map(at => String(at).padStart(10, '0') + ' 00000 n \n').join('') + 'trailer\n<< /Size ' + objects.length + ' /Root 1 0 R /Info ' + info + ' 0 R >>\nstartxref\n' + xrefAt + '\n%%EOF\n');
+	if (cursor + xref.length > maxBytes) fail('export_too_large');
+	const bytes = new Uint8Array(cursor + xref.length);
+	bytes.set(header, 0);
+	let at = header.length;
 	for (let id = 1; id < objects.length; id++) {
-		offsets.push(length);
-		const body = concat([encode(id + ' 0 obj\n'), objects[id], encode('\nendobj\n')]); parts.push(body); length += body.length;
+		const prefix = encode(id + ' 0 obj\n');
+		bytes.set(prefix, at); at += prefix.length;
+		bytes.set(objects[id], at); at += objects[id].length;
+		objects[id] = null;
+		const suffix = encode('\nendobj\n');
+		bytes.set(suffix, at); at += suffix.length;
 	}
-	const xref = length;
-	parts.push(encode('xref\n0 ' + objects.length + '\n0000000000 65535 f \n' + offsets.slice(1).map(at => String(at).padStart(10, '0') + ' 00000 n \n').join('') + 'trailer\n<< /Size ' + objects.length + ' /Root 1 0 R /Info ' + info + ' 0 R >>\nstartxref\n' + xref + '\n%%EOF\n'));
-	const bytes = concat(parts); if (bytes.length > maxBytes) fail('export_too_large'); return bytes;
+	bytes.set(xref, at);
+	return bytes;
 }
 export {createPrintRenderer, applyPrintCapitals, RAPIER_WILL_SENTINEL_MARK as sentinel};

package/dist/kit/render-sanitize.mjs

@@ -1,4 +1,5 @@
 // SPDX-License-Identifier: MIT
+import {typography} from '../spec/md-marks.mjs';
 const RAPIER_SANITIZE_FORBID_TAGS = Object.freeze(['form', 'style', 'dialog', 'template', 'iframe']);
 const RAPIER_SANITIZE_FORBID_ATTR = Object.freeze(['action', 'formaction', 'form', 'for']);
 // The document profiles use one allowlist in a browser and in an inert server parser.
@@ -6,7 +7,7 @@ const RAPIER_SANITIZE_PROFILES = Object.freeze({
 	htmlTags: Object.freeze(["a","abbr","acronym","address","area","article","aside","audio","b","bdi","bdo","big","blink","blockquote","body","br","button","canvas","caption","center","cite","code","col","colgroup","content","data","datalist","dd","decorator","del","details","dfn","dialog","dir","div","dl","dt","element","em","fieldset","figcaption","figure","font","footer","form","h1","h2","h3","h4","h5","h6","head","header","hgroup","hr","html","i","img","input","ins","kbd","label","legend","li","main","map","mark","marquee","menu","menuitem","meter","nav","nobr","ol","optgroup","option","output","p","picture","pre","progress","q","rp","rt","ruby","s","samp","search","section","select","shadow","slot","small","source","spacer","span","strike","strong","style","sub","summary","sup","table","tbody","td","template","textarea","tfoot","th","thead","time","tr","track","tt","u","ul","var","video","wbr"]),
 	svgTags: Object.freeze(["svg","a","altglyph","altglyphdef","altglyphitem","animatecolor","animatemotion","animatetransform","circle","clippath","defs","desc","ellipse","enterkeyhint","exportparts","filter","font","g","glyph","glyphref","hkern","image","inputmode","line","lineargradient","marker","mask","metadata","mpath","part","path","pattern","polygon","polyline","radialgradient","rect","stop","style","switch","symbol","text","textpath","title","tref","tspan","view","vkern"]),
 	mathTags: Object.freeze(["math","menclose","merror","mfenced","mfrac","mglyph","mi","mlabeledtr","mmultiscripts","mn","mo","mover","mpadded","mphantom","mroot","mrow","ms","mspace","msqrt","mstyle","msub","msup","msubsup","mtable","mtd","mtext","mtr","munder","munderover","mprescripts"]),
-	htmlAttributes: Object.freeze(["accept","action","align","alt","autocapitalize","autocomplete","autopictureinpicture","autoplay","background","bgcolor","border","capture","cellpadding","cellspacing","checked","cite","class","clear","color","cols","colspan","command","commandfor","controls","controlslist","coords","crossorigin","datetime","decoding","default","dir","disabled","disablepictureinpicture","disableremoteplayback","download","draggable","enctype","enterkeyhint","exportparts","face","for","headers","height","hidden","high","href","hreflang","id","inert","inputmode","integrity","ismap","kind","label","lang","list","loading","loop","low","max","maxlength","media","method","min","minlength","multiple","muted","name","nonce","noshade","novalidate","nowrap","open","optimum","part","pattern","placeholder","playsinline","popover","popovertarget","popovertargetaction","poster","preload","pubdate","radiogroup","readonly","rel","required","rev","reversed","role","rows","rowspan","spellcheck","scope","selected","shape","size","sizes","slot","span","srclang","start","src","srcset","step","style","summary","tabindex","title","translate","type","usemap","valign","value","width","wrap","xmlns"]),
+	htmlAttributes: Object.freeze(["accept","action","align","alt","autocapitalize","autocomplete","autopictureinpicture","autoplay","background","bgcolor","border","capture","cellpadding","cellspacing","checked","cite","class","clear","color","cols","colspan","controls","controlslist","coords","crossorigin","datetime","decoding","default","dir","disabled","disablepictureinpicture","disableremoteplayback","download","draggable","enctype","enterkeyhint","exportparts","face","for","headers","height","hidden","high","href","hreflang","id","inert","inputmode","integrity","ismap","kind","label","lang","list","loading","loop","low","max","maxlength","media","method","min","minlength","multiple","muted","name","nonce","noshade","novalidate","nowrap","open","optimum","part","pattern","placeholder","playsinline","poster","preload","pubdate","radiogroup","readonly","rel","required","rev","reversed","role","rows","rowspan","spellcheck","scope","selected","shape","size","sizes","slot","span","srclang","start","src","srcset","step","style","summary","tabindex","title","translate","type","usemap","valign","value","width","wrap","xmlns"]),
 	svgAttributes: Object.freeze(["accent-height","accumulate","additive","alignment-baseline","amplitude","ascent","attributename","attributetype","azimuth","basefrequency","baseline-shift","begin","bias","by","class","clip","clippathunits","clip-path","clip-rule","color","color-interpolation","color-interpolation-filters","color-profile","color-rendering","cx","cy","d","dx","dy","diffuseconstant","direction","display","divisor","dominant-baseline","dur","edgemode","elevation","end","exponent","fill","fill-opacity","fill-rule","filter","filterunits","flood-color","flood-opacity","font-family","font-size","font-size-adjust","font-stretch","font-style","font-variant","font-weight","fx","fy","g1","g2","glyph-name","glyphref","gradientunits","gradienttransform","height","href","id","image-rendering","in","in2","intercept","k","k1","k2","k3","k4","kerning","keypoints","keysplines","keytimes","lang","lengthadjust","letter-spacing","kernelmatrix","kernelunitlength","lighting-color","local","marker-end","marker-mid","marker-start","markerheight","markerunits","markerwidth","maskcontentunits","maskunits","max","mask","mask-type","media","method","mode","min","name","numoctaves","offset","operator","opacity","order","orient","orientation","origin","overflow","paint-order","path","pathlength","patterncontentunits","patterntransform","patternunits","pointer-events","points","preservealpha","preserveaspectratio","primitiveunits","r","rx","ry","radius","refx","refy","repeatcount","repeatdur","restart","result","rotate","scale","seed","shape-rendering","slope","specularconstant","specularexponent","spreadmethod","startoffset","stddeviation","stitchtiles","stop-color","stop-opacity","stroke-dasharray","stroke-dashoffset","stroke-linecap","stroke-linejoin","stroke-miterlimit","stroke-opacity","stroke","stroke-width","style","surfacescale","systemlanguage","tabindex","tablevalues","targetx","targety","transform","transform-origin","text-anchor","text-decoration","text-orientation","text-rendering","textlength","type","u1","u2","unicode","values","vector-effect","viewbox","visibility","version","vert-adv-y","vert-origin-x","vert-origin-y","width","word-spacing","wrap","writing-mode","xchannelselector","ychannelselector","x","x1","x2","xmlns","y","y1","y2","z","zoomandpan"]),
 	mathAttributes: Object.freeze(["accent","accentunder","align","bevelled","close","columnalign","columnlines","columnspacing","columnspan","denomalign","depth","dir","display","displaystyle","encoding","fence","frame","height","href","id","largeop","length","linethickness","lquote","lspace","mathbackground","mathcolor","mathsize","mathvariant","maxsize","minsize","movablelimits","notation","numalign","open","rowalign","rowlines","rowspacing","rowspan","rspace","rquote","scriptlevel","scriptminsize","scriptsizemultiplier","selection","separator","separators","stretchy","subscriptshift","supscriptshift","symmetric","voffset","width","xmlns"]),
 	xmlAttributes: Object.freeze(["xlink:href","xml:id","xlink:title","xml:space","xmlns:xlink"]),
@@ -166,7 +167,7 @@ function createInertHtmlSanitizer({parseFragment, serialize, sanitizeHtml, safeR
 							if (!_rapierImageDataAttributeAllowed(tag, key, compact, safeRasterDataUrl)) continue;
 						} else if (!uri.test(compact)) continue;
 					}
-					attribs[name] = value;
+					attribs[name] = selected === 'raw' && tag === 'span' && key === 'style' ? typography.style(typography.parseStyle(value)) : value;
 				}
 				if ((tag === 'a' || tag === 'area') && attribs.target?.trim().toLowerCase() === '_blank') attribs.rel = 'noopener noreferrer';
 				return {tagName, attribs};
@@ -323,6 +324,11 @@ function _rapierInstallSanitizeHooks() {
 	});
 	DOMPurify.addHook('uponSanitizeAttribute', (node, data) => {
 		const value = String(data.attrValue == null ? '' : data.attrValue);
+		if (_rapierSanitizeRuntime.context === 'raw' && node?.nodeName === 'SPAN' && data.attrName?.toLowerCase() === 'style') {
+			data.attrValue = typography.style(typography.parseStyle(value));
+			data.keepAttr = !!data.attrValue;
+			return;
+		}
 		// A document's own HTML never carries an id the chrome owns, remote content allowed or not: the
 		// allow is about what the page fetches, and this rule is about what the page's chrome finds.
 		if (String(data.attrName || '').toLowerCase() === 'id' && _rapierSanitizeRuntime.context === 'raw' && _rapierChromeOwnsId(value)) { data.keepAttr = false; return; }
@@ -371,6 +377,16 @@ function _rapierInstallSanitizeHooks() {
 }
 
 function sanitizeRapierHtml(value, context = 'render') {
+	return sanitize(value, context, false);
+}
+
+// The same parser, profile and hooks admit both results. A private renderer can
+// adopt the sanitized nodes without serializing and parsing them again.
+function sanitizeRapierFragment(value, context = 'render') {
+	return sanitize(value, context, true);
+}
+
+function sanitize(value, context, fragment) {
 	// 'export' is the render profile under the export hooks; 'raw' is a document's own HTML (initMarkdownIt, html_block):
 	// the render profile without data-* attributes, which Rapier's delegated handlers read as their own controls, and
 	// (the hook) without an id the chrome owns. 'source' is Markdown source HTML, written and never shown: the render
@@ -389,6 +405,8 @@ function sanitizeRapierHtml(value, context = 'render') {
 		DOMPurify.addHook('uponSanitizeAttribute', diagramLabelAttribute);
 		DOMPurify.addHook('afterSanitizeAttributes', diagramLabelContained);
 	}
+	if (fragment) options = {...options, RETURN_DOM_FRAGMENT: true};
+	const previous = _rapierSanitizeRuntime.context;
 	_rapierSanitizeRuntime.context = selected;
 	try {
 		return DOMPurify.sanitize(value == null ? '' : String(value), options);
@@ -398,7 +416,7 @@ function sanitizeRapierHtml(value, context = 'render') {
 			DOMPurify.removeHook('uponSanitizeAttribute', diagramLabelAttribute);
 			DOMPurify.removeHook('afterSanitizeAttributes', diagramLabelContained);
 		}
-		_rapierSanitizeRuntime.context = 'render';
+		_rapierSanitizeRuntime.context = previous;
 	}
 }
 
@@ -412,9 +430,11 @@ function escapeRapierHtmlText(value) {
 }
 
 function _rapierChromeOwnsId(id) {
-	// Every id the shell's own markup carries, read once before any document renders (initMarkdownIt primes it).
+	// Every id the shell's own markup carries, read once before any document renders (initMarkdownIt primes it),
+	// and every rapier- id: the chrome makes its dialogs, overlays, parts and plug-in list later, under that prefix
+	// (rapier-anchor- is the renderer's own name for a repeated document anchor, and stays the document's).
 	if (!_rapierSanitizeRuntime.chromeIds) _rapierSanitizeRuntime.chromeIds = new Set(Array.from(typeof document?.querySelectorAll === 'function' ? document.querySelectorAll('[id]') : [], element => element.id));
-	return _rapierSanitizeRuntime.chromeIds.has(String(id));
+	return _rapierSanitizeRuntime.chromeIds.has(String(id)) || /^rapier-(?!anchor-)/.test(id);
 }
 
 function _rapierSafeRasterDataUrl(value) {
@@ -472,7 +492,7 @@ function _rapierStyleWithoutRemoteUrls(value) {
 	if (!raw) return raw;
 	const declaration = _rapierCssDeclaration();
 	declaration.cssText = raw;
-	if (!declaration.length) return '';
+	if (!declaration.length) return typography.style(typography.parseStyle(raw));
 	return _rapierDropRemoteDeclarations(declaration) ? declaration.cssText : raw;
 }
 
@@ -504,12 +524,15 @@ function _rapierVerifyRasterBytes(bytes, mime) {
 	// declaration, doctype or generator/license comment before <svg itself, of whatever length its
 
 	if (mime === 'image/svg+xml') return /<svg[\s>]/i.test(new TextDecoder('utf-8', {fatal: false}).decode(bytes));
+	if (mime === 'image/gif') return bytes.length >= 13 && /^GIF8[79]a$/.test(String.fromCharCode(...bytes.subarray(0, 6)));
 	if (mime === 'image/png') return bytes.length >= 8 && bytes[0] === 0x89 && bytes[1] === 0x50 && bytes[2] === 0x4e && bytes[3] === 0x47 && bytes[4] === 0x0d && bytes[5] === 0x0a && bytes[6] === 0x1a && bytes[7] === 0x0a;
 	if (mime === 'image/jpeg') return bytes.length >= 3 && bytes[0] === 0xff && bytes[1] === 0xd8 && bytes[2] === 0xff;
 	if (mime === 'image/webp') return bytes.length >= 12 && String.fromCharCode(...bytes.slice(0, 4)) === 'RIFF' && String.fromCharCode(...bytes.slice(8, 12)) === 'WEBP';
 	return false;
 }
 
-  return {_rapierVerifyRasterBytes, _rapierInstallSanitizeHooks, sanitizeRapierHtml, diagramLabelStyle, escapeRapierHtmlText, _rapierChromeOwnsId, _rapierSafeRasterDataUrl, _rapierCssPresentationIsRemote, _rapierRemoteSubresourceOrigin, _rapierStyleWithoutRemoteUrls, _rapierStylesheetWithoutRemoteUrls, _rapierDropRemoteRules};
+  return {_rapierVerifyRasterBytes, _rapierInstallSanitizeHooks, sanitizeRapierHtml,
+    sanitizeRapierFragment: typeof DOMPurify?.sanitize === 'function' ? sanitizeRapierFragment : undefined,
+    diagramLabelStyle, escapeRapierHtmlText, _rapierChromeOwnsId, _rapierSafeRasterDataUrl, _rapierCssPresentationIsRemote, _rapierRemoteSubresourceOrigin, _rapierStyleWithoutRemoteUrls, _rapierStylesheetWithoutRemoteUrls, _rapierDropRemoteRules};
 }
 export {RAPIER_SANITIZE_FORBID_TAGS as forbidTags, RAPIER_SANITIZE_FORBID_ATTR as forbidAttributes, createRenderSanitizer, createInertHtmlSanitizer, RAPIER_SANITIZE_OPTIONS as options, prepareMathSource};

package/dist/kit/render-work.mjs

@@ -7,6 +7,7 @@ export function finish(iterator) {
 }
 
 export function check(work) {
+	work?.check?.();
   if (work?.signal?.aborted) throw Object.assign(new Error('The operation was cancelled.'), {name: 'AbortError', code: 'cancelled'});
 }
 
@@ -72,16 +73,18 @@ export function htmlBoundary() {
 
 export async function finishAsync(iterator, work) {
   let began = performance.now(), next;
-  check(work);
-  do {
-    next = iterator.next();
-    if (!next.done && performance.now() - began >= 8) {
-      await pause(work);
-      began = performance.now();
-    }
-  } while (!next.done);
-  check(work);
-  return next.value;
+  try {
+    do {
+      check(work);
+      next = iterator.next();
+      if (!next.done && performance.now() - began >= 8) {
+        await pause(work);
+        began = performance.now();
+      }
+    } while (!next.done);
+    check(work);
+    return next.value;
+  } finally { if (!next?.done) iterator.return?.(); }
 }
 
 export function* cloneTree(root) {
@@ -98,25 +101,98 @@ export function* cloneTree(root) {
   return copy;
 }
 
-export function* htmlParts(root, limit = 16384) {
+// Null entries are traversal checkpoints, never fragment boundaries. A large
+// nested unit is serialized cooperatively but is still admitted as one complete
+// HTML/namespace unit by the synchronous parser and sanitizer.
+export function* htmlParts(root, limit = 16384, consume = false) {
+  limit = Math.max(2, limit);
   const text = root.ownerDocument.createElement('div');
+  const small = node => {
+    let count = 0, chars = 0, at = node;
+    while (at) {
+      if (++count > 128) return false;
+      if (at.nodeType === 1) for (const attribute of at.attributes) chars += attribute.value.length + attribute.name.length;
+      else chars += at.nodeValue?.length || 0;
+      if (chars > limit) return false;
+      if (at.firstChild) at = at.firstChild;
+      else {
+        while (at !== node && !at.nextSibling) at = at.parentNode;
+        at = at === node ? null : at.nextSibling;
+      }
+    }
+    return true;
+  };
+  const nativeHtml = node => {
+    if (node.nodeType === 1) return node.outerHTML;
+    text.replaceChildren(node.cloneNode(false)); return text.innerHTML;
+  };
+  const nodeHtml = function* (node) {
+    if (small(node)) return nativeHtml(node);
+    const pieces = [], stack = [];
+    let at = node;
+    while (at) {
+      yield null;
+      if (at.nodeType === 1) {
+        if (small(at)) pieces.push(at.outerHTML);
+        else {
+          // Native shallow serialization owns tag/attribute spelling and
+          // escaping. Native text serialization below keeps its parent context.
+          const empty = at.cloneNode(false);
+          // A foreign element with children must retain its native closing tag
+          // even in an inert DOM that self-closes an empty SVG element.
+          if (at.firstChild) empty.appendChild(root.ownerDocument.createTextNode(''));
+          const shell = empty.outerHTML, close = /<\/[^<>]+>$/.exec(shell)?.[0] || '';
+          if (close && at.firstChild) {
+            pieces.push(shell.slice(0, -close.length));
+            stack.push({node: at, close}); at = at.firstChild; continue;
+          }
+          pieces.push(shell);
+        }
+      } else if (at.nodeType === 3 && at.nodeValue.length > limit) {
+        const parent = at !== node && at.parentNode?.nodeType === 1 ? at.parentNode.cloneNode(false) : text;
+        const value = at.nodeValue;
+        for (let start = 0; start < value.length;) {
+          let end = Math.min(start + limit, value.length);
+          if (end < value.length && value.charCodeAt(end - 1) >= 0xd800 && value.charCodeAt(end - 1) <= 0xdbff) end--;
+          parent.replaceChildren(root.ownerDocument.createTextNode(value.slice(start, end)));
+          pieces.push(parent.innerHTML); start = end; yield null;
+        }
+        parent.replaceChildren();
+      } else if (at.nodeType === 3 && at.parentNode?.nodeType === 1) {
+        const parent = at.parentNode.cloneNode(false);
+        parent.appendChild(at.cloneNode(false)); pieces.push(parent.innerHTML);
+      } else pieces.push(nativeHtml(at));
+      while (at !== node && !at.nextSibling) { const frame = stack.pop(); pieces.push(frame.close); at = frame.node; }
+      at = at === node ? null : at.nextSibling;
+    }
+    return pieces.join('');
+  };
   let part = '';
-  for (let node = root.firstChild; node; node = node.nextSibling) {
-    let html;
-    if (node.nodeType === 1) html = node.outerHTML;
-    else { text.replaceChildren(node.cloneNode(false)); html = text.innerHTML; }
+  for (let node = root.firstChild; node;) {
+    const next = node.nextSibling;
+    const html = yield* nodeHtml(node);
     if (part && part.length + html.length > limit) { yield part; part = ''; }
     part += html;
+    if (consume) root.removeChild(node);
+    node = next;
   }
   if (part) yield part;
 }
 
-export function* cleanTree(root, sanitize, context = 'export') {
+export function admitHtml(root, html, sanitize, fragment = null, context = 'export') {
+  if (fragment) root.appendChild(fragment(html, context));
+  else {
+    // Inert string-only hosts retain their explicitly supported admission path.
+    const part = root.ownerDocument.createElement('div');
+    part.innerHTML = sanitize(html, context);
+    while (part.firstChild) root.appendChild(part.firstChild);
+  }
+}
+
+export function* cleanTree(root, sanitize, context = 'export', fragment = null) {
   const clean = root.ownerDocument.createElement('div');
-  const part = root.ownerDocument.createElement('div');
   for (const html of htmlParts(root)) {
-    part.innerHTML = sanitize(html, context);
-    while (part.firstChild) clean.appendChild(part.firstChild);
+    if (html !== null) admitHtml(clean, html, sanitize, fragment, context);
     yield;
   }
   return clean;
@@ -124,7 +200,10 @@ export function* cleanTree(root, sanitize, context = 'export') {
 
 export function* serializeTree(root, sanitize = null, trim = false) {
   const parts = [];
-  for (const html of htmlParts(root)) { parts.push(sanitize ? sanitize(html, 'export') : html); yield; }
+  for (const html of htmlParts(root)) {
+    if (html !== null) parts.push(sanitize ? sanitize(html, 'export') : html);
+    yield;
+  }
   const result = parts.join('');
   return trim ? result.trim() : result;
 }