@daydreamui/html-paste 0.0.0-stage → 0.5.0

package/dist/index.js

@@ -0,0 +1,278 @@
+import { flush, untrack } from "solid-js";
+var BLOCK_TAGS = new Set([
+	...[
+		"html",
+		"body",
+		"address",
+		"article",
+		"aside",
+		"blockquote"
+	],
+	...[
+		"caption",
+		"center",
+		"col",
+		"colgroup",
+		"dd",
+		"details",
+		"dialog"
+	],
+	...[
+		"dir",
+		"div",
+		"dl",
+		"dt",
+		"fieldset",
+		"figcaption",
+		"figure"
+	],
+	...[
+		"footer",
+		"form",
+		"h1",
+		"h2",
+		"h3",
+		"h4",
+		"h5",
+		"h6",
+		"header"
+	],
+	...[
+		"hgroup",
+		"hr",
+		"legend",
+		"li",
+		"main",
+		"menu",
+		"nav",
+		"ol"
+	],
+	...[
+		"optgroup",
+		"option",
+		"p",
+		"pre",
+		"search",
+		"section",
+		"summary"
+	],
+	...[
+		"table",
+		"tbody",
+		"td",
+		"tfoot",
+		"th",
+		"thead",
+		"tr",
+		"ul"
+	]
+]);
+var UNSHOWN_TAGS = new Set([...[
+	"head",
+	"meta",
+	"link",
+	"title",
+	"base",
+	"style"
+], ...[
+	"script",
+	"noscript",
+	"template",
+	"object",
+	"embed"
+]]);
+var REPLACED_TAGS = new Set([...[
+	"img",
+	"picture",
+	"video",
+	"audio",
+	"svg",
+	"iframe"
+]]);
+var WRAPPER_TAGS = new Set([
+	...[
+		"p",
+		"h1",
+		"h2",
+		"h3",
+		"h4",
+		"h5",
+		"h6",
+		"pre",
+		"address",
+		"div"
+	],
+	...[
+		"section",
+		"article",
+		"main",
+		"header",
+		"footer",
+		"aside",
+		"nav"
+	],
+	...["blockquote", "center"]
+]);
+function isSingleParagraph(doc) {
+	let scope = doc.body;
+	for (;;) {
+		const children = contentChildren(scope);
+		const elements = children.filter((node) => node.nodeType === Node.ELEMENT_NODE);
+		const hasText = children.some((node) => node.nodeType === Node.TEXT_NODE);
+		const only = elements[0];
+		if (elements.length === 1 && !hasText && only !== void 0) {
+			const tag = only.localName;
+			if (WRAPPER_TAGS.has(tag) || inline(tag) && !REPLACED_TAGS.has(tag)) {
+				scope = only;
+				continue;
+			}
+		}
+		return elements.every(isPhrasingOnly);
+	}
+}
+function hasContent(doc) {
+	if ((doc.body.textContent ?? "").trim() !== "") return true;
+	return Array.from(doc.body.querySelectorAll("*")).some((element) => REPLACED_TAGS.has(element.localName));
+}
+function inline(tag) {
+	return !BLOCK_TAGS.has(tag);
+}
+function contentChildren(scope) {
+	return Array.from(scope.childNodes).filter((node) => {
+		if (node.nodeType === Node.TEXT_NODE) return node.data.trim() !== "";
+		if (node.nodeType !== Node.ELEMENT_NODE) return false;
+		return !UNSHOWN_TAGS.has(node.localName);
+	});
+}
+function isPhrasingOnly(element) {
+	const tag = element.localName;
+	if (UNSHOWN_TAGS.has(tag)) return true;
+	if (!inline(tag) || REPLACED_TAGS.has(tag)) return false;
+	return Array.from(element.children).every(isPhrasingOnly);
+}
+var MAX_ELEMENTS = 1e4;
+var MAX_SOURCE = 4e6;
+function parseHtml(html) {
+	return new DOMParser().parseFromString(withoutBom(html), "text/html");
+}
+var BOM = "";
+function withoutBom(text) {
+	return text.startsWith(BOM) ? text.slice(1) : text;
+}
+function pastedElements(doc) {
+	const count = (root) => {
+		let n = 0;
+		for (const el of root.querySelectorAll("*")) {
+			n += 1;
+			if (el.localName === "template" && "content" in el) n += count(el.content);
+		}
+		return n;
+	};
+	return count(doc.head) + count(doc.body);
+}
+function hasElements(doc) {
+	return doc.body.firstElementChild !== null;
+}
+var DOCTYPE = "<!doctype html>\n";
+function pageFile(source) {
+	if (source.doc.doctype !== null) return source.text;
+	const rest = withoutBom(source.text);
+	return source.text.slice(0, source.text.length - rest.length) + DOCTYPE + rest;
+}
+function looksLikeMarkup(text) {
+	return text.trimStart().startsWith("<") && /<\/[a-z][\w:-]*\s*>/i.test(text);
+}
+function htmlSource(transfer) {
+	if (transfer === null || transfer.files.length > 0) return null;
+	const text = transfer.getData("text/plain");
+	if (looksLikeMarkup(text)) {
+		const doc = parseHtml(text);
+		if (hasElements(doc) && hasContent(doc)) return {
+			text,
+			doc
+		};
+	}
+	const html = transfer.getData("text/html");
+	if (html === "") return null;
+	const doc = parseHtml(html);
+	if (!hasElements(doc) || !hasContent(doc)) return null;
+	if (isSingleParagraph(doc)) return null;
+	return {
+		text: html,
+		doc
+	};
+}
+function registerHtmlPaste(dd) {
+	let consecutivePastes = 0;
+	let pasting = 0;
+	let camera = untrack(() => dd.geometry.camera());
+	const startOver = () => {
+		consecutivePastes = 0;
+	};
+	const reset = () => {
+		if (pasting === 0) startOver();
+	};
+	dd.canvas.onActivity(startOver);
+	dd.on("document", reset);
+	dd.on("selection", reset);
+	dd.on("geometry", () => {
+		const next = untrack(() => dd.geometry.camera());
+		if (next.panX !== camera.panX || next.panY !== camera.panY || next.zoom !== camera.zoom) startOver();
+		camera = next;
+	});
+	const why = (error) => error instanceof Error ? error.message : String(error);
+	const land = async (text, position) => {
+		pasting += 1;
+		try {
+			let made;
+			try {
+				made = await dd.createPage(text, {
+					position,
+					frame: { width: 960 }
+				});
+			} catch (error) {
+				console.error(`[${dd.plugin.id}] paste refused: ${why(error)}`);
+				return;
+			}
+			try {
+				dd.select(made.viewportId);
+				flush();
+			} catch (error) {
+				console.error(`[${dd.plugin.id}] pasted a page: ${made.path}, but its viewport could not be selected: ${why(error)}`);
+				return;
+			}
+			console.info(`[${dd.plugin.id}] pasted a page: ${made.path}, 960px wide`);
+			for (const { url, reason } of made.unvendored) console.warn(`[${dd.plugin.id}] ${url} could not be downloaded into assets/ (${reason}): it stays as written`);
+		} finally {
+			pasting -= 1;
+		}
+	};
+	dd.canvas.onPaste((event) => {
+		const transfer = event.clipboardData;
+		const bytes = Math.max(transfer?.getData("text/html").length ?? 0, transfer?.getData("text/plain").length ?? 0);
+		if (bytes > 4e6) {
+			event.preventDefault();
+			console.error(`[${dd.plugin.id}] paste refused: ${bytes} characters; a paste carries at most ${MAX_SOURCE}`);
+			return;
+		}
+		const source = htmlSource(transfer);
+		if (source === null) return;
+		event.preventDefault();
+		const size = pastedElements(source.doc);
+		if (size > 1e4) {
+			console.error(`[${dd.plugin.id}] paste refused: ${size} elements; a viewport holds at most ${MAX_ELEMENTS}`);
+			return;
+		}
+		const cascade = consecutivePastes++ * 16;
+		const center = dd.canvas.center();
+		const position = {
+			x: center.x - 480 + cascade,
+			y: center.y - 240 + cascade
+		};
+		land(pageFile(source), position);
+	}, { priority: 5 });
+}
+function activate(dd) {
+	registerHtmlPaste(dd);
+}
+export { activate as default };

