u2ui 1.5.11 → 1.5.12

package/js/rte/PLAN.md

@@ -71,10 +71,13 @@ command ever makes an element canonical — so a strict list would otherwise hav
 turned every pasted emphasis into plain text.
 
 Not every `text/html` flavor is html. A pdf viewer offers its selection as one
-while putting plain text with line breaks inside it, and importing that as html
-collapsed them all into a single line. `ExternalInput` now takes a paste over
-only when the flavor carries markup, so text stays with the browser, which
-inserts it with its breaks intact.
+while putting plain text inside it, and importing that as html collapsed every
+line break into a single line. `ExternalInput` still decides by flavor list —
+reading the payload before preventing native insertion would give a failed read
+somewhere to fall back to — but the payload now decides what the flavor *is*:
+without a single tag it is text, escaped and joined by breaks, which is all the
+structure such a paste has. A `text/plain` paste with no html flavor beside it
+stays native as before.
 
 Keeping the content of an unlisted element is right for almost all of them, and
 wrong for the few a browser never renders the children of: unwrapping a `<style>`

package/js/rte/src/input/README.md

@@ -103,10 +103,12 @@ const external = new ExternalInput(surface, {
 
 For `insertFromPaste` and `insertFromDrop`, the contenteditable Input Events
 contract supplies rich and plain data in `dataTransfer` plus the DOM range that
-would be replaced. The adapter takes over only when `text/html` is present and
-carries markup: a pdf viewer labels its plain selection `text/html`, and
-importing that as html would collapse the line breaks the text flavor keeps, so
-a flavor without a single tag is left to the browser. It
+would be replaced. The adapter takes over only when `text/html` is present, and
+the payload then decides what that flavor is: markup is imported as it stands,
+while a flavor carrying none is the text it is — a pdf viewer labels its plain
+selection `text/html` — and its line breaks, the only structure such a text has,
+become breaks instead of collapsing. Reading the payload happens after native
+insertion is prevented, so a failing read cannot fall back to it. It
 prevents native insertion first, sanitizes into a detached `DocumentFragment`,
 optionally cleans presentation cumulatively through the selected level, and
 passes the result and exact target range to the registered command. Drop thus

package/js/rte/src/input/external-input.js

@@ -2,6 +2,7 @@ import {inputRange} from './input-pipeline.js';
 import {editingHost, isPlainTextHost} from '../selection/ownership/ownership.js';
 
 const INPUTS = new Set(['insertFromPaste', 'insertFromDrop']);
+const ENTITIES = {'&': '&amp;', '<': '&lt;', '>': '&gt;'};
 
 // Owns rich external HTML before the browser can insert it. The selected
 // sanitizer, optional presentation cleanup, and mapped insertion command stay
@@ -97,12 +98,11 @@ export class ExternalInput {
     #beforeInput = event => {
         if (!this.#owns(event) || !INPUTS.has(event.inputType) || !event.cancelable
             || event.defaultPrevented || event.isComposing || isPlainTextHost(this.#root)) return;
-        if (!hasMarkup(event.dataTransfer)) return;
+        if (!hasHtml(event.dataTransfer)) return;
         event.preventDefault();
         try {
-            const html = event.dataTransfer.getData('text/html');
             const range = inputRange(event, this.#surface);
-            this.insert(html, {range, inputType: event.inputType});
+            this.insert(importHtml(event.dataTransfer), {range, inputType: event.inputType});
         } catch (error) {
             this.#surface.emit('u2-rte-error', {
                 transaction: null,
@@ -123,13 +123,18 @@ export class ExternalInput {
     }
 }
 
-// An html flavor carrying no markup is text that was labelled html — a pdf viewer offers its
-// selection that way. Importing it as html would collapse the line breaks it carries, while the
-// browser inserts the text flavor with them intact, so that one stays with the browser.
-function hasMarkup(transfer) {
-    if (!transfer || typeof transfer.getData !== 'function') return false;
-    const types = [...(transfer.types || [])].map(type => String(type).toLowerCase());
-    if (!types.includes('text/html')) return false;
-    if (!types.includes('text/plain')) return true;
-    return /<[a-z!/]/i.test(transfer.getData('text/html'));
+// Reading the payload belongs after preventDefault, where a failure stays fail-closed, so the flavor
+// list is all this may look at. Plain text without an html flavor is the browser's to insert.
+function hasHtml(transfer) {
+    if (typeof transfer?.getData !== 'function') return false;
+    return [...(transfer.types || [])].some(type => String(type).toLowerCase() === 'text/html');
+}
+
+// Markup as it is, an html flavor without any as the text it is: a pdf viewer labels its plain
+// selection that way, and html would collapse the line breaks that are all the structure it has.
+function importHtml(transfer) {
+    const html = String(transfer.getData('text/html') || '');
+    if (/<[a-z!/]/i.test(html)) return html;
+    const text = String(transfer.getData('text/plain') || '') || html;
+    return text.replace(/[&<>]/g, character => ENTITIES[character]).replace(/\r?\n/g, '<br>');
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "u2ui",
-  "version": "1.5.11",
+  "version": "1.5.12",
   "description": "HTML Advanced: More Capabilities, Same Feel, Same Simplicity",
   "keywords": ["web-components","pattern-library","component-library","ui-toolkit","design-system"],
   "author": "Tobias Buschor",