slate#Location TypeScript Examples

The following examples show how to use slate#Location. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: runtime-util.ts    From slate-vue with MIT License 7 votes vote down vote up
Transforms = (() => {
  const {select} = SlateTransforms
  SlateTransforms.select = (editor: Editor, target: Location) => {
    if(isVueObject(target)) {
      target = clone(target)
    }
    return select(editor, target)
  }
  return SlateTransforms
})()
Example #2
Source File: runtime-util.ts    From slate-vue with MIT License 7 votes vote down vote up
Transforms = (() => {
  const {select} = SlateTransforms
  SlateTransforms.select = (editor: Editor, target: Location) => {
    if(isVueObject(target)) {
      target = clone(target)
    }
    return select(editor, target)
  }
  return SlateTransforms
})()
Example #3
Source File: Editor.tsx    From react-editor-kit with MIT License 6 votes vote down vote up
handleKeyUp = (
  event: React.KeyboardEvent<HTMLDivElement>,
  plugins: Plugin[],
  state: EditorState
) => {
  const { editor } = state;
  const { selection } = editor;
  if (!selection) {
    return;
  }
  const [, path] = SlateEditor.node(editor, selection as Location);
  if (!path.length) {
    return;
  }
  const [parent] = SlateEditor.parent(editor, path);
  if (parent) {
    for (let plugin of plugins) {
      if (plugin.triggers) {
        for (let trigger of plugin.triggers) {
          const matches = findMatches(trigger.pattern, editor, trigger.range);
          if (matches.length) {
            event.preventDefault();
            if (trigger.clear == undefined || trigger.clear) {
              const range = matches[0].range;
              Transforms.delete(editor, { at: range });
            }
            if (trigger.onMatch) {
              trigger.onMatch(state, matches, plugin);
            } else if (plugin.actions) {
              //If onMatch is not set then execute the default PluginAction
              plugin.actions[0].action(state, plugin, { matches });
            }
          }
        }
      }
    }
  }
}
Example #4
Source File: block-cards.plugin.ts    From slate-angular with MIT License 6 votes vote down vote up
insertParagraph = (editor: Editor, at: Location) => {
    Transforms.insertNodes(editor, {
        type: 'paragraph',
        children: [
            {
                text: ''
            }
        ]
    }, { at });
}
Example #5
Source File: ImagePlugin.d.ts    From react-editor-kit with MIT License 5 votes vote down vote up
insertImage: (editor: ReactEditor, url: string, location?: Location | undefined) => void
Example #6
Source File: ImagePlugin.tsx    From react-editor-kit with MIT License 5 votes vote down vote up
insertImage = (
  editor: ReactEditor,
  url: string,
  location: Location | undefined = undefined
) => {
  const image = { type: "image", url, children: [{ text: "" }] };
  Transforms.insertNodes(editor, image, { at: location });
}