How to use the prosemirror-state.Plugin function in prosemirror-state

To help you get started, we’ve selected a few prosemirror-state 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 guardian / prosemirror-noting / src / js / index.ts View on Github external
setTimeout(() => {
      const pluginState: PluginState = plugin.getState(localView.state);
      // If there's already a validation in flight, defer validation
      // for another throttle tick
      if (pluginState.validationInFlight) {
        return scheduleValidation();
      }
      localView.dispatch(
        localView.state.tr.setMeta(
          VALIDATION_PLUGIN_ACTION,
          validationRequestStart()
        )
      );
    }, plugin.getState(localView.state).currentThrottle);
  };
  const plugin: Plugin = new Plugin({
    state: {
      init(_, { doc }): PluginState {
        // getValidationRangesForDocument(doc);

        // Hook up our validation events.
        validationService.on(
          ValidationEvents.VALIDATION_SUCCESS,
          (validationResponse: ValidationResponse) =>
            localView.dispatch(
              localView.state.tr.setMeta(
                VALIDATION_PLUGIN_ACTION,
                validationRequestSuccess(validationResponse)
              )
            )
        );
        validationService.on(
github ProseMirror / website / example / upload / index.js View on Github external
// placeholderPlugin{
import {Plugin} from "prosemirror-state"
import {Decoration, DecorationSet} from "prosemirror-view"

let placeholderPlugin = new Plugin({
  state: {
    init() { return DecorationSet.empty },
    apply(tr, set) {
      // Adjust decoration positions to changes made by the transaction
      set = set.map(tr.mapping, tr.doc)
      // See if the transaction adds or removes any placeholders
      let action = tr.getMeta(this)
      if (action && action.add) {
        let widget = document.createElement("placeholder")
        let deco = Decoration.widget(action.add.pos, widget, {id: action.add.id})
        set = set.add(tr.doc, [deco])
      } else if (action && action.remove) {
        set = set.remove(set.find(null, null,
                                  spec => spec.id == action.remove.id))
      }
      return set
github pubpub / pubpub-editor / packages / pubpub-prose / src / prosemirror-setup / plugins / mentionsPlugin.js View on Github external
import { Plugin } from 'prosemirror-state';
import { getPluginState } from '../plugins';
import { keys } from './pluginKeys';
import { schema } from '../schema';

const { DecorationSet, Decoration } = require('prosemirror-view');

const mentionsPlugin = new Plugin({
	state: {
		init(config, instance) {
			// const set = DecorationSet.empty;
			return { decos: DecorationSet.empty, start: null };
		},
		apply(transaction, state, prevEditorState, editorState) {

			const sel = editorState.selection;
			const updateMentions = this.spec.editorView.props.viewHandlers.updateMentions;

			if (!sel.empty) {
				updateMentions('');
				return { decos: DecorationSet.empty, start: null, };
			}

			// const doc = editorState.doc;
github ProseMirror / website / example / menu / index.js View on Github external
function menuPlugin(items) {
  return new Plugin({
    view(editorView) {
      let menuView = new MenuView(items, editorView)
      editorView.dom.parentNode.insertBefore(menuView.dom, editorView.dom)
      return menuView
    }
  })
}
// }
github ProseMirror / prosemirror-view / test / test-composition.js View on Github external
function widgets(positions, sides) {
  return new Plugin({
    state: {
      init(state) {
        let deco = positions.map((p, i) => Decoration.widget(p, () => {
          let s = document.createElement("var")
          s.textContent = "×"
          return s
        }, {side: sides[i]}))
        return DecorationSet.create(state.doc, deco)
      },
      apply(tr, deco) {
        return deco.map(tr.mapping, tr.doc)
      }
    },
    props: {
      decorations(state) { return this.getState(state) }
    }
github ifiokjr / remirror / @remirror / extension-code-block / src / code-block-plugin.ts View on Github external
export default function createCodeBlockPlugin({ extension, type }: CreateCodeBlockPluginParams) {
  const pluginState = new CodeBlockState(type);
  const handler = () => {
    pluginState.setDeleted(true);
    return false;
  };

  return new Plugin({
    key: extension.pluginKey,
    state: {
      init(_, state) {
        return pluginState.init(state);
      },
      apply(tr, _, oldState, newState) {
        return pluginState.apply({ tr, oldState, newState });
      },
    },
    props: {
      handleKeyDown: keydownHandler({
        Backspace: handler,
        'Mod-Backspace': handler,
        Delete: handler,
        'Mod-Delete': handler,
        'Ctrl-h': handler,
github scrumpy / tiptap / packages / tiptap / src / Editor.js View on Github external
},
              blur: (view, event) => {
                this.focused = false
                this.emit('blur', {
                  event,
                  state: view.state,
                  view,
                })

                const transaction = this.state.tr.setMeta('focused', false)
                this.view.dispatch(transaction)
              },
            },
          },
        }),
        new Plugin({
          props: this.options.editorProps,
        }),
      ],
    })
  }
github pubpub / pubpub-editor / src / addons / InsertMenu / InsertMenu.js View on Github external
static getPlugins({ pluginKey }) {
		return [new Plugin({
			key: pluginKey,
			state: {
				init() {
					return {
						isActive: false,
						start: 0,
						end: 0,
						positionNumber: 0,
						parentOffset: 0,
						emptyLine: false,
						substring: '',
					};
				},
				apply(transaction, state, prevEditorState, editorState) {
					const doc = editorState.doc;
					const emptyDoc = doc.childCount === 0 || (doc.childCount === 1 && doc.firstChild.isTextblock && doc.firstChild.content.size === 0);
github ifiokjr / remirror / @remirror / extension-drop-cursor / src / drop-cursor-plugin.tsx View on Github external
export function dropCursorPlugin(
  params: ExtensionManagerParams,
  extension: Extension,
) {
  const dropCursorState = new DropCursorState(params, extension);
  return new Plugin({
    key: extension.pluginKey,
    view(editorView) {
      dropCursorState.init(editorView);
      return pick(dropCursorState, ['destroy']);
    },
    state: {
      init: () => dropCursorState,
      apply: () => dropCursorState,
    },
    props: {
      decorations: () => dropCursorState.decorationSet,
      handleDOMEvents: {
        dragover: (_, event) => {
          dropCursorState.dragover(event as DragEvent);
          return false;
        },
github taktik / icure-backend / web / icure-ht / app / src / elements / prose-editor / prose-editor / prose-editor.ts View on Github external
ready() {
    super.ready()

    const proseEditor = this

    let selectionTrackingPlugin = new Plugin({
      view(view) {
        return {
          update: function (view, prevState) {
            var state = view.state;

            if (!(prevState && prevState.doc.eq(state.doc) && prevState.selection.eq(state.selection))) {
              let {$anchor, $cursor} = state.selection as TextSelection, index = $anchor.pos
              let node = state.doc.nodeAt(index)

              if (!node && !$cursor) {
                proseEditor.set('currentHeading', null)
                proseEditor.set('currentFont', null)
                proseEditor.set('currentSize', null)
                return
              }