u2ui 1.5.3 → 1.5.7

package/js/rte/src/command/commands.js

@@ -0,0 +1,159 @@
+import {configuredElements} from '../config/config.js';
+import {Edit, narrow} from './edit.js';
+import {htmlModel} from '../model/html/html-model.js';
+
+// Named editor commands for one surface. A command is a plain object with
+// `run(edit)`, optional `enabled(edit)` and `state(edit)`, the native
+// `inputTypes` it replaces, and an optional keyboard `shortcut`. Availability,
+// state, execution, input routing, and keys stay separate so a UI, a keyboard
+// module, and the input pipeline can use the same registry.
+//
+// Shortcuts belong here rather than to a toolbar so a key works whether or not
+// a control for it is on screen.
+export class Commands {
+    #surface;
+    #model;
+    #commands = new Map();
+    #inputs = new Map();
+    #keys = new Map();
+
+    constructor(surface, {model = htmlModel, commands = {}} = {}) {
+        if (typeof surface?.transact !== 'function') throw new TypeError('A command registry requires an editor surface');
+        if (typeof model?.allows !== 'function' || typeof model?.allowed !== 'function') {
+            throw new TypeError('A command registry requires a content model');
+        }
+        this.#surface = surface;
+        this.#model = model;
+        for (const [name, command] of Object.entries(commands)) this.add(name, command);
+    }
+
+    get surface() { return this.#surface; }
+    get model() {
+        return narrow(this.#model, configuredElements(this.#surface.element));
+    }
+    get names() { return [...this.#commands.keys()]; }
+
+    add(name, command) {
+        if (typeof name !== 'string' || !name.trim()) throw new TypeError('A command name must be a non-empty string');
+        if (typeof command?.run !== 'function') throw new TypeError('A command must implement run()');
+        if (command.enabled !== undefined && typeof command.enabled !== 'function') {
+            throw new TypeError('Command availability must be a function');
+        }
+        if (command.state !== undefined && typeof command.state !== 'function') {
+            throw new TypeError('Command state must be a function');
+        }
+        if (command.transaction !== undefined && typeof command.transaction !== 'boolean') {
+            throw new TypeError('Command transaction flag must be boolean');
+        }
+        const keys = chords(command.shortcut);
+        this.delete(name);
+        this.#commands.set(name, command);
+        for (const inputType of command.inputTypes || []) this.#inputs.set(inputType, name);
+        for (const key of keys) this.#keys.set(key, name);
+        return this;
+    }
+
+    delete(name) {
+        if (!this.#commands.has(name)) return false;
+        for (const [inputType, owner] of this.#inputs) if (owner === name) this.#inputs.delete(inputType);
+        for (const [key, owner] of this.#keys) if (owner === name) this.#keys.delete(key);
+        return this.#commands.delete(name);
+    }
+
+    get(name) {
+        return this.#commands.get(name) || null;
+    }
+
+    has(name) {
+        return this.#commands.has(name);
+    }
+
+    input(inputType) {
+        return this.#inputs.get(inputType) || null;
+    }
+
+    // The command a keystroke denotes, or null.
+    shortcut(event) {
+        return this.#keys.get(chord(event)) || null;
+    }
+
+    get keys() {
+        return new Map(this.#keys);
+    }
+
+    enabled(name, detail) {
+        const command = this.#commands.get(name);
+        return !!command && this.#allows(command, this.#edit(null, detail));
+    }
+
+    state(name, detail) {
+        const command = this.#commands.get(name);
+        if (!command?.state) return null;
+        return command.state(this.#edit(null, detail));
+    }
+
+    run(name, detail = {}) {
+        const command = this.#commands.get(name);
+        if (!command) throw new RangeError(`Unknown command: ${name}`);
+        const edit = this.#edit(null, detail);
+        if (!this.#allows(command, edit)) return;
+        if (command.transaction === false) {
+            const result = command.run(edit);
+            this.#surface.emit('u2-rte-command', {name, inputType: edit.inputType, transaction: null, result});
+            return result;
+        }
+        return this.#surface.transact(transaction => {
+            const edit = this.#edit(transaction, detail);
+            // The transaction restores the saved selection, so availability is
+            // decided again against the state the command actually sees.
+            if (!this.#allows(command, edit)) return;
+            const result = command.run(edit);
+            this.#surface.emit('u2-rte-command', {name, inputType: edit.inputType, transaction: edit.transaction, result});
+            return result;
+        // A caller may mark a run as ongoing input — a field edited live, a
+        // slider dragged — so history groups it instead of recording a step per
+        // keystroke.
+        }, {trigger: detail.trigger === 'input' ? 'input' : 'command', command: name, inputType: detail.inputType || ''});
+    }
+
+    // The base model is handed over unnarrowed: `Edit` resolves it only if the
+    // command actually consults it.
+    #edit(transaction, detail) {
+        return new Edit(this.#surface, transaction, {model: this.#model, ...detail});
+    }
+
+    #allows(command, edit) {
+        return command.enabled ? !!command.enabled(edit) : !!edit.range;
+    }
+}
+
+const MODIFIERS = ['ctrl', 'alt', 'shift'];
+
+// A shortcut is one or more chords separated by spaces, each written as
+// `[modifier+]*key`. `ctrl` matches Control or Command, so one declaration
+// serves both platforms.
+function chords(value) {
+    if (value === undefined || value === null) return [];
+    if (typeof value !== 'string' || !value.trim()) throw new TypeError('A command shortcut must be a non-empty string');
+    return value.trim().toLowerCase().split(/\s+/).map(item => {
+        const parts = item.split('+');
+        const key = parts.pop();
+        if (!key || parts.some(part => !MODIFIERS.includes(part)) || new Set(parts).size !== parts.length) {
+            throw new TypeError(`Invalid command shortcut: ${item}`);
+        }
+        return [...MODIFIERS.filter(name => parts.includes(name)), key].join('+');
+    });
+}
+
+// The chord a keyboard event denotes. A digit is read from its physical key, so
+// a shifted digit is the same shortcut on every keyboard layout, while letters
+// keep their layout meaning.
+function chord(event) {
+    const digit = /^Digit(\d)$/.exec(event.code || '');
+    const parts = [];
+    if (event.ctrlKey || event.metaKey) parts.push('ctrl');
+    if (event.altKey) parts.push('alt');
+    if (event.shiftKey) parts.push('shift');
+    parts.push(digit ? digit[1] : String(event.key).toLowerCase());
+    return parts.join('+');
+}

package/js/rte/src/command/delete.js

@@ -0,0 +1,119 @@
+import {elementOf} from '../selection/ownership/ownership.js';
+import {Point} from '../selection/point/point.js';
+import {blockEdge, emptyBlock} from './block-boundary.js';
+
+// Collapsed deletion owns two boundaries: the one between compatible mergeable
+// blocks, and the one beside an atomic block, which has no content to merge and
+// is removed instead. Character and range deletion remain native.
+export const deleteBackward = deletion('backward', 'deleteContentBackward');
+export const deleteForward = deletion('forward', 'deleteContentForward');
+
+function deletion(direction, inputType) {
+    return {
+        inputTypes: [inputType],
+        enabled: edit => !!boundary(edit, direction),
+        run(edit) {
+            const found = boundary(edit, direction);
+            if (!found) return undefined;
+            return found.atomic
+                ? discard(edit, found.atomic, found.between)
+                : merge(edit, found.left, found.right, found.between);
+        },
+    };
+}
+
+// An atomic block is indivisible and holds nothing to join: deleting across its
+// boundary removes it and leaves the caret where it already was.
+function discard(edit, node, between) {
+    const parent = node.parentElement;
+    const start = edit.range.start;
+    const caret = new Point(start.node, start.offset, 'forward');
+    edit.map.add(caret);
+    for (const skipped of between) edit.map.remove(skipped);
+    edit.map.remove(node);
+    edit.transaction.touch(parent);
+    edit.select(edit.map.get(caret));
+    return node;
+}
+
+function merge(edit, left, right, between) {
+    const parent = left.parentElement;
+    const leftEmpty = emptyBlock(left, edit.model);
+    const rightEmpty = emptyBlock(right, edit.model);
+    for (const node of between) edit.map.remove(node);
+    if (rightEmpty) {
+        edit.map.remove(right);
+        edit.transaction.touch(parent);
+        edit.select(leftEmpty
+            ? new Point(left, 0, 'forward')
+            : new Point(left, left.childNodes.length, 'backward'));
+        return left;
+    }
+
+    if (leftEmpty) while (left.firstChild) edit.map.remove(left.firstChild);
+    const caret = new Point(left, left.childNodes.length, 'backward');
+    edit.map.add(caret);
+    while (right.firstChild) edit.map.move(right.firstChild, left, left.childNodes.length);
+    edit.map.remove(right);
+    edit.transaction.touch(left);
+    edit.transaction.touch(parent);
+    edit.select(edit.map.get(caret));
+    return left;
+}
+
+function boundary(edit, direction) {
+    const point = edit.range?.collapsed && edit.range.start;
+    if (!point) return null;
+    // An engine can leave the caret inside an element that has no inside —
+    // clicking a rule does that in some. The position is at the element, not in
+    // it, and deleting there is what takes the element away.
+    const hollow = elementOf(point.node) === point.node && !point.node.childNodes.length
+        && point.node !== edit.element && edit.model.atomic(point.node);
+    if (hollow) return {atomic: point.node, between: []};
+    if (insideAtomic(edit, point.node)) return null;
+    const edge = direction === 'backward' ? 'start' : 'end';
+    for (let current = elementOf(point.node); current && current !== edit.element; current = current.parentElement) {
+        if (!edit.model.mergeable(current) || !atEdge(current, point, edge, edit.model)) continue;
+        const adjacent = neighbor(current, direction, edit.model);
+        if (atomicBlock(edit.model, adjacent.node)) return {atomic: adjacent.node, between: adjacent.between};
+        const [left, right] = direction === 'backward' ? [adjacent.node, current] : [current, adjacent.node];
+        if (compatible(edit.model, left, right)) return {left, right, between: adjacent.between};
+    }
+    return null;
+}
+
+function neighbor(current, direction, model) {
+    const property = direction === 'backward' ? 'previousSibling' : 'nextSibling';
+    const between = [];
+    let node = current[property];
+    while (node && node.nodeType !== Node.ELEMENT_NODE && emptyBlock(node, model)) {
+        between.push(node);
+        node = node[property];
+    }
+    return {node, between};
+}
+
+function atomicBlock(model, node) {
+    return node?.nodeType === Node.ELEMENT_NODE && model.block(node) && model.atomic(node);
+}
+
+function compatible(model, left, right) {
+    if (left?.nodeType !== Node.ELEMENT_NODE || right?.nodeType !== Node.ELEMENT_NODE
+        || !model.mergeable(left) || !model.mergeable(right)) return false;
+    if (emptyBlock(right, model)) return true;
+    return [...right.childNodes].every(child => model.allows(left, child));
+}
+
+function atEdge(unit, point, edge, model) {
+    // Every DOM position inside an empty block denotes its one visual caret.
+    // A filler br is therefore not a special boundary of its own.
+    return emptyBlock(unit, model) || blockEdge(unit, point, edge);
+}
+
+function insideAtomic(edit, node) {
+    for (let element = elementOf(node); element && element !== edit.element; element = element.parentElement) {
+        if (edit.model.atomic(element)) return true;
+    }
+    return false;
+}
+

package/js/rte/src/command/edit.js

@@ -0,0 +1,78 @@
+import {configuredElements} from '../config/config.js';
+import {htmlModel} from '../model/html/html-model.js';
+import {EditRange} from '../selection/range/edit-range.js';
+import {PointMap} from '../selection/map/point-map.js';
+
+// One command execution: the affected range, the point map every mutation goes
+// through, and the resulting selection. Commands own their algorithm, not this
+// plumbing.
+export class Edit {
+    #surface;
+    #transaction;
+    #model;
+    #narrowed = null;
+    #inputType;
+    #data;
+    #value;
+    #fragment;
+    #range;
+    #map = new PointMap();
+
+    constructor(surface, transaction = null, {
+        model = htmlModel,
+        range = null,
+        inputType = '',
+        data = null,
+        value = null,
+        fragment = null,
+    } = {}) {
+        if (surface?.element?.nodeType !== Node.ELEMENT_NODE) throw new TypeError('An edit requires an editor surface');
+        if (data !== null && typeof data !== 'string') throw new TypeError('Edit input data must be a string or null');
+        if (fragment !== null && fragment?.nodeType !== Node.DOCUMENT_FRAGMENT_NODE) {
+            throw new TypeError('Edit fragment must be a DocumentFragment or null');
+        }
+        this.#surface = surface;
+        this.#transaction = transaction;
+        this.#model = model;
+        this.#inputType = inputType;
+        this.#data = data;
+        this.#value = value;
+        this.#fragment = fragment;
+        // The same rule a transaction applies: a live selection inside the
+        // surface is newer than the saved one, and a selection outside it says
+        // nothing about what is being edited — a field of the editor's own
+        // chrome holds the caret while it names what is still selected here.
+        this.#range = range
+            ? EditRange.fromRange(range, surface.element)
+            : EditRange.fromSelection(surface.core.selection, surface.element)
+                || (surface.selection ? EditRange.fromRange(surface.selection.range(), surface.element) : null);
+    }
+
+    get surface() { return this.#surface; }
+    get element() { return this.#surface.element; }
+    get config() { return this.#surface.config; }
+    get transaction() { return this.#transaction; }
+    // Narrowing the model reads the host configuration, and most availability
+    // checks never consult it. Resolving it on first use keeps a toolbar
+    // refresh from paying for every control that does not care.
+    get model() {
+        this.#narrowed ??= narrow(this.#model, configuredElements(this.#surface.element));
+        return this.#narrowed;
+    }
+    get map() { return this.#map; }
+    get inputType() { return this.#inputType; }
+    get data() { return this.#data; }
+    get value() { return this.#value; }
+    get fragment() { return this.#fragment; }
+    get range() { return this.#range; }
+    get document() { return this.#surface.element.ownerDocument; }
+
+    select(start, end = start, backward = false) {
+        const range = EditRange.fromPoints(start, end, this.element);
+        return range.select(this.#surface.core.selection, backward) ? range : null;
+    }
+}
+
+export function narrow(model, elements) {
+    return elements === null || typeof model.withElements !== 'function' ? model : model.withElements(elements);
+}

package/js/rte/src/command/element.js

@@ -0,0 +1,45 @@
+import {Point} from '../selection/point/point.js';
+
+// The one element a selection covers, when it covers exactly that element and
+// nothing else. Clicking an image inside a contenteditable produces such a
+// selection, which is what makes an atomic element addressable at all.
+export function selectedElement(edit, match = null) {
+    if (!edit.range || edit.range.collapsed) return null;
+    const nodes = edit.range.roots();
+    const element = nodes.length === 1 && nodes[0].nodeType === Node.ELEMENT_NODE ? nodes[0] : null;
+    if (!element || !edit.element.contains(element)) return null;
+    return !match || match(element, edit) ? element : null;
+}
+
+// A value command over a fixed set of that element's attributes. A missing or
+// empty value removes its attribute, which is what "back to its own size" means
+// for an image, so one command both sets and clears.
+export function elementAttributes(names, {match = null} = {}) {
+    if (!Array.isArray(names) || !names.length) throw new TypeError('An attribute command requires attribute names');
+    const attributes = names.map(name => String(name).toLowerCase());
+    return {
+        enabled: edit => !!selectedElement(edit, match),
+        state(edit) {
+            const element = selectedElement(edit, match);
+            if (!element) return null;
+            const value = {};
+            for (const name of attributes) {
+                if (element.hasAttribute(name)) value[name] = element.getAttribute(name);
+            }
+            return value;
+        },
+        run(edit) {
+            const element = selectedElement(edit, match);
+            if (!element) return null;
+            for (const name of attributes) {
+                const value = edit.value?.[name];
+                if (value === undefined || value === null || value === '') element.removeAttribute(name);
+                else element.setAttribute(name, String(value));
+            }
+            edit.transaction.touch(element);
+            // The element stays selected, so the UI acting on it stays up.
+            edit.select(Point.before(element), Point.after(element));
+            return element;
+        },
+    };
+}

package/js/rte/src/command/enter.js

@@ -0,0 +1,175 @@
+import {elementOf} from '../selection/ownership/ownership.js';
+import {Point} from '../selection/point/point.js';
+import {blank, blockEdge, emptyBlock, fill} from './block-boundary.js';
+
+// The host policy names the element Enter splits; `block` follows the
+// configured default block, the structural values name their own unit.
+const UNITS = Object.freeze({item: ['li'], row: ['tr'], cell: ['td', 'th']});
+const LISTS = Object.freeze(['ul', 'ol', 'menu']);
+
+export const enter = {
+    inputTypes: ['insertParagraph'],
+    enabled: editable,
+    run(edit) {
+        const exited = exitList(edit);
+        if (exited) return exited;
+        const unit = structure(edit);
+        return unit ? split(edit, unit) : insertBreak(edit);
+    },
+};
+
+export const lineBreak = {
+    inputTypes: ['insertLineBreak'],
+    enabled: editable,
+    run: edit => insertBreak(edit),
+};
+
+// Both commands replace one caret with new structure. A selection would have to
+// be deleted first, and atomic content is indivisible, so the browser keeps its
+// native behavior in those cases.
+function editable(edit) {
+    if (!edit.range?.collapsed) return false;
+    for (let element = elementOf(edit.range.start.node); element && element !== edit.element; element = element.parentElement) {
+        if (edit.model.atomic(element)) return false;
+    }
+    return true;
+}
+
+function structure(edit) {
+    const {enter: mode, block: tag} = edit.config;
+    if (mode === 'break') return null;
+    if (mode === 'block') {
+        const item = ancestor(edit, ['li']);
+        if (item && LISTS.includes(item.parentElement?.localName)) return item;
+        const textBlock = ancestor(edit, element => edit.model.textBlock(element));
+        if (textBlock) return textBlock;
+    }
+    return ancestor(edit, UNITS[mode] || (tag ? [tag] : []));
+}
+
+function ancestor(edit, match) {
+    if (Array.isArray(match)) {
+        const tags = match;
+        match = element => tags.includes(element.localName);
+    }
+    for (let element = elementOf(edit.range.start.node); element && element !== edit.element; element = element.parentElement) {
+        if (match(element) && edit.model.allows(element.parentElement, element)) return element;
+    }
+    return null;
+}
+
+function exitList(edit) {
+    const {enter: mode, block: tag} = edit.config;
+    if (!tag || mode !== 'block' && mode !== 'item') return null;
+    let item = elementOf(edit.range.start.node);
+    while (item && item !== edit.element && item.localName !== 'li') item = item.parentElement;
+    if (!item || item === edit.element || !emptyBlock(item, edit.model)) return null;
+    const list = item.parentElement;
+    if (!LISTS.includes(list?.localName) || list === edit.element) return null;
+    const parent = list.parentElement;
+    const block = edit.document.createElement(tag);
+    if (!edit.model.allows(parent, block)) return null;
+
+    const start = continuation(list, item);
+    const offset = [...list.childNodes].indexOf(item);
+    edit.map.remove(item);
+    const at = edit.map.split(parent, list, offset);
+    const tail = parent.childNodes[at];
+    let trailing = tail;
+    edit.map.insert(parent, at, block);
+    edit.map.insert(block, 0, edit.document.createElement('br'));
+    if (!list.children.length) {
+        if (tail.children.length) {
+            while (tail.firstChild) edit.map.move(tail.firstChild, list, list.childNodes.length);
+            edit.map.remove(tail);
+            edit.map.move(list, parent, [...parent.childNodes].indexOf(block) + 1);
+            trailing = list;
+        } else {
+            edit.map.remove(list);
+            edit.map.remove(tail);
+            trailing = null;
+        }
+    } else if (!tail.children.length) {
+        edit.map.remove(tail);
+        trailing = null;
+    }
+    if (start !== null && trailing) trailing.setAttribute('start', start);
+    edit.transaction.touch(parent);
+    edit.select(new Point(block, 0, 'forward'));
+    return block;
+}
+
+function continuation(list, item) {
+    if (list.localName !== 'ol') return null;
+    const items = [...list.children].filter(child => child.localName === 'li');
+    const target = items.indexOf(item) + 1;
+    if (!target || target >= items.length || items[target].hasAttribute('value')) return null;
+    let value = list.hasAttribute('start') ? list.start : list.reversed ? items.length : 1;
+    const step = list.reversed ? -1 : 1;
+    for (let index = 0; index < target; index++) {
+        if (items[index].hasAttribute('value')) value = items[index].value;
+        value += step;
+    }
+    return String(value);
+}
+
+function split(edit, unit) {
+    const start = edit.range.start;
+    const defaultBlock = continuationBlock(edit, unit, start);
+    const caret = new Point(start.node, start.offset, 'forward');
+    edit.map.add(caret);
+    const parent = unit.parentElement;
+    let tail = parent.childNodes[edit.map.split(parent, start.node, start.offset)];
+    if (defaultBlock && [...tail.childNodes].every(child => edit.model.allows(defaultBlock, child))) {
+        tail = edit.map.replaceWrapper(tail, defaultBlock);
+    }
+    const position = edit.map.get(caret);
+    fill(edit, unit);
+    fill(edit, tail);
+    edit.transaction.touch(unit);
+    edit.transaction.touch(tail);
+    edit.select(position);
+    return tail;
+}
+
+function continuationBlock(edit, unit, point) {
+    const tag = edit.config.block;
+    if (!tag || !edit.model.textBlock(unit) || unit.localName === tag || !blockEdge(unit, point, 'end')) return null;
+    const block = edit.document.createElement(tag);
+    if (!edit.model.allows(unit.parentElement, block)) return null;
+    return block;
+}
+
+function insertBreak(edit) {
+    const start = edit.range.start;
+    const caret = new Point(start.node, start.offset, 'forward');
+    edit.map.add(caret);
+    const parent = elementOf(start.node);
+    const index = edit.map.split(parent, start.node, start.offset);
+    const separator = edit.document.createElement('br');
+    edit.map.insert(parent, index, separator);
+    const position = edit.map.get(caret);
+    // A break at the end of its block needs a second one to become visible.
+    if (!following(edit, separator)) edit.map.insert(parent, index + 1, edit.document.createElement('br'));
+    edit.transaction.touch(parent);
+    edit.select(position);
+    return separator;
+}
+
+function following(edit, node) {
+    const limit = block(edit, node);
+    for (let current = node; current && current !== limit; current = current.parentElement) {
+        for (let sibling = current.nextSibling; sibling; sibling = sibling.nextSibling) {
+            if (!blank(edit.model, sibling)) return true;
+        }
+    }
+    return false;
+}
+
+function block(edit, node) {
+    for (let element = node.parentElement; element && element !== edit.element; element = element.parentElement) {
+        if (edit.model.block(element)) return element;
+    }
+    return edit.element;
+}
+

package/js/rte/src/command/fragment.js

@@ -0,0 +1,76 @@
+import {EditRange} from '../selection/range/edit-range.js';
+import {Point, indexOf} from '../selection/point/point.js';
+
+// Inserts only an already prepared DOM fragment. Parsing, security sanitizing,
+// presentation cleanup, and clipboard access remain outside this command.
+export const insertFragment = {
+    enabled: edit => !!edit.range && !!edit.fragment
+        && (!!edit.fragment.childNodes.length || !edit.range.collapsed),
+    run(edit) {
+        const state = prepare(edit);
+        if (!edit.range.collapsed) removeSelection(edit, state);
+        const nodes = [...edit.fragment.childNodes];
+        const end = new Point(edit.fragment, nodes.length, 'forward');
+        edit.map.add(end);
+        if (nodes.length) {
+            const point = edit.map.get(state.start);
+            const target = insertionTarget(edit, point, nodes);
+            edit.map.insertFragment(target.parent, target.offset, edit.fragment);
+            edit.transaction.touch(target.parent);
+            for (const node of nodes) edit.transaction.touch(node);
+        }
+        edit.select(nodes.length ? edit.map.get(end) : edit.map.get(state.start));
+        return nodes;
+    },
+};
+
+function prepare(edit) {
+    const start = new Point(edit.range.start.node, edit.range.start.offset, 'forward');
+    const end = new Point(edit.range.end.node, edit.range.end.offset, 'backward');
+    edit.map.add(start).add(end);
+    splitText(edit, end);
+    splitText(edit, start);
+    return {start, end};
+}
+
+function splitText(edit, point) {
+    const current = edit.map.get(point);
+    if (current.node.nodeType === Node.TEXT_NODE && current.offset > 0 && current.offset < current.node.length) {
+        edit.map.splitText(current.node, current.offset);
+    }
+}
+
+function removeSelection(edit, state) {
+    const range = EditRange.fromPoints(edit.map.get(state.start), edit.map.get(state.end), edit.element);
+    for (const node of range.roots()) {
+        const parent = node.parentNode;
+        edit.map.remove(node);
+        edit.transaction.touch(parent);
+    }
+}
+
+function insertionTarget(edit, point, nodes) {
+    let {parent, offset} = childBoundary(point);
+    while (parent !== edit.element && !nodes.every(node => edit.model.allows(parent, node))) {
+        const grand = parent.parentNode;
+        const index = indexOf(parent);
+        if (offset === 0) {
+            offset = index;
+        } else if (offset === parent.childNodes.length) {
+            offset = index + 1;
+        } else {
+            offset = edit.map.split(grand, parent, offset);
+            edit.transaction.touch(parent).touch(grand);
+        }
+        parent = grand;
+    }
+    return {parent, offset};
+}
+
+function childBoundary(point) {
+    if (point.node.nodeType !== Node.TEXT_NODE) return {parent: point.node, offset: point.offset};
+    const parent = point.node.parentNode;
+    const index = indexOf(point.node);
+    return {parent, offset: index + (point.offset === point.node.length ? 1 : 0)};
+}
+