package/icon.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke-width="1.8" stroke-linecap="square" stroke-linejoin="miter">
+  <path d="M6.5 5H4v16h16V5h-2.5" stroke="#839999"/>
+  <path d="M8 2h8v4H8V2Z" fill="#F66A2C"/>
+  <path d="m9.5 10-3 3 3 3m5-6 3 3-3 3" stroke="#E7E5DE"/>
+</svg>

package/manifest.json

@@ -0,0 +1,11 @@
+{
+  "id": "daydream.html-paste",
+  "name": "HTML paste",
+  "description": "Paste HTML on the canvas and it becomes a new page of the project.",
+  "version": "0.5.0",
+  "api": "3.1",
+  "contributes": {
+    "instructions": "Pasting HTML on the canvas (Cmd+V with markup as plain text, or text/html that is more than a single paragraph of prose; a paragraph copied from a page lands as canvas text through the Text plugin instead) makes a new page of the project: the pasted text is written as a new html file, as it arrived \u2014 its <style> and <link> kept, nothing cleaned or folded, a fragment written after <!doctype html> so a browser renders the file as the canvas does \u2014 named index.html in a project with no page yet, else after its <title> made file-safe (page.html with none; -2 and on while the name is taken), at the project's root. Each remote image, video, audio, text track and font file it names is downloaded into assets/ and named there; one that cannot be stays as written, and the console says which and why. A viewport of the page, 960px wide, is placed at the view's center and selected, as one undo step. A paste with no project open is refused, in Daydream's words, and one of more than 10,000 elements or four million characters is refused before anything is written. No gates run on a paste; lint judges the page as it judges every page."
+  },
+  "built": "dist/index.js"
+}

package/package.json

@@ -1,6 +1,17 @@
 {
   "name": "@daydreamui/html-paste",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.5.0",
+  "type": "module",
+  "description": "Paste HTML on the canvas and it becomes a new page of the project.",
+  "keywords": [
+    "daydream-plugin"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/martinbavio/daydream-plugins.git",
+    "directory": "plugins/daydream.html-paste"
+  }
+}

package/README.md

@@ -1,3 +0,0 @@
-# Temporary Holding Version
-
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.