@guardian/prosemirror-noting - npm Package Compare versions

Comparing version 3.1.3 to 3.1.4-alpha.1

.eslintrc.json

 {
-    "env": {
-        "browser": true,
-        "es6": true
-    },
-    "extends": "eslint:recommended",
-    "parserOptions": {
-        "sourceType": "module"
-    },
-    "plugins": [
-        "prettier"
-    ],
-    "rules": {
-        "prettier/prettier": "error"
-    }
-}
+  "env": {
+    "browser": true,
+    "es6": true
+  },
+  "extends": ["prettier"],
+  "plugins": ["prettier"],
+  "rules": {
+    "prettier/prettier": ["error"]
+  },
+  "parserOptions": {
+    "sourceType": "module"
+  }
+}

dist/noting.js

@@ -102,3 +102,3 @@ 'use strict';
   if (n === "Object" && o.constructor) n = o.constructor.name;
-  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Map" || n === "Set") return Array.from(n);
   if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
@@ -335,3 +335,3 @@ }
  * on their attrs) and merges their start and ends (for use with the note tracker)
- * 
+ *
  * Unlike sanitizeNode, this will not look for contiguosness when finding the
@@ -1059,10 +1059,2 @@ * notes as this helper assumes that the consuming code is not interested in
   return function (id, notePos, side) {
-    var dom = document.createElement("span"); // fixes a firefox bug that makes the decos appear selected
-
-    var content = document.createElement("span");
-    dom.appendChild(content);
-    dom.classList.add("note-".concat(id), "note-wrapper--".concat(side < 0 ? "start" : "end"), "note-wrapper--".concat(meta.type)); // This allows the user to mutate the DOM node we've just created. Consumer beware!
-
-    modifyNoteDecoration(dom, meta, side);
-    dom.dataset.toggleNoteId = id;
     var cursorAtWidgetAndInsideNote = inside && cursorPos === notePos; // If we have a cursor at the note widget position and we're inside a note,
@@ -1074,7 +1066,26 @@ // we need to ensure that other widgets don't alter its render order, so
     var sideToRender = cursorAtWidgetAndInsideNote ? side - Math.sign(side) / 2 : 0 - side;
-    return prosemirrorView.Decoration.widget(notePos, dom, {
+    var sideAdjustedForPluginPriority = sideToRender + pluginPriority / Number.MAX_SAFE_INTEGER * Math.sign(side); // A unique key for the widget. It must change to force a render
+
+    var toDom = function toDom() {
+      var element = document.createElement("span");
+      element.classList.add("note-".concat(id), "note-wrapper--".concat(side < 0 ? "start" : "end"), "note-wrapper--".concat(meta.type), // We apply this class to allow us to style the widget decoration
+      // relative to the position of the caret. Conditionally applying
+      // padding to the left or right of the widget allows us to ensure
+      // that the caret, which is actually placed in the center of the
+      // span in the space character, appears to the left or right of the
+      // widget.
+      "note-wrapper--".concat(sideToRender >= 0 ? "left" : "right"));
+      element.innerText = " "; // This allows the user to mutate the DOM node we've just created. Consumer beware!
+
+      modifyNoteDecoration(element, meta, side);
+      element.dataset.toggleNoteId = id;
+      return element;
+    };
+
+    return prosemirrorView.Decoration.widget(notePos, toDom, {
       // MAX_SAFE_INTEGER is here to order note decorations consistently across
       // plugins without imposing a (realistic) limit on the number of noting
       // plugins that can run concurrently.
-      side: sideToRender + pluginPriority / Number.MAX_SAFE_INTEGER * Math.sign(side),
+      // key,
+      side: sideAdjustedForPluginPriority,
       marks: []
@@ -1480,2 +1491,3 @@ });
     plugin: new prosemirrorState.Plugin({
+      key: new prosemirrorState.PluginKey("prosemirror-noting-".concat(noOfNoterPlugins)),
       props: {
@@ -1502,10 +1514,13 @@ decorations: noteDecorator,
     showAllNotes: showAllNotes(key),
-    toggleAllNotes: toggleAllNotes(key)
+    toggleAllNotes: toggleAllNotes(key),
+    addNote: function addNote(start, end, id) {
+      return noteTracker.addNote(start, end, undefined, id, true);
+    }
   };
 };
 
+exports.buildNoter = buildNoter;
 exports.createNoteMark = createNoteMark;
-exports.buildNoter = buildNoter;
+exports.sanitizeNode = sanitizeNode;
+exports.toggleAllNotes = toggleAllNotes;
 exports.toggleNote = toggleNote;
-exports.toggleAllNotes = toggleAllNotes;
-exports.sanitizeNode = sanitizeNode;

package.json

 {
   "name": "@guardian/prosemirror-noting",
-  "version": "3.1.3",
+  "version": "3.1.4-alpha.1",
   "description": "A plugin to allow noting in prosemirror",
@@ -17,2 +17,3 @@ "main": "dist/noting.js",
     "watch": "rollup -c -w",
+    "lint": "eslint src/js/index.js",
     "format": "prettier --write './src/**/*.js'",
@@ -26,29 +27,31 @@ "publish-pages": "git subtree push --prefix pages/dist origin gh-pages"
     "babel-jest": "^22.0.1",
-    "eslint": "^4.13.1",
-    "eslint-config-airbnb-base": "^12.1.0",
-    "eslint-plugin-import": "^2.8.0",
-    "eslint-plugin-prettier": "^2.4.0",
+    "eslint": "^6.8.0",
+    "eslint-config-airbnb-base": "^14.1.0",
+    "eslint-config-prettier": "^6.10.1",
+    "eslint-plugin-import": "^2.20.2",
+    "eslint-plugin-prettier": "^3.1.3",
     "http-server": "^0.10.0",
     "jest": "^22.0.1",
-    "prettier": "^1.9.2",
-    "prosemirror-example-setup": "^1.0.1",
-    "prosemirror-history": "^1.0.0",
-    "prosemirror-keymap": "^1.0.0",
-    "prosemirror-menu": "^1.0.1",
-    "prosemirror-model": "^1.0.1",
-    "prosemirror-schema-basic": "^1.0.0",
-    "prosemirror-test-builder": "^1.0.0",
-    "rollup": "^0.52.3",
+    "prettier": "1.19.1",
+    "prosemirror-example-setup": "^1.1.2",
+    "prosemirror-history": "^1.1.3",
+    "prosemirror-keymap": "^1.1.3",
+    "prosemirror-menu": "^1.1.4",
+    "prosemirror-model": "^1.9.1",
+    "prosemirror-schema-basic": "^1.1.2",
+    "prosemirror-test-builder": "^1.0.3",
+    "prosemirror-state": "^1.3.3",
+    "prosemirror-view": "^1.14.11",
+    "rollup": "^2.7.6",
     "rollup-plugin-babel": "^4.0.0-beta.4",
     "rollup-plugin-commonjs": "^8.2.6",
-    "rollup-plugin-eslint": "^4.0.0",
+    "rollup-plugin-eslint": "^7.0.0",
     "rollup-plugin-node-resolve": "^3.0.0",
-    "rollup-plugin-scss": "^0.4.0"
+    "rollup-plugin-scss": "^2.4.0"
   },
   "dependencies": {
-    "prosemirror-state": "^1.0.0",
-    "prosemirror-view": "^1.2.0",
     "uuid": "^3.1.0"
   },
   "jest": {
+    "testURL": "http://localhost/",
     "moduleNameMapper": {
@@ -55,0 +58,0 @@ "\\.(css|scss)$": "<rootDir>/test/mocks/style.js"

rollup.config.js

 import resolve from "rollup-plugin-node-resolve";
 import commonjs from "rollup-plugin-commonjs";
-import eslint from "rollup-plugin-eslint";
+import { eslint } from "rollup-plugin-eslint";
 import scss from "rollup-plugin-scss";
@@ -5,0 +5,0 @@ import babel from "rollup-plugin-babel";

src/js/index.js

@@ -1,2 +0,2 @@
-import { Plugin } from "prosemirror-state";
+import { Plugin, PluginKey } from "prosemirror-state";
 import { Slice } from "prosemirror-model";
@@ -135,2 +135,3 @@ import NoteTracker from "./NoteTracker";
     plugin: new Plugin({
+      key: new PluginKey(`prosemirror-noting-${noOfNoterPlugins}`),
       props: {
@@ -150,3 +151,5 @@ decorations: noteDecorator,
     showAllNotes: showAllNotes(key),
-    toggleAllNotes: toggleAllNotes(key)
+    toggleAllNotes: toggleAllNotes(key),
+    addNote: (start, end, id) =>
+      noteTracker.addNote(start, end, undefined, id, true)
   };
@@ -153,0 +156,0 @@ };

src/js/utils/DecorationUtils.js

@@ -10,16 +10,2 @@ import { DecorationSet, Decoration } from "prosemirror-view";
 ) => (id, notePos, side) => {
-  const dom = document.createElement("span");
-
-  // fixes a firefox bug that makes the decos appear selected
-  const content = document.createElement("span");
-  dom.appendChild(content);
-
-  dom.classList.add(
-    `note-${id}`,
-    `note-wrapper--${side < 0 ? "start" : "end"}`,
-    `note-wrapper--${meta.type}`
-  );
-  // This allows the user to mutate the DOM node we've just created. Consumer beware!
-  modifyNoteDecoration(dom, meta, side);
-  dom.dataset.toggleNoteId = id;
   const cursorAtWidgetAndInsideNote = inside && cursorPos === notePos;
@@ -33,8 +19,37 @@ // If we have a cursor at the note widget position and we're inside a note,
     : 0 - side;
-  return Decoration.widget(notePos, dom, {
+  const sideAdjustedForPluginPriority =
+    sideToRender + (pluginPriority / Number.MAX_SAFE_INTEGER) * Math.sign(side);
+
+  // A unique key for the widget. It must change to force a render
+  // every time we'd like the cursor behaviour to change.
+  const key = `${id}-${sideAdjustedForPluginPriority}`;
+
+  const toDom = () => {
+    const element = document.createElement("span");
+    element.classList.add(
+      `note-${id}`,
+      `note-wrapper--${side < 0 ? "start" : "end"}`,
+      `note-wrapper--${meta.type}`,
+      // We apply this class to allow us to style the widget decoration
+      // relative to the position of the caret. Conditionally applying
+      // padding to the left or right of the widget allows us to ensure
+      // that the caret, which is actually placed in the center of the
+      // span in the space character, appears to the left or right of the
+      // widget.
+      `note-wrapper--${sideToRender >= 0 ? "left" : "right"}`
+    );
+    element.innerText = " ";
+
+    // This allows the user to mutate the DOM node we've just created. Consumer beware!
+    modifyNoteDecoration(element, meta, side);
+    element.dataset.toggleNoteId = id;
+    return element;
+  };
+
+  return Decoration.widget(notePos, toDom, {
     // MAX_SAFE_INTEGER is here to order note decorations consistently across
     // plugins without imposing a (realistic) limit on the number of noting
     // plugins that can run concurrently.
-    side:
-      sideToRender + pluginPriority / Number.MAX_SAFE_INTEGER * Math.sign(side),
+    // key,
+    side: sideAdjustedForPluginPriority,
     marks: []
@@ -41,0 +56,0 @@ });

src/js/utils/StateUtils.js

@@ -118,3 +118,3 @@ import { AllSelection } from "prosemirror-state";
  * on their attrs) and merges their start and ends (for use with the note tracker)
- * 
+ *
  * Unlike sanitizeNode, this will not look for contiguosness when finding the
@@ -121,0 +121,0 @@ * notes as this helper assumes that the consuming code is not interested in

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

271863

increased by0.98%

Dependency count

1

decreased by-66.67%

Lines of code

2494

increased by1.18%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Dev dependency count

27

increased by12.5%

Number of package files

22

decreased by-4.35%

Number of low quality alerts

2

increased by100%

Dependency changes

• - Removedprosemirror-state@^1.0.0

• - Removedprosemirror-view@^1.2.0

• - Removedorderedmap@2.1.1(transitive)

• - Removedprosemirror-model@1.24.1(transitive)

• - Removedprosemirror-state@1.4.3(transitive)

• - Removedprosemirror-transform@1.10.2(transitive)

• - Removedprosemirror-view@1.38.0(transitive)