How to use the slate.Range.create function in slate

To help you get started, we’ve selected a few slate 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 FabricLabs / fabric / src / components / views / rooms / MessageComposerInput.js View on Github external
editorState = change.value;
                }
            }
        }

        // emojioneify any emoji
        let foundEmoji;
        do {
            foundEmoji = false;

            for (const node of editorState.document.getTexts()) {
                if (node.text !== '' && HtmlUtils.containsEmoji(node.text)) {
                    let match;
                    EMOJI_REGEX.lastIndex = 0;
                    while ((match = EMOJI_REGEX.exec(node.text)) !== null) {
                        const range = Range.create({
                            anchor: {
                                key: node.key,
                                offset: match.index,
                            },
                            focus: {
                                key: node.key,
                                offset: match.index + match[0].length,
                            },
                        });
                        const inline = Inline.create({
                            type: 'emoji',
                            data: { emojiUnicode: match[0] },
                        });
                        change = change.insertInlineAtRange(range, inline);
                        editorState = change.value;
github Canner / canner-slate-editor / packages / changes / block-quote / src / __tests__ / transform.js View on Github external
export default change => {
  const { document } = change.value;
  const first = document.getFirstText();
  const range = Range.create({
    anchorKey: first.key,
    anchorOffset: 4,
    focusKey: first.key,
    focusOffset: 7
  });

  const nextChange = change.select(range);

  return blockquote(nextChange);
};
github grafana / grafana / packages / grafana-ui / src / slate-plugins / indentation.ts View on Github external
const textKey = block.getFirstText()!.key;

      const rangeProperties: RangeJSON = {
        anchor: {
          key: textKey,
          offset: blockWhitespace,
          path: [],
        },
        focus: {
          key: textKey,
          offset: blockWhitespace,
          path: [],
        },
      };

      editor.deleteBackwardAtRange(SlateRange.create(rangeProperties), Math.min(SLATE_TAB.length, blockWhitespace));
    }
  } else {
    const { startText } = editor.value;
    const textBeforeCaret = startText.text.slice(0, curSelection.start.offset);
    const isWhiteSpace = /^\s*$/.test(textBeforeCaret);

    for (const block of selectedBlocks) {
      editor.insertTextByKey(block.getFirstText()!.key, 0, SLATE_TAB);
    }

    if (isWhiteSpace) {
      editor.moveStartBackward(SLATE_TAB.length);
    }
  }
};
github Canner / canner-slate-editor / packages / plugins / markdown / src / match / link.js View on Github external
export default function(
  type: string,
  currentTextNode: Node,
  matched: any,
  change: Change
) {
  const matchedLength = matched[0].length;

  return change
    .deleteAtRange(
      Range.create({
        anchorKey: currentTextNode.key,
        focusKey: currentTextNode.key,
        anchorOffset: matched.index,
        focusOffset: matched.index + matchedLength + 1
      })
    )
    .insertText(matched[1])
    .extend(0 - matched[1].length)
    .wrapInline({
      type,
      data: { href: matched[2] }
    })
    .collapseToEnd();
}
github letterpad / letterpad / admin / features / article / editor / plugins / markdown / match / blockquote.js View on Github external
export default (type, currentTextNode, matched, change) => {
  const matchedLength = matched[0].length;
  return change.setBlocks(type).deleteAtRange(
    Range.create({
      anchorKey: currentTextNode.key,
      focusKey: currentTextNode.key,
      anchorOffset: matched.index,
      focusOffset: matched.index + matchedLength,
    }),
  );
};
github letterpad / letterpad / admin / features / article / editor / plugins / markdown / match / boldItalic.js View on Github external
export default (type, currentTextNode, matched, change) => {
  const matchedLength = matched[0].length;
  const reg = matched[1] === "***" ? /\*\*\*/ : matched[1];
  const addText = matched[0].trim().replace(new RegExp(reg, "g"), "");

  return change
    .deleteAtRange(
      Range.create({
        anchorKey: currentTextNode.key,
        focusKey: currentTextNode.key,
        anchorOffset: matched.index,
        focusOffset: matched.index + matchedLength,
      }),
    )
    .insertTextByKey(currentTextNode.key, matched.index, addText, [
      Mark.create({ type: "bold" }),
      Mark.create({ type: "italic" }),
    ])
    .call(trailingSpace, currentTextNode, matched.index)
    .call(removeAllMark);
};
github Canner / canner-slate-editor / packages / plugins / markdown / src / match / boldItalic.js View on Github external
export default function(
  options: any,
  currentTextNode: Text,
  matched: any,
  change: Change
) {
  const matchedLength = matched[0].length;
  const reg = matched[1] === "***" ? /\*\*\*/ : matched[1];
  const addText = matched[0].trim().replace(new RegExp(reg, "g"), "");

  return change
    .deleteAtRange(
      Range.create({
        anchorKey: currentTextNode.key,
        focusKey: currentTextNode.key,
        anchorOffset: matched.index,
        focusOffset: matched.index + matchedLength
      })
    )
    .insertTextByKey(currentTextNode.key, matched.index, addText, [
      Mark.create({ type: options.BOLD }),
      Mark.create({ type: options.ITALIC })
    ])
    .call(removeAllMark);
}
github letterpad / letterpad / admin / features / article / editor / plugins / markdown / match / header.js View on Github external
export default (type, currentTextNode, matched, change) => {
  const matchedLength = matched[0].length;
  const count = (matched[0].match(/#/g) || []).length;
  let header;

  if (count === 1) header = "heading_one";
  else if (count === 2) header = "heading_two";
  else if (count === 3) header = "heading_three";
  else if (count === 4) header = "heading_four";
  else if (count === 5) header = "heading_five";
  else if (count === 6) header = "heading_six";
  else return;

  return change.setBlocks(header).deleteAtRange(
    Range.create({
      anchorKey: currentTextNode.key,
      focusKey: currentTextNode.key,
      anchorOffset: matched.index,
      focusOffset: matched.index + matchedLength,
    }),
  );
};
github letterpad / letterpad / admin / features / article / editor / plugins / markdown / match / code.js View on Github external
export default (type, currentTextNode, matched, change) => {
  const matchedLength = matched[0].length;
  const addText = matched[0].trim().replace(new RegExp(matched[1], "g"), "");
  return change
    .deleteAtRange(
      Range.create({
        anchorKey: currentTextNode.key,
        anchorOffset: matched.index,
        focusKey: currentTextNode.key,
        focusOffset: matched.index + matchedLength,
        isBackward: false,
      }),
    )
    .insertTextByKey(currentTextNode.key, matched.index, addText, [
      Mark.create({ type }),
    ])
    .call(trailingSpace, currentTextNode, matched.index)
    .call(removeAllMark);
};
github edtr-io / edtr-io / packages / plugin-text / src / factory / editor.tsx View on Github external
mergeWithNext(next => {
        const value = Value.fromJSON(next)
        const selection = CoreRange.create(editor.value.selection)
        editor
          .insertFragmentAtRange(selection, value.document)
          .select(selection)
      })
      return