How to use @typewriter/editor - 10 common examples

To help you get started, we’ve selected a few @typewriter/editor examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github typewriter-editor / typewriter / packages / view / src / decorators.ts View on Github external
}

    if (this.change) {
      from = this.change.transformPosition(from);
      if (to != null) to = this.change.transformPosition(to);
    }

    // Optimize by adding to the existing delta when possible, compose is slow
    if (this.position < from) {
      this.delta.retain(from - this.position);
      this.position = from;
    } else if (this.position) {
      this.change = this.getChange();
      from = this.change.transformPosition(from);
      if (to != null) to = this.change.transformPosition(to);
      this.delta = new Delta();
      this.delta.retain(from);
      this.position = from;
    }

    return to != null ? [ from, to ] : from;
  }
}
github typewriter-editor / typewriter / packages / modules / src / input.ts View on Github external
onTab(new CustomEvent('shortcut', { detail: 'Shift+Tab' }));
          return true;
        }
        if (block && (force || block !== paper.blocks.getDefault() && !block.defaultFollows)) {
          editor.formatLine([ range[0], range[0] ], {}, SOURCE_USER);
          return true;
        }
      }

      if (range[0] + range[1] === 0) {
        const line = getLine(editor.contents, range[0]);
        if (flattenBlock(line, true)) return true;
      } else {
        // The "from" block needs to stay the same. The "to" block gets merged into it
        if (range[0] === range[1]) {
          const line = getLine(editor.contents, range[0]);
          if (range[0] === line.start && flattenBlock(line)) {
            return;
          }

          range[0]--;
        }
        editor.deleteText(range, SOURCE_USER);
      }
    }
github typewriter-editor / typewriter / packages / modules / src / input.ts View on Github external
function flattenBlock(line: Line, force?: boolean) {
        if (!range) return;
        const block = paper.blocks.findByAttributes(line.attributes) || paper.blocks.getDefault();
        if (block.indentable && line.attributes.indent) {
          onTab(new CustomEvent('shortcut', { detail: 'Shift+Tab' }));
          return true;
        }
        if (block && (force || block !== paper.blocks.getDefault() && !block.defaultFollows)) {
          editor.formatLine([ range[0], range[0] ], {}, SOURCE_USER);
          return true;
        }
      }

      if (range[0] + range[1] === 0) {
        const line = getLine(editor.contents, range[0]);
        if (flattenBlock(line, true)) return true;
      } else {
        // The "from" block needs to stay the same. The "to" block gets merged into it
        if (range[0] === range[1]) {
          const line = getLine(editor.contents, range[0]);
          if (range[0] === line.start && flattenBlock(line)) {
            return;
          }

          range[0]--;
        }
        editor.deleteText(range, SOURCE_USER);
      }
    }
github typewriter-editor / typewriter / packages / view-vdom / src / view.ts View on Github external
updateEditorSelection(source: string = SOURCE_API) {
    if (this._settingBrowserSelection) return this._settingBrowserSelection = false;
    const range = this.getSelection();

    // Store the last non-null selection for restoration on focus()
    if (range) this.lastSelection = range;

    this._settingEditorSelection = true;
    this.editor.setSelection(range, source);
    this._settingEditorSelection = false;

    // If the selection was adjusted when set then update the browser's selection
    const selection = this.getBrowserSelection();
    if (!shallowEqual(range, this.editor.selection) || (range && range[0] === range[1] && selection && selection.type === 'Range')) {
      this.updateBrowserSelection();
    }
  }
