y-prosemirror - npm Package Compare versions

Comparing version 1.0.15 to 1.0.16

dist/src/plugins/cursor-plugin.d.ts

@@ -1,8 +0,9 @@
-export function defaultCursorBuilder(user: any): HTMLSpanElement;
-export function createDecorations(state: any, awareness: Awareness, createCursor: any): any;
-export function yCursorPlugin(awareness: Awareness, { cursorBuilder, getSelection }?: {
+export function defaultCursorBuilder(user: any): HTMLElement;
+export function defaultSelectionBuilder(user: any): import('prosemirror-view').DecorationAttrs;
+export function createDecorations(state: any, awareness: Awareness, createCursor: any, createSelection: any): any;
+export function yCursorPlugin(awareness: Awareness, { cursorBuilder, selectionBuilder, getSelection }?: {
     cursorBuilder: (arg0: any) => HTMLElement;
+    selectionBuilder: (arg0: any) => import('prosemirror-view').DecorationAttrs;
     getSelection: (arg0: any) => any;
-    cursorStateField: string;
 }, cursorStateField?: string): any;
 import { Awareness } from "y-protocols/awareness";

dist/src/plugins/sync-plugin.d.ts

@@ -21,2 +21,3 @@ export function isVisible(item: Y.Item, snapshot?: Y.Snapshot): boolean;
     mux: import("lib0/mutex").mutex;
+    isDestroyed: boolean;
     /**
@@ -41,2 +42,8 @@ * @type {ProsemirrorMapping}
     _domSelectionInView: boolean;
+    /**
+     * Create a transaction for changing the prosemirror state.
+     *
+     * @returns
+     */
+    get _tr(): any;
     _isLocalCursorInView(): boolean;
@@ -54,6 +61,6 @@ _isDomSelectionInView(): boolean;
     /**
-     * @param {Array<Y.YEvent>} events
+     * @param {Array<Y.YEvent<any>>} events
      * @param {Y.Transaction} transaction
      */
-    _typeChanged(events: Array<Y.YEvent>, transaction: Y.Transaction): void;
+    _typeChanged(events: Array<Y.YEvent<any>>, transaction: Y.Transaction): void;
     _prosemirrorChanged(doc: any): void;
@@ -60,0 +67,0 @@ destroy(): void;

package.json

 {
   "name": "y-prosemirror",
-  "version": "1.0.15",
+  "version": "1.0.16",
   "description": "Prosemirror bindings for Yjs",
@@ -31,2 +31,3 @@ "main": "./dist/y-prosemirror.cjs",
     "dist/*",
+    "!dist/test.*",
     "src/*"
@@ -81,4 +82,4 @@ ],
     "y-webrtc": "^10.2.0",
-    "yjs": "^13.5.20"
+    "yjs": "^13.5.32"
   }
 }

src/lib.js

@@ -1,2 +0,3 @@
-import { updateYFragment} from './plugins/sync-plugin.js' // eslint-disable-line
+import { updateYFragment } from './plugins/sync-plugin.js' // eslint-disable-line
+import { ySyncPluginKey } from './plugins/keys.js'
 import * as Y from 'yjs'
@@ -27,6 +28,10 @@ import { EditorView } from 'prosemirror-view' // eslint-disable-line
     const tr = view.state.tr
-    metas.forEach((val, key) => {
-      tr.setMeta(key, val)
-    })
-    view.dispatch(tr)
+    const syncState = ySyncPluginKey.getState(view.state)
+    console.log('testing what I wanted to test. lol', syncState)
+    if (syncState.binding && !syncState.binding.isDestroyed) {
+      metas.forEach((val, key) => {
+        tr.setMeta(key, val)
+      })
+      view.dispatch(tr)
+    }
   })
@@ -33,0 +38,0 @@ }

src/plugins/cursor-plugin.js

@@ -15,3 +15,3 @@
  * @param {any} user user data
- * @return HTMLElement
+ * @return {HTMLElement}
  */
