@rathkit/rte-core 0.1.0-alpha.3 → 0.1.0-alpha.5

package/dist/footnotes/reconcile.js

@@ -0,0 +1,155 @@
+const MAX_KEPT = 64;
+export function createReconciler(ops) {
+    const kept = new Map();
+    const keep = (id, item) => {
+        kept.delete(id);
+        kept.set(id, item);
+        if (kept.size > MAX_KEPT)
+            kept.delete(kept.keys().next().value);
+    };
+    const paragraph = { type: "br", paragraph: true };
+    const join = (a, b) => {
+        if (a.children.length > 0 && b.content.length > 0) {
+            const text = { type: "p", content: b.content };
+            return { item: { ...a, children: [...a.children, text, ...b.children] }, add: 0, childAdd: a.children.length };
+        }
+        const both = a.content.length > 0;
+        return {
+            item: { ...a, content: ops.normalizeInline([...a.content, ...(both ? [paragraph] : []), ...b.content]), children: [...a.children, ...b.children] },
+            add: both ? ops.inlineLength(a.content) + 1 : ops.inlineLength(a.content), childAdd: a.children.length,
+        };
+    };
+    return (doc, sel) => {
+        let current = doc;
+        const found = ops.noteIds(current);
+        const lists = current.blocks.flatMap((block, b) => (ops.isNotes(block) ? [b] : []));
+        if (found.length === 0 && lists.length === 0)
+            return { doc, selection: sel };
+        const copies = new Map();
+        if (new Set(found).size !== found.length) {
+            const used = new Set(found);
+            const seen = new Set();
+            const fresh = () => { for (let n = used.size + 1;; n++)
+                if (!used.has(`n${n}`)) {
+                    used.add(`n${n}`);
+                    return `n${n}`;
+                } };
+            for (const path of ops.containerPaths(current)) {
+                if (lists.includes(path[0]))
+                    continue;
+                const content = ops.getContent(current, path);
+                if (!content.some((n) => n.type === "note" && seen.has(n.id))) {
+                    for (const n of content)
+                        if (n.type === "note")
+                            seen.add(n.id);
+                    continue;
+                }
+                current = ops.setContent(current, path, content.map((n) => {
+                    if (n.type !== "note")
+                        return n;
+                    if (!seen.has(n.id)) {
+                        seen.add(n.id);
+                        return n;
+                    }
+                    const id = fresh();
+                    copies.set(id, n.id);
+                    return { type: "note", id };
+                }));
+            }
+        }
+        const ids = ops.noteIds(current);
+        const groups = new Map();
+        const moved = new Map();
+        let lead;
+        const leading = [];
+        let last;
+        let flat = 0;
+        const order = ids.filter((id, i) => ids.indexOf(id) === i);
+        for (const b of lists) {
+            current.blocks[b].items.forEach((item) => {
+                const id = item.id;
+                if (id !== undefined && !groups.has(id)) {
+                    const joined = lead ? join(lead, item) : { item, add: 0, childAdd: 0 };
+                    groups.set(id, joined.item === item ? item : { ...joined.item, id });
+                    last = id;
+                    for (const n of leading)
+                        moved.set(n, { index: order.indexOf(id), add: moved.get(n)?.add ?? 0, childAdd: 0 });
+                    moved.set(flat, { index: order.indexOf(id), add: joined.add, childAdd: joined.childAdd });
+                    lead = undefined;
+                    leading.length = 0;
+                }
+                else if (last !== undefined) {
+                    const { item: next, add, childAdd } = join(groups.get(last), item);
+                    groups.set(last, next);
+                    moved.set(flat, { index: order.indexOf(last), add, childAdd });
+                }
+                else {
+                    const joined = lead ? join(lead, item) : { item, add: 0, childAdd: 0 };
+                    lead = joined.item;
+                    moved.set(flat, { index: -1, add: joined.add, childAdd: joined.childAdd });
+                    leading.push(flat);
+                }
+                flat++;
+            });
+        }
+        if (lead && order[0] !== undefined) {
+            const target = order[0];
+            groups.set(target, groups.has(target) ? join(lead, groups.get(target)).item : { ...lead, id: target });
+            for (const n of leading)
+                moved.set(n, { index: 0, add: moved.get(n)?.add ?? 0, childAdd: 0 });
+        }
+        for (const [id, item] of groups)
+            if (!order.includes(id))
+                keep(id, item);
+        const wanted = order.map((id) => {
+            const have = groups.get(id);
+            if (have)
+                return have.id === id ? have : { ...have, id };
+            const source = copies.get(id);
+            const old = kept.get(id) ?? (source !== undefined ? groups.get(source) : undefined);
+            kept.delete(id);
+            return { ...(old ?? { content: [], children: [] }), id };
+        });
+        const first = lists[0];
+        const only = first !== undefined ? current.blocks[first] : undefined;
+        if (lists.length === 1 && only && only.items.length === wanted.length && only.items.every((item, i) => item === wanted[i]) && current === doc)
+            return { doc, selection: sel };
+        const block = wanted.length > 0 ? { ...(only ?? { type: "ol" }), type: "ol", notes: true, items: wanted } : undefined;
+        const blocks = [];
+        const newIndex = new Map();
+        current.blocks.forEach((b, i) => {
+            if (i === first) {
+                if (block) {
+                    newIndex.set(i, blocks.length);
+                    blocks.push(block);
+                }
+            }
+            else if (!lists.includes(i)) {
+                newIndex.set(i, blocks.length);
+                blocks.push(b);
+            }
+        });
+        const at = first === undefined && block ? blocks.length : (newIndex.get(first) ?? 0);
+        if (first === undefined && block)
+            blocks.push(block);
+        let offsetOf = 0;
+        const flatStart = new Map();
+        for (const b of lists) {
+            flatStart.set(b, offsetOf);
+            offsetOf += current.blocks[b].items.length;
+        }
+        const next = { blocks };
+        const map = (pos) => {
+            const [b, i, ...rest] = pos.path;
+            if (lists.includes(b)) {
+                const to = moved.get(flatStart.get(b) + i);
+                if (!to || !block)
+                    return ops.clampPos(next, { path: [Math.min(at, blocks.length - 1)], offset: 0 });
+                const [k, ...deeper] = rest;
+                return { path: k === undefined ? [at, to.index] : [at, to.index, k + to.childAdd, ...deeper], offset: pos.offset + (rest.length === 0 ? to.add : 0) };
+            }
+            return ops.clampPos(next, { path: [newIndex.get(b) ?? b, ...pos.path.slice(1)], offset: pos.offset });
+        };
+        return { doc: next, selection: { anchor: map(sel.anchor), focus: map(sel.focus) } };
+    };
+}