github typewriter-editor / typewriter / packages / view / src / delta-dom.ts View on Github external
if (!options) options = defaultOptions;

  var walker = root.ownerDocument.createTreeWalker(root, NodeFilter.SHOW_ELEMENT | NodeFilter.SHOW_TEXT, {
    acceptNode: node => {
      if (SKIP_ELEMENTS[node.nodeName]) {
        return NodeFilter.FILTER_REJECT;
      } else if (node.nodeType === Node.TEXT_NODE && node.nodeValue === '') {
        return NodeFilter.FILTER_REJECT;
      } else if (node.nodeType === Node.TEXT_NODE || options.notInDom || inDom) {
        return NodeFilter.FILTER_ACCEPT;
      } else {
        return NodeFilter.FILTER_REJECT;
      }
    }
  });
  const delta = new Delta();
  let currentBlock: any, firstBlockSeen = false, unknownBlock = false, empty = true, node: Node | null;
  let lastNode = false;

  if (options.startNode) {
    walker.currentNode = options.startNode;
    walker.previousNode();
    if (options.offset) delta.retain(options.offset, undefined);
  } else {
    walker.currentNode = root;
  }

  while ((node = walker.nextNode())) {
    if (node === options.endNode) lastNode = true;
    else if (lastNode) break;

    if (isBRPlaceholder(paper, node)) {
github typewriter-editor / typewriter / packages / view / src / delta-dom.ts View on Github external
export function deltaFromDom(root: Element, paper: Paper, options: any = {}): Delta {
  if (!root.ownerDocument) return new Delta();
  const inDom: boolean = root.ownerDocument && root.ownerDocument.contains(root);
  const { blocks, embeds } = paper;
  if (!options) options = defaultOptions;

  var walker = root.ownerDocument.createTreeWalker(root, NodeFilter.SHOW_ELEMENT | NodeFilter.SHOW_TEXT, {
    acceptNode: node => {
      if (SKIP_ELEMENTS[node.nodeName]) {
        return NodeFilter.FILTER_REJECT;
      } else if (node.nodeType === Node.TEXT_NODE && node.nodeValue === '') {
        return NodeFilter.FILTER_REJECT;
      } else if (node.nodeType === Node.TEXT_NODE || options.notInDom || inDom) {
        return NodeFilter.FILTER_ACCEPT;
      } else {
        return NodeFilter.FILTER_REJECT;
      }
    }
github typewriter-editor / typewriter / packages / view / src / decorators.ts View on Github external
constructor(contents: Delta) {
    this.contents = contents;
    this.change;
    this.delta = new Delta();
    this.position = 0;
  }
github typewriter-editor / typewriter / packages / modules / src / input.ts View on Github external
function onEnter(event: KeyboardEvent) {
      if (event.defaultPrevented) return;
      event.preventDefault();
      const range = editor.getSelectedRange();
      if (!range) return;
      const isCollapsed = range[0] === range[1];

      const line = getLine(editor.contents, range[0]);
      let attributes = line.attributes;
      const block = paper.blocks.findByAttributes(attributes) || paper.blocks.getDefault();
      const isDefault = block === paper.blocks.getDefault();
      const length = line.end - line.start - 1;
      const atEnd = range[1] === line.end - 1;
      if (atEnd && !isDefault && block.defaultFollows) {
        attributes = {};
      } else if (typeof block.getNextLineAttributes === 'function') {
        attributes = block.getNextLineAttributes(attributes);
      }
      const activeFormats = editor.activeFormats;
      if (!length && !isDefault && !block.defaultFollows && isCollapsed) {
        editor.formatLine(range, {}, SOURCE_USER);
      } else {
        const selection: EditorRange = [ range[0] + 1, range[0] + 1 ];
        editor.insertText(range, '\n', attributes, SOURCE_USER, selection);
github typewriter-editor / typewriter / packages / view-vdom / src / dom.ts View on Github external
oldChildren.forEach((next, i) => {
    const prev = children[children.length - 1];

    if (prev && typeof prev !== 'string' && typeof next !== 'string' && nodeMarks.get(prev) &&
      nodeMarks.get(prev) === nodeMarks.get(next) && deepEqual(prev.attributes, next.attributes))
    {
      prev.children = prev.children.concat(next.children);
    } else {
      children.push(next);
      if (prev && typeof prev !== 'string' && prev.children) {
        prev.children = mergeChildren(prev.children);
      }
    }
  });
  if (children.length) {
github typewriter-editor / typewriter / packages / view / src / decorators.ts View on Github external
line(at: number, attributes: { [name: string]: any }) {
    const line = getLines(this.contents, at, at)[0];
    if (!line) return;
    this.updatePosition(line.end - 1);
    this.delta.retain(1, { decorator: attributes });
    this.position += 1;
  }

@typewriter/editor

The core editor for typewriter. Manages the data model and updates. Can be run headless.

MIT
Latest version published 3 years ago

Package Health Score

51 / 100
Full package analysis