@textbus/platform-browser 5.1.6 → 5.2.0

package/bundles/index.esm.js

@@ -1,2909 +0,0 @@
-import 'reflect-metadata';
-import { Slot, Textbus, Adapter, Controller, Selection, RootComponentRef, Scheduler, ContentType, Event, invokeListener, Keyboard, Commander, makeError, NativeSelectionBridge, FocusManager, Component, Registry } from '@textbus/core';
-import { Subject, filter, fromEvent, delay, Subscription, distinctUntilChanged, merge, map, Observable } from '@tanbo/stream';
-import { InjectionToken, Injectable, Inject, Optional } from '@viewfly/core';
-
-function createElement(tagName, options = {}) {
-    const el = document.createElement(tagName);
-    if (options.classes) {
-        el.classList.add(...options.classes);
-    }
-    if (options.attrs) {
-        Object.keys(options.attrs).forEach(key => {
-            el.setAttribute(key, options.attrs[key]);
-        });
-    }
-    if (options.props) {
-        Object.keys(options.props).forEach(key => {
-            el[key] = options.props[key];
-        });
-    }
-    if (options.styles) {
-        Object.assign(el.style, options.styles);
-    }
-    if (options.children) {
-        options.children.filter(i => i).forEach(item => {
-            el.appendChild(item);
-        });
-    }
-    if (options.on) {
-        Object.keys(options.on).forEach(key => {
-            el.addEventListener(key, options.on[key]);
-        });
-    }
-    return el;
-}
-function getLayoutRectByRange(range) {
-    let { startContainer, startOffset } = range;
-    if (startContainer.nodeType === Node.TEXT_NODE) {
-        if (startOffset > 0) {
-            return range.getBoundingClientRect();
-        }
-        const parentNode = startContainer.parentNode;
-        startOffset = Array.from(parentNode.childNodes).indexOf(startContainer);
-        startContainer = parentNode;
-    }
-    const beforeNode = startContainer.childNodes[startOffset - 1];
-    if (beforeNode) {
-        if (beforeNode.nodeType === Node.ELEMENT_NODE && beforeNode.nodeName.toLowerCase() !== 'br') {
-            const rect = beforeNode.getBoundingClientRect();
-            return {
-                left: rect.right,
-                top: rect.top,
-                width: range.collapsed ? 1 : rect.width,
-                height: rect.height
-            };
-        }
-        else if (beforeNode.nodeType === Node.TEXT_NODE) {
-            const range2 = document.createRange();
-            range2.setStart(beforeNode, beforeNode.textContent.length);
-            range2.setEnd(beforeNode, beforeNode.textContent.length);
-            const rect = range2.getBoundingClientRect();
-            return {
-                left: rect.right,
-                top: rect.top,
-                width: range.collapsed ? 1 : rect.width,
-                height: rect.height
-            };
-        }
-    }
-    const offsetNode = startContainer.childNodes[startOffset];
-    let isInsertBefore = false;
-    if (!offsetNode) {
-        const lastChild = startContainer.lastChild;
-        if (lastChild && lastChild.nodeType === Node.ELEMENT_NODE) {
-            const rect = lastChild.getBoundingClientRect();
-            return {
-                left: rect.right,
-                top: rect.top,
-                width: range.collapsed ? 1 : rect.width,
-                height: rect.height
-            };
-        }
-    }
-    if (offsetNode) {
-        if (offsetNode.nodeType === Node.ELEMENT_NODE && offsetNode.nodeName.toLowerCase() !== 'br') {
-            const rect = offsetNode.getBoundingClientRect();
-            return {
-                left: rect.left,
-                top: rect.top,
-                width: range.collapsed ? 1 : rect.width,
-                height: rect.height
-            };
-        }
-        isInsertBefore = true;
-    }
-    const span = startContainer.ownerDocument.createElement('span');
-    span.innerText = '\u200b';
-    span.style.display = 'inline-block';
-    if (isInsertBefore) {
-        startContainer.insertBefore(span, offsetNode);
-    }
-    else {
-        startContainer.appendChild(span);
-    }
-    const rect = span.getBoundingClientRect();
-    startContainer.removeChild(span);
-    return {
-        left: rect.left,
-        top: rect.top,
-        width: range.collapsed ? 1 : rect.width,
-        height: rect.height
-    };
-}
-
-const isWindows = () => /win(dows|32|64)/i.test(navigator.userAgent);
-const isMac = () => /mac os/i.test(navigator.userAgent);
-const isSafari = () => /Safari/.test(navigator.userAgent) && !/Chrome/.test(navigator.userAgent);
-const isFirefox = () => /Firefox/.test(navigator.userAgent);
-const isMobileBrowser = () => /Android|iPhone|iPad/.test(navigator.userAgent);
-
-/******************************************************************************
-Copyright (c) Microsoft Corporation.
-
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */
-/* global Reflect, Promise, SuppressedError, Symbol */
-
-
-function __decorate(decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-}
-
-function __param(paramIndex, decorator) {
-    return function (target, key) { decorator(target, key, paramIndex); }
-}
-
-function __metadata(metadataKey, metadataValue) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
-}
-
-function __awaiter(thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-}
-
-typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
-    var e = new Error(message);
-    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
-};
-
-/**
- * 编辑器可选项依赖注入 token
- */
-const EDITOR_OPTIONS = new InjectionToken('EDITOR_OPTIONS');
-/**
- * 编辑器容器依赖注入 token
- */
-const VIEW_CONTAINER = new InjectionToken('VIEW_CONTAINER');
-/**
- * 编辑器容器依赖注入 token
- */
-const VIEW_DOCUMENT = new InjectionToken('VIEW_DOCUMENT');
-/**
- * 编辑器容器遮罩层 token
- */
-const VIEW_MASK = new InjectionToken('VIEW_MASK');
-
-var Parser_1;
-/**
- * 用于解析 HTML，并把 HTML 内容转换为 Textbus 可以支持的组件或插槽数据
- */
-let Parser = Parser_1 = class Parser {
-    static parseHTML(html) {
-        return new DOMParser().parseFromString(html, 'text/html').body;
-    }
-    constructor(options, textbus) {
-        Object.defineProperty(this, "textbus", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: textbus
-        });
-        Object.defineProperty(this, "componentLoaders", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "formatLoaders", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "attributeLoaders", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        const componentLoaders = [
-            ...(options.componentLoaders || [])
-        ];
-        const formatLoaders = [
-            ...(options.formatLoaders || [])
-        ];
-        const attributeLoaders = [
-            ...(options.attributeLoaders || [])
-        ];
-        // options.imports?.forEach(i => {
-        //   componentLoaders.push(...(i.componentLoaders || []))
-        //   formatLoaders.push(...(i.formatLoaders || []))
-        // })
-        this.componentLoaders = componentLoaders;
-        this.formatLoaders = formatLoaders;
-        this.attributeLoaders = attributeLoaders;
-    }
-    /**
-     * 使用指定的组件加载器解析一段 HTML 字符串或 DOM 元素
-     * @param html
-     * @param rootComponentLoader
-     */
-    parseDoc(html, rootComponentLoader) {
-        const element = typeof html === 'string' ? Parser_1.parseHTML(html) : html;
-        return rootComponentLoader.read(element, this.textbus, (childSlot, slotRootElement, slotContentHostElement = slotRootElement) => {
-            return this.readSlot(childSlot, slotRootElement, slotContentHostElement);
-        });
-    }
-    /**
-     * 将一段 HTML 或 DOM 元素解析到指定插槽
-     * @param html
-     * @param rootSlot
-     */
-    parse(html, rootSlot) {
-        const element = typeof html === 'string' ? Parser_1.parseHTML(html) : html;
-        return this.readFormats(element, rootSlot);
-    }
-    readComponent(el, slot) {
-        if (el.nodeType === Node.ELEMENT_NODE) {
-            if (el.tagName === 'BR') {
-                slot.insert('\n');
-                return;
-            }
-            const schema = [...slot.schema];
-            for (const t of this.componentLoaders) {
-                if (t.match(el, schema)) {
-                    const result = t.read(el, this.textbus, (childSlot, slotRootElement, slotContentHostElement = slotRootElement) => {
-                        return this.readSlot(childSlot, slotRootElement, slotContentHostElement);
-                    });
-                    if (!result) {
-                        return;
-                    }
-                    if (result instanceof Slot) {
-                        result.toDelta().forEach(i => slot.insert(i.insert, i.formats));
-                        return;
-                    }
-                    slot.insert(result);
-                    return;
-                }
-            }
-            this.readFormats(el, slot);
-        }
-        else if (el.nodeType === Node.TEXT_NODE) {
-            this.readText(slot, el);
-        }
-    }
-    readText(slot, el) {
-        const textContent = el.textContent;
-        if (/^\s*[\r\n\u200b]+\s*$/.test(textContent)) {
-            return;
-        }
-        slot.insert(textContent);
-    }
-    readFormats(el, slot) {
-        const formats = this.formatLoaders.filter(f => {
-            return f.match(el);
-        }).map(f => {
-            return f.read(el);
-        });
-        const startIndex = slot.index;
-        let startNode = el.firstChild;
-        while (startNode) {
-            this.readComponent(startNode, slot);
-            startNode = startNode.nextSibling;
-        }
-        const endIndex = slot.index;
-        this.applyFormats(slot, formats.map(i => {
-            return {
-                formatter: i.formatter,
-                value: i.value,
-                startIndex,
-                endIndex
-            };
-        }));
-        slot.retain(endIndex);
-        return slot;
-    }
-    readSlot(childSlot, slotRootElement, slotContentElement) {
-        if (slotRootElement.nodeType === Node.ELEMENT_NODE) {
-            this.attributeLoaders.filter(a => {
-                return a.match(slotRootElement);
-            }).forEach(a => {
-                const r = a.read(slotRootElement);
-                childSlot.setAttribute(r.attribute, r.value);
-            });
-        }
-        if (slotContentElement.nodeType === Node.ELEMENT_NODE) {
-            this.readFormats(slotContentElement, childSlot);
-        }
-        else {
-            this.readText(childSlot, slotContentElement);
-        }
-        return childSlot;
-    }
-    applyFormats(slot, formatItems) {
-        slot.background(() => {
-            formatItems.forEach(i => {
-                slot.retain(i.startIndex);
-                slot.retain(i.endIndex - i.startIndex, i.formatter, i.value);
-            });
-        });
-    }
-};
-Parser = Parser_1 = __decorate([
-    Injectable(),
-    __param(0, Inject(EDITOR_OPTIONS)),
-    __metadata("design:paramtypes", [Object, Textbus])
-], Parser);
-
-class Input {
-}
-
-class DomAdapter extends Adapter {
-    constructor() {
-        super(...arguments);
-        Object.defineProperty(this, "onViewUpdated", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Subject()
-        });
-        Object.defineProperty(this, "host", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: createElement('div', {
-                styles: {
-                    cursor: 'text',
-                    wordBreak: 'break-all',
-                    boxSizing: 'border-box',
-                    flex: 1,
-                    outline: 'none'
-                },
-                attrs: {
-                    'data-textbus-view': VIEW_DOCUMENT,
-                },
-                props: {
-                    id: 'textbus-' + Number((Math.random() + '').substring(2)).toString(16)
-                }
-            })
-        });
-    }
-}
-
-/**
- * Textbus PC 端选区桥接实现
- */
-let SelectionBridge = class SelectionBridge {
-    constructor(config, textbus, controller, selection, rootComponentRef, input, scheduler, domAdapter) {
-        Object.defineProperty(this, "config", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: config
-        });
-        Object.defineProperty(this, "selection", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: selection
-        });
-        Object.defineProperty(this, "rootComponentRef", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: rootComponentRef
-        });
-        Object.defineProperty(this, "input", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: input
-        });
-        Object.defineProperty(this, "scheduler", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: scheduler
-        });
-        Object.defineProperty(this, "domAdapter", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: domAdapter
-        });
-        Object.defineProperty(this, "onSelectionChange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "nativeSelection", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: document.getSelection()
-        });
-        Object.defineProperty(this, "syncSelectionFromNativeSelectionChange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: true
-        });
-        Object.defineProperty(this, "selectionChangeEvent", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Subject()
-        });
-        Object.defineProperty(this, "subs", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: []
-        });
-        Object.defineProperty(this, "sub", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "connector", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: null
-        });
-        Object.defineProperty(this, "ignoreSelectionChange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        Object.defineProperty(this, "changeFromUser", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        Object.defineProperty(this, "docContainer", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "cacheCaretPositionTimer", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "oldCaretPosition", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        this.docContainer = textbus.get(VIEW_DOCUMENT);
-        this.onSelectionChange = this.selectionChangeEvent.asObservable().pipe(filter(() => {
-            return !controller.readonly;
-        }));
-        this.sub = this.onSelectionChange.subscribe((r) => {
-            if (r) {
-                input.focus(r, this.changeFromUser);
-            }
-            else {
-                input.blur();
-            }
-        });
-        this.sub.add(fromEvent(document, 'focusin').subscribe(ev => {
-            let target = ev.target;
-            if (/^(input|textarea|select)$/i.test(target.nodeName)) {
-                if (target.tagName.toLowerCase() === 'input' && /^(range|date)$/.test(target.type)) {
-                    return;
-                }
-                this.ignoreSelectionChange = true;
-                return;
-            }
-            if (!config.useContentEditable) {
-                while (target) {
-                    if (target.contentEditable === 'true') {
-                        this.ignoreSelectionChange = true;
-                        return;
-                    }
-                    target = target.parentNode;
-                }
-            }
-        }));
-        this.sub.add(fromEvent(document, 'focusout').subscribe(() => {
-            this.ignoreSelectionChange = false;
-        }));
-    }
-    connect(connector) {
-        this.disConnect();
-        this.connector = connector;
-        this.syncSelection(connector);
-        this.listen(connector);
-    }
-    disConnect() {
-        this.connector = null;
-        this.unListen();
-    }
-    getRect(location) {
-        const { focus, anchor } = this.getPositionByRange({
-            focusOffset: location.offset,
-            anchorOffset: location.offset,
-            focusSlot: location.slot,
-            anchorSlot: location.slot
-        });
-        if (!focus || !anchor) {
-            return null;
-        }
-        const nativeRange = document.createRange();
-        nativeRange.setStart(focus.node, focus.offset);
-        nativeRange.collapse();
-        return getLayoutRectByRange(nativeRange);
-    }
-    restore(abstractSelection, fromLocal) {
-        this.changeFromUser = fromLocal;
-        if (this.ignoreSelectionChange || !this.connector) {
-            return;
-        }
-        this.unListen();
-        if (!abstractSelection) {
-            this.nativeSelection.removeAllRanges();
-            this.selectionChangeEvent.next(null);
-            this.listen(this.connector);
-            return;
-        }
-        const { focus, anchor } = this.getPositionByRange(abstractSelection);
-        if (!focus || !anchor) {
-            this.nativeSelection.removeAllRanges();
-            this.selectionChangeEvent.next(null);
-            this.listen(this.connector);
-            return;
-        }
-        function tryOffset(position) {
-            if (!position.node) {
-                return;
-            }
-            if (position.node.nodeType === Node.TEXT_NODE) {
-                const len = position.node.textContent.length;
-                if (position.offset > len) {
-                    position.offset = len;
-                }
-            }
-            else if (position.node.nodeType === Node.ELEMENT_NODE) {
-                const len = position.node.childNodes.length;
-                if (position.offset > len) {
-                    position.offset = len;
-                }
-            }
-        }
-        try {
-            tryOffset(focus);
-            tryOffset(anchor);
-            this.nativeSelection.setBaseAndExtent(anchor.node, anchor.offset, focus.node, focus.offset);
-        }
-        catch (e) {
-            setTimeout(() => {
-                throw e;
-            });
-        }
-        if (this.nativeSelection.rangeCount) {
-            const nativeRange = this.nativeSelection.getRangeAt(0);
-            this.selectionChangeEvent.next(nativeRange);
-        }
-        else {
-            this.selectionChangeEvent.next(null);
-        }
-        // hack start 浏览器会触发上面选区更改事件
-        const bind = () => {
-            if (this.connector) {
-                this.listen(this.connector);
-            }
-        };
-        if (fromLocal) {
-            Promise.resolve().then(bind);
-            return;
-        }
-        if (typeof requestIdleCallback === 'function') {
-            requestIdleCallback(bind);
-        }
-        else {
-            setTimeout(bind, 30);
-        }
-        // hack end
-    }
-    destroy() {
-        this.subs.forEach(i => i.unsubscribe());
-        this.sub.unsubscribe();
-    }
-    getPositionByRange(abstractSelection) {
-        let focus;
-        let anchor;
-        try {
-            focus = this.findSelectedNodeAndOffset(abstractSelection.focusSlot, abstractSelection.focusOffset);
-            anchor = focus;
-            if (abstractSelection.anchorSlot !== abstractSelection.focusSlot ||
-                abstractSelection.anchorOffset !== abstractSelection.focusOffset) {
-                anchor = this.findSelectedNodeAndOffset(abstractSelection.anchorSlot, abstractSelection.anchorOffset);
-            }
-            return {
-                focus,
-                anchor
-            };
-        }
-        catch (e) {
-            return {
-                focus: null,
-                anchor: null
-            };
-        }
-    }
-    getPreviousLinePositionByCurrent(position) {
-        return this.getLinePosition(position, false);
-    }
-    getNextLinePositionByCurrent(position) {
-        return this.getLinePosition(position, true);
-    }
-    getLinePosition(currentPosition, toNext) {
-        clearTimeout(this.cacheCaretPositionTimer);
-        let p;
-        if (this.oldCaretPosition) {
-            p = toNext ?
-                this.getNextLinePositionByOffset(currentPosition, this.oldCaretPosition.left) :
-                this.getPreviousLinePositionByOffset(currentPosition, this.oldCaretPosition.left);
-        }
-        else {
-            this.oldCaretPosition = this.getRect(currentPosition);
-            p = toNext ?
-                this.getNextLinePositionByOffset(currentPosition, this.oldCaretPosition.left) :
-                this.getPreviousLinePositionByOffset(currentPosition, this.oldCaretPosition.left);
-        }
-        this.cacheCaretPositionTimer = setTimeout(() => {
-            this.oldCaretPosition = null;
-        }, 3000);
-        return p;
-    }
-    /**
-     * 获取选区向上移动一行的位置。
-     * @param currentPosition
-     * @param startLeft 参考位置。
-     */
-    getPreviousLinePositionByOffset(currentPosition, startLeft) {
-        let isToPrevLine = false;
-        let loopCount = 0;
-        let minLeft = startLeft;
-        let focusSlot = currentPosition.slot;
-        let focusOffset = currentPosition.offset;
-        let minTop = this.getRect({
-            slot: focusSlot,
-            offset: focusOffset
-        }).top;
-        let position;
-        let oldPosition;
-        let oldLeft = 0;
-        while (true) {
-            loopCount++;
-            position = this.selection.getPreviousPositionByPosition(focusSlot, focusOffset);
-            focusSlot = position.slot;
-            focusOffset = position.offset;
-            const rect2 = this.getRect(position);
-            if (!isToPrevLine) {
-                if (rect2.left > minLeft || rect2.top + rect2.height <= minTop) {
-                    isToPrevLine = true;
-                }
-                else if (rect2.left === minLeft && rect2.top === minTop) {
-                    return position;
-                }
-                minLeft = rect2.left;
-                minTop = rect2.top;
-                // oldPosition = position
-            }
-            if (isToPrevLine) {
-                if (rect2.left <= startLeft) {
-                    return position;
-                }
-                if (oldPosition) {
-                    if (rect2.left >= oldLeft) {
-                        return oldPosition;
-                    }
-                }
-                oldLeft = rect2.left;
-                oldPosition = position;
-            }
-            if (loopCount > 10000) {
-                break;
-            }
-        }
-        return position || {
-            offset: 0,
-            slot: focusSlot
-        };
-    }
-    /**
-     * 获取选区向下移动一行的位置。
-     * @param currentPosition
-     * @param startLeft 参考位置。
-     */
-    getNextLinePositionByOffset(currentPosition, startLeft) {
-        let isToNextLine = false;
-        let loopCount = 0;
-        let maxRight = startLeft;
-        let focusSlot = currentPosition.slot;
-        let focusOffset = currentPosition.offset;
-        const rect = this.getRect({
-            slot: focusSlot,
-            offset: focusOffset
-        });
-        let minTop = rect.top;
-        let oldPosition;
-        let oldLeft = 0;
-        while (true) {
-            loopCount++;
-            const position = this.selection.getNextPositionByPosition(focusSlot, focusOffset);
-            focusSlot = position.slot;
-            focusOffset = position.offset;
-            const rect2 = this.getRect(position);
-            if (!isToNextLine) {
-                if (rect2.left < maxRight || rect2.top >= minTop + rect.height) {
-                    isToNextLine = true;
-                }
-                else if (rect2.left === maxRight && rect2.top === minTop) {
-                    return position;
-                }
-                maxRight = rect2.left;
-                minTop = rect2.top;
-                oldPosition = position;
-            }
-            if (isToNextLine) {
-                if (rect2.left > startLeft) {
-                    return oldPosition;
-                }
-                if (oldPosition) {
-                    if (rect2.left <= oldLeft) {
-                        return oldPosition;
-                    }
-                }
-                oldPosition = position;
-                oldLeft = rect2.left;
-            }
-            if (loopCount > 10000) {
-                break;
-            }
-        }
-        return oldPosition || {
-            offset: focusSlot.length,
-            slot: focusSlot
-        };
-    }
-    unListen() {
-        this.subs.forEach(i => i.unsubscribe());
-        this.subs = [];
-    }
-    listen(connector) {
-        if (!this.config.useContentEditable) {
-            const selection = this.nativeSelection;
-            this.subs.push(fromEvent(this.docContainer, 'mousedown').subscribe(ev => {
-                if (this.ignoreSelectionChange || ev.button === 2) {
-                    return;
-                }
-                if (!ev.shiftKey) {
-                    selection.removeAllRanges();
-                }
-            }));
-        }
-        let isUpdating = false;
-        this.subs.push(this.scheduler.onDocChange.subscribe(() => {
-            isUpdating = true;
-        }), this.scheduler.onDocChanged.pipe(delay()).subscribe(() => {
-            isUpdating = false;
-        }), fromEvent(document, 'selectionchange').subscribe(() => {
-            if (isUpdating) {
-                return;
-            }
-            if (this.syncSelectionFromNativeSelectionChange) {
-                this.syncSelection(connector);
-            }
-        }));
-    }
-    syncSelection(connector) {
-        var _a;
-        const selection = this.nativeSelection;
-        this.changeFromUser = true;
-        if (this.ignoreSelectionChange ||
-            this.input.composition ||
-            selection.rangeCount === 0 ||
-            !this.docContainer.contains(selection.anchorNode) ||
-            this.rootComponentRef.component.slots.length === 0) {
-            return;
-        }
-        const rawRange = selection.getRangeAt(0);
-        const nativeRange = rawRange.cloneRange();
-        const isFocusEnd = selection.focusNode === nativeRange.endContainer && selection.focusOffset === nativeRange.endOffset;
-        const isFocusStart = selection.focusNode === nativeRange.startContainer && selection.focusOffset === nativeRange.startOffset;
-        if (!this.docContainer.contains(selection.focusNode)) {
-            if (isFocusEnd) {
-                const nativeNode = this.domAdapter.getNativeNodeBySlot(this.rootComponentRef.component.slots.at(0));
-                if (!nativeNode) {
-                    return;
-                }
-                nativeRange.setEndAfter(nativeNode.lastChild);
-            }
-            else {
-                const nativeNode = this.domAdapter.getNativeNodeBySlot(this.rootComponentRef.component.slots.at(-1));
-                if (!nativeNode) {
-                    return;
-                }
-                nativeRange.setStartBefore(nativeNode.firstChild);
-            }
-        }
-        const startPosition = this.getCorrectedPosition(nativeRange.startContainer, nativeRange.startOffset, isFocusStart);
-        const endPosition = nativeRange.collapsed ?
-            startPosition :
-            this.getCorrectedPosition(nativeRange.endContainer, nativeRange.endOffset, isFocusEnd);
-        if ([Node.ELEMENT_NODE, Node.TEXT_NODE].includes((_a = nativeRange.commonAncestorContainer) === null || _a === void 0 ? void 0 : _a.nodeType) &&
-            startPosition && endPosition) {
-            const abstractSelection = connector.beforeChange(isFocusEnd ? {
-                anchorSlot: startPosition.slot,
-                anchorOffset: startPosition.offset,
-                focusSlot: endPosition.slot,
-                focusOffset: endPosition.offset
-            } : {
-                focusSlot: startPosition.slot,
-                focusOffset: startPosition.offset,
-                anchorSlot: endPosition.slot,
-                anchorOffset: endPosition.offset
-            });
-            if (!abstractSelection) {
-                this.selectionChangeEvent.next(null);
-                connector.setSelection(null);
-                return;
-            }
-            const { focus, anchor } = this.getPositionByRange(abstractSelection);
-            if (focus && anchor) {
-                let start = anchor;
-                let end = focus;
-                if (isFocusStart) {
-                    start = focus;
-                    end = anchor;
-                }
-                if (nativeRange.startContainer !== start.node || nativeRange.startOffset !== start.offset) {
-                    nativeRange.setStart(start.node, start.offset);
-                }
-                if (nativeRange.endContainer !== end.node || nativeRange.endOffset !== end.offset) {
-                    nativeRange.setEnd(end.node, end.offset);
-                }
-                connector.setSelection(abstractSelection);
-                if (selection.isCollapsed && (rawRange.startContainer !== start.node ||
-                    rawRange.startOffset !== start.offset ||
-                    rawRange.endContainer !== end.node ||
-                    rawRange.endOffset !== end.offset)) {
-                    rawRange.setStart(start.node, start.offset);
-                    rawRange.setEnd(end.node, end.offset);
-                }
-                this.selectionChangeEvent.next(nativeRange);
-            }
-            else {
-                connector.setSelection(null);
-            }
-            return;
-        }
-        connector.setSelection(null);
-    }
-    findSelectedNodeAndOffset(slot, offset) {
-        const prev = slot.getContentAtIndex(offset - 1);
-        const nodes = this.domAdapter.getNodesBySlot(slot);
-        if (prev) {
-            if (typeof prev !== 'string') {
-                const nativeNode = this.domAdapter.getNativeNodeByComponent(prev);
-                return {
-                    node: nativeNode.parentNode,
-                    offset: Array.from(nativeNode.parentNode.childNodes).indexOf(nativeNode) + 1
-                };
-            }
-            else if (prev === '\n') {
-                for (const node of nodes) {
-                    if (node instanceof Text) {
-                        continue;
-                    }
-                    if (node.nodeName === 'BR') {
-                        const position = this.domAdapter.getLocationByNativeNode(node);
-                        if (position) {
-                            if (position.endIndex === offset) {
-                                const parentNode = node.parentNode;
-                                return {
-                                    node: parentNode,
-                                    offset: Array.from(parentNode.childNodes).indexOf(node) + 1
-                                };
-                            }
-                        }
-                    }
-                }
-            }
-        }
-        const current = slot.getContentAtIndex(offset);
-        if (current && typeof current !== 'string') {
-            const nativeNode = this.domAdapter.getNativeNodeByComponent(current);
-            return {
-                node: nativeNode.parentNode,
-                offset: Array.from(nativeNode.parentNode.childNodes).indexOf(nativeNode)
-            };
-        }
-        for (const node of nodes) {
-            if (node instanceof Element) {
-                if (node.tagName === 'BR') {
-                    const position = this.domAdapter.getLocationByNativeNode(node);
-                    if (position) {
-                        if (position.startIndex === offset) {
-                            const parentNode = node.parentNode;
-                            return {
-                                node: parentNode,
-                                offset: Array.from(parentNode.childNodes).indexOf(node)
-                            };
-                        }
-                    }
-                }
-                continue;
-            }
-            const position = this.domAdapter.getLocationByNativeNode(node);
-            if (position) {
-                if (offset >= position.startIndex && offset <= position.endIndex) {
-                    return {
-                        node: node,
-                        offset: offset - position.startIndex
-                    };
-                }
-            }
-        }
-        return null;
-    }
-    getCorrectedPosition(node, offset, toAfter, excludeNodes = []) {
-        excludeNodes.push(node);
-        if (node.nodeType === Node.ELEMENT_NODE) {
-            const containerPosition = this.domAdapter.getLocationByNativeNode(node);
-            const childNode = node.childNodes[offset];
-            if (childNode) {
-                const childPosition = this.domAdapter.getLocationByNativeNode(childNode);
-                if (childPosition) {
-                    if (containerPosition) {
-                        return {
-                            slot: childPosition.slot,
-                            offset: childPosition.startIndex
-                        };
-                    }
-                    return this.findFocusNode(childNode, toAfter, excludeNodes);
-                }
-                return this.findFocusNode(childNode, toAfter, excludeNodes);
-            }
-            const prevNode = node.childNodes[offset - 1];
-            if (prevNode) {
-                const prevPosition = this.domAdapter.getLocationByNativeNode(prevNode);
-                if (prevPosition && containerPosition) {
-                    return {
-                        slot: prevPosition.slot,
-                        offset: prevPosition.endIndex
-                    };
-                }
-            }
-            if (containerPosition) {
-                return {
-                    slot: containerPosition.slot,
-                    offset: containerPosition.endIndex
-                };
-            }
-            const nextNode = toAfter ? node.nextSibling : node.previousSibling;
-            if (nextNode) {
-                return this.findFocusNode(nextNode, toAfter, excludeNodes);
-            }
-            return this.findFocusNodeByParent(node, toAfter, excludeNodes);
-        }
-        else if (node.nodeType === Node.TEXT_NODE) {
-            const containerPosition = this.domAdapter.getLocationByNativeNode(node);
-            if (containerPosition) {
-                return {
-                    slot: containerPosition.slot,
-                    offset: containerPosition.startIndex + offset
-                };
-            }
-            const nextNode = toAfter ? node.nextSibling : node.previousSibling;
-            if (nextNode) {
-                return this.findFocusNode(nextNode, toAfter, excludeNodes);
-            }
-            return this.findFocusNodeByParent(node, toAfter, excludeNodes);
-        }
-        return null;
-    }
-    findFocusNode(node, toAfter = false, excludeNodes = []) {
-        if (excludeNodes.includes(node)) {
-            const next = toAfter ? node.nextSibling : node.previousSibling;
-            if (next) {
-                return this.findFocusNode(next, toAfter, excludeNodes);
-            }
-            return this.findFocusNodeByParent(node, toAfter, excludeNodes);
-        }
-        excludeNodes.push(node);
-        const position = this.domAdapter.getLocationByNativeNode(node);
-        if (position) {
-            return {
-                slot: position.slot,
-                offset: toAfter ? position.startIndex : position.endIndex
-            };
-        }
-        const firstChild = toAfter ? node.firstChild : node.lastChild;
-        if (firstChild) {
-            return this.findFocusNode(firstChild, toAfter, excludeNodes);
-        }
-        const nextSibling = toAfter ? node.nextSibling : node.previousSibling;
-        if (nextSibling) {
-            return this.findFocusNode(nextSibling, toAfter, excludeNodes);
-        }
-        return this.findFocusNodeByParent(node, toAfter, excludeNodes);
-    }
-    findFocusNodeByParent(node, toAfter, excludeNodes) {
-        const parentNode = node.parentNode;
-        if (parentNode) {
-            const parentPosition = this.domAdapter.getLocationByNativeNode(parentNode);
-            if (parentPosition) {
-                return {
-                    slot: parentPosition.slot,
-                    offset: toAfter ? parentPosition.endIndex : parentPosition.startIndex
-                };
-            }
-            excludeNodes.push(node);
-            return this.findFocusNode(parentNode, toAfter, excludeNodes);
-        }
-        return null;
-    }
-};
-SelectionBridge = __decorate([
-    Injectable(),
-    __param(0, Inject(EDITOR_OPTIONS)),
-    __metadata("design:paramtypes", [Object, Textbus,
-        Controller,
-        Selection,
-        RootComponentRef,
-        Input,
-        Scheduler,
-        DomAdapter])
-], SelectionBridge);
-
-const iframeHTML = `
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
-  <meta http-equiv="X-UA-Compatible" content="ie=edge">
-  <title>Textbus</title>
-  <style>
-    html {position: fixed; left:0; overflow: hidden}
-    html, body{height: 100%;width:100%}
-    body{margin:0; overflow: hidden}
-    textarea{width: 2000px;height: 100%;opacity: 0; padding: 0; outline: none; border: none; position: absolute; left:0; top:0;}
-  </style>
-</head>
-<body>
-</body>
-</html>
-`;
-class ExperimentalCaret {
-    get rect() {
-        return this.caret.getBoundingClientRect();
-    }
-    set display(v) {
-        this._display = v;
-        this.caret.style.visibility = v ? 'visible' : 'hidden';
-    }
-    get display() {
-        return this._display;
-    }
-    constructor(domRenderer, scheduler, editorMask) {
-        Object.defineProperty(this, "domRenderer", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: domRenderer
-        });
-        Object.defineProperty(this, "scheduler", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: scheduler
-        });
-        Object.defineProperty(this, "editorMask", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: editorMask
-        });
-        Object.defineProperty(this, "onPositionChange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "onStyleChange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "elementRef", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "changeFromSelf", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        Object.defineProperty(this, "getLimit", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: function () {
-                return {
-                    top: 0,
-                    bottom: document.documentElement.clientHeight
-                };
-            }
-        });
-        Object.defineProperty(this, "timer", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: null
-        });
-        Object.defineProperty(this, "caret", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "_display", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: true
-        });
-        Object.defineProperty(this, "flashing", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: true
-        });
-        Object.defineProperty(this, "subscription", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Subscription()
-        });
-        Object.defineProperty(this, "positionChangeEvent", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Subject()
-        });
-        Object.defineProperty(this, "styleChangeEvent", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Subject()
-        });
-        Object.defineProperty(this, "oldRange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: null
-        });
-        this.onPositionChange = this.positionChangeEvent.pipe(distinctUntilChanged());
-        this.onStyleChange = this.styleChangeEvent.asObservable();
-        this.elementRef = createElement('div', {
-            styles: {
-                position: 'absolute',
-                width: '2px',
-                pointerEvents: 'none'
-            },
-            children: [
-                this.caret = createElement('span', {
-                    styles: {
-                        width: '100%',
-                        height: '100%',
-                        position: 'absolute',
-                        left: 0,
-                        top: 0
-                    }
-                })
-            ]
-        });
-        this.subscription.add(fromEvent(document, 'mousedown').subscribe(() => {
-            this.flashing = false;
-        }), fromEvent(document, 'mouseup').subscribe(() => {
-            this.flashing = true;
-        }));
-        this.editorMask.appendChild(this.elementRef);
-    }
-    refresh() {
-        if (this.oldRange) {
-            this.show(this.oldRange, false);
-        }
-    }
-    show(range, restart) {
-        this.oldRange = range;
-        if (restart || this.scheduler.lastChangesHasLocalUpdate) {
-            clearTimeout(this.timer);
-        }
-        this.updateCursorPosition(range);
-        if (range.collapsed) {
-            if (restart || this.scheduler.lastChangesHasLocalUpdate) {
-                this.display = true;
-                const toggleShowHide = () => {
-                    this.display = !this.display || !this.flashing;
-                    this.timer = setTimeout(toggleShowHide, 400);
-                };
-                clearTimeout(this.timer);
-                this.timer = setTimeout(toggleShowHide, 400);
-            }
-        }
-        else {
-            this.display = false;
-            clearTimeout(this.timer);
-        }
-    }
-    hide() {
-        this.display = false;
-        clearTimeout(this.timer);
-        this.positionChangeEvent.next(null);
-    }
-    destroy() {
-        clearTimeout(this.timer);
-        // this.caret.
-        this.subscription.unsubscribe();
-    }
-    updateCursorPosition(nativeRange) {
-        const startContainer = nativeRange.startContainer;
-        const node = (startContainer.nodeType === Node.ELEMENT_NODE ? startContainer : startContainer.parentNode);
-        if ((node === null || node === void 0 ? void 0 : node.nodeType) !== Node.ELEMENT_NODE) {
-            this.positionChangeEvent.next(null);
-            return;
-        }
-        const compositionNode = this.domRenderer.compositionNode;
-        if (compositionNode) {
-            nativeRange = nativeRange.cloneRange();
-            nativeRange.selectNodeContents(compositionNode);
-            nativeRange.collapse();
-        }
-        const rect = getLayoutRectByRange(nativeRange);
-        const { fontSize, lineHeight, color, writingMode } = getComputedStyle(node);
-        let height;
-        if (isNaN(+lineHeight)) {
-            const f = parseFloat(lineHeight);
-            if (isNaN(f)) {
-                height = parseFloat(fontSize);
-            }
-            else {
-                height = f;
-            }
-        }
-        else {
-            height = parseFloat(fontSize) * parseFloat(lineHeight);
-        }
-        const boxHeight = Math.max(Math.floor(Math.max(height, rect.height)), 12);
-        // const boxHeight = Math.floor(height)
-        let rectTop = rect.top;
-        if (rect.height < height) {
-            rectTop -= (height - rect.height) / 2;
-        }
-        rectTop = Math.floor(rectTop);
-        const containerRect = this.editorMask.getBoundingClientRect();
-        const top = Math.floor(rectTop - containerRect.top);
-        const left = Math.floor(rect.left + rect.width / 2 - containerRect.left);
-        let rotate = 0;
-        if (nativeRange.collapsed) {
-            rotate = Math.round(Math.atan2(rect.width, rect.height) * 180 / Math.PI);
-            if (rotate !== 0) {
-                const hackEle = document.createElement('span');
-                // eslint-disable-next-line max-len
-                hackEle.style.cssText = 'display: inline-block; width: 10px; height: 10px; position: relative; contain: layout style size; writing-mode: inherit';
-                const pointEle = document.createElement('span');
-                pointEle.style.cssText = 'position: absolute; left: 0; top: 0; width:0;height:0';
-                hackEle.append(pointEle);
-                node.append(hackEle);
-                const p1 = pointEle.getBoundingClientRect();
-                pointEle.style.right = '0';
-                pointEle.style.left = '';
-                const p2 = pointEle.getBoundingClientRect();
-                const x = p1.x - p2.x;
-                const y = p1.y - p2.y;
-                rotate = Math.atan2(y, x) * 180 / Math.PI;
-                hackEle.remove();
-            }
-        }
-        if (writingMode === 'vertical-lr' || writingMode === 'vertical-rl') {
-            rotate += 90;
-        }
-        Object.assign(this.elementRef.style, {
-            left: left + 'px',
-            top: top + 'px',
-            height: boxHeight + 'px',
-            lineHeight: boxHeight + 'px',
-            fontSize,
-            transform: `rotate(${rotate}deg)`,
-        });
-        this.caret.style.backgroundColor = color === 'rgba(0, 0, 0, 0)' ? '#000' : color;
-        this.styleChangeEvent.next({
-            height: boxHeight + 'px',
-            lineHeight: boxHeight + 'px',
-            fontSize
-        });
-        this.positionChangeEvent.next({
-            left,
-            top: rectTop,
-            height: boxHeight
-        });
-        if (this.changeFromSelf) {
-            this.changeFromSelf = false;
-            const selfRect = this.elementRef.getBoundingClientRect();
-            const scrollContainer = this.getScrollContainer(startContainer);
-            const scrollRect = scrollContainer === document.documentElement ?
-                { top: 0, bottom: document.documentElement.clientHeight } :
-                scrollContainer.getBoundingClientRect();
-            const limit = this.getLimit();
-            const top = Math.max(limit.top, scrollRect.top);
-            const bottom = Math.min(limit.bottom, scrollRect.bottom);
-            if (selfRect.top < top) {
-                scrollContainer.scrollTop -= top - selfRect.top;
-            }
-            else if (selfRect.bottom > bottom) {
-                scrollContainer.scrollTop += selfRect.bottom - bottom;
-            }
-        }
-    }
-    getScrollContainer(container) {
-        while (container) {
-            if (container instanceof Element) {
-                const styles = getComputedStyle(container);
-                if (styles.overflow !== 'visible' || styles.overflowX !== 'visible' || styles.overflowY !== 'visible') {
-                    return container;
-                }
-            }
-            container = container.parentNode;
-        }
-        return document.documentElement;
-    }
-}
-/**
- * Textbus PC 端输入实现
- */
-let MagicInput = class MagicInput extends Input {
-    set disabled(b) {
-        this._disabled = b;
-        if (b && this.textarea) {
-            this.textarea.disabled = b;
-        }
-    }
-    get disabled() {
-        return this._disabled;
-    }
-    constructor(domAdapter, parser, keyboard, commander, selection, controller, scheduler, textbus) {
-        super();
-        Object.defineProperty(this, "domAdapter", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: domAdapter
-        });
-        Object.defineProperty(this, "parser", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: parser
-        });
-        Object.defineProperty(this, "keyboard", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: keyboard
-        });
-        Object.defineProperty(this, "commander", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: commander
-        });
-        Object.defineProperty(this, "selection", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: selection
-        });
-        Object.defineProperty(this, "controller", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: controller
-        });
-        Object.defineProperty(this, "scheduler", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: scheduler
-        });
-        Object.defineProperty(this, "textbus", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: textbus
-        });
-        Object.defineProperty(this, "composition", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        Object.defineProperty(this, "onReady", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "caret", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new ExperimentalCaret(this.domAdapter, this.scheduler, this.textbus.get(VIEW_MASK))
-        });
-        Object.defineProperty(this, "isSafari", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: isSafari()
-        });
-        Object.defineProperty(this, "isFirefox", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: isFirefox()
-        });
-        Object.defineProperty(this, "isMac", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: isMac()
-        });
-        Object.defineProperty(this, "isWindows", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: isWindows()
-        });
-        Object.defineProperty(this, "_disabled", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        Object.defineProperty(this, "container", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: this.createEditableFrame()
-        });
-        Object.defineProperty(this, "subscription", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Subscription()
-        });
-        Object.defineProperty(this, "doc", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "textarea", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: null
-        });
-        Object.defineProperty(this, "isFocus", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        Object.defineProperty(this, "nativeFocus", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        Object.defineProperty(this, "ignoreComposition", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        }); // 有 bug 版本搜狗拼音
-        this.onReady = new Promise(resolve => {
-            this.subscription.add(fromEvent(this.container, 'load').subscribe(() => {
-                const doc = this.container.contentDocument;
-                doc.open();
-                doc.write(iframeHTML);
-                doc.close();
-                this.doc = doc;
-                this.init();
-                resolve();
-            }), controller.onReadonlyStateChange.subscribe(() => {
-                if (controller.readonly) {
-                    this.blur();
-                }
-            }));
-        });
-        this.caret.elementRef.append(this.container);
-    }
-    focus(range, restart) {
-        var _a;
-        if (!this.disabled) {
-            this.caret.show(range, restart);
-        }
-        if (this.controller.readonly) {
-            return;
-        }
-        if (!this.isFocus) {
-            (_a = this.textarea) === null || _a === void 0 ? void 0 : _a.focus();
-            setTimeout(() => {
-                if (!this.nativeFocus && this.isFocus) {
-                    this.reInit();
-                }
-            });
-        }
-        this.isFocus = true;
-    }
-    blur() {
-        var _a;
-        this.caret.hide();
-        (_a = this.textarea) === null || _a === void 0 ? void 0 : _a.blur();
-        this.isFocus = false;
-    }
-    destroy() {
-        this.caret.destroy();
-        this.subscription.unsubscribe();
-    }
-    reInit(delay = false) {
-        var _a, _b, _c;
-        this.subscription.unsubscribe();
-        (_b = (_a = this.textarea) === null || _a === void 0 ? void 0 : _a.parentNode) === null || _b === void 0 ? void 0 : _b.removeChild(this.textarea);
-        this.subscription = new Subscription();
-        this.init();
-        if (delay) {
-            setTimeout(() => {
-                var _a;
-                (_a = this.textarea) === null || _a === void 0 ? void 0 : _a.focus();
-            });
-        }
-        else {
-            (_c = this.textarea) === null || _c === void 0 ? void 0 : _c.focus();
-        }
-    }
-    init() {
-        const doc = this.doc;
-        const contentBody = doc.body;
-        const textarea = doc.createElement('textarea');
-        textarea.disabled = this.disabled;
-        contentBody.appendChild(textarea);
-        this.textarea = textarea;
-        this.subscription.add(fromEvent(textarea, 'blur').subscribe(() => {
-            // if (this.isFocus) {
-            //   this.isFocus = false
-            //   this.reInit(true)
-            // }
-            this.isFocus = false;
-            this.nativeFocus = false;
-            this.caret.hide();
-            if (this.domAdapter.composition) {
-                const slot = this.domAdapter.composition.slot;
-                this.domAdapter.composition = null;
-                this.domAdapter.compositionNode = null;
-                slot.__changeMarker__.forceMarkDirtied();
-            }
-        }), fromEvent(textarea, 'focus').subscribe(() => {
-            this.nativeFocus = true;
-        }), this.caret.onStyleChange.subscribe(style => {
-            Object.assign(textarea.style, style);
-        }));
-        this.handleInput(textarea);
-        this.handleShortcut(textarea);
-        this.handleDefaultActions(textarea);
-    }
-    handleDefaultActions(textarea) {
-        this.subscription.add(fromEvent(isFirefox() ? textarea : document, 'copy').subscribe(ev => {
-            this.copyHandler(ev);
-        }), fromEvent(textarea, 'paste').subscribe(ev => {
-            this.pasteHandler(ev);
-        }));
-    }
-    copyHandler(ev) {
-        const selection = this.selection;
-        if (!selection.isSelected) {
-            return;
-        }
-        if (selection.startSlot === selection.endSlot && selection.endOffset - selection.startOffset === 1) {
-            const content = selection.startSlot.getContentAtIndex(selection.startOffset);
-            if (typeof content === 'object') {
-                const clipboardData = ev.clipboardData;
-                const nativeSelection = document.getSelection();
-                const range = nativeSelection.getRangeAt(0);
-                const div = document.createElement('div');
-                const fragment = range.cloneContents();
-                div.append(fragment);
-                clipboardData.setData('text/html', div.innerHTML);
-                clipboardData.setData('text', div.innerText);
-                ev.preventDefault();
-            }
-        }
-    }
-    pasteHandler(ev) {
-        const text = ev.clipboardData.getData('Text');
-        const types = Array.from(ev.clipboardData.types || []);
-        const files = Array.from(ev.clipboardData.files);
-        if (types.every(type => type === 'Files') && files.length) {
-            Promise.all(files.filter(i => {
-                return /image/i.test(i.type);
-            }).map(item => {
-                const reader = new FileReader();
-                return new Promise(resolve => {
-                    reader.onload = (event) => {
-                        resolve(event.target.result);
-                    };
-                    reader.readAsDataURL(item);
-                });
-            })).then(urls => {
-                const html = urls.map(i => {
-                    return `<img src=${i}>`;
-                }).join('');
-                this.paste(html, text);
-            });
-            ev.preventDefault();
-            return;
-        }
-        const div = this.doc.createElement('div');
-        div.style.cssText = 'width:1px; height:10px; overflow: hidden; position: fixed; left: 50%; top: 50%; opacity:0';
-        div.contentEditable = 'true';
-        this.doc.body.appendChild(div);
-        div.focus();
-        setTimeout(() => {
-            this.doc.body.removeChild(div);
-            div.style.cssText = '';
-            this.paste(div, text);
-        });
-    }
-    paste(dom, text) {
-        const slot = this.parser.parse(dom, new Slot([
-            ContentType.BlockComponent,
-            ContentType.InlineComponent,
-            ContentType.Text
-        ]));
-        this.commander.paste(slot, text);
-    }
-    handleShortcut(textarea) {
-        let isWriting = false;
-        let isIgnore = false;
-        this.subscription.add(fromEvent(textarea, 'compositionstart').subscribe(() => {
-            isWriting = true;
-        }), fromEvent(textarea, 'compositionend').subscribe(() => {
-            isWriting = false;
-        }), fromEvent(textarea, 'beforeinput').subscribe(ev => {
-            this.ignoreComposition = false;
-            if (this.isSafari) {
-                if (ev.inputType === 'insertFromComposition') {
-                    isIgnore = true;
-                }
-            }
-        }), fromEvent(textarea, 'keydown').pipe(filter(() => {
-            if (this.isSafari && isIgnore) {
-                isIgnore = false;
-                return false;
-            }
-            return !isWriting; // || !this.textarea.value
-        })).subscribe(ev => {
-            this.ignoreComposition = false;
-            let key = ev.key;
-            const keys = ')!@#$%^Z&*(';
-            const b = key === 'Process' && /Digit\d/.test(ev.code) && ev.shiftKey;
-            if (b) {
-                // 大小写锁定为大写 + 全角 + shift + 数字键，还存在问题
-                key = keys.charAt(+ev.code.substring(5));
-                ev.preventDefault();
-            }
-            this.caret.changeFromSelf = true;
-            const is = this.keyboard.execShortcut({
-                key: key,
-                altKey: ev.altKey,
-                shiftKey: ev.shiftKey,
-                modKey: this.isMac ? ev.metaKey : ev.ctrlKey,
-                agent: {
-                    key: ev.key,
-                    code: ev.code,
-                    keyCode: ev.keyCode,
-                }
-            });
-            if (is) {
-                this.ignoreComposition = true;
-                ev.preventDefault();
-            }
-            else {
-                this.caret.changeFromSelf = false;
-            }
-        }));
-    }
-    handleInput(textarea) {
-        let startIndex = 0;
-        this.subscription.add(fromEvent(textarea, 'compositionstart').pipe(filter(() => {
-            return !this.ignoreComposition;
-        })).subscribe(() => {
-            if (!this.selection.isCollapsed) {
-                this.caret.changeFromSelf = true;
-                this.commander.delete();
-            }
-            this.composition = true;
-            startIndex = this.selection.startOffset;
-            const startSlot = this.selection.startSlot;
-            const event = new Event(startSlot, {
-                index: startIndex
-            });
-            invokeListener(startSlot.parent, 'onCompositionStart', event);
-        }), fromEvent(textarea, 'compositionupdate').pipe(filter(() => {
-            return !this.ignoreComposition;
-        })).pipe(distinctUntilChanged((prev, next) => {
-            return prev.data !== next.data;
-        })).subscribe(ev => {
-            if (ev.data === ' ') {
-                // 处理搜狗五笔不符合 composition 事件预期，会意外跳光标的问题
-                return;
-            }
-            const startSlot = this.selection.startSlot;
-            this.domAdapter.composition = {
-                slot: startSlot,
-                text: ev.data,
-                offset: ev.data.length,
-                index: startIndex
-            };
-            this.caret.changeFromSelf = true;
-            this.caret.refresh();
-            const event = new Event(startSlot, {
-                index: startIndex,
-                data: ev.data
-            });
-            invokeListener(startSlot.parent, 'onCompositionUpdate', event);
-            startSlot.__changeMarker__.forceMarkDirtied();
-        }));
-        let isCompositionEnd = false;
-        this.subscription.add(merge(fromEvent(textarea, 'beforeinput').pipe(filter(ev => {
-            ev.preventDefault();
-            if (this.isFirefox && ev.inputType === 'insertFromPaste') {
-                return false;
-            }
-            if (this.isSafari) {
-                isCompositionEnd = ev.inputType === 'insertFromComposition';
-                return ev.inputType === 'insertText' || ev.inputType === 'insertFromComposition';
-            }
-            return !ev.isComposing && !!ev.data;
-        }), map(ev => {
-            return ev.data;
-        })), this.isSafari ? new Observable() : fromEvent(textarea, 'compositionend')
-            .pipe(filter(() => {
-            return !this.ignoreComposition;
-        })).pipe(map(ev => {
-            isCompositionEnd = true;
-            ev.preventDefault();
-            textarea.value = '';
-            return ev.data;
-        }))).subscribe(text => {
-            var _a;
-            this.composition = false;
-            this.domAdapter.composition = null;
-            if (text) {
-                this.caret.changeFromSelf = true;
-                this.commander.write(text);
-            }
-            else {
-                (_a = this.selection.startSlot) === null || _a === void 0 ? void 0 : _a.__changeMarker__.forceMarkDirtied();
-            }
-            if (isCompositionEnd) {
-                const startSlot = this.selection.startSlot;
-                if (startSlot) {
-                    const event = new Event(startSlot, null);
-                    invokeListener(startSlot.parent, 'onCompositionEnd', event);
-                }
-            }
-            isCompositionEnd = false;
-        }));
-    }
-    createEditableFrame() {
-        return createElement('iframe', {
-            attrs: {
-                scrolling: 'no'
-            },
-            styles: {
-                border: 'none',
-                width: '100%',
-                display: 'block',
-                height: '100%',
-                position: 'relative',
-                top: this.isWindows ? '3px' : '0'
-            }
-        });
-    }
-};
-MagicInput = __decorate([
-    Injectable(),
-    __metadata("design:paramtypes", [DomAdapter,
-        Parser,
-        Keyboard,
-        Commander,
-        Selection,
-        Controller,
-        Scheduler,
-        Textbus])
-], MagicInput);
-
-/**
- * 远程光标绘制范围计算代理类，可用于定制特定场景下的远程选区绘制，如表格有选区，不会遵守常见的文档流形式
- */
-class CollaborateSelectionAwarenessDelegate {
-}
-/**
- * 协作光标绘制类
- */
-let CollaborateCursor = class CollaborateCursor {
-    constructor(textbus, nativeSelection, scheduler, selection, awarenessDelegate) {
-        Object.defineProperty(this, "nativeSelection", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: nativeSelection
-        });
-        Object.defineProperty(this, "scheduler", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: scheduler
-        });
-        Object.defineProperty(this, "selection", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: selection
-        });
-        Object.defineProperty(this, "awarenessDelegate", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: awarenessDelegate
-        });
-        Object.defineProperty(this, "host", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: createElement('div', {
-                styles: {
-                    position: 'absolute',
-                    left: 0,
-                    top: 0,
-                    width: '100%',
-                    height: '100%',
-                    pointerEvents: 'none',
-                    zIndex: 1
-                }
-            })
-        });
-        Object.defineProperty(this, "canvasContainer", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: createElement('div', {
-                styles: {
-                    position: 'absolute',
-                    left: 0,
-                    top: 0,
-                    width: '100%',
-                    height: '100%',
-                    overflow: 'hidden'
-                }
-            })
-        });
-        Object.defineProperty(this, "canvas", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: createElement('canvas', {
-                styles: {
-                    position: 'absolute',
-                    opacity: 0.5,
-                    left: 0,
-                    top: 0,
-                    width: '100%',
-                    height: document.documentElement.clientHeight + 'px',
-                    pointerEvents: 'none',
-                }
-            })
-        });
-        Object.defineProperty(this, "context", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: this.canvas.getContext('2d')
-        });
-        Object.defineProperty(this, "tooltips", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: createElement('div', {
-                styles: {
-                    position: 'absolute',
-                    left: 0,
-                    top: 0,
-                    width: '100%',
-                    height: '100%',
-                    pointerEvents: 'none',
-                    fontSize: '12px',
-                    zIndex: 10
-                }
-            })
-        });
-        Object.defineProperty(this, "onRectsChange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Subject()
-        });
-        Object.defineProperty(this, "subscription", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Subscription()
-        });
-        Object.defineProperty(this, "selectionCursors", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: []
-        });
-        Object.defineProperty(this, "container", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "ratio", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: window.devicePixelRatio || 1
-        });
-        this.container = textbus.get(VIEW_CONTAINER);
-        this.canvasContainer.append(this.canvas);
-        this.host.append(this.canvasContainer, this.tooltips);
-        this.container.prepend(this.host);
-        this.subscription.add(this.onRectsChange.subscribe(rects => {
-            for (const rect of rects) {
-                this.context.fillStyle = rect.color;
-                this.context.beginPath();
-                this.context.rect(rect.left, rect.top, rect.width, rect.height);
-                this.context.fill();
-                this.context.closePath();
-            }
-        }), fromEvent(window, 'resize').subscribe(() => {
-            this.canvas.style.height = document.documentElement.clientHeight + 'px';
-            this.refresh();
-        }), this.scheduler.onDocChanged.subscribe(() => {
-            this.refresh();
-        }));
-    }
-    /**
-     * 刷新协作光标，由于 Textbus 只会绘制可视区域的光标，当可视区域发生变化时，需要重新绘制
-     */
-    refresh() {
-        this.draw(this.selectionCursors);
-    }
-    destroy() {
-        this.subscription.unsubscribe();
-    }
-    /**
-     * 根据远程用户光标位置，绘制协作光标
-     * @param paths
-     */
-    draw(paths) {
-        this.selectionCursors = paths;
-        const containerRect = this.container.getBoundingClientRect();
-        this.canvas.style.top = containerRect.top * -1 + 'px';
-        this.canvas.width = this.canvas.offsetWidth * this.ratio;
-        this.canvas.height = this.canvas.offsetHeight * this.ratio;
-        this.context.scale(this.ratio, this.ratio);
-        this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
-        const users = [];
-        paths.filter(i => {
-            return i.selection.anchor.length && i.selection.focus.length;
-        }).forEach(item => {
-            const anchorPaths = [...item.selection.anchor];
-            const focusPaths = [...item.selection.focus];
-            const anchorOffset = anchorPaths.pop();
-            const anchorSlot = this.selection.findSlotByPaths(anchorPaths);
-            const focusOffset = focusPaths.pop();
-            const focusSlot = this.selection.findSlotByPaths(focusPaths);
-            if (!anchorSlot || !focusSlot) {
-                return;
-            }
-            const { focus, anchor } = this.nativeSelection.getPositionByRange({
-                focusOffset,
-                anchorOffset,
-                focusSlot,
-                anchorSlot
-            });
-            if (!focus || !anchor) {
-                return;
-            }
-            const nativeRange = document.createRange();
-            try {
-                nativeRange.setStart(anchor.node, anchor.offset);
-                nativeRange.setEnd(focus.node, focus.offset);
-            }
-            catch (e) {
-                return;
-            }
-            if ((anchor.node !== focus.node || anchor.offset !== focus.offset) && nativeRange.collapsed) {
-                nativeRange.setStart(focus.node, focus.offset);
-                nativeRange.setEnd(anchor.node, anchor.offset);
-            }
-            let rects = false;
-            if (this.awarenessDelegate) {
-                rects = this.awarenessDelegate.getRects({
-                    focusOffset,
-                    anchorOffset,
-                    focusSlot,
-                    anchorSlot
-                }, nativeRange, item);
-            }
-            if (!rects) {
-                rects = nativeRange.getClientRects();
-            }
-            const selectionRects = [];
-            for (let i = rects.length - 1; i >= 0; i--) {
-                const rect = rects[i];
-                selectionRects.push({
-                    color: item.color,
-                    username: item.username,
-                    left: rect.left - containerRect.left,
-                    top: rect.top,
-                    width: rect.width,
-                    height: rect.height,
-                });
-            }
-            this.onRectsChange.next(selectionRects);
-            const cursorRange = nativeRange.cloneRange();
-            cursorRange.setStart(focus.node, focus.offset);
-            cursorRange.collapse(true);
-            const cursorRect = getLayoutRectByRange(cursorRange);
-            const rect = {
-                username: item.username,
-                color: item.color,
-                left: cursorRect.left - containerRect.left,
-                top: cursorRect.top - containerRect.top,
-                width: 1,
-                height: cursorRect.height
-            };
-            if (rect.left < 0 || rect.top < 0 || rect.left > containerRect.width) {
-                return;
-            }
-            users.push(rect);
-        });
-        this.drawUserCursor(users);
-    }
-    drawUserCursor(rects) {
-        for (let i = 0; i < rects.length; i++) {
-            const rect = rects[i];
-            const { cursor, userTip, anchor } = this.getUserCursor(i);
-            Object.assign(cursor.style, {
-                left: rect.left + 'px',
-                top: rect.top + 'px',
-                width: rect.width + 'px',
-                height: rect.height + 'px',
-                background: rect.color,
-                display: 'block'
-            });
-            anchor.style.background = rect.color;
-            userTip.innerText = rect.username;
-            userTip.style.background = rect.color;
-        }
-        for (let i = rects.length; i < this.tooltips.children.length; i++) {
-            this.tooltips.removeChild(this.tooltips.children[i]);
-        }
-    }
-    getUserCursor(index) {
-        let child = this.tooltips.children[index];
-        if (child) {
-            const anchor = child.children[0];
-            return {
-                cursor: child,
-                anchor,
-                userTip: anchor.children[0]
-            };
-        }
-        const userTip = createElement('span', {
-            styles: {
-                position: 'absolute',
-                left: '50%',
-                transform: 'translateX(-50%)',
-                marginBottom: '2px',
-                bottom: '100%',
-                whiteSpace: 'nowrap',
-                color: '#fff',
-                boxShadow: '0 1px 2px rgba(0,0,0,.1)',
-                opacity: 0.8,
-                borderRadius: '3px',
-                padding: '3px 5px',
-                pointerEvents: 'none',
-            }
-        });
-        const anchor = createElement('span', {
-            styles: {
-                position: 'absolute',
-                top: '-2px',
-                left: '-2px',
-                width: '5px',
-                height: '5px',
-                borderRadius: '50%',
-                pointerEvents: 'auto',
-                pointer: 'cursor',
-            },
-            children: [userTip]
-        });
-        child = createElement('span', {
-            styles: {
-                position: 'absolute',
-            },
-            children: [
-                anchor
-            ]
-        });
-        this.tooltips.append(child);
-        return {
-            cursor: child,
-            anchor,
-            userTip
-        };
-    }
-};
-CollaborateCursor = __decorate([
-    Injectable(),
-    __param(4, Optional()),
-    __metadata("design:paramtypes", [Textbus,
-        SelectionBridge,
-        Scheduler,
-        Selection,
-        CollaborateSelectionAwarenessDelegate])
-], CollaborateCursor);
-
-class NativeCaret {
-    set nativeRange(range) {
-        this._nativeRange = range;
-        if (range) {
-            const r = range.cloneRange();
-            r.collapse(true);
-            const rect = getLayoutRectByRange(r);
-            this.positionChangeEvent.next({
-                left: rect.left,
-                top: rect.top,
-                height: rect.height
-            });
-        }
-        else {
-            this.positionChangeEvent.next(null);
-        }
-    }
-    get nativeRange() {
-        return this._nativeRange;
-    }
-    get rect() {
-        if (this.nativeRange) {
-            const range = this.nativeRange.cloneRange();
-            range.collapse(true);
-            return getLayoutRectByRange(range);
-        }
-        return {
-            left: 0,
-            top: 0,
-            width: 0,
-            height: 0
-        };
-    }
-    constructor() {
-        Object.defineProperty(this, "onPositionChange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "_nativeRange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: null
-        });
-        Object.defineProperty(this, "subs", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: []
-        });
-        Object.defineProperty(this, "positionChangeEvent", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Subject()
-        });
-        this.onPositionChange = this.positionChangeEvent.pipe(distinctUntilChanged());
-    }
-    refresh() {
-        //
-    }
-    destroy() {
-        this.subs.forEach(i => i.unsubscribe());
-        this.subs = [];
-    }
-}
-let NativeInput = class NativeInput extends Input {
-    set disabled(b) {
-        this._disabled = b;
-        if (this.controller.readonly) {
-            this.documentView.contentEditable = 'false';
-            return;
-        }
-        this.documentView.contentEditable = b ? 'false' : 'true';
-    }
-    get disabled() {
-        return this._disabled;
-    }
-    constructor(textbus, parser, selection, keyboard, domAdapter, commander, controller) {
-        super();
-        Object.defineProperty(this, "parser", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: parser
-        });
-        Object.defineProperty(this, "selection", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: selection
-        });
-        Object.defineProperty(this, "keyboard", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: keyboard
-        });
-        Object.defineProperty(this, "domAdapter", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: domAdapter
-        });
-        Object.defineProperty(this, "commander", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: commander
-        });
-        Object.defineProperty(this, "controller", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: controller
-        });
-        Object.defineProperty(this, "caret", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new NativeCaret()
-        });
-        Object.defineProperty(this, "composition", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        // compositionState: CompositionState | null = null
-        Object.defineProperty(this, "onReady", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: Promise.resolve()
-        });
-        Object.defineProperty(this, "_disabled", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        Object.defineProperty(this, "documentView", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "nativeSelection", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: document.getSelection()
-        });
-        Object.defineProperty(this, "subscription", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Subscription()
-        });
-        Object.defineProperty(this, "nativeRange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: null
-        });
-        Object.defineProperty(this, "isSafari", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: isSafari()
-        });
-        Object.defineProperty(this, "isMac", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: isMac()
-        });
-        Object.defineProperty(this, "isMobileBrowser", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: isMobileBrowser()
-        });
-        Object.defineProperty(this, "ignoreComposition", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        }); // 有 bug 版本搜狗拼音
-        this.documentView = textbus.get(VIEW_DOCUMENT);
-        if (!controller.readonly) {
-            this.documentView.contentEditable = 'true';
-        }
-        this.subscription.add(controller.onReadonlyStateChange.subscribe(() => {
-            this.documentView.contentEditable = controller.readonly ? 'false' : 'true';
-        }));
-        this.handleShortcut(this.documentView);
-        this.handleInput(this.documentView);
-        this.handleDefaultActions(this.documentView);
-    }
-    focus(nativeRange) {
-        if (this.controller.readonly) {
-            return;
-        }
-        this.caret.nativeRange = nativeRange;
-        this.nativeRange = nativeRange;
-    }
-    blur() {
-        if (this.nativeRange && this.nativeSelection.rangeCount > 0) {
-            const current = this.nativeSelection.getRangeAt(0);
-            if (current === this.nativeRange) {
-                this.nativeSelection.removeAllRanges();
-                this.nativeRange = null;
-                return;
-            }
-        }
-    }
-    destroy() {
-        this.caret.destroy();
-        this.subscription.unsubscribe();
-    }
-    handleDefaultActions(textarea) {
-        this.subscription.add(fromEvent(isFirefox() ? textarea : document, 'copy').subscribe(ev => {
-            this.copyHandler(ev);
-        }), fromEvent(textarea, 'paste').subscribe(ev => {
-            this.pasteHandler(ev);
-        }));
-    }
-    copyHandler(ev) {
-        const selection = this.selection;
-        if (!selection.isSelected) {
-            return;
-        }
-        if (selection.startSlot === selection.endSlot && selection.endOffset - selection.startOffset === 1) {
-            const content = selection.startSlot.getContentAtIndex(selection.startOffset);
-            if (typeof content === 'object') {
-                const clipboardData = ev.clipboardData;
-                const nativeSelection = document.getSelection();
-                const range = nativeSelection.getRangeAt(0);
-                const div = document.createElement('div');
-                const fragment = range.cloneContents();
-                div.append(fragment);
-                clipboardData.setData('text/html', div.innerHTML);
-                clipboardData.setData('text', div.innerText);
-                ev.preventDefault();
-            }
-        }
-    }
-    pasteHandler(ev) {
-        const text = ev.clipboardData.getData('Text');
-        const types = Array.from(ev.clipboardData.types || []);
-        const files = Array.from(ev.clipboardData.files);
-        if (types.every(type => type === 'Files') && files.length) {
-            Promise.all(files.filter(i => {
-                return /image/i.test(i.type);
-            }).map(item => {
-                const reader = new FileReader();
-                return new Promise(resolve => {
-                    reader.onload = (event) => {
-                        resolve(event.target.result);
-                    };
-                    reader.readAsDataURL(item);
-                });
-            })).then(urls => {
-                const html = urls.map(i => {
-                    return `<img src=${i}>`;
-                }).join('');
-                this.paste(html, text);
-            });
-            ev.preventDefault();
-            return;
-        }
-        const div = document.createElement('div');
-        div.style.cssText = 'width:1px; height:10px; overflow: hidden; position: fixed; left: 50%; top: 50%; opacity:0';
-        div.contentEditable = 'true';
-        document.body.appendChild(div);
-        div.focus();
-        setTimeout(() => {
-            document.body.removeChild(div);
-            div.style.cssText = '';
-            this.paste(div, text);
-        });
-    }
-    paste(dom, text) {
-        const slot = this.parser.parse(dom, new Slot([
-            ContentType.BlockComponent,
-            ContentType.InlineComponent,
-            ContentType.Text
-        ]));
-        this.commander.paste(slot, text);
-    }
-    handleShortcut(input) {
-        let isWriting = false;
-        let isIgnore = false;
-        this.subscription.add(fromEvent(input, 'compositionstart').subscribe(() => {
-            isWriting = true;
-        }), fromEvent(input, 'compositionend').subscribe(() => {
-            isWriting = false;
-        }), fromEvent(input, 'beforeinput').subscribe(ev => {
-            if (this.isSafari) {
-                if (ev.inputType === 'insertFromComposition') {
-                    isIgnore = true;
-                }
-            }
-        }), fromEvent(input, 'keydown').pipe(filter(() => {
-            if (this.isSafari && isIgnore) {
-                isIgnore = false;
-                return false;
-            }
-            return !isWriting; // || !this.textarea.value
-        })).subscribe(ev => {
-            this.ignoreComposition = false;
-            let key = ev.key;
-            const keys = ')!@#$%^Z&*(';
-            const b = key === 'Process' && /Digit\d/.test(ev.code) && ev.shiftKey;
-            if (b) {
-                key = keys.charAt(+ev.code.substring(5));
-                ev.preventDefault();
-            }
-            const is = this.keyboard.execShortcut({
-                key: key,
-                altKey: ev.altKey,
-                shiftKey: ev.shiftKey,
-                modKey: this.isMac ? ev.metaKey : ev.ctrlKey,
-                agent: {
-                    key: ev.key,
-                    keyCode: ev.keyCode,
-                    code: ev.code
-                }
-            });
-            if (is) {
-                this.ignoreComposition = true;
-                ev.preventDefault();
-            }
-        }));
-    }
-    handleInput(input) {
-        if (this.isMobileBrowser) {
-            this.handleMobileInput(input);
-        }
-        else {
-            this.handlePCInput(input);
-        }
-    }
-    handleMobileInput(input) {
-        let isCompositionStart = true;
-        let startIndex;
-        const compositionStart = () => {
-            this.composition = true;
-            startIndex = this.selection.startOffset;
-            const startSlot = this.selection.startSlot;
-            const event = new Event(startSlot, {
-                index: startIndex
-            });
-            invokeListener(startSlot.parent, 'onCompositionStart', event);
-        };
-        const compositionUpdate = (data) => {
-            const startSlot = this.selection.startSlot;
-            const event = new Event(startSlot, {
-                index: startIndex,
-                data
-            });
-            invokeListener(startSlot.parent, 'onCompositionUpdate', event);
-        };
-        const compositionEnd = (data) => {
-            this.composition = false;
-            if (data) {
-                this.commander.write(data);
-            }
-            const startSlot = this.selection.startSlot;
-            if (startSlot) {
-                const event = new Event(startSlot, null);
-                invokeListener(startSlot.parent, 'onCompositionEnd', event);
-            }
-        };
-        this.subscription.add(fromEvent(input, 'compositionstart').subscribe(() => {
-            compositionStart();
-        }), fromEvent(input, 'compositionupdate').subscribe(ev => {
-            compositionUpdate(ev.data);
-        }), fromEvent(input, 'compositionend').subscribe(ev => {
-            compositionEnd(ev.data);
-            const startContainer = this.nativeSelection.focusNode;
-            if (startContainer instanceof Text && startContainer.textContent === ev.data) {
-                startContainer.remove();
-            }
-        }), fromEvent(input, 'beforeinput').subscribe(ev => {
-            var _a;
-            switch (ev.inputType) {
-                case 'insertText':
-                    if (ev.data) {
-                        this.commander.write(ev.data);
-                        ev.preventDefault();
-                    }
-                    break;
-                case 'insertCompositionText':
-                    if (isCompositionStart) {
-                        isCompositionStart = false;
-                        compositionStart();
-                    }
-                    else {
-                        compositionUpdate(ev.data || '');
-                    }
-                    break;
-                case 'deleteCompositionText':
-                    this.composition = false;
-                    break;
-                case 'deleteContentBackward': {
-                    this.composition = false;
-                    const range = ev.getTargetRanges()[0];
-                    if (!range) {
-                        break;
-                    }
-                    const location = this.domAdapter.getLocationByNativeNode(range.startContainer);
-                    const startSlot = this.selection.startSlot;
-                    if (startSlot) {
-                        this.selection.setBaseAndExtent(startSlot, location.startIndex + range.startOffset, startSlot, location.startIndex + range.endOffset);
-                        this.commander.delete();
-                    }
-                    break;
-                }
-                case 'insertReplacementText': {
-                    this.composition = false;
-                    const range = ev.getTargetRanges()[0];
-                    const location = this.domAdapter.getLocationByNativeNode(range.startContainer);
-                    const startSlot = this.selection.startSlot;
-                    this.selection.setBaseAndExtent(startSlot, location.startIndex + range.startOffset, startSlot, location.startIndex + range.endOffset);
-                    this.commander.delete();
-                    const text = ((_a = ev.dataTransfer) === null || _a === void 0 ? void 0 : _a.getData('text')) || ev.data || null;
-                    if (text) {
-                        this.commander.write(text);
-                    }
-                    break;
-                }
-                //
-                // case 'insertFromComposition': {
-                //   compositionEnd(ev.data || '')
-                //   break
-                // }
-            }
-        }));
-    }
-    handlePCInput(input) {
-        let startIndex = 0;
-        let isCompositionEnd = false;
-        this.subscription.add(fromEvent(input, 'compositionstart').pipe(filter(() => {
-            return !this.ignoreComposition;
-        })).subscribe(() => {
-            this.composition = true;
-            startIndex = this.selection.startOffset;
-            const startSlot = this.selection.startSlot;
-            const event = new Event(startSlot, {
-                index: startIndex
-            });
-            invokeListener(startSlot.parent, 'onCompositionStart', event);
-        }), fromEvent(input, 'compositionupdate').pipe(filter(() => {
-            return !this.ignoreComposition;
-        })).subscribe(ev => {
-            const startSlot = this.selection.startSlot;
-            const event = new Event(startSlot, {
-                index: startIndex,
-                data: ev.data
-            });
-            invokeListener(startSlot.parent, 'onCompositionUpdate', event);
-        }), merge(fromEvent(input, 'beforeinput').pipe(map(ev => {
-            var _a;
-            ev.preventDefault();
-            if (ev.inputType === 'insertCompositionText') {
-                return null;
-            }
-            if (ev.inputType === 'insertReplacementText') {
-                const range = ev.getTargetRanges()[0];
-                const location = this.domAdapter.getLocationByNativeNode(range.startContainer);
-                const startSlot = this.selection.startSlot;
-                this.selection.setBaseAndExtent(startSlot, location.startIndex + range.startOffset, startSlot, location.startIndex + range.endOffset);
-                this.commander.delete();
-                return ((_a = ev.dataTransfer) === null || _a === void 0 ? void 0 : _a.getData('text')) || ev.data || null;
-            }
-            isCompositionEnd = ev.inputType === 'insertFromComposition';
-            if (isCompositionEnd && this.composition) {
-                return null;
-            }
-            if (this.isSafari) {
-                if (ev.inputType === 'insertText' || isCompositionEnd) {
-                    return ev.data;
-                }
-            }
-            if (!ev.isComposing && !!ev.data) {
-                return ev.data;
-            }
-            return null;
-        }), filter(text => {
-            return text;
-        })), this.isSafari ? new Observable() :
-            fromEvent(input, 'compositionend').pipe(filter(() => {
-                return !this.ignoreComposition;
-            })).pipe(filter(() => {
-                return this.composition;
-            }), map(ev => {
-                isCompositionEnd = true;
-                ev.preventDefault();
-                return ev.data;
-            }), filter(() => {
-                const b = this.ignoreComposition;
-                this.ignoreComposition = false;
-                return !b;
-            }))).subscribe(text => {
-            this.composition = false;
-            if (text) {
-                const startContainer = this.nativeSelection.focusNode;
-                if (startContainer instanceof Text && startContainer.textContent === text) {
-                    startContainer.remove();
-                }
-                this.commander.write(text);
-            }
-            if (isCompositionEnd) {
-                const startSlot = this.selection.startSlot;
-                if (startSlot) {
-                    const event = new Event(startSlot, null);
-                    invokeListener(startSlot.parent, 'onCompositionEnd', event);
-                }
-            }
-            isCompositionEnd = false;
-        }));
-    }
-};
-NativeInput = __decorate([
-    Injectable(),
-    __metadata("design:paramtypes", [Textbus,
-        Parser,
-        Selection,
-        Keyboard,
-        DomAdapter,
-        Commander,
-        Controller])
-], NativeInput);
-
-const browserErrorFn = makeError('BrowserModule');
-class BrowserModule {
-    constructor(config) {
-        Object.defineProperty(this, "config", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: config
-        });
-        Object.defineProperty(this, "providers", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "workbench", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        const { mask, wrapper } = BrowserModule.createLayout();
-        wrapper.prepend(config.adapter.host);
-        if (config.minHeight) {
-            config.adapter.host.style.minHeight = config.minHeight;
-        }
-        this.providers = [{
-                provide: EDITOR_OPTIONS,
-                useValue: config
-            }, {
-                provide: VIEW_CONTAINER,
-                useValue: wrapper
-            }, {
-                provide: VIEW_DOCUMENT,
-                useValue: config.adapter.host
-            }, {
-                provide: VIEW_MASK,
-                useValue: mask
-            }, {
-                provide: NativeSelectionBridge,
-                useExisting: SelectionBridge
-            }, {
-                provide: Input,
-                useClass: config.useContentEditable ? NativeInput : MagicInput
-            }, {
-                provide: Adapter,
-                useValue: config.adapter
-            }, {
-                provide: DomAdapter,
-                useValue: config.adapter
-            }, {
-                provide: FocusManager,
-                useFactory: (input) => {
-                    const focusEvent = new Subject();
-                    const blurEvent = new Subject();
-                    input.caret.onPositionChange.pipe(map(p => !!p), distinctUntilChanged()).subscribe(b => {
-                        if (b) {
-                            focusEvent.next();
-                        }
-                        else {
-                            blurEvent.next();
-                        }
-                    });
-                    return {
-                        onFocus: focusEvent,
-                        onBlur: blurEvent
-                    };
-                },
-                deps: [Input]
-            },
-            Parser,
-            SelectionBridge,
-            CollaborateCursor];
-        this.workbench = wrapper;
-    }
-    /**
-     * 解析 HTML 并返回一个组件实例
-     * @param html 要解析的 HTML
-     * @param rootComponentLoader 文档根组件加载器
-     * @param textbus
-     */
-    readDocumentByHTML(html, rootComponentLoader, textbus) {
-        const parser = textbus.get(Parser);
-        const doc = parser.parseDoc(html, rootComponentLoader);
-        if (doc instanceof Component) {
-            return doc;
-        }
-        throw browserErrorFn('rootComponentLoader must return a component instance.');
-    }
-    /**
-     * 将组件数据解析到组件实例中
-     * @param data 要解析的 JSON 数据
-     * @param rootComponent 根组件
-     * @param textbus
-     */
-    readDocumentByComponentLiteral(data, rootComponent, textbus) {
-        const registry = textbus.get(Registry);
-        return registry.createComponentByFactory(data, rootComponent);
-    }
-    setup(textbus) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const host = this.config.renderTo();
-            if (!(host instanceof HTMLElement)) {
-                throw browserErrorFn('view container is not a HTMLElement');
-            }
-            host.append(this.workbench);
-            yield textbus.get(Input).onReady;
-            return () => {
-                this.workbench.remove();
-            };
-        });
-    }
-    onAfterStartup(textbus) {
-        if (this.config.autoFocus) {
-            textbus.focus();
-        }
-    }
-    onDestroy(textbus) {
-        textbus.get(Input).destroy();
-        textbus.get(SelectionBridge).destroy();
-        textbus.get(CollaborateCursor).destroy();
-    }
-    static createLayout() {
-        const mask = createElement('div', {
-            attrs: {
-                'data-textbus-view': VIEW_MASK,
-            },
-            styles: {
-                position: 'absolute',
-                left: 0,
-                right: 0,
-                top: 0,
-                bottom: 0,
-                pointerEvents: 'none',
-                // overflow: 'hidden'
-            }
-        });
-        const maskWrapper = createElement('div', {
-            styles: {
-                position: 'absolute',
-                left: 0,
-                right: 0,
-                top: 0,
-                bottom: 0,
-                margin: '0 -2px',
-                zIndex: 1,
-                pointerEvents: 'none',
-                overflow: 'hidden'
-            },
-            children: [mask]
-        });
-        const wrapper = createElement('div', {
-            attrs: {
-                'data-textbus-view': VIEW_CONTAINER,
-            },
-            styles: {
-                display: 'flex',
-                minHeight: '100%',
-                position: 'relative',
-                flexDirection: 'column'
-            },
-            children: [maskWrapper]
-        });
-        return {
-            wrapper,
-            mask
-        };
-    }
-}
-
-export { BrowserModule, CollaborateCursor, CollaborateSelectionAwarenessDelegate, DomAdapter, EDITOR_OPTIONS, Input, MagicInput, NativeInput, Parser, SelectionBridge, VIEW_CONTAINER, VIEW_DOCUMENT, VIEW_MASK, createElement, getLayoutRectByRange, isFirefox, isMac, isMobileBrowser, isSafari, isWindows };