package/dist/html/parse.d.ts

@@ -9,6 +9,12 @@ export interface HText {
     readonly text: string;
 }
 export type HNode = HElement | HText;
-/** Parses markup into nodes. Tag and attribute names are lower-cased and entities in text and values are decoded. */
-export declare function parseHtml(source: string): HNode[];
+/** Deepest nesting read when the caller does not say. */
+export declare const DEFAULT_MAX_DEPTH = 100;
+/**
+ * Parses markup into nodes. Tag and attribute names are lower-cased and entities in text and values are decoded. An element
+ * that would nest deeper than `maxDepth` is left out and what is inside it stays in the deepest element allowed, so the tree is
+ * never deeper than that however the markup is written.
+ */
+export declare function parseHtml(source: string, maxDepth?: number): HNode[];
 export declare function findAll(nodes: readonly HNode[], tag: string, out?: HElement[]): HElement[];

package/dist/html/parse.js

@@ -7,7 +7,8 @@ const BLOCKS_CLOSING_P = new Set([
 ]);
 const TAG_NAME = /[A-Za-z][^\s/>]*/y;
 const ATTRIBUTE = /([^\s"'<>/=]+)(?:\s*=\s*(?:"([^"]*)"|'([^']*)'|([^\s"'=<>`]+)))?/y;
-export function parseHtml(source) {
+export const DEFAULT_MAX_DEPTH = 100;
+export function parseHtml(source, maxDepth = DEFAULT_MAX_DEPTH) {
     const root = { type: "el", tag: "#root", attrs: {}, children: [] };
     const stack = [root];
     const top = () => stack[stack.length - 1];
@@ -123,9 +124,12 @@ export function parseHtml(source) {
             closeWithin(new Set(["thead", "tbody", "tfoot"]), new Set(["table"]));
         if (BLOCKS_CLOSING_P.has(tag))
             closeWithin(new Set(["p"]), new Set(["li", "td", "th", "table", "blockquote", "div", "ul", "ol"]));
+        const void_ = VOID.has(tag);
+        if (!void_ && stack.length > maxDepth)
+            continue;
         const el = { type: "el", tag, attrs, children: [] };
         top().children.push(el);
-        if (!VOID.has(tag))
+        if (!void_)
             stack.push(el);
     }
     return root.children;

package/dist/images/images.js

@@ -1,4 +1,5 @@
 import { decodeBase64 } from "../base64.js";
+import { asChildren } from "../path.js";
 export function dataImageBytes(src) {
     const comma = src.indexOf(",");
     if (!/^data:/i.test(src) || comma === -1 || !/;base64$/i.test(src.slice(0, comma)))
@@ -26,8 +27,8 @@ export function mapImages(blocks, fn) {
     const list = (l) => {
         const items = l.items.flatMap((item) => {
             const { content, emptied } = inline(item.content);
-            const sublists = item.sublists.map(list).filter((x) => x !== undefined);
-            return emptied && sublists.length === 0 ? [] : [{ content, sublists }];
+            const children = asChildren(walk(item.children));
+            return emptied && children.length === 0 ? [] : [{ ...item, content, children }];
         });
         return items.length > 0 || l.items.length === 0 ? { ...l, items } : undefined;
     };
@@ -74,7 +75,7 @@ export function collectImages(blocks) {
     const inline = (content) => { for (const node of content)
         if (node.type === "image")
             found.push(node); };
-    const list = (l) => l.items.forEach((item) => { inline(item.content); item.sublists.forEach(list); });
+    const list = (l) => l.items.forEach((item) => { inline(item.content); walk(item.children); });
     const walk = (bs) => {
         for (const block of bs) {
             if (block.type === "p" || block.type === "h")

package/dist/images/index.d.ts

@@ -1,2 +1,6 @@
-export { images, type ImagesOptions } from "./plugin.ts";
+import { type ImagesOptions } from "./plugin.ts";
+import type { Plugin } from "../plugin.ts";
+export type { ImagesOptions };
+/** The images plugin, with the part that selects and resizes images in a browser. (`./plugin.ts` is the same without it.) */
+export declare const images: (options?: ImagesOptions) => Plugin;
 export { collectImages, dataImageBytes, isDataImage, mapImages, readDataImage, rewriteImages } from "./images.ts";

package/dist/images/index.js

@@ -1,2 +1,4 @@
-export { images } from "./plugin.js";
+import { images as engineOnly } from "./plugin.js";
+import { imagesView } from "./view.js";
+export const images = (options) => ({ ...engineOnly(options), view: imagesView });
 export { collectImages, dataImageBytes, isDataImage, mapImages, readDataImage, rewriteImages } from "./images.js";

package/dist/images/plugin.js

@@ -21,7 +21,8 @@ export function images(options = {}) {
                     const checked = url ? checkImageSrc(url) : undefined;
                     return checked ?? reject("unsupported", file.type, file.size);
                 }
-                catch {
+                catch (error) {
+                    host.editor.report({ code: "upload-failed", message: `Uploading an image failed: ${error instanceof Error ? error.message : String(error)}`, error });
                     return reject("upload-failed", file.type, file.size);
                 }
             };

package/dist/{dom/imageview.d.ts → images/view.d.ts}

@@ -1,15 +1,16 @@
-import type { Engine } from "../engine.ts";
+import type { ViewExtension, ViewHost } from "../plugin.ts";
 /** The attribute on the selected image, for styling. */
-export declare const SELECTED_IMAGE = "data-rk-image-selected";
+export declare const SELECTED_IMAGE = "data-rte-image-selected";
 export declare class ImageSelection {
-    private readonly root;
-    private readonly engine;
-    private readonly quiet;
+    private readonly host;
     private marked;
     private handle;
     private drag;
     private readonly stops;
-    constructor(root: HTMLElement, engine: Engine, quiet: () => void);
+    private readonly root;
+    private readonly engine;
+    private readonly quiet;
+    constructor(host: ViewHost);
     /** The drawn element of the selected image, or undefined. */
     private find;
     update(): void;
@@ -19,3 +20,5 @@ export declare class ImageSelection {
     private start;
     destroy(): void;
 }
+/** Images in the page: a click selects one, and its corner can be dragged to resize it. Comes with the images plugin. */
+export declare const imagesView: ViewExtension;

package/dist/{dom/imageview.js → images/view.js}

@@ -1,19 +1,20 @@
 import { imageSelection, selectedImage } from "../imageselect.js";
-import { domFromPos, posFromDom } from "./render.js";
-export const SELECTED_IMAGE = "data-rk-image-selected";
+export const SELECTED_IMAGE = "data-rte-image-selected";
 const MIN = 16;
 export class ImageSelection {
-    root;
-    engine;
-    quiet;
+    host;
     marked;
     handle;
     drag;
     stops = [];
-    constructor(root, engine, quiet) {
-        this.root = root;
-        this.engine = engine;
-        this.quiet = quiet;
+    root;
+    engine;
+    quiet;
+    constructor(host) {
+        this.host = host;
+        this.root = host.element;
+        this.engine = host.engine;
+        this.quiet = () => host.quiet();
         const reposition = () => this.place();
         window.addEventListener("scroll", reposition, true);
         window.addEventListener("resize", reposition);
@@ -22,7 +23,7 @@ export class ImageSelection {
             const target = e.target;
             if (!(target instanceof HTMLImageElement) || !this.root.contains(target) || this.engine.readOnly)
                 return;
-            const at = posFromDom(this.root, target.parentNode, [...target.parentNode.childNodes].indexOf(target));
+            const at = this.host.posFromDom(target.parentNode, [...target.parentNode.childNodes].indexOf(target));
             if (at)
                 this.engine.setSelection(imageSelection(at.path, at.offset));
         };
@@ -34,12 +35,12 @@ export class ImageSelection {
         const picked = selectedImage(this.engine.document, this.engine.selection);
         if (!picked)
             return undefined;
-        const at = domFromPos(this.root, { path: picked.path, offset: picked.offset + 1 });
+        const at = this.host.domFromPos({ path: picked.path, offset: picked.offset + 1 });
         const el = !at ? undefined : at.node.nodeType === Node.TEXT_NODE ? at.node.previousSibling : at.node.childNodes[at.offset - 1];
         return el instanceof HTMLImageElement ? el : undefined;
     }
     update() {
-        const img = this.find();
+        const img = this.engine.readOnly ? undefined : this.find();
         if (img === this.marked) {
             this.place();
             return;
@@ -59,7 +60,7 @@ export class ImageSelection {
         }
         if (!this.handle) {
             const handle = document.createElement("div");
-            handle.setAttribute("data-rk-resize-handle", "");
+            handle.setAttribute("data-rte-resize-handle", "");
             handle.style.cssText = "position:fixed;z-index:2147483646;width:12px;height:12px;background:#17408b;border:2px solid #fff;border-radius:3px;cursor:nwse-resize;touch-action:none;box-sizing:border-box";
             handle.addEventListener("pointerdown", (e) => this.start(e));
             document.body.appendChild(handle);
@@ -79,7 +80,7 @@ export class ImageSelection {
         event.preventDefault();
         const box = img.getBoundingClientRect();
         const guide = document.createElement("div");
-        guide.setAttribute("data-rk-resize-line", "");
+        guide.setAttribute("data-rte-resize-line", "");
         guide.style.cssText = `position:fixed;z-index:2147483645;pointer-events:none;border:2px dashed #17408b;left:${box.left}px;top:${box.top}px;width:${box.width}px;height:${box.height}px;box-sizing:border-box`;
         document.body.appendChild(guide);
         this.drag = { startX: event.clientX, startWidth: box.width, width: box.width, guide };
@@ -120,3 +121,8 @@ export class ImageSelection {
         this.marked?.removeAttribute(SELECTED_IMAGE);
     }
 }
+export const imagesView = (host) => {
+    const selection = new ImageSelection(host);
+    const stop = host.onChange(() => selection.update());
+    return () => { stop(); selection.destroy(); };
+};

package/dist/import.d.ts

@@ -49,8 +49,24 @@ export interface ImportOptions {
     readonly linkSchemes?: readonly string[];
     /** Keep empty paragraphs. Content that is loaded keeps them; pasted content does not. */
     readonly keepEmptyBlocks?: boolean;
-    /** Largest `data:` image address, in characters. */
+    /** Largest `data:` image address, in characters. 0 refuses every `data:` image. Default 12 million. */
     readonly maxDataImageLength?: number;
+    /** Longest markup read, in characters. Longer markup is refused whole: nothing is read, `onLimit` is told. Default 50 million. */
+    readonly maxInputLength?: number;
+    /** Keep an image whose address is relative (`a.png`, `/a.png`). Default true; pasting turns it off (see `pasteRelativeImages`). */
+    readonly relativeImages?: boolean;
+    /** Keep relative image addresses when pasting. Default false: a pasted `/path` would be fetched from the page's own origin. */
+    readonly pasteRelativeImages?: boolean;
+    /** Deepest element nesting read; deeper elements are left out and their content kept. Default 100. */
+    readonly maxDepth?: number;
+    /** Told when reading failed for a reason in the reader or a recognizer: the content is then left out and nothing is thrown. */
+    readonly onError?: (error: unknown) => void;
+    /** Told when markup was refused for being longer than `maxInputLength`. */
+    readonly onLimit?: (info: {
+        readonly limit: "maxInputLength";
+        readonly max: number;
+        readonly length: number;
+    }) => void;
 }
 export declare function parseStyle(style: string | undefined): Map<string, string>;
 /** Returns the address when its scheme is allowed, otherwise undefined. Obfuscation with spaces, tabs or entities does not help. */
@@ -62,4 +78,4 @@ export declare function importHtml(html: string, options?: ImportOptions): Doc;
 export declare function importText(value: string): Block[];
 export { decodeEntities };
 /** Checks an image address the same way the importer does: remote, or a raster image whose bytes match its type. */
-export declare const checkImageSrc: (src: string, maxDataLength?: number, sanitizeSvg?: ImportOptions["sanitizeSvg"]) => string | undefined;
+export declare const checkImageSrc: (src: string, maxDataLength?: number, sanitizeSvg?: ImportOptions["sanitizeSvg"], relative?: boolean) => string | undefined;