@@ -29,2 +29,15 @@ export const defaultCursorBuilder = user => {
 
+/**
+ * Default generator for the selection attributes
+ *
+ * @param {any} user user data
+ * @return {import('prosemirror-view').DecorationAttrs}
+ */
+export const defaultSelectionBuilder = user => {
+  return {
+    style: `background-color: ${user.color}70`,
+    class: `ProseMirror-yjs-selection`
+  }
+}
+
 const rxValidColor = /^#[0-9a-fA-F]{6}$/
@@ -37,3 +50,3 @@
  */
-export const createDecorations = (state, awareness, createCursor) => {
+export const createDecorations = (state, awareness, createCursor, createSelection) => {
   const ystate = ySyncPluginKey.getState(state)
@@ -70,3 +83,3 @@ const y = ystate.doc
         const to = math.max(anchor, head)
-        decorations.push(Decoration.inline(from, to, { style: `background-color: ${user.color}70` }, { inclusiveEnd: true, inclusiveStart: false }))
+        decorations.push(Decoration.inline(from, to, createSelection(user), { inclusiveEnd: true, inclusiveStart: false }))
       }
@@ -86,11 +99,12 @@ }
  * @param {function(any):HTMLElement} [opts.cursorBuilder]
+ * @param {function(any):import('prosemirror-view').DecorationAttrs} [opts.selectionBuilder]
  * @param {function(any):any} [opts.getSelection]
- * @param {string} [opts.cursorStateField] By default all editor bindings use the awareness 'cursor' field to propagate cursor information.
+ * @param {string} [cursorStateField] By default all editor bindings use the awareness 'cursor' field to propagate cursor information.
  * @return {any}
  */
-export const yCursorPlugin = (awareness, { cursorBuilder = defaultCursorBuilder, getSelection = state => state.selection } = {}, cursorStateField = 'cursor') => new Plugin({
+export const yCursorPlugin = (awareness, { cursorBuilder = defaultCursorBuilder, selectionBuilder = defaultSelectionBuilder, getSelection = state => state.selection } = {}, cursorStateField = 'cursor') => new Plugin({
   key: yCursorPluginKey,
   state: {
     init (_, state) {
-      return createDecorations(state, awareness, cursorBuilder)
+      return createDecorations(state, awareness, cursorBuilder, selectionBuilder)
     },
@@ -101,3 +115,3 @@ apply (tr, prevState, oldState, newState) {
       if ((ystate && ystate.isChangeOrigin) || (yCursorState && yCursorState.awarenessUpdated)) {
-        return createDecorations(newState, awareness, cursorBuilder)
+        return createDecorations(newState, awareness, cursorBuilder, selectionBuilder)
       }
@@ -104,0 +118,0 @@ return prevState.map(tr.mapping, tr.doc)

src/plugins/sync-plugin.js

@@ -19,2 +19,3 @@ /**
 import * as dom from 'lib0/dom'
+import * as eventloop from 'lib0/eventloop'
 
@@ -29,3 +30,3 @@ /**
  * Either a node if type is YXmlElement or an Array of text nodes if YXmlText
- * @typedef {Map<Y.AbstractType, PModel.Node | Array<PModel.Node>>} ProsemirrorMapping
+ * @typedef {Map<Y.AbstractType<any>, PModel.Node | Array<PModel.Node>>} ProsemirrorMapping
  */
@@ -80,2 +81,3 @@
   let changedInitialContent = false
+  let rerenderTimeoutId
   const plugin = new Plugin({
@@ -116,3 +118,6 @@ props: {
             // snapshot changed, rerender next
-            setTimeout(() => {
+            eventloop.timeout(0, () => {
+              if (pluginState.binding == null || pluginState.binding.isDestroyed) {
+                return
+              }
               if (change.restore == null) {
@@ -128,3 +133,3 @@ pluginState.binding._renderSnapshot(change.snapshot, change.prevSnapshot, pluginState)
               }
-            }, 0)
+            })
           }
@@ -137,7 +142,10 @@ }
       const binding = new ProsemirrorBinding(yXmlFragment, view)
+      if (rerenderTimeoutId != null) {
+        clearTimeout(rerenderTimeoutId)
+      }
       // Make sure this is called in a separate context
-      setTimeout(() => {
+      rerenderTimeoutId = eventloop.timeout(0, () => {
         binding._forceRerender()
         view.dispatch(view.state.tr.setMeta(ySyncPluginKey, { binding }))
-      }, 0)
+      })
       return {
@@ -154,2 +162,3 @@ update: () => {
         destroy: () => {
+          clearTimeout(rerenderTimeoutId)
           binding.destroy()
@@ -197,2 +206,3 @@ }
     this.mux = createMutex()
+    this.isDestroyed = false
     /**
@@ -228,2 +238,11 @@ * @type {ProsemirrorMapping}
 
+  /**
+   * Create a transaction for changing the prosemirror state.
+   *
+   * @returns
+   */
+  get _tr () {
+    return this.prosemirrorView.state.tr.setMeta('addToHistory', false)
+  }
+
   _isLocalCursorInView () {
@@ -233,5 +252,5 @@ if (!this.prosemirrorView.hasFocus()) return false
       // Calculate the domSelectionInView and clear by next tick after all events are finished
-      setTimeout(() => {
+      eventloop.timeout(0, () => {
         this._domSelectionInView = null
-      }, 0)
+      })
       this._domSelectionInView = this._isDomSelectionInView()
@@ -272,3 +291,3 @@ }
     }
-    this.prosemirrorView.dispatch(this.prosemirrorView.state.tr.setMeta(ySyncPluginKey, { snapshot, prevSnapshot }))
+    this.prosemirrorView.dispatch(this._tr.setMeta(ySyncPluginKey, { snapshot, prevSnapshot }))
   }
@@ -281,3 +300,3 @@
       // @ts-ignore
-      const tr = this.prosemirrorView.state.tr.replace(0, this.prosemirrorView.state.doc.content.size, new PModel.Slice(new PModel.Fragment(fragmentContent), 0, 0))
+      const tr = this._tr.replace(0, this.prosemirrorView.state.doc.content.size, new PModel.Slice(new PModel.Fragment(fragmentContent), 0, 0))
       tr.setMeta(ySyncPluginKey, { snapshot: null, prevSnapshot: null })
@@ -293,3 +312,3 @@ this.prosemirrorView.dispatch(tr)
       // @ts-ignore
-      const tr = this.prosemirrorView.state.tr.replace(0, this.prosemirrorView.state.doc.content.size, new PModel.Slice(new PModel.Fragment(fragmentContent), 0, 0))
+      const tr = this._tr.replace(0, this.prosemirrorView.state.doc.content.size, new PModel.Slice(new PModel.Fragment(fragmentContent), 0, 0))
       this.prosemirrorView.dispatch(tr.setMeta(ySyncPluginKey, { isChangeOrigin: true }))
@@ -339,3 +358,3 @@ })
         // @ts-ignore
-        const tr = this.prosemirrorView.state.tr.replace(0, this.prosemirrorView.state.doc.content.size, new PModel.Slice(new PModel.Fragment(fragmentContent), 0, 0))
+        const tr = this._tr.replace(0, this.prosemirrorView.state.doc.content.size, new PModel.Slice(new PModel.Fragment(fragmentContent), 0, 0))
         this.prosemirrorView.dispatch(tr.setMeta(ySyncPluginKey, { isChangeOrigin: true }))
@@ -347,3 +366,3 @@ }, ySyncPluginKey)
   /**
-   * @param {Array<Y.YEvent>} events
+   * @param {Array<Y.YEvent<any>>} events
    * @param {Y.Transaction} transaction
@@ -361,3 +380,3 @@ */
        * @param {any} _
-       * @param {Y.AbstractType} type
+       * @param {Y.AbstractType<any>} type
        */
@@ -370,3 +389,3 @@ const delType = (_, type) => this.mapping.delete(type)
       // @ts-ignore
-      let tr = this.prosemirrorView.state.tr.replace(0, this.prosemirrorView.state.doc.content.size, new PModel.Slice(new PModel.Fragment(fragmentContent), 0, 0))
+      let tr = this._tr.replace(0, this.prosemirrorView.state.doc.content.size, new PModel.Slice(new PModel.Fragment(fragmentContent), 0, 0))
       restoreRelativeSelection(tr, this.beforeTransactionSelection, this)
@@ -391,2 +410,3 @@ tr = tr.setMeta(ySyncPluginKey, { isChangeOrigin: true })
   destroy () {
+    this.isDestroyed = true
     this.type.unobserveDeep(this._observeFunction)
@@ -393,0 +413,0 @@ this.doc.off('beforeAllTransactions', this.beforeAllTransactions)

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

Filesystem access

Supply chain risk

Accesses the file system, and could potentially read sensitive data.

Found 1 instance in 1 package

Improved metrics

Number of low supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

217111

decreased by-94.56%

Number of package files

17

decreased by-19.05%

Lines of code

2927

decreased by-92.37